:root{font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#e9e5db;background:#0d1420;font-synthesis:none;text-rendering:optimizeLegibility}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.42}button:focus-visible{outline:2px solid #f6c875;outline-offset:3px}
.app{min-height:100vh;background:radial-gradient(ellipse at 68% -12%,#283246 0,transparent 56%),#0d1420}
.topbar{min-height:74px;border-bottom:1px solid #2a3442;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px clamp(16px,3vw,40px)}
.brand{display:flex;align-items:center;gap:13px}.sun{display:grid;place-items:center;height:42px;width:42px;border:1px solid #cb9c50;border-radius:13px;background:linear-gradient(145deg,#4f412b,#221e1b);color:#fbd18a;font-size:26px}
.brand small,.eyebrow,.section-label{letter-spacing:.18em;font-size:10px;color:#ad996f;font-weight:800}.brand h1{margin:2px 0 0;font-family:Georgia,serif;letter-spacing:.12em;font-size:21px;font-weight:600}.top-actions{display:flex;align-items:center;gap:10px}.version{font:11px ui-monospace,SFMono-Regular,monospace;color:#8794a4;border:1px solid #36404c;padding:7px 10px;border-radius:7px}.ghost{background:transparent;border:1px solid #39434f;color:#cbd2d8;padding:9px 12px;border-radius:8px}.ghost:hover{background:#253140}.pill{border:1px solid #4c483b;color:#dfb46b;border-radius:20px;padding:7px 11px;font-size:11px;background:#28251f}
.workspace{display:grid;grid-template-columns:270px minmax(380px,1fr) 324px;gap:18px;max-width:1880px;margin:0 auto;padding:22px clamp(14px,2vw,36px);align-items:start}
.panel{border:1px solid #2d3948;border-radius:13px;background:linear-gradient(160deg,#1a2532,#151f2c);box-shadow:0 10px 28px #060b1440;min-width:0}.panel-pad{padding:19px}.heading{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:14px}.heading h2{font-size:13px;margin:0;letter-spacing:.08em}.heading span{font:11px ui-monospace,SFMono-Regular,monospace;color:#8494a3}.muted{font-size:12px;color:#93a0ae;line-height:1.7}.rule-title{font:500 25px Georgia,serif;color:#f3d49d;margin:3px 0 8px}.divider{height:1px;background:#303d4b;margin:17px 0}
.side{display:flex;flex-direction:column;gap:16px}.objective{border-left:3px solid #d8aa62;padding-left:12px}.objective p{margin:8px 0 0}.progress{margin-top:14px;display:flex;align-items:center;gap:9px}.progress-track{height:6px;border-radius:5px;background:#36404d;flex:1;overflow:hidden}.progress-bar{height:100%;background:#e1b86d}
.roster{display:flex;flex-direction:column;gap:9px}.roster-item{display:flex;align-items:center;gap:11px;text-align:left;padding:10px;border:1px solid #344051;background:#1c2836;color:inherit;border-radius:10px;width:100%}.roster-item:hover,.roster-item.active{border-color:#b89057;background:#2e3030}.token{width:36px;height:36px;border:1px solid #788da9;border-radius:9px;display:grid;place-items:center;font-weight:800;color:#d3e5ff;background:#32455a;flex-shrink:0}.token.enemy{border-color:#a96d62;color:#ffd4c5;background:#533633}.token.dead{opacity:.4}.unit-info{flex:1;min-width:0}.unit-name{font-weight:700;font-size:13px}.unit-sub{font-size:11px;color:#9ca9b7;margin-top:3px}.hpbar{height:3px;background:#3c4c5c;margin-top:7px;border-radius:3px;overflow:hidden}.hpfill{height:100%;background:#74bb9a}.unit-state{font:10px ui-monospace,monospace;color:#e7c88a}
.board-column{display:flex;flex-direction:column;gap:14px;min-width:0}.arena-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:2px 5px}.arena-head h2{font:500 clamp(20px,2vw,28px) Georgia,serif;margin:5px 0;color:#f4d59e}.arena-tag{font-size:11px;color:#9caab7}.board-scroll{overflow:auto;border:1px solid #384454;border-radius:14px;padding:clamp(9px,1.5vw,18px);background:radial-gradient(circle at center,#2c3542,#141e2b);box-shadow:inset 0 0 60px #050b1666}.board-frame{width:min(100%,670px);min-width:350px;margin:auto}.coords{display:grid;grid-template-columns:repeat(8,1fr);font:11px ui-monospace,monospace;text-align:center;color:#a5afbd;margin-bottom:6px}.board{aspect-ratio:1;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));gap:3px}.cell{min-width:0;min-height:0;padding:0;border:1px solid #ffffff10;border-radius:5px;position:relative;display:grid;place-items:center;color:#dbe4ef;background:#334353;transition:background .12s,border-color .12s,transform .12s}.cell.light{background:#3c4d5e}.cell:hover{border-color:#e2c081;z-index:2}.cell.wall{background:repeating-linear-gradient(45deg,#29333d,#29333d 4px,#323c47 4px,#323c47 8px);color:#7e8a94}.cell.hazard:after{content:"◆";font-size:10px;color:#da9367;position:absolute;bottom:3px;right:5px}.cell.legal{border-color:#67c4ba;background:#295c65}.cell.target{border-color:#e7ad73;background:#745044}.cell.selected{outline:2px solid #f2cf82;outline-offset:-3px}.cell.inspected:before{content:"";position:absolute;inset:3px;border:1px dashed #f5e5b8;border-radius:3px;pointer-events:none}.cell.active:before{content:"";position:absolute;inset:4px;border:2px solid #ffdf99;border-radius:5px;pointer-events:none}.pawn{width:68%;height:68%;border:1px solid #8bb4db;border-radius:12px;background:linear-gradient(145deg,#5c7992,#324b66);display:grid;place-items:center;box-shadow:0 3px 6px #07111a77;font-weight:800;font-size:clamp(12px,1.3vw,21px);z-index:1}.pawn.enemy{border-color:#e3a090;background:linear-gradient(145deg,#a26659,#653935);color:#ffe9db}.pawn.ember{border-color:#f9cf6a;background:radial-gradient(#ffdc8f,#ac6b31);color:#372012}.tile-num{position:absolute;top:3px;left:5px;font:9px ui-monospace,monospace;color:#ffffff67}.legend{display:flex;gap:15px;flex-wrap:wrap;color:#a3b0bc;font-size:11px;padding:5px 2px}.dot{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;background:#62bdb5}.dot.attack{background:#dd9975}.dot.hazard{background:#ce8762}.dot.active{background:#efcf8b}
.actions{padding:15px 17px}.action-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:12px}.action-btn{background:#243345;border:1px solid #465667;color:#d8e2e9;border-radius:9px;padding:12px 4px;min-width:0}.action-btn strong{display:block;font-size:13px}.action-btn small{font-size:10px;color:#94a7b9}.action-btn.chosen{background:#4b412e;border-color:#e2b666;color:#fce0a5}.action-btn.finish{background:#b88b4f;border-color:#d6a867;color:#18202b}.action-btn.finish small{color:#273240}.action-tip{font-size:11px;color:#aab8c7;margin:12px 0 0;line-height:1.6;min-height:17px}
.log{padding:14px 18px;max-height:210px;overflow:auto}.log p{padding:7px 0;border-top:1px solid #2c3948;margin:0;font-size:11px;color:#b8c5d0;line-height:1.6}.log p:first-of-type{border:0}.log strong{color:#eac786;font-weight:600}
.right{display:flex;flex-direction:column;gap:16px}.inspect-name{font:500 22px Georgia,serif;color:#f4d4a0;margin:0 0 7px}.stat-row{display:flex;justify-content:space-between;margin-top:10px;font-size:12px;color:#aebac5}.stat-row strong{color:#e8e3d8;font-family:ui-monospace,monospace}.kit-card{background:#202c39;border:1px solid #3b4755;border-radius:9px;padding:10px;margin-top:8px}.kit-card h3{font-size:12px;margin:0 0 5px;color:#e7d7b7}.kit-card p{font-size:11px;color:#aab7c5;line-height:1.65;margin:0}.rule-list{display:flex;flex-direction:column;gap:6px;max-height:385px;overflow:auto}.rule{border:1px solid #334152;background:#1b2937;border-radius:8px;color:#d6e1e8;text-align:left;padding:10px;width:100%}.rule:hover,.rule.active{border-color:#b99766;background:#313441}.rule-top{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:12px}.rule small{display:block;color:#9babb9;font-size:10px;line-height:1.6;margin-top:4px}.intent{padding:10px 0;border-bottom:1px solid #344050}.intent:last-child{border:0}.intent b{font-size:12px}.intent p{color:#9fb2c1;font-size:11px;margin:5px 0 0;line-height:1.6}.intent .marked{color:#f7d58e}
.primary{display:block;width:100%;background:#d5aa68;border:1px solid #edc688;border-radius:9px;padding:13px;color:#182332;font-weight:800;margin-top:16px}.primary:hover{background:#eac27f}.choices{display:grid;gap:9px}.choice{padding:13px;border:1px solid #3f4a57;background:#1e2b39;border-radius:10px;text-align:left;color:#e3e9ee}.choice.active{border-color:#e7bd7f;background:#343327}.choice strong{display:block;font-size:13px}.choice small{display:block;margin-top:4px;font-size:11px;color:#a5b1bc}.choice:focus-visible{outline-color:#f6c875}.check{font-size:11px;border:1px solid #657789;border-radius:12px;padding:3px 7px;color:#afc4d7}
.banner{border:1px solid #9f845c;background:#363123;border-radius:10px;padding:15px;margin-bottom:14px}.banner h2{color:#f4d49c;margin:0 0 7px;font-size:18px}.banner p{font-size:12px;margin:0;color:#d6c5a9;line-height:1.65}.toast{font-size:11px;color:#ffd09b;padding:8px 12px;border:1px solid #986e4b;background:#493528;border-radius:8px;line-height:1.55}.footer{padding:5px 22px 25px;text-align:center;color:#738292;font:10px ui-monospace,monospace;letter-spacing:.08em}
@media(max-width:1250px){.workspace{grid-template-columns:235px minmax(350px,1fr) 286px;gap:12px}.panel-pad{padding:14px}.action-btn{padding:10px 2px}}
@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1fr) 300px}.side{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.board-column{grid-column:1}.right{grid-column:2}.board-frame{min-width:350px}.roster{display:grid;grid-template-columns:1fr 1fr}}
@media(max-width:760px){.topbar{align-items:flex-start}.brand h1{font-size:17px}.version{display:none}.workspace{display:flex;flex-direction:column;padding:12px}.side{display:flex;width:100%}.roster{grid-template-columns:1fr 1fr}.board-column,.right{width:100%}.board-frame{width:100%;min-width:310px}.board-scroll{padding:7px}.action-row{gap:5px}.action-btn strong{font-size:12px}.action-btn small{font-size:9px}.pawn{font-size:14px}.panel-pad{padding:14px}.right .rule-list{max-height:none}.brand small{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
