:root{color-scheme:dark;font:15px system-ui;background:#0a101c;color:#f1f3ef}*{box-sizing:border-box}body{margin:0}main{max-width:1280px;margin:auto;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}header{display:flex;align-items:center;gap:8px}h1{font-size:22px;margin:0 auto 0 0}button{min-width:44px;min-height:44px;padding:9px 14px;border:1px solid #71829a;border-radius:7px;background:#253449;color:#fff;font:inherit;touch-action:none}button:disabled{opacity:.45}button.held{background:#806131;border-color:#e7c675}#notice{line-height:1.45}#menu,#result{padding:16px;background:#141f31;border:1px solid #3a4a63;border-radius:10px}#menu button,#result button{margin:4px}#screen{width:100%;aspect-ratio:16/9;max-height:calc(100dvh - 190px);background:#000}iframe{display:block;width:100%;height:100%;border:0;pointer-events:none}#controls{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:116px;user-select:none;touch-action:none}#stick{position:relative;flex:none;width:108px;height:108px;border:2px solid #8797ad;background:#17273e;border-radius:50%;touch-action:none}#stick span{position:absolute;inset:33px;background:#afbbcc;border-radius:50%;pointer-events:none}.actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;max-width:400px}.actions button{min-width:64px}#dragoon-wallet-controls{position:static!important;width:auto!important;max-width:1280px!important;margin:12px auto!important;display:flex;align-items:center;gap:8px}#dragoon-wallet-controls p{flex:1}#dragoon-wallet-controls button{width:auto!important}#dragoon-wallet-controls select{max-width:150px}#exit{display:none}body.in-battle #exit{display:block}body.in-battle #menu,body.in-battle #dragoon-wallet-controls{display:none!important}body.in-battle #notice{margin:8px 0;min-height:22px}body.in-battle h1{font-size:17px}@media(max-width:540px){header{flex-wrap:wrap}h1{font-size:19px}.actions{max-width:230px}.actions button{min-width:61px;padding:8px}#screen{max-height:none}#dragoon-wallet-controls{flex-wrap:wrap}#dragoon-wallet-controls p{flex-basis:100%}}@media(orientation:landscape) and (max-height:540px){main{padding-top:max(5px,env(safe-area-inset-top))}#screen{max-height:calc(100dvh - 96px);width:min(100%,calc((100dvh - 96px)*16/9));margin:auto}#controls{position:fixed;bottom:max(8px,env(safe-area-inset-bottom));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));min-height:86px;pointer-events:none}#controls>*{pointer-events:auto}#stick{width:86px;height:86px;background:#17273ebd}#stick span{inset:26px}.actions{max-width:340px}.actions button{background:#253449db}#result{position:fixed;inset:70px max(120px,env(safe-area-inset-right)) 12px max(120px,env(safe-area-inset-left));overflow:auto;z-index:5}}[hidden]{display:none!important}

/* Landing: hero + pitch first; the wallet Core expedition is folded away. */
#hero{display:grid;grid-template-columns:minmax(0,3fr) minmax(260px,2fr);gap:20px;align-items:center;margin:12px 0 16px}
#hero img{width:100%;height:auto;border-radius:10px;border:1px solid #3a4a63;image-rendering:pixelated;display:block}
#hero h2{font-size:26px;line-height:1.2;margin:0 0 10px}
#hero p{margin:0 0 16px;line-height:1.5;color:#c9d0da}
#hero ul{margin:14px 0 0;padding-left:18px;line-height:1.7;color:#c9d0da}
.play-now{display:inline-block;min-height:44px;padding:13px 28px;border-radius:8px;background:#e0702a;color:#fff;font-weight:700;font-size:17px;text-decoration:none}
.play-now:hover{background:#f08a3e}.play-now:focus-visible{outline:3px solid #ffd2a8;outline-offset:3px}
#core{margin:8px 0;padding:12px 16px;background:#141f31;border:1px solid #3a4a63;border-radius:10px}
#core summary{cursor:pointer;min-height:24px;color:#c9d0da}
#core[open] summary{margin-bottom:10px}
#core #menu{padding:0;border:0;background:none}
body:not(.in-battle) #fullscreen{display:none}
body:has(#core:not([open])):not(.in-battle) #dragoon-wallet-controls{display:none!important}
body.in-battle #hero,body.in-battle #core summary{display:none}
@media(max-width:720px){#hero{grid-template-columns:1fr}#hero h2{font-size:22px}}