diff --git a/app/static/index.html b/app/static/index.html
index c5737c3..65f004d 100644
--- a/app/static/index.html
+++ b/app/static/index.html
@@ -2,7 +2,7 @@
-
+
OSINT//DASHBOARD — Global Situational Awareness Terminal
@@ -155,7 +155,9 @@
/* ═══════════════ STAGE / VIEWS ═══════════════ */
.stage {
+ /* 100vh first for old browsers; 100dvh shrinks with mobile URL chrome */
height: calc(100vh - var(--topbar-h) - var(--dock-h));
+ height: calc(100dvh - var(--topbar-h) - var(--dock-h) - env(safe-area-inset-bottom, 0px));
position: relative;
}
.stage.scroll { overflow-y: auto; }
@@ -382,7 +384,7 @@
/* ── Sub-views (News / Events / Alerts / ... ) ── */
.subview {
- padding: 1.2rem clamp(1rem, 3vw, 2rem) 2.2rem;
+ padding: 1.2rem clamp(1rem, 3vw, 2rem) calc(var(--dock-h) + 1.5rem);
max-width: 1280px; margin: 0 auto;
}
.subview > h2 {
@@ -488,7 +490,7 @@
.key-status { font-size: 0.68rem; font-family: 'Share Tech Mono', monospace; padding: 0.18rem 0.55rem; border-radius: 3px; white-space: nowrap; }
.key-status.set { background: rgba(83,240,165,0.1); color: var(--green); box-shadow: 0 0 10px rgba(83,240,165,0.3); }
.key-status.missing { background: rgba(255,93,93,0.1); color: var(--red); box-shadow: 0 0 10px rgba(255,93,93,0.2); }
- .key-desc { font-size: 0.8rem; color: var(--muted); margin-bottom: 0.7rem; }
+ .key-desc { font-size: 0.8rem; color: var(--muted); margin-bottom: 0.7rem; overflow-wrap: anywhere; }
.key-hint { font-size: 0.7rem; color: var(--muted); opacity: 0.8; margin-top: 0.15rem; font-family: 'Share Tech Mono', monospace; }
.key-form { display: flex; gap: 0.5rem; }
.key-form input { flex: 1; background: var(--bg-0); border: 1px solid var(--line); border-radius: 4px; padding: 0.5rem 0.6rem; color: var(--text); font-size: 0.82rem; font-family: 'Share Tech Mono', monospace; }
@@ -523,6 +525,8 @@
.dock {
position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
height: var(--dock-h); display: flex; flex-direction: column;
+ padding-bottom: env(safe-area-inset-bottom, 0px);
+ box-sizing: content-box;
border-top: 1px solid var(--line);
background: linear-gradient(180deg, var(--bg-1), #050a13);
box-shadow: 0 -6px 30px rgba(0,0,0,0.5);
@@ -605,6 +609,16 @@
.tick-tag { display: none; }
.hud-chips { display: none; }
.map-hint { max-width: 80%; }
+ .key-grid { grid-template-columns: minmax(0, 1fr); }
+ .key-card { min-width: 0; overflow: hidden; }
+ .key-form { flex-wrap: wrap; }
+ .key-form input {
+ flex: 1 1 100%;
+ width: 100%;
+ min-width: 0;
+ min-height: 44px;
+ }
+ .key-form .btn { min-height: 44px; min-width: 44px; }
}
@media (prefers-reduced-motion: reduce) {
.tick-track { animation: none; }