:root{font-family:system-ui,"Yu Gothic UI","Meiryo",sans-serif;color:#e9efff;background:#0d1427}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at 50% -20%,#243c68 0,#0d1427 45%,#0a1020 100%);min-height:100vh}button,select{font:inherit}button{cursor:pointer;border:1px solid #466082;border-radius:9px;background:#17243c;color:#e9efff;padding:9px 14px}button:hover:not(:disabled){border-color:#8dbdf2;background:#213b60}button:disabled{opacity:.45;cursor:default}.shell{max-width:1660px;margin:auto;padding:26px clamp(14px,3vw,42px)}.top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.eyebrow{color:#80bbec;font-size:11px;letter-spacing:.22em;font-weight:800;margin:0 0 8px}.top h1{font-size:clamp(30px,4vw,50px);line-height:1.1;letter-spacing:.08em;margin:0}.subtitle{color:#a9bad4;margin:10px 0 0}.top-actions{display:flex;gap:8px;flex-wrap:wrap}.primary{background:#2b78b4;border-color:#5fa9df;font-weight:700}.primary:hover{background:#3a8ccd!important}.controlbar{display:flex;align-items:center;gap:17px;flex-wrap:wrap;padding:12px 17px;background:#14233a;border:1px solid #28415e;border-radius:12px;margin-bottom:22px;color:#c8d7ec}.controlbar label{display:flex;align-items:center;gap:10px;font-size:14px}.controlbar select{background:#0e1a30;border:1px solid #415e7b;color:#fff;border-radius:7px;padding:7px 28px 7px 10px}.separator{height:22px;width:1px;background:#3b536f}.legend{display:flex;align-items:center;gap:7px;font-size:12px}.mark{width:11px;height:11px;border-radius:50%;display:inline-block;margin-left:8px}.mark.move{background:#80c5ff}.mark.capture{background:#ff8c7a}.mark.selected{background:#ffe08a}.controlbar #claimDraw{margin-left:auto;border-color:#9e829f}.game{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:20px;align-items:start}.boards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.layer-card{min-width:0;background:#142239;border:1px solid #35506b;border-radius:13px;padding:12px;box-shadow:0 14px 40px #0003}.layer-title{display:flex;align-items:center;justify-content:space-between;margin:0 0 11px;padding:0 4px}.layer-title h2{font-size:16px;margin:0;letter-spacing:.08em}.layer-title span{font-size:11px;color:#93a9c5}.chessboard{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;background:#09172b;border:2px solid #55708f;box-shadow:inset 0 0 0 1px #0a1628}.square{position:relative;border:0;border-radius:0;padding:0;display:grid;place-items:center;min-width:0;min-height:0;aspect-ratio:1;line-height:1;color:inherit}.square.light{background:#b7c9d9}.square.dark{background:#577795}.square.void{background:#0c1a2e;box-shadow:inset 0 0 0 1px #1b3048;cursor:default}.square:not(.void):hover{filter:brightness(1.12)}.square:focus-visible{outline:3px solid #fff;outline-offset:-3px;z-index:2}.square.selected{box-shadow:inset 0 0 0 4px #ffe18c;z-index:1}.square.last{box-shadow:inset 0 0 0 3px #96c3ed}.square.move::after{content:"";position:absolute;width:27%;aspect-ratio:1;border-radius:50%;background:#2b96dbb8;pointer-events:none}.square.capture::after{content:"";position:absolute;inset:5%;border:4px solid #f77569;border-radius:50%;pointer-events:none}.piece{position:relative;z-index:1;width:74%;height:74%;display:grid;place-items:center;border-radius:50%;font-family:Georgia,serif;font-size:clamp(12px,1.4vw,24px);font-weight:900;box-shadow:0 3px 6px #08172a8c}.piece.white{background:linear-gradient(145deg,#fff,#d7e6f2);border:2px solid #7f9abb;color:#1a3453}.piece.black{background:linear-gradient(145deg,#263e64,#0d1c36);border:2px solid #7ba5cc;color:#edf6ff}.coord{position:absolute;left:2px;bottom:2px;font-size:clamp(6px,.65vw,9px);font-weight:800;color:#192e43;opacity:.72}.dark .coord{color:#e7f5ff}.sidebar{display:grid;gap:14px}.status-card,.card{background:#142239;border:1px solid #35506b;border-radius:13px;padding:18px}.status-card{border-top:3px solid #81b9ec}.small-title{color:#89acd0;font-size:11px;font-weight:800;letter-spacing:.15em;margin:0 0 10px}.status-card h2{font-size:24px;line-height:1.25;margin:0 0 7px}.status-card p#detail{color:#b8cce4;margin:0;min-height:40px;font-size:13px}.mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;border-top:1px solid #304660;margin-top:15px;padding-top:14px}.mini-stats div{display:grid;gap:3px}.mini-stats strong{font-size:20px}.mini-stats small{color:#93a9c5;font-size:10px}.card h3{font-size:16px;margin:0}.card-head{display:flex;align-items:center;justify-content:space-between}.text-button{padding:4px 6px;border:0;background:transparent;color:#8dc8f5;font-size:12px}.history{padding-left:25px;margin:14px 0 0;max-height:350px;overflow:auto;font-size:12px;line-height:1.6;color:#d2e0ef}.history li{margin:0 0 5px}.history li::marker{color:#7296b9}.history .empty{list-style:none;color:#8197b2;margin-left:-24px}.rules p{font-size:12px;color:#afc3da;line-height:1.7}.rules a{font-size:12px;color:#92d0ff}footer{color:#8098b4;text-align:center;font-size:11px;margin:23px 0 0}dialog{background:#172942;border:1px solid #77a6cf;color:#fff;border-radius:14px;min-width:min(340px,90vw);box-shadow:0 25px 80px #000a}dialog::backdrop{background:#020817b8}dialog h2{margin:0 0 8px}dialog p{color:#b8cce4;font-size:13px}.promotion-choices{display:flex;gap:8px;margin-top:18px}.promotion-choices button{flex:1;padding:13px 5px;font-weight:800}@media(max-width:1300px){.game{grid-template-columns:1fr}.sidebar{grid-template-columns:repeat(3,1fr)}.history{max-height:250px}}@media(max-width:850px){.boards{grid-template-columns:1fr;max-width:510px;margin:auto;width:100%}.sidebar{grid-template-columns:1fr}.piece{font-size:clamp(20px,5vw,31px)}.coord{font-size:9px}.top{align-items:flex-start;flex-direction:column}.separator{display:none}}
.layer-card:nth-child(1){order:2}.layer-card:nth-child(2){order:1}.layer-card:nth-child(3){order:3}@media(max-width:850px){.layer-card:nth-child(1),.layer-card:nth-child(2),.layer-card:nth-child(3){order:initial}}
[hidden]{display:none!important}.viewbar{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin:-5px 0 20px;padding:10px 13px;background:#101d31;border:1px solid #2b435e;border-radius:12px}.segmented{display:flex;gap:3px;padding:3px;border:1px solid #3a5470;border-radius:10px}.segmented button{border:0;background:transparent;padding:7px 12px}.segmented button.active{background:#2d78af;box-shadow:0 2px 7px #0005}.viewbar #viewHint{color:#94acc8;font-size:12px}.view-actions{display:flex;align-items:center;gap:7px;margin-left:auto}.view-actions label{display:flex;align-items:center;gap:7px;color:#bdcfe4;font-size:12px}.view-actions select{background:#132640;border:1px solid #526f8d;color:#fff;border-radius:7px;padding:6px}.view-actions button{font-size:12px;padding:7px 9px}.viewer{min-width:0;background:#142239;border:1px solid #35506b;border-radius:13px;padding:13px}.viewer-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:0 4px 10px}.viewer-head strong{letter-spacing:.08em}.viewer-head span{font-size:11px;color:#a1b8d0}.viewer>p{text-align:center;color:#9bb2ce;font-size:12px;margin:11px 0 2px}.viewport{position:relative;height:clamp(500px,58vw,670px);overflow:hidden;perspective:1000px;touch-action:none;cursor:grab;border:1px solid #385776;border-radius:9px;background:radial-gradient(circle at 50% 55%,#1d3855 0,#0d1b31 58%,#091322 100%)}.viewport:active{cursor:grabbing}.viewport:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#b3dcff77 1px,transparent 1px);background-size:49px 53px;opacity:.3}.world{--zoom:1;--fit:1;position:absolute;left:50%;top:50%;width:420px;height:420px;transform-style:preserve-3d;transform:translate(-50%,-50%) rotateX(var(--tilt,58deg)) rotateZ(var(--yaw,-30deg)) scale(calc(var(--zoom)*var(--fit)));transition:transform .1s linear}.plane{position:absolute;inset:0;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);transform-style:preserve-3d;border:3px solid #9dc9e3;box-shadow:0 0 0 5px #072037,0 10px 38px #0009}.plane[data-level="2"]{transform:translateZ(130px);border-color:#9dcce6}.plane[data-level="1"]{transform:translateZ(0);border-color:#c7d8ed}.plane[data-level="0"]{transform:translateZ(-130px);border-color:#759ab9}.plane-label{position:absolute;left:0;top:-28px;color:#d2ecff;font-size:13px;font-weight:800;text-shadow:0 2px 3px #07101e;pointer-events:none}.cell3d{position:relative;display:grid;place-items:center;border:1px solid #172c4266;padding:0;min-width:0;min-height:0;border-radius:0;transform-style:preserve-3d}.cell3d.light{background:#b8d3e4d9}.cell3d.dark{background:#507697d9}.cell3d.void{background:transparent;border:0;pointer-events:none}.cell3d:not(.void):hover{filter:brightness(1.3)}.cell3d.selected{box-shadow:inset 0 0 0 4px #ffdf83}.cell3d.last{box-shadow:inset 0 0 0 3px #8bc8ff}.cell3d.move:after{content:"";width:32%;aspect-ratio:1;border-radius:50%;background:#0075d3;position:absolute}.cell3d.capture:after{content:"";position:absolute;inset:6%;border:4px solid #ff756a;border-radius:50%}.piece3d{display:grid;place-items:center;width:72%;height:72%;border-radius:50%;position:relative;transform:translateZ(10px);font:900 25px Georgia,serif;box-shadow:0 6px 0 #25364a,0 12px 12px #0008;pointer-events:none}.piece3d.white{background:linear-gradient(145deg,#fff,#cbdceb);color:#153655;border:2px solid #6687a4}.piece3d.black{background:linear-gradient(145deg,#314b6b,#09182e);color:#f5faff;border:2px solid #92b8d7}@media(max-width:850px){.viewer{max-width:740px;margin:auto;width:100%}}@media(max-width:600px){.viewer{--fit:.68}.viewport{height:500px}.view-actions{margin-left:0}.viewbar #viewHint{width:100%}}
.plane{pointer-events:none}.cell3d:not(.void){pointer-events:auto}
.piece-model-layer{position:absolute;inset:0;z-index:5;pointer-events:none;width:100%;height:100%}.models-ready .piece3d{visibility:hidden}
.controlbar .move-toggle{display:inline-flex;align-items:center;gap:9px;padding:5px 9px;border:1px solid #4b6d8e;border-radius:8px;background:#0d1d32;cursor:pointer;white-space:nowrap}.move-toggle input{width:17px;height:17px;margin:0;accent-color:#70baf0;cursor:pointer}.move-toggle strong{min-width:33px;text-align:center;font-size:11px;padding:3px 5px;border-radius:5px;background:#2e78ad;color:#fff}.move-toggle:has(input:not(:checked)) strong{background:#3b4c63;color:#c2cfdf}
.focus-notice{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px;padding:8px 10px;border:1px solid #8b7037;border-radius:8px;background:#352b1b;color:#ffe4a7;font-size:12px}.focus-notice button{padding:5px 9px;border-color:#c29348;background:#65462d;color:#fff;white-space:nowrap}
.top-actions{align-items:center}.game-clock{display:flex;align-items:baseline;gap:10px;padding:8px 12px;border:1px solid #385b7c;border-radius:9px;background:#0d1d32;white-space:nowrap}.game-clock span{color:#aac5df;font-size:12px}.game-clock time{font-variant-numeric:tabular-nums;font-size:22px;font-weight:800;letter-spacing:.04em;color:#eef7ff}

/* Meshy Neon Chess Royale inspired presentation; interactive boards remain native UI. */
body{background:radial-gradient(ellipse at 48% -30%,#285e66 0,transparent 54%),radial-gradient(ellipse at 100% 70%,#452844 0,transparent 44%),#0a1221}
.top h1{color:#f7ead0;text-shadow:0 2px 22px #42d9bb66}
.eyebrow,.small-title{color:#8fe7d3}
.primary,.segmented button.active{background:linear-gradient(145deg,#1f8b87,#236783);border-color:#8ae7cf}
.layer-card,.viewer,.card,.status-card,.controlbar,.viewbar{border-color:#5a6270;background:linear-gradient(160deg,#1b2b3a,#111d30 70%);box-shadow:0 15px 38px #02080f66}
.layer-card{border-top:3px solid #d1ad70}
.layer-card:nth-child(1){border-top-color:#83dbd3}.layer-card:nth-child(3){border-top-color:#af85b5}
.chessboard{border:5px ridge #be9a64;box-shadow:0 0 0 3px #23313c,0 18px 28px #0008,inset 0 0 0 1px #e7d1a4}
.square.light,.cell3d.light{background:linear-gradient(135deg,#e2dfd2,#c9d7d0)}
.square.dark,.cell3d.dark{background:linear-gradient(135deg,#497c7b,#284e60)}
.square.void{background:#0c192b}
.coord{color:#42535b}.dark .coord{color:#d8eee8}
.piece,.piece3d{font-family:"Segoe UI Symbol","DejaVu Sans",serif;font-weight:400;line-height:1;isolation:isolate}
.piece{width:79%;height:79%;font-size:clamp(17px,2.2vw,38px);border-width:2px;box-shadow:0 2px 0 #15292c,0 5px 5px #0008,inset 0 0 0 2px #ffffff55}
.piece.white,.piece3d.white{background:radial-gradient(circle at 34% 24%,#fff9e6,#e8d9aa 53%,#a88758);color:#4a3853;border-color:#efda9a;text-shadow:0 1px #fff7d5,0 0 6px #f9f0de}
.piece.black,.piece3d.black{background:radial-gradient(circle at 34% 24%,#734761,#412943 58%,#1a1c36);color:#f2d8e9;border-color:#ce91b1;text-shadow:0 1px #2c1527,0 0 9px #f391dd}
.piece::before,.piece3d::before{content:"";position:absolute;inset:4px;border:1px solid #fff8d688;border-radius:50%;pointer-events:none}
.piece[data-piece="k"],.piece3d[data-piece="k"]{box-shadow:0 2px 0 #15292c,0 5px 7px #0009,0 0 12px #ffda8d77,inset 0 0 0 2px #ffffff55}
.piece[data-piece="p"]{font-size:clamp(15px,1.8vw,31px)}
.plane{border:5px ridge #bc9c72;box-shadow:0 0 0 5px #102932,0 15px 34px #000b}
.plane[data-level="2"]{border-color:#8ce2d9}.plane[data-level="0"]{border-color:#ba90b9}
.cell3d{border-color:#183a4355}.piece3d{width:74%;height:74%;font-size:34px;transform:translateZ(18px);box-shadow:0 3px 0 #133d45,0 9px 0 #172c35,0 15px 14px #0009}
.plane[data-level="2"] .cell3d.light{background:linear-gradient(135deg,#e2dfd2aa,#c9d7d0aa)}
.plane[data-level="2"] .cell3d.dark{background:linear-gradient(135deg,#497c7b99,#284e6099)}
.plane[data-level="1"] .cell3d.light{background:linear-gradient(135deg,#e2dfd2d9,#c9d7d0d9)}
.plane[data-level="1"] .cell3d.dark{background:linear-gradient(135deg,#497c7bcf,#284e60cf)}
.piece3d[data-piece="p"]{font-size:29px}
.viewport{background:radial-gradient(circle at 50% 52%,#24555d 0,#11273b 55%,#091624 100%);border-color:#9d9a79}
.inspiration-card{overflow:hidden;border:1px solid #b49b78;border-radius:13px;background:linear-gradient(155deg,#2a3b40,#152030);box-shadow:0 12px 30px #0007}
.inspiration-card img{display:block;width:100%;height:156px;object-fit:cover;object-position:center 64%;background:#151619}
.inspiration-card>div{padding:13px 15px 15px}
.inspiration-card h3{margin:0 0 6px;color:#f4e1ba;font-size:15px}
.inspiration-card p:not(.small-title){font-size:11px;line-height:1.55;color:#c2d9d8;margin:0 0 7px}
.inspiration-card .small-title{font-size:9px;margin:0 0 5px;letter-spacing:.19em}
.inspiration-card a{color:#9fe9dd;font-size:11px}
@media(max-width:1300px){.inspiration-card img{height:120px}}

/* A shallow physical frame, kept separate from the interactive grid cells. */
.plane{--rim:#d5bb89;--edge-bright:#9e8055;--edge-dark:#303d48;border:7px ridge var(--rim);box-shadow:inset 0 0 0 2px #fff3cc99,0 0 0 3px #152833,0 0 24px #d4b57644,0 24px 35px #000b}
.plane[data-level="2"]{--rim:#93dcd3;--edge-bright:#5aada7;--edge-dark:#1c4b57;border-color:var(--rim)}
.plane[data-level="0"]{--rim:#c49bc1;--edge-bright:#8d668e;--edge-dark:#302742;border-color:var(--rim)}
.slab-bottom,.slab-side{position:absolute;pointer-events:none;backface-visibility:visible}
.slab-bottom{inset:-7px;transform:translateZ(-19px);border:3px solid var(--edge-bright);background:#152b3799;box-shadow:0 24px 42px #000b}
.slab-side{background:linear-gradient(180deg,var(--rim) 0 12%,var(--edge-bright) 19%,var(--edge-dark) 73%,#111b28 100%);border:1px solid #f6e3b265;box-shadow:inset 0 1px 3px #fff7d777}
.slab-side.front{left:-7px;right:-7px;top:100%;height:19px;transform-origin:top;transform:rotateX(-90deg)}
.slab-side.back{left:-7px;right:-7px;bottom:100%;height:19px;transform-origin:bottom;transform:rotateX(90deg)}
.slab-side.left{top:-7px;bottom:-7px;right:100%;width:19px;transform-origin:right;transform:rotateY(-90deg)}
.slab-side.right{top:-7px;bottom:-7px;left:100%;width:19px;transform-origin:left;transform:rotateY(90deg)}
.chessboard{border:7px ridge #c7a66e;box-shadow:0 0 0 3px #314350,0 7px 0 #775b3e,0 10px 0 #28303b,0 24px 30px #0009,inset 0 0 0 2px #f6e8c2}
#toggleAuto{border-color:#d4ad70;background:linear-gradient(145deg,#655039,#3e3440);font-weight:700}

.captured-card{display:grid;gap:10px}.captured-card h3{margin:0 0 2px}.captured-side{display:grid;gap:5px;padding-top:8px;border-top:1px solid #3c5460}.captured-side strong{font-size:12px;color:#cbd9dc}.captured-pieces{display:flex;align-items:center;flex-wrap:wrap;gap:5px;min-height:34px;color:#8199a7;font-size:12px}.captured-piece{display:grid;place-items:center;width:29px;height:29px;border-radius:6px;font:25px Georgia,serif;line-height:1;box-shadow:0 2px 4px #0007}.captured-piece.white{background:#e9dbb9;color:#49372b}.captured-piece.black{background:#474262;color:#e0d6f0}

/* The square grid remains interactive in both themes; only its finish changes. */
body[data-theme="standard"]{background:radial-gradient(ellipse at 50% -20%,#654735 0,transparent 55%),#191b23}
body[data-theme="standard"] .layer-card,body[data-theme="standard"] .viewer,body[data-theme="standard"] .card,body[data-theme="standard"] .status-card,body[data-theme="standard"] .controlbar,body[data-theme="standard"] .viewbar{background:linear-gradient(155deg,#312d2d,#1b2027 75%);border-color:#81694e}
body[data-theme="standard"] .square.light,body[data-theme="standard"] .cell3d.light{background:linear-gradient(135deg,#f0e2c3,#d6c49d)}
body[data-theme="standard"] .square.dark,body[data-theme="standard"] .cell3d.dark{background:linear-gradient(135deg,#946a48,#6d4634)}
body[data-theme="standard"] .plane,body[data-theme="standard"] .plane[data-level]{--rim:#ae8251;--edge-bright:#775231;--edge-dark:#30261f;border-color:#ae8251;box-shadow:inset 0 0 0 2px #f2d6a288,0 0 0 4px #3d2b20,0 24px 35px #000b}
body[data-theme="standard"] .chessboard{border-color:#ad7f4a;box-shadow:0 0 0 3px #3b2c21,0 7px 0 #65452d,0 23px 30px #0009}
body[data-theme="standard"] .viewport{background:radial-gradient(circle at 50% 50%,#58483b,#242935 60%,#131924);border-color:#a37e53}
body[data-theme="standard"] .inspiration-card{background:linear-gradient(155deg,#45392f,#24272d);border-color:#a58158}
body[data-theme="standard"] .captured-piece.black{background:#624731;color:#f5dfbc}

body[data-theme="druid"]{background:radial-gradient(ellipse at 50% -20%,#355c3e 0,transparent 56%),#0e1c1b}
body[data-theme="druid"] .layer-card,body[data-theme="druid"] .viewer,body[data-theme="druid"] .card,body[data-theme="druid"] .status-card,body[data-theme="druid"] .controlbar,body[data-theme="druid"] .viewbar{background:linear-gradient(155deg,#243c31,#142626 76%);border-color:#6c815b}
body[data-theme="druid"] .square.light,body[data-theme="druid"] .cell3d.light{background:radial-gradient(circle at 28% 28%,#d7d9a9 0 2px,transparent 3px),linear-gradient(145deg,#c8c7a1,#aeb493)}
body[data-theme="druid"] .square.dark,body[data-theme="druid"] .cell3d.dark{background:radial-gradient(circle at 70% 65%,#668e5b 0 2px,transparent 3px),linear-gradient(145deg,#5d8059,#3d604a)}
body[data-theme="druid"] .plane,body[data-theme="druid"] .plane[data-level]{--rim:#8b7652;--edge-bright:#756444;--edge-dark:#2f3c2e;border-color:#8b7652;box-shadow:inset 0 0 0 2px #d6c79688,0 0 0 4px #314a35,0 0 20px #90b45d33,0 24px 35px #000b}
body[data-theme="druid"] .chessboard{border-color:#866b4b;box-shadow:0 0 0 3px #36503a,0 7px 0 #5d4a35,0 23px 30px #0009}
body[data-theme="druid"] .viewport{background:radial-gradient(circle at 50% 50%,#315c45,#17312e 60%,#0b1b1d);border-color:#829664}
body[data-theme="druid"] .inspiration-card{background:linear-gradient(155deg,#334b38,#1a2928);border-color:#8c9a64}
body[data-theme="standard"] .plane .cell3d.light{background:linear-gradient(135deg,#f0e2c3e8,#d6c49ddd)}
body[data-theme="standard"] .plane .cell3d.dark{background:linear-gradient(135deg,#946a48e8,#6d4634dd)}
body[data-theme="druid"] .plane .cell3d.light{background:radial-gradient(circle at 28% 28%,#d7d9a999 0 2px,transparent 3px),linear-gradient(145deg,#c8c7a1d9,#aeb493d9)}
body[data-theme="druid"] .plane .cell3d.dark{background:radial-gradient(circle at 70% 65%,#668e5b99 0 2px,transparent 3px),linear-gradient(145deg,#5d8059d9,#3d604ad9)}

.bgm-volume input{width:90px;vertical-align:middle}

/* ---- 盤の質感: Meshy(CC0)の盤を真上から撮った画像から作成。assets/boards/ ---- */
body[data-theme="druid"] .square.light,body[data-theme="druid"] .cell3d.light,body[data-theme="druid"] .plane .cell3d.light{background:url(assets/boards/stone-light.webp) center/cover}
body[data-theme="druid"] .square.dark,body[data-theme="druid"] .cell3d.dark,body[data-theme="druid"] .plane .cell3d.dark{background:url(assets/boards/stone-dark.webp) center/cover}
body[data-theme="druid"] .plane,body[data-theme="druid"] .plane[data-level],body[data-theme="druid"] .chessboard{border:20px solid transparent;border-image:url(assets/boards/stone-frame.webp) 9% / 20px stretch;background:#16301f}
body[data-theme="standard"] .square.light,body[data-theme="standard"] .cell3d.light,body[data-theme="standard"] .plane .cell3d.light{background:url(assets/boards/wood-light.webp) center/cover}
body[data-theme="standard"] .square.dark,body[data-theme="standard"] .cell3d.dark,body[data-theme="standard"] .plane .cell3d.dark{background:url(assets/boards/wood-dark-warm.webp) center/cover}

body[data-theme="lattice"]{background:radial-gradient(ellipse at 50% -20%,#6a4a34 0,transparent 55%),#1b1a20}
body[data-theme="lattice"] .layer-card,body[data-theme="lattice"] .viewer,body[data-theme="lattice"] .card,body[data-theme="lattice"] .status-card,body[data-theme="lattice"] .controlbar,body[data-theme="lattice"] .viewbar{background:linear-gradient(155deg,#3b3028,#201f25 76%);border-color:#a58158}
body[data-theme="lattice"] .square.light,body[data-theme="lattice"] .cell3d.light,body[data-theme="lattice"] .plane .cell3d.light{background:url(assets/boards/wood-light.webp) center/cover}
body[data-theme="lattice"] .square.dark,body[data-theme="lattice"] .cell3d.dark,body[data-theme="lattice"] .plane .cell3d.dark{background:url(assets/boards/wood-dark-warm.webp) center/cover}
body[data-theme="lattice"] .plane,body[data-theme="lattice"] .plane[data-level]{--rim:#8a5f3b;--edge-bright:#6b4528;--edge-dark:#2a1d15;border:10px solid #5a3a24;box-shadow:inset 0 0 0 2px #e2b987aa,0 0 0 4px #2a1d15,0 24px 35px #000b;background:#5a3a24}
body[data-theme="lattice"] .chessboard{border:10px solid #5a3a24;box-shadow:0 0 0 3px #2a1d15,0 7px 0 #4a3020,0 23px 30px #0009}
body[data-theme="lattice"] .viewport{background:radial-gradient(circle at 50% 50%,#5a4637,#262630 60%,#131924);border-color:#a37e53}
body[data-theme="lattice"] .inspiration-card{background:linear-gradient(155deg,#45392f,#24272d);border-color:#a58158}

body[data-theme="crown"]{background:radial-gradient(ellipse at 50% -20%,#4a4f73 0,transparent 55%),#14161f}
body[data-theme="crown"] .layer-card,body[data-theme="crown"] .viewer,body[data-theme="crown"] .card,body[data-theme="crown"] .status-card,body[data-theme="crown"] .controlbar,body[data-theme="crown"] .viewbar{background:linear-gradient(155deg,#2a2e45,#171923 76%);border-color:#b8a46a}
body[data-theme="crown"] .square.light,body[data-theme="crown"] .cell3d.light,body[data-theme="crown"] .plane .cell3d.light{background:url(assets/boards/marble-light.webp) center/cover}
body[data-theme="crown"] .square.dark,body[data-theme="crown"] .cell3d.dark,body[data-theme="crown"] .plane .cell3d.dark{background:url(assets/boards/marble-dark.webp) center/cover}
body[data-theme="crown"] .plane,body[data-theme="crown"] .plane[data-level],body[data-theme="crown"] .chessboard{--rim:#c9c3b6;--edge-bright:#aaa59a;--edge-dark:#35364a;border:22px solid transparent;border-image:url(assets/boards/marble-frame.webp) 11% / 22px stretch;background:#8a7b6a;box-shadow:0 24px 35px #000b}
body[data-theme="crown"] .viewport{background:radial-gradient(circle at 50% 50%,#41476b,#1a1d2c 60%,#0d0f18);border-color:#b8a46a}
body[data-theme="crown"] .inspiration-card{background:linear-gradient(155deg,#33375a,#181a26);border-color:#b8a46a}

/* 駒の紹介カード: 文字とリンクは出さず、駒全体の画像だけを見せる */
.inspiration-card>div{display:none}
.inspiration-card img{height:auto;max-height:260px;object-fit:contain;object-position:center;padding:6px}
@media(max-width:1300px){.inspiration-card img{height:auto}}
.bgm-status{font-size:11px;color:#9fe9dd;min-width:9em}

/* ---- 艦隊運用モード(2026-10-24) ----
   盤・背景の画像は assets/fleet/ に置くと自動で使われる(Geminiに依頼中。無いときはグラデーションで代用)。 */
body[data-mode="fleet"]{background:url(assets/fleet/bg-space.webp) center/cover fixed,radial-gradient(ellipse at 50% 0%,#18244a 0%,#070b1a 60%,#02040a 100%)}
body[data-mode="fleet"] .square.light{background:url(assets/fleet/tile-light.webp) center/cover,linear-gradient(145deg,#1c3354,#132743)}
body[data-mode="fleet"] .square.dark{background:url(assets/fleet/tile-dark.webp) center/cover,linear-gradient(145deg,#0c1830,#081224)}
body[data-mode="fleet"] .square:not(.void){box-shadow:inset 0 0 0 1px #4fa3ff2e}
body[data-mode="fleet"] .plane,body[data-mode="fleet"] .plane[data-level],body[data-mode="fleet"] .chessboard{border:22px solid transparent!important;border-image:url(assets/fleet/board-frame.webp) 7% / 22px stretch!important;background:#050a18!important;box-shadow:0 0 24px #2a7fff44,0 12px 34px #000a!important}
body[data-mode="fleet"] .layer-card,body[data-mode="fleet"] .viewer,body[data-mode="fleet"] .card,body[data-mode="fleet"] .status-card,body[data-mode="fleet"] .controlbar,body[data-mode="fleet"] .viewbar{background:linear-gradient(155deg,#14203ae0,#0a1226eb)!important;border-color:#3a5f8f!important}
body[data-mode="fleet"] .layer-card{border-top:3px solid #ffb84a!important}
body[data-mode="fleet"] .cell3d.light{background:#1c3a63e6!important}
body[data-mode="fleet"] .cell3d.dark{background:#0a1a33e6!important}
body[data-mode="fleet"] .inspiration-card{display:none}
body[data-mode="fleet"] .square.light{background:url(assets/fleet/tile-light.webp) center/cover,linear-gradient(145deg,#1c3354,#132743)!important}
body[data-mode="fleet"] .square.dark{background:url(assets/fleet/tile-dark.webp) center/cover,linear-gradient(145deg,#0c1830,#081224)!important}
body[data-mode="fleet"] .viewport{background:url(assets/fleet/bg-space.webp) center/cover,radial-gradient(circle at 50% 55%,#152a4a 0,#081226 58%,#030812 100%)}
.piece.ship,.piece3d.ship{background:none!important;border:0!important;box-shadow:none!important;text-shadow:none}
.piece.ship:before,.piece3d.ship:before{display:none}
.piece.ship img{width:140%;height:140%;max-width:none;object-fit:contain;filter:drop-shadow(0 6px 4px #000c)}
.piece3d.ship img{width:100%;height:100%;object-fit:contain}
.captured-piece.ship{background:#0b1426;border-color:#36557a}.captured-piece.ship img{width:100%;height:100%;object-fit:contain}
.hp-pips{position:absolute;left:50%;bottom:6%;transform:translateX(-50%);display:flex;gap:2px;pointer-events:none;z-index:2}
.hp-pips i{width:6px;height:6px;border-radius:50%;background:#7fd0ff;box-shadow:0 0 5px #7fd0ff}
.hp-pips.white i{background:#ffd27a;box-shadow:0 0 5px #ffb340}
.hp-pips.flag i{width:7px;height:7px;outline:1px solid #fff8}
.hp-pips i.lost{background:#2a2f3c;box-shadow:none}
.cell3d .hp-pips{bottom:2%;transform:translateX(-50%) translateZ(20px)}
.fleet-fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:60}
body[data-mode="fleet"]{overflow-x:hidden}
body[data-mode="fleet"] .square.capture:after,body[data-mode="fleet"] .cell3d.capture:after{border-color:#ff5d5d;box-shadow:0 0 10px #ff4d4d}
.fleet-orders-remaining{color:#b9defc;font-size:12px;white-space:nowrap}
body[data-mode="fleet"] .square.repair:after,body[data-mode="fleet"] .cell3d.repair:after{content:"+";position:absolute;inset:7%;display:grid;place-items:center;border:3px solid #5cf0bb;border-radius:50%;color:#baffdf;font:bold 22px system-ui;text-shadow:0 0 8px #19a974;pointer-events:none}

/* Experimental fantasy mode: magic circles remain part of the clickable grid. */
body[data-mode="fantasy"]{background:radial-gradient(ellipse at 50% -20%,#694b85 0,transparent 55%),radial-gradient(circle at 15% 80%,#244e50 0,transparent 40%),#140f23}
body[data-mode="fantasy"] .layer-card,body[data-mode="fantasy"] .viewer,body[data-mode="fantasy"] .card,body[data-mode="fantasy"] .status-card,body[data-mode="fantasy"] .controlbar,body[data-mode="fantasy"] .viewbar{background:linear-gradient(155deg,#302443ed,#161a2deb)!important;border-color:#a887cb!important}
body[data-mode="fantasy"] .inspiration-card{display:none}
body[data-mode="fantasy"] .square.light,body[data-mode="fantasy"] .plane .cell3d.light{background:linear-gradient(145deg,#cec0e5e8,#a9a2c6de)!important}
body[data-mode="fantasy"] .square.dark,body[data-mode="fantasy"] .plane .cell3d.dark{background:linear-gradient(145deg,#514171ee,#382f62e8)!important}
body[data-mode="fantasy"] .plane,body[data-mode="fantasy"] .plane[data-level]{--rim:#bc9ae0;--edge-bright:#a37cc3;--edge-dark:#2b2143;border-color:#b499d8;box-shadow:inset 0 0 0 2px #f4d2ff88,0 0 0 5px #30204e,0 0 24px #a965e966,0 24px 35px #000b}
body[data-mode="fantasy"] .chessboard{border-color:#bc9be0;box-shadow:0 0 0 3px #33234e,0 7px 0 #57336c,0 0 26px #a968d255}
body[data-mode="fantasy"] .viewport{background:radial-gradient(circle at 50% 46%,#58487b,#25223f 58%,#121323);border-color:#b08ad5}
body[data-mode="fantasy"] .piece.fantasy-unit{font-family:Georgia,"Yu Gothic UI",serif;font-size:clamp(15px,1.8vw,30px);text-shadow:0 1px 4px #0008}
body[data-mode="fantasy"] .piece.fantasy-unit.white,body[data-mode="fantasy"] .captured-piece.fantasy-unit.white{background:radial-gradient(circle at 30% 25%,#fff5ce,#d9b779);color:#503d2a;border-color:#b88549}
body[data-mode="fantasy"] .piece.fantasy-unit.black,body[data-mode="fantasy"] .captured-piece.fantasy-unit.black{background:radial-gradient(circle at 30% 25%,#9a79c5,#433161);color:#f4e7ff;border-color:#a988cf}
body[data-mode="fantasy"] .piece3d.fantasy-unit{font:900 26px Georgia,serif;color:#fff4c5;text-shadow:0 0 9px #e7b7ff}
body[data-mode="fantasy"] .magic-circle:before{content:"✧";position:absolute;inset:12%;display:grid;place-items:center;border:2px solid #77ffc9;border-radius:50%;color:#d2fff0;font:900 23px Georgia,serif;line-height:1;box-shadow:0 0 10px #59efba,inset 0 0 9px #6dffd488;text-shadow:0 0 8px #81ffd5;pointer-events:none;z-index:0}
body[data-mode="fantasy"] .square.summon:after,body[data-mode="fantasy"] .cell3d.summon:after{content:"✦";position:absolute;inset:9%;display:grid;place-items:center;border:3px solid #79ffd0;border-radius:50%;color:#bcffe3;font:900 20px Georgia,serif;box-shadow:0 0 11px #72ffcc;pointer-events:none}
body[data-mode="fantasy"] .square.capture:after,body[data-mode="fantasy"] .cell3d.capture:after{border-color:#ff976b;box-shadow:0 0 10px #ff8d51}
body[data-mode="fantasy"] .hp-pips.white i{background:#ffdf8c;box-shadow:0 0 5px #e8ae60}
body[data-mode="fantasy"] .hp-pips.black i{background:#d3a4ff;box-shadow:0 0 5px #bc78ff}
.fantasy-fx{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:61}
body[data-mode="fantasy"] #fantasyPowersRemaining{flex-basis:100%;white-space:pre-line;line-height:1.5;color:#e7d5ff}
