*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#1a1610;--bg-card:#221e17;--bg-elev:#2d2820;--bg-surface:#352f26;
  --border:rgba(255,220,160,0.1);--border-strong:rgba(255,220,160,0.22);
  --text:#f0e6d2;--text-muted:#a89880;--text-dim:#6b5e4e;
  --shell-glow:rgba(232,171,93,0.22);--shell-border:rgba(255,220,160,0.24);--shell-panel:rgba(34,26,18,0.88);
  --shell-mist:rgba(255,220,160,0.08);--shell-accent:#d8a45d;
  --dirt:#8B6E4E;--dirt-dk:#6B5040;
  --clay:#A67B5B;--clay-dk:#876248;
  --sand:#C4A66A;--sand-dk:#A88B52;
  --moss:#6B8E5A;--moss-dk:#4E7040;
  --slate:#7088A0;--slate-dk:#546A80;
  --sandstone:#BFA070;--sandstone-dk:#9E8458;
  --granite:#5A5A68;--granite-dk:#42424E;
  --artifact:#FFD700;--artifact-glow:rgba(255,215,0,0.4);
  --lava:#E84030;--lava-glow:rgba(232,64,48,0.4);
  --fuel:#60C0FF;
  --success:#5ABA5A;--danger:#E85050;--warn:#E8C040;
  --cs:36px;--gap:2px;--coord-w:18px;
}
body{font-family:'Outfit',system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;align-items:flex-start;justify-content:center;padding:16px 12px 60px;-webkit-font-smoothing:antialiased;touch-action:manipulation;
  background-image:repeating-linear-gradient(0deg,transparent,transparent 40px,rgba(255,220,160,0.015) 40px,rgba(255,220,160,0.015) 41px),repeating-linear-gradient(90deg,transparent,transparent 40px,rgba(255,220,160,0.015) 40px,rgba(255,220,160,0.015) 41px)}
.app{width:100%;max-width:420px;position:relative}

.setup-toggle{display:flex;align-items:center;gap:7px;width:100%;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:7px 12px;margin-bottom:8px;font-family:'DM Mono',monospace;font-size:9px;letter-spacing:0.18em;color:var(--text-dim);text-transform:uppercase;cursor:pointer;transition:all 0.15s;text-align:left}
.setup-toggle:hover{background:var(--bg-elev);border-color:var(--border-strong);color:var(--text-muted)}
.setup-toggle.active{border-color:var(--border-strong);color:var(--text-muted)}
.setup-toggle-icon{font-size:12px;line-height:1;flex-shrink:0}
.setup-toggle-label{flex:1}
.setup-toggle-arrow{font-size:9px;transition:transform 0.25s;display:inline-block;line-height:1}
.setup-toggle.active .setup-toggle-arrow{transform:rotate(90deg)}
.setup-panel{overflow:hidden;max-height:0;opacity:0;pointer-events:none;transition:max-height 0.3s ease,opacity 0.22s}
.setup-panel.open{max-height:300px;opacity:1;pointer-events:auto}

.complexity-row{display:flex;align-items:center;gap:10px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:10px 14px;margin-bottom:8px}
.seed-row{display:flex;align-items:center;gap:8px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:8px 14px;margin-bottom:10px}
.seed-label{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:0.25em;color:var(--text-dim);text-transform:uppercase;flex-shrink:0}
.seed-input{flex:1;background:var(--bg-elev);border:1px solid var(--border);border-radius:6px;padding:5px 8px;font-family:'DM Mono',monospace;font-size:13px;color:var(--text);outline:none;min-width:0}
.seed-input:focus{border-color:var(--border-strong)}
.seed-btn{background:var(--bg-elev);border:1px solid var(--border);border-radius:6px;padding:5px 10px;font-size:14px;cursor:pointer;color:var(--text-muted);flex-shrink:0;transition:all 0.15s}
.seed-btn:hover{background:var(--bg-surface);color:var(--text)}
.complexity-label{font-family:'DM Mono',monospace;font-size:9px;letter-spacing:0.25em;color:var(--text-dim);text-transform:uppercase;flex-shrink:0}
.complexity-slider{flex:1;-webkit-appearance:none;appearance:none;height:6px;background:var(--bg-elev);border-radius:3px;outline:none}
.complexity-slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:var(--artifact);border-radius:50%;cursor:pointer;box-shadow:0 0 8px var(--artifact-glow)}
.complexity-slider::-moz-range-thumb{width:20px;height:20px;background:var(--artifact);border-radius:50%;cursor:pointer;border:none}
.complexity-val{font-family:'DM Mono',monospace;font-size:18px;font-weight:500;color:var(--artifact);min-width:28px;text-align:right}

