:root{color-scheme:dark;--mint:#b2eedc;--gold:#ffe096;--muted:#aec1d0}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top right,#28335c,transparent 60%),#0c1422;color:#f4f6fa;font:16px/1.6 system-ui,sans-serif}header,main{max-width:1100px;padding:24px;margin:auto}header{display:flex;justify-content:space-between;font-size:13px}a{color:var(--mint);text-decoration:none}h1{font-size:clamp(32px,5vw,54px);line-height:1.1;letter-spacing:-.04em;margin:12px 0}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--mint);font-size:11px}p{color:var(--muted)}button,select{background:#1c3048;color:#fff;border:1px solid #52617b;border-radius:10px;padding:11px 16px;font:600 14px system-ui;cursor:pointer;min-height:44px}button:hover{border-color:var(--mint)}:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.toolbar,.controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:20px 0}.primary{background:var(--mint);color:#10262d}#status{background:#192b3e;padding:15px 20px;border-radius:12px;border:1px solid #34516c;min-height:56px;font-weight:650}.board-shell{background:#101c30;border:1px solid #3c4c6b;border-radius:20px;padding:20px;margin:24px 0;overflow:auto}.blocks-layout{display:flex;gap:28px;justify-content:center;align-items:start}canvas{display:block;width:min(100%,300px);height:auto;background:#0a1020;border-radius:9px;touch-action:none}.stats{max-width:180px}#preview{width:120px;margin:14px 0}.controls button{touch-action:manipulation;user-select:none}.mine-grid{display:grid;gap:4px;max-width:660px;margin:auto}.mine-grid button{padding:0;min-height:32px;aspect-ratio:1;font-size:18px;border-radius:5px;background:linear-gradient(145deg,#314a6b,#23354f)}.mine-grid button.open{background:#131f32;border-color:#25384d}.mine-grid button[data-n="1"]{color:#8cbaff}.mine-grid button[data-n="2"]{color:#94e6b9}.mine-grid button[data-n="3"]{color:#ffa2ad}.mine-grid button[data-n="4"]{color:#d0b7ff}.mahjong-grid{position:relative;width:650px;height:450px;margin:auto}.tile{position:absolute;width:72px;height:62px;padding:4px;background:linear-gradient(#fff5da,#dfd8c1);color:#16473c;border:2px solid #b5a784;border-radius:8px;box-shadow:0 5px 0 #907f63;font-size:26px}.tile small{display:block;font-size:10px;line-height:12px}.tile.locked{filter:brightness(.66)}.tile.selected{outline:4px solid #82ffe1;outline-offset:2px}.tile.hint{outline:4px solid #ffd371;outline-offset:2px}.tile:disabled{cursor:default}.help{font-size:14px;max-width:800px}label{font-size:13px;color:var(--muted)}@media(max-width:600px){header,main{padding:18px}.board-shell{padding:12px}.blocks-layout{gap:12px}.stats{font-size:12px;max-width:95px}#preview{width:85px}canvas{width:220px}.mahjong-grid{width:330px;height:290px}.tile{width:36px;height:38px;font-size:19px;padding:0}.tile small{font-size:8px;line-height:9px}.mine-grid button{font-size:14px;min-height:24px}.toolbar{gap:7px}button,select{padding:10px}.controls{gap:6px}}

/* Jade collection: ivory faces, green backs and a felt playing surface. */
body[data-game="mahjong"]{background:radial-gradient(ellipse at 75% 0,#254f43,transparent 65%),#101e1b;--mint:#bee9cd;--muted:#b3c9bb}
body[data-game="mahjong"] h1{font-family:Georgia,serif;font-weight:500;letter-spacing:-.045em}
body[data-game="mahjong"] .board-shell{background:radial-gradient(ellipse at 50% 30%,#33765c,#174431 75%);border:8px solid #3a3027;box-shadow:inset 0 0 0 2px #b2985a,inset 0 0 60px #06170e80,0 16px 45px #0005;padding:24px 18px;border-radius:18px}
body[data-game="mahjong"] #status{background:#1a332b;border-color:#3d6250}
.tile{width:70px;height:86px;padding:4px 7px;background:linear-gradient(120deg,#fffef3 0%,#eee7cf 68%,#ded5b9);border:1px solid #b8ac8b;border-top:2px solid #fffce7;border-left:2px solid #fffce7;border-radius:6px;box-shadow:1px 2px 0 #bcb18e,2px 6px 0 #216146,3px 8px 0 #113e2c,5px 12px 9px #04180b66;transition:outline .12s,filter .12s;min-height:0}
.tile svg{width:100%;height:100%;display:block;filter:drop-shadow(0 1px 0 #fff9)}
.tile.locked{filter:brightness(.88);cursor:default}
.tile:not(:disabled):hover{background:linear-gradient(120deg,#fffef3,#fff0b8);outline:2px solid #e1c980;outline-offset:0}
.tile.selected{outline:3px solid #a6ffe1;outline-offset:2px;box-shadow:1px 2px 0 #bcb18e,2px 6px 0 #216146,3px 8px 0 #113e2c,0 0 18px #9cffbaaa}
.tile.hint{outline:3px solid #ffd371;outline-offset:2px}
body[data-game="demineur"]{background:radial-gradient(ellipse at 70% 0,#33434b,transparent 65%),#101a20;--mint:#f3d28a;--muted:#b2c3ca}
body[data-game="demineur"] .board-shell{background:linear-gradient(135deg,#3d4e53,#1c2b30);border:1px solid #6b7b7e;box-shadow:inset 0 2px 0 #92a2a440,0 16px 40px #0006;padding:28px}
.mine-grid{gap:3px;background:#0d1d24;padding:8px;border:2px solid #12272d;border-radius:10px;box-shadow:inset 0 2px 8px #0008}
.mine-grid button{position:relative;overflow:hidden;border-radius:4px;background:linear-gradient(145deg,#6c858b,#41585f 52%,#2d4148);border:1px solid #263a41;border-top-color:#94a6a9;border-left-color:#94a6a9;box-shadow:inset 0 0 0 1px #8da6ae30,0 2px 2px #0008;font-size:clamp(16px,2.3vw,26px);font-weight:800;text-shadow:0 1px 2px #000a;transition:background .15s;min-height:24px}
.mine-grid button:not(.open):not(:disabled):hover{background:linear-gradient(145deg,#96adb0,#59787f)}
.mine-grid button.open{background:linear-gradient(145deg,#1d2f35,#263d44);border:1px solid #172b30;box-shadow:inset 0 1px 5px #07111666}
.mine-grid button svg{display:block;width:100%;height:100%;padding:2px;filter:drop-shadow(0 2px 1px #0006)}
.mine-grid button.mine{background:#bdc5bb;border:1px solid #64736a}
.mine-grid button.detonated{background:radial-gradient(circle,#ffc477,#d64733);border-color:#fc9370;box-shadow:0 0 15px #e45b3a}
.mine-grid button.wrong-flag:after{content:"";position:absolute;inset:12%;background:linear-gradient(45deg,transparent 45%,#ff735f 46% 54%,transparent 55%),linear-gradient(-45deg,transparent 45%,#ff735f 46% 54%,transparent 55%)}
.mine-grid button[data-n="5"]{color:#ffd17c}.mine-grid button[data-n="6"]{color:#7ae3dc}.mine-grid button[data-n="7"]{color:#f4d4ee}.mine-grid button[data-n="8"]{color:#edf4fa}
@media(max-width:600px){.tile{width:35px;height:45px;padding:2px;border-radius:3px;box-shadow:1px 2px 0 #bcb18e,1px 4px 0 #216146,2px 6px 0 #113e2c,3px 8px 5px #04180b66}.mahjong-grid{width:322px}body[data-game="mahjong"] .board-shell{padding:12px 5px;border-width:5px}body[data-game="demineur"] .board-shell{padding:12px}.mine-grid{padding:4px;gap:2px}.mine-grid button{font-size:16px}}
@media(prefers-reduced-motion:reduce){.tile,.mine-grid button{transition:none}}