:root{color-scheme:dark;--ink:#e9e5d2;--muted:#aab5a4;--orange:#f1a66b;--green:#b0c59b;--dark:#1b2826;--line:#a7b99d35;--mono:'IBM Plex Mono',monospace;--sans:'Inter',system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#243834;color:var(--ink);font:13px var(--sans)}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:0;background:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--orange);outline-offset:3px}button:disabled{opacity:.4;cursor:not-allowed}button:hover:not(:disabled){color:var(--orange)}[hidden]{display:none!important}#world{position:fixed;inset:0;width:100%;height:100%;image-rendering:pixelated;outline:none;touch-action:none}.vignette{position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 140px #11211c44}#welcome{position:fixed;inset:0 auto 0 0;width:438px;padding:29px 36px 19px;background:linear-gradient(90deg,#192725fc,#192725f5 86%,#192725df);border-right:1px solid #e6e9cf1a;display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin}.brand{font:600 12px var(--mono);letter-spacing:.09em;display:flex;align-items:center;gap:12px}.brand-mark{font-size:25px;color:var(--orange);font-weight:900;letter-spacing:-.2em;padding-right:9px}.edition{margin-left:auto;font-size:8px;letter-spacing:.08em;color:#94a18e}.intro{margin:49px 0 22px}.eyebrow{font:500 8px var(--mono);letter-spacing:.09em;color:var(--green);display:flex;align-items:center;gap:8px}.live-dot{height:6px;width:6px;display:inline-block;background:var(--green);border-radius:50%;box-shadow:0 0 9px #b0c59b44;flex-shrink:0}h1{font:900 92px/.77 'Barlow Condensed','Arial Narrow',Impact,sans-serif;letter-spacing:-.025em;margin:24px 0 20px}h1>span{color:var(--orange)}h1 small{font:500 8px var(--mono);letter-spacing:.09em;display:block;margin-top:22px;color:#c4ccba}.intro p{font-size:13px;line-height:1.8;color:#b5c0ac;margin:0}#join-form{margin-top:auto}.field-label{font:500 9px var(--mono);letter-spacing:.15em;color:var(--muted);display:block;margin-bottom:9px}#player-name{width:100%;background:#10201c88;border:1px solid #c9d5bc38;border-radius:2px;padding:12px 13px;color:var(--ink);outline:none}#player-name:focus{border-color:var(--orange)}details{margin:15px 0}summary{list-style:none;cursor:pointer;font-size:12px;font-weight:600;display:flex;justify-content:space-between}summary::-webkit-details-marker{display:none}summary>span{font:8px var(--mono);letter-spacing:.06em;color:var(--muted)}summary b{font-size:13px;margin-left:12px;font-weight:400}.character-options{padding-top:12px}fieldset{border:0;padding:0;margin:0 0 12px;display:flex;align-items:center;gap:15px}legend{font:9px var(--mono);color:var(--muted);float:left;padding-top:7px;margin-right:18px}.swatches{display:flex;gap:9px}.swatch{width:24px;height:24px;border:2px solid transparent;outline:1px solid #dce4bf25;border-radius:50%;padding:0}.swatch.active{outline:2px solid var(--ink);border-color:var(--dark)}.select-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.select-row label{font:9px var(--mono);color:var(--muted)}select{width:100%;display:block;background:#263833;color:var(--ink);border:1px solid var(--line);padding:7px 4px;margin-top:5px;font-size:10px}.color-row{display:flex;justify-content:space-between;margin-top:10px}.color-row label{display:flex;align-items:center;gap:7px;font:9px var(--mono);color:var(--muted)}input[type=color]{width:24px;height:24px;padding:0;border:0;background:none;cursor:pointer}.primary{width:100%;display:flex;justify-content:space-between;padding:16px 18px;background:var(--orange);border:1px solid #ffd5a2;color:#1f2c27!important;font:700 12px var(--mono);letter-spacing:.07em;box-shadow:0 3px 0 #87583c}.primary:hover{background:#ffc38b}.primary span{font-size:19px;line-height:.7}#join-status{font:9px/1.6 var(--mono);color:var(--muted);margin:14px 0 18px}#welcome footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;padding-top:15px;font:8px var(--mono);color:#9ba992;margin-top:auto}#welcome footer button{font:8px var(--mono);padding:0}#welcome-caption{position:fixed;bottom:50px;right:45px;color:#f0eddb;text-align:right;text-shadow:0 2px 4px #15251c}#welcome-caption>span{font:10px var(--mono);letter-spacing:.1em;color:var(--orange)}#welcome-caption strong{font:600 29px 'Barlow Condensed',sans-serif;display:block;margin-top:10px}#welcome-caption p{font-size:11px;line-height:1.7;color:#d0d9c1}.panel{background:#182621ed;border:1px solid #abb89945;border-radius:4px;box-shadow:0 4px 16px #10211b22;backdrop-filter:blur(12px)}.topbar{position:fixed;left:22px;right:22px;top:20px;display:flex;align-items:flex-start;gap:16px;pointer-events:none}.topbar>*{pointer-events:auto}.survivor-vitals{width:230px;padding:12px 14px}.vital-title{display:flex;gap:8px;align-items:center;font:10px var(--mono);margin-bottom:9px}.vital-title strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}.vital-title>span:last-child{margin-left:auto;font-size:9px;color:#beccac}.meter{height:5px;background:#a2b59a1a;overflow:hidden}.meter>i{display:block;width:100%;height:100%;transition:width .2s;background:#c8947b}.food-row{display:flex;align-items:center;gap:9px;font:8px var(--mono);color:#adba9d;margin-top:9px}.food-row .meter{flex:1;height:3px}.food i{background:#a8b78a}.clock{padding:12px 16px;display:flex;gap:12px;position:absolute;left:50%;transform:translateX(-50%);min-width:168px;align-items:center}.clock>span{font-size:24px;color:var(--orange)}.clock strong{display:block;font:600 14px var(--mono);letter-spacing:.09em}.clock div>span{display:block;font:8px var(--mono);color:var(--muted);margin-top:4px}.cycle-track{position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#c89c68 50%,#7b6d83 55%,#4d637a 95%,#c89c68)}.cycle-track i{position:absolute;width:4px;height:4px;top:-1px;background:#f5ead4}.tools{margin-left:auto;display:flex;align-items:center;gap:6px;flex-wrap:wrap;max-width:370px;justify-content:flex-end}.tools button{font:9px var(--mono);background:#182621e8;border:1px solid #abb89935;border-radius:3px;padding:11px 10px}kbd{font:8px var(--mono);color:#bac4ae;border:1px solid #a6b69630;padding:2px 4px;border-radius:2px;white-space:nowrap}.tools kbd{margin-left:7px}.online-pill{width:100%;text-align:right;font:8px var(--mono);letter-spacing:.07em;color:#dde4c5;text-shadow:0 1px 4px #142920;padding:0 4px 5px}#objectives{position:fixed;top:132px;left:22px;width:230px;padding:0 12px 8px}#objectives-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;font:8px var(--mono);letter-spacing:.05em;color:var(--orange);padding:12px 0 8px}#objectives-toggle b{font-size:16px;font-weight:400}.objective{display:flex;gap:9px;padding:7px 0;font-size:10px;line-height:1.5;color:#d2d8c2}.objective::before{content:'◇';color:#819c81;font:14px var(--mono)}.objective.done{color:#94aa8c}.objective.done::before{content:'✓';color:var(--green)}#location{position:fixed;left:24px;bottom:32px;display:flex;flex-direction:column;gap:6px;text-shadow:0 2px 3px #1f2f24;pointer-events:none}#layer-name{font:500 11px var(--mono);letter-spacing:.06em}#depth-label{font:8px var(--mono);color:#c5ceb6}#target-info{position:fixed;pointer-events:none;background:#17251ff2;border:1px solid #b3bc9755;padding:6px 9px;border-radius:2px;max-width:190px;font:9px/1.5 var(--mono);display:none}#toast{position:fixed;top:105px;left:50%;transform:translateX(-50%) translateY(-7px);max-width:450px;text-align:center;background:#e5e2cffa;color:#26382c;border:1px solid #f1f0db;font:10px/1.6 var(--mono);padding:10px 18px;border-radius:3px;opacity:0;pointer-events:none;transition:.16s}#toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}#connection{position:fixed;top:90px;right:22px;background:#b46845;padding:8px 12px;border-radius:3px;font:10px var(--mono)}.bottom-controls{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;max-width:calc(100vw - 36px)}#mode-switch{padding:4px;display:flex;gap:2px}#mode-switch button{padding:8px 14px;font:9px var(--mono);border-radius:2px;white-space:nowrap}#mode-switch kbd{margin-left:7px}#mode-switch .active{background:#b7c899;color:#182b22}#mode-switch .active kbd{color:#355335;border-color:#37562c44}#hotbar{display:flex;padding:5px;gap:4px;max-width:100%;overflow-x:auto;scrollbar-width:none}.slot{position:relative;min-width:56px;width:56px;height:58px;border:1px solid #9db78e27;background:#9db78e07;border-radius:2px;display:flex;align-items:center;justify-content:center;padding:0}.slot.active{border-color:#f0b681;background:#d99d6922;box-shadow:inset 0 0 0 1px #e8ad6c44}.slot canvas{width:30px;height:30px;image-rendering:pixelated;margin-top:-5px}.slot .num{position:absolute;left:4px;top:3px;font:8px var(--mono);color:#b7c2a1}.slot .count{position:absolute;right:4px;top:4px;font:8px var(--mono);color:#e1cfaa}.slot .name{position:absolute;bottom:4px;left:2px;right:2px;font:7px var(--mono);text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.control-hint{display:flex;gap:20px;font:8px var(--mono);color:#c3cdb1;text-shadow:0 2px 3px #102b16;white-space:nowrap}.control-hint b{color:#e4e6ca;font-weight:500}#drawer{position:fixed;right:22px;top:100px;width:370px;max-height:calc(100dvh - 125px);display:flex;flex-direction:column;z-index:5}.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:22px 22px 17px;border-bottom:1px solid var(--line)}#drawer-kicker{font:8px var(--mono);letter-spacing:.12em;color:var(--orange)}h2{font:700 35px/1 'Barlow Condensed',sans-serif;margin:7px 0 0}.drawer-head button{font-size:28px;color:#9daf97;padding:5px}#drawer-body{overflow:auto;padding:18px 20px 25px;scrollbar-width:thin}.tabs{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:15px}.tabs button{font:9px var(--mono);padding:7px 9px;border:1px solid var(--line);border-radius:2px}.tabs button.active{background:#a7be8c;color:#21352a}.drawer-note{font-size:11px;line-height:1.7;color:#acbea0;margin:0 0 15px}.inventory-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.inventory-item{background:#859d7b0a;border:1px solid #a3b78e29;border-radius:3px;padding:10px 6px;display:flex;align-items:center;flex-direction:column;gap:7px;font-size:9px;min-height:88px}.inventory-item canvas{image-rendering:pixelated;width:28px;height:28px}.inventory-item span{line-height:1.4;text-align:center}.inventory-item b{font:9px var(--mono);color:#b5c5a4}.recipe{padding:13px 0;border-bottom:1px solid var(--line)}.recipe-top{display:flex;gap:10px;align-items:center}.recipe canvas{width:28px;height:28px;image-rendering:pixelated}.recipe-name{font-weight:600;font-size:11px;flex:1}.recipe small{display:block;font:8px var(--mono);color:#a5b895;margin-top:5px}.recipe .make{font:9px var(--mono);background:#a9bf8f;color:#233324;border-radius:2px;padding:8px 10px}.costs{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.costs span{background:#a5b28d11;padding:4px 6px;border:1px solid #a5b28d1f;border-radius:2px;font:8px var(--mono);color:#b4c6a1}.costs span.missing{color:#d1947d;border-color:#d1947d30}.recipe p{font-size:10px;line-height:1.6;color:#a9b99b;margin:9px 0 0}.note-card{border-left:2px solid #a1b78b;padding:2px 0 4px 13px;margin:19px 0}.note-card h3{font:600 12px var(--sans);margin:0 0 7px}.note-card p{font:11px/1.7 var(--sans);margin:0;color:#aebca1}.note-card small{font:8px var(--mono);color:var(--orange);display:block;margin-bottom:7px}.pet-card{border:1px solid var(--line);padding:14px;margin-bottom:10px;border-radius:3px}.pet-card h3{margin:0 0 6px;font-size:13px}.pet-card p{font-size:10px;line-height:1.6;color:#b3c1a5}.pet-card button{font:9px var(--mono);padding:8px;background:#aabd91;color:#233124}dialog{max-width:620px;width:calc(100% - 32px);max-height:calc(100dvh - 32px);border:1px solid #bac8a269;border-radius:5px;padding:35px;background:#203027;color:var(--ink);box-shadow:0 15px 90px #07171088;scrollbar-width:thin}dialog::backdrop{background:#102318aa;backdrop-filter:blur(6px)}dialog>p{font-size:12px;line-height:1.8;color:#bdc8ae;margin-top:20px}dialog h2{font-size:42px;margin-top:15px}.dialog-close{position:absolute;right:14px;top:9px;font-size:27px}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;margin:25px 0;font-size:10px}.help-grid kbd{margin-right:8px}.help-note{border-top:1px solid var(--line);padding-top:17px}.setting-row{display:flex;gap:25px;align-items:center;font-size:10px;flex-wrap:wrap;margin-top:25px}.setting-row label{display:flex;align-items:center;gap:9px}input[type=range]{width:110px;accent-color:#c5b078}input[type=checkbox]{accent-color:#b0c392}.help-links{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:27px}.help-links a,.help-links button{font:9px var(--mono);color:#b6c5a8;text-decoration:none}.help-links button{border:1px solid var(--line);padding:9px}#touch-controls{display:none}button,summary{-webkit-tap-highlight-color:transparent}body.playing #welcome,body.playing #welcome-caption{display:none}body:not(.playing) #world{filter:saturate(.85)}
@media(min-height:900px){.intro{margin-top:70px;margin-bottom:40px}#welcome{padding-bottom:30px}#join-form{margin-bottom:32px}}
@media(max-height:760px){#welcome{padding:20px 30px 15px;width:398px}.intro{margin:26px 0 17px}h1{font-size:78px;margin:19px 0 14px}h1 small{margin-top:18px}.intro p{font-size:11px}#join-status{margin:12px 0}.character-options{padding-top:9px}details{margin:10px 0}#welcome-caption{bottom:35px}.brand{font-size:10px}}
@media(max-width:1100px){.clock{position:relative;left:auto;transform:none}.tools{max-width:280px}.control-hint{font-size:7px;gap:10px}#location{bottom:155px}#objectives{width:200px}.survivor-vitals{width:200px}#drawer{width:340px}}
@media(max-width:720px){#welcome{width:min(380px,100%);padding:22px 24px;background:#192725ef}#welcome-caption{display:none}.intro{margin-top:24px}h1{font-size:80px}.edition{font-size:7px}.topbar{top:10px;left:10px;right:10px;gap:8px;flex-wrap:wrap}.survivor-vitals{width:164px;padding:10px}.vital-title{font-size:8px}.vital-title strong{max-width:70px;font-size:8px}.clock{min-width:128px;padding:10px}.clock strong{font-size:11px}.clock>span{font-size:18px}.tools{max-width:100%;gap:4px;flex:1;justify-content:flex-end}.tools button{font-size:8px;padding:8px}.tools kbd{display:none}.online-pill{font-size:7px}.topbar .tools{position:absolute;right:0;top:77px}.bottom-controls{bottom:12px;width:calc(100vw - 16px);gap:5px}#hotbar{width:100%;max-width:590px;justify-content:center}.slot{min-width:41px;width:calc((100vw - 70px)/9);max-width:56px;height:50px}.slot .name{font-size:6px}.slot canvas{width:25px;height:25px}#mode-switch button{padding:7px 12px;font-size:8px}#mode-switch kbd{display:none}.control-hint{display:none}#objectives{top:127px;left:10px;width:180px;padding:0 10px 6px}#objectives-toggle{font-size:7px}.objective{font-size:9px;padding:5px 0}#drawer{top:124px;right:10px;width:min(340px,calc(100vw - 20px));max-height:calc(100dvh - 138px)}#location{left:12px;bottom:110px}#layer-name{font-size:9px}#depth-label{font-size:7px}#toast{top:128px;width:calc(100vw - 30px);font-size:9px}#connection{top:105px;right:10px;font-size:8px}.help-grid{grid-template-columns:1fr;gap:11px}dialog{padding:28px 22px}dialog h2{font-size:34px}#target-info{font-size:8px}}
@media(pointer:coarse){#touch-controls{display:flex;position:fixed;left:15px;right:15px;bottom:120px;justify-content:space-between;pointer-events:none}.touch-move,.touch-actions{display:flex;gap:7px;flex-wrap:wrap;max-width:120px;pointer-events:auto}#touch-controls button{width:49px;height:43px;background:#17291bdd;border:1px solid #c5d1aa60;border-radius:5px;font:10px var(--mono);touch-action:none}#touch-controls button.pressed{background:#94ac77;color:#1f3020}#location{bottom:224px}#mode-switch{margin-bottom:0}#objectives{max-width:160px}}

/* Keep frequently used inventory and crafting text readable at game scale. */
.recipe-name{font-size:12px}.recipe p,.drawer-note{font-size:12px}.costs span,.tabs button,.recipe .make{font-size:10px}.inventory-item{font-size:10px}.slot .name{font-size:8px}.control-hint{font-size:9px}.objective{font-size:11px}.tools button{font-size:10px}#mode-switch button{font-size:10px}
@media(max-width:720px){.objective{font-size:10px}.tools button{font-size:9px}.slot .name{font-size:7px}#mode-switch button{font-size:9px}}

/* The title must fit even before the condensed webfont is available. */
h1{font-size:68px;letter-spacing:-.045em}@media(max-width:720px){h1{font-size:64px}}
/* Compact play layout: the city stays visible and primary controls remain reachable. */
button{touch-action:manipulation}#welcome{width:360px;padding:30px;justify-content:center;gap:22px}#welcome .intro{margin:12px 0}#welcome h1{font-size:65px;margin:18px 0}#welcome .intro p{font-size:15px}#join-form{margin:0}#welcome footer{margin-top:0}#join-status{font-size:11px;margin-bottom:0}.edition{display:none}#welcome .brand{flex-shrink:0}#welcome #character-details{margin:18px 0}.panel{backdrop-filter:none}.topbar{top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));gap:10px}.survivor-vitals{width:185px;padding:10px 12px}.clock{padding:9px 12px;min-width:142px}.tools{max-width:220px;gap:5px}.tools button{font:600 11px var(--sans);min-height:44px;padding:10px 12px}.online-pill{display:none}.tools kbd{display:none}#objectives{top:100px;left:14px;width:auto;max-width:235px;background:#15251dcc;padding:0 10px;box-shadow:none}#objectives-toggle{display:none}.objective{font:12px/1.4 var(--sans);padding:8px 0}#location{bottom:24px;left:16px}#depth-label{display:none}#layer-name{font-size:10px}#toast{top:88px;font:12px/1.4 var(--sans);max-width:360px;padding:9px 14px}#connection{top:70px}.bottom-controls{bottom:max(18px,env(safe-area-inset-bottom));gap:5px}.control-hint{display:none}#mode-switch button{min-height:38px;padding:8px 16px;font:600 11px var(--sans)}#mode-switch kbd{display:none}.slot{width:52px;min-width:45px;height:51px}.slot .name{display:none}.slot.active .name{display:block;font:8px var(--sans)}.slot canvas{margin-top:0}.slot.active canvas{margin-top:-5px}#drawer{top:76px;max-height:calc(100dvh - 90px);right:12px;width:370px}#drawer-kicker{display:none}.drawer-head{padding:14px 18px}h2{font-family:var(--sans);font-size:23px}#drawer-tabs{display:flex;padding:8px;gap:4px;border-bottom:1px solid var(--line)}#drawer-tabs button{flex:1;padding:10px 5px;font-size:12px;min-height:42px}#drawer-tabs button.active{background:#adc397;color:#182820;border-radius:3px}.recipe p{display:none}.recipe .make,.tabs button{min-height:40px}.inventory-item{min-height:88px}.recipe{padding:10px 0}#game-credit{position:fixed;right:12px;bottom:6px;color:#c9d2bb99;font:9px var(--mono);text-decoration:none}#touch-controls{display:none}.touch-enabled #touch-controls{display:flex;position:fixed;left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(108px,calc(env(safe-area-inset-bottom) + 95px));justify-content:space-between;align-items:center;pointer-events:none}.touch-enabled #location{display:none}.touch-enabled #touch-stick{width:124px;height:124px;border:1px solid #d7dfc94d;border-radius:50%;background:#14271c99;position:relative;pointer-events:auto;touch-action:none;user-select:none}.touch-enabled #stick-knob{position:absolute;width:52px;height:52px;border-radius:50%;left:35px;top:35px;border:2px solid #d7dfc97a;background:#8ca38099;box-shadow:0 3px 12px #0003}.stick-label{position:absolute;bottom:9px;left:0;right:0;text-align:center;font:9px var(--mono);color:#d2dcc099;pointer-events:none}.touch-enabled .touch-actions{pointer-events:auto;display:grid;grid-template-columns:58px 72px;gap:8px;max-width:none;align-items:center}.touch-enabled #touch-controls button{width:58px;height:58px;border-radius:50%;background:#17291cdd;border:1px solid #d7dfc96b;touch-action:none;font:600 12px var(--sans);user-select:none}.touch-enabled #touch-controls button small{display:block;font-size:9px}.touch-enabled #touch-controls [data-hold=jump]{font-size:23px}.touch-enabled #touch-controls #touch-act{grid-column:2;grid-row:1 / 3;width:72px;height:72px;background:#b5ca98;color:#14271b;border:2px solid #dfebc9;box-shadow:0 4px 0 #273f2b}.touch-enabled #touch-controls button.pressed{transform:scale(.93);filter:brightness(1.2)}.touch-enabled #target-info{display:none!important}.panel-open #touch-controls{visibility:hidden}.panel-open #objectives{visibility:hidden}dialog h2{font:700 26px var(--sans);margin:0 0 16px}dialog details p{font:12px/1.6 var(--sans);color:var(--muted)}.help-grid{font-size:12px;gap:16px}.help-links span{font:10px var(--mono);color:var(--muted)}#help .setting-row{font-size:12px}#help summary{min-height:42px;align-items:center}
@media(max-width:720px){#welcome{width:min(360px,100%);padding:24px;gap:20px}#welcome h1{font-size:59px}.topbar{gap:8px;flex-wrap:nowrap}.survivor-vitals{width:142px;padding:9px}.vital-title strong{max-width:64px}.vital-title .live-dot{display:none}.vital-title>span:last-child{font-size:9px}.clock{margin-left:auto;min-width:117px;padding:8px}.clock strong{font-size:11px}.clock>span{font-size:18px}.topbar .tools{top:66px;right:0;max-width:none}.tools button{min-height:44px;padding:8px 11px;font-size:11px}#objectives{top:119px;left:12px;max-width:calc(100vw - 24px)}.objective{font-size:11px;padding:6px 0}#toast{top:160px;width:auto;max-width:calc(100vw - 32px);white-space:normal}#connection{top:111px;font-size:11px}.bottom-controls{bottom:max(13px,env(safe-area-inset-bottom));max-width:calc(100vw - 24px);width:auto}#hotbar{width:auto;max-width:calc(100vw - 24px);justify-content:flex-start;gap:3px}.slot{width:44px;min-width:34px;max-width:50px;height:44px}.slot .num{display:none}.slot canvas{width:26px;height:26px}#mode-switch button{font-size:11px;padding:8px 19px;min-height:36px}#drawer{top:65px;right:8px;width:calc(100vw - 16px);max-height:calc(100dvh - 80px)}#drawer-body{padding:12px 16px 20px}.help-grid{grid-template-columns:1fr;gap:12px}}
@media(max-height:540px){#welcome{width:320px;padding:16px 24px;gap:10px;justify-content:flex-start}#welcome .brand{display:none}#welcome .intro{margin:0}#welcome h1{font-size:42px;margin:0 0 8px}#welcome h1 br{display:none}#welcome h1 br:after{content:' '}#welcome .eyebrow{display:none}#welcome .intro p{font-size:12px}#welcome #character-details{margin:10px 0}.topbar .tools{position:static;max-width:none}.online-pill{display:none}.clock{position:relative;left:auto;transform:none;margin-left:0}.tools{margin-left:auto}#objectives{top:81px;max-width:210px}#toast{top:78px}.touch-enabled #touch-controls{bottom:22px;left:24px;right:24px}.touch-enabled #touch-stick{width:110px;height:110px}.touch-enabled #stick-knob{left:28px;top:28px}.bottom-controls{bottom:10px;max-width:calc(100vw - 360px)}#hotbar{max-width:100%}#drawer{top:64px;max-height:calc(100dvh - 76px);width:370px;max-width:calc(100vw - 24px)}#location{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

h1{font-family:Impact,"Arial Narrow",sans-serif}#welcome h1{font-size:58px}.primary{min-height:52px}

/* Save access remains compact in the HUD; details stay in the drawer. */
.tools{max-width:310px}#save-status{color:#bacda7;font-size:10px;min-width:56px}#save-status.warning,.save-warning{color:#efb095}#restore{font-size:12px}#restore summary{cursor:pointer;min-height:30px}#restore-form{display:grid;gap:9px;padding-top:8px}#restore-form label{font-size:9px;color:var(--muted)}#restore-form button,.save-button{min-height:44px;background:#adc397;color:#182820;padding:10px 14px;border-radius:3px;font-size:11px;font-weight:600}.save-button{width:100%;margin:6px 0 12px}.save-detail{color:#bfd6a9;font-size:14px}.recovery-code{width:100%;font:12px var(--mono);padding:12px 8px;margin:8px 0;user-select:all}.craft-filters{display:flex;align-items:center;gap:12px;margin:8px 0 14px}.craft-filters input[type=search]{min-width:0;flex:1;padding:10px;font-size:12px}.craft-filters label{display:flex;gap:5px;align-items:center;white-space:nowrap;font-size:12px}.craft-filters input[type=checkbox]{width:auto}.recipe[hidden]{display:none}.recipe-name small{color:#c1b998}#drawer-tabs button{font-size:11px}#restore-status:empty{display:none}
@media(max-height:540px){#welcome{gap:5px}#welcome #restore{margin:0}#welcome #join-status{margin-top:6px}.tools button{padding:8px 10px}}