.gen-info{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:5px;margin-bottom:10px}
.gen-tag{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:5px 8px;text-align:center;font-family:'DM Mono',monospace;font-size:9px;letter-spacing:0.15em;color:var(--text-dim);text-transform:uppercase}
.gen-tag b{display:block;font-size:13px;color:var(--text);letter-spacing:normal;margin-top:2px}

.hud{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-bottom:10px}
.hud-item{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:8px 10px;text-align:center}
.hud-label{font-family:'DM Mono',monospace;font-size:8px;letter-spacing:0.25em;color:var(--text-dim);text-transform:uppercase;margin-bottom:3px}
.hud-val{font-family:'DM Mono',monospace;font-size:20px;font-weight:500;line-height:1}
.hud-val.fuel{color:var(--fuel)}
.hud-val.target{color:var(--artifact)}

.fuel-bar-wrap{height:5px;background:var(--bg-card);border-radius:3px;margin-bottom:10px;overflow:hidden;border:1px solid var(--border)}
.fuel-bar{height:100%;background:linear-gradient(90deg,var(--danger),var(--warn),var(--fuel));border-radius:3px;transition:width 0.3s}

.tools-row{display:flex;gap:5px;margin-bottom:10px;position:relative;z-index:10}
.tool-btn{flex:1;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:5px 6px;display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;transition:all 0.15s;font-family:'Outfit',sans-serif;color:var(--text-muted);font-size:11px;font-weight:500}
.tool-btn:hover{background:var(--bg-elev);border-color:var(--border-strong)}
.tool-btn.active{border-color:var(--fuel);box-shadow:0 0 10px rgba(96,192,255,0.28);color:var(--fuel)}
.tool-btn.disabled{opacity:0.35;cursor:default;pointer-events:none}
.tool-btn .tool-icon{font-size:13px;line-height:1;flex-shrink:0}
.tool-btn .tool-count{font-family:'DM Mono',monospace;font-size:9px;color:var(--text-dim)}

