#mobile-controls{display:none}.browser-start{position:relative!important;margin:10vh auto!important;max-width:440px;width:calc(100% - 32px);box-sizing:border-box}.browser-start p{line-height:1.7;font-size:14px}.browser-start h1{font-size:26px}
body.touch-game{overscroll-behavior:none}body.touch-game #rpg.classic-shell{display:block;height:100dvh;padding-bottom:190px;border-width:3px}body.touch-game #rpg .world{height:100%;width:100%;position:relative}body.touch-game #rpg-world{touch-action:none}body.touch-game #rpg #right-panel{display:none;position:absolute;inset:8px 8px 190px auto;width:min(280px,85%);z-index:25;overflow:auto}body.touch-game #rpg.mobile-menu-open #right-panel{display:flex}body.touch-game #rpg .bottom-line{display:none}body.touch-game #rpg #chat-panel{position:absolute;bottom:190px;left:0;width:100%;height:0;border:0;overflow:visible;z-index:4}body.touch-game #chat-history,body.touch-game #chat-form,body.touch-game .chat-tabs{display:none!important}body.touch-game #rpg .combat-toolbar{position:absolute;bottom:0;left:0;right:0;width:100%;background:#241d17e8;padding:3px;display:flex;flex-wrap:wrap}body.touch-game #rpg #skills{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));flex-basis:100%;gap:2px}body.touch-game #rpg #skills button{min-width:0;height:36px;padding:2px}body.touch-game #rpg #skills .content-art{width:28px;height:28px}body.touch-game #rpg .combat-toolbar>button{min-height:30px;font-size:11px}body.touch-game #rpg #status{position:absolute;bottom:146px;left:0;right:0;height:44px;padding:3px;display:flex;align-items:center;gap:8px;z-index:5}body.touch-game #status .hud-name,body.touch-game #status .hud-coordinates,body.touch-game #status .coordinates{display:none}body.touch-game #status .vitals{flex:1}body.touch-game #status .hud-money{font-size:11px}body.touch-game #rpg #dialog{position:fixed;inset:5px 5px 150px;z-index:30;padding:4px}body.touch-game #rpg #message{bottom:100px}body.touch-game #rpg #tutorial-guide{bottom:100px;max-width:calc(100% - 10px)}body.touch-game #rpg .world>.journal-fold{max-width:180px;max-height:115px;font-size:11px}
body.touch-game #mobile-controls{display:grid;grid-template-columns:145px 1fr;grid-template-rows:38px 102px;position:absolute;bottom:0;left:0;right:0;padding:3px max(4px,env(safe-area-inset-right)) max(3px,env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left));background:#211a14;z-index:40;touch-action:none;user-select:none;box-sizing:border-box;height:146px;gap:2px}#mobile-controls button{min-height:38px;padding:4px;font:14px 'Malgun Gothic',sans-serif;touch-action:none;background:linear-gradient(#735939,#423322);color:#fff1cf;border:1px solid #bd985e;border-radius:7px}#mobile-controls button:active{background:#ab793b}.mobile-menus{grid-column:1/-1;display:flex;gap:3px}.mobile-menus button{flex:1}.touch-pad{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:3px}.touch-pad button:first-child{grid-column:2}.touch-pad button:nth-child(2){grid-column:1;grid-row:2}.touch-pad button:nth-child(3){grid-column:2;grid-row:2}.touch-pad button:nth-child(4){grid-column:3;grid-row:2}.touch-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}.touch-actions [data-touch-key=Space]{background:linear-gradient(#a45533,#613122)}body.touch-game input{font-size:16px!important}@media(orientation:landscape) and (max-height:600px){body.touch-game #rpg.classic-shell{padding-bottom:130px}body.touch-game #mobile-controls{height:96px;grid-template-columns:185px 1fr;grid-template-rows:32px 58px}.touch-pad{grid-template-columns:repeat(4,1fr);grid-template-rows:1fr}.touch-pad button{grid-column:auto!important;grid-row:auto!important}.touch-actions{grid-template-columns:repeat(6,1fr)}#mobile-controls button{min-height:30px;font-size:12px}body.touch-game #rpg #status{bottom:96px;height:34px}body.touch-game #rpg #chat-panel{bottom:130px}body.touch-game #rpg #dialog{bottom:100px}body.touch-game #rpg #right-panel{bottom:130px}}

body.touch-game #rpg #status .vitals{display:grid;grid-template-columns:1fr 1fr;gap:4px;min-width:0}body.touch-game #rpg #status .vitals>span{height:20px;min-height:20px;font-size:10px;padding:1px 4px}body.touch-game #rpg #status .vitals b{font-size:10px}body.touch-game #rpg #status .hud-money{margin:0;max-width:105px;font-size:10px}body.touch-game #rpg #status .hud-exp{display:none}body.touch-game #rpg .combat-toolbar #skills{margin:0}body.touch-game #rpg .combat-toolbar>button{height:28px;min-height:28px}body.touch-game #rpg #skills button{height:32px}body.touch-game #rpg .combat-toolbar #auto-skills{margin-left:auto}

