:root{font-family:Arial,Helvetica,sans-serif;color:#f5e8cc;background:#0b2023;font-synthesis:none;--paper:#f6e5bd;--gold:#ffc75b;--ink:#112c2f}*{box-sizing:border-box}body{margin:0;height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) max(12px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(12px,env(safe-area-inset-left));overflow:hidden}button,select{font:inherit;min-height:44px;border:1px solid #6c8880;border-radius:4px;color:var(--paper);background:#1b3b3e;cursor:pointer}button:hover{background:#305155}button:focus-visible,select:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:disabled{opacity:.45;cursor:default}button:active,.pressed{transform:translateY(1px);background:#b88332!important;color:#fff!important}button{touch-action:manipulation}a{color:inherit;text-underline-offset:4px}header{height:64px;flex:none;display:flex;align-items:center;gap:18px;border-bottom:1px solid #4b5c52;max-width:1300px;width:100%;margin:auto}.brand{font-weight:900;font-size:25px;text-decoration:none;letter-spacing:-1.2px}.brand span{color:var(--gold)}.edition,.eyebrow{font-size:10px;font-weight:bold;letter-spacing:1.6px;color:#d5b778}.edition{margin-right:auto}nav{display:flex;gap:6px}nav button,.panel-head button{width:44px;font-size:22px}main{max-width:1300px;width:100%;margin:0 auto;flex:1;min-height:0;display:flex;flex-direction:column}.hud{display:flex;align-items:center;justify-content:space-between;min-height:66px;gap:10px}.hud>div:first-child{display:grid;gap:4px}.hud strong{font-size:22px}.stats{display:flex;align-items:center;gap:20px;font:12px monospace}.stats b{font-size:17px;color:var(--gold)}.work-area{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 280px;grid-template-rows:minmax(0,1fr) 164px;gap:0 25px}.field{grid-area:1/1;position:relative;min-height:0;overflow:hidden;border:1px solid #769187;border-radius:5px;background:#10292d;display:flex;align-items:center;justify-content:center}canvas{width:100%;height:100%;object-fit:contain;display:block;touch-action:none}.ledger{grid-area:1/2/3/3;background:#eddfbd;color:#173236;padding:24px;border-radius:4px;overflow:auto;border-top:6px solid #b7823b}.ledger .eyebrow{color:#6d5429}.ledger h2{font-family:Georgia,serif;font-size:35px;line-height:1.05;letter-spacing:-1px;margin:18px 0 0}.ledger img{width:100%;height:145px;object-fit:contain;display:block}.ledger p{font-size:13px;line-height:1.5}.ledger button{display:block;width:100%;margin-top:8px;background:transparent;color:#173236;border-color:#827751;font-size:12px;font-weight:bold}.station{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin:17px 0 0}.station i{height:8px;background:#b2aa8e;border:1px solid #88886b;border-radius:1px}.station i.on{background:#b77825;border-color:#684a1e}.controls{grid-area:2/1;display:flex;align-items:center;gap:28px;padding-top:8px;justify-content:space-between;user-select:none}.pad{width:168px;height:156px;display:grid;grid-template:repeat(3,52px)/repeat(3,56px);flex:none;touch-action:none}.pad button{font-weight:bold;font-size:27px;border:1px solid #94a49a;min-height:52px;touch-action:none;background:#294b4d}.up{grid-area:1/2}.left{grid-area:2/1}.right{grid-area:2/3}.down{grid-area:3/2}.pad-center{grid-area:2/2;display:grid;place-items:center;color:#d9b163;background:#173236;border-radius:100%;font-size:25px}.control-help{font-size:11px;line-height:1.7;color:#c5d2c6}.control-help strong{display:block;color:var(--gold);letter-spacing:1px}.actions{display:grid;gap:8px;min-width:126px}.action{min-height:64px;padding:8px 14px;border-color:#dfb461;background:#6e5129;touch-action:none}.action b{display:block;font-size:15px;letter-spacing:1px}.action span{display:block;font:9px monospace;margin-top:5px}.press{background:#263f43}.status-bar{min-height:43px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:11px;color:#d8dfcc}.gear-tag{flex:none;color:var(--gold);font-size:10px;letter-spacing:1px}footer{max-width:1300px;width:100%;margin:0 auto;flex:none;display:flex;gap:20px;align-items:center;justify-content:space-between;min-height:42px;border-top:1px solid #4b5c52;font-size:10px;color:#bfc7b6}footer>span{font:9px monospace}footer p{margin:7px 0}.title{position:absolute;inset:0;background:linear-gradient(90deg,#071d21d9 0%,#071d2120 60%),url('/assets/arcade-card.webp') center/cover;display:flex;flex-direction:column;justify-content:space-between;padding:32px}.title-copy h1{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(50px,6vw,86px);line-height:.87;letter-spacing:-1px;margin:15px 0;color:#fff1c9;visibility:hidden}.title-copy p{line-height:1.5;font-size:13px;max-width:230px;margin:20px 0}.title-copy>.eyebrow{visibility:hidden}.title-actions{width:300px;background:#0b2528e8;padding:16px;border:1px solid #69817a;border-radius:4px;display:grid;gap:8px}.title-actions label{font-size:10px;letter-spacing:1px;color:#dbc087}.title-actions select{width:100%;font-size:12px;padding:0 6px}.primary{background:var(--gold);border-color:var(--gold);color:#172e2d;font-weight:800;padding:8px 18px;font-size:14px}.primary:hover{background:#ffdc8e}.title-links{display:flex;gap:8px}.title-links button{flex:1;font-size:11px;background:transparent;border:0;text-decoration:underline}.title-view .controls{visibility:hidden}.title-view .hud,.title-view .status-bar{opacity:.55}.ready{position:absolute;inset:0;background:#09272be8;z-index:3;display:flex;align-items:center;justify-content:center;text-align:center;flex-direction:column;padding:20px}.ready h2{font-family:Georgia,serif;font-size:32px;margin:13px 0;line-height:1.1}.ready p{max-width:390px;font-size:13px;line-height:1.5;margin:3px 0 18px}.ready[hidden],.title[hidden]{display:none}dialog{border:1px solid #c5a36d;border-top:5px solid #bb8436;border-radius:5px;background:#f4e8ca;color:#153236;width:min(620px,calc(100vw - 22px));max-height:calc(100dvh - 22px);padding:18px 22px;overscroll-behavior:contain}dialog::backdrop{background:#041518cc}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel-head .eyebrow{color:#7b5b2b}.panel-head button{background:transparent;color:#25403b}.panel-head+h2{margin-top:5px}dialog h2{font:32px Georgia,serif;line-height:1.05}dialog h3{font-size:17px}dialog p,dialog li{font-size:14px;line-height:1.55}dialog button:not(.primary){background:#1c3b3e}dialog .primary{min-height:48px}.row-buttons{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 0}.row-buttons button{flex:1;padding:10px;min-width:100px}.floor-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.floor-grid button{min-height:54px}.floor-grid button small{font-size:8px;display:block}.lore-card{border-bottom:1px solid #a4a185;padding:12px 0}.lore-card .era{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#776332}.lore-card a{font-size:12px;min-height:44px;display:flex;align-items:center}.reward-art{width:100%;max-height:160px;object-fit:cover;border-radius:3px}.equipment-row{display:grid;grid-template-columns:40px 1fr;gap:12px;margin:18px 0}.equipment-row>b{border:2px solid #b98436;align-self:start;padding:8px;text-align:center;color:#8c5b22}.equipment-row p{margin:4px 0}.quiet{font-size:11px!important;color:#656e57}#panel-body>button{min-height:48px}.milestone{color:#8c591c;font-weight:bold}#panel-body{overflow-wrap:anywhere}
@media(max-width:1000px){.work-area{grid-template-columns:minmax(0,1fr) 220px;gap:0 15px}.ledger{padding:16px}.ledger h2{font-size:29px}.control-help{display:none}.controls{justify-content:space-around}.title{padding:22px}.title-actions{width:270px}.title-copy p{display:none}}
@media(max-width:700px) and (orientation:portrait){body{padding-left:8px;padding-right:8px}header{height:54px;gap:8px}.brand{font-size:22px}.edition{font-size:8px;letter-spacing:1px}nav{gap:4px}nav button{width:44px}.hud{min-height:62px}.hud strong{font-size:17px}.eyebrow{font-size:8px;letter-spacing:1.2px}.stats{gap:4px;flex-direction:column;align-items:end;font-size:10px}.stats b{font-size:13px}.work-area{display:grid;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 164px;gap:0}.ledger{display:none}.field{min-height:0}.controls{gap:8px;justify-content:space-around}.pad{width:168px}.actions{min-width:112px}.action{padding:6px;min-height:64px}.action b{font-size:13px}.action span{font-size:8px}.status-bar{min-height:40px;font-size:10px;gap:5px}.gear-tag{display:none}footer{min-height:35px;font-size:8px;gap:4px}footer>span{display:none}footer p{max-width:95%;line-height:1.4}.title{background:linear-gradient(0deg,#071d21ee,transparent 65%),url('/assets/portrait-cover.webp') center 35%/cover;padding:12px;justify-content:end}.title-copy{display:none}.title-actions{width:100%;padding:10px;gap:5px}.title-actions label{font-size:9px}.title-links button{min-height:44px}.ready h2{font-size:26px}.ready p{font-size:11px}.ready{padding:12px}.ready p{margin-bottom:10px}.ready .primary{font-size:13px}.floor-grid{gap:5px}dialog{padding:13px}dialog h2{font-size:27px}}
@media(max-width:700px) and (orientation:portrait) and (max-height:650px){header{height:48px}.hud{min-height:50px}.hud strong{font-size:15px}.work-area{grid-template-rows:minmax(0,1fr) 160px}.status-bar{min-height:29px;font-size:9px}footer{min-height:24px;font-size:7px}.title-actions{padding:7px;gap:2px}.title-actions select,.title-actions .primary{min-height:44px}.title-links{display:none}.ready h2{font-size:22px;margin:8px 0}.ready p{font-size:10px;line-height:1.4}}
@media(orientation:landscape) and (max-height:550px){body{padding-left:max(6px,env(safe-area-inset-left));padding-right:max(6px,env(safe-area-inset-right))}header{height:46px;gap:12px}.brand{font-size:21px}.edition{font-size:9px}.hud{min-height:42px}.hud strong{font-size:15px}.hud .eyebrow{font-size:8px}.stats{font-size:10px;gap:9px}.stats b{font-size:12px}.work-area{display:grid;grid-template-columns:minmax(0,1fr) 180px;grid-template-rows:minmax(0,1fr);gap:0 7px}.ledger{display:none}.controls{grid-area:1/2;flex-direction:column;gap:4px;padding:0;justify-content:center}.pad{height:132px;width:156px;grid-template:repeat(3,44px)/repeat(3,52px)}.pad button{min-height:44px;font-size:23px}.actions{display:flex;gap:5px;min-width:0;width:100%}.action{min-height:50px;min-width:0;flex:1;padding:4px 2px}.action b{font-size:10px;letter-spacing:0}.action span{font-size:7px}.control-help{display:none}.status-bar{min-height:25px;font-size:9px}.gear-tag{font-size:8px}footer{min-height:20px;font-size:7px}footer>span{font-size:7px}.title{padding:10px;flex-direction:row;align-items:end}.title-copy{display:none}.title-actions{width:220px;padding:7px;gap:4px}.title-actions select{min-height:44px;font-size:10px}.title-actions label,.title-links{display:none}.ready{padding:8px}.ready h2{font-size:22px;margin:5px}.ready p{font-size:10px;margin:5px 0;max-width:320px}.ready .eyebrow{display:none}.ready .primary{min-height:44px;font-size:12px}dialog{max-height:calc(100dvh - 14px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.title-copy{display:none}.title-view .work-area{grid-template-rows:minmax(0,1fr) 0}.title-view .controls{display:none}@media(orientation:landscape) and (max-height:550px){.title-view .field{grid-column:1/-1}}

.brand{white-space:nowrap}nav{margin-left:auto}.title-copy{display:block;position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.title-copy h1,.title-copy>.eyebrow{visibility:visible}
@media(max-width:360px) and (orientation:portrait){.edition{display:none}.brand{font-size:21px}footer{font-size:8px;min-height:28px}}
@media(orientation:landscape) and (max-height:550px){.pad{height:156px;grid-template:repeat(3,52px)/repeat(3,52px)}.pad button{min-height:52px}.action{min-height:44px}.controls{gap:4px}.actions{gap:5px}}
@media(orientation:landscape) and (max-height:340px){header{height:44px}.hud{min-height:36px}.status-bar{min-height:20px}footer{min-height:14px;font-size:7px}footer p{margin:0}}

.field{background-size:cover;background-position:center}.title{background-color:#0b262a}@media(orientation:landscape) and (max-height:340px){header nav{align-self:flex-start}}
.title{background-size:100% 100%,contain;background-position:center,left top;background-repeat:no-repeat}
@media(max-width:700px) and (orientation:portrait){.title{background-size:100% 100%,100% auto;background-position:center,center top}}
@media(orientation:landscape) and (max-height:550px){.title{background-size:100% 100%,auto 100%;background-position:center,left center}}
.title{justify-content:flex-end}
@media(orientation:landscape) and (max-height:550px){.title{justify-content:flex-end;align-items:flex-end}}
