@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#090c14;--text:#e9eaf2;--muted:#858999;--purple:#b59bff;--border:#ffffff0e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;min-height:100vh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,[role=gridcell]:focus-visible{outline:2px solid #d4c3ff;outline-offset:4px}button{touch-action:manipulation}a{color:inherit;text-decoration:none}.ambient{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 48% 42%,#44315d23,transparent 54%),radial-gradient(ellipse at 92% 0%,#2030491d,transparent 40%)}header{height:100px;max-width:1440px;margin:auto;padding:0 64px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}.brand{font-family:'Space Grotesk',sans-serif;font-size:27px;letter-spacing:5px;font-weight:700;display:flex;align-items:center;gap:12px}.brandmark{color:var(--purple);font-size:39px;line-height:1}.brandtag{font:10px 'DM Sans',sans-serif;letter-spacing:2.3px;border-left:1px solid #353240;padding-left:18px;margin-left:7px;color:var(--muted)}.header-right{display:flex;align-items:center;gap:12px}.free-label{color:#a1a2af;font-size:13px;margin-right:22px}.icon-button{position:relative;display:grid;place-items:center;width:38px;height:38px;border:1px solid #ffffff14;background:#ffffff03;border-radius:12px;font-size:20px;color:#a6a9ba;transition:background .2s}.icon-button:hover{background:#ffffff0d;color:white}.sound-slash{position:absolute;font-size:29px;transform:rotate(15deg)}main{max-width:1320px;padding:48px 32px 38px;margin:auto;display:grid;grid-template-columns:minmax(245px,1fr) minmax(350px,480px) minmax(205px,.8fr);gap:54px;align-items:start}.intro{padding-top:35px}.eyebrow{display:flex;gap:9px;align-items:center;color:#ac93db;font-size:10px;letter-spacing:1.8px;font-weight:600}.eyebrow span{width:5px;height:5px;background:#ad8fd9;border-radius:50%;box-shadow:0 0 10px #b78cee}h1{font-family:'Space Grotesk',sans-serif;font-size:38px;line-height:1.2;letter-spacing:-1.6px;font-weight:500;margin:24px 0 16px}h1 em{font-style:normal;color:#bca3ef;display:block;font-size:34px;letter-spacing:-1.7px}.intro>p{font-size:15px;color:var(--muted);line-height:1.9}.mode-card{display:flex;align-items:center;gap:12px;margin:33px 0 28px;padding:17px 14px;border:1px solid #a58fd52d;border-radius:13px;background:linear-gradient(120deg,#a58bff0d,#a58bff03)}.mode-symbol{font-size:32px;color:#bfa5f5}.mode-card strong{font-size:14px;font-weight:500;display:block}.mode-card div span{display:block;font-size:11px;line-height:1.6;color:#8c879e;margin-top:4px}.mode-check{margin-left:auto;color:#bca3ef;font-size:14px}.how{display:grid;gap:19px}.how>div{display:flex;gap:15px}.how>div>span{font:12px 'Space Grotesk',sans-serif;color:#5f586d;margin-top:4px}.how p{margin:0;font-size:12px;line-height:1.8;color:#777c8c}.how strong{display:block;color:#b4b6c3;font-size:13px;font-weight:500}.quiet-note{margin-top:48px;font-size:12px;color:#626678;display:flex;gap:10px;align-items:center}.quiet-note span{font-size:21px;color:#8e7bac}.scorebar{display:flex;align-items:center;padding:0 4px 22px;gap:32px}.stat-label{font-size:10px;letter-spacing:1.7px;color:#777e90;display:block}.scorebar strong{font-family:'Space Grotesk',sans-serif;font-size:37px;line-height:1.35;font-weight:500;letter-spacing:-1px}.scorebar .best{margin-left:auto;text-align:right}.best strong{font-size:27px;color:#a4a5b7;line-height:1.8}.crown{color:#b69a67;font-size:14px}.reset{margin-left:0;border:0;background:none;font-size:25px}.board-frame{position:relative;padding:12px;background:linear-gradient(145deg,#262236,#131824 60%);border:1px solid #afa0e528;border-radius:20px;box-shadow:0 20px 70px #0006,0 0 65px #7255bb0c,inset 0 1px 0 #ffffff08}.board{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;padding:3px;touch-action:none}.cell{aspect-ratio:1;background:#1b2030;border:1px solid #ffffff04;border-radius:7px;position:relative;transition:background .12s,box-shadow .12s;min-width:0;padding:0}.cell:nth-child(3n){background-color:#1c2131}.block{--color:#a887f2;--deep:#5e42a1;background:linear-gradient(140deg,color-mix(in srgb,var(--color),white 17%),var(--color) 25%,var(--deep))!important;border:1px solid color-mix(in srgb,var(--color),white 20%)!important;box-shadow:inset 0 2px 1px #ffffff55,inset 0 -3px 2px #0003,0 2px 5px #0004;position:relative}.block:after{content:'';position:absolute;inset:5px;border:1px solid #ffffff14;border-radius:3px;background:linear-gradient(135deg,#ffffff12,transparent 55%);pointer-events:none}.cell.preview{opacity:.5;box-shadow:0 0 14px var(--color),inset 0 0 0 2px #ffffff44}.cell.invalid{background:#bf5a653b!important;border:1px solid #d2677777!important}.cell.will-clear{filter:brightness(1.5);box-shadow:0 0 14px #b5a1e475}.cell.pop{animation:pop .23s ease-out}.cell.clearing{animation:clear .32s ease-out forwards}.underboard{display:flex;justify-content:space-between;align-items:center;margin:17px 4px 15px;font-size:11px;color:#9290a4}.spark{color:#ac93dc;margin-right:6px}.underboard>span:last-child{font-size:10px;letter-spacing:1.7px;color:#6a6e80}.tray{height:121px;display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.piece-slot{border:1px solid #ffffff09;background:#ffffff02;border-radius:13px;display:flex;align-items:center;justify-content:center;position:relative;touch-action:none;transition:border .2s,background .2s;min-width:0}.piece-slot:hover,.piece-slot.selected{border-color:#bba1ed70;background:#ac8dfb09}.piece-slot.used{border-style:dashed;opacity:.5}.piece-slot.used:after{content:'✓';color:#576072;font-size:21px}.piece-slot .number{position:absolute;top:8px;left:10px;font-size:10px;color:#5a6074}.piece-grid{display:grid;gap:3px;pointer-events:none}.piece-grid .block{width:25px;height:25px;border-radius:4px}.piece-grid .block:after{inset:3px;border-radius:2px}.tray-hint{text-align:center;font-size:12px;color:#757a8c;margin:14px 0 20px;min-height:18px}.game-bottom{border-top:1px solid var(--border);padding-top:16px;display:flex;justify-content:space-between;gap:5px;align-items:center;color:#5e6578;font-size:9px}.game-bottom button{border:0;background:transparent;color:#aba3bd;font-size:12px;padding:4px}kbd{font:9px 'DM Sans',sans-serif;border:1px solid #ffffff14;border-radius:3px;padding:2px 3px;margin-right:2px}.right-panel{padding-top:38px}.session-title{font-size:10px;letter-spacing:1.8px;color:#777b8d;display:flex;justify-content:space-between}.session-title span{font-size:17px;color:#8b7aa5}.level-card{margin-top:24px;padding:21px;background:linear-gradient(145deg,#ad8aff0d,#a88aff02);border:1px solid #b5a0f016;border-radius:15px}.level-top{display:flex;align-items:center;gap:8px;color:#aca4bf;font-size:12px}.level-icon{color:#b899f0;font-size:23px}.level-number{margin:15px 0 18px;display:flex;align-items:baseline;gap:12px}.level-number strong{font:52px 'Space Grotesk',sans-serif;letter-spacing:-3px;color:#ddd3ef}.level-number>span{font-size:9px;letter-spacing:2px;color:#696477}.progress{height:4px;background:#ffffff0a;border-radius:3px;overflow:hidden}.progress>div{height:100%;background:linear-gradient(90deg,#8661c8,#c6a7ff);width:0;transition:width .4s}.level-card p{font-size:11px;color:#706b80;margin:12px 0 0}.mini-stats{display:grid;gap:22px;margin:29px 3px 34px}.mini-stats>div{display:flex;justify-content:space-between;font-size:12px;color:#868596}.mini-stats strong{font:15px 'Space Grotesk',sans-serif;color:#ccc5da}.tip-card{padding:22px 19px;border:1px solid var(--border);border-radius:14px;background:linear-gradient(130deg,#ab925009,transparent)}.tip-card>span{color:#b8a173;font-size:25px}.tip-card h2{font-size:13px;font-weight:500;color:#b9b3a8;margin:14px 0 9px}.tip-card p{color:#777782;font-size:12px;line-height:1.8;margin:0}.local-note{display:flex;gap:8px;align-items:center;justify-content:center;font-size:10px;color:#5c6271;margin-top:25px}footer{max-width:1312px;margin:0 auto;padding:22px 0;border-top:1px solid var(--border);display:flex;justify-content:space-between;color:#505668;font-size:10px;letter-spacing:1px}footer>span:nth-child(2){letter-spacing:0;font-size:11px}.footer-dot{padding:0 12px;color:#3a4053}.board-message{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none;font:700 38px 'Space Grotesk',sans-serif;color:white;text-shadow:0 0 25px #ad8cff;opacity:0;z-index:4}.board-message.show{animation:message 1.15s ease-out}.board-message small{font:14px 'DM Sans',sans-serif;letter-spacing:2px;margin-top:6px;color:#d5bcff}#particles{position:absolute;inset:0;pointer-events:none;overflow:visible}.particle{position:absolute;width:6px;height:6px;border-radius:2px;background:var(--color);animation:particle .7s ease-out forwards;box-shadow:0 0 10px var(--color)}dialog{background:#151824;border:1px solid #bda4ee44;border-radius:24px;color:var(--text);width:min(440px,calc(100% - 32px));padding:36px;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#060913c9;backdrop-filter:blur(9px)}.dialog-close{position:absolute;right:14px;top:14px;border:0}dialog h2{font:500 31px 'Space Grotesk',sans-serif;letter-spacing:-1px;margin:16px 0}dialog p{color:#a2a0b4;line-height:1.7;font-size:15px}dialog .modal-symbol{font-size:32px;color:var(--purple)}.primary{background:#b397ed;color:#171020;border:0;border-radius:10px;width:100%;padding:13px;font-weight:700;margin-top:16px}.secondary{background:none;border:1px solid #ffffff20;border-radius:10px;width:100%;padding:12px;margin-top:10px}.final-score{font:60px 'Space Grotesk',sans-serif;color:#d5c1ff}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes pop{0%{transform:scale(.72);filter:brightness(1.7)}75%{transform:scale(1.08)}100%{transform:scale(1)}}@keyframes clear{50%{filter:brightness(2.5);transform:scale(1.1)}100%{opacity:0;transform:scale(.3)}}@keyframes message{0%{opacity:0;transform:translateY(12px) scale(.9)}20%,65%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-20px)}}@keyframes particle{to{transform:translate(var(--dx),var(--dy)) rotate(160deg);opacity:0}}@media(min-width:1450px){main{padding-top:65px;padding-bottom:55px}}@media(max-width:1150px){header{padding:0 30px}main{gap:30px;grid-template-columns:minmax(210px,1fr) minmax(350px,450px)}.right-panel{display:none}h1{font-size:34px}h1 em{font-size:30px}footer{margin:0 30px}}@media(max-width:720px){header{height:75px;padding:0 22px}.brand{font-size:23px;gap:7px}.brandtag,.free-label{display:none}main{display:flex;flex-direction:column;padding:22px 18px 25px;gap:20px;max-width:490px}.intro{padding:0;width:100%}.eyebrow{font-size:9px}.intro h1{font-size:23px;letter-spacing:-.8px;margin:12px 0 0}.intro h1 br{display:none}.intro h1 em{display:inline;font-size:23px;letter-spacing:-.8px}.intro>p,.mode-card,.how,.quiet-note{display:none}.game{width:100%}.scorebar{padding-bottom:14px}.scorebar strong{font-size:32px}.best strong{font-size:25px}.board-frame{padding:8px;border-radius:15px}.board{gap:4px}.cell{border-radius:5px}.tray{height:105px}.piece-grid .block{width:24px;height:24px}.game-bottom>span{display:none}.game-bottom{justify-content:center;padding-top:10px}footer{padding:19px 0;margin:0 22px;font-size:8px}footer>span:nth-child(2){display:none}.tray-hint{margin-bottom:12px}.header-right{gap:8px}.icon-button{width:35px;height:35px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition:none!important}}
/* Readable secondary labels, including narrow screens and text enlargement. */
.brandtag,.eyebrow,.stat-label,.session-title,.underboard>span:last-child,.level-number>span,footer,.piece-slot .number,.game-bottom,kbd{font-size:12px}
.intro>p{font-size:16px}
.mode-card div span,.how p,.quiet-note,.level-card p,.local-note,footer>span:nth-child(2){font-size:12px}
.how strong,.mini-stats>div,.level-top,.tip-card h2,.tip-card p,.underboard,.tray-hint,.game-bottom button{font-size:14px}
.stat-label{letter-spacing:1px}.game-bottom{flex-wrap:wrap;row-gap:12px}.game-bottom>span{font-size:12px}.tip-card p{line-height:1.7}
@media(max-width:720px){.eyebrow{font-size:12px;letter-spacing:1px}.intro h1 br:after{content:' '}.intro h1 em{margin-left:5px}.stat-label{font-size:12px}.underboard{font-size:12px}footer{font-size:12px;letter-spacing:0}footer>span:last-child{display:none}.tray-hint{font-size:14px}.game-bottom{padding-bottom:6px}}
@media(max-width:370px){.piece-grid .block{width:20px;height:20px}.scorebar{gap:14px}}