body.touch-game #rpg.classic-shell{padding-bottom:calc(190px + env(safe-area-inset-bottom,0px))}body.touch-game #mobile-controls{height:calc(146px + env(safe-area-inset-bottom,0px))}body.touch-game #rpg #status{bottom:calc(146px + env(safe-area-inset-bottom,0px))}body.touch-game #rpg #chat-panel{bottom:calc(190px + env(safe-area-inset-bottom,0px))}body.touch-game #rpg #dialog{bottom:calc(150px + env(safe-area-inset-bottom,0px))}@media(orientation:landscape) and (max-height:600px){body.touch-game #rpg.classic-shell{padding-bottom:calc(130px + env(safe-area-inset-bottom,0px))}body.touch-game #mobile-controls{height:calc(96px + env(safe-area-inset-bottom,0px))}body.touch-game #rpg #status{bottom:calc(96px + env(safe-area-inset-bottom,0px))}body.touch-game #rpg #chat-panel{bottom:calc(130px + env(safe-area-inset-bottom,0px))}body.touch-game #rpg #dialog{bottom:calc(100px + env(safe-area-inset-bottom,0px))}}
/* Phone login and controls show only actionable content. */
body.browser-game #account-gate:not(.character-gate){display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;min-height:100dvh}
body.browser-game .login-title,body.browser-game .login-footer,body.browser-game .character-roster footer>p{display:none}
body.browser-game .login-card{position:relative;margin:auto;width:min(380px,100%);max-width:100%;padding:22px;box-sizing:border-box}
body.browser-game .login-card-top{font-size:20px}body.browser-game .login-card h2{margin:12px 0}
body.browser-game .login-card input{font-size:16px}body.browser-game .local-account-note{font-size:12px;line-height:1.6}
body.touch-game kbd,body.touch-game #potion,body.touch-game .menu-caption,body.touch-game .side-brand{display:none!important}
.sync-error{position:fixed;inset:0;z-index:10000;background:#100d09ed;display:grid;place-items:center;padding:20px;color:#ffebbd}.sync-error section{max-width:360px;text-align:center}.sync-error button{padding:12px 24px;font-size:16px}
#online-status{position:absolute;right:8px;top:8px;padding:5px 9px;border:1px solid #a78c58;background:#17231fdc;color:#d3efd8;font-size:12px;pointer-events:none;z-index:4}
#online-chat:not([hidden]){display:grid;grid-template-columns:1fr auto;gap:6px;position:fixed;z-index:90;inset:15% 5% 22%;max-width:500px;margin:auto;padding:14px;background:#211b14f7;color:#ffedc9;border:2px solid #b59456;box-shadow:0 8px 30px #0009}#online-chat header{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center}.online-chat-log{grid-column:1/-1;overflow:auto;min-height:90px;max-height:45vh}.online-chat-log p{font-size:13px;overflow-wrap:anywhere}#online-chat input{min-width:0;font-size:16px;padding:10px}#online-chat button{padding:8px;font-size:14px}body.touch-game #online-status{top:auto;bottom:82px}
#online-chat:not([hidden]){grid-template-columns:minmax(0,1fr) 70px;grid-template-rows:40px minmax(0,1fr) 44px;grid-template-areas:"heading heading" "history history" "entry send"}#online-chat>header{grid-area:heading;position:static;inset:auto;height:auto;margin:0;padding:0;border:0;background:none}#online-chat>.online-chat-log{grid-area:history;min-height:0;max-height:none;padding:8px;background:#100e0b80;border:1px solid #6c583b}#online-chat>input{grid-area:entry;height:44px;box-sizing:border-box;background:#17130f;color:#ffedc9;border:1px solid #a98b54}#online-chat>button[type=submit]{grid-area:send;height:44px;padding:6px}#online-chat>header button{height:34px;padding:4px 10px}

/* Portrait journal cards need room for tool and timing instructions. */
@media (max-width:600px){body.touch-game .life-skill-grid{grid-template-columns:minmax(0,1fr)}body.touch-game .life-book{word-break:keep-all;overflow-wrap:break-word}body.touch-game .life-heading h2{font-size:17px}body.touch-game .life-heading{gap:8px}}

/* Keep both potion types within reach without adding another control row. */
body.touch-game #mobile-controls{grid-template-columns:minmax(112px,36%) minmax(0,1fr)}.touch-actions{grid-template-columns:repeat(4,minmax(0,1fr))}.touch-actions [data-touch-key=Space]{grid-column:span 2}#mobile-controls [data-action=mana-potion]{background:linear-gradient(#355879,#243b59)}#mobile-controls [data-touch-key=KeyR]{background:linear-gradient(#78443f,#4e2d2b)}
@media(orientation:landscape) and (max-height:600px){body.touch-game #mobile-controls{grid-template-columns:185px minmax(0,1fr)}.touch-actions{grid-template-columns:repeat(7,minmax(0,1fr))}.touch-actions [data-touch-key=Space]{grid-column:auto}}

.server-roster{position:relative;z-index:3;max-width:650px;margin:8vh auto;padding:28px;background:#241d16ed;border:2px solid #c6a365;color:#f9e5bd}.server-list{display:grid;gap:18px;margin:24px 0}.server-roster button{min-height:48px;padding:12px;color:#ffe7b5;background:#483622;border:1px solid #b59258}.channel-dialog{max-width:min(540px,92vw);box-sizing:border-box;background:#261f18;color:#ffe6bd;border:2px solid #bc9655;padding:20px}.channel-dialog::backdrop{background:#0008}.channel-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #746040}.channel-dialog button{min-width:80px;min-height:44px;color:#ffe6bd;background:#503c27;border:1px solid #ad8952}.channel-dialog button:disabled{opacity:.5}.server-roster button:disabled{opacity:.5}@media(max-width:600px){.server-roster{margin:4vh 12px;padding:16px}.channel-row{font-size:13px}.channel-dialog{width:94vw;padding:12px}}

body.browser-game .login-card nav{display:flex;gap:8px;margin:12px 0}body.browser-game .login-card nav button{flex:1;min-height:44px}

/* Keep three-syllable menu labels readable on narrow phones. */
body.touch-game #mobile-controls .mobile-menus button{min-width:0;white-space:nowrap;padding-inline:2px;font-size:clamp(11px,3.25vw,14px)}

/* Reserve a separate line above channel status for transient messages. */
body.touch-game #rpg #message{bottom:120px}