:root{font:17px/1.5 system-ui,sans-serif;color:#f3f7ff;background:#0d1931;--mint:#9af4d1;--panel:#182945;--line:#304462}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 70% 0,#253a5e,transparent 60%)}main{max-width:710px;margin:auto;padding:26px 24px;min-height:82vh}h1{font-size:clamp(42px,9vw,68px);line-height:1.05;letter-spacing:-2px;margin:26px 0}h2{font-size:30px;line-height:1.2}.eyebrow{font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--mint)}p{color:#b7c6da}.card{background:var(--panel);border:1px solid var(--line);padding:25px;border-radius:26px;margin:20px 0}.row{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}button,.button{font:inherit;min-height:46px;border:1px solid #3d5575;border-radius:14px;background:#243957;color:#f4f8ff;padding:10px 18px;cursor:pointer;text-decoration:none;display:inline-block}button:hover{background:#365371}button:disabled{opacity:.4;cursor:default}.primary{background:var(--mint);color:#133c39;border-color:var(--mint);font-weight:700}button:focus-visible,a:focus-visible{outline:3px solid #ffda77;outline-offset:3px}.levels{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.levels button{padding:12px 4px}.board{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;background:#0a152c;border:8px solid #263b5b;box-shadow:0 15px 40px #030a1d66;border-radius:18px;padding:6px;width:min(100%,480px);margin:20px auto;touch-action:none}.cell{aspect-ratio:1;min-height:0;padding:0;border-radius:6px;background:#1b2c49;border:1px solid #243959;position:relative}.tile{background:var(--tile)!important;border-top:3px solid #ffffff55!important;box-shadow:inset 0 -5px 0 #0003,inset 0 0 0 2px #ffffff12;border-radius:6px}.color0{--tile:#6bacf1}.color1{--tile:#e49bc8}.color2{--tile:#a59ae8}.color3{--tile:#f1c36a}.color4{--tile:#69ccbe}.color5{--tile:#ef987e}.cell .gem,.mini .gem{color:white;text-shadow:0 2px 3px #0006;font-size:22px;line-height:1}.cell.preview{background:#9af4d155;border-color:var(--mint)}.tray{display:flex;align-items:center;justify-content:space-around;gap:12px;min-height:130px}.piece{padding:10px;width:30%;height:120px;display:flex;align-items:center;justify-content:center;background:#15253e;touch-action:none}.piece.selected{border:2px solid var(--mint);box-shadow:0 0 0 3px #9af4d122}.mini{display:grid;gap:2px}.mini span{width:clamp(14px,4vw,24px);height:clamp(14px,4vw,24px)}.settings label{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--line)}input[type=checkbox]{width:24px;height:24px;accent-color:var(--mint)}#notice{max-width:660px;min-height:48px;margin:auto;padding:10px 20px;color:#ffda77}footer{text-align:center;color:#b7c6da;font-size:13px;padding:22px}a{color:inherit}progress{width:100%;accent-color:var(--mint);height:10px}dialog{max-width:450px;border:1px solid #3d5575;border-radius:24px;background:#182945;color:white;padding:28px}dialog::backdrop{background:#071021bb}.badge{border-bottom:1px solid var(--line);padding:16px}.muted{opacity:.5}@media(max-width:480px){main{padding:18px 12px}.card{padding:20px}.board{gap:2px;padding:4px;border-width:6px}.row button{padding:9px 12px}.piece{padding:5px;height:110px}}
