:root{--bg:#120c07;--panel:#2a1d12;--panel2:#3a2817;--gold:#c9a44c;--gold2:#f0d488;--text:#f1e6cc;--dim:#b5a27e;--red:#c4483a;--green:#5fa95a;--emoji:"Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;--serif:"Songti SC", "STSong", "Noto Serif SC", "SimSun", serif}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--serif);-webkit-user-select:none;user-select:none;margin:0;overflow:hidden}#app{position:fixed;inset:0}button{color:var(--text);cursor:pointer;border:1px solid var(--gold);background:linear-gradient(#5a3e22,#3a2614);border-radius:4px;padding:6px 12px;font-family:inherit;font-size:14px;box-shadow:inset 0 1px #ffe6a040,0 2px 4px #00000080}button:hover:not(:disabled){color:#fff;background:linear-gradient(#7a5530,#4a3018)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}button.primary{border-color:var(--gold2);background:linear-gradient(#8a6a24,#5a4012)}.emoji{font-family:var(--emoji)}.frame{border:2px solid var(--gold);background:linear-gradient(160deg,#3b2918,#22170d);border-radius:6px;box-shadow:0 0 0 1px #000,0 8px 30px #000000b3,inset 0 0 30px #00000080}h1,h2,h3{color:var(--gold2);text-shadow:0 2px 2px #000;margin:0;font-weight:700}.dim{color:var(--dim)}.row{align-items:center;gap:8px;display:flex}.col{flex-direction:column;gap:8px;display:flex}.grow,.spacer{flex:1}.menu{background:radial-gradient(#3a2614 0%,#120c07 75%);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.menu .frame{width:min(560px,94vw);max-height:94vh;padding:28px 36px;overflow:auto}.menu h1{text-align:center;letter-spacing:4px;font-size:40px}.menu .sub{text-align:center;color:var(--dim);margin:6px 0 22px}.menu label{justify-content:space-between;align-items:center;gap:12px;margin:10px 0;display:flex}.menu select,.menu input{color:var(--text);border:1px solid var(--gold);background:#1a110a;border-radius:4px;min-width:180px;padding:5px 8px;font-family:inherit;font-size:14px}.menu .buttons{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px;display:flex}.menu .buttons button{min-width:120px;padding:9px 16px;font-size:16px}.menu .help{color:var(--dim);border-top:1px solid #5a4020;margin-top:18px;padding-top:12px;font-size:13px;line-height:1.7}.adv{display:flex;position:absolute;inset:0}.adv .mapwrap{background:#000;flex:1;position:relative;overflow:hidden}.adv canvas.map{cursor:pointer;image-rendering:auto;position:absolute;top:0;left:0}.side{border-left:2px solid var(--gold);background:linear-gradient(#2e2012,#1b120a);flex-direction:column;gap:6px;width:236px;padding:6px;display:flex}.side canvas.mini{border:1px solid var(--gold);cursor:crosshair;background:#000;width:224px;height:224px}.side .date{text-align:center;color:var(--gold2);font-size:14px}.side .list{flex-wrap:wrap;gap:4px;display:flex}.side .portrait{cursor:pointer;background:#1a110a;border:2px solid #6a5030;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;width:50px;height:50px;font-size:24px;display:flex;position:relative}.side .portrait.sel{border-color:var(--gold2);box-shadow:0 0 8px var(--gold)}.side .portrait .mv{background:#4c4;border-radius:1px;width:4px;position:absolute;bottom:2px;left:2px}.side .portrait .mn{background:#48f;border-radius:1px;width:4px;position:absolute;bottom:2px;right:2px}.side .portrait small{font-size:9px;font-family:var(--serif);color:var(--dim);position:absolute;top:1px}.side .info{background:#1a110a;border:1px solid #5a4020;border-radius:4px;min-height:90px;padding:6px;font-size:12px;line-height:1.5}.side .info .army{flex-wrap:wrap;gap:2px;margin-top:4px;display:flex}.side .btns{grid-template-columns:1fr 1fr;gap:4px;display:grid}.side .btns button{padding:6px 4px;font-size:13px}.resbar{border-top:2px solid var(--gold);white-space:nowrap;background:linear-gradient(#2e2012,#1b120a);align-items:center;gap:14px;height:28px;padding:0 12px;font-size:14px;display:flex;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.resbar span b{color:var(--gold2);margin-left:3px;font-weight:400}.slot{width:44px;height:50px;font-size:24px;font-family:var(--emoji);background:#1a110a;border:1px solid #6a5030;border-radius:3px;justify-content:center;align-items:center;display:flex;position:relative}.slot .n{font-size:11px;font-family:var(--serif);color:#fff;text-shadow:0 0 2px #000,0 0 2px #000;position:absolute;bottom:0;right:2px}.slot.small{width:30px;height:34px;font-size:16px}.slot.small .n{font-size:10px}.slot.sel{border-color:var(--gold2);box-shadow:0 0 6px var(--gold) inset}.slot.click{cursor:pointer}.slot.click:hover{border-color:var(--gold)}.toast{border:1px solid var(--gold);pointer-events:none;z-index:50;background:#140c06e6;border-radius:4px;padding:8px 18px;font-size:14px;transition:opacity .3s;position:absolute;top:14px;left:50%;transform:translate(-50%)}.tooltip{z-index:60;pointer-events:none;border:1px solid var(--gold);background:#140c06f2;border-radius:4px;max-width:280px;padding:6px 10px;font-size:13px;line-height:1.5;position:fixed}.banner{z-index:40;color:var(--gold2);text-shadow:0 2px 4px #000;background:#0000008c;justify-content:center;align-items:center;font-size:30px;display:flex;position:absolute;inset:0}.overlay{z-index:30;background:#0009;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.dialog{text-align:center;min-width:320px;max-width:min(520px,92vw);padding:20px 24px}.dialog .icon{font-size:52px;font-family:var(--emoji);margin-bottom:8px}.dialog .text{white-space:pre-line;margin-bottom:16px;font-size:16px;line-height:1.6}.dialog .opts{flex-direction:column;gap:8px;display:flex}.town{z-index:20;background:#120c07;flex-direction:column;display:flex;position:absolute;inset:0}.town .head{border-bottom:2px solid var(--gold);background:linear-gradient(#3a2817,#22170d);align-items:center;gap:12px;padding:8px 14px;display:flex}.town .head .ticon{font-size:40px;font-family:var(--emoji)}.town .body{flex:1;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:14px;padding:12px 14px 40px;display:grid;overflow:auto}.town section{padding:10px 12px}.town section h3{margin-bottom:8px;font-size:16px}.bgrid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;display:grid}.bcard{background:#1a110a;border:1px solid #5a4020;border-radius:4px;flex-direction:column;gap:3px;padding:6px 8px;font-size:12px;line-height:1.45;display:flex}.bcard.built{border-color:var(--green);background:#16200f}.bcard.can{border-color:var(--gold)}.bcard .bn{color:var(--gold2);font-size:14px}.bcard .cost{color:var(--dim)}.bcard button{margin-top:auto;padding:3px 6px;font-size:12px}.rgrid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px;display:grid}.rcard{text-align:center;background:#1a110a;border:1px solid #5a4020;border-radius:4px;padding:6px;font-size:12px}.rcard .big{font-size:34px;font-family:var(--emoji);line-height:1.2}.rcard .nm{color:var(--gold2);font-size:14px}.rcard .row{justify-content:center;gap:4px;margin-top:4px}.rcard button{padding:3px 7px;font-size:12px}.armyrow{flex-wrap:wrap;align-items:center;gap:4px;margin:6px 0;display:flex}.armyrow .lbl{width:64px;color:var(--dim);font-size:12px}.stats{text-align:center;grid-template-columns:repeat(4,1fr);gap:6px;font-size:13px;display:grid}.stats div{background:#1a110a;border:1px solid #5a4020;border-radius:4px;padding:4px}.stats b{color:var(--gold2);font-size:18px;display:block}.spells{flex-wrap:wrap;gap:4px;display:flex}.spell{background:#1a110a;border:1px solid #5a4020;border-radius:4px;padding:3px 7px;font-size:12px}.spell.click{cursor:pointer}.spell.click:hover{border-color:var(--gold2)}.spell.off{opacity:.45}.market{grid-template-columns:repeat(7,1fr);gap:3px;display:grid}.market .m{text-align:center;cursor:pointer;background:#1a110a;border:1px solid #5a4020;border-radius:3px;padding:3px 0;font-size:18px}.market .m small{color:var(--dim);font-size:10px;font-family:var(--serif);display:block}.market .m.sel{border-color:var(--gold2);box-shadow:0 0 6px var(--gold) inset}.battle{z-index:25;background:#0c0805;flex-direction:column;display:flex;position:absolute;inset:0}.battle .field{flex:1;position:relative;overflow:hidden}.battle canvas{position:absolute}.battle .bar{border-top:2px solid var(--gold);background:linear-gradient(#2e2012,#1b120a);align-items:center;gap:8px;padding:6px 10px;display:flex}.battle .log{background:#1a110a;border:1px solid #5a4020;border-radius:3px;flex:1;height:48px;padding:2px 6px;font-size:12px;line-height:1.5;overflow:auto}.battle .hinfo{min-width:150px;font-size:12px;line-height:1.4}.spellbook{z-index:5;width:min(460px,92vw);padding:16px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.spellbook .list{grid-template-columns:1fr 1fr;gap:6px;margin:10px 0;display:grid}.spellbook .sp{cursor:pointer;text-align:left;background:#1a110a;border:1px solid #5a4020;border-radius:4px;padding:6px;font-size:12px}.spellbook .sp b{color:var(--gold2);font-size:14px}.spellbook .sp.off{opacity:.4;cursor:default}.spellbook .sp:not(.off):hover{border-color:var(--gold2)}.result{text-align:center;min-width:340px;padding:20px 26px}.result h2{margin-bottom:10px;font-size:26px}.result .cas{flex-wrap:wrap;justify-content:center;gap:4px;min-height:36px;margin:6px 0 12px;display:flex}@media (width<=760px){.side{width:150px}.side canvas.mini{width:138px;height:138px}.town .body{grid-template-columns:1fr}}.herosheet{box-shadow:0 0 0 2px var(--gold), 0 10px 40px #000;background:linear-gradient(160deg,#4a3220,#2a1a0e);border-color:#b0182a;grid-template-rows:auto auto;grid-template-columns:330px 290px;gap:10px;max-height:94vh;padding:12px;display:grid;overflow:auto}.hs-left,.hs-right{flex-direction:column;gap:6px;display:flex}.hs-head{gap:8px;display:flex}.hs-portrait{border:2px solid var(--gold);background:#1a110a;justify-content:center;align-items:center;width:64px;height:64px;font-size:46px;display:flex}.hs-name{color:var(--dim);background:#1a110a;border:1px solid #6a4a2a;flex-direction:column;flex:1;justify-content:center;align-items:center;font-size:13px;display:flex}.hs-name .n{color:var(--gold2);font-size:22px}.hs-stats{text-align:center;grid-template-columns:repeat(4,1fr);gap:4px;display:grid}.hs-stat{background:#1a110a;border:1px solid #6a4a2a;padding:3px 0}.hs-stat .lbl{color:var(--gold2);font-size:12px}.hs-stat .ico{font-size:30px;line-height:1.3}.hs-stat .val{font-size:15px}.hs-cell{min-height:46px;color:var(--gold2);background:#1a110a;border:1px solid #6a4a2a;align-items:center;gap:6px;padding:4px 6px;font-size:12px;line-height:1.3;display:flex}.hs-cell .ico{text-align:center;width:34px;font-size:26px}.hs-cell.empty{background:#2a120c;border-color:#4a2a1a}.hs-two,.hs-skills{grid-template-columns:1fr 1fr;gap:4px;display:grid}.hs-doll{background:radial-gradient(#3a2414,#1e130a);border:1px solid #6a4a2a;height:310px;position:relative}.hs-doll .sil{fill:#8a1418;stroke:#d03030;stroke-width:1.5px;opacity:.9;width:140px;height:270px;position:absolute;top:20px;left:75px}.hs-art{background:#2a120c;border:1px solid #8a5a2a;justify-content:center;align-items:center;width:46px;height:46px;font-size:28px;display:flex;position:absolute}.hs-art.empty{background:#1e0a06bf}.hs-art.click{cursor:pointer}.hs-art.click:hover{border-color:var(--gold2)}.hs-pack{align-items:center;gap:4px;font-size:12px;display:flex}.hs-pack .hs-art{width:36px;height:36px;font-size:22px;position:static}.hs-spells{flex-wrap:wrap;gap:3px;font-size:12px;display:flex}.hs-army{border-top:1px solid #6a4a2a;grid-column:1/-1;align-items:center;gap:10px;padding-top:8px;display:flex}.hs-army .slot{background:#2a120c;border-color:#8a5a2a;width:62px;height:66px;font-size:34px}.hs-army .slot .n{font-size:13px}@media (width<=700px){.herosheet{grid-template-columns:1fr}}:root{--frame-red:#8a1418;--frame-red2:#5a0c10}.adv .mapwrap{border:3px solid var(--frame-red);box-shadow:inset 0 0 0 1px var(--gold), 0 0 0 1px var(--gold)}.side{width:250px;box-shadow:inset 0 0 0 2px var(--gold);background:repeating-linear-gradient(90deg,#5a0c10 0 6px,#6a1014 6px 12px);border-left:none;gap:6px;padding:6px}.minibox{border:2px solid var(--gold);background:linear-gradient(#3a2414,#24160c);border-radius:4px;padding:14px;position:relative}.minibox canvas.mini{border:1px solid #000;width:210px;height:210px;display:block}.minibox .cmp{color:var(--gold2);text-shadow:0 1px 1px #000;font-size:11px;font-weight:700;position:absolute}.minibox .cmp.n{top:0;left:50%;transform:translate(-50%)}.minibox .cmp.s{bottom:0;left:50%;transform:translate(-50%)}.minibox .cmp.w{top:50%;left:2px;transform:translateY(-50%)}.minibox .cmp.e{top:50%;right:2px;transform:translateY(-50%)}.midrow{grid-template-columns:52px 1fr 52px;gap:5px;display:grid}.col-list{flex-direction:column;gap:3px;display:flex}.side .portrait{background:linear-gradient(#3a2414,#1a110a);border:2px solid #2a0a0a;border-radius:2px;width:52px;height:46px;font-size:26px}.side .portrait.empty{cursor:default;background:#2a0608}.side .portrait.sel{border-color:var(--gold2)}.side .portrait .can-build{font-size:10px;position:absolute;bottom:0;right:1px}.sqgrid{grid-template-columns:1fr 1fr;align-content:start;gap:3px;display:grid}button.sq{border:1px solid var(--gold);background:linear-gradient(#b02028,#6a0c10);border-radius:2px;height:46px;padding:0;font-size:22px;box-shadow:inset 0 1px #ffc8a066,inset 0 -2px #0006}button.sq:hover:not(:disabled){background:linear-gradient(#d03038,#8a1418)}.side .card{border:2px solid var(--gold);background:linear-gradient(#3a2414,#22160c);border-radius:4px;padding:6px;font-size:12px}.card-head{align-items:center;gap:8px;display:flex}.card-head .face{border:1px solid var(--gold);background:#1a110a;justify-content:center;align-items:center;width:48px;height:48px;font-size:34px;display:flex}.card-head .nm{color:var(--gold2);font-size:16px}.card-stats{text-align:center;grid-template-columns:repeat(4,1fr);margin:6px 0 4px;display:grid}.card-stats div{flex-direction:column;font-size:18px;display:flex}.card-stats b{font-size:13px;font-weight:400}.bars{flex-direction:column;gap:3px;margin-bottom:5px;display:flex}.bar{background:#1a0a06;border:1px solid #6a4a2a;height:14px;position:relative}.bar i{opacity:.6;position:absolute;top:0;bottom:0;left:0}.bar span{padding-left:4px;font-size:10px;line-height:13px;position:relative}.card-army{grid-template-columns:repeat(7,1fr);gap:2px;display:grid}.card-army .slot.small{width:auto}.resbar{border-top:2px solid var(--gold);background:repeating-linear-gradient(90deg,#5a0c10 0 6px,#6a1014 6px 12px);gap:6px;padding:0 6px}.resbar>span:not(.spacer):not(.date){background:#1a0a06;border:1px solid #8a5a2a;justify-content:space-between;align-items:center;min-width:70px;height:22px;padding:0 8px;display:flex}.resbar .date{border:1px solid var(--gold);height:22px;color:var(--gold2);background:#1a0a06;padding:0 12px;line-height:20px}@media (width<=760px){.side{width:170px}.minibox canvas.mini{width:130px;height:130px}.midrow{grid-template-columns:1fr 1fr}.midrow .col-list:last-child{display:none}}.battle .bar{flex-wrap:wrap;min-height:66px}.battle .hinfo{flex-shrink:0;width:200px}.battle .hinfo .emoji{letter-spacing:1px;font-size:15px}.battle .log{min-width:200px;height:54px}.rform{border-top:1px solid #3a2a18;margin-top:4px;padding-top:3px}.rform .nm{font-size:13px}canvas.panorama{aspect-ratio:1200/250;border:2px solid var(--gold);border-radius:4px;grid-column:1/-1;width:100%;display:block}.set-row{justify-content:space-between;align-items:center;gap:16px;margin:9px 0;font-size:15px;display:flex}.set-row select,.set-row input[type=range]{min-width:140px}.set-row select{color:var(--text);border:1px solid var(--gold);background:#1a110a;border-radius:4px;padding:3px 6px;font-family:inherit}.ency{flex-direction:column;gap:8px;width:min(1000px,96vw);height:min(760px,92vh);padding:14px 18px;display:flex}.ency-tabs{flex-wrap:wrap;gap:4px;display:flex}.ency-tabs button{padding:4px 8px;font-size:13px}.ency-body{flex:1;overflow:auto}.ency-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px;display:grid}.ency-card{background:#1a110a;border:1px solid #5a4020;border-radius:4px;padding:6px 8px;font-size:12px;line-height:1.5}.ency-card.up{border-color:#8a7020}.ency-card .nm{color:var(--gold2);font-size:15px}.help-text{font-size:14px;line-height:1.8}.help-text h3{margin-top:10px}.help-text p{margin:4px 0}.ptable{border-collapse:collapse;width:100%;margin:8px 0;font-size:14px}.ptable td{padding:3px 4px}.ptable select{width:100%;min-width:0!important}.menu .main-btns{grid-template-columns:1fr 1fr;gap:8px;margin-top:18px;display:grid}.menu .main-btns button{padding:10px;font-size:15px}.camp-card{background:#1a110a;border:1px solid #6a4a2a;border-radius:4px;margin:8px 0;padding:10px 12px}.camp-card.locked{opacity:.55}.editor{background:#120c07;flex-direction:column;display:flex;position:absolute;inset:0}.ed-top{border-bottom:2px solid var(--gold);background:linear-gradient(#3a2817,#22170d);flex-wrap:wrap;align-items:center;gap:6px;padding:6px 10px;display:flex}.ed-top button{padding:4px 8px;font-size:13px}.ed-name{color:var(--text);border:1px solid var(--gold);background:#1a110a;border-radius:4px;width:140px;padding:4px 6px;font-family:inherit}.ed-status{color:var(--dim);font-size:12px}.ed-main{flex:1;min-height:0;display:flex}.ed-side{border-right:2px solid var(--gold);background:#1e140b;flex-direction:column;gap:6px;width:270px;padding:8px;display:flex;overflow:auto}.ed-side h3{margin-top:6px;font-size:14px}.ed-side select{color:var(--text);border:1px solid var(--gold);background:#1a110a;border-radius:4px;width:100%;padding:3px;font-family:inherit}.ed-grid{grid-template-columns:1fr 1fr;gap:3px;display:grid}.ed-grid button,.ed-side .row button{padding:3px 4px;font-size:12px}.ed-opts{flex-direction:column;gap:3px;font-size:12px;display:flex}.ed-opts label{grid-template-columns:36px 1fr;align-items:center;gap:4px;display:grid}.ed-opts input{color:var(--text);border:1px solid var(--gold);background:#1a110a;border-radius:4px;padding:3px;font-family:inherit}.ed-wrap{background:#000;flex:1;overflow:auto}.ed-canvas{cursor:crosshair;display:block}.notice{left:50%;bottom:max(16px, env(safe-area-inset-bottom));z-index:100;border:1px solid var(--gold);background:#140c06f2;border-radius:4px;align-items:center;gap:10px;max-width:min(560px,94vw);padding:8px 10px 8px 16px;font-size:14px;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 4px 16px #000000b3}.notice button{white-space:nowrap;padding:3px 10px;font-size:13px}.notice button.x{box-shadow:none;color:var(--dim);background:0 0;border:none;padding:3px 4px}
