.marquee{gap:var(--space-2);padding:var(--space-3) 0 var(--space-2);background:var(--color-glass);display:grid}.marquee-window{padding-block:var(--space-2);border-block:1px solid var(--color-line-soft);-webkit-mask-image:linear-gradient(to right, transparent, #000 var(--space-16), #000 calc(100% - var(--space-16)), transparent);mask-image:linear-gradient(to right, transparent, #000 var(--space-16), #000 calc(100% - var(--space-16)), transparent);touch-action:pan-y;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}@media (prefers-reduced-motion:no-preference){.marquee-window{cursor:grab}.marquee-window:active{cursor:grabbing}}.marquee-window:after{content:"";background:var(--color-accent);opacity:.45;pointer-events:none;width:2px;position:absolute;inset:0 auto 0 50%;translate:-50%}.marquee-track{width:max-content;animation:marquee-scroll calc(var(--count) * 2s) linear infinite;display:flex}.marquee-track li{place-items:center;width:64px;height:48px;display:grid}.marquee-track .goal-icon{width:48px;height:48px}@keyframes marquee-scroll{to{translate:-50%}}.marquee-label{min-height:1lh;font:var(--text-md) / var(--leading-tight) var(--font-display);--shadow:var(--text-shadow);text-align:center}.mini-board{justify-items:center;gap:var(--space-3);--beside:calc(2 * var(--space-4));width:100%;display:grid;container-type:inline-size}.mini-board[data-mode=blackout]{--beside:calc(2 * (24px + 2 * var(--space-0-5) + var(--space-3)))}.mini-board-row{align-items:center;gap:var(--space-3);display:flex}.mini-board-frame{--mini-px:min(2px, (100cqw - var(--beside)) / var(--frame));width:calc(var(--frame) * var(--mini-px));aspect-ratio:1;outline-offset:var(--space-1);transition:outline-color var(--duration-base) var(--ease-standard);outline:2px solid #0000;position:relative}.mini-board-frame canvas{width:100%;height:100%;image-rendering:pixelated;position:absolute;inset:0}[data-stage=win] .mini-board-frame{outline-color:var(--color-gold)}.mini-board-frame:after{content:"";top:calc(-1 * var(--space-3));right:calc(-1 * var(--space-3));width:24px;height:24px;image-rendering:pixelated;opacity:0;transition:opacity var(--duration-fast) var(--ease-out), scale var(--duration-fast) var(--ease-out);background:url(/game-ui/items/nether_star.png) 50%/contain no-repeat;position:absolute;scale:.8}[data-stage=win] .mini-board-frame:after{opacity:1;scale:1}.mini-board-grid{inset:calc(var(--mini-rim) * var(--mini-px));grid-template-columns:repeat(var(--size), minmax(0, 1fr));display:grid;position:absolute}.mini-board-cell{padding:var(--mini-px);background-color:var(--player-color,transparent);transition:background-color var(--duration-fast) var(--ease-out);background-clip:content-box;overflow:hidden}.mini-board-cell>.goal-icon{width:100%;height:100%}:where([data-stage=draft][data-mode=draftout] .mini-board-cell)>.goal-icon{animation:mini-board-land var(--duration-base) var(--ease-out) both;animation-delay:calc(var(--i) * var(--ready-ms) / (var(--size) * var(--size) + 3))}@keyframes mini-board-land{0%{opacity:0;translate:0 calc(-8 * var(--mini-px));scale:.75}}:where([data-stage=draft][data-mode=blackout] .mini-board-cell)>.goal-icon{animation:mini-board-deal var(--duration-base) var(--ease-out) both}@keyframes mini-board-deal{0%{opacity:0}}.mini-board-reel{height:100%;animation:mini-board-spin var(--spin-ms) linear both, mini-board-blur var(--spin-ms) linear both;grid-auto-rows:100%;display:grid}.mini-board-reel>.goal-icon{width:100%;height:100%}@keyframes mini-board-spin{to{translate:0 calc(-100% * var(--spins))}}@keyframes mini-board-blur{10%,80%{filter:blur(2.5px)}}.mini-board-players{gap:var(--space-8);display:grid}.mini-board-players>span{padding:var(--space-0-5);color:var(--player-color);opacity:.6;outline:1px solid #0000;display:grid}.mini-board-players .icon{width:24px;height:24px}.mini-board-players>[data-active]{outline-color:var(--player-color);opacity:1;animation:mini-board-player var(--duration-slow) var(--ease-out)}@keyframes mini-board-player{0%{scale:1.3}}.mini-board-status{justify-content:center;align-items:center;gap:var(--space-2);min-height:1lh;font:var(--text-md) / var(--leading-tight) var(--font-display);--shadow:var(--text-shadow);display:flex}.mini-board-status img{width:24px;height:24px;image-rendering:pixelated}[data-stage=win]>.mini-board-status{color:var(--color-gold)}.modes{--tint:10%;--tint-lit:16%;gap:var(--space-5);max-width:var(--content-width);margin:var(--space-16) auto var(--space-8);padding-inline:var(--space-6);display:grid}@media (width<=1200px){.modes{margin-top:var(--space-8);padding-inline:var(--space-5)}}.modes-title{justify-content:space-between;align-items:center;gap:var(--space-4);flex-wrap:wrap;display:flex}.modes-title h2{font:var(--text-lg) / var(--leading-tight) var(--font-display);--shadow:var(--text-shadow)}.modes-queues{gap:var(--space-5);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}@media (width<=1200px){.modes-queues{grid-template-columns:minmax(0,1fr)}}.modes-card,.modes-lobbies{--panel-padding:var(--space-5);--panel-background:color-mix(in srgb, var(--tone) var(--tint), var(--color-bg-deep))}.modes-card[data-playing]{--tint:var(--tint-lit)}@media (hover:hover){.modes-card:hover{--tint:var(--tint-lit)}}.modes-card-progress{inset:auto var(--rim-shade) var(--rim-shade) var(--rim-lit);background:var(--tone)}.modes-identity{margin:calc(-1 * var(--panel-padding)) calc(-1 * var(--panel-padding)) 0;padding:var(--space-4) var(--space-5);border-bottom:2px solid var(--color-seam-dark);background:color-mix(in srgb, var(--tone) 4%, var(--color-bg-deep));box-shadow:inset 0 -2px 0 var(--color-seam-light);text-align:start;position:relative;overflow:hidden}.modes-identity h3{font-size:var(--text-lg)}.modes-identity p{margin-top:var(--space-2);color:var(--color-text);display:grid}.modes-watermark{top:50%;right:calc(-1 * var(--space-3));color:var(--tone);opacity:.12;pointer-events:none;position:absolute;translate:0 -50%}.modes-watermark .icon{width:120px;height:120px}.modes-queue{gap:var(--space-4);text-align:center;grid-template:"identity identity""preview facts"1fr/minmax(0,1fr) minmax(0,1fr);display:grid}.modes-queue>.modes-identity{grid-area:identity}.modes-queue>.modes-facts{grid-area:facts}.modes-preview{grid-area:preview;place-items:center;display:grid}.modes-preview>*{transition:opacity var(--duration-slow) var(--ease-standard), visibility var(--duration-slow);grid-area:1/1}.modes-card:not([data-playing]) .modes-preview>.modes-preview-board,.modes-card[data-playing] .modes-preview>.modes-facts{opacity:0;visibility:hidden}.modes-preview-board{width:100%}.modes-facts{align-self:center;gap:var(--space-5);grid-template-rows:1fr 1fr;display:grid}.modes-facts li{justify-content:center;align-items:center;gap:var(--space-3);color:var(--color-text);font:var(--text-sm) / var(--leading-tight) var(--font-display);--shadow:var(--text-shadow);text-wrap:balance;flex-direction:column;display:flex}.modes-facts span{min-height:2lh}.modes-facts .icon{width:36px;height:36px;color:var(--tone);filter:drop-shadow(2px 2px 0 var(--color-bg-deep))}.modes-lobbies{gap:var(--space-5);display:grid}.modes-lobbies>ul{--tint:5%;--tint-lit:12%;gap:var(--space-4);display:flex}.modes-lobbies>ul>li{min-width:0;transition:flex-grow var(--duration-slow) var(--ease-standard);flex:1 1 0}.modes-lobbies>ul>:has(>[data-playing]){flex-grow:1.5}@media (width<=1200px){.modes-lobbies>ul{display:grid}}.modes-lobby{--board-room:calc(94 * 2px + 2 * var(--space-4));height:100%;color:var(--color-text);text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex}.modes-lobby h3{font-size:var(--text-md)}@media (width>1200px){.modes-lobby>:is(h3,p,.modes-lobby-board){transition:translate var(--duration-slow) var(--ease-standard), opacity var(--duration-slow) var(--ease-standard), visibility var(--duration-slow)}.modes-lobby:not([data-playing])>h3{translate:0 calc(var(--board-room) / 2)}.modes-lobby:not([data-playing])>p{translate:0 calc(var(--board-room) / -2)}.modes-lobby:not([data-playing])>.modes-lobby-board{opacity:0;visibility:hidden}}:is(.modes-identity,.modes-lobby) h3{align-items:center;gap:var(--space-3);color:var(--tone);font-family:var(--font-display);font-weight:400;line-height:var(--leading-tight);--shadow:var(--text-shadow);display:flex}:is(.modes-identity,.modes-lobby) h3 .icon{width:24px;height:24px}.modes-lobby-description{margin-block:var(--space-3);display:grid}.modes-lobby-board{width:100%;height:var(--board-room);margin-top:var(--space-3);place-items:center;display:grid}.modes-players{align-items:center;gap:var(--space-2);color:var(--color-text-muted);display:flex}.showcase{grid-template:"board rail" minmax(0, 1fr) / minmax(0, 1fr) var(--rail-width);gap:var(--space-4) var(--space-6);--rail-width:260px;height:600px;display:grid}.showcase .showcase-board{transition:opacity var(--fade-ms) var(--ease-standard)}.showcase[data-ending] :is(.showcase-board,.showcase-chat){opacity:0}@media (width<=1200px){.showcase{grid-template:"board"480px"rail"/minmax(0,1fr);height:auto}}.showcase-board{z-index:var(--layer-raised);grid-area:board;min-height:0}.showcase-rail{gap:var(--space-4);min-height:0;padding-block:calc(var(--board-moment) + var(--board-gap)) calc(var(--board-clock) + var(--board-gap));flex-direction:column;grid-area:rail;display:flex}@media (width<=1200px){.showcase-rail{padding-block:0}.showcase-rail>.showcase-chat{order:-1}}.showcase-stages{gap:var(--space-2);display:grid}.showcase-stages .button{justify-content:flex-start;width:100%}.showcase-stage-progress{inset:auto var(--rim-shade) var(--rim-shade) calc(var(--frame-start) + var(--rim-lit));background:var(--color-accent)}.showcase-banners{place-items:center;width:100%;display:grid}.showcase-banners>*{grid-area:1/1}.showcase-banner{font:min(calc(10 * var(--pick-px)), 4.4cqw) / var(--leading-none) var(--font-display);transition:opacity var(--duration-slow) var(--ease-standard), scale var(--duration-slow) var(--ease-standard), visibility var(--duration-slow);display:grid}.showcase-banner:not([data-shown]){opacity:0;visibility:hidden;scale:.96}.showcase-banner .showcase-banner-line{color:#fff;--shadow:var(--text-shadow);white-space:nowrap;background:#262;border:.1em solid #a0a0a0;align-items:center;gap:.4em;height:2.4em;padding-inline:.8em;display:flex}.showcase-banner[data-turn=theirs] .showcase-banner-line{background:#444}.showcase-banner[data-turn=done] .showcase-banner-line{background:#000}.showcase-banner .icon{width:1em;height:1em}.showcase-pick-timer{background:#000;height:.1em}.showcase-pick-timer:before{content:"";background:var(--color-win);transform-origin:0;height:100%;animation:10s linear both showcase-pick-timer;display:block}[data-turn=theirs]>.showcase-pick-timer:before{background:var(--color-draw)}.showcase-pick-timer[data-stopped]:before{animation-play-state:paused}@keyframes showcase-pick-timer{to{scale:0 1}}.showcase-cursor{top:calc(20 * var(--pick-px));left:calc(20 * var(--pick-px));z-index:var(--layer-raised);pointer-events:none;width:32px;height:32px;transition:left var(--duration-slow) var(--ease-standard), opacity var(--duration-fast) var(--ease-standard);animation:showcase-cursor-in var(--duration-base) var(--ease-out);position:absolute}.showcase-cursor:before{content:"";image-rendering:pixelated;transform-origin:0 0;transition:scale var(--duration-fast) var(--ease-standard);background:url(/game-ui/draft/cursor-you.png) 0 0/100% no-repeat;position:absolute;inset:0}.showcase-cursor[data-player=opponent]:before{background-image:url(/game-ui/draft/cursor-opponent.png)}.showcase-cursor[data-side=right]{left:calc(88 * var(--pick-px))}.showcase-cursor[data-pressed]:before{scale:.85}.showcase-cursor[data-gone]{opacity:0}@keyframes showcase-cursor-in{0%{opacity:0;translate:0 calc(16 * var(--pick-px))}}.showcase-cursor>.showcase-cursor-name{inset:auto auto calc(100% + var(--space-1)) var(--space-4);width:max-content;position:absolute}@media (width<=600px){.showcase-cursor>.showcase-cursor-name{max-width:min(200px,50vw);inset:0 auto auto var(--space-8);translate:0 -50%}[data-side=right]>:is(.showcase-cursor>.showcase-cursor-name){inset:0 calc(100% + var(--space-1)) auto auto}}.showcase-clock-line{display:inline-grid}.showcase-clock-line>*{grid-area:1/1;place-self:center}.showcase-clock-line>.showcase-banner{font-size:var(--text-sm)}@property --counted{syntax:"<number>";inherits:false;initial-value:0}@keyframes showcase-count{to{--counted:1}}.showcase-clock{--seconds:round(down, var(--counted) * var(--match-s), 1);transition:opacity var(--duration-slow) var(--ease-standard);counter-reset:minutes round(down, var(--seconds) / 60, 1) seconds mod(var(--seconds), 60);animation:showcase-clock-ready calc(var(--race-delay) / 2) var(--ease-standard) 2, showcase-clock-go var(--duration-slow) var(--ease-out) var(--race-delay) backwards, showcase-count var(--race-ms) var(--race-pace) var(--race-delay) both;display:inline-block}.showcase-clock:after{content:counter(minutes, decimal-leading-zero) ":" counter(seconds, decimal-leading-zero)}.showcase-clock[data-won]{--counted:1;animation:none}.showcase-clock[data-hidden]{opacity:0}.showcase-rating{--count-ms:calc(2 * var(--duration-slow));align-items:center;gap:var(--space-2);color:var(--color-text);font:var(--text-lg) / var(--leading-none) var(--font-display);--shadow:var(--text-shadow);transition:opacity var(--duration-slow) var(--ease-standard), visibility var(--duration-slow);display:flex}.showcase-rating:not([data-shown]){opacity:0;visibility:hidden}.showcase-rating .showcase-rating-head{width:32px;height:32px;image-rendering:pixelated}.showcase-rating b{color:var(--color-win);font-size:var(--text-md);font-weight:400}.showcase-rating:where([data-shown]) b{animation:showcase-rating-change var(--duration-slow) var(--ease-out) calc(var(--duration-slow) + var(--count-ms)) both}.showcase-rating-value{counter-reset:rating round(var(--rating-from) + (var(--rating-to) - var(--rating-from)) * var(--counted))}.showcase-rating-value:after{content:counter(rating)}:where([data-shown])>.showcase-rating-value{animation:showcase-count var(--count-ms) var(--ease-out) var(--duration-slow) both}.showcase-rating-unit{color:var(--color-text-muted);font-size:var(--text-md)}@keyframes showcase-rating-change{0%{opacity:0;translate:0 var(--space-2)}}@keyframes showcase-clock-ready{50%{opacity:.3}}@keyframes showcase-clock-go{0%{color:var(--color-text);scale:1.3}}.showcase-win{color:var(--color-gold);font:var(--text-xl) / var(--leading-none) var(--font-display);--shadow:var(--text-shadow);transition:opacity var(--duration-base) var(--ease-out), scale var(--duration-base) var(--ease-out), visibility var(--duration-base)}.showcase-win:not([data-shown]){opacity:0;visibility:hidden;scale:.8}.showcase-chat{min-height:0;-webkit-mask-image:linear-gradient(#000 calc(100% - var(--space-12)), transparent);mask-image:linear-gradient(#000 calc(100% - var(--space-12)), transparent);color:var(--color-text);font:var(--text-sm) / var(--leading-tight) var(--font-display);--shadow:var(--text-shadow);--settle:calc(2 * var(--duration-slow));transition:opacity var(--settle) var(--ease-standard), filter var(--settle) var(--ease-standard);flex-direction:column;flex:1;display:flex;overflow:hidden}.showcase-chat[data-fast]{opacity:var(--disabled-opacity);filter:blur(1.5px)}.showcase-chat p{padding:var(--space-1) var(--space-2);background:var(--color-scrim);animation:showcase-chat-in var(--duration-slow) var(--ease-out) backwards;flex:none;overflow:hidden}@media (width<=1200px){.showcase-chat{flex:none;height:160px}}.showcase-chat-lines{transition:opacity var(--settle) var(--ease-standard), translate var(--settle) var(--ease-standard);flex-direction:column;display:flex}.showcase-chat-lines[data-clearing]{opacity:0;translate:0 var(--space-8)}@keyframes showcase-chat-in{0%{opacity:0;max-height:0;padding-block:0}to{max-height:calc(3lh + 2 * var(--space-1))}}.showcase-chat-note{color:var(--color-text-muted)}.showcase-chat-goal{gap:var(--space-2);display:flex}.showcase-chat-goal .goal-icon{width:var(--icon-size);height:var(--icon-size);flex:none}.home [data-paused] *,.home [data-paused] :before,.home [data-paused] :after{animation-play-state:paused}.home-progress{transform-origin:0;height:2px;animation:home-progress var(--progress-ms) linear both;position:absolute}@keyframes home-progress{0%{scale:0 1}}.home-hero{align-items:center;gap:var(--space-12);padding:var(--space-8) var(--page-gutter) var(--space-12);grid-template-columns:minmax(0,5fr) minmax(0,7fr);display:grid}@media (width<=1200px){.home-hero{gap:var(--space-8);padding:var(--space-8) var(--space-5);grid-template-columns:minmax(0,1fr)}}.home-intro{justify-items:start;gap:var(--space-6);display:grid}.home-intro h1{font-size:clamp(var(--text-2xl), 6.6vw, var(--text-3xl))}@media (width<=600px){.home-intro h1{font-size:clamp(var(--text-xl), 14vw, var(--text-2xl))}}.home-intro>p{color:var(--color-text-muted);font-size:var(--text-md)}.home-intro>p strong{color:var(--color-text);font-weight:600}.home-wordmark{justify-items:start;gap:var(--space-4);display:grid}.home-wordmark .compass{width:80px;height:80px}@media (width<=1200px){.home-wordmark{grid-auto-flow:column;align-items:center}.home-wordmark .compass{width:48px;height:48px}}.home-actions{justify-items:start;gap:var(--space-3);display:grid}.home-facts{gap:var(--space-2);color:var(--color-text-muted);display:grid}.home-facts li{grid-template-columns:var(--space-8) minmax(0, 1fr);align-items:center;gap:var(--space-2);min-height:var(--space-8);display:grid}.home-facts .icon{color:var(--color-accent);justify-self:center}.home-facts span{align-items:baseline;gap:var(--space-2);display:flex}.home-facts strong{color:var(--color-accent);font:var(--text-lg) / 0 var(--font-display);--shadow:var(--text-shadow)}.home-community{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-8) var(--page-gutter);border-top:1px solid var(--color-line-soft);flex-wrap:wrap;display:flex}.home-community h2{font:var(--text-lg) / var(--leading-tight) var(--font-display);--shadow:var(--text-shadow)}.home-community>div{gap:var(--space-3);flex-wrap:wrap;display:flex}@media (width<=1200px){.home-community{padding-inline:var(--space-5)}}
