/* Existing Forever shell, one asset per viewport. Query opt-in; <=960px only. */
.swipe-back-icon { display:none; }
.swipe-ui { position:fixed; inset:0; z-index:45; pointer-events:none; }
.swipe-switches { position:absolute; top:max(16px, env(safe-area-inset-top)); right:max(16px, env(safe-area-inset-right)); display:flex; gap:8px; pointer-events:auto; }
.swipe-switches button {
  min-height:44px; display:flex; align-items:center; min-width:96px; justify-content:center; padding:0 14px; color:var(--hud-ink); background:var(--ground);
  border:1px solid var(--hud-line); font:inherit; font-size:14px; cursor:pointer; }
.swipe-ui[data-mode="wall"] .swipe-switches { top:max(calc(76px + env(safe-area-inset-top)),var(--swipe-wall-top,0px)); }
.swipe-ui[data-mode="wall"] .swipe-footer { display:none; }
.swipe-footer { position:absolute; top:var(--swipe-footer-top); left:16px; right:16px; text-align:center; isolation:isolate; }
.swipe-footer::before { content:""; position:absolute; inset:-30px -16px -26px; z-index:-1; pointer-events:none;
  background:linear-gradient(to bottom,transparent,var(--swipe-label-bg) 24px,var(--swipe-label-bg) calc(100% - 24px),transparent); }
.swipe-ui { --swipe-label-bg:#0a0a0a; }
html[data-theme="light"] .swipe-ui { --swipe-label-bg:#fff; }
.swipe-title { font-size:16px; font-weight:600; line-height:1.4; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.swipe-footer p { margin:7px 0 15px; font-size:12px; line-height:1.5; color:var(--hud-ink); }
.swipe-footer nav { display:flex; justify-content:center; gap:8px; }
.swipe-footer button { width:44px; height:44px; display:grid; place-items:center; padding:0; color:var(--hud-ink);
  background:var(--surface); border:1px solid var(--hud-line); border-radius:8px; pointer-events:auto; cursor:pointer; }
.swipe-footer button:disabled { opacity:.35; cursor:default; }
/* States for the view switch and arrows (owner 2026-11-09), same family as the HUD buttons. */
.swipe-switches button, .swipe-footer button { transition:color .15s, border-color .15s, background-color .15s; }
@media (hover:hover) {
  .swipe-switches button:hover, .swipe-footer button:hover:not(:disabled) { color:var(--ink); border-color:rgba(var(--on),.3); background:var(--surface); }
}
.swipe-switches button:active, .swipe-footer button:active:not(:disabled) { color:var(--accent); border-color:var(--accent); background:var(--well); }
@media (prefers-reduced-motion:reduce) { .swipe-switches button, .swipe-footer button { transition:none; } }
.swipe-footer button svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.swipe-ui :focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.swipe-view #brand, .swipe-view #acct, .swipe-view #rstack, .swipe-view #pro,
.swipe-view #hint, .swipe-view #mZoomIn, .swipe-view #mZoomOut, .swipe-view .dens,
.swipe-view [data-proxy="bDensDown"], .swipe-view [data-proxy="bDensUp"] { display:none!important; }
.swipe-view .t.press { transform:none; }
.swipe-view .t { border-radius:0; }
.swipe-view .t__name { display:none; }
/* One quiet navigation row; existing finder and back actions stay intact. */
body.swipe-view #sres { display:none!important; }
body.swipe-view :is(#back,#sb-btn,#filter-btn,#saved-btn) {
  top:calc(var(--phone-top,0px) + 12px + var(--safe-top,0px)); right:auto; bottom:auto;
  width:44px; height:44px; min-height:44px; padding:0; box-sizing:border-box;
}
body.swipe-view #back {
  left:calc(14px + var(--safe-left,0px)); transform:none; justify-content:center;
  color:var(--hud-ink); background:var(--hud-bg)!important; border:1px solid var(--hud-line)!important; border-radius:0;
}
body.swipe-view #back:hover { transform:none; color:var(--ink); border-color:rgba(var(--on),.3)!important; }
body.swipe-view #back > span, body.swipe-view #back::before { display:none; }
body.swipe-view #back .swipe-back-icon { display:block; }
body.swipe-view :is(#back,#sb-btn,#filter-btn) svg {
  width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
}
body.swipe-view #sb-btn { left:calc(14px + var(--safe-left,0px)); }
body.swipe-view #filter-btn { left:calc(66px + var(--safe-left,0px)); }
body.swipe-view #saved-btn { left:calc(118px + var(--safe-left,0px)); }
body.swipe-view #filter-btn { transition-property:color,border-color,background; }
body.swipe-view.has-browse #sb-btn { left:calc(66px + var(--safe-left,0px)); }
body.swipe-view.has-browse #filter-btn { left:calc(118px + var(--safe-left,0px)); }
body.swipe-view.has-browse #saved-btn { left:calc(170px + var(--safe-left,0px)); }
body.swipe-view #mBtn {
  top:auto; left:auto; right:calc(14px + var(--safe-right,0px)); bottom:calc(100% - var(--phone-top,0px) - var(--phone-height,100dvh) + 18px + var(--safe-bottom,0px));
  width:44px; height:44px;
}
.swipe-view .swipe-switches { top:calc(12px + var(--safe-top,0px)); bottom:auto; left:auto; right:calc(14px + var(--safe-right,0px)); }
@media (max-width:460px) {
  body.swipe-view #filter-btn { left:calc(62px + var(--safe-left,0px)); }
  body.swipe-view #saved-btn { left:calc(110px + var(--safe-left,0px)); }
  body.swipe-view.has-browse #sb-btn { left:calc(62px + var(--safe-left,0px)); }
  body.swipe-view.has-browse #filter-btn { left:calc(110px + var(--safe-left,0px)); }
  body.swipe-view.has-browse #saved-btn { left:calc(158px + var(--safe-left,0px)); }
}
.swipe-peeks #viewport::after { content:""; position:absolute; inset:0; pointer-events:none; z-index:3;
  background:linear-gradient(to right,var(--ground),transparent 10%,transparent 90%,var(--ground)); }
.swipe-view .t[data-swipe-focus="false"] .t__cat,
.swipe-view .t[data-swipe-focus="false"] .t__fav,
.swipe-view .t[data-swipe-focus="false"] .t__copy,
.swipe-view .t[data-swipe-focus="false"] .t__vote { visibility:hidden; }
body.swipe-view::before, body.swipe-view::after { display:none; }
body.swipe-view:has(#code.open, #sb.open, #fmodal.open) .swipe-ui,
body.swipe-view.fv-open .swipe-ui,
body.swipe-view.mmenu-open .swipe-ui { visibility:hidden; }
@media (orientation:landscape) and (max-height:500px) {
  .swipe-footer { top:auto; bottom:max(12px,env(safe-area-inset-bottom)); }
  .swipe-title { font-size:13px; }
  .swipe-footer p { display:none; }
  .swipe-footer nav { margin-top:7px; }
}