:root{color-scheme:dark;--bg: #1c1a18;--ink: #f3e6d4;--muted: #b9a48a;--line: rgba(243, 230, 212, .16);--btn: #2c2722;--accent: #e0b45c;--wood: #6b4a32}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#121110;color:var(--ink);font-family:Segoe UI,PingFang SC,Noto Sans SC,sans-serif;-webkit-user-select:none;user-select:none}body{display:grid;place-items:center}#phone{position:relative;width:min(100vw,56.25dvh);height:100dvh;max-height:100dvh;background:var(--bg);overflow:hidden;box-shadow:0 0 0 1px var(--line),0 24px 80px #00000073}#view{height:100%;display:grid;grid-template-rows:auto 1fr;min-height:0}header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:calc(12px + env(safe-area-inset-top)) 16px 8px 20px}.play-header{align-items:center;padding:calc(8px + env(safe-area-inset-top)) 12px 6px}.category-header{justify-content:flex-start;gap:12px}.category-header>div{min-width:0;flex:1}h1{margin:0;font-size:20px;font-weight:650;letter-spacing:.08em}.blurb{margin:4px 0 0;color:var(--muted);font-size:13px}main{min-height:0;overflow:auto;padding:8px 16px calc(20px + env(safe-area-inset-bottom));touch-action:pan-y}.cards{display:grid;gap:12px;align-content:start}.card{display:flex;align-items:stretch;gap:14px;width:100%;min-height:96px;padding:12px;text-align:left;letter-spacing:0}.card h2{margin:0;font-size:17px;font-weight:650}.card p{margin:6px 0 0;color:var(--muted);font-size:13px;line-height:1.4}.card small{display:block;margin-top:8px;color:var(--accent);font-size:12px;letter-spacing:.04em}.card.coming small{color:var(--muted)}.card:disabled,.card.coming{opacity:.72}.cover{flex:0 0 88px;width:88px;min-height:72px;align-self:stretch;overflow:hidden;border-radius:10px;border:1px solid rgba(255,210,160,.22);background-color:#2a1c12;background-repeat:no-repeat;box-shadow:inset 0 1px #ffecd266,inset 0 -3px 6px #140a048c,0 3px #140a0466}.cover-disassembly{background-color:#24180e;background-image:linear-gradient(160deg,#c08a54,#6b4220),linear-gradient(160deg,#8a542c,#4a2c16),linear-gradient(160deg,#a36a3e,#5c351c);background-position:50% 22%,50% 50%,50% 78%;background-size:78% 16%,18% 78%,78% 16%}.cover-sliding{background-color:#5c3016;background-image:linear-gradient(160deg,#c43a28,#8e1e14),linear-gradient(160deg,#2a5cb8,#1a3e86),linear-gradient(160deg,#d88918,#a8620c),linear-gradient(160deg,#4e9a2a,#347018),linear-gradient(145deg,#9a6034,#5c3016);background-position:18% 18%,68% 18%,68% 66%,18% 66%,0 0;background-size:42% 42%,18% 42%,18% 18%,42% 18%,100% 100%}.cover-logic{background-color:#4a2c18;background-image:radial-gradient(circle at 32% 32%,#e23b28 0 8%,transparent 9%),radial-gradient(circle at 68% 68%,#1f5fe0 0 8%,transparent 9%),repeating-linear-gradient(#5a4030 0,#5a4030 10px,#3a2414 10px,#3a2414 11px),repeating-linear-gradient(90deg,#5a4030 0,#5a4030 10px,#3a2414 10px,#3a2414 11px);background-repeat:no-repeat,no-repeat,repeat,repeat}.cover-board{background-color:#1c1612;background-image:radial-gradient(circle at 50% 22%,#e23b28 0 8%,transparent 9%),radial-gradient(circle at 50% 50%,#1f5fe0 0 8%,transparent 9%),radial-gradient(circle at 50% 78%,#f08c00 0 8%,transparent 9%),linear-gradient(#8a542c,#5e3518),linear-gradient(#8a542c,#5e3518);background-position:0 0,0 0,0 0,center,center;background-size:auto,auto,auto,30% 86%,86% 30%}.cover-packing{background-color:#5c351c;background-image:linear-gradient(135deg,#c43a28 50%,transparent 50%),linear-gradient(-135deg,#2a5cb8 50%,transparent 50%),linear-gradient(45deg,#d88918 50%,transparent 50%),linear-gradient(-45deg,#4e9a2a 50%,transparent 50%);background-position:0 0,100% 0,0 100%,100% 100%;background-size:54% 54%}.cover-twisty{background-color:#1a120e;background-image:linear-gradient(#c0392b,#9a2418),linear-gradient(#e0b43a,#b48c18),linear-gradient(#2f9e52,#1e7038),linear-gradient(#2f6fbd,#1a4e8a),linear-gradient(#e0b43a,#b48c18),linear-gradient(#c0392b,#9a2418),linear-gradient(#2f9e52,#1e7038),linear-gradient(#2f6fbd,#1a4e8a),linear-gradient(#e0b43a,#b48c18);background-position:16% 16%,50% 16%,84% 16%,16% 50%,50% 50%,84% 50%,16% 84%,50% 84%,84% 84%;background-size:22% 22%}.cover-luban{background-color:#24180e;background-image:linear-gradient(160deg,#d2a06a,#8a542c),linear-gradient(160deg,#b07848,#5e3518),linear-gradient(160deg,#c08a54,#6b4220);background-position:50% 24%,50% 50%,50% 76%;background-size:82% 17%,17% 82%,82% 17%}.cover-cube{background-color:#241a12;background-image:linear-gradient(160deg,#e07a4a,#b44a28),linear-gradient(160deg,#3a8ec8,#1f5f96),linear-gradient(160deg,#d4b03a,#a07a18),linear-gradient(160deg,#4aaa5a,#2a7a38);background-position:12% 14%,58% 22%,20% 58%,62% 64%;background-size:42% 42%}.cover-npuzzle{background-color:#5c351c;background-image:linear-gradient(160deg,#e23b28,#b42014),linear-gradient(160deg,#f08c00,#c86a00),linear-gradient(160deg,#5cb82a,#3d8c14),linear-gradient(160deg,#1f5fe0,#1448b0),linear-gradient(145deg,#a36a3e,#5c351c);background-position:10% 10%,56% 10%,10% 56%,56% 56%,0 0;background-size:38% 38%,38% 38%,38% 38%,38% 38%,100% 100%}.cover-klotski{background-color:#1c1612;background-image:linear-gradient(#c43a28,#8e1e14),linear-gradient(#2a5cb8,#1a3e86),linear-gradient(#d88918,#a8620c),linear-gradient(#4e9a2a,#347018),linear-gradient(145deg,#9a6034,#5c3016);background-position:30% 16%,8% 16%,76% 16%,30% 62%,center;background-size:40% 38%,16% 38%,16% 38%,40% 16%,88% 88%}.cover-sokoban{background-color:#6a4024;background-image:linear-gradient(#6a4018,#6a4018),linear-gradient(#6a4018,#6a4018),linear-gradient(145deg,#e0b85a,#8a5818),repeating-linear-gradient(90deg,rgba(60,32,14,.28) 0 1px,transparent 1px 8px),linear-gradient(#c4a078,#6a4024);background-position:30% 36%,30% 58%,24% 22%,0 0,0 0;background-size:40% 6%,40% 6%,52% 56%,auto,100% 100%}.cover-peg{background-color:#1c1612;background-image:radial-gradient(circle at 50% 18%,#e23b28 0 7%,transparent 8%),radial-gradient(circle at 50% 50%,#1f5fe0 0 7%,transparent 8%),radial-gradient(circle at 50% 82%,#f08c00 0 7%,transparent 8%),radial-gradient(circle at 18% 50%,#5cb82a 0 7%,transparent 8%),radial-gradient(circle at 82% 50%,#b024c4 0 7%,transparent 8%),linear-gradient(#8a542c,#5e3518),linear-gradient(#8a542c,#5e3518);background-position:0 0,0 0,0 0,0 0,0 0,center,center;background-size:auto,auto,auto,auto,auto,28% 88%,88% 28%}.cover-mines{background-color:#3e2414;background-image:radial-gradient(circle at 30% 30%,#c0392b 0 7%,transparent 8%),radial-gradient(circle at 70% 62%,#1a120c 0 8%,transparent 9%),linear-gradient(160deg,#d7b48a,#b18554),linear-gradient(#3a2718,#523a28),linear-gradient(160deg,#d7b48a,#b18554),linear-gradient(145deg,#8a5a32,#3e2414);background-position:0 0,0 0,12% 12%,56% 12%,56% 56%,0 0;background-size:auto,auto,36% 36%,36% 36%,36% 36%,100% 100%}.cover-sudoku{background-color:#4a2c18;background-image:radial-gradient(circle at 32% 30%,#e23b28 0 9%,transparent 10%),radial-gradient(circle at 68% 30%,#1f5fe0 0 9%,transparent 10%),radial-gradient(circle at 50% 70%,#f2d000 0 9%,transparent 10%),repeating-linear-gradient(#6a4226 0,#6a4226 10px,#3a2414 10px,#3a2414 11px),repeating-linear-gradient(90deg,#6a4226 0,#6a4226 10px,#3a2414 10px,#3a2414 11px);background-repeat:no-repeat,no-repeat,no-repeat,repeat,repeat}.cover-nonogram{background-color:#4e3018;background-image:linear-gradient(#1a1410,#12100e),linear-gradient(#1a1410,#12100e),linear-gradient(#1a1410,#12100e),linear-gradient(#f8efd8,#ead7b0),linear-gradient(145deg,#8f623c,#4e3018);background-position:34% 34%,62% 34%,34% 62%,62% 62%,0 0;background-size:24% 24%,24% 24%,24% 24%,24% 24%,100% 100%}.cover-rings{background-color:#2a1c12;background-image:radial-gradient(circle at 36% 50%,transparent 0 14%,#d4b06a 15% 21%,transparent 22%),radial-gradient(circle at 64% 50%,transparent 0 14%,#8a6230 15% 21%,transparent 22%),linear-gradient(145deg,#6b4a32,#2a1c12)}.cover-tangram{background-color:#5c351c;background-image:linear-gradient(135deg,#c43a28 50%,transparent 50%),linear-gradient(-135deg,#2a5cb8 50%,transparent 50%),linear-gradient(45deg,#d88918 50%,transparent 50%),linear-gradient(-45deg,#4e9a2a 50%,transparent 50%);background-position:0 0,100% 0,0 100%,100% 100%;background-size:52% 52%}.cover-rubik{background-color:#1a120e;background-image:linear-gradient(#c0392b,#9a2418),linear-gradient(#e0b43a,#b48c18),linear-gradient(#2f9e52,#1e7038),linear-gradient(#2f6fbd,#1a4e8a),linear-gradient(#e0b43a,#b48c18),linear-gradient(#c0392b,#9a2418),linear-gradient(#2f9e52,#1e7038),linear-gradient(#2f6fbd,#1a4e8a),linear-gradient(#e0b43a,#b48c18);background-position:16% 16%,50% 16%,84% 16%,16% 50%,50% 50%,84% 50%,16% 84%,50% 84%,84% 84%;background-size:22% 22%}button,.card{-moz-appearance:none;appearance:none;-webkit-appearance:none;border:1px solid var(--line);border-radius:12px;background:var(--btn);color:var(--ink);font-size:15px}.card{background:linear-gradient(180deg,rgba(255,224,186,.1),transparent 42%),var(--btn);box-shadow:inset 0 1px #ffe0ba24,0 10px 20px #0000004d}button{min-height:52px;letter-spacing:.12em}button:disabled{opacity:.4}button:active,.card:active:not(:disabled){transform:scale(.98)}button.on{border-color:var(--accent);color:var(--accent)}#back,#open-tab,#settings-btn{flex:0 0 auto;min-height:40px;padding:0 12px;font-size:13px;letter-spacing:.16em}a#open-tab{display:grid;place-items:center;text-decoration:none;white-space:nowrap;border:1px solid var(--line);border-radius:12px;background:var(--btn);color:var(--ink)}.play-header>div{min-width:0;flex:1}.play-header h1{font-size:18px}code{color:var(--ink);font-size:.92em}.embed{position:relative;min-height:0;min-width:0;overflow:hidden;background:#121110}.embed iframe{display:block;width:100%;height:100%;border:0;background:#121110}.fallback,.loading{position:absolute;top:16px;right:16px;bottom:16px;left:16px;display:grid;align-content:center;gap:12px;padding:18px 16px;border-radius:16px;background:#1c1a18f5;border:1px solid var(--line)}.fallback p,.loading p,.placeholder p{margin:0;color:var(--muted);font-size:14px;line-height:1.5;letter-spacing:0}.placeholder{display:grid;align-content:center;gap:12px;min-height:0;padding:24px 20px calc(20px + env(safe-area-inset-bottom))}.sheet{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:none;grid-template-rows:auto 1fr auto;padding:calc(20px + env(safe-area-inset-top)) 20px calc(20px + env(safe-area-inset-bottom));background:#121110f5}.sheet.show{display:grid}.sheet h2{margin:0 0 16px;letter-spacing:.2em}.sheet label{display:grid;gap:8px;margin-bottom:18px;color:var(--muted);font-size:13px;letter-spacing:.12em}.sheet input[type=range]{width:100%}.check{display:flex;align-items:center;gap:10px;min-height:48px;color:var(--ink);letter-spacing:0}html[data-reduce-motion=true] *,html[data-reduce-motion=true] *:before,html[data-reduce-motion=true] *:after{transition:none!important;animation:none!important}