@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap";:root{--bg:#05060f;--text:#a7aec8;--text-h:#eef0fa;--border:#96aaff30;--accent:#ffd166;--accent-bg:#ffd16617;--accent-border:#ffd16666;--social-bg:#10152a;--shadow:0 20px 70px #00000059;--p1:#4da3ff;--p2:#ff8a3d;--sans:"DM Sans", system-ui, sans-serif;--heading:"Outfit", system-ui, sans-serif;font-family:var(--sans);font-synthesis:none;color:var(--text);background:var(--bg);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.6}*{box-sizing:border-box}body{min-width:320px;margin:0}body:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(at 80% 10%,#22295840,#0000 55%),radial-gradient(at 0 70%,#24134030,#0000 55%),radial-gradient(1px 1px at 22px 48px,#bacaff70 99%,#0000) 0 0/211px 229px,radial-gradient(1px 1px at 135px 95px,#bacaff40 99%,#0000) 0 0/317px 277px,radial-gradient(1px 1px at 59px 167px,#ffd16650 99%,#0000) 0 0/373px 353px;position:fixed;inset:0}button,input,select{font:inherit}button,.button{border:1px solid var(--border);min-height:44px;color:var(--text-h);cursor:pointer;background:#151b32;border-radius:10px;justify-content:center;align-items:center;gap:12px;padding:11px 20px;font-weight:600;text-decoration:none;transition:background .18s,border-color .18s,transform .18s;display:inline-flex}button:hover,.button:hover{background:#202942;border-color:#7184b1}button:active,.button:active{transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}a{color:var(--accent);text-underline-offset:4px}a:hover{color:#ffe5a3}button.primary,.button.primary{background:var(--accent);color:#17120a;border-color:var(--accent);box-shadow:0 4px 28px #ffd16612}button.primary:hover,.button.primary:hover{background:#ffdf91;border-color:#ffdf91}button.secondary,.button.secondary{color:var(--text-h);background:#11162b}button.secondary:hover,.button.secondary:hover{background:#202942}button.text-button,.button.text-button{color:var(--text);background:0 0;border-color:#0000}button.text-button:hover,.button.text-button:hover{color:var(--text-h);background:#ffffff08}:focus-visible{outline:2px solid var(--accent);outline-offset:5px}main:focus{outline:none}h1,h2,h3,h4{font-family:var(--heading);color:var(--text-h);margin:0;line-height:1.12}h1{letter-spacing:-.045em;font-size:clamp(2.5rem,5.3vw,4.5rem);font-weight:600}h2{letter-spacing:-.025em;font-size:1.7rem;font-weight:500}h3{font-size:1.2rem}p{margin:0}em{color:var(--accent);font-style:normal}strong{color:var(--text-h)}fieldset{border:0;min-width:0;margin:0;padding:0}legend{color:var(--text-h);margin-bottom:12px;font-weight:600}summary{cursor:pointer;color:var(--text-h);padding:10px 0}select,input{border:1px solid var(--border);color:var(--text-h);background:#0d1227;border-radius:8px;max-width:100%;min-height:44px;padding:10px}::selection{color:#05060f;background:var(--accent)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.app-shell{flex-direction:column;width:min(1240px,100%);min-height:100svh;margin-inline:auto;padding:0 48px;display:flex}.site-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:24px;min-height:108px;display:flex}.wordmark{color:var(--text-h);font-family:var(--heading);letter-spacing:.14em;white-space:nowrap;align-items:center;gap:13px;font-size:18px;font-weight:600;text-decoration:none;display:inline-flex}.brand-hole{background:#03040c;border:2px solid #ffbd72;border-radius:50%;flex-shrink:0;width:25px;height:25px;display:inline-block;position:relative;transform:rotate(-15deg);box-shadow:0 0 10px #ffad5b75,inset 0 0 5px #ffad5b40}.brand-hole:after{content:"";border-top:2px solid #ffd3a0;border-bottom:1px solid #ffad5b70;border-radius:50%;width:42px;height:7px;position:absolute;top:7px;left:-10px}.site-header nav{gap:28px;display:flex}.site-header nav a{color:var(--text);padding-block:12px;font-size:.87rem;text-decoration:none}.site-header nav a:hover,.site-header nav a[aria-current]{color:var(--accent)}main{flex:1}.site-footer{border-top:1px solid var(--border);color:#838ca9;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-top:64px;padding:28px 0;font-size:.75rem;display:flex}.site-footer a{color:#a7aec8;text-decoration:none}.footer-dot{color:var(--accent);margin:0 9px}.eyebrow{letter-spacing:.16em;text-transform:uppercase;color:var(--accent);font-size:.7rem;font-weight:700}.hero{grid-template-columns:1.03fr 1fr;align-items:center;gap:20px;min-height:620px;padding:70px 0 48px;display:grid}.hero-copy{z-index:1;position:relative}.hero h1{margin:22px 0;font-size:clamp(2.8rem,5vw,4.35rem)}.hero-description{max-width:390px;font-size:1.02rem;line-height:1.85}.hero-actions{flex-wrap:wrap;gap:12px;margin-top:30px;display:flex}.hero-actions .primary{min-width:165px}.hero-note{letter-spacing:.01em;color:#8991ad;margin-top:18px;font-size:.68rem}.hero-board{isolation:isolate;width:100%;min-width:0;position:relative}.hero-board-glow{z-index:-1;filter:blur(30px);background:radial-gradient(at 30% 70%,#205dc330,#0000 60%),radial-gradient(at 90% 70%,#ff8a3d15,#0000 50%);position:absolute;inset:10% 0 0}.hero-board .board{pointer-events:none}.hero-board .board-caption{letter-spacing:.2em;color:#9aa6c5;justify-content:center;align-items:center;gap:10px;margin-top:20px;font-size:.58rem;display:flex}.tiny-dot{border-radius:50%;width:6px;height:6px}.tiny-dot.blue{background:var(--p1);box-shadow:0 0 8px var(--p1)}.tiny-dot.orange{background:var(--p2);box-shadow:0 0 8px var(--p2)}.caption-rule{background:var(--border);width:32px;height:1px;margin-inline:6px}.home-paths{grid-template-columns:1fr 1fr;gap:20px;display:grid}.path-card{border:1px solid var(--border);color:var(--text);background:linear-gradient(125deg,#151c32aa,#0b1023bb);border-radius:16px;align-items:center;gap:22px;padding:28px;text-decoration:none;transition:border-color .2s,transform .2s;display:flex}.path-card:hover{color:var(--text);border-color:#b5985a;transform:translateY(-3px)}.path-card h2{margin:8px 0;font-size:1.5rem}.path-card p:not(.eyebrow){font-size:.8rem;line-height:1.7}.path-card .eyebrow{color:#aeb9d6;font-size:.6rem}.card-symbol{font-family:var(--heading);color:var(--accent);flex-shrink:0;font-size:2.6rem}.path-card>span:last-child{color:var(--accent);margin-left:auto}.panel{border:1px solid var(--border);background:linear-gradient(130deg,#11182be0,#0b1020e0);border-radius:20px;padding:36px}.setup-screen,.rules-screen{flex-direction:column;gap:26px;max-width:760px;margin:48px auto 0;display:flex}.setup-screen h1,.rules-screen h1{font-size:clamp(2.3rem,5vw,3.8rem)}.difficulty-options{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.choice{text-align:left;flex-direction:column;align-items:flex-start;gap:7px;padding:18px;display:flex}.choice span{color:var(--text);font-size:.75rem;font-weight:400}.choice.selected,.segmented button[aria-pressed=true]{border-color:var(--accent);background:var(--accent-bg)}.segmented{flex-wrap:wrap;gap:8px;display:flex}.segmented button{flex:1;font-size:.8rem}.muted{color:var(--text);font-size:.85rem}.resume-link{color:var(--accent);font-size:.9rem}.back-link{color:var(--text);font-size:.8rem;text-decoration:none}.explore-screen{margin-top:54px}.section-intro{max-width:650px}.section-intro h1{margin:16px 0 22px}.section-intro>p:last-child{max-width:520px}.challenge-grid{grid-template-columns:1fr 1fr;gap:22px;margin:36px 0 20px;display:grid}.challenge-card{border:1px solid var(--border);background:#10152abb;border-radius:20px;padding:32px;position:relative;overflow:hidden}.challenge-card h2{margin:12px 0 16px;font-size:2rem}.challenge-card>p:not(.eyebrow){max-width:350px;min-height:85px;font-size:.9rem}.challenge-card button{margin-top:24px}.challenge-mark{float:right;font-family:var(--heading);color:#ffd16680;font-size:3rem;line-height:1}.singularity{background:radial-gradient(at 100% 0,#6549b32a,#0000 80%),#10152abb}.singularity .challenge-mark{color:#aa8bff}.explore-tools{margin:24px 0;padding:16px 28px}.explore-tool-grid{grid-template-columns:repeat(3,1fr);gap:28px;padding:22px 0;display:grid}.explore-tool-grid p{margin:12px 0 20px;font-size:.8rem}.explore-tool-grid button{font-size:.8rem}.play-screen{max-width:700px;margin:26px auto 0}.play-heading{justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}.play-heading .eyebrow{text-align:center;font-size:.62rem}.icon-button{background:0 0;padding:6px 10px;font-size:.7rem}.first-game-tip{border:1px solid var(--border);background:#171c32;border-radius:10px;margin-bottom:20px;padding:12px 18px;font-size:.8rem}.first-game-tip a{margin-left:5px}.first-game-tip button{padding:5px 10px;font-size:.8rem}.opponent-status{text-align:center;min-height:35px;padding:5px;font-size:.8rem}.game-toolbar{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:15px;display:flex}.game-toolbar button,.game-toolbar .button{padding:8px 14px;font-size:.8rem}.share-status{text-align:center;color:var(--accent);font-size:.8rem}.share-status:not(:empty){padding:10px 0}.hint-explanation{text-align:center;max-width:500px;margin:12px auto;font-size:.8rem}.analysis-options{border-top:1px solid var(--border);max-width:500px;margin:18px auto 0;font-size:.8rem}.analysis-options summary{color:var(--text);text-align:center}.analysis-options label{margin:10px 0;display:block}.analysis-options select{width:100%}.analysis-options p{margin-top:10px}.rules-list{gap:24px;margin:0;padding-left:24px;display:grid}.rules-list li::marker{color:var(--accent);font-family:var(--heading);font-size:1.3rem}.rules-list li{padding-left:10px}.rules-list p{margin-top:7px;font-size:.9rem}.rule-note{background:var(--accent-bg);border-left:2px solid var(--accent);padding:14px 18px;font-size:.85rem}.credits{border-top:1px solid var(--border);padding-top:24px;font-size:.8rem}.rules-screen .hero-actions{margin:0}.not-found{justify-items:start;gap:24px;max-width:680px;margin:70px auto;display:grid}.not-found h1{font-size:2.5rem}.loading-panel{flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:400px;display:flex}.orbit-loader{border:1px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:1.5s linear infinite orbit}@keyframes orbit{to{transform:rotate(360deg)}}.update-banner{background:#1c2340;justify-content:center;align-items:center;gap:12px;padding:6px;font-size:.8rem;display:flex}.skip-link{z-index:100;background:#141b32;padding:15px;position:fixed;top:-100px;left:20px}.skip-link:focus{top:10px}@media (width<=1000px){.app-shell{padding-inline:28px}.hero{min-height:560px}.path-card{gap:16px;padding:22px}.card-symbol{font-size:2rem}.path-card h2{font-size:1.3rem}}@media (width<=720px){.app-shell{padding-inline:20px}.site-header{flex-wrap:wrap;gap:12px;min-height:82px;padding-block:20px}.wordmark{gap:12px;font-size:14px}.site-header nav{gap:16px}.site-header nav a{font-size:.73rem}.hero{grid-template-columns:1fr;gap:30px;padding-top:40px}.hero h1{font-size:clamp(2.8rem,8.5vw,4.5rem)}.hero-description{max-width:440px;font-size:.95rem}.hero-board{max-width:470px;margin-inline:auto}.home-paths{grid-template-columns:1fr;gap:14px}.path-card{padding:24px}.site-footer{margin-top:42px;font-size:.65rem}.panel{padding:24px}.setup-screen,.rules-screen{margin-top:30px}.difficulty-options{grid-template-columns:1fr}.choice{flex-direction:row;align-items:center;gap:15px}.choice strong{min-width:60px}.choice span{font-size:.8rem}.challenge-grid{grid-template-columns:1fr}.challenge-card>p:not(.eyebrow){min-height:0}.explore-tool-grid{grid-template-columns:1fr}}@media (width<=440px){.site-header{justify-content:center;gap:8px;padding-block:16px 9px}.site-header nav{justify-content:center;gap:28px;width:100%}.site-header nav a{padding-block:6px}.hero{padding-top:30px}.hero-actions{gap:10px}.hero-actions button,.hero-actions .button{padding-inline:15px;font-size:.85rem}.hero-note{font-size:.62rem}.play-screen{margin-top:18px}.play-heading{margin-bottom:14px}.play-heading .eyebrow{letter-spacing:.08em}.app-shell{padding-inline:16px}}@media (width<=720px){.is-playing .site-header{justify-content:center;min-height:60px;padding-block:16px}.is-playing .site-header nav{display:none}.is-playing .site-footer{margin-top:28px}.is-playing .first-game-tip{margin-bottom:12px;padding:8px 12px;font-size:.72rem}.is-playing .first-game-tip button{min-height:32px;padding:2px 6px;font-size:.72rem}.is-playing .play-heading{margin-bottom:12px}.is-playing .game-toolbar{margin-top:4px}.is-playing .opponent-status:empty{min-height:0;padding:0}.is-playing .opponent-status:has(>:empty){min-height:0;padding:0}}.progressive-hint{border:1px solid var(--border);background:var(--social-bg);text-align:left;box-sizing:border-box;border-radius:18px;width:min(100%,560px);margin:14px auto;padding:16px 20px}.progressive-hint>.eyebrow{margin:0 0 8px}.progressive-hint p{margin:8px 0;font-size:.9rem;line-height:1.6}.hint-panel-actions{flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;display:flex}.hint-panel-actions button{min-height:44px;margin:0}@media (width<=600px){.progressive-hint{padding:14px}}.black-hole-game{color:#eef0fa;width:min(100%,640px);margin:0 auto}.player-panels{grid-template-columns:1fr 1fr;gap:12px;display:grid}.player-panel{background:#101525a6;border:1px solid #273049;border-radius:16px;flex-direction:column;gap:5px;min-width:0;padding:14px;display:flex}.player-panel-1{--player-color:#4da3ff}.player-panel-2{--player-color:#ff8a3d}.active-player{border-color:var(--player-color);box-shadow:0 0 22px color-mix(in srgb, var(--player-color) 12%, transparent)}.player-label{letter-spacing:.12em;color:var(--player-color);font-size:.68rem;font-weight:800}.player-panel strong{overflow-wrap:anywhere}.safe-score{color:#a7aec8;font-size:.8rem}.safe-score b{color:#eef0fa;margin-left:4px}.piece-tray{flex-wrap:wrap;gap:3px;margin-top:4px;display:flex}.piece-tray span{color:var(--player-color);border:1px solid #39405b;border-radius:50%;place-items:center;width:19px;height:19px;font-size:.65rem;display:grid}.piece-tray .piece-used{opacity:.3;background:var(--player-color);color:#05060f}.turn-banner{justify-content:center;align-items:center;gap:14px;min-height:100px;padding:16px 0;display:flex}.turn-banner h2{color:#eef0fa;margin:2px 0;font-size:clamp(1.2rem,4vw,1.8rem)}.turn-banner:has(>.turn-eyebrow){text-align:center;flex-direction:column;gap:2px}.turn-banner p{color:#a7aec8;margin:4px 0;font-size:.85rem}.turn-eyebrow{color:#a7aec8;letter-spacing:.1em;font-size:.7rem}.next-piece{color:#05060f;border-radius:50%;place-items:center;width:48px;height:48px;font-size:1.5rem;font-weight:800;display:grid}.next-piece-1{background:#4da3ff}.next-piece-2{background:#ff8a3d}.board{--cell-size:min(60px, calc((100vw - 76px) / var(--board-rows) - 6px));--pitch:calc(var(--cell-size) + 8px);isolation:isolate;flex-direction:column;align-items:center;width:fit-content;max-width:100%;margin:14px auto 0;padding:20px 12px 14px;display:flex;position:relative}.board:before{content:"";z-index:-1;clip-path:polygon(50% 0,100% 100%,0 100%);background:linear-gradient(#22325170,#14203870);position:absolute;inset:-14px -20px -10px}.board-row{margin-top:calc(var(--pitch) * .866025 - var(--cell-size));justify-content:center;gap:8px;display:flex}.board-row:first-child{margin-top:0}.board .cell{width:var(--cell-size);height:var(--cell-size);-webkit-user-select:none;user-select:none;color:#071020;border:1px solid #0000;border-radius:50%;justify-content:center;align-items:center;min-width:0;min-height:0;margin:0;padding:0;font-size:clamp(1rem,4.2vw,1.55rem);font-weight:850;line-height:1;transition:transform .18s,opacity .25s;display:flex;position:relative}.board .cell:disabled{cursor:default;opacity:1}.board .cell.empty{color:#eef0fa;cursor:pointer;background:#080d1d;border:1px solid #52617e;box-shadow:inset 0 2px 8px #0009}.board .cell.empty:disabled{cursor:default}.board .cell.empty:not(:disabled):hover{border-color:#ffd166;transform:scale(1.06)}.board .cell:focus-visible{outline-offset:3px;outline:3px solid #ffd166}.board .cell.player1{background:radial-gradient(circle at 35% 25%,#90c8ff,#4da3ff 55%,#2471cc);box-shadow:0 3px 8px #0008,inset 0 1px 1px #ffffff70}.board .cell.player2{background:radial-gradient(circle at 35% 25%,#ffc58d,#ff8a3d 55%,#b7501a);box-shadow:0 3px 8px #0008,inset 0 1px 1px #ffffff70}.piece-marker{opacity:.8;font-size:.46rem;position:absolute;bottom:4px}.board .cell.latest-move{outline-offset:3px;outline:2px solid #eef0fa}.board .cell.preview{opacity:.65}.board .cell.black-hole{z-index:2;background:radial-gradient(circle,#000 54%,#211006 72%,#ff8a3d 87%,#ffd166 97%);border:1px solid #ffd166;animation:.9s ease-out hole-open;box-shadow:0 0 20px #ff8a3d55,inset 0 0 12px #000}.board .cell.black-hole:after{content:"";pointer-events:none;border:2px solid #ffd166;border-radius:50%;width:145%;height:34%;position:absolute;transform:rotate(-22deg);box-shadow:0 0 10px #ff8a3d88}.board .cell.sucked-in{opacity:.35;text-decoration:line-through;animation:1.2s ease-in-out swallowed;transform:scale(.78)}.board .hint{flex-direction:column;align-items:center;gap:2px;display:flex}.board .hint-result{font-size:clamp(.9rem,3.5vw,1.4rem)}.board .hint-value{font-size:.65rem}.board .hint-w{color:#82e6b8}.board .hint-d{color:#ffd166}.board .hint-l{color:#ff9696}.board .hint-pending{color:#8a90ab;animation:1s infinite hint-pulse}.board .cell-value-player1{color:#4da3ff}.board .cell-value-player2{color:#ff8a3d}.board .cell-value-equal{color:#eef0fa}.black-hole-game .board-caption{text-align:center;color:#a7aec8;margin:24px 0 12px;font-size:.8rem}.safe-explanation{color:#a7aec8;text-align:center;max-width:400px;margin:0 auto;font-size:.8rem}.safe-explanation summary{cursor:pointer;color:#c8cde0}.safe-explanation p{line-height:1.55}.game-actions{flex-wrap:wrap;justify-content:center;gap:10px;margin:16px 0;display:flex}.game-actions .rematch-button{color:#05060f;background:#ffd166}@keyframes hole-open{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}@keyframes swallowed{0%,25%{opacity:1;transform:translate(0)scale(1)}70%,80%{opacity:0;transform:translate(var(--swallow-x), var(--swallow-y)) scale(.1)}81%{opacity:0;transform:translate(0)scale(.78)}to{opacity:.35;transform:translate(0)scale(.78)}}@keyframes hint-pulse{50%{opacity:.35}}@media (width<=380px){.player-panel{padding:10px}.piece-tray{gap:2px}.piece-tray span{width:16px;height:16px}}@media (prefers-reduced-motion:reduce){.board .cell,.board .cell.black-hole,.board .cell.sucked-in,.board .hint-pending{transition:none;animation:none}}.game-actions:empty{display:none}@media (width<=440px){.player-panels{gap:8px}.player-panel{border-radius:12px;gap:2px;padding:9px 10px}.player-panel strong{font-size:.88rem}.player-label{font-size:.6rem}.safe-score{font-size:.72rem}.piece-tray{margin-top:2px}.turn-banner{min-height:76px;padding:10px 0}.next-piece{width:42px;height:42px;font-size:1.3rem}.black-hole-game .board-caption{margin-top:18px;font-size:.72rem}}.board .cell.newly-safe:after{content:"";pointer-events:none;opacity:0;border:2px solid #ffd166;border-radius:50%;animation:.85s ease-out safe-ring;position:absolute;inset:-5px}.board .cell.suggested-cell{outline-offset:3px;outline:3px solid #ffd166;box-shadow:0 0 20px #ffd16633}.board .cell.suggested-cell:before{content:"★";color:#ffd166;background:#05060f;border-radius:50%;padding:2px;font-size:.85rem;position:absolute;top:-7px;right:-4px}.game-announcement{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@keyframes safe-ring{0%{opacity:0;transform:scale(.9)}25%{opacity:1}to{opacity:0;transform:scale(1.25)}}@media (prefers-reduced-motion:reduce){.board .cell.newly-safe:after{animation:none}}
