/* Midnight accents balance the luminous marble arena. */
:root{--ink:#152e4d;--muted:#45617f;--light:#e0e9f1;--dark:#819ab5}
.world{background:radial-gradient(ellipse at 48% 34%,#d7e2ed 0,#a4b6cb 60%,#6b849f 100%)}
.world:before{opacity:.55;filter:brightness(.82) saturate(.7)}.world:after{filter:brightness(.82) saturate(.8)}
.ambient-drops{opacity:.65}.topbar{padding:0 22px;border:1px solid #6f90b44d;border-top:0;border-radius:0 0 23px 23px;background:linear-gradient(125deg,#112540f5,#233d5af0);box-shadow:0 8px 24px #12294724}.brand{color:#f1f6ff}.brand-sub{color:#94bde9}.edition{color:#99b5d3}.quiet{background:#ffffff0e;border:1px solid #acc6df4d;color:#e2edfc;box-shadow:none}.quiet:hover{background:#ffffff1b}
.board-wrap{border-color:#304b6d;background:linear-gradient(135deg,#253e5c,#10253d 55%,#375474);box-shadow:0 8px 0 #0f2238,0 12px 0 #243f5960,0 23px 40px #213f603b,inset 0 1px 2px #ffffff3b;padding:12px}.board{border-color:#6a8aab8a}.sq.dark{background:linear-gradient(145deg,#ffffff1c,transparent 70%),var(--dark)}.sq{background:linear-gradient(145deg,#ffffff40,transparent 65%),var(--light)}.gold-world .board-wrap{background:linear-gradient(135deg,#8a682f,#403420 65%,#856528);border-color:#bc9b55;box-shadow:0 8px 0 #40321a,0 12px 0 #644c2966,0 23px 40px #72552d33}
.turn-panel,.history-panel{color:#ecf3ff;background:linear-gradient(150deg,#233b59,#152b45);border:1px solid #789bb957;box-shadow:0 8px 25px #16304c29;backdrop-filter:none}.turn-panel .eyebrow{color:#87b7ff}.turn-status h2{color:#f0f6ff}.turn-panel>p{color:#a4bad2}.panel-heading>span:last-child{color:#9ab4d2}.mode-switch{background:#0d2139;border-color:#44668966}.mode-switch>button{color:#90adcc}.mode-switch>button.active{background:#345781;color:#f2f7ff;box-shadow:inset 0 1px 1px #b4d2f522}.primary-button{border-radius:12px;background:linear-gradient(150deg,#548bef,#376ed8);border-color:#84afff77;border-bottom-color:#133d84}.primary-button:focus-visible,.mode-switch button:focus-visible{outline-color:#a9d5ff}.history-labels{background:#0b203580;color:#89a7c9}.history-row{border-bottom-color:#7795b321;color:#c1d7f1}.history-row>span:first-child{color:#7f9dbc}.history-row:last-child{background:#23486c;color:#e2f0ff}.empty-history{color:#b0c6dc}.empty-history>span{color:#819cb6}.gold-card{background:radial-gradient(ellipse at 85% 15%,#b1913a26,transparent 60%),linear-gradient(135deg,#2a3848,#17293d);border:1px solid #b89b5a8a;box-shadow:0 6px 0 #23344833,0 10px 24px #27384f20}.gold-card .eyebrow{color:#d9bc79}.gold-card h2{color:#f7dd9e}.gold-card p{color:#c6c2b4}.gold-emblem{opacity:.75!important}.fusion-diagram{border-bottom-color:#c2a65e44}.fusion-diagram>span,.fusion-diagram b{color:#c8b88e}.fusion-diagram .gold-mini,.fusion-diagram i,.text-button{color:#eccb7a}.gold-world .gold-card{outline:0;box-shadow:0 0 22px #d7b66533}.gold-world .turn-panel .eyebrow{color:#f2d18a}
.player-row{background:#eef5fc66;border-radius:12px;margin-bottom:5px}.bottom-player{margin-top:16px;margin-bottom:0}.board-toolbar>span{color:#294964}.icon-button{background:#1e3a58;border-color:#769aba44;color:#e0edff;box-shadow:0 3px 0 #122c4530}.icon-button.on{background:#315e92;color:#fff;border-color:#9dc8fb66}.live-label{background:#203b59;color:#d7eaff;border-color:#7394b555}.gold-world .live-label{background:#5b4826;color:#ffe6a4}.gold-world .board-toolbar>span{color:#624b25}footer{color:#385675;border-color:#45668944}footer>button{color:#355574}
.sprite-ready .piece{width:91%;height:99%;filter:drop-shadow(0 3px 1px #19314e66)}.sprite-ready .piece.golden{width:99%;height:100%;filter:drop-shadow(0 0 5px #e4b52299) drop-shadow(0 4px 2px #49311144)}.sprite-ready .sq.selected .piece.golden{transform:translateY(-3px) scale(1.035)}
.sq:has(.piece){cursor:grab;touch-action:none}.sq.selected{background:#86c8d4!important}.sq.legal:after{background:#1b5ba478;border-color:#f5faffb0}.sq.drop-target{box-shadow:inset 0 0 0 4px #bdf2ff!important;background:#74bcca!important}.sq.drop-target:after{opacity:.35}.sq.drag-source>.piece,.sq.drag-source>.gold-star{opacity:.18}.drag-ghost{position:fixed;display:grid;place-items:center;z-index:100;pointer-events:none;transform:scale(1.10);filter:drop-shadow(0 16px 7px #12335655);will-change:left,top}.drag-ghost .piece{filter:drop-shadow(0 1px 1px #ffffff44)}.dragging,.dragging .sq{cursor:grabbing!important}.dragging *{user-select:none}.returning{transition:none}
.music-indicator{font-size:10px;letter-spacing:.3px;font-weight:700;color:#966917;margin-left:8px}.gold-world .player-row{background:#fff4d98c}
@media(min-width:1000px) and (max-height:850px){:root{--board-size:min(600px,calc(100dvh - 271px))}.board-wrap{padding:10px}.bottom-player{margin-top:14px}}
@media(max-width:800px){.topbar{padding:0 13px}.board-wrap{padding:9px}.player-row{padding-left:7px;padding-right:7px}.music-indicator{display:none}}
@media(max-width:480px){.topbar{padding:0 9px;margin:0 -4px;border-radius:0 0 17px 17px}.brand{font-size:13px}.quiet{padding:8px 9px}.board-wrap{padding:7px}.sprite-ready .piece{width:94%;height:99%}.sprite-ready .piece.golden{width:100%}.board-toolbar>span{color:#294964}.gold-world .board-toolbar>span{color:#624b25}}
@media(prefers-reduced-motion:reduce){.drag-ghost{transform:scale(1.06)}}
/* Deep machined tray: a raised rim, inner bevel and a visibly sunk play surface. */
.board-wrap{padding:20px 19px 25px;border-radius:22px;border:1px solid #87a6c2;background:linear-gradient(145deg,#607e9c 0,#284762 14%,#142a42 47%,#37536f 85%,#87a4b9 100%);box-shadow:0 2px 0 #9eb6c9,0 6px 0 #27445f,0 13px 0 #1a354e,0 22px 0 #0e263d,0 26px 0 #092035,0 37px 35px #142f4c55,inset 0 2px 1px #e3f2ff66;transition:box-shadow .8s,background .8s}
.board-wrap:before{content:'';position:absolute;inset:10px 9px 15px;border-radius:14px;border:1px solid #0b1e30;box-shadow:inset 0 5px 7px #020b16c9,inset 0 -2px 1px #b4cce966;pointer-events:none}.board{position:relative;border:3px solid #10283e;border-radius:8px;box-shadow:0 2px 1px #b6d0e973,0 -2px 4px #031526c7}.board:after{content:'';position:absolute;inset:0;box-shadow:inset 0 9px 9px #112f4a50,inset 8px 0 10px #14283e33,inset 0 -2px 1px #fff5;z-index:8;pointer-events:none}.board-drops{inset:22px;z-index:7}.sq{box-shadow:inset 0 1px 1px #fff5,inset 0 -1px 0 #193e5d21}.sq.dark{box-shadow:inset 0 2px 3px #15365422,inset 0 -1px 0 #d3e5ff30}.bottom-player{margin-top:34px}.gold-world .board-wrap{border-color:#d4b76f;background:linear-gradient(145deg,#e0c98a,#8c7040 15%,#443b2b 50%,#8f7446 86%,#dfc78b);box-shadow:0 2px 0 #efd89b,0 6px 0 #826838,0 13px 0 #614e2e,0 22px 0 #423621,0 26px 0 #302817,0 37px 35px #6e542e55,inset 0 2px 1px #fff2ba66}.gold-world .board{border-color:#4d4027}.gold-world .board-wrap:before{border-color:#3a301c;box-shadow:inset 0 5px 7px #2b210dcc,inset 0 -2px 1px #f2d79788}
.piece.landing{animation:piece-land .28s ease-out}@keyframes piece-land{0%{translate:0 -7px;scale:1.06}65%{translate:0 2px;scale:1.02 .95}100%{translate:0 0;scale:1}}.sq.just-landed{animation:tile-land .3s ease-out}@keyframes tile-land{35%{box-shadow:inset 0 0 18px #9ad5fb8f}100%{box-shadow:inset 0 0 0 #9ad5fb00}}
@media(min-width:1000px) and (max-height:850px){:root{--board-size:min(600px,calc(100dvh - 292px))}.board-wrap{padding:15px 14px 20px}.board-wrap:before{inset:7px 6px 12px}.bottom-player{margin-top:32px}}
@media(max-width:800px){.board-wrap{padding:15px 14px 20px}.bottom-player{margin-top:32px}}
@media(max-width:480px){.board-wrap{padding:12px 10px 16px;border-radius:17px}.board-wrap:before{inset:6px 5px 10px;border-radius:12px}.board{border-width:2px}.bottom-player{margin-top:32px}.board-drops{inset:14px}}
.pieces-ready .piece,.pieces-ready .promotion-piece,.pieces-ready .gold-emblem{background-image:none!important;font-size:0!important;-webkit-text-stroke:0!important;color:transparent!important}.pieces-ready .piece{width:94%!important;height:98%!important;filter:drop-shadow(0 3px 1px #18314b2b)}.pieces-ready .piece.golden{width:100%!important;height:104%!important;filter:drop-shadow(0 0 3px #d2a53080)}.pieces-ready .gold-emblem{opacity:.9!important;transform:rotate(8deg);width:125px;height:125px;right:-6px;top:26px}.pieces-ready .sq.selected .piece{transform:translateY(-3px)}.pieces-ready .piece svg{image-rendering:auto;max-width:none}
.sq,.piece{min-width:0;min-height:0}
.pieces-ready .gold-emblem{width:110px;height:110px;top:8px;right:0}.board-toolbar{background:#edf5fbb8;padding:7px 8px;border-radius:12px;margin-top:5px}.gold-world .board-toolbar{background:#fff4d9bd}
.board-wrap:after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at var(--gloss-x,25%) var(--gloss-y,10%),#e7f6ff19,transparent 42%);z-index:9}.gold-world .board-wrap:after{background:radial-gradient(ellipse at var(--gloss-x,25%) var(--gloss-y,10%),#fff5d421,transparent 42%)}
.theme-picker{display:flex;gap:4px;padding:4px;background:#0d1f3466;border:1px solid #7898ba55;border-radius:13px}.theme-picker button{display:flex;align-items:center;gap:7px;padding:9px 13px;background:transparent;color:#a6bed9;border:0;border-radius:9px;font-size:13px;font-weight:700;white-space:nowrap}.theme-picker button>span{font-size:10px;font-weight:800;opacity:.6}.theme-picker button.active{background:#dce8f4;color:#233f61;box-shadow:0 2px 4px #0002}.header-right{gap:14px}
@media(max-width:600px){.topbar{height:auto;min-height:111px;padding-top:9px;padding-bottom:9px;gap:8px;flex-wrap:wrap}.brand{order:1}.header-right{display:contents}.quiet{order:2;margin-left:auto}.theme-picker{order:3;width:100%;padding:3px;justify-content:center}.theme-picker>button{flex:1;justify-content:center;padding:7px 12px;font-size:12px}.theme-picker button>span{font-size:9px}main{padding-top:17px}}
.chess-clock{display:inline-block;min-width:67px;text-align:center;font-size:23px;line-height:1.15;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.5px;padding:5px 8px;color:#dce8f8;background:#203b58;border:1px solid #5d80a544;border-radius:9px;margin-left:0}.chess-clock.running{background:#eef6ff;color:#153654;border-color:#96b7d1;box-shadow:0 0 0 2px #fff6}.chess-clock.low{color:#ffb8ac;background:#623640}.player-row .player-side{display:none}.player-row .captured{margin-right:auto}.game-setting{margin:13px 0}.game-setting>label{display:block;font-size:9px;font-weight:800;letter-spacing:1px;color:#9bb3ce;margin-bottom:7px}.setting-options{display:flex;gap:5px}.setting-options>button{flex:1;background:#142b44;border:1px solid #526f914d;border-radius:9px;padding:8px 2px;color:#a4bbd3;font-size:12px;font-weight:700}.setting-options>button.active{background:#466b98;color:#fff;border-color:#8eb8e56e}.game-setting>small{font-size:10px;color:#91a8c2;display:block;margin-top:6px;line-height:1.4}.result-inner{text-align:center;padding:34px 29px}.result-emblem{font:64px 'Segoe UI Symbol',serif;color:#b8821b;line-height:1.1;margin-bottom:14px;text-shadow:0 4px 0 #e3cc9744;animation:result-pop .65s cubic-bezier(.2,.8,.3,1.2)}#result-title{font-size:42px;margin:13px 0 9px}#result-detail{font-size:21px;font-weight:750;color:#294e7a;margin:0}#result-caption{font-size:13px}.result-confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none}.result-confetti i{position:absolute;top:-15px;left:var(--x);width:7px;height:12px;background:var(--color);border-radius:2px;animation:result-fall 2s var(--delay) ease-out both}@keyframes result-fall{to{transform:translateY(420px) rotate(var(--spin));opacity:0}}@keyframes result-pop{0%{transform:scale(.4) rotate(-12deg);opacity:0}70%{transform:scale(1.12) rotate(3deg)}100%{transform:scale(1);opacity:1}}@media(max-width:480px){.chess-clock{font-size:19px;min-width:59px;padding:5px}.game-setting>label{font-size:10px}.setting-options>button{font-size:14px;padding:10px}.game-setting>small{font-size:11px}.music-indicator{display:none}}

/* Polished pieces: preserve the atlas proportions, with contact and lifted shadows. */
.pieces-ready .piece{width:98%!important;height:100%!important;filter:drop-shadow(0 2px 1px #11203575)}
.pieces-ready .piece.golden{width:100%!important;height:103%!important;filter:drop-shadow(0 2px 1px #30200588)}
.sq.press-held>.piece{transform:translateY(-4px) scale(1.045)!important;filter:drop-shadow(0 8px 3px #12243d66)!important}
.drag-ghost{transform:scale(1.08);filter:drop-shadow(0 10px 4px #101e3277)}
.drag-ghost .piece{filter:drop-shadow(0 2px 1px #0004)!important}
.sq.drag-source>.piece,.sq.drag-source>.gold-star{opacity:.1}
.sq.drag-source:before{content:'';position:absolute;width:42%;height:10%;left:29%;bottom:9%;border-radius:50%;background:#10253855;filter:blur(3px);pointer-events:none}
@media(prefers-reduced-motion:reduce){.sq.press-held>.piece{transform:none!important}.drag-ghost{transform:none}}
/* "About & Tokens" header link: an <a> that looks exactly like the .quiet button in every theme. */
a.quiet{display:inline-flex;align-items:center;box-sizing:border-box;line-height:normal;text-decoration:none;white-space:nowrap}
@media(max-width:600px){.topbar .theme-picker{width:auto;flex:1 1 auto;min-width:0}.topbar .about-link{order:4;margin-left:0}}
.topbar .quiet{white-space:nowrap}
@media(min-width:601px) and (max-width:760px){.topbar{height:auto;min-height:111px;padding-top:9px;padding-bottom:9px;gap:8px;flex-wrap:wrap}.brand{order:1}.header-right{display:contents}.topbar .quiet{order:2}#rules-top{margin-left:auto}.theme-picker{order:3;width:100%;padding:3px;justify-content:center}.theme-picker>button{flex:1;justify-content:center}}
