/* ApeTrack · CARDS: the member's binder of cycle cards (cards.js). The cards themselves are drawn by the server. */
.track-switch{display:inline-flex;gap:4px;margin-left:10px;vertical-align:middle}
.track-switch[hidden]{display:none}
.track-switch button{border:1px solid #2a4246;padding:3px 9px;font:11px var(--sans,SFMono-Regular,Menlo,Consolas,monospace);letter-spacing:.06em;color:var(--muted);background:transparent;cursor:pointer}
.track-switch button[aria-pressed="true"]{border-color:var(--cyan);background:var(--cyan);color:var(--black)}
.tc{display:grid;gap:14px}
.tc-head{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;justify-content:space-between}
.tc-count{color:var(--ink,#f3eee6);font-weight:600;margin-left:6px;letter-spacing:.06em}
.tc-cover{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;border:1px solid #2a4246;background:var(--well,#0b1214);padding:10px}
.tc-cover img,.tc-cover-blank{width:76px;height:auto;aspect-ratio:5/7;border-radius:4px;display:block;background:#0f181b}
.tc-cover>div{display:grid;gap:4px;font-size:12px;color:var(--muted)}
.tc-cover b{font-size:10px;letter-spacing:.14em;color:var(--gold,#f2c46d)}
.tc-cover strong{font-size:18px;color:var(--cyan);font-weight:600}
.tc-btn{justify-self:start;border:1px solid var(--cyan);color:var(--cyan);background:transparent;padding:5px 11px;font:12px var(--sans,SFMono-Regular,Menlo,Consolas,monospace);cursor:pointer;text-decoration:none;display:inline-block}
.tc-btn:hover:not(:disabled){background:var(--cyan);color:var(--black)}
.tc-btn:disabled{opacity:.35;cursor:default}
.tc-binder{display:grid;gap:10px;border:1px solid #2a4246;background:var(--well,#0b1214);padding:12px}
.tc-binder-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.1em;color:var(--muted)}
.tc-binder-top span:last-child{display:flex;gap:4px}
.tc-pockets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tc-pocket{position:relative;display:block;padding:4px;border:0;border-radius:8px;cursor:pointer;background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.03) 45%,rgba(255,255,255,.1));box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.tc-pocket img{display:block;width:100%;height:auto;aspect-ratio:5/7;border-radius:6px;background:#0f181b}
.tc-pocket:focus-visible,.tc-btn:focus-visible,.track-switch button:focus-visible{outline:2px solid var(--gold,#f2c46d);outline-offset:2px}
.tc-pocket:hover img{filter:brightness(1.08)}
.tc-live img{filter:saturate(.45) brightness(.7)}
.tc-live{box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),inset 0 0 0 3px rgba(0,0,0,.4)}
.tc-live small,.tc-waiting small{position:absolute;left:50%;bottom:9%;transform:translateX(-50%);font:700 11px var(--sans,monospace);letter-spacing:.14em;color:var(--ink,#fff);background:rgba(5,6,12,.85);border:1px dashed rgba(255,255,255,.5);padding:3px 8px}
.tc-waiting,.tc-empty{cursor:default;aspect-ratio:5/7.2}
.tc-waiting>span{display:grid;place-items:center;align-content:center;gap:4px;height:100%;border-radius:6px;border:1px dashed rgba(255,255,255,.3);font-size:12px;color:var(--muted);position:relative}
.tc-waiting b{font-size:16px;color:var(--ink,#fff)}
.tc-empty{background:repeating-linear-gradient(135deg,#0d1416 0 6px,#0a1012 6px 12px);opacity:.4}
.tc-status{margin:0;min-height:1.2em;font-size:12px;color:var(--muted);overflow-wrap:anywhere}

/* the viewer */
.tc-viewer{border:1px solid var(--cyan);background:rgba(3,6,7,.97);color:var(--ink,#f3eee6);padding:14px 16px;width:min(560px,94vw);max-height:94vh;box-sizing:border-box}
.tc-viewer::backdrop{background:rgba(0,0,0,.72)}
.tc-viewer[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto auto;gap:12px}
.tc-viewer-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.14em;color:var(--cyan)}
.tc-viewer-top button{font:18px var(--sans,monospace);color:var(--ink,#fff);background:transparent;border:1px solid #2a4246;width:32px;height:32px;cursor:pointer}
.tc-stage{display:grid;place-items:center;perspective:1300px;min-height:0}
.tc-card{--mx:50%;--my:50%;--rx:0deg;--ry:0deg;width:min(360px,76vw,calc((94vh - 170px) / 1.4));aspect-ratio:5/7;position:relative}
.tc-tilt{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tc-card.tc-live .tc-tilt{transition:transform .08s linear}
.tc-card.tc-flipped .tc-tilt{transform:rotateX(var(--rx)) rotateY(calc(var(--ry) + 180deg))}
.tc-face{position:absolute;inset:0;border-radius:4.2%/3%;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:0 22px 50px rgba(0,0,0,.6)}
.tc-front img{display:block;width:100%;height:100%;object-fit:cover}
.tc-glare,.tc-foil{position:absolute;inset:0;pointer-events:none}
.tc-glare{mix-blend-mode:overlay;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.5),rgba(255,255,255,.06) 32%,rgba(0,0,0,.2) 75%)}
.tc-foil{opacity:0;mix-blend-mode:screen;background-size:300% 300%;background-position:var(--mx) var(--my)}
.tc-card[data-finish="refractor"] .tc-foil{opacity:.22;background-image:repeating-linear-gradient(118deg,#ff3ea5 0%,#ffd23f 4%,#43ffc2 8%,#21ddde 12%,#7b5cff 16%,#ff3ea5 20%)}
.tc-card[data-finish="gold"] .tc-foil{opacity:.3;background-image:linear-gradient(112deg,transparent 30%,rgba(255,214,120,.7) 45%,rgba(255,250,225,.9) 50%,rgba(255,190,80,.7) 55%,transparent 70%)}
.tc-reverse{transform:rotateY(180deg);background:#0b0f12;border:1px solid #1f3033;padding:6%;font-size:12px;overflow:auto}
.tc-back{display:grid;align-content:start;gap:10px}
.tc-reverse strong{font-size:22px;letter-spacing:-.02em}
.tc-reverse p{margin:0;line-height:1.55}
.tc-reverse dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0}
.tc-reverse dt{color:var(--muted)}.tc-reverse dd{margin:0;font-weight:600;text-transform:capitalize}
.tc-reverse small{color:var(--muted);font-size:10px;line-height:1.5}
.tc-viewer-acts{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.tc-viewer-status{margin:0;font-size:12px;color:var(--muted);text-align:center;min-height:1.2em;overflow-wrap:anywhere}
/* the card's story video */
.tc-story{display:grid;gap:8px;border:1px solid #2a4246;background:var(--well,#0b1214);padding:10px 12px;font-size:12px}
.tc-story-h{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.16em;color:var(--gold,#f2c46d);font-weight:600}
.tc-story-credits{color:var(--muted);letter-spacing:.08em}
.tc-story-note{color:var(--muted);line-height:1.5}.tc-story-note b{color:var(--ink,#f3eee6)}
.tc-story-bad{color:#ff8a8a}
.tc-story-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.tc-story-go{border-color:var(--gold,#f2c46d);color:var(--gold,#f2c46d)}.tc-story-go:hover:not(:disabled){background:var(--gold,#f2c46d);color:var(--black,#050505)}
.tc-story-bar{height:6px;background:#132024;overflow:hidden}.tc-story-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--gold,#f2c46d));transition:width .6s ease}
.tc-viewer.tc-playing .tc-card{display:none}
.tc-stage-video{display:block;height:100%;max-height:calc(94vh - 250px);max-width:100%;aspect-ratio:9/16;background:#000;border:1px solid #2a4246}
@media (prefers-reduced-motion:reduce){.tc-tilt{transition:none}}