/* Touch play uses measured, disjoint regions rather than controls over a map. */
.panel.name-entry{inset:20% 15%}
body.viewport-touch{--slot:44px;background:#f5f0df}
body.viewport-menu #touch{display:none!important}
body.viewport-touch #stage{background:#eef0dc}
body.viewport-touch #screen{outline:2px solid #3e4236;outline-offset:-2px}
body.viewport-touch #hud{font-family:"Gowun Dodum","Dotum",sans-serif;font-size:12px;color:#333d32}
body.viewport-touch #hud::before{content:"";position:absolute;inset:0 0 auto;height:var(--status-height);background:#fbf5e6;border-bottom:2px solid #3e4236}
body.viewport-touch #hud #source-almanac{display:none!important}
body.viewport-touch #hud #hud-almanac{display:grid!important;grid-template-columns:1fr 1fr;gap:1px 12px;left:12px;top:6px;right:64px;width:auto;height:44px;padding:0;border:0;background:none;box-shadow:none;font-size:12px}
body.viewport-touch #hud .almanac-middle{display:contents}
body.viewport-touch #hud .almanac-season{display:flex;flex-direction:row;align-items:center;gap:6px;order:2;min-width:0}
body.viewport-touch #hud #hud-clock{display:none}
body.viewport-touch #hud #hud-weather{display:block;position:static;width:18px;height:18px;line-height:18px;font-size:16px;flex:none}
body.viewport-touch #hud #hud-weather canvas{width:18px;height:18px}
body.viewport-touch #hud #hud-date,body.viewport-touch #hud #hud-time,body.viewport-touch #hud #hud-money,body.viewport-touch #hud #hud-season{border:0;padding:0;margin:0;background:none;box-shadow:none;letter-spacing:0;text-align:left;font-size:12px;line-height:20px;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
body.viewport-touch #hud #hud-date{order:0;font-weight:bold}
body.viewport-touch #hud #hud-time{order:1;text-align:right}
body.viewport-touch #hud #hud-season{order:2;color:#68704f}
body.viewport-touch #hud #hud-money{order:3;text-align:right;font-weight:bold;color:#6d4d2b}
body.viewport-touch #hud #hud-menu{right:10px;top:6px;width:44px;height:44px;min-height:44px;padding:0;border:2px solid #3e4236;background:#e7e3ff;box-shadow:2px 2px #3e4236;font:700 11px sans-serif;border-radius:8px}
body.viewport-touch #hud #hud-menu::after{content:"가방";font-size:10px;display:block}
body.viewport-touch #hud #hud-location{left:12px;top:57px;right:auto;max-width:calc(100% - 188px);padding:0;border:0;background:none;color:#60694e;text-shadow:none;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.viewport-touch #hud #hud-energy,body.viewport-touch #hud #hud-health{right:12px;top:60px;bottom:auto;width:74px;height:12px;display:flex;align-items:center;gap:4px;color:#43523d;text-shadow:none;font-size:9px}
body.viewport-touch #hud #hud-health{right:94px}
body.viewport-touch #hud .energy-tube,body.viewport-touch #hud .health-tube{width:60px;height:12px;flex:none;padding:1px;border:1px solid #49563b;box-shadow:none;background:#e1d9bf}
body.viewport-touch #hud .energy-fill,body.viewport-touch #hud .health-fill{left:1px;right:1px;bottom:1px;max-height:calc(100% - 2px);border:0;box-shadow:none}
body.viewport-touch #hud #hud-tool,body.viewport-touch #hud.belt-raised #hud-tool{left:calc(var(--game-left) - var(--viewport-left));top:calc(var(--belt-top) - var(--viewport-top));bottom:auto;transform:none;width:var(--game-width);height:var(--belt-height);display:flex;align-items:center;gap:3px;overflow-x:auto;overflow-y:hidden;padding:6px 8px;border:0;border-image:none;border-top:2px solid #3e4236;border-bottom:2px solid #3e4236;background:#fbf5e6;box-shadow:none;scrollbar-width:thin;scrollbar-color:#9c9a7c transparent;touch-action:pan-x;overscroll-behavior-x:contain;scroll-snap-type:x proximity}
body.viewport-touch #hud .tool-slot{width:44px;height:44px;min-width:44px;min-height:44px;scroll-snap-align:start;border:0;padding:5px;flex:none}
body.viewport-touch #hud .tool-slot.selected{outline-width:2px;outline-offset:-1px}
body.viewport-touch #hud #hud-tool-name,body.viewport-touch #hud.belt-raised #hud-tool-name{left:auto;right:12px;top:calc(var(--belt-top) - var(--viewport-top) - 19px);bottom:auto;transform:none;max-width:140px;font:11px "Gowun Dodum",sans-serif;color:#5b664b;text-shadow:none;background:#f5f0df;padding:1px 5px;display:none}
body.viewport-touch #touch{position:fixed;inset:auto;left:var(--touch-left);top:var(--touch-top);width:var(--touch-width);height:var(--touch-height);background:none;border:0;box-shadow:none;z-index:4}
body.viewport-touch #touch>*{touch-action:none}
body.viewport-touch #pad{border:2px solid #46513d;background:#dce6c2;border-radius:28px;box-shadow:3px 4px #46513d}
body.viewport-touch #pad:before,body.viewport-touch #pad:after{background:#b8c99d}
body.viewport-touch #pad:before{left:calc(50% - 12px);top:12px;bottom:12px;width:24px}
body.viewport-touch #pad:after{top:calc(50% - 12px);left:12px;right:12px;height:24px}
body.viewport-touch #pad-knob{width:44px;height:44px;margin:-22px 0 0 -22px;border:2px solid #46513d;border-radius:15px;background:#f6f3df;box-shadow:2px 3px #46513d}
body.viewport-touch .tbtn{border:2px solid #46513d;border-radius:15px;background:#e5dfff;color:#3d4437;text-shadow:none;box-shadow:3px 4px #46513d;font-family:"Gowun Dodum",sans-serif;font-size:15px;font-weight:bold;padding:4px;min-height:44px}
body.viewport-touch .tbtn.down{background:#d6e7a2;box-shadow:1px 1px #46513d;transform:translate(2px,2px)}
body.portrait-touch #touch{background:#f5f0df;border-top:0}
body.portrait-touch #pad{left:14px;top:calc(50% - 58px);bottom:auto;width:116px;height:116px}
body.portrait-touch #btn-a,body.portrait-touch #btn-b{top:15px;bottom:auto;width:64px;height:58px}
body.portrait-touch #btn-a{left:auto;right:14px}
body.portrait-touch #btn-b{left:auto;right:88px;background:#eadcb8}
body.portrait-touch #btn-x,body.portrait-touch #btn-y{left:auto;top:auto;bottom:15px;width:64px;height:44px;font-size:11px}
body.portrait-touch #btn-x{right:14px}
body.portrait-touch #btn-y{right:88px}
body.portrait-touch[data-viewport-compact=true] #pad{width:96px;height:96px;top:calc(50% - 48px)}
body.portrait-touch[data-viewport-compact=true] #btn-a,body.portrait-touch[data-viewport-compact=true] #btn-b{top:10px;height:44px}
body.portrait-touch[data-viewport-compact=true] #btn-x,body.portrait-touch[data-viewport-compact=true] #btn-y{bottom:10px;height:44px}
body.landscape-touch #touch::before,body.landscape-touch #touch::after{content:"";position:absolute;top:0;bottom:0;width:var(--rail-width);background:#f5f0df;pointer-events:none}
body.landscape-touch #touch::before{left:0;border-right:2px solid #3e4236}
body.landscape-touch #touch::after{right:0;border-left:2px solid #3e4236}
body.landscape-touch #touch>*{z-index:1}
body.landscape-touch #pad{left:calc((var(--rail-width) - 96px)/2);top:calc(50% - 48px);bottom:auto;width:96px;height:96px}
body.landscape-touch #btn-a,body.landscape-touch #btn-b{left:auto;right:calc((var(--rail-width) - 72px)/2);width:72px;height:62px;bottom:auto}
body.landscape-touch #btn-a{top:calc(50% - 70px)}
body.landscape-touch #btn-b{top:calc(50% + 8px);background:#eadcb8}
body.landscape-touch #btn-x,body.landscape-touch #btn-y{left:calc((var(--rail-width) - 80px)/2);right:auto;width:80px;height:44px;font-size:11px}
body.landscape-touch #btn-x{top:9px;bottom:auto}
body.landscape-touch #btn-y{top:auto;bottom:9px}
body.landscape-touch #hud #hud-almanac{grid-template-columns:1fr 1fr 1fr 1fr;height:24px;right:72px;gap:12px;top:7px}
body.landscape-touch #hud #hud-season{order:1}
body.landscape-touch #hud .almanac-season{order:1}
body.landscape-touch #hud #hud-time{order:2;text-align:center}
body.landscape-touch #hud #hud-location{top:36px;max-width:calc(100% - 250px)}
body.landscape-touch #hud #hud-energy,body.landscape-touch #hud #hud-health{top:38px;right:80px}
body.landscape-touch #hud #hud-health{right:164px}
body.viewport-touch #stage .tutorial{left:var(--game-left);right:auto;top:var(--help-top);bottom:auto;width:var(--game-width);height:var(--help-height);max-width:none;max-height:var(--help-height);margin:0;padding:6px 48px 6px 12px;border:0;border-top:1px solid #c6c9ac;box-shadow:none;background:#eef0dc;color:#4b563c;font-size:11px;line-height:1.5;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;z-index:2}
body.viewport-touch .tutorial .tut-off{right:0;top:0;width:44px;height:44px;min-height:44px;padding:0;font-size:16px}
body.viewport-touch .tutorial .tut-step{font-size:10px;color:#656c4e}
body.landscape-touch .tutorial .tut-step{display:inline;margin-right:8px}
body.landscape-touch .tutorial .tut-text{display:inline}
body.viewport-touch.ui-modal #touch{display:none!important}
body.viewport-touch.ui-modal #hud,body.viewport-touch.ui-modal .tutorial{visibility:hidden}
/* Menus scroll inside the safe visual viewport, including when the keyboard opens. */
body.viewport-touch #ui .panel{inset:auto 12px;left:12px;right:12px;top:50%;bottom:auto;transform:translateY(-50%);width:calc(100% - 24px);height:auto;max-height:calc(100% - 24px);min-width:0;margin:0;padding:14px 12px;border-width:16px;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;font-size:15px}
body.viewport-touch #ui .panel .close{left:auto;right:0;top:0;width:44px;height:44px;min-width:44px;min-height:44px;line-height:40px;z-index:5;font-size:24px}
body.viewport-touch #ui .panel button,body.viewport-touch #ui .panel [role=button],body.viewport-touch #ui .box .choice{min-height:44px;min-width:44px}
body.viewport-touch #ui .panel input{min-height:44px;font-size:16px;max-width:100%}
body.viewport-touch #ui .farm-menu{inset:12px;left:12px;right:12px;top:12px;bottom:12px;transform:none;width:calc(100% - 24px);height:calc(100% - 24px);max-height:none;padding:62px 4px 28px;overflow:hidden}
body.viewport-touch #ui .farm-menu .menu-tabs{left:0;top:0;right:44px;max-width:calc(100% - 44px);height:56px;gap:2px;overflow-x:auto;overflow-y:hidden;display:flex;touch-action:pan-x;scrollbar-width:thin}
body.viewport-touch #ui .farm-menu .menu-tab{flex:none;width:44px;height:48px;min-width:44px;min-height:44px;padding:0}
body.viewport-touch #ui .farm-menu .menu-tab canvas{width:40px;height:40px}
body.viewport-touch #ui .farm-menu .menu-content{height:100%;padding:4px;min-width:0;overflow-x:hidden;overflow-y:auto;touch-action:pan-y}
body.viewport-touch #ui .inventory-grid,body.viewport-touch #ui .coop-inventory{grid-template-columns:repeat(auto-fit,minmax(44px,1fr));gap:2px}
body.viewport-touch #ui .panel .bag-slot,body.viewport-touch #ui .panel button.coop-slot{min-height:44px;min-width:44px;aspect-ratio:1}
body.viewport-touch #ui .bag-profile{min-width:0;gap:10px;flex-wrap:wrap}
body.viewport-touch #ui .bag-avatar{width:64px;height:96px}
body.viewport-touch #ui .bag-identity{min-width:0}
body.viewport-touch #ui .bag-stats{min-width:0;flex-wrap:wrap}
body.viewport-touch #ui .bag-identity h2{overflow-wrap:anywhere}
body.viewport-touch #ui .box{left:12px;right:12px;bottom:12px;top:auto;width:auto;max-height:calc(100% - 24px);min-height:0;padding:14px;border-width:16px;font-size:16px;line-height:1.6;overflow:auto;overscroll-behavior:contain;touch-action:pan-y}
body.viewport-touch #ui .box.has-face{padding-right:108px;min-height:160px}
body.viewport-touch #ui .box .face{right:0;top:0;width:88px;height:88px}
body.viewport-touch #ui .box .who{right:0;bottom:8px;width:90px;font-size:12px}
body.viewport-touch #ui .box .choices{gap:6px}
body.viewport-touch #ui .box .choice{padding:6px 10px}
body.viewport-touch #ui .toast{left:12px;right:12px;bottom:12px;max-width:none;font-size:13px}
body.viewport-touch #ui .panel.fishing-panel{width:min(210px,calc(100% - 24px));left:50%;right:auto;transform:translate(-50%,-50%);padding:10px;overflow:auto}
body.viewport-touch #ui .fishing-track{height:clamp(110px,calc(var(--viewport-height) - 240px),280px)}
body.viewport-touch #ui .panel.fishing-panel .fishing-cancel{min-height:44px}
/* The native ten/twelve-column sheets need real touch cells, not scaled-down targets. */
body.viewport-touch #ui .sm-crafting-upper{grid-template-columns:minmax(0,1fr) 44px;gap:6px;max-width:none}
body.viewport-touch #ui .sm-recipe-grid{grid-template-columns:repeat(auto-fit,minmax(44px,1fr));grid-template-rows:none;grid-auto-rows:44px;gap:4px;aspect-ratio:auto;width:100%;height:auto;max-width:none;min-width:0}
body.viewport-touch #ui .sm-recipe-grid .sm-craft-icon{grid-column:auto!important;grid-row:auto!important;min-width:44px;min-height:44px;height:44px;transform:none}
body.viewport-touch #ui .sm-craft-icon .sm-item-image{width:100%;height:100%;max-height:44px;object-fit:contain}
body.viewport-touch #ui .sm-craft-inventory{grid-template-columns:repeat(auto-fit,minmax(44px,1fr));grid-template-rows:none;grid-auto-rows:auto;gap:2px;aspect-ratio:auto;height:auto;max-width:none}
body.viewport-touch #ui .sm-craft-inventory .sm-inventory-slot{width:100%;height:auto;min-width:44px;min-height:44px;aspect-ratio:1;padding:3px}
body.viewport-touch #ui .sm-craft-navigation .sm-page-arrow{width:44px;height:44px;min-width:44px;min-height:44px}
body.viewport-touch #ui .sm-craft-navigation{gap:10px;justify-content:space-between}
body.viewport-touch #ui .sm-page-count{font-size:10px}
body.viewport-touch #ui .sm-skills-upper{grid-template-columns:minmax(0,1fr);gap:12px}
body.viewport-touch #ui .sm-person{display:grid;grid-template-columns:64px minmax(0,1fr);gap:4px 12px;align-items:center;text-align:left}
body.viewport-touch #ui .sm-person-portrait{grid-row:1 / span 3;width:64px;height:96px}
body.viewport-touch #ui .sm-skill-row{grid-template-columns:32px 20px minmax(0,1fr) 20px;gap:5px;min-height:44px}
body.viewport-touch #ui .sm-bars{display:grid;grid-template-columns:repeat(2,minmax(44px,1fr));gap:4px;align-items:center}
body.viewport-touch #ui .sm-level-strip{grid-column:1 / -1;width:100%;height:auto;min-height:12px;object-fit:contain}
body.viewport-touch #ui .sm-bars .sm-profession-hit{position:static!important;left:auto!important;top:auto!important;bottom:auto!important;width:100%!important;height:auto;min-width:44px;min-height:44px;padding:4px;background:#ead09c;border:1px solid #b1844d;border-radius:4px;font-size:10px;line-height:1.3;overflow-wrap:anywhere}
body.viewport-touch #ui .sm-profession-hit::after{content:attr(aria-label)}
.coop-chat-open{display:none}
body.viewport-touch .coop-bar{position:fixed;left:var(--game-left);top:calc(var(--viewport-top) + var(--status-height));bottom:auto;right:auto;width:var(--game-width);height:var(--coop-height);margin:0;padding:3px 8px;border:0;border-bottom:2px solid #c6c9ac;box-shadow:none;background:#fbf5e6;color:#46513d;display:flex;align-items:center;gap:8px;font-size:11px;z-index:3}
body.viewport-touch .coop-bar .coop-status{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.viewport-touch .coop-bar .coop-bar-controls{display:flex;flex:none;gap:5px;margin:0}
body.viewport-touch .coop-bar .coop-bar-controls button{min-width:44px;min-height:44px;padding:4px 7px;font-size:11px;border:1px solid #6d7559;border-radius:8px;background:#edf0d7}
body.viewport-touch .coop-bar .coop-chat-open{display:block;background:#e7e3ff}
body.viewport-touch .coop-bar>.coop-chat-log,body.viewport-touch .coop-bar>.coop-chat-form{display:none}
body.viewport-touch.ui-modal .coop-bar{display:none!important}
body.viewport-touch #ui .coop-chat-messages{max-height:min(44vh,320px);overflow:auto;overflow-wrap:anywhere;padding:8px;background:#fff9e8;border:1px solid #c6c9ac;touch-action:pan-y}
body.viewport-touch #ui .coop-chat-form{display:flex;gap:6px;margin-top:10px}
body.viewport-touch #ui .coop-chat-form input{min-width:0;flex:1;width:0}
@media(max-width:360px){body.portrait-touch #pad{width:104px;height:104px;top:calc(50% - 52px)}body.viewport-touch #ui .panel{padding-left:6px;padding-right:6px}body.viewport-touch #ui .box.has-face{padding-right:82px}body.viewport-touch #ui .box .face{width:66px;height:66px}body.viewport-touch #ui .box .who{width:66px}}
@media(prefers-reduced-motion:reduce){body.viewport-touch .box .more{animation:none}body.viewport-touch .toast{animation:none}}
