/* Host-side chrome around the ported app: the PIN gate, the offline banner,
   the update notice, the standalone-PWA safe areas. app.css stays untouched. */
.top{padding-top:env(safe-area-inset-top)}
#offline,#update{position:sticky;top:0;z-index:40;padding:8px 16px;font-size:13px;font-weight:600;text-align:center;display:flex;justify-content:center;align-items:center;gap:12px}
#offline{background:var(--warn-soft);color:var(--warn);border-bottom:1px solid var(--warn)}
#update{background:var(--accent-soft);color:var(--accent);border-bottom:1px solid var(--accent)}
#offline[hidden]{display:none}
.me strong{color:var(--ink)}
#pin{position:fixed;inset:0;z-index:100;background:var(--ground);display:flex;align-items:center;justify-content:center;padding:24px;padding-top:calc(24px + env(safe-area-inset-top))}
.pin-box{background:var(--surface);border:1px solid var(--line2);border-radius:var(--r);box-shadow:var(--shadow);padding:28px 24px;width:min(360px,100%);display:flex;flex-direction:column;gap:16px;align-items:center}
.pin-box h1{font-size:18px}
#pin-input{width:100%;text-align:center;font:600 28px/1.2 var(--mono);letter-spacing:.35em;padding:12px 8px 12px calc(8px + .35em);border:1px solid var(--line);border-radius:var(--rs);background:var(--surface2);color:var(--ink)}
.pin-err{min-height:18px;font-size:13px;color:var(--crit);font-weight:600}
.shake{animation:pin-shake .35s}
@keyframes pin-shake{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
/* presentations (#250) in the drawer */
.files{display:flex;flex-direction:column;gap:6px}
.files .file{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line2);border-radius:var(--rs);background:var(--surface2);color:var(--ink);text-decoration:none;min-width:0}
.files .file:hover{border-color:var(--ink)}
.files .fi{font-family:var(--mono);font-size:11px;font-weight:600;padding:2px 6px;border-radius:4px;background:var(--accent-soft);color:var(--accent);flex:none}
.files .fn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.files .fs{font-size:11px;white-space:nowrap;flex:none}
