
.hero-grid { --g-d: min(86svh, 58vw); --g-gap: 0.6; }
@media (max-width: 1180px) { .hero-grid { --g-d: min(76svh, 60vw); --g-gap: 0.4; } }
@media (min-width: 1920px) { .hero-grid { --g-d: min(84svh, 50vw); } }
@media (max-width: 720px) { .hero-grid { --g-d: 96vw; } .g-anchor { height: calc(var(--g-d) * 1.02); } .poster { top: calc(var(--g-d) * 0.51); } }


.ticker { display: flex; align-items: stretch; height: 44px; grid-template-rows: none; }
.tk-view { flex: 1 1 auto; min-width: 0; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 18px, #000 calc(100% - 28px), transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 18px, #000 calc(100% - 28px), transparent 100%); }
.tk-track { will-change: transform; }
.tk-item { padding: 0 16px 0 16px; margin-right: 0; gap: 8px; }
.tk-item::after { top: 12px; bottom: 12px; }
.tk-f { width: 16px; height: 12px; flex: none; object-fit: cover; display: inline-block; }
.tk-f-none { background: var(--surface-2); outline: 1px solid var(--hairline); }
.tk-c.up { color: var(--movement-up-text); } .tk-c.dn { color: var(--down-text); } .tk-c.flat { color: var(--secondary); }
.tk-pause { width: 44px; height: auto; border: 0; border-left: 1px solid var(--hairline); color: var(--secondary); background: none; flex: none; }
.tk-pause:hover, .tk-pause[aria-pressed="true"] { color: var(--accent); }
.tk-pause:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.rm .tk-view { overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; -webkit-mask-image: none; mask-image: none; }
.tk-view:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.rm .tk-pause { display: none; }
@media (max-width: 720px) { .ticker { order: 3; margin: var(--sp-2) calc(-1 * var(--edge)) 0; border-inline: 0; } }


.gp-card { position: fixed; left: 0; top: 0; z-index: 4; display: block; width: 300px; height: auto; padding: 14px 16px 12px; white-space: normal; background: var(--surface-1-a94); border: 1px solid var(--hairline-strong); font-family: var(--sans); font-size: 12px; letter-spacing: 0; color: var(--ink-soft); pointer-events: auto; }
.gp-card::before, .gp-card::after { content: ''; position: absolute; width: 8px; height: 8px; border-color: var(--accent); border-style: solid; }
.gp-card::before { left: -1px; top: -1px; border-width: 1px 0 0 1px; } .gp-card::after { right: -1px; bottom: -1px; border-width: 0 1px 1px 0; }
.gc-h { display: flex; align-items: center; gap: 10px; }
.gc-flag { width: 20px; height: 15px; flex: none; object-fit: cover; display: inline-block; }
.gc-flag-none { background: var(--surface-2); outline: 1px solid var(--hairline); }
.gc-name { font-family: var(--sans); font-weight: 500; font-size: 15px; color: var(--ink); flex: 1; }
.gc-x { all: unset; cursor: pointer; width: 22px; height: 22px; display: grid; place-items: center; color: var(--secondary); font-size: 16px; }
.gc-x:hover { color: var(--ink); } .gc-x:focus-visible { outline: 2px solid var(--accent); }
.gc-n { display: flex; align-items: baseline; gap: 12px; margin: 8px 0 8px; font-family: var(--mono); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; font-variant-numeric: tabular-nums; }
.gc-score { font-family: var(--mono); font-weight: 500; font-size: 26px; letter-spacing: 0; color: var(--ink); }
.gc-chg.up { color: var(--movement-up-text); } .gc-chg.dn { color: var(--down-text); } .gc-chg.flat { color: var(--secondary); }
.gc-k { margin: 0 0 6px; font-family: var(--mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--secondary); }
.gc-ev { border-top: 1px solid var(--hairline); padding-top: 9px; }
.gc-hl { color: var(--ink); text-decoration: none; display: block; line-height: 1.45; transition: color var(--dur-fast) var(--ease-out); }
.gc-hl:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; } .gc-hl:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.gc-src { margin: 5px 0 0; font-family: var(--mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--secondary); }
.gc-none { margin: 0; color: var(--ink-soft); }
.gp-card.gc-sheet { left: 0; right: 0; top: auto; bottom: 0; width: auto; transform: none !important; padding: 16px var(--edge) 22px; background: var(--surface-1); border-width: 1px 0 0; }


.reticle { position: fixed; left: -23px; top: -23px; z-index: 3; width: 46px; height: 46px; border: 1px solid rgba(255, 255, 255, .85); border-radius: 50%; pointer-events: none; }
.reticle::before, .reticle::after { content: ''; position: absolute; background: rgba(255, 255, 255, .85); }
.reticle::before { left: 50%; top: -10px; bottom: -10px; width: 1px; } .reticle::after { top: 50%; left: -10px; right: -10px; height: 1px; }
.reticle-ro { position: fixed; left: 0; top: 0; z-index: 3; padding: 4px 8px; font-family: var(--mono); font-size: 11px; line-height: 1.6; letter-spacing: .08em; text-transform: uppercase; color: var(--ink); background: rgba(0, 0, 0, .55); border-left: 1px solid var(--accent); white-space: nowrap; pointer-events: none; font-variant-numeric: tabular-nums; }
.reticle[hidden], .reticle-ro[hidden] { display: none; }
.ret-on .run { cursor: none; }
.pt-hover .run { cursor: pointer; }


.globe-kb { position: absolute; left: var(--edge); bottom: 8px; z-index: 5; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.globe-kb:focus { width: auto; height: auto; clip-path: none; overflow: visible; padding: 6px 10px; background: var(--surface-1); color: var(--ink); border: 1px solid var(--accent); font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; outline: none; }
.globe-kb:focus::after { content: ' · Left Right rotate · Enter select · Esc close'; color: var(--secondary); }
.globe-ring { position: fixed; left: 0; top: 0; z-index: 2; border: 2px solid var(--accent); border-radius: 50%; box-shadow: 0 0 0 4px var(--accent-a16); pointer-events: none; display: none; }
.kb-on .globe-ring { display: block; }
#gp-list button:focus-visible { outline: none; }
.capture .reticle, .capture .reticle-ro, .capture .gp-card, .capture .globe-ring { display: none !important; }


.capture-posterdisc .hero-grid { --g-d: 800px; }
.capture-posterdisc .g-anchor { left: 50% !important; top: 50% !important; }
.capture-posterdisc .hero { padding-top: 0; }
.capture-posterdisc .masthead { display: none; }
.capture-posterdisc .slot { height: 100vh; height: 100svh; }


.footer-credits { margin: var(--sp-3) 0 0; font-size: var(--t-small); line-height: var(--t-small-lh); color: var(--faint); max-width: 90ch; }
