@font-face { font-family:'Bebas Neue'; src:url('fonts/bebas-400.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Space Mono'; src:url('fonts/spacemono-400.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Space Mono'; src:url('fonts/spacemono-700.woff2') format('woff2'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Subway Berlin SC'; src:url('fonts/subwayberlinsc-400.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Inter'; src:url('fonts/inter-var.woff2') format('woff2'); font-weight:100 900; font-style:normal; font-display:swap; }
:root {
  --black:#000; --white:#fff;
  --cyan:#3FDFFF;
  --cyan-glow:rgba(63,223,255,.35);
  --gray-mid:rgba(255,255,255,.55);
  --gray-line:rgba(255,255,255,.10);
  --edge:rgba(255,255,255,.30);
  --mono:'Space Mono', ui-monospace, Menlo, monospace;
  --display:'Bebas Neue', 'Arial Narrow', Impact, sans-serif;
  --body:'Inter', system-ui, -apple-system, 'Helvetica Neue', sans-serif;
  --gutter:14px;
  --pad:6px;
  --t:.15s ease;
  --selbar-h:0px;
}
@media (min-width:700px) { :root { --gutter:24px; } }
@media (min-width:1280px) { :root { --gutter:32px; } }
*, *::before, *::after { box-sizing:border-box; }
[hidden] { display:none !important; }
html { color-scheme:dark; background:var(--black); -webkit-text-size-adjust:100%; text-size-adjust:100%; scrollbar-gutter:stable; }
html.lb-open, html.lb-open body { overflow:hidden; }
body {
  margin:0; background:var(--black); color:var(--white);
  font-family:var(--body); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  -webkit-tap-highlight-color:transparent; min-height:100vh;
}
button {
  font:inherit; color:inherit; background:none; border:0; border-radius:0; padding:0; margin:0;
  cursor:pointer; -webkit-appearance:none; appearance:none; touch-action:manipulation;
}
a { color:inherit; text-decoration:none; }
img { display:block; }
p, h1, dl, dd, dt { margin:0; }
:focus-visible { outline:2px solid var(--cyan); outline-offset:3px; }
.mono { font-family:var(--mono); text-transform:uppercase; letter-spacing:.18em; }
.cover { position:relative; background:var(--black); overflow:hidden; height:100vh; height:100svh; min-height:min(520px, 100svh); }
.cover-media { position:absolute; inset:0; background:var(--cover-color, #0a0a0a); overflow:hidden; }
.cover-img {
  width:100%; height:100%; object-fit:cover; object-position:var(--focus, 50% 50%);
  opacity:0; transition:opacity .6s ease;
}
.cover-img.loaded { opacity:1; }
.cover-img.centered { position:absolute; max-width:none; object-fit:fill; }
.cover-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:var(--focus, 50% 50%); background:transparent; pointer-events:none; }
.cover-shade {
  position:absolute; inset:0;
  background:
    linear-gradient(to top, rgba(0,0,0,.94) 0%, rgba(0,0,0,.78) 26%, rgba(0,0,0,.4) 46%, rgba(0,0,0,0) 68%),
    linear-gradient(to bottom, rgba(0,0,0,.5) 0%, rgba(0,0,0,0) 17%);
}
.cover-panel {
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:space-between;
  padding:calc(var(--gutter) + 8px + env(safe-area-inset-top)) var(--gutter) 0;
}
.cover-brand { display:flex; align-items:center; align-self:flex-start; flex:none; flex-wrap:nowrap; white-space:nowrap; font-size:20px; }
.logo-link { display:flex; flex:none; line-height:0; transition:opacity var(--t); }
.logo-link:hover { opacity:.8; }
@media (hover:none) and (pointer:coarse), (max-width:700px) {
  .logo-link { padding:14px 12px; margin:-14px -12px; }
}
.cover-logo { height:1em; width:auto; flex:none; }
.cover-brand.has-cobrand { gap:.8em; font-size:min(20px, calc((100vw - 2 * var(--gutter)) / 14.8)); }
@media (max-width:700px) { .cover-brand.has-cobrand { font-size:min(17px, calc((100vw - 2 * var(--gutter)) / 14.8)); } }
.cover-plus { flex:none; font:400 1.45em/1 var(--mono); color:rgba(255,255,255,.7); transform:translateY(-.0262em); }
.cover-cobrand { flex:none; height:1em; width:auto; max-width:9.5em; object-fit:contain; object-position:left center; }
.cover-text {
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding-bottom:calc(clamp(36px, 9vh, 96px) + env(safe-area-inset-bottom));
}
.cover-date { font-size:12px; font-weight:700; color:rgba(255,255,255,.86); }
.cover-date { margin-bottom:14px; letter-spacing:.3em; }
.cover-title {
  font-family:var(--display); font-weight:400; text-transform:uppercase; text-wrap:balance;
  letter-spacing:.012em; overflow-wrap:anywhere;
  font-size:calc(clamp(88px, 14vw, 220px) * var(--tfit, 1)); line-height:.88; margin-bottom:8px;
  max-width:100%;
}
.cover-title.has-accent { display:flex; flex-direction:column; align-items:center; text-wrap:nowrap; margin-bottom:8px; }
.title-accent {
  display:block; width:max-content; margin:.18em auto 0; font-size:1.8em;
  font-family:'Subway Berlin SC', var(--display); font-weight:400; text-transform:none; letter-spacing:0; line-height:.85; white-space:nowrap;
  color:var(--cyan); text-shadow:0 0 6px rgba(63,223,255,.7), 0 0 16px rgba(63,223,255,.4), 0 0 36px rgba(63,223,255,.2);
  transform:rotate(-3deg);
}
.title-amp { position:relative; z-index:2; width:0; height:0; }
.title-amp > span {
  position:absolute; left:0; top:0; display:block; width:max-content; transform:translateX(-50%) rotate(7deg);
  font-family:'Subway Berlin SC', var(--display); font-weight:400; text-transform:none; letter-spacing:0; line-height:1; white-space:nowrap; font-size:2.25em;
  color:#FF2E2E; text-shadow:0 0 6px rgba(255,46,46,.75), 0 0 18px rgba(255,46,46,.45), 0 0 44px rgba(255,46,46,.22);
}
.title-rest { display:block; position:relative; z-index:1; }
@keyframes tubeCy {
  0%   { opacity:.10; text-shadow:none; color:rgba(63,223,255,.35); }
  6%   { opacity:1; color:#3FDFFF; text-shadow:0 0 6px rgba(63,223,255,.9), 0 0 18px rgba(63,223,255,.55), 0 0 44px rgba(63,223,255,.3); }
  9%   { opacity:.12; text-shadow:none; color:rgba(63,223,255,.35); }
  17%  { opacity:.9; color:#3FDFFF; text-shadow:0 0 4px rgba(63,223,255,.7), 0 0 12px rgba(63,223,255,.4); }
  19%  { opacity:.15; text-shadow:none; color:rgba(63,223,255,.35); }
  31%  { opacity:.55; color:#3FDFFF; text-shadow:0 0 3px rgba(63,223,255,.5); }
  33%  { opacity:.12; text-shadow:none; color:rgba(63,223,255,.35); }
  46%  { opacity:1; color:#3FDFFF; text-shadow:0 0 6px rgba(63,223,255,.9), 0 0 22px rgba(63,223,255,.6), 0 0 60px rgba(63,223,255,.35); }
  49%  { opacity:.7; }
  60%, 100% { opacity:1; color:#3FDFFF; text-shadow:0 0 6px rgba(63,223,255,.7), 0 0 16px rgba(63,223,255,.4), 0 0 36px rgba(63,223,255,.2); }
}
@keyframes tubeRd {
  0%   { opacity:.08; text-shadow:none; }
  15%  { opacity:1; text-shadow:0 0 8px rgba(255,46,46,.95), 0 0 26px rgba(255,46,46,.6); }
  22%  { opacity:.1; text-shadow:none; }
  40%  { opacity:1; text-shadow:0 0 8px rgba(255,46,46,.95), 0 0 26px rgba(255,46,46,.6), 0 0 60px rgba(255,46,46,.3); }
  48%  { opacity:.6; }
  62%, 100% { opacity:1; text-shadow:0 0 6px rgba(255,46,46,.75), 0 0 18px rgba(255,46,46,.45), 0 0 44px rgba(255,46,46,.22); }
}
@keyframes tubeHum { 0%, 100% { filter:brightness(1); } 50% { filter:brightness(1.12); } }
@media (prefers-reduced-motion:no-preference) {
  html.ignite-wait .title-accent, html.ignite-wait .title-amp > span { opacity:0; }
  html.ignite .title-accent { animation:tubeCy 1.7s steps(1, end) both; }
  html.ignite .title-amp > span { opacity:0; animation:tubeRd .9s steps(1, end) 1.35s forwards; }
}
@media (prefers-reduced-motion:no-preference) and (hover:hover) and (min-width:769px) {
  html.ignite .title-accent { animation:tubeCy 1.7s steps(1, end) both, tubeHum 2.8s ease-in-out 1.7s infinite; }
  html.ignite .title-amp > span { animation:tubeRd .9s steps(1, end) 1.35s forwards, tubeHum 2.8s ease-in-out 2.25s infinite; }
  html.cover-off .title-accent, html.cover-off .title-amp > span { animation-play-state:running, paused; }
}
.cover-cta {
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  min-height:50px; padding:0 34px;
  font-size:12px; font-weight:700; letter-spacing:.24em; color:var(--cyan);
  border:1px solid var(--cyan); background:transparent;
  box-shadow:0 0 12px rgba(63,223,255,.25), inset 0 0 12px rgba(63,223,255,.08);
  transition:background-color var(--t), color var(--t), border-color var(--t), box-shadow var(--t);
}
@media (hover:hover) {
  .cover-cta:hover { background:var(--cyan); color:var(--black); }
}
.cover-cta:focus-visible { background:var(--cyan); color:var(--black); }
.toolbar {
  position:sticky; top:0; z-index:40;
  background:rgba(0,0,0,.9);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  border-bottom:1px solid var(--gray-line);
}
.tb-inner {
  display:flex; align-items:center; justify-content:space-between;
  gap:10px 24px; padding:12px var(--gutter);
}
.tb-title { display:flex; align-items:baseline; gap:14px; min-width:0; flex:1 1 0; }
.tb-name {
  font-family:var(--display); font-size:clamp(26px, 2.4vw, 34px); line-height:1; letter-spacing:.02em;
  text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0;
}
.tb-count { font-size:10px; letter-spacing:.18em; color:var(--gray-mid); white-space:nowrap; flex:none; }
.tb-actions { display:flex; align-items:center; gap:8px; flex:none; }
.res { display:inline-flex; flex:none; border:1px solid var(--edge); }
.res-btn {
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; flex:none;
  height:40px; min-width:112px; padding:0 14px;
  font:700 11px/1 var(--mono); letter-spacing:.18em; text-transform:uppercase; white-space:nowrap;
  color:var(--white); background:transparent; cursor:pointer;
  transition:color var(--t), background-color var(--t);
}
.res-btn + .res-btn { border-left:1px solid var(--edge); }
.res-s { font-weight:400; font-size:9px; letter-spacing:.06em; text-transform:none; color:var(--gray-mid); transition:color var(--t); }
.res-btn[aria-pressed="true"] { background:var(--cyan); color:var(--black); }
.res-btn[aria-pressed="true"] .res-s { color:rgba(0,0,0,.75); }
.res-btn:focus-visible { outline:2px solid var(--cyan); outline-offset:-4px; }
.res-btn[aria-pressed="true"]:focus-visible { outline-color:var(--black); }
@media (hover:hover) {
  .res-btn[aria-pressed="false"]:hover { color:var(--cyan); }
  .res-btn[aria-pressed="false"]:hover .res-s { color:var(--cyan); }
}
.tb-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:9px; flex:none;
  height:42px; min-width:42px; padding:0 12px;
  font:700 11px/1 var(--mono); letter-spacing:.18em; text-transform:uppercase; white-space:nowrap;
  color:var(--white); background:transparent; border:1px solid var(--edge);
  transition:color var(--t), border-color var(--t), background-color var(--t);
}
.tb-btn svg { flex:none; display:block; }
.tb-btn svg[hidden] { display:none; }
.tb-btn[aria-busy="true"] { pointer-events:none; cursor:progress; }
.tb-primary { padding:0 16px; background:var(--white); color:var(--black); border-color:var(--white); }
@media (hover:hover) {
  .tb-btn:hover { color:var(--cyan); border-color:var(--cyan); }
  .tb-primary:hover { background:var(--black); }
}
.res-row { display:contents; }
@media (max-width:1100px) {
  .tb-inner { flex-wrap:wrap; }
  .tb-actions { order:2; }
  .res-row { display:flex; justify-content:center; order:3; flex:0 0 100%; margin-top:2px; }
  .res { flex:1 1 auto; max-width:420px; }
  .res-btn { flex:1 1 0; min-width:0; }
}
@media (max-width:860px) {
  .tb-title { flex-direction:column; align-items:flex-start; gap:5px; }
  .tb-name { max-width:100%; white-space:normal; text-wrap:balance; line-height:.95; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
}
.toolbar.tb-ppl-compact .ppl-btn .tb-label, .toolbar.tb-ppl-compact .ppl-chip-n { display:none; }
.toolbar.tb-ppl-compact .ppl-btn { gap:0; padding:0 8px; }
.toolbar.tb-ppl-compact .ppl-chip-open { gap:0; }
.toolbar.tb-nocount .tb-count { display:none; }
.toolbar.tb-res-row .tb-inner { flex-wrap:wrap; }
.toolbar.tb-res-row .tb-actions { order:2; }
.toolbar.tb-res-row .res-row { display:flex; justify-content:center; order:3; flex:0 0 100%; margin-top:2px; }
.toolbar.tb-res-row .res { flex:1 1 auto; max-width:420px; }
.toolbar.tb-res-row .res-btn { flex:1 1 0; min-width:0; }
.toolbar.tb-wrap .tb-title { flex-direction:column; align-items:flex-start; gap:5px; }
.toolbar.tb-wrap .tb-name { max-width:100%; white-space:normal; text-wrap:balance; line-height:.95; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.toolbar.tb-icons .tb-actions .tb-label { display:none; }
.toolbar.tb-icons .tb-actions .tb-btn { padding:0; min-width:44px; }
.toolbar.tb-small .tb-name { font-size:22px; }
@media (max-width:640px) {
  .tb-inner { gap:8px; padding:10px var(--gutter); }
  .res-btn { height:40px; padding:0 6px; font-size:10px; letter-spacing:.14em; }
  .tb-title { flex-direction:column; align-items:flex-start; gap:5px; }
  .tb-actions { gap:6px; }
  .tb-btn { height:44px; min-width:44px; padding:0; }
  .tb-primary { padding:0; }
  .tb-label { display:none; }
  .tb-name { font-size:26px; max-width:100%; white-space:normal; text-wrap:balance; line-height:.95; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
  .tb-count { font-size:9px; }
}
.ppl { display:flex; align-items:center; flex:none; }
.ppl[hidden], .ppl-chip[hidden], .ppl-panel[hidden], .ppl-scrim[hidden] { display:none; }
.ppl-btn { gap:10px; padding:0 12px 0 8px; }
.ppl-stack { display:inline-flex; align-items:center; }
.ppl-stack img { width:24px; height:24px; border-radius:50%; object-fit:cover; display:block; background:#2a2a2a; border:2px solid var(--black); margin-left:-8px; }
.ppl-stack img:first-child { margin-left:0; }
.ppl-stack:empty { display:none; }
.ppl-btn .ppl-ic { display:none; }
.ppl-chip { display:inline-flex; align-items:stretch; height:42px; box-shadow:inset 0 0 0 1px var(--cyan); }
.ppl-chip-open { display:inline-flex; align-items:center; gap:9px; padding:0 10px 0 5px; color:var(--white); background:transparent;
  font:700 11px/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; white-space:nowrap; cursor:pointer; }
.ppl-chip-av { width:30px; height:30px; border-radius:50%; object-fit:cover; display:block; background:#2a2a2a; }
.ppl-clear { display:grid; place-items:center; width:40px; color:var(--white); background:transparent; border-left:1px solid var(--edge); cursor:pointer; }
@media (pointer:coarse) {
  .ppl-btn, .ppl-chip { height:44px; } .ppl-clear { width:44px; }
  .ppl-chip-open { min-width:44px; justify-content:center; }
  .tb-btn { height:44px; min-width:44px; }
  .res-btn { height:44px; }
  .ppl-head .ppl-every { height:44px; }
}
@media (hover:hover) { .ppl-chip-open:hover, .ppl-clear:hover { color:var(--cyan); } }
.ppl-panel {
  position:fixed; z-index:70; width:min(452px, calc(100vw - 2 * var(--gutter))); max-height:min(70vh, 560px);
  display:flex; flex-direction:column; padding:14px 16px 0; background:#080808; border:1px solid var(--gray-line); box-shadow:0 18px 50px rgba(0,0,0,.6);
}
.ppl-panel:not([hidden]) { display:flex; }
.ppl-scroll { position:relative; flex:1 1 auto; min-height:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; padding:4px 6px 18px; margin:0 -6px; }
.ppl-more { position:absolute; left:1px; right:1px; bottom:1px; height:46px; display:flex; align-items:flex-end; justify-content:center; padding-bottom:6px;
  background:linear-gradient(to bottom, rgba(8,8,8,0), #080808 70%); color:var(--white); border:0; cursor:pointer; opacity:0; pointer-events:none; transition:opacity var(--t); }
.ppl-more.on { opacity:1; pointer-events:auto; }
.ppl-more svg { display:block; }
.ppl-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.ppl-title { font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--gray-mid); }
.ppl-every { height:36px; padding:0 14px; font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--white); border:1px solid var(--edge); background:transparent; }
.ppl-every[aria-pressed="true"] { color:var(--black); background:var(--cyan); border-color:var(--cyan); }
.ppl-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(64px, 1fr)); gap:16px 10px; }
.ppl-c { position:relative; justify-self:center; width:64px; height:64px; padding:0; border-radius:50%; background:transparent; cursor:pointer; }
.ppl-c img { width:100%; height:100%; display:block; border-radius:50%; object-fit:cover; background:#222; box-shadow:0 0 0 2px rgba(255,255,255,.14); transition:box-shadow var(--t); }
.ppl-c[aria-pressed="true"] img { box-shadow:0 0 0 3px var(--cyan); }
.ppl-c:focus-visible { outline:none; }
.ppl-c:focus-visible img { box-shadow:0 0 0 3px var(--cyan); }
.ppl-n { position:absolute; right:-4px; bottom:-3px; min-width:22px; height:22px; padding:0 5px; border-radius:11px; background:var(--white); color:var(--black);
  font:700 10px/22px var(--mono); letter-spacing:.02em; text-align:center; pointer-events:none; }
@media (hover:hover) { .ppl-c:hover img { box-shadow:0 0 0 3px var(--cyan); } .ppl-every[aria-pressed="false"]:hover { color:var(--cyan); border-color:var(--cyan); } }
.ppl-scrim { position:fixed; inset:0; z-index:69; background:rgba(0,0,0,.55); }
@media (max-width:640px) {
  .res-row .ppl { margin-left:8px; }
  .ppl-btn { height:44px; padding:0 10px 0 6px; gap:0; }
  .ppl-btn .ppl-ic { display:block; margin-left:6px; }
  .ppl-btn .ppl-stack:empty + .ppl-ic { margin-left:0; }
  .ppl-chip { height:44px; }
  .ppl-chip-open { padding:0 6px 0 6px; gap:0; min-width:44px; justify-content:center; }
  .ppl-chip-n { display:none; }
  .ppl-clear { width:44px; }
  .ppl-panel { left:0 !important; right:0 !important; top:auto !important; bottom:0; width:auto; max-height:min(64vh, 520px) !important; border-width:1px 0 0;
    padding:16px 16px 0; box-shadow:0 -12px 40px rgba(0,0,0,.6); }
  .ppl-scroll { padding-bottom:calc(18px + env(safe-area-inset-bottom)); }
  .ppl-grid { grid-template-columns:repeat(auto-fill, minmax(56px, 1fr)); gap:16px 8px; }
  .ppl-c { width:56px; height:56px; }
}
@media (min-width:641px) { .ppl-scrim { display:none; } }
.grid-wrap { padding:var(--pad); min-height:calc(100vh - 120px); min-height:calc(100svh - 120px); }
.grid { position:relative; }
.grid.abs .tile { position:absolute; }
.grid .tile.pf-off { display:none; }
.grid.abs .sec-head { position:absolute; }
.grid .sec-head.pf-off { display:none; }
.sec-head {
  margin:0; display:flex; align-items:flex-end; justify-content:space-between; gap:16px; min-width:0; overflow:hidden;
  padding:0 0 12px; border-bottom:1px solid var(--gray-line); font-weight:400;
}
.sec-title {
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-family:var(--display); font-weight:400; text-transform:uppercase; letter-spacing:.012em; line-height:.9;
  font-size:clamp(34px, 5.2vw, 60px);
}
.sec-n { flex:none; font-size:12px; font-weight:700; color:var(--gray-mid); padding-bottom:4px; }
@media (max-width:859px) { .sec-title { font-size:clamp(32px, 9vw, 44px); } }
.grid.pf-anim .tile { transition:top .32s ease, left .32s ease, width .32s ease, height .32s ease; }
@media (prefers-reduced-motion:reduce) { .grid.pf-anim .tile { transition:none; } }
.tile { position:relative; min-width:0; }
.box { position:absolute; inset:0; }
.frame { position:relative; width:100%; height:100%; overflow:hidden; background:var(--ph, #111); }
.tile-open { position:absolute; inset:0; display:block; width:100%; height:100%; cursor:zoom-in; }
.tile-open:focus-visible { outline:none; }
.tile-open img {
  width:100%; height:100%; object-fit:cover; opacity:0;
  transition:opacity .45s ease, transform .35s ease;
}
.tile-open img.loaded { opacity:1; }
.tile-vid {
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; pointer-events:none;
  transition:opacity .35s ease, transform .35s ease;
}
.tile-vid.on { opacity:1; }
.tile-badge {
  position:absolute; top:10px; right:10px; z-index:2; pointer-events:none;
  padding:4px 7px 3px; font-size:9px; font-weight:700; line-height:1; letter-spacing:.16em; color:var(--white);
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.28);
}
.tile::after {
  content:''; position:absolute; inset:0; pointer-events:none; opacity:0;
  box-shadow:0 0 0 2px var(--cyan), 0 0 24px var(--cyan-glow);
  transition:opacity var(--t);
}
.tile:has(.tile-open:focus-visible)::after, .tile.sel::after { opacity:1; }
.tile.sel:not(:hover)::after { box-shadow:0 0 0 2px var(--cyan); }
.tile:has(.tile-open:focus-visible), .tile:has(.tile-dl:focus-visible) { z-index:3; }
@supports not selector(:has(*)) {
  .tile-open:focus-visible { outline:2px solid var(--cyan); outline-offset:-2px; }
}
.tile:has(.tile-open:focus-visible) .tile-open img, .tile:has(.tile-open:focus-visible) .tile-vid { transform:scale(1.02); }
.tile-sel {
  position:absolute; top:0; left:0; z-index:2; width:46px; height:46px;
  display:grid; place-items:center; opacity:0; transition:opacity var(--t);
}
.ring {
  display:grid; place-items:center; width:26px; height:26px; border-radius:50%;
  border:1.5px solid rgba(255,255,255,.92); background:rgba(0,0,0,.32); box-shadow:0 0 0 1px rgba(0,0,0,.22);
  color:transparent; transition:background var(--t), border-color var(--t), color var(--t), box-shadow var(--t);
}
.ring svg { width:14px; height:14px; display:block; }
.check[aria-pressed="true"] .ring { background:var(--cyan); border-color:var(--cyan); color:var(--black); box-shadow:none; }
.tile-sel:focus-visible { opacity:1; outline-offset:-6px; }
.tile:has(.tile-open:focus-visible) .tile-sel, .tile.sel .tile-sel, body.selecting .tile-sel { opacity:1; }
@media (hover:none) { .tile-sel { opacity:1; } }
.tile-dl { display:none; }
@media (hover:hover) and (pointer:fine) {
  .tile:hover { z-index:3; }
  .tile:hover::after { opacity:1; }
  .tile:hover .tile-sel { opacity:1; }
  .tile-sel:hover .ring, .lb-sel:hover .ring { border-color:var(--cyan); }
  .check[aria-pressed="true"]:hover .ring { background:var(--cyan); border-color:var(--cyan); }
  .tile:hover .tile-open img, .tile:hover .tile-vid { transform:scale(1.02); }
  .tile-dl {
    position:absolute; right:12px; bottom:12px; z-index:2;
    display:grid; place-items:center; width:38px; height:38px; border-radius:50%;
    color:var(--white); background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.22);
    -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
    opacity:0; transform:translateY(4px); pointer-events:none;
    transition:opacity var(--t), transform var(--t), color var(--t), border-color var(--t), box-shadow var(--t);
  }
  .tile:hover .tile-dl, .tile:has(.tile-open:focus-visible) .tile-dl, .tile-dl:focus-visible {
    opacity:1; transform:none; pointer-events:auto;
  }
  .tile-dl:hover { color:var(--cyan); border-color:var(--cyan); box-shadow:0 0 0 1px var(--cyan); }
  .tile-dl:focus-visible { outline-offset:2px; }
  .tile-dl svg { display:block; }
}
.foot { display:flex; justify-content:center; padding:clamp(40px, 8vw, 88px) var(--gutter) calc(clamp(40px, 8vw, 88px) + var(--selbar-h)); }
.foot img { height:16px; width:auto; opacity:.5; transition:opacity var(--t); }
.foot .logo-link { display:block; line-height:0; }
.foot .logo-link:hover img { opacity:.8; }
.toast {
  position:fixed; left:50%; bottom:calc(28px + env(safe-area-inset-bottom) + var(--selbar-h)); z-index:120;
  transform:translate(-50%, 8px); opacity:0; pointer-events:none;
  padding:12px 18px; font-size:11px; font-weight:700; white-space:nowrap;
  color:var(--white); background:rgba(0,0,0,.92); border:1px solid var(--cyan);
  transition:opacity var(--t), transform var(--t);
}
.toast.on { opacity:1; transform:translate(-50%, 0); }
.dl-note {
  position:fixed; left:50%; bottom:calc(28px + env(safe-area-inset-bottom) + var(--selbar-h)); transform:translateX(-50%); z-index:130;
  width:max-content; max-width:min(560px, calc(100vw - 2 * var(--gutter))); padding:12px 18px;
  background:rgba(0,0,0,.94); border:1px solid var(--cyan); box-shadow:0 0 14px rgba(63,223,255,.25);
  font-size:11px; font-weight:700; line-height:1.55; letter-spacing:.14em; text-align:center; color:var(--white); pointer-events:none;
}
.dl-note.has-action { pointer-events:auto; }
.dl-note-btn { margin-left:10px; height:36px; padding:0 12px; vertical-align:middle; font-size:10px; font-weight:700; letter-spacing:.16em; color:var(--black); background:var(--cyan); border:0; cursor:pointer; }
@media (pointer:coarse) { .dl-note-btn { height:44px; } }
.all-confirm { position:fixed; z-index:71; width:min(380px, calc(100vw - 24px)); padding:16px 16px 14px; background:#080808; border:1px solid var(--gray-line); box-shadow:0 18px 50px rgba(0,0,0,.6); }
.all-confirm[hidden] { display:none; }
.ac-txt { margin:0 0 14px; font-size:13px; line-height:1.45; color:var(--white); }
.ac-row { display:flex; gap:8px; }
.ac-go, .ac-no { height:44px; padding:0 16px; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; cursor:pointer; }
.ac-go { flex:1 1 auto; color:var(--black); background:var(--white); border:1px solid var(--white); }
.ac-no { color:var(--white); background:transparent; border:1px solid var(--edge); }
.ac-drive { display:inline-block; margin-top:12px; font-size:10px; letter-spacing:.12em; color:var(--gray-mid); text-decoration:underline; text-underline-offset:3px; }
@media (hover:hover) { .ac-go:hover { background:var(--cyan); border-color:var(--cyan); } .ac-no:hover, .ac-drive:hover { color:var(--cyan); border-color:var(--cyan); } }
.selbar {
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  transform:translateY(105%); visibility:hidden; transition:transform .28s cubic-bezier(.2,.8,.2,1), visibility 0s .28s;
  background:rgba(0,0,0,.92); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  border-top:1px solid var(--gray-line);
  padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom));
}
.selbar.on { transform:none; visibility:visible; transition:transform .28s cubic-bezier(.2,.8,.2,1), visibility 0s; }
.selbar-in { display:flex; align-items:center; gap:10px 18px; max-width:1800px; margin:0 auto; }
.sel-info { min-width:0; overflow:hidden; text-overflow:ellipsis; margin-right:auto; font-size:11px; font-weight:700; letter-spacing:.16em; color:var(--white); white-space:nowrap; }
.sel-info .n { color:var(--cyan); }
.sel-info .sz { color:var(--gray-mid); font-weight:400; }
.sel-actions { display:flex; align-items:center; gap:8px; }
.sel-btn {
  height:42px; padding:0 16px; font:700 10px/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; white-space:nowrap;
  color:var(--white); background:transparent; border:1px solid var(--edge);
  transition:color var(--t), border-color var(--t), background-color var(--t);
}
.sel-primary { padding:0 22px; background:var(--white); color:var(--black); border-color:var(--white); font-size:11px; letter-spacing:.18em; }
.sel-btn:disabled { opacity:.4; cursor:default; }
.sel-progress { position:absolute; left:0; right:0; top:-1px; height:3px; overflow:hidden; pointer-events:none; opacity:0; transition:opacity .3s ease .25s; }
.sel-progress.on { opacity:1; transition-delay:0s; }
.sel-progress i { display:block; height:100%; background:var(--cyan); transform-origin:0 50%; transform:scaleX(var(--p, 0)); transition:transform .18s linear; }
@media (prefers-reduced-motion:no-preference) {
  .sel-primary.pulse { animation:selpulse 1.1s ease-out 1; }
  @keyframes selpulse { 0% { box-shadow:0 0 0 0 rgba(63,223,255,.65); } 100% { box-shadow:0 0 0 14px rgba(63,223,255,0); } }
}
.sel-primary.ready { background:var(--cyan); border-color:var(--cyan); color:var(--black); }
@media (hover:hover) {
  .sel-btn:hover:not(:disabled) { color:var(--cyan); border-color:var(--cyan); }
  .sel-primary:hover:not(:disabled) { background:var(--black); }
  .sel-primary.ready:hover:not(:disabled) { background:var(--black); color:var(--cyan); }
}
@media (max-width:640px) {
  .selbar-in { flex-direction:column; align-items:stretch; gap:8px; }
  .sel-info { margin:0; font-size:10px; letter-spacing:.12em; }
  .sel-actions { gap:6px; }
  .sel-btn { flex:1 1 auto; height:44px; padding:0 6px; font-size:10px; letter-spacing:.1em; }
  .sel-primary { flex:1.5 1 auto; padding:0 6px; font-size:10px; letter-spacing:.1em; }
}
.lb {
  position:fixed; inset:0; z-index:100; background:var(--black);
  opacity:0; transition:opacity .2s ease; touch-action:pan-y pinch-zoom; overscroll-behavior:contain;
}
.lb.on { opacity:1; }
.lb-top {
  position:absolute; top:0; left:0; right:0; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:calc(8px + env(safe-area-inset-top)) calc(var(--gutter) - 4px) 8px var(--gutter);
}
.lb-meta { display:flex; align-items:baseline; gap:14px; min-width:0; }
.lb-count { font-size:12px; font-weight:700; letter-spacing:.16em; color:var(--white); white-space:nowrap; }
.lb-name { font-size:10px; letter-spacing:.14em; color:var(--gray-mid); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lb-actions { display:flex; align-items:center; gap:6px; flex:none; }
.lb-btn { width:44px; height:44px; display:grid; place-items:center; color:var(--white); opacity:.85; transition:color var(--t), opacity var(--t); }
.lb-btn svg { display:block; }
.lb-sel { position:relative; }
.lb-play .ic-pause { display:none; }
.lb-play[data-playing="1"] .ic-play { display:none; }
.lb-play[data-playing="1"] .ic-pause { display:block; }
.lb-dls {
  position:absolute; z-index:3; display:flex; gap:8px;
  top:calc(12px + env(safe-area-inset-top)); right:calc(var(--gutter) + 148px);
}
.lb-dls[hidden] { display:none; }
.lb-dl {
  display:flex; align-items:center; justify-content:center; white-space:nowrap; text-align:center;
  height:36px; padding:0 12px; font:700 11px/1 var(--mono); letter-spacing:.16em; text-transform:uppercase; color:var(--white);
  border:1px solid var(--edge); background:rgba(0,0,0,.35);
  transition:color var(--t), border-color var(--t), background var(--t);
}
.lb-dl[hidden] { display:none; }
.lb-dl-size { margin-left:8px; font-size:10px; font-weight:400; letter-spacing:.1em; color:var(--gray-mid); text-transform:none; transition:color var(--t); }
.lb-dl-size::before { content:'\00b7\00a0'; }
.lb-dl.primary { color:var(--black); background:var(--cyan); border-color:var(--cyan); }
.lb-dl.primary .lb-dl-size { color:rgba(0,0,0,.66); }
.lb-dl.ready { color:var(--black); background:var(--cyan); border-color:var(--cyan); box-shadow:0 0 0 2px var(--cyan-glow); }
.lb-dl.ready .lb-dl-size { color:rgba(0,0,0,.66); }
.lb-dl.busy { border-color:var(--cyan); }
@media (pointer:coarse) { .lb-dl { height:44px; } }
@media (hover:hover) {
  .lb-btn:hover { color:var(--cyan); opacity:1; }
  .lb-dl:not(.primary):hover { color:var(--cyan); border-color:var(--cyan); }
  .lb-dl:not(.primary):hover .lb-dl-size { color:var(--cyan); }
  .lb-dl.primary:hover { box-shadow:0 0 0 2px var(--cyan-glow); }
}
.lb-stage {
  touch-action:pinch-zoom;
  overscroll-behavior:contain;
  position:absolute; inset:0; padding:calc(60px + env(safe-area-inset-top)) 76px calc(24px + env(safe-area-inset-bottom));
  display:block;
}
.lb-frame { position:relative; width:100%; height:100%; overflow:hidden; }
.lb-track { position:absolute; inset:0; transform:translate3d(0,0,0); }
.lb-track.moving { will-change:transform; }
.lb-img {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:contain; user-select:none; -webkit-user-select:none; -webkit-user-drag:none;
}
.lb-vid { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:transparent; z-index:1; opacity:0; }
.lb-vid.ready { opacity:1; transition:opacity .25s ease; }
.lb-vid[hidden] { display:none; }
.lb-card { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; z-index:2; pointer-events:none; }
.lb-card.fade { opacity:0; transition:opacity .3s ease; }
.lb-card[hidden] { display:none; }
.lb-bigplay { position:absolute; z-index:4; left:50%; top:50%; transform:translate(-50%,-50%); width:96px; height:96px; display:grid; place-items:center; cursor:pointer;
  color:var(--white); background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.5); }
.lb-bigplay svg { display:block; margin-left:4px; }
.lb-bigplay:focus-visible { border-color:var(--cyan); }
@media (hover:hover) { .lb-bigplay:hover { border-color:var(--cyan); color:var(--cyan); } }
.lb-bigplay[hidden] { display:none; }
.lb-sound { position:absolute; z-index:4; left:50%; top:16px; transform:translateX(-50%); min-height:44px; padding:0 18px; display:flex; align-items:center; cursor:pointer;
  font-size:11px; font-weight:700; letter-spacing:.16em; color:var(--white); background:rgba(0,0,0,.7); border:1px solid rgba(255,255,255,.4); white-space:nowrap; }
.lb-sound:focus-visible { border-color:var(--cyan); }
@media (hover:hover) { .lb-sound:hover { border-color:var(--cyan); } }
.lb-sound[hidden] { display:none; }
.lb-scrubimg { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; z-index:2; pointer-events:none; user-select:none; -webkit-user-select:none; }
.lb-scrubimg[hidden] { display:none; }
.lb-mnote { position:absolute; z-index:3; left:50%; transform:translateX(-50%); top:calc(60px + env(safe-area-inset-top)); margin:0; padding:8px 12px;
  font-size:10px; letter-spacing:.12em; color:var(--white); background:rgba(0,0,0,.75); border:1px solid var(--edge); white-space:nowrap; max-width:calc(100% - 2 * var(--gutter)); overflow:hidden; text-overflow:ellipsis; }
.lb-mnote[hidden] { display:none; }
.lb-media {
  position:absolute; z-index:3; left:50%; transform:translateX(-50%); bottom:calc(28px + env(safe-area-inset-bottom));
  width:min(760px, calc(100% - 200px)); min-height:48px; display:flex; align-items:center; gap:6px; padding:2px 8px 2px 2px;
  background:rgba(0,0,0,.62); border:1px solid var(--gray-line);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.lb-media[hidden] { display:none; }
.lb-media.mb-below { bottom:auto; }
.lb-media.mb-auto { transition:opacity .25s ease; }
.lb-media.mb-off { opacity:0; pointer-events:none; }
.lb-mbtn { flex:none; height:44px; min-width:44px; display:grid; place-items:center; color:var(--white); opacity:.9; transition:color var(--t), opacity var(--t), border-color var(--t); }
.lb-mbtn[hidden] { display:none; }
.lb-mbtn svg { display:block; }
.lb-mplay .ic-pause, .lb-mplay[data-playing="1"] .ic-play { display:none; }
.lb-mplay[data-playing="1"] .ic-pause { display:block; }
.lb-mute .ic-sound, .lb-mute[data-muted="1"] .ic-sound { display:none; }
.lb-mute[data-muted="0"] .ic-sound { display:block; }
.lb-mute[data-muted="0"] .ic-muted { display:none; }
.lb-mtime { flex:none; min-width:76px; font-size:10px; letter-spacing:.1em; color:var(--gray-mid); text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.lb-saveframe {
  height:44px; padding:0 12px; font-size:10px; font-weight:700; letter-spacing:.16em; border:1px solid var(--edge); white-space:nowrap;
}
.lb-saveframe.ready { color:var(--black); background:var(--cyan); border-color:var(--cyan); opacity:1; }
.lb-scrubwrap { flex:1 1 auto; min-width:60px; height:44px; display:flex; align-items:center; cursor:pointer; touch-action:none; }
.lb-scrub { width:100%; height:28px; margin:0; accent-color:var(--cyan); background:transparent; pointer-events:none; }
@media (hover:hover) {
  .lb-mbtn:hover { color:var(--cyan); opacity:1; }
  .lb-saveframe:hover { border-color:var(--cyan); }
  .lb-saveframe.ready:hover { color:var(--black); }
}
.lb-nav {
  position:absolute; top:50%; z-index:3; transform:translateY(-50%); width:56px; height:56px;
  display:grid; place-items:center; color:var(--white); opacity:.7;
  transition:color var(--t), opacity var(--t), border-color var(--t);
}
@media (hover:hover) { .lb-nav:hover { opacity:1; color:var(--cyan); } }
.lb-prev { left:10px; }
.lb-next { right:10px; }
@media (max-width:700px) {
  .lb-stage { padding:calc(56px + env(safe-area-inset-top)) 0 calc(76px + env(safe-area-inset-bottom)); }
  .lb-nav { top:auto; bottom:calc(14px + env(safe-area-inset-bottom)); transform:none; width:52px; height:52px; border:1px solid var(--gray-line); border-radius:50%; opacity:.9; }
  @media (hover:hover) { .lb-nav:hover { border-color:var(--cyan); } }
  .lb-prev { left:var(--gutter); }
  .lb-next { right:var(--gutter); }
  .lb-name { display:none; }
  .lb-dls {
    top:auto; left:calc(var(--gutter) + 60px); right:calc(var(--gutter) + 60px); justify-content:center; gap:6px;
    bottom:calc(14px + env(safe-area-inset-bottom));
  }
  .lb-dl { flex:1 1 0; min-width:0; max-width:170px; height:52px; padding:0 6px; flex-direction:column; gap:3px; font-size:10px; letter-spacing:.12em; background:rgba(0,0,0,.6); }
  .lb-dl.primary, .lb-dl.ready { background:var(--cyan); }
  .lb-dl-size { margin-left:0; font-size:10px; letter-spacing:.06em; }
  .lb-dl-size::before { content:none; }
  .lb-media { width:calc(100% - 2 * var(--gutter)); bottom:calc(76px + env(safe-area-inset-bottom)); flex-wrap:wrap; gap:0 4px; padding:0 4px; }
  .lb-scrubwrap { flex:1 0 100%; order:-1; }
  .lb-mtime { flex:1 1 auto; min-width:0; font-size:9px; letter-spacing:.06em; text-align:center; }
  .lb-saveframe { padding:0 9px; font-size:9px; letter-spacing:.12em; }
}
.cover { --cue-h:calc(1.2 * clamp(12px, 1vw, 16px) + 40px); }
.cover-cue { position:absolute; left:0; right:0; bottom:calc(26.4px + env(safe-area-inset-bottom)); z-index:3; display:flex; justify-content:center; pointer-events:none; transition:opacity .3s ease; }
.cover-cue.gone { opacity:0; }
.cover-cue.gone .cue-btn { pointer-events:none; }
.cue-btn {
  pointer-events:auto; display:flex; flex-direction:column; align-items:center; gap:6px; padding:0 8px;
  font:700 clamp(12px, 1vw, 16px)/1.2 var(--mono); letter-spacing:.18em; text-transform:uppercase; color:var(--white);
  opacity:0; transform:scale(.4);
  animation:scrollPop .55s cubic-bezier(.34,1.56,.64,1) 1.2s forwards, scrollBob 2.2s ease-in-out 1.9s infinite;
}
.cue-btn svg { width:24px; height:34px; display:block; }
.cue-btn { position:relative; }
.cue-btn::before { content:""; position:absolute; left:50%; top:50%; width:max(100%, 44px); height:max(100%, 44px); transform:translate(-50%, -50%); }
@media (min-width:701px) and (min-height:941px) { .cover { --cue-h:calc(1.2 * clamp(12px, 1vw, 16px) + 56px); } .cue-btn svg { width:36px; height:50px; } }
@keyframes scrollPop { 0% { opacity:0; transform:scale(.4); } 60% { opacity:1; transform:scale(1.12); } 100% { opacity:1; transform:scale(1); } }
@keyframes scrollBob { 0%, 100% { transform:translateY(0); } 50% { transform:translateY(6px); } }
@media (prefers-reduced-motion:reduce) { .cue-btn { animation:none !important; opacity:1; transform:none; } }
.cover-text, .cover-text:has(.has-accent) { padding-bottom:calc(26.4px + var(--cue-h) + 20.4px + env(safe-area-inset-bottom)); }
@media (max-height:520px) {
  .cover { --cue-h:20px; }
  .cover-panel { padding-top:calc(10px + env(safe-area-inset-top)); }
  .cover-cue { bottom:calc(12.4px + env(safe-area-inset-bottom)); }
  .cue-btn { padding:0 8px; animation:none; opacity:1; transform:none; }
  .cue-btn span { display:none; }
  .cue-btn svg { width:13px; height:20px; }
  .cover-text, .cover-text:has(.has-accent) { padding-bottom:calc(12.4px + var(--cue-h) + 18px + env(safe-area-inset-bottom)); }
  .cover-cta { min-height:38px; padding:0 26px; font-size:11px; position:relative; }
  .cover-cta::after { content:''; position:absolute; left:-1px; right:-1px; top:-4px; bottom:-4px; }
  .cover-date { margin-bottom:10px; }
  .cover-title, .cover-title.has-accent { margin-bottom:8px; }
}
@media (max-height:520px) and (orientation:landscape) {
  .tb-inner { padding:5px var(--gutter); gap:6px 14px; }
  .tb-title { flex-direction:row; align-items:baseline; gap:10px; }
  .tb-name { font-size:22px; white-space:nowrap; display:block; -webkit-line-clamp:unset; }
  .res-row { display:contents; }
  .res { flex:none; max-width:none; }
  .res-btn { flex:none; min-width:88px; padding:0 10px; gap:0; }
  .res-s { display:none; }
  .tb-actions .tb-label { display:none; }
  .tb-actions .tb-btn { padding:0; min-width:44px; }
  .ppl-panel { width:min(780px, calc(100vw - 2 * var(--gutter))); }
  .lb-dl { flex:none; width:132px; height:44px; padding:0 6px; flex-direction:column; gap:3px; font-size:10px; letter-spacing:.12em; overflow:hidden; }
  .lb-dl-size { margin-left:0; letter-spacing:.06em; }
  .lb-dl-size::before { content:none; }
}
html.og { overflow:hidden; scrollbar-gutter:auto; }
html.og *, html.og *::before, html.og *::after { transition:none !important; animation:none !important; }
html.og .toolbar, html.og .grid-wrap, html.og .foot, html.og .selbar, html.og .cover-cue, html.og .lb, html.og .toast, html.og #coverCta { display:none !important; }
html.og .cover { height:100vh; min-height:0; }
html.og .cover-panel { padding:44px 52px 0; }
html.og .cover-brand, html.og .cover-brand.has-cobrand { font-size:44px; }
html.og .cover-text, html.og .cover-text:has(.has-accent) { padding-bottom:30px; }
html.og .cover-date { font-size:20px; margin:14px 0 0; }
html.og .cover-title { margin-bottom:0; }
body.empty #cover, body.empty #toolbar, body.empty #gridWrap { display:none; }
body.empty .foot { min-height:100vh; align-items:center; }
body.empty .foot img { height:28px; opacity:.9; }
html.measuring *, html.measuring *::before, html.measuring *::after { transition:none !important; }
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}