.board-area{display:flex;justify-content:center;margin-bottom:12px}
.board-shell{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;padding:10px 6px 0}
.board-shell::before{content:'';position:absolute;inset:-6px -4px 58px;background:radial-gradient(circle at 50% 20%,var(--shell-mist),transparent 68%);pointer-events:none;z-index:0}
.board-atmosphere{position:absolute;inset:0 -8px 56px;border-radius:26px;opacity:0.92;pointer-events:none;z-index:0;filter:saturate(1.06) contrast(1.04);overflow:hidden}
.board-atmosphere svg{width:100%;height:100%;display:block}
.board-atmosphere::after{content:'';position:absolute;inset:0;border-radius:26px;background:radial-gradient(circle at 50% 32%,transparent 0%,rgba(0,0,0,0.08) 54%,rgba(0,0,0,0.36) 100%)}
.board-wrap{background:linear-gradient(180deg,rgba(34,30,23,0.94),var(--shell-panel));border:1px solid var(--shell-border);border-radius:16px;padding:8px;position:relative;overflow:hidden;max-width:100%;z-index:2;box-shadow:0 18px 40px rgba(0,0,0,0.35),0 0 0 1px rgba(255,255,255,0.02),0 0 34px var(--shell-glow)}
.board-wrap::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,220,160,0.03) 0%,transparent 40%,rgba(0,0,0,0.15) 100%);pointer-events:none;border-radius:12px;z-index:2}
.board{position:relative;display:grid;gap:var(--gap)}
.site-card{width:100%;background:linear-gradient(180deg,rgba(20,17,13,0.84),rgba(10,9,7,0.78));border:1px solid var(--shell-border);border-radius:12px;padding:7px 10px;position:relative;z-index:2;box-shadow:0 8px 24px rgba(0,0,0,0.22)}
.site-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,0.04),transparent 42%);pointer-events:none;border-radius:14px}
.site-label{font-family:'DM Mono',monospace;font-size:8px;letter-spacing:0.28em;color:var(--text-dim);text-transform:uppercase;margin-bottom:5px}
.site-name{font-family:'Bitter',serif;font-size:14px;line-height:1.15;color:var(--text);margin-bottom:2px}
.site-biome{font-size:10px;color:color-mix(in srgb, var(--shell-accent) 78%, var(--text) 22%);line-height:1.35}
.board-cell{width:var(--cs);height:var(--cs);border-radius:4px;cursor:pointer;position:relative;transition:transform 0.12s,box-shadow 0.12s,opacity 0.2s;display:flex;align-items:center;justify-content:center;font-size:14px;user-select:none;-webkit-tap-highlight-color:transparent}
/* coordinate label cells */
.coord-label{display:flex;align-items:center;justify-content:center;font-family:'DM Mono',monospace;font-size:8px;color:var(--text-dim);user-select:none;pointer-events:none;letter-spacing:0}
.board-cell:hover:not(.empty):not(.granite):not(.artifact):not(.lava){transform:scale(0.94);box-shadow:inset 0 0 0 2px rgba(255,255,255,0.5)}
.board-cell.empty{background:rgba(0,0,0,0.2);cursor:default;border:1px dashed rgba(255,220,160,0.06)}
.board-cell.dirt{background:linear-gradient(135deg,var(--dirt),var(--dirt-dk));box-shadow:inset 0 1px 0 rgba(255,255,255,0.1),inset 0 -1px 0 rgba(0,0,0,0.2)}
.board-cell.clay{background:linear-gradient(135deg,var(--clay),var(--clay-dk));box-shadow:inset 0 1px 0 rgba(255,255,255,0.1),inset 0 -1px 0 rgba(0,0,0,0.2)}
.board-cell.sand{background:linear-gradient(135deg,var(--sand),var(--sand-dk));box-shadow:inset 0 1px 0 rgba(255,255,255,0.15),inset 0 -1px 0 rgba(0,0,0,0.15)}
.board-cell.moss{background:linear-gradient(135deg,var(--moss),var(--moss-dk));box-shadow:inset 0 1px 0 rgba(255,255,255,0.1),inset 0 -1px 0 rgba(0,0,0,0.2)}
.board-cell.slate{background:linear-gradient(135deg,var(--slate),var(--slate-dk));box-shadow:inset 0 1px 0 rgba(255,255,255,0.1),inset 0 -1px 0 rgba(0,0,0,0.2)}
.board-cell.granite{background:linear-gradient(135deg,var(--granite),var(--granite-dk));box-shadow:inset 0 1px 0 rgba(255,255,255,0.08),inset 0 -2px 0 rgba(0,0,0,0.3);cursor:not-allowed}
.board-cell.granite::before{content:'';position:absolute;inset:4px;border:1px solid rgba(255,255,255,0.08);border-radius:2px}
.board-cell.sandstone{background:linear-gradient(135deg,var(--sandstone),var(--sandstone-dk));box-shadow:inset 0 1px 0 rgba(255,255,255,0.12),inset 0 -1px 0 rgba(0,0,0,0.2)}
.board-cell.sandstone .hp-badge{position:absolute;top:2px;right:4px;font-family:'DM Mono',monospace;font-size:9px;font-weight:700;color:rgba(255,255,255,0.8);line-height:1}
.board-cell.lava{background:linear-gradient(135deg,var(--lava),#a82010);box-shadow:0 0 8px var(--lava-glow),inset 0 1px 0 rgba(255,255,255,0.1);cursor:not-allowed}
.board-cell.artifact{background:radial-gradient(circle at 40% 35%,#FFE880,var(--artifact),#C8A000);box-shadow:0 0 12px var(--artifact-glow),inset 0 1px 0 rgba(255,255,255,0.4);cursor:default;animation:artifactGlow 2s ease-in-out infinite}
.board-cell.artifact.exposed{box-shadow:0 0 20px var(--artifact-glow),0 0 40px rgba(255,215,0,0.2),inset 0 1px 0 rgba(255,255,255,0.5);animation:artifactPulse 1s ease-in-out infinite}
@keyframes artifactGlow{0%,100%{box-shadow:0 0 8px var(--artifact-glow)}50%{box-shadow:0 0 16px var(--artifact-glow)}}
@keyframes artifactPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.board-cell.preview-highlight{transform:scale(0.9);box-shadow:inset 0 0 0 2px rgba(255,255,255,0.8),0 0 10px rgba(255,255,255,0.2)!important}
.board-cell.preview-danger{transform:scale(0.9);box-shadow:inset 0 0 0 2px rgba(232,64,48,0.9),0 0 12px rgba(232,64,48,0.4)!important;animation:dangerPulse 0.6s ease-in-out infinite}
@keyframes dangerPulse{0%,100%{box-shadow:inset 0 0 0 2px rgba(232,64,48,0.9),0 0 8px rgba(232,64,48,0.3)}50%{box-shadow:inset 0 0 0 3px rgba(232,64,48,1),0 0 18px rgba(232,64,48,0.6)}}
.board-cell.removing{animation:cellRemove 0.3s ease-out forwards}
@keyframes cellRemove{0%{transform:scale(1);opacity:1}50%{transform:scale(1.15);opacity:0.8;filter:brightness(1.4)}100%{transform:scale(0.3);opacity:0}}
.board-cell.crushed{animation:crush 0.5s ease-out forwards}
@keyframes crush{0%{transform:scale(1);opacity:1}30%{transform:scale(1.3);filter:brightness(2)}100%{transform:scale(0);opacity:0}}

.btn-row{display:flex;gap:8px;margin-bottom:12px;align-items:center}
button{flex:1;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:10px 14px;font-family:'Outfit',sans-serif;font-size:13px;font-weight:500;color:var(--text);cursor:pointer;transition:all 0.15s}
button:hover{background:var(--bg-elev);border-color:var(--border-strong)}
button:active{transform:scale(0.98)}
button.primary{background:var(--artifact);color:var(--bg);border-color:var(--artifact);font-weight:600}
button.primary:hover{opacity:0.9}
.help-icon-btn{flex:0 0 38px;height:38px;padding:0;font-size:20px;line-height:1;font-weight:700}

.solution-debug{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:10px 14px;margin-bottom:12px;font-family:'DM Mono',monospace;font-size:10px;color:var(--text-dim);line-height:1.8;max-height:200px;overflow-y:auto}
.solution-debug b{color:var(--artifact)}
.solution-debug .step-coord{color:var(--fuel);font-weight:500}
.solution-debug .step-tool{color:var(--warn)}

.score-float{position:absolute;pointer-events:none;z-index:10;font-family:'DM Mono',monospace;font-size:14px;font-weight:500;color:var(--artifact);text-shadow:0 1px 4px rgba(0,0,0,0.8);animation:floatUp 0.9s ease-out forwards;white-space:nowrap}
@keyframes floatUp{0%{opacity:0;transform:translateY(0) scale(0.7)}15%{opacity:1;transform:translateY(-4px) scale(1.1)}100%{opacity:0;transform:translateY(-36px) scale(0.9)}}
.crush-float{position:absolute;pointer-events:none;z-index:10;font-size:22px;animation:floatUp 1s ease-out forwards}

.message-overlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:100;background:rgba(0,0,0,0.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:20px}
.message-overlay.show{display:flex}
.message-box{background:var(--bg-card);border:1px solid var(--border-strong);border-radius:16px;padding:28px 24px;max-width:320px;width:100%;text-align:center;animation:msgIn 0.25s ease-out}
@keyframes msgIn{from{transform:scale(0.9);opacity:0}to{transform:scale(1);opacity:1}}
.msg-icon{font-size:48px;margin-bottom:12px}
.msg-title{font-family:'Bitter',serif;font-size:24px;font-weight:700;margin-bottom:8px}
.msg-sub{font-size:13px;color:var(--text-muted);margin-bottom:10px;line-height:1.5}
.msg-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:18px}
.msg-stat{background:var(--bg-elev);border-radius:8px;padding:8px}
.msg-stat-label{font-family:'DM Mono',monospace;font-size:8px;letter-spacing:0.2em;color:var(--text-dim);text-transform:uppercase;margin-bottom:2px}
.msg-stat-val{font-family:'DM Mono',monospace;font-size:16px;font-weight:500}
.msg-stat-val.gold{color:var(--artifact)}

@media(max-width:380px){:root{--cs:28px;--coord-w:14px}}
@media(max-width:380px){.site-name{font-size:18px}.site-biome{font-size:11px}}

/* ── Help overlay ── */
.help-overlay{position:fixed;inset:0;display:none;align-items:flex-start;justify-content:center;z-index:200;background:rgba(0,0,0,0.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:16px 12px 48px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.help-overlay.show{display:flex}
.help-box{background:var(--bg-card);border:1px solid var(--border-strong);border-radius:16px;padding:18px 16px 14px;max-width:400px;width:100%;animation:msgIn 0.2s ease-out;margin:0 auto;max-height:calc(100vh - 32px);overflow-y:auto;-webkit-overflow-scrolling:touch}
.help-title{font-family:'Bitter',serif;font-size:21px;font-weight:700;text-align:center;margin-bottom:3px}
.help-tagline{font-size:12px;color:var(--text-muted);text-align:center;margin-bottom:18px;line-height:1.4}
.help-section{margin-bottom:14px}
.help-sec-hd{font-family:'DM Mono',monospace;font-size:8px;letter-spacing:0.28em;text-transform:uppercase;color:var(--text-dim);padding-bottom:5px;border-bottom:1px solid var(--border);margin-bottom:9px}
.block-list{display:flex;flex-direction:column;gap:8px}
.block-item{display:flex;align-items:flex-start;gap:10px}
.bswatch{width:30px;height:30px;border-radius:5px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:15px;position:relative;margin-top:1px}
.bswatch.b-colors{background:linear-gradient(135deg,var(--dirt) 0%,var(--sand) 40%,var(--moss) 70%,var(--slate) 100%)}
.bswatch.b-sand{background:linear-gradient(135deg,var(--sandstone),var(--sandstone-dk))}
.bswatch.b-sand .hpb{position:absolute;top:1px;right:3px;font-family:'DM Mono',monospace;font-size:8px;font-weight:700;color:rgba(255,255,255,0.85)}
.bswatch.b-granite{background:linear-gradient(135deg,var(--granite),var(--granite-dk))}
.bswatch.b-granite::before{content:'';position:absolute;inset:3px;border:1px solid rgba(255,255,255,0.09);border-radius:2px}
.bswatch.b-lava{background:linear-gradient(135deg,var(--lava),#a82010);box-shadow:0 0 7px var(--lava-glow)}
.bswatch.b-artifact{background:radial-gradient(circle at 40% 35%,#FFE880,var(--artifact),#C8A000);box-shadow:0 0 9px var(--artifact-glow)}
.binfo{flex:1;min-width:0}
.bname{font-weight:600;color:var(--text);font-size:12px}
.bdesc{color:var(--text-muted);font-size:11px;margin-top:2px;line-height:1.45}
.help-rule{background:var(--bg-elev);border-radius:8px;padding:8px 10px;font-size:12px;color:var(--text-muted);line-height:1.55;margin-bottom:6px}
.help-rule:last-child{margin-bottom:0}
.help-rule b{color:var(--text)}
.hr-warn{border-left:2px solid var(--warn);padding-left:8px}
.hr-danger{border-left:2px solid var(--danger);padding-left:8px}
.trow{display:flex;align-items:flex-start;gap:9px;margin-bottom:8px}
.trow:last-child{margin-bottom:0}
.trow-ico{font-size:18px;flex-shrink:0;line-height:1;margin-top:2px}
.trow-info .tname{font-weight:600;color:var(--text);font-size:12px}
.trow-info .tdesc{color:var(--text-muted);font-size:11px;margin-top:2px;line-height:1.45}
.help-footer{display:flex;gap:7px;margin-top:14px;padding-top:11px;border-top:1px solid var(--border)}
.help-ok{flex:2;background:var(--artifact);color:#1a1610;border:1px solid var(--artifact);border-radius:8px;padding:8px 10px;font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;cursor:pointer;transition:opacity 0.15s}
.help-ok:hover{opacity:0.88;background:var(--artifact);border-color:var(--artifact)}
.help-nosee{flex:1;background:transparent;color:var(--text-muted);border:1px solid var(--border);border-radius:8px;padding:8px 6px;font-family:'Outfit',sans-serif;font-size:10px;cursor:pointer;transition:all 0.15s;text-align:center;line-height:1.25}
.help-nosee:hover{background:var(--bg-elev);color:var(--text);border-color:var(--border-strong)}
.help-tabs{display:flex;gap:3px;margin-bottom:14px;background:var(--bg-elev);border-radius:9px;padding:3px}
.help-tab{flex:1;background:transparent;border:none;border-radius:7px;padding:7px 8px;font-family:'Outfit',sans-serif;font-size:12px;font-weight:500;color:var(--text-muted);cursor:pointer;transition:all 0.15s}
.help-tab.active{background:var(--bg-card);color:var(--text);box-shadow:0 1px 4px rgba(0,0,0,0.25)}
.help-tab-panel{display:none}
.help-tab-panel.active{display:block}
@media(max-width:520px){
  .help-overlay{padding:8px 8px 18px}
  .help-box{max-height:calc(100vh - 16px);padding:14px 12px 12px;border-radius:12px}
  .help-title{font-size:19px}
  .help-tagline{font-size:11px;margin-bottom:12px}
  .help-sec-hd{margin-bottom:7px}
  .help-section{margin-bottom:11px}
  .bdesc,.trow-info .tdesc{font-size:10px;line-height:1.35}
  .help-rule{font-size:11px;padding:7px 9px;line-height:1.45}
}

/* ── Ambient motion overlay ── */
.board-ambient{position:absolute;inset:0 -8px 56px;pointer-events:none;z-index:1;border-radius:26px;overflow:hidden}
.board-ambient::before,.board-ambient::after{content:'';position:absolute;inset:0;pointer-events:none}

/* EMBER — heat glow pulse + rising sparks */
[data-biome="ember"] .board-ambient::before{
  background:radial-gradient(ellipse 80% 38% at 50% 100%,rgba(255,80,20,0.22) 0%,transparent 65%),radial-gradient(ellipse 38% 26% at 22% 96%,rgba(255,100,40,0.14) 0%,transparent 60%),radial-gradient(ellipse 38% 26% at 78% 98%,rgba(255,60,15,0.16) 0%,transparent 60%);
  animation:emberGlow 3.2s ease-in-out infinite}
[data-biome="ember"] .board-ambient::after{
  background:radial-gradient(circle 2px at 18% 88%,rgba(255,140,60,0.95) 0%,transparent 100%),radial-gradient(circle 1.5px at 33% 82%,rgba(255,100,40,0.85) 0%,transparent 100%),radial-gradient(circle 2.5px at 52% 91%,rgba(255,160,70,0.9) 0%,transparent 100%),radial-gradient(circle 1.5px at 68% 86%,rgba(255,110,50,0.85) 0%,transparent 100%),radial-gradient(circle 2px at 82% 90%,rgba(255,90,35,0.8) 0%,transparent 100%),radial-gradient(circle 1px at 44% 76%,rgba(255,130,55,0.7) 0%,transparent 100%);
  animation:emberRise 4.8s ease-out infinite}
@keyframes emberGlow{0%,100%{opacity:.65;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1.1)}}
@keyframes emberRise{0%{transform:translateY(0);opacity:.9}70%{opacity:.4}100%{transform:translateY(-150px);opacity:0}}

/* LOAM — drifting dust motes */
[data-biome="loam"] .board-ambient::before{
  background:radial-gradient(circle 3px at 15% 58%,rgba(212,172,118,0.5) 0%,transparent 100%),radial-gradient(circle 2px at 32% 42%,rgba(212,172,118,0.38) 0%,transparent 100%),radial-gradient(circle 2.5px at 58% 68%,rgba(212,172,118,0.44) 0%,transparent 100%),radial-gradient(circle 1.5px at 74% 38%,rgba(212,172,118,0.32) 0%,transparent 100%),radial-gradient(circle 2px at 87% 62%,rgba(212,172,118,0.42) 0%,transparent 100%),radial-gradient(circle 3px at 44% 52%,rgba(212,172,118,0.35) 0%,transparent 100%);
  animation:dustDrift 9s ease-in-out infinite}
[data-biome="loam"] .board-ambient::after{
  background:radial-gradient(circle 1.5px at 25% 75%,rgba(232,171,93,0.65) 0%,transparent 100%),radial-gradient(circle 1px at 60% 55%,rgba(232,171,93,0.55) 0%,transparent 100%),radial-gradient(circle 2px at 80% 72%,rgba(232,171,93,0.6) 0%,transparent 100%);
  animation:dustDrift 11s ease-in-out infinite reverse}
@keyframes dustDrift{0%{transform:translate(0,0);opacity:.5}40%{transform:translate(8px,-12px);opacity:.85}100%{transform:translate(-4px,-30px);opacity:0}}

/* OVERGROWN — spore & mist drift */
[data-biome="overgrown"] .board-ambient::before{
  background:radial-gradient(ellipse 58% 22% at 30% 48%,rgba(120,180,110,0.15) 0%,transparent 70%),radial-gradient(ellipse 48% 18% at 72% 38%,rgba(120,180,110,0.12) 0%,transparent 70%),radial-gradient(ellipse 65% 24% at 50% 65%,rgba(130,185,115,0.11) 0%,transparent 70%);
  animation:mistDrift 12s ease-in-out infinite alternate}
[data-biome="overgrown"] .board-ambient::after{
  background:radial-gradient(circle 2.5px at 22% 72%,rgba(120,186,94,0.65) 0%,transparent 100%),radial-gradient(circle 1.5px at 48% 55%,rgba(120,186,94,0.55) 0%,transparent 100%),radial-gradient(circle 2px at 68% 66%,rgba(120,186,94,0.6) 0%,transparent 100%),radial-gradient(circle 1px at 85% 42%,rgba(120,186,94,0.45) 0%,transparent 100%),radial-gradient(circle 2px at 38% 38%,rgba(140,196,104,0.45) 0%,transparent 100%);
  animation:sporeFloat 8s ease-in-out infinite}
@keyframes mistDrift{0%{transform:translate(0,0);opacity:.5}100%{transform:translate(14px,-10px);opacity:.95}}
@keyframes sporeFloat{0%{transform:translateY(0);opacity:.7}50%{transform:translateY(-22px);opacity:1}100%{transform:translateY(-46px);opacity:0}}

/* BASTION — cold light scan + settling stone dust */
[data-biome="bastion"] .board-ambient::before{
  background:linear-gradient(108deg,transparent 0%,rgba(146,163,189,0.07) 35%,rgba(168,182,207,0.16) 50%,rgba(146,163,189,0.07) 65%,transparent 100%);
  animation:bastionScan 8.5s ease-in-out infinite}
[data-biome="bastion"] .board-ambient::after{
  background:radial-gradient(circle 1.5px at 22% 32%,rgba(168,182,207,0.65) 0%,transparent 100%),radial-gradient(circle 1px at 45% 58%,rgba(168,182,207,0.55) 0%,transparent 100%),radial-gradient(circle 2px at 70% 40%,rgba(168,182,207,0.6) 0%,transparent 100%),radial-gradient(circle 1.5px at 85% 68%,rgba(168,182,207,0.5) 0%,transparent 100%),radial-gradient(circle 1px at 35% 75%,rgba(168,182,207,0.45) 0%,transparent 100%);
  animation:stoneDust 10s ease-in infinite}
@keyframes bastionScan{0%{transform:translateX(-70%);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateX(70%);opacity:0}}
@keyframes stoneDust{0%{transform:translateY(-15px);opacity:0}15%{opacity:.8}100%{transform:translateY(38px);opacity:0}}

/* STRATA — seam shimmer sweep + mineral glow pulse */
[data-biome="strata"] .board-ambient::before{
  background:linear-gradient(90deg,transparent 0%,rgba(215,176,113,0.16) 30%,rgba(222,193,142,0.26) 50%,rgba(215,176,113,0.16) 70%,transparent 100%);
  background-size:200% 100%;
  animation:strataShimmer 7s ease-in-out infinite}
[data-biome="strata"] .board-ambient::after{
  background:radial-gradient(circle 2px at 28% 52%,rgba(215,176,113,0.75) 0%,transparent 100%),radial-gradient(circle 1.5px at 52% 38%,rgba(219,190,139,0.65) 0%,transparent 100%),radial-gradient(circle 2.5px at 76% 58%,rgba(215,176,113,0.7) 0%,transparent 100%),radial-gradient(circle 1px at 62% 72%,rgba(219,190,139,0.55) 0%,transparent 100%),radial-gradient(circle 1.5px at 40% 66%,rgba(215,176,113,0.6) 0%,transparent 100%);
  animation:strataGlow 4.5s ease-in-out infinite alternate}
@keyframes strataShimmer{0%{background-position:200% 0;opacity:.6}50%{opacity:1}100%{background-position:-200% 0;opacity:.6}}
@keyframes strataGlow{from{opacity:.38}to{opacity:.95}}

/* ── Win modal codename banner ── */
.msg-codename{background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;padding:8px 12px;margin-bottom:12px;text-align:center;display:none}
.msg-codename-title{font-family:'DM Mono',monospace;font-size:11px;font-weight:500;color:var(--text);letter-spacing:0.04em;margin-bottom:3px}
.msg-codename-biome{font-size:10px;color:var(--shell-accent,#d8a45d);letter-spacing:0.02em}