:root{--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}
button,select,input,summary{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,[role=button]:focus-visible,summary:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #38bbff;outline-offset:3px}
#c{touch-action:none}#who{top:calc(12px + var(--safe-top));left:calc(12px + var(--safe-left))}#top{top:calc(12px + var(--safe-top))}#rail{top:calc(12px + var(--safe-top));right:calc(12px + var(--safe-right))}
.rnd{width:46px;height:46px;flex-shrink:0}.panel{max-height:calc(100dvh - 32px - var(--safe-top) - var(--safe-bottom));overflow:auto;border:1px solid rgba(201,168,76,.4)}
#start-ovl{padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);background:radial-gradient(ellipse at 50% 40%,rgba(15,26,44,.35),rgba(3,8,17,.88))}
#start-ovl .panel{background:linear-gradient(155deg,#172439,#090f1c);color:#f0eadc;border-radius:22px;box-shadow:0 24px 100px #0008;padding:28px;text-align:left}
#start-ovl h1{font:600 clamp(2rem,7vw,3.2rem) Georgia,serif;letter-spacing:.13em;color:#ead199;margin:8px 0}
#start-ovl .panel p{color:#bac8d9;font-size:.95rem;line-height:1.6}#start-ovl .sub{color:#bba36d;letter-spacing:.19em}#start-ovl .hb-cur,#start-ovl .hb-cur b{color:#c8d3e3}#start-ovl .legal-nav a{color:#a9bad1}
#district-field{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0;font-size:.8rem;color:#c5d3e3}#district-select{max-width:65%;padding:12px;border-radius:9px;border:1px solid #4a5365;background:#101b2c;color:#f4e8cc}
#advanced-options{margin:14px 0;border-top:1px solid #354058;padding-top:12px}#advanced-options summary{cursor:pointer;min-height:44px;display:flex;align-items:center;color:#ddc593;font-size:.85rem}#advanced-options .hb-row{flex-wrap:wrap;gap:12px}#advanced-options .hb-row span{display:inline-flex;align-items:center;min-height:44px;color:#b1d6ff}
#start-ovl .cta{padding:15px 20px;min-height:48px;letter-spacing:.08em;background:linear-gradient(135deg,#eed9a0,#c9a84c);color:#201b11;border:0;border-radius:10px;margin-top:0}
.district-note{font-size:.72rem;line-height:1.5;color:#9eb1cc;margin:12px 0}.cta-row{display:flex;gap:10px;flex-wrap:wrap}
#battle-help{position:absolute;top:calc(90px + var(--safe-top));left:50%;transform:translateX(-50%);pointer-events:none;z-index:6;max-width:65vw;color:#ecf3ff;background:#0b162ae8;border:1px solid #62799b55;border-radius:10px;padding:8px 14px;font-size:.78rem;text-align:center}#battle-help[hidden]{display:none}
#deck{bottom:calc(12px + var(--safe-bottom));max-width:calc(100vw - 180px - var(--safe-left) - var(--safe-right));overflow:auto;padding:8px 5px;scrollbar-width:thin;align-items:stretch}.tcard{flex:0 0 112px}.tcard .st{font-size:.65rem;line-height:1.35}.tcard .hd{font-size:.72rem}.tcard .bd{padding:6px 8px}
#abrow{bottom:calc(24px + var(--safe-bottom))!important;left:calc(12px + var(--safe-left))!important}#tinfo{bottom:calc(165px + var(--safe-bottom));right:calc(12px + var(--safe-right));width:235px}#tinfo .btn{padding:13px 8px;font-size:.75rem}#tinfo .row{font-size:.75rem}#toast{bottom:calc(170px + var(--safe-bottom));max-width:88vw;text-align:center;white-space:normal}
.game-dialog{width:min(640px,calc(100vw - 24px - var(--safe-left) - var(--safe-right)));max-height:calc(100dvh - 32px - var(--safe-top) - var(--safe-bottom));overflow:auto;background:#101b2b;color:#eaf0f8;border:1px solid #8b7952;border-radius:18px;padding:24px;box-shadow:0 24px 90px #0009}.game-dialog::backdrop{background:#020813c9;backdrop-filter:blur(6px)}.game-dialog h2{font:500 1.6rem Georgia,serif;color:#e4cb93;margin:0}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.dialog-close{height:44px;min-width:44px;background:#223147;border:1px solid #53647c;color:#eef3ff;border-radius:10px}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.settings-grid .rnd{width:auto;height:auto;min-height:52px;border-radius:10px;justify-content:flex-start;padding:12px;background:#1c2c42;color:#f3e9d1;border-color:#364b65;gap:10px;font-size:.9rem}.world-info{margin:20px 0 0;padding-top:16px;border-top:1px solid #39465b;font-size:.8rem;line-height:1.6;color:#b9c9df}.world-info button,.workshop-actions button{min-height:44px;border:1px solid #776745;border-radius:8px;padding:10px 14px;background:#dcc38b;color:#151a24;font-weight:700}.world-info button{margin:10px 6px 0 0}
.workshop-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.workshop-preview{min-height:240px;background:radial-gradient(ellipse,#2b3b52,#090f1b);border:1px solid #344a67;border-radius:14px;overflow:hidden}.workshop-preview canvas{width:100%;height:260px;display:block}.collection-list{display:flex;flex-direction:column;gap:8px}.collection-choice{background:#1b293d;color:#e2eaf5;border:1px solid #3c4f69;border-radius:9px;min-height:52px;text-align:left;padding:10px 12px;font-size:.82rem}.collection-choice[aria-pressed=true]{border-color:#e0c386;background:#353327}.collection-choice small{display:block;color:#a8bbd4;font-size:.69rem;margin-top:3px}.workshop-actions{margin-top:16px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}.workshop-actions select{background:#1d2c43;color:#e9eff8;padding:10px;border:1px solid #4d607a;border-radius:8px;min-height:44px}#workshop-note{font-size:.8rem;color:#b4c5da;line-height:1.5}#workshop-preview-error{padding:20px;color:#bfcde0}
@media(max-width:640px){#start-ovl .panel{padding:22px}#who .nm{font-size:.8rem}#who .org{display:none}#rail{gap:7px}.rnd{width:44px;height:44px;font-size:18px}#top{top:calc(66px + var(--safe-top));bottom:auto;left:calc(12px + var(--safe-left));transform:none;gap:5px;max-width:calc(100vw - 82px - var(--safe-left) - var(--safe-right));flex-wrap:wrap;justify-content:flex-start}#top .chip{padding:5px 8px}#top .v{font-size:.8rem}#hpchip{min-width:130px}#hpbar{width:110px}#pips{display:none!important}#battle-help{top:calc(132px + var(--safe-top));max-width:calc(100vw - 100px);font-size:.72rem;padding:7px 10px;left:calc(12px + var(--safe-left));transform:none;text-align:left}#deck{left:0;transform:none;right:0;bottom:var(--safe-bottom);max-width:none;padding:8px calc(8px + var(--safe-right)) 8px calc(8px + var(--safe-left));gap:8px;background:linear-gradient(0deg,#081121ee,#081121aa);border-top:1px solid #50607833}.tcard{flex:0 0 92px}.tcard .st{display:block;font-size:.61rem}.tcard .hd{font-size:.62rem}.tcard .pt{font-size:1.25rem}#abrow{bottom:calc(150px + var(--safe-bottom))!important;flex-direction:row!important;gap:8px}#tinfo{bottom:calc(204px + var(--safe-bottom));width:min(235px,72vw)}#banner{top:calc(180px + var(--safe-top));font-size:.85rem}#toast{bottom:calc(205px + var(--safe-bottom));font-size:.72rem}.workshop-grid{grid-template-columns:1fr}.workshop-preview canvas{height:200px}.workshop-preview{min-height:200px}.collection-list{display:grid;grid-template-columns:1fr 1fr}.game-dialog{padding:18px}.settings-grid{gap:8px}.settings-grid .rnd{font-size:.78rem}.ovl{padding-top:var(--safe-top);padding-bottom:var(--safe-bottom)}}
@media(max-height:500px) and (orientation:landscape){#who{display:none}#top{left:12px;transform:none}#deck{max-width:65vw;left:50%}#abrow{bottom:calc(14px + var(--safe-bottom))!important}#battle-help{top:64px}.tcard .st{display:none}.workshop-grid{grid-template-columns:1fr 1fr}.game-dialog{max-height:92dvh}}

body.dialog-open::after{content:"";position:fixed;inset:0;z-index:98;background:#020813bb;pointer-events:auto}.fallback-dialog{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;z-index:99}

.settings-grid .rnd::after{content:attr(title)}
@media(max-width:640px){#abrow{bottom:calc(var(--deck-height,200px) + 10px + var(--safe-bottom))!important}#tinfo,#toast{bottom:calc(var(--deck-height,200px) + 76px + var(--safe-bottom))}}

/* Native modal keeps invisible battle controls inert during GPU recovery. */
#gpu-recovery{box-sizing:border-box;width:min(90vw,420px);padding:26px;border:1px solid #c9a84c;border-radius:18px;background:#101722;color:#f5edd9;font:16px/1.5 system-ui;}
#gpu-recovery::backdrop{background:rgba(4,8,14,.88);}
#gpu-recovery h2{margin:0 0 12px;font-size:1.35rem;}
#gpu-recovery button{min-height:48px;width:100%;border:0;border-radius:10px;background:#c9a84c;color:#101722;font:700 16px system-ui;cursor:pointer;}
#gpu-recovery button:focus-visible{outline:3px solid #fff;outline-offset:4px;}
#gpu-recovery.recovery-fallback[open]{display:block;position:fixed;inset:0;z-index:10000;margin:0;width:100vw;height:100vh;border-radius:0;padding:max(24px,env(safe-area-inset-top)) 24px;}
