/* Physical surfaces share a top-left light source; board coordinates stay flat. */
body[data-board-game] .play-card{background:linear-gradient(145deg,#fffefb,#fbfaf5);box-shadow:0 2px 0 #fff inset,0 12px 32px -24px #4b3b2e45}
body[data-board-game] .board-wrap{margin-bottom:12px}
body[data-board-game=atelier] #board,body[data-board-game=bridges] #board,body[data-board-game=tents] #board{border-color:#bc925e;border-style:solid;background-clip:padding-box;box-shadow:inset 0 2px 5px #15291f48,0 6px 0 #8a603b,0 8px 0 #6b492e,0 15px 22px -9px #3b302b50;outline:1px solid #d5b989;outline-offset:-2px}
body[data-board-game] #board button:focus-visible{z-index:4;outline:3px solid #e5b44e;outline-offset:-3px}
/* Screw workshop: bored oak, layered planks and machined screw heads. */
.board.screws{background-color:#e1bd82;background-image:url('assets/timber-grain.svg'),linear-gradient(135deg,#eed2a2,#cda36c);background-size:210px 140px,100% 100%;border-color:#c29a62}
.screws .plank{filter:drop-shadow(0 4px 2px #523b283d)}
.screws .plank>path:nth-of-type(2){filter:drop-shadow(0 2px 0 #543e2e66)}
.screws .hole-button svg{filter:drop-shadow(0 3px 1px #503a3266)}
.screws .hole-button.empty svg{filter:drop-shadow(0 -1px 0 #fff0ce)}
.screws .hole-button.occupied .hole-ring{fill:#6b665b;stroke:#514b42;stroke-width:3}
.screws .hole-button.occupied .screw-face{stroke:#b4b4a7;stroke-width:2}
.screws .hole-button.occupied .screw-slot{stroke:#4e554e;stroke-width:6;filter:drop-shadow(0 1px 0 #fff8df)}
.screws .hole-button.empty .hole-ring{fill:#4b3525;stroke:#c59760;stroke-width:5;filter:drop-shadow(0 2px 0 #fff1c5)}
.screws .hole-button.selected svg,.screws .hole-button.hinted svg{filter:drop-shadow(0 0 5px #ffe99a) drop-shadow(0 3px 1px #503a3266)}
/* Tiles sit above a dark backing; live paths remain the brightest signal. */
.board.net,.board.lights{background:#213a30;gap:3px;padding:6px}
.net-cell{background:linear-gradient(145deg,#4b6754,#2e4939 48%,#263e31);border:1px solid #73917566;box-shadow:inset 0 1px 1px #c7d4ac66,inset -1px -2px 1px #142c2188,0 2px 0 #102b20;overflow:visible}
.net-cell.live{background:linear-gradient(145deg,#557762,#315b47 55%,#264c39);border-color:#a8cfa580}
.net-cell .wire-bed{stroke:#152e26;filter:drop-shadow(0 1px 0 #8ba787)}
.net-cell svg .wire{stroke:#b4b68a;filter:drop-shadow(0 1.5px 0 #626d4b)}
.net-cell.live .wire{stroke:#a4f2d4;filter:drop-shadow(0 1px 0 #5d9b81) drop-shadow(0 0 3px #7cf6ca99)}
.net-cell .terminal{filter:drop-shadow(0 2px 1px #132c21aa)}
.net-cell .source-mark{box-shadow:0 2px 0 #477954,0 0 9px #b9f5bc70;border:1px solid #e3f3c5}
.net-cell:active:not(:disabled){box-shadow:inset 0 2px 4px #102b2077;background:#284a37}
.lamp{background:linear-gradient(145deg,#4c5e45,#2d4032);border:1px solid #7c876155;box-shadow:inset 0 1px 1px #d9deb466,inset 0 -2px 1px #152e20,0 2px 0 #10271b}
.lamp .bulb{width:58%;height:58%;background:radial-gradient(circle at 34% 24%,#6b7d5b,#3d503c 55%,#253a2b);border:2px solid #9c9369;box-shadow:0 3px 0 #645c3a,0 4px 3px #12271f88,inset 0 1px 2px #b5c19788}
.lamp .bulb:after{content:'';width:33%;height:15%;position:absolute;top:27%;left:29%;border-radius:50%;background:#fff8d329;transform:rotate(-25deg);pointer-events:none}
.lamp.on{background:linear-gradient(145deg,#777447,#4c5235);border-color:#a7a66a}
.lamp.on .bulb{background:radial-gradient(circle at 35% 28%,#fff9d1,#f7d378 48%,#c8923d);border-color:#d8bb6d;box-shadow:0 3px 0 #9b6c30,0 5px 4px #17291f66,0 0 20px #ffd77280,inset 0 2px 2px #fffce9}
.lamp.diagonal .bulb{border-radius:24%;border-color:#849e9e;background:radial-gradient(circle at 35% 25%,#6a8584,#354d49 70%)}
.lamp.diagonal.on .bulb{background:radial-gradient(circle at 35% 25%,#f2ffff,#b9e4e3 50%,#70aaad);box-shadow:0 3px 0 #47767a,0 4px 3px #182f2780,0 0 18px #b7eeee70}
.lamp .toggle-mark{color:#c8c7a2;font-weight:700;text-shadow:0 1px 1px #182d20}
.lamp.diagonal .toggle-mark{color:#cee4e8}
.lamp:active:not(:disabled) .bulb{transform:translateY(2px);box-shadow:0 1px 0 #716342,inset 0 2px 4px #3c3b3a55}
/* Crates, inset brass goals, and a sculpted pawn in the warehouse. */
.board.warehouse{gap:3px;padding:5px;background:#273d2c}
.warehouse-cell.floor{background:linear-gradient(145deg,#617658,#4a6245);border:1px solid #9baf7e29;box-shadow:inset 0 1px 1px #dce7bb26,inset 0 -1px 2px #1c392333}
.warehouse-cell.wall{background-image:url('assets/timber-grain.svg'),linear-gradient(135deg,#a88352,#6c603e);border:1px solid #bba37b66;box-shadow:inset 0 2px 1px #d6c69b70,inset -2px -3px 1px #4b4628,0 3px 3px #1c2b2055}
.warehouse-cell.goal{background:linear-gradient(145deg,#70845c,#526f4b)}
.warehouse-cell .goal-dot{width:48%;height:48%;opacity:1;border:3px solid #cdb676;background:radial-gradient(circle at 60% 65%,#b6ac6e,#687550 70%);box-shadow:inset 0 2px 3px #3a3c2588,0 1px 0 #dbe4b4;z-index:0}
.warehouse-cell .crate{inset:10% 11% 15%;border-color:#e4c187;background-image:url('assets/timber-grain.svg'),linear-gradient(145deg,#efd09b,#bf8d4c 80%);background-size:110px 80px,100% 100%;box-shadow:0 3px 0 #8c6037,0 6px 4px #23352688,inset 0 1px 0 #fff0cb,inset 0 0 0 3px #9a693a50;z-index:1}
.crate:before,.crate:after{height:10%;background:linear-gradient(#f0cf97,#a8763b);border-top:1px solid #ffe2a8;box-shadow:0 1px 1px #7e572d55}
.warehouse-cell.filled .crate{background-image:url('assets/timber-grain.svg'),linear-gradient(145deg,#d1dd9f,#91b36e);border-color:#d6e8ad;box-shadow:0 3px 0 #597a40,0 5px 4px #23352677,inset 0 1px 0 #f2ffcc}
.warehouse-cell .player{inset:10% 17% 13%;border:0;background:transparent;box-shadow:none;filter:drop-shadow(1px 4px 2px #152d2380);z-index:2}
.warehouse-cell .player:before{width:53%;height:43%;top:1%;left:24%;border-radius:50%;background:radial-gradient(circle at 32% 24%,#e3f1cc,#a8c79a 55%,#6f9b76);box-shadow:inset 0 1px 1px #fff7ce,0 2px 0 #5f8765;z-index:2}
.warehouse-cell .player:after{width:83%;height:66%;bottom:0;left:9%;border-radius:48% 48% 38% 38%;background:radial-gradient(ellipse at 32% 20%,#d0e2b7,#85ad82 65%,#577e61);box-shadow:inset 1px 1px 1px #e9edc6,0 2px 0 #486b52}
/* Shared wooden trays for the two independently rendered boards. */
body[data-board-game=parking] .board-frame,body[data-board-game=light] .board-frame{background-color:#c29b68;background-image:url('assets/timber-grain.svg'),linear-gradient(145deg,#e1bf87,#ac7f4c);border-color:#d7bb8b;overflow:hidden;box-shadow:inset 0 2px 1px #fff1c5,inset 0 -2px 1px #95663b,0 6px 0 #8d623b,0 8px 0 #6c492b,0 16px 24px -10px #4c392a70}
body[data-board-game=parking] #board{background-color:#7f9674;background-image:linear-gradient(to right,#ecedd08c 1px,transparent 1px),linear-gradient(to bottom,#ecedd08c 1px,transparent 1px),linear-gradient(145deg,#8ba17f,#6d8765);background-size:calc(100% / var(--size)) calc(100% / var(--size)),calc(100% / var(--size)) calc(100% / var(--size)),100% 100%;box-shadow:inset 0 2px 5px #2a422e66,inset 0 0 0 1px #566f50}
body[data-board-game=parking] .block .vehicle{filter:drop-shadow(0 2px 0 #29362488) drop-shadow(1px 4px 2px #263b2855)}
body[data-board-game=parking] .block.switch{box-shadow:0 3px 0 #b48727,0 5px 5px #33412c66,inset 0 1px 0 #fff9d6}
body[data-board-game=parking] .block:active:not(.ghost) .vehicle{filter:drop-shadow(0 1px 1px #263b2877)}
/* Raised metal mirror mounts, with beams remaining crisp above the backplate. */
body[data-board-game=light] #board{background:radial-gradient(ellipse at 25% 15%,#355b61,#223e48 60%,#1c343f);box-shadow:inset 0 3px 7px #091d2799,inset 0 0 0 1px #a6b6a440}
body[data-board-game=light] .mirror-tile{inset:5px;background:linear-gradient(145deg,#638080,#3c5d62 50%,#2d4c54);border-color:#9ab1a2;box-shadow:0 3px 0 #1c353c,0 5px 3px #11252e88,inset 0 1px 1px #e0e6ca66}
body[data-board-game=light] .mirror-angle{height:8px;top:calc(50% - 4px);background:linear-gradient(#fcfff5,#b9d4d9 35%,#7c9da7 65%,#d8eeee);border-color:#edf6dc;box-shadow:0 3px 0 #57727d,0 5px 3px #11252e77}
body[data-board-game=light] .hinge{background:radial-gradient(circle at 30% 25%,#fff3cc,#baa271 65%,#806846);border-color:#e6d3a3;box-shadow:0 1px 1px #102a31}
body[data-board-game=light] .mirror.fixed .mirror-tile{background:linear-gradient(145deg,#5b6661,#394a48);border-color:#8f9990}
body[data-board-game=light] .mirror.energized .mirror-tile{border-color:var(--light);box-shadow:0 3px 0 #183039,0 5px 3px #10232c88,0 0 9px color-mix(in srgb,var(--light) 35%,transparent),inset 0 1px 0 #d7f4eb77}
body[data-board-game=light] .mirror:active:not(:disabled) .mirror-tile{box-shadow:0 1px 0 #1c353c,inset 0 2px 3px #17343d;transform:translateY(2px)}
body[data-board-game=light] #endpointLayer>g{filter:drop-shadow(0 2px 1px #071a27aa)}
body[data-board-game=light] #wallLayer>g{filter:drop-shadow(0 3px 1px #091c25aa)}
/* Ceramic disk, colored pegs, and raised cords. */
body[data-board-game=color] #board{filter:drop-shadow(0 9px 7px #69533d26)}
body[data-board-game=color] #pathLayer,body[data-board-game=color] #draftLayer{filter:drop-shadow(0 3px 0 #614f6b44)}
body[data-board-game=color] #wallLayer{filter:drop-shadow(0 3px 1px #69577544)}
body[data-board-game=color] .peg-face{filter:drop-shadow(0 2px 0 #43374488)}
body[data-board-game=color] #dotLayer [role=button]:focus-visible{outline:none;filter:drop-shadow(0 0 4px #90683c)}
/* Moss-edged numbered islands and wooden bridge decks on translucent water. */
.logic-board.bridges{background:radial-gradient(ellipse at 25% 10%,#d6f0e4,#9bcec7 55%,#78b4ba);border-width:10px}
.bridges .island{background:radial-gradient(circle at 33% 26%,#fffde7,#e5e0b9 80%);border:3px solid #7a9c69;color:#405b46;box-shadow:0 3px 0 #627e60,0 5px 0 #567b6a,1px 7px 5px #3d6d6b70,inset 0 1px 2px #fffef5;text-shadow:0 1px #fff9d8;font-variant-numeric:tabular-nums}
.bridges .island.matched{background:radial-gradient(circle at 30% 25%,#e4f2cb,#b3d09e);border-color:#5e8c53;color:#36552c}
.bridges .island.over{background:radial-gradient(circle at 30% 25%,#ffe1bb,#e7b489);border-color:#b16e4a;color:#913b23}
.bridges .island.selected{outline-color:#315f73;outline-width:3px}
.bridges .island.hinted{outline:3px solid #f0bd49;outline-offset:2px}
.bridges .bridge-guide{stroke:#5f9d9c;stroke-opacity:.45}
.bridges .bridge-deck{filter:drop-shadow(0 3px 0 #6f785977) drop-shadow(1px 5px 2px #2d686b55)}
.bridges .bridge-grain{pointer-events:none}
/* Embossed grassy cells and small sculpted trees/canvas tents. */
.logic-board.tents{background-color:#becb9e;background-image:url('assets/timber-grain.svg');border-width:10px;border-color:#c19b62;gap:4px;padding:6px}
.tents .tent-cell{background:linear-gradient(145deg,#eef1d3,#d4ddb5);border:1px solid #e6ebcc;box-shadow:0 2px 0 #a2b183,inset 0 1px 0 #ffffed}
.tents .tent-cell.tree{background:linear-gradient(145deg,#cbdcaf,#a8c48e);border-color:#c8d8aa}
.tents .tent-cell.tent{background:linear-gradient(145deg,#efe2b9,#d7cca0);border-color:#f3e4bf}
.tents .tent-cell.grass{background:linear-gradient(145deg,#c9d9a4,#b5c893);color:#6c8a4b}
.tents .tent-cell svg{width:94%;height:94%;filter:drop-shadow(1px 3px 1px #455c3c66)}
.tents .tent-count{color:#4e633e;font-weight:750;text-shadow:0 1px #f2f1cf}
.tents .tent-count.matched{color:#2e693f}.tents .tent-count.over{color:#a94e2c}
.tents .tent-cell:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 1px 3px #6d7d4d66}
@media(max-width:700px){body[data-board-game=atelier] #board,.logic-board.bridges,.logic-board.tents{border-width:7px;box-shadow:inset 0 2px 3px #15291f3b,0 4px 0 #8a603b,0 6px 0 #6b492e,0 11px 15px -8px #3b302b66}.board.net,.board.lights,.board.warehouse{gap:2px;padding:3px}.warehouse-cell .goal-dot{border-width:2px}.warehouse-cell .crate{box-shadow:0 2px 0 #8c6037,0 4px 3px #23352677,inset 0 1px 0 #fff0cb,inset 0 0 0 1px #9a693a50}.lamp .bulb{border-width:1px}.bridges .island{border-width:2px;font-size:16px;box-shadow:0 2px 0 #627e60,0 4px 0 #567b6a,1px 5px 3px #3d6d6b60}.logic-board.tents{padding:3px;gap:2px}.tents .tent-cell svg{filter:drop-shadow(0 2px 1px #455c3c55)}body[data-board-game=light] .mirror-tile{inset:3px}body[data-board-game=light] .mirror-angle{height:6px;top:calc(50% - 3px)}}
@media(prefers-reduced-motion:reduce){body[data-board-game] #board *,body[data-board-game] #board *:before,body[data-board-game] #board *:after{animation:none!important;transition:none!important}}
