/* Scoped to the shared device decision; desktop selectors and geometry stay native. */
.phone-mode .story-desktop-tag { display:none !important; }
.phone-mode .phone-invitation { position:fixed; z-index:110; left:16px; right:16px; bottom:calc(96px + env(safe-area-inset-bottom,0px)); display:flex; align-items:flex-start; gap:12px; padding:18px; border:1px solid rgba(228,199,158,.25); border-radius:4px; color:#ebe6dc; background:#121318; box-shadow:0 16px 36px -20px rgba(24,16,6,.65),0 0 24px -18px rgba(228,199,158,.5); }
.phone-invitation strong { display:block; width:100%; font:500 20px/1.25 var(--display); margin-bottom:10px; }
.phone-invitation p { font:400 13px/1.5 var(--sans); }
.phone-invitation .phone-invitation-note { margin-top:6px; color:#bcb8b1; font-size:12px; }
.phone-invitation button { flex:none; min-width:52px; min-height:44px; padding:8px; color:#e4c79e; font:500 10px/1.3 var(--mono); border:1px solid rgba(228,199,158,.3); border-radius:3px; transition:transform .16s ease,background-color .16s ease; }
.phone-invitation button span { display:block; margin-top:4px; font:20px/1 var(--sans); }
.phone-invitation button:hover { background:rgba(228,199,158,.12); }
.phone-invitation button:focus-visible { outline:2px solid #e4c79e; outline-offset:3px; }
.phone-invitation button:active { transform:scale(.95); }
@media (prefers-reduced-motion:reduce) { .phone-invitation button { transition:none; } }
@media (max-height:480px) { .phone-mode .phone-invitation { bottom:16px; left:auto; width:min(440px,calc(100% - 32px)); } }
/* The opening uses its initial visual height until a width/orientation change.
   Android's address bar may resize innerHeight during a swipe. */
.phone-mode.depth .depth-room { height:calc(var(--phone-opening-height,100svh) * 6.25); }
.phone-mode.depth .depth-line { top:calc((var(--phone-opening-height,100svh) * .5 + 34px) / .8); }
.phone-mode.depth .depth-pct { top:calc((var(--phone-opening-height,100svh) * .5 + 22px) / .8); }
/* Compensate for the ancestor's .8 zoom so rain reaches both viewport edges. */
.phone-mode.depth .dark-window { width:125vw; margin-left:calc(50% - 62.5vw); }
/* Reserve the dock's space inside the dark footer, instead of a pale body tail. */
.phone-mode body:has(.site-footer.night) { padding-bottom:0; }
.phone-mode .site-footer.night { padding-bottom:calc(120px + env(safe-area-inset-bottom,0px)); }

/* Horizontal strokes wipe the glass; vertical swipes keep native page scrolling. */
.phone-mode #darkRain { touch-action:pan-y; }