:root{color-scheme:dark;--bg:#131a1c;--panel:#1e282b;--edge:#394447;--gold:#d5ba7e;--muted:#acb8b8;--text:#edece4}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 "Malgun Gothic",system-ui,sans-serif}main{max-width:1480px;margin:auto;padding:16px 24px}h1,h2,h3,p{margin:0}h1{font-family:serif;font-size:32px;letter-spacing:5px}h1 span{font:14px system-ui;letter-spacing:2px;color:var(--muted);margin-left:14px}h2{font-size:17px}h3{font-size:13px;color:var(--gold);margin:16px 0 8px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--gold)}.masthead,.panel-heading,.world-heading,.connection-state,.save-controls{display:flex;align-items:center;justify-content:space-between;gap:12px}.masthead{margin-bottom:14px}.connection-state{color:var(--gold)}.panel{background:var(--panel);border:1px solid var(--edge);border-radius:5px}.notice{padding:9px 14px;margin:12px 0;border-left:2px solid var(--gold);background:#242e2d;min-height:39px;color:#dce4d9}button,input,select{font:inherit;color:inherit;background:#263337;border:1px solid #526163;border-radius:3px;padding:7px 10px}button{cursor:pointer}button:hover:enabled{border-color:var(--gold);color:#ffe2a4}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{cursor:default;color:#7f8d8e;background:#20292c;border-color:#384347}button.primary{background:#715d35;border-color:#ab8b4e;color:#fff1d1}input[type=password]{width:220px}input[type=checkbox]{accent-color:var(--gold)}small,.hint{font-size:11px;color:var(--muted)}small{display:block;margin-top:8px}#connection,#admission{padding:16px}#join{display:flex;align-items:center;gap:10px;flex-wrap:wrap}#join small{flex-basis:100%;margin:0}.roster{display:flex;gap:24px;margin:12px 0}.roster input{width:150px}#saved button{margin:10px 8px 0 0}.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:14px;align-items:start}.world{overflow:hidden}.world-heading{padding:10px 16px}#world-state{font-size:12px;color:var(--gold)}.viewport{position:relative;line-height:0}canvas{display:block;width:100%;height:auto;background:#344634;touch-action:manipulation}.hud{position:absolute;left:14px;top:12px;display:flex;flex-direction:column;gap:7px;max-width:270px;pointer-events:none;line-height:1.4}.actor-card{padding:9px 12px;background:rgba(18,25,28,.90);border:1px solid #6b7765;border-radius:4px;min-width:220px}.actor-card.ally{border-color:#626152;min-width:185px;font-size:11px}.actor-title{display:flex;justify-content:space-between;gap:16px;font-size:12px;margin-bottom:4px}.actor-title strong{color:#f9e0a0}.resource{display:flex;align-items:center;gap:6px;font-size:10px;margin:3px 0}.resource span:first-child{width:20px}.resource .meter{position:relative;height:14px;flex:1;background:#162023;overflow:hidden;border:1px solid #465052}.meter .fill{display:block;height:100%;background:#8a4140}.meter.ki .fill{background:#397181}.meter.exp .fill{background:#83733c}.meter .value{position:absolute;inset:0;text-align:center;line-height:12px;color:#fff;text-shadow:0 1px 2px #000;font-size:10px}.actor-meta{font-size:11px;color:#c9d0c7;margin-top:5px}.travel-controls{display:flex;flex-wrap:wrap;gap:7px;padding:10px 12px 4px}.world>.hint{padding:5px 14px 12px}kbd{font:10px monospace;border:1px solid #536060;padding:1px 3px;margin-left:7px;color:#b3bebb}.character{padding:15px;max-height:760px;overflow:auto}.tabs{display:flex;margin:12px 0 4px;border-bottom:1px solid var(--edge)}.tabs button{flex:1;border:0;border-radius:0;background:transparent;color:var(--muted);font-size:12px}.tabs button[aria-selected=true]{color:#ffe2a4;border-bottom:2px solid var(--gold);background:#273233}.equipment-list{display:grid;gap:4px}.gear-row{display:flex;justify-content:space-between;gap:10px;font-size:12px;padding:6px 8px;background:#192225;border:1px solid #344145}.gear-row .slot{color:var(--muted);flex-shrink:0}.gear-row .item-name{text-align:right}.gear-empty{color:#788789}.inventory-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-bottom:12px}.bag-slot{min-height:57px;padding:5px 4px;background:#192225;border:1px solid #3a4849;color:#d8d4bd;font-size:10px;text-align:center;overflow-wrap:anywhere}.bag-slot.empty{border-color:#2f3b3c;color:#758181;display:grid;place-items:center}.inventory-grid .empty-note{grid-column:1/-1;color:var(--muted);font-size:11px}.supply-list{display:grid;gap:8px}.supply-row{padding:10px;background:#192225;border:1px solid #3d4a46;border-radius:3px}.supply-heading{display:flex;justify-content:space-between;gap:8px}.supply-row strong{font-size:12px;color:#c2d9ad}.supply-row button{width:100%;margin-top:7px;font-size:12px}.supply-row p{font-size:11px;color:var(--muted);margin-top:4px}.action-result{font-size:11px;color:#e3d3b0;margin:8px 0;min-height:17px}.threshold{display:block;font-size:12px;margin-top:10px}.threshold output{float:right;font-size:11px;color:var(--muted)}.threshold input{display:block;width:100%;padding:0;margin:10px 0}.ammo{display:flex;justify-content:space-between;padding:9px 0;color:var(--muted)}.ammo strong{font-size:19px;color:var(--gold)}#refill,#red-potion{width:100%;font-size:12px}footer.panel{margin-top:14px;padding:12px 16px}.save-controls{justify-content:flex-start;flex-wrap:wrap}.save-controls span{color:var(--gold);font-size:12px}details{font-size:11px;color:var(--muted);margin-top:12px}details p{margin:10px 0}details span{margin-left:12px}#details-refresh{padding:3px 9px}#bag-prev,#bag-next{padding:1px 7px}[hidden]{display:none!important}@media(min-width:1400px){.character{max-height:810px}}@media(max-width:1000px){main{padding:12px}.play-layout{grid-template-columns:minmax(0,1fr) 280px}.hud{left:8px;top:8px}.actor-card{min-width:180px;padding:6px 8px}}@media(max-width:760px){.play-layout{grid-template-columns:1fr}.character{max-height:none}.masthead{align-items:flex-start}.connection-state{flex-direction:column;align-items:flex-end}h1{font-size:26px}h1 span{display:block;margin:0}.roster{flex-direction:column}.hud{max-width:175px}.actor-card{min-width:160px}.actor-meta{font-size:10px}}

.equipment-action{font-size:10px;padding:3px 6px}.bag-slot .equipment-action,.bag-slot select{display:block;width:100%;margin-top:4px}.bag-slot select{font-size:10px;padding:2px}.gear-row .item-name{flex:1}.gear-row .equipment-action{flex-shrink:0}#equipment-stats{margin-top:8px}


/* Compact native HUD: two horizontal groups of five, menus opened explicitly. */
main{padding-bottom:106px}.play-layout{grid-template-columns:minmax(0,1fr)}.play-layout:has(.character:not([hidden])){grid-template-columns:minmax(0,1fr) 340px}.character[hidden]{display:none}
#combat-dock{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));z-index:20;width:max-content;max-width:calc(100vw - 24px);color:#e9dfca;pointer-events:none;font-size:12px}
.dock-controls{display:flex;align-items:center;gap:12px}.quickslot-strip{display:flex;gap:18px;pointer-events:auto}.slot-group{display:grid;grid-template-columns:repeat(5,54px);gap:4px}.quickslot-card[hidden]{display:none}.quickslot-card{min-width:0}.quickslot-toggle{position:relative;display:block;width:54px;height:60px;padding:0;border:1px solid #776346;border-radius:5px;background:linear-gradient(145deg,#2e322d,#151d1b);box-shadow:inset 0 0 0 2px #1c2421,0 2px 5px #0009;overflow:hidden;color:#eee4ce;user-select:none;cursor:pointer}.quickslot-toggle:hover{border-color:#bd9d62}.quickslot-toggle:focus-visible{outline:2px solid #e2ce88;outline-offset:2px}.quickslot-toggle[data-auto="true"]{border-color:#89b98b;box-shadow:inset 0 0 0 1px #407646,0 0 7px #49754c80}.quickslot-toggle:disabled{opacity:.65;cursor:default}
.slot-top{position:absolute;inset:3px 4px auto;display:flex;justify-content:space-between;font-size:9px;line-height:11px;color:#b6b39e}.slot-auto{font-weight:800;color:#b0a68e}.quickslot-toggle[data-auto="true"] .slot-auto{color:#a2e5a9}.slot-icon{display:block;position:absolute;left:18px;top:16px;width:18px;height:23px;font-size:23px;line-height:24px;color:#647168;text-shadow:0 1px #000}.quickslot-toggle[data-action="green"] .slot-icon,.quickslot-toggle[data-action="courage"] .slot-icon{width:15px;height:20px;left:19px;top:17px;border:1px solid #b8c9a9;border-radius:3px 3px 5px 5px;background:linear-gradient(90deg,#335a36,#8aaa67 45%,#3c713f);box-shadow:inset 0 5px #b9c4a455}.quickslot-toggle[data-action="courage"] .slot-icon{background:linear-gradient(90deg,#72531f,#d4ad59 45%,#806426)}.quickslot-toggle[data-action="green"] .slot-icon:before,.quickslot-toggle[data-action="courage"] .slot-icon:before{content:'';position:absolute;top:-4px;left:3px;width:7px;height:4px;background:#968062;border:1px solid #c2a571}.quickslot-toggle[data-action="beksan"] .slot-icon{left:15px;top:15px;width:24px;color:#d0ccb9}
.slot-name{position:absolute;left:2px;right:2px;top:39px;font-size:9px;line-height:10px;overflow:hidden;white-space:nowrap;color:#d5cfbc}.slot-number{position:absolute;bottom:2px;left:2px;right:3px;text-align:right;font:700 10px/10px ui-monospace,monospace;color:#fff2cd}.quickslot-toggle[data-action="empty"] .slot-name{display:none}
.recovery-dock{position:relative;pointer-events:auto}.recovery-bottle{display:block;position:relative;width:46px;height:54px;border:1px solid #825747;border-radius:6px;background:linear-gradient(145deg,#352a25,#201b19);font-size:0!important;box-shadow:0 2px 5px #0009}.recovery-bottle:before{content:'';position:absolute;left:15px;top:15px;width:15px;height:23px;border:1px solid #d8ac85;border-radius:3px 3px 6px 6px;background:linear-gradient(90deg,#6e2529,#c46d62 45%,#85383a)}.recovery-bottle:after{content:'';position:absolute;left:19px;top:11px;width:7px;height:5px;background:#ae9270}.red-stock{position:absolute;bottom:3px;right:4px;font:700 10px ui-monospace,monospace;pointer-events:none;color:#ffe2c8}
.dock-tools{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:5px;pointer-events:auto;height:22px}.dock-tools>button,.dock-tools summary{padding:2px 7px;min-height:22px;border:1px solid #655b46;border-radius:4px;background:#17221de8;color:#cec3a8;font-size:11px;line-height:16px;cursor:pointer}.dock-tools>button{font-size:16px}.page-dots{display:flex;gap:6px;padding:0 5px}.page-dots button{width:8px;height:8px;min-height:0;padding:0;border:1px solid #807258;border-radius:50%;background:#222b25}.page-dots button[aria-current="page"]{background:#c4b477;border-color:#e1cf94}#quickslot-page{font:10px ui-monospace,monospace;color:#c2b994;min-width:31px}.dock-tools details{position:relative}.dock-tools summary{list-style:none}.dock-tools summary::-webkit-details-marker{display:none}
.dock-settings{position:absolute;right:0;bottom:31px;width:270px;max-width:calc(100vw - 36px);max-height:min(420px,65vh);overflow:auto;display:flex;flex-direction:column;gap:7px;padding:14px;background:#19261ff5;border:1px solid #8c7951;border-radius:7px;box-shadow:0 8px 24px #000b;font-size:12px;pointer-events:auto}.dock-settings h3,.dock-settings p{margin:0}.dock-settings label{display:block}.dock-settings select{width:100%}.dock-settings .threshold{display:flex;flex-direction:column;gap:8px}.dock-settings input[type="range"]{width:100%}.dock-settings .hint,.dock-settings small{font-size:11px;line-height:1.5}.dock-settings .action-result:empty{display:none}.slot-register[hidden]{display:none}
@media(max-width:760px){.play-layout:has(.character:not([hidden])){grid-template-columns:1fr}#combat-dock{right:12px}.slot-group{grid-template-columns:repeat(5,46px);gap:3px}.quickslot-toggle{width:46px;height:56px}.quickslot-strip{gap:10px}.dock-controls{gap:8px}.slot-icon{left:14px}.quickslot-toggle[data-action="green"] .slot-icon,.quickslot-toggle[data-action="courage"] .slot-icon{left:15px}.quickslot-toggle[data-action="beksan"] .slot-icon{left:11px}.slot-name{top:36px}.recovery-bottle{width:40px}}
@media(max-width:560px){.slot-group{grid-template-columns:repeat(5,calc((100vw - 109px)/10));gap:2px}.quickslot-toggle{width:100%;height:51px}.quickslot-strip{gap:8px}.slot-icon{left:calc(50% - 9px)}.quickslot-toggle[data-action="green"] .slot-icon,.quickslot-toggle[data-action="courage"] .slot-icon{left:calc(50% - 8px)}.quickslot-toggle[data-action="beksan"] .slot-icon{left:calc(50% - 12px)}.slot-name{display:none}.slot-top{inset:2px;font-size:8px}.slot-number{font-size:9px}}
#recovery-dock{width:46px;flex:0 0 46px}#red-potion.recovery-bottle{width:46px}.dock-tools details{margin-top:0}.dock-settings strong{color:#e6d4a6}.dock-settings small{margin-top:0}

/* Match the visible game area to its buffer: preserve renderer/world pixel scale. */
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) main{height:100dvh;padding:8px 16px 104px;display:flex;flex-direction:column;gap:6px;overflow:hidden}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .masthead{flex:0 0 34px;margin:0}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .masthead .eyebrow{display:none}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) h1{font-size:24px}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .connection-state button{padding:4px 8px;font-size:11px}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .notice{flex:0 0 24px;min-height:24px;margin:0;padding:1px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .play-layout{flex:1;min-height:0;align-items:stretch}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .world{display:flex;flex-direction:column;min-height:0}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .world-heading{flex:0 0 34px;padding:3px 12px}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .world-heading .eyebrow{display:none}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .viewport{flex:1;min-height:0;overflow:hidden}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) #screen{width:100%;height:100%;max-width:none}
body:has(#combat-dock):has(#connection[hidden]):has(#admission[hidden]) .character{max-height:none;min-height:0;overflow:auto}
footer.game-menu{position:fixed;bottom:12px;left:16px;z-index:21;padding:0;margin:0;border:0;background:transparent;max-width:calc(100vw - 32px)}
footer.game-menu>details{margin:0;font-size:12px}footer.game-menu>details>summary{padding:5px 12px;border:1px solid #8c7951;border-radius:4px;background:#19261ff5;color:#e6d4a6;cursor:pointer;list-style:none}
footer.game-menu>details>summary::-webkit-details-marker{display:none}.game-menu-content{position:absolute;bottom:42px;left:0;width:380px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 100px);overflow:auto;padding:12px;background:#19261ff5;border:1px solid #8c7951;border-radius:6px;box-shadow:0 8px 24px #000b;line-height:1.5}
.game-menu-content .travel-controls{padding:0 0 8px;gap:6px}.game-menu-content .travel-controls button{padding:5px 8px;font-size:12px}.game-menu-content #hunt-radius{width:118px;padding:4px 6px}.game-menu-content .hint,.game-menu-content small{margin:4px 0}.game-menu-content .save-controls{padding-top:8px;border-top:1px solid #655b46}.game-menu-content .save-controls button{padding:5px 8px;font-size:12px}

.boss-status{position:absolute;right:12px;top:12px;max-width:min(420px,calc(100% - 300px));padding:6px 9px;background:#19261fe8;border:1px solid #8c7951;border-radius:4px;color:#e6d4a6;font:11px/1.5 "Malgun Gothic",system-ui,sans-serif;white-space:pre-line}.boss-status:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* Raid entry candidate: native combat remains active, with no input interception. */
.raid-boss-hud{position:absolute;left:50%;top:10px;transform:translateX(-50%);width:min(420px,calc(100% - 28px));padding:5px 12px 9px;z-index:3;pointer-events:none;user-select:none;background:#19261fe8;border:1px solid #8c7951;border-radius:4px;color:#e6d4a6}
.raid-boss-heading{display:grid;grid-template-columns:1fr auto;gap:1px 10px;align-items:center}.raid-boss-area{grid-column:1/-1;font-size:10px;color:#acb8b8;letter-spacing:1px}.raid-boss-hud h3{margin:0;color:#ffe2a4;font:600 19px/1.4 "Malgun Gothic",system-ui,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform-origin:left center;transition:color 160ms,transform 160ms}.raid-boss-percent{font:600 12px/1.4 ui-monospace,monospace;font-variant-numeric:tabular-nums;white-space:nowrap}
.raid-boss-meter{height:9px;margin-top:5px;background:#101917;border:1px solid #776346;overflow:hidden;border-radius:2px}.raid-boss-meter>span{display:block;height:100%;width:0;background:linear-gradient(90deg,#8b3e35,#c57759)}
.raid-boss-hud[data-stage="EMPHASIS"] h3{color:#d5ba7e;transform:translateX(3px)}.raid-boss-hud[data-stage="NAME"] h3{color:#fff0cb;transform:translateX(0)}.raid-boss-hud[data-stage="SETTLE"] h3,.raid-boss-hud[data-stage="COMBAT"] h3{transform:none}
.viewport[data-raid-presentation="active"] .hud{top:auto;bottom:10px;pointer-events:none}
@media(max-width:760px){.raid-boss-hud{top:6px;width:min(340px,calc(100% - 20px));padding:4px 8px 7px}.raid-boss-hud h3{font-size:16px}.raid-boss-area{font-size:9px}.raid-boss-percent{font-size:11px}}
@media(prefers-reduced-motion:reduce){.raid-boss-hud h3{transition:none;transform:none!important}}