/* fallow-ignore-file unused-file */
/* COMPASS (docs/COMPASS.md). Glass pill, bottom center, safe-area aware, BluSignal blue.
   Theme on .compass with --cp-bg --cp-fg --cp-line --cp-accent --cp-sheet-bg. */
.compass{--cp-bg:rgba(5,7,11,.74);--cp-fg:#eef2f8;--cp-line:rgba(95,180,255,.22);--cp-accent:var(--signal2,#5fb4ff);--cp-sheet-bg:rgba(8,12,20,.95);position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));z-index:55;display:flex;align-items:center;gap:4px;padding:5px;border-radius:999px;background:var(--cp-bg);border:1px solid var(--cp-line);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);box-shadow:0 18px 40px -18px rgba(0,0,0,.6),0 0 24px -10px rgba(47,123,255,.55);color:var(--cp-fg);transform:translate(-50%,140%);opacity:0;visibility:hidden;pointer-events:none;transition:transform .35s ease,opacity .35s ease,visibility 0s linear .35s;max-width:calc(100vw - 20px)}
.compass.on{transform:translate(-50%,0);opacity:1;visibility:visible;pointer-events:auto;transition:transform .35s ease,opacity .35s ease,visibility 0s}
.compass button{font:600 13px/1 var(--font,system-ui,sans-serif);letter-spacing:.01em;color:inherit;background:none;border:0;cursor:pointer;min-height:44px;border-radius:999px}
.cp-chip{padding:0 14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:34vw}
.cp-chip:hover,.cp-menu:hover,.cp-chip:focus-visible,.cp-menu:focus-visible{background:rgba(95,180,255,.14);outline:none}
.cp-chip:focus-visible,.cp-menu:focus-visible{box-shadow:inset 0 0 0 2px var(--cp-accent)}
.cp-menu{width:44px;display:flex;align-items:center;justify-content:center;gap:3px}
.cp-menu i{width:4px;height:4px;border-radius:50%;background:currentColor;display:block}
.cp-menu[aria-expanded="true"] i{background:var(--cp-accent)}
/* inside a pinned story deck: the menu button alone, so Play/Skip and the beats keep the screen */
.compass.cp-compact .cp-chip{display:none}
.cp-sheet{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);min-width:250px;max-width:calc(100vw - 24px);max-height:60vh;overflow:auto;padding:8px;border-radius:18px;background:var(--cp-sheet-bg);border:1px solid rgba(95,180,255,.2);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);box-shadow:0 28px 70px -20px rgba(0,0,0,.8),0 0 0 1px rgba(0,0,0,.35)}
.cp-sheet[hidden]{display:none}
/* dims the page behind the open sheet (a body-level sibling: .compass is transformed, so a fixed child would not cover the viewport) */
.cp-dim{position:fixed;inset:0;z-index:54;background:rgba(0,0,0,.42);opacity:0;pointer-events:none;transition:opacity .25s ease}
.cp-dim.on{opacity:1;pointer-events:auto}
.cp-sheet ul{list-style:none;margin:0;padding:0}
.cp-sheet button{display:flex;align-items:center;width:100%;text-align:left;padding:0 14px;font-weight:500;font-size:15px;white-space:nowrap}
.cp-sheet button:hover,.cp-sheet button:focus-visible{background:rgba(95,180,255,.12);outline:none}
.cp-sheet button:focus-visible{box-shadow:inset 0 0 0 2px var(--cp-accent)}
.cp-sheet button[aria-current]{color:var(--cp-accent);font-weight:600}
.cp-sheet button::before{content:'';flex:none;width:6px;height:6px;border-radius:50%;margin-right:12px;background:transparent;border:1px solid rgba(238,242,248,.3)}
.cp-sheet button[aria-current]::before{background:var(--cp-accent);border-color:var(--cp-accent);box-shadow:0 0 10px var(--cp-accent)}
/* a story deck in the list: a small play mark after the label */
.cp-sheet button.cp-film::after{content:'';flex:none;margin-left:10px;border-style:solid;border-width:4px 0 4px 7px;border-color:transparent transparent transparent var(--cp-accent);opacity:.85}
[data-compass]:not([data-film]){scroll-margin-top:72px}
@media(max-width:420px){.cp-chip{max-width:32vw;padding:0 10px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.compass,.compass.on,.cp-dim{transition:none}}
@media print{.compass,.cp-dim{display:none}}
/* the demo OVERLAY entry (docs/OVERLAY.md): the sheet's last item, set apart as the call to action */
.cp-sheet .cp-demo{margin-top:6px;border-top:1px solid rgba(95,180,255,.18);color:#fff;font-weight:650;background:linear-gradient(90deg,rgba(47,123,255,.28),rgba(47,123,255,.08))}
.cp-sheet .cp-demo::after{content:"\2192";margin-left:auto;padding-left:14px;color:var(--signal2,#62b6ff)}