/* Native-resolution text; pixel-art upscaling is limited to the world artwork. */
.world-text{position:absolute;pointer-events:none;image-rendering:auto!important}
:root{--dock:116px;--text:#fff4df;--text-muted:#c9d7cf}
body{color:var(--text);font-family:system-ui,-apple-system,"Noto Sans KR","Malgun Gothic",sans-serif}
button,input,select,textarea{line-height:1.4}button{font-weight:600}
button:disabled{opacity:1;color:#c1c9c8;filter:grayscale(1);cursor:not-allowed}
kbd{opacity:1!important;font-weight:600}
small{font-size:12px}
input::placeholder{color:#b5c4bf!important;opacity:1}
input:focus-visible,select:focus-visible,button:focus-visible{outline:3px solid #ffe4a8;outline-offset:2px}
.lobby-card input,#bottom-bar #chat-input{font-size:16px}
#modal-body{color:#e1e8de;font-size:14px;line-height:1.65}
#modal-body p,.lobby-note,.bag-description{overflow-wrap:anywhere}
.muted,.item-card small{color:var(--text-muted)}.good{color:#b8efad}.bad{color:#ffbca8}
#modal{background-color:#10191b}
.lobby-card{background:#101f1f}.lobby-note,.lobby-card small,.lobby-switch,.lobby-footer,.lobby-chapter{color:var(--text-muted)}
.lobby-brand p{color:#d8e4dc}.lobby-card label{font-weight:600}
.lobby-card input{background:#071314;border-color:#809789}
.lobby-screen .lobby-primary{color:#fff1ce;text-shadow:0 1px 2px #000}
#modal-body button:not(.bag-flat):not(.bag-slot),.tools button,#interact{color:#fff5df;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000,0 2px 3px #000}
#hud .tools button{min-width:58px;min-height:36px;font-size:14px;padding:7px 9px}
#network-debug{top:56px;font-size:12px;line-height:1.3;background:#061117;gap:9px;color:#d1e4dc}#network-debug b{color:#fff0c8}
#minimap-panel{background:#08151b;width:210px}
#minimap-panel header{height:30px}#zone{font-size:14px;font-weight:700}
#minimap-panel #online{font-size:12px;color:#d7e4dc}#minimap-panel #map-btn{height:30px;min-height:30px;font-size:13px}
#bottom-bar{grid-template-columns:minmax(220px,280px) minmax(100px,1fr) auto;gap:12px;background:#101a1e}
#bottom-bar .vitals{background:#071319;padding:6px 9px}
#player-name,#bottom-bar .level{font-size:14px}#gold{font-size:12px}.identity{gap:2px 7px;margin-bottom:3px}
.vital-bars .meter{height:18px;margin-top:3px;background:#071015}
.vital-bars .meter span{font:700 12px/16px system-ui;color:white;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}
#bottom-bar #chat-log{height:46px;font-size:13px;line-height:1.5;color:#f4f5ee;background:#071319;overflow-wrap:anywhere;padding:2px 5px}
#bottom-bar #chat-log b{color:#b6e9d3;font-weight:700}
#bottom-bar #chat-input{height:32px;background:#071319;border-color:#6c817f;padding:4px 6px}#bottom-bar #chat-form button{height:32px}
#action-bar .action-slot{width:58px;height:60px}
#action-bar kbd,#potions{font-size:12px;background:#061017eb;border-radius:2px;padding:1px 3px;line-height:1.2;color:white}
.cooldown-text{font-size:17px;text-shadow:-1px -1px 0 #000,1px 1px 0 #000,0 0 4px #000}
#boss-hud{padding:5px 10px;background:#081219f5;border:1px solid #b38a6f}
#boss-hud strong{font-size:16px;font-weight:700}#boss-intent{font-size:13px;color:#ffe1bd}
#toast{font-size:14px;line-height:1.5;background:#08141af5;border:1px solid #d2b47c;border-radius:4px;color:#fff1d5;max-width:min(640px,85%);padding:9px 14px}
#interact{font-size:14px;min-height:38px;padding:8px 14px;max-width:85%;bottom:calc(var(--dock) + 58px)}
.sheet-section-heading,.sheet-vitals>div>span,.sheet-combat article>span,.sheet-bonuses dd,.bag-section-title,.bag-footer{flex-wrap:wrap}
.sheet-bonuses dd>span{min-width:0}.sheet-bonuses dt{white-space:normal}
.sheet-appearance{flex-wrap:wrap}.sheet-appearance>span{white-space:normal}.sheet-portrait{overflow:auto;touch-action:pan-y}
.bag-detail-action>small{line-height:1.45}.bag-slot .bag-equipped{color:#121b14;background:#e2daa7}
.bag-slot .bag-count{background:#071319e8;padding:2px 3px;border-radius:2px}.bag-sort{flex-wrap:wrap}.bag-sort select{max-width:100%}
@container game-viewport (max-height:520px) or (max-width:900px){
 :root{--dock:98px}
 #bottom-bar{grid-template-columns:190px minmax(85px,1fr) auto;gap:7px;padding:5px 8px}
 #bottom-bar .vitals{padding:4px 6px}#player-name,#bottom-bar .level{font-size:13px}
 .vital-bars .meter{height:16px;margin-top:2px}.vital-bars .meter span{font-size:12px;line-height:14px}
 #bottom-bar #chat-log{height:42px;font-size:12px}#action-bar .action-slot{width:44px;height:50px}#action-bar{gap:3px}
 #hud .tools{top:8px;right:8px}#hud .tools button{min-width:48px;min-height:32px;font-size:12px;padding:6px}
 #network-debug{top:45px;right:8px;font-size:12px;padding:4px 6px}
 #minimap-panel{width:160px;left:8px;top:8px}#minimap-panel header{height:26px;padding:0 6px}#zone{font-size:13px}
 #minimap-panel #map-btn{height:26px;min-height:26px;font-size:12px}
 #boss-hud{top:82px;width:min(320px,42%);padding:3px 6px}#boss-hud strong{font-size:14px}
 #toast{font-size:14px;padding:6px 10px;bottom:calc(var(--dock) + 8px)}
 #interact{font-size:14px;bottom:calc(var(--dock) + 54px);min-height:34px}
 #modal[data-kind=stats] #modal-body,#modal[data-kind=inventory] #modal-body{font-size:12px}
 .sheet-combat small,.loadout-caption{display:none}.sheet-combat article>span{font-size:13px}#modal-body .sheet-combat p{font-size:12px}
 .sheet-section-heading>span{white-space:normal}.sheet-bonuses>div{align-items:flex-start}
 .bag-topline{min-height:40px}.bag-footer{padding:5px 10px;gap:4px 12px}.bag-wallet{white-space:normal;gap:4px 8px}.bag-tabs{gap:2px}
 #modal-body .bag-tabs button{padding:0 8px}.loadout-stage{min-height:85px}
 .lobby-card input{font-size:16px}.lobby-card{max-height:calc(100cqh - 58px)}
}
@container game-viewport (max-width:690px){
 #bottom-bar{grid-template-columns:160px minmax(70px,1fr) auto;gap:4px;padding:5px}#action-bar .action-slot{width:38px;height:46px}
 #minimap-panel{width:145px}#hud .tools button{min-width:40px;padding:5px 3px}
 .bag-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1.1fr)}
 .inventory-shell[data-tab=bag] .bag-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
 .bag-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.inventory-shell[data-tab=bag] .bag-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 .bag-filters{flex-wrap:wrap}.bag-filters button{flex-basis:40%!important}
}
@container game-viewport (max-height:420px){.lobby-footer{display:none}}

/* Keep compact type; clarity comes from native rasterization, not larger glyphs. */
#hud .tools button,#player-name,#bottom-bar .level{font-size:12px}
#modal-body button:not(.bag-flat):not(.bag-slot),.tools button,#interact{text-shadow:0 1px 2px #000}
.chat-channel-row{display:flex;align-items:center;gap:6px;height:20px;flex:none;font-size:12px;color:#cad5ce}
#chat-channel{font:12px system-ui;color:#edf2e8;background:#0b171b;border:1px solid #576963;border-radius:2px;height:20px;padding:0 3px}
#bottom-bar #chat-log{flex:1;height:auto;min-height:0}
#bottom-bar #chat{min-height:0;overflow:hidden}
#chat-form{flex:none}
/* Compact rooms are centered: keep the shared interaction button below actors. */
#game.interior #interact{bottom:calc(var(--dock) + var(--safe-bottom));height:34px;min-height:34px;padding:6px 14px}

/* Preserve a 12px rendered label size when the shared game stage is scaled down. */
body #game #minimap-panel #zone,
body #game #minimap-panel #online,
body #game #minimap-panel :is(#map-btn,#channel-btn),
body #game #minimap-panel kbd,
body #game #interact kbd,
body #game #hud .tools button,
body #game #hud .tools kbd,
body #game #network-debug,
body #game #network-debug b{font-size:calc(12px * var(--inverse-ui-scale,1))}