:root{--bg:#111016;--panel:#1c1922;--panel2:#26222f;--line:#4e475a;--gold:#dfc36b;--text:#eee9dd;--muted:#aaa4b4;--red:#b84a4d;--green:#6aa65b;--blue:#5b8ab5}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% 15%,#2d1d2a 0,#111016 55%);color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}body{overflow-x:hidden}button{font:inherit;color:inherit;background:#2b2634;border:1px solid #5a5267;border-radius:6px;padding:8px 10px;cursor:pointer}button:hover{background:#393142}button:active{transform:translateY(1px)}button:disabled{opacity:.35;cursor:not-allowed}
.topbar{height:58px;padding:8px 12px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #352f3e;background:#17141c;position:sticky;top:0;z-index:5}.brand-title{font-weight:900;letter-spacing:3px;font-size:20px;color:#e55a5e}.brand-sub{font-size:9px;color:var(--muted);letter-spacing:1px}.top-actions{display:flex;gap:6px}.top-actions button{font-size:10px;padding:7px 8px}
.main-grid{max-width:1160px;margin:14px auto 30px;padding:0 12px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px}.screen-wrap{min-width:0}.screen-frame{background:#08080b;border:2px solid #3f3949;border-radius:10px;padding:8px;box-shadow:0 12px 30px rgba(0,0,0,.35)}#game{display:block;width:100%;height:auto;max-height:calc(100vh - 110px);background:#0d0c10;border-radius:5px;image-rendering:pixelated;image-rendering:crisp-edges}.hint{font-size:9px;color:#777184;margin:7px 2px;line-height:1.5}.side-panel{display:flex;flex-direction:column;gap:8px}.card{background:linear-gradient(180deg,#201c26,#19171f);border:1px solid var(--line);border-radius:8px;padding:10px;box-shadow:0 7px 18px rgba(0,0,0,.18)}.location-card{display:flex;flex-direction:column;gap:4px}.location-card b{font-size:14px;color:var(--gold)}.location-card span{font-size:9px;color:var(--muted)}.card-title{font-size:9px;letter-spacing:1px;color:#c2baca;margin-bottom:6px}.muted{color:var(--muted);font-size:9px;line-height:1.5}.stat-row{display:flex;justify-content:space-between;font-size:10px;padding:2px 0}.party-mini{display:flex;flex-direction:column;gap:6px}.mini{display:grid;grid-template-columns:38px 1fr;gap:7px;align-items:center}.mini-img{width:36px;height:36px;image-rendering:pixelated;object-fit:contain;background:#131118;border:1px solid #3b3544;border-radius:4px}.mini-name{font-size:9px}.mini-level{font-size:8px;color:var(--muted)}.bar{height:5px;background:#0e0d11;border:1px solid #38323f;border-radius:3px;overflow:hidden}.bar i{display:block;height:100%;background:#69ad62}.controls{display:flex;flex-direction:column;gap:3px;color:var(--muted);font-size:9px}.battle-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}.battle-title{font-size:11px;color:var(--gold);margin-bottom:7px}.action-btn{font-size:9px;padding:8px}.hidden{display:none!important}
.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(8,7,11,.78);backdrop-filter:blur(3px);z-index:20;padding:14px}.modal-box{position:relative;width:min(760px,100%);max-height:88vh;overflow:auto;background:#1a1720;border:1px solid #5c536a;border-radius:10px;padding:22px;box-shadow:0 20px 70px rgba(0,0,0,.55)}.modal-close{position:absolute;right:8px;top:8px;padding:5px 8px;background:#342d3c}.modal-box h2{margin:0 0 10px;color:var(--gold);font-size:20px}.modal-box p{font-size:11px;line-height:1.6;color:#d4cedc}.grid-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.menu-card{text-align:left;min-height:95px}.menu-card strong{font-size:13px;color:#f2de89}.menu-card small{font-size:8px;line-height:1.4;color:var(--muted)}.list{display:flex;flex-direction:column;gap:6px}.list-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:8px;background:#24202a;border:1px solid #3b3544;border-radius:6px}.list-row small{color:var(--muted);font-size:8px}.section-title{font-size:10px;color:#d9c477;margin:12px 0 6px}.tabbar{display:flex;gap:5px;margin-bottom:8px}.tabbar button{font-size:8px}.world-map{background:#0b1e2b;border:1px solid #405064;border-radius:7px;padding:8px}.mission{padding:9px;background:#25212c;border:1px solid #3c3546;border-radius:6px;margin:6px 0}.mission b{color:#d9c477;font-size:10px}.mission span{display:block;font-size:8px;color:var(--muted);margin-top:3px}.boot{background:radial-gradient(circle at 50% 30%,rgba(114,32,46,.38),rgba(9,8,12,.97) 58%)}.boot-box{width:min(420px,100%);padding:30px;text-align:center;background:rgba(22,18,27,.9);border:1px solid #564b60;border-radius:12px;box-shadow:0 30px 100px rgba(0,0,0,.7)}.dead-logo{font-weight:900;font-size:46px;line-height:.8;letter-spacing:4px;color:#da5257;text-shadow:3px 3px 0 #351824,0 0 20px rgba(217,70,80,.2);margin-bottom:18px}.boot-copy{font-size:10px;color:#c4beca;line-height:1.6;margin-bottom:18px}.big-btn{display:block;width:100%;padding:13px;margin:7px 0;background:#35303e;border-color:#7a6a57;font-size:11px;font-weight:800}.big-btn.secondary{background:#231f29;border-color:#51485a}.boot-status{font-size:8px;color:#756d7b;margin-top:12px;line-height:1.5}
.touch-layer{display:none;position:absolute;inset:auto 0 8px 0;justify-content:space-between;align-items:flex-end;padding:0 10px;pointer-events:none}.screen-frame{position:relative}.touch-layer button{pointer-events:auto;width:44px;height:44px;border-radius:50%;background:rgba(34,29,40,.82);border:1px solid #71677e;font-weight:900}.dpad{display:flex;flex-direction:column;align-items:center;gap:4px}.dpad>div{display:flex;gap:4px}.ab{display:flex;gap:8px;align-items:flex-end}.ab button:first-child{width:40px;height:40px;border-color:#8e5362}.ab button:last-child{width:52px;height:52px;border-color:#5f7b9c}
@media(max-width:900px){.main-grid{grid-template-columns:1fr}.side-panel{order:2}.screen-wrap{order:1}.touch-layer{display:flex}.top-actions button{padding:6px 7px}.topbar{height:auto;align-items:flex-start}.brand-title{font-size:16px}.brand-sub{font-size:8px}.hint{display:none}}
@media(max-width:560px){.top-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:4px}.top-actions button{font-size:8px}.main-grid{padding:0 5px;margin-top:5px}.screen-frame{padding:4px}.side-panel{display:grid;grid-template-columns:1fr 1fr}.side-panel .card:nth-child(1),.side-panel .card:nth-child(2),.side-panel .card:nth-child(3){grid-column:1/-1}.card{padding:8px}.modal-box{padding:18px}.grid-buttons{grid-template-columns:1fr}.dead-logo{font-size:38px}}
