From 2d8cf00c3b81b337d094d8929a66dab6fb447758 Mon Sep 17 00:00:00 2001
From: Anton Volnuhin <anton@volnuhin.com>
Date: Sat, 7 Feb 2026 23:42:07 +0300
Subject: [PATCH] Narrower donut container and safe-area side padding for
 landscape phones

- Chart wrapper 52% (was 58%) for visual separation from details box
- Container padding 20px + safe-area-inset on both sides to clear
  Dynamic Island in landscape
- Details box right offset includes safe-area-inset-right

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 styles.css | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/styles.css b/styles.css
index d23d993..10dfd76 100644
--- a/styles.css
+++ b/styles.css
@@ -747,8 +747,13 @@ body {
         display: none;
     }
 
+    .container {
+        padding-left: calc(20px + env(safe-area-inset-left));
+        padding-right: calc(20px + env(safe-area-inset-right));
+    }
+
     .chart-wrapper {
-        width: 58%;
+        width: 52%;
         height: calc(100dvh - 50px);
     }
 
@@ -756,7 +761,7 @@ body {
         width: 40vw;
         padding: 10px;
         max-height: calc(100dvh - 50px);
-        right: 4px;
+        right: calc(4px + env(safe-area-inset-right));
     }
 
     .details-header {