:root {
 color-scheme:dark;
 accent-color:var(--amber-hi);
 --screen:#0a0d0c;
 --screen-lit:#0f1513;
 --amber:#d99548;
 --amber-hi:#ffb75c;
 --phos:#7fd6a8;
 --red:#e2564a;
 --ink:#ddd8cc;
 --ink-soft:#8f8a7f;
 --ink-faint:#5a564f;
 --rule:#222a27;
 --mono:ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Mono", Menlo, Consolas, monospace;
 --text-face:var(--mono);
}
/* Plain application shell. No chassis assets or device geometry. */
* { box-sizing:border-box; }
html,body { margin:0; color:var(--ink); background:var(--screen); font:16px var(--mono); -webkit-text-size-adjust:100%; }
body.themed { height:100dvh; overflow:hidden; }
#app { height:100%; display:flex; flex-direction:column; max-width:1440px; margin:auto; }
.screen { flex:1; min-height:0; position:relative; display:flex; flex-direction:column; background:var(--screen); }
.topbar { display:flex; align-items:center; gap:12px; padding:8px 16px; border-bottom:1px solid var(--rule); }
.ident { flex:1; }
.ident span { display:block; }
.brand { font-size:.7rem; letter-spacing:.1em; color:var(--amber); }
.sub,.sig { font-size:.65rem; color:var(--ink-soft); }
.railstat { display:none; }
.appbar { display:flex; gap:12px; align-items:center; min-height:48px; padding:0 16px; border-bottom:1px solid var(--rule); }
.grow { flex:1; }
.iconbtn { border:1px solid var(--rule); background:transparent; color:var(--amber); border-radius:4px; }
.iconbtn[hidden] { display:none; }
.pane { display:flex; flex-direction:column; flex:1; min-height:0; }
.scroll { padding:16px; overflow:auto; flex:1; min-height:0; }
.stream { display:flex; flex-direction:column; }
.msg { margin-bottom:20px; }
.who { font-size:.65rem; color:var(--ink-soft); margin-bottom:6px; }
.bubble { font:.9rem/1.6 var(--text-face); overflow-wrap:anywhere; }
.msg.me { text-align:right; }
.msg.me .bubble { display:inline-block; padding:8px 12px; background:var(--screen-lit); border:1px solid var(--rule); }
.composer { display:flex; flex:none; padding:8px; gap:8px; border-top:1px solid var(--rule); }
.composer textarea { flex:1; resize:none; max-height:84px; height:48px; padding:8px; border:1px solid var(--ink-soft); border-radius:4px; color:var(--ink); background:var(--screen-lit); }
.composer textarea:focus { border-color:var(--amber-hi); }
.dock { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); flex:none; gap:4px; border-top:1px solid var(--rule); padding:8px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)); background:var(--screen-lit); }
.dock button { min-width:44px; min-height:52px; padding:6px 2px; border:1px solid var(--rule); border-radius:4px; background:transparent; color:var(--ink-soft); font:.75rem var(--mono); }
.dock .ico { display:block; font-size:18px; }
.dock .on { color:var(--amber-hi); border-color:var(--amber); }
:focus-visible { outline:2px solid var(--amber-hi); outline-offset:2px; }
@media(max-width:760px) {
 .dock { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .topbar { gap:8px; padding:6px 10px; }
 .pet { display:none; }
 .ident .sub { font-size:.55rem; }
}
@media(max-width:760px),(max-height:620px) {
 body.composing .screen { position:fixed; left:0; top:var(--vv-top,0px); width:100vw; height:min(var(--vv-height,100dvh),100dvh); z-index:5; }
 body.composing .dock { display:none; }
 body.composing .composer textarea { max-height:40dvh; }
}