/* suznooto 系列的界面风格（激突要塞！／都道府県大戦）：
   天空蓝底 + 底部绿地、纯黑粗描边、白色大圆角框、橙色标签、绿色标题条、白字黑边的粗圆体。
   颜色取自原作截图：天空 #00ccff、橙 #ff9900/#ff6600、标题绿 #009900、钱绿 #66cc33、地面 #006600、1P 蓝 #0000ff、2P 红 #ff0000 */
:root{--sky:#00ccff;--sea:#0099ee;--org:#ff9900;--org2:#ff6600;--grn:#009900;--lime:#66cc33;--ground:#006600;--p1:#0000ff;--p2:#ff0000;--yel:#ffcc00;
  --ink:#000;--mut:#4a4a4a;--pn:#fff;--red:#ff0000;--bg:#00ccff}
html,body{background:var(--sky);color:#000;font:bold 14px/1.55 "Arial Rounded MT Bold","Microsoft YaHei","PingFang SC",sans-serif}
body{min-height:100vh;background:linear-gradient(to bottom,var(--sky) calc(100% - 28px),#000 calc(100% - 28px),#000 calc(100% - 24px),var(--ground) calc(100% - 24px)) fixed}
.ol{color:#fff;-webkit-text-stroke:5px #000;paint-order:stroke fill}

/* 按钮：白底黑框大圆角；主按钮橙色；选中黄色 */
button{background:#fff;color:#000;border:3px solid #000;border-radius:12px;box-shadow:none;padding:4px 14px;font-weight:bold;transition:background .08s}
button:hover:not(:disabled){background:#ffffb0}
button:active:not(:disabled){transform:translateY(2px);box-shadow:none}
button.pri{background:var(--org);color:#000}
button.pri:hover:not(:disabled){background:#ffb340}
button.on,button.tab.on{background:var(--yel);color:#000}
button:disabled{opacity:.45;transform:none}
select,input[type=text]{border:3px solid #000;border-radius:10px;background:#fff;padding:3px 8px;font-weight:bold}
input[type=checkbox]{accent-color:var(--org2);width:16px;height:16px;vertical-align:-3px}

/* 顶栏：绿色标题条 + 橙色 logo 牌 */
header{background:var(--grn);border-bottom:4px solid #000;color:#fff;padding:8px 16px;gap:8px 16px}
header .st,header .mut{color:#fff;-webkit-text-stroke:4px #000;paint-order:stroke fill}
header .st b{font-size:18px}
.logo{display:inline-block;background:var(--org);color:#000;border:3px solid #000;border-radius:14px;padding:1px 14px;font-size:20px;letter-spacing:3px;
  box-shadow:0 0 0 4px var(--org2),0 0 0 7px #000;margin:4px 8px 4px 4px}
.logo i{color:#fff;-webkit-text-stroke:5px #000;paint-order:stroke fill;font-style:normal}
.st .g,.gold{display:inline-block;background:var(--lime);color:#fff;border:3px solid #000;border-radius:999px;padding:0 12px;-webkit-text-stroke:4px #000;paint-order:stroke fill;line-height:1.35}

/* 面板：白底黑框大圆角，小标题是橙色标签 */
.panel{background:#fff;border:4px solid #000;border-radius:18px;box-shadow:none;padding:12px 14px}
.panel>h3,.panel>h2:first-child{display:inline-block;background:var(--org);border:3px solid #000;border-radius:10px;padding:0 12px;margin:0 0 8px;font-size:15px}
.mut{color:var(--mut);font-weight:normal}
.sw{border:2px solid #000;border-radius:4px}

/* 弹窗：绿色标题条 */
#modal{background:rgba(0,0,0,.45)}
#mbox{border-radius:22px;border-width:5px;padding:0 16px 14px}
#mbox>h2{display:block;margin:0 -16px 12px;background:var(--grn);color:#fff;-webkit-text-stroke:5px #000;paint-order:stroke fill;text-align:center;
  border-bottom:4px solid #000;border-radius:16px 16px 0 0;padding:6px 12px;font-size:20px;letter-spacing:2px}
#mBtns{justify-content:flex-end}
.li{border-bottom:2px dotted #000}

/* 地图：深一点的海 + 黑色县界 */
#map{border:4px solid #000;border-radius:18px;background:var(--sea)}
.pf{stroke:#000;stroke-width:.8}
.lb{fill:#000;stroke:#fff;stroke-width:3px;font-weight:900}
.lb.mine{fill:#fff;stroke:#000}
.inset{stroke:#000;stroke-width:2;stroke-dasharray:6 4}
.o-sel{stroke:#fff;stroke-width:4}
.o-mv{fill:rgba(102,255,0,.35);stroke:#000;stroke-width:2.5}
.o-at{fill:rgba(255,0,0,.35);stroke:#000;stroke-width:2.5}
#zoomBtns button{border-radius:10px;min-width:36px}
#fleet div,#rank div,#log div{border-bottom:2px dotted #000}
#log .me{color:var(--p2)}#log a{color:var(--p1)}

/* 车库 / 编辑器 */
#gcv,#ecv{border:4px solid #000;border-radius:16px;background:#7fd0f2}
.it{border-radius:12px;border-width:3px;box-shadow:none}
.it small{color:var(--mut)}
.stats div{background:#fff;border:3px solid #000;border-radius:12px}
.stats .bad{color:var(--p2)}
.tab .dot{border-radius:50%}

/* 战斗：左蓝右红的血条，中间一颗心 */
#bhud{gap:10px}
.bs .nm{-webkit-text-stroke:4px #000;paint-order:stroke fill;color:#fff;font-size:15px}
.bar{height:24px;border:4px solid #000;background:#999;border-radius:0}
.bar i{background:var(--p1)}
.bs.r .bar i{background:var(--p2)}
#bTime{min-width:64px;padding-top:30px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 36'%3E%3Cpath d='M20 34C8 25 2 18 2 11 2 5 7 2 11 2c4 0 7 2 9 6 2-4 5-6 9-6 4 0 9 3 9 9 0 7-6 14-18 23z' fill='%23ff0000' stroke='%23000' stroke-width='3' stroke-linejoin='round'/%3E%3C/svg%3E") center top/40px 36px no-repeat;
  color:#fff;-webkit-text-stroke:5px #000;paint-order:stroke fill;font-size:22px;line-height:1}
#bcv{border:4px solid #000;border-radius:16px}
.spd{border-radius:999px;min-width:46px;padding:4px 8px}
#bResult,#result{color:#fff;-webkit-text-stroke:6px #000;paint-order:stroke fill;font-size:22px}
#busy{background:var(--yel);color:#000;border:3px solid #000;border-radius:999px;padding:4px 16px}

/* 零件栏分组、没解锁的零件 */
.pcat{grid-column:1/-1;margin:6px 0 0;padding:1px 10px;background:var(--org);border:3px solid #000;border-radius:10px;font-size:13px;justify-self:start}
.pcat:first-child{margin-top:0}
.it.lock{opacity:.5;filter:grayscale(1)}
.lk{display:inline-block;background:#999;color:#fff;border-radius:999px;padding:0 8px;font-size:11px;-webkit-text-stroke:0}