@import url('/fonts.css');
.reference-tabs{display:flex;gap:5px;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:10px}.reference-tabs button{border:0;background:transparent;color:var(--muted);padding:7px 10px;font-size:12px;flex:1}.reference-tabs button[aria-selected=true]{background:#25444b;color:#d9f0e6}.reference-tabs span{margin-left:6px;font-size:10px;color:var(--gold)}.reference.panel{padding:12px}.reference .section-heading{margin-bottom:8px}#roster-list{max-height:240px;overflow-y:auto;scrollbar-width:thin;display:flex;flex-direction:column;gap:4px}.roster-row{display:flex;align-items:center;gap:6px;text-align:left;padding:6px 8px;width:100%;flex-shrink:0;background:#122830}.roster-row.hovered{border-color:var(--cyan);box-shadow:inset 3px 0 var(--cyan)}.roster-distance{font-size:10px;color:var(--cyan);white-space:nowrap;align-self:flex-start;margin-top:1px}.roster-row.selected{border-color:var(--gold);background:#293c3c}.roster-icon{font-size:18px;width:18px;flex-shrink:0;color:var(--gold)}.roster-icon.enemy{color:#d69d82}.roster-info{display:block;flex:1;min-width:0}.roster-info strong{display:block;font-size:12px;font-weight:500}.roster-info small{display:block;font-size:10px;color:var(--muted);margin-top:1px}.roster-hp{display:block;margin-top:3px;height:3px;background:#314249}.roster-hp i{display:block;height:100%;background:#c78f76}.reference #journal-pane{min-height:205px}
:root{color-scheme:dark;--bg:#0a151b;--panel:#101f26;--line:#263b43;--ink:#e9efed;--muted:#9aacb1;--cyan:#83e5da;--gold:#d7b979;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);overflow:hidden}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:#142933;border-radius:5px}button:hover{background:#1c3842;border-color:#52767e}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}button[hidden],[hidden]{display:none!important}kbd{font:11px ui-monospace,monospace;letter-spacing:.03em;border:1px solid #3a5057;padding:4px 6px;border-radius:3px;color:#b8c8ca;white-space:nowrap}.brand{display:flex;align-items:center;gap:12px;font-size:16px;letter-spacing:.13em;font-weight:650}.brand small{display:block;font-size:10px;font-weight:450;color:var(--muted);letter-spacing:.22em;margin-top:5px}.crest{font-size:35px;color:var(--gold)}.quiet{padding:9px 12px;background:transparent}.quiet kbd{margin-left:8px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:16px;padding:16px 20px;height:100dvh;min-height:430px}.world-panel{position:relative;min-width:0;overflow:hidden;border:1px solid #314850;border-radius:8px;background:#162b31}.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:600;color:var(--gold)}h1{font:500 25px Georgia,serif;letter-spacing:.01em;margin:6px 0}h1+p{font-size:11px;color:#bdcbc8;margin:0}#game{position:absolute;inset:0;outline:none}#game canvas{display:block;image-rendering:pixelated}.sidebar{display:flex;flex-direction:column;gap:12px;min-height:0;overflow-y:auto;scrollbar-width:thin}.panel{border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:16px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.section-heading h2{font-size:10px;letter-spacing:.15em;text-transform:uppercase;margin:0;color:#b3c5c8;font-weight:600}.section-heading>span{font-size:9px;color:var(--muted)}.character-id{display:flex;align-items:center;gap:11px;margin-bottom:18px}.avatar{width:43px;height:48px;border:1px solid #3c686c;border-radius:4px;background:#163e45;display:grid;place-items:center;font-size:26px;color:var(--cyan)}.character-id strong{font-size:17px;font-weight:500;display:block}.character-id span{font-size:11px;color:var(--gold);display:block;margin-top:5px}.stat-row{font-size:11px;display:flex;justify-content:space-between;margin:10px 0 5px;color:#bdc9cc}.stat-row.secondary{font-size:10px;color:var(--muted);margin-top:13px}.meter{height:5px;background:#22333a;border-radius:4px;overflow:hidden}.meter i{height:100%;width:100%;display:block;transition:width .15s}.health i{background:#aa7869}.energy i{background:#63c9c8}.xp{height:3px}.xp i{background:var(--gold);width:0}.quest h3{font:500 20px Georgia,serif;margin:0 0 8px}.quest p{font-size:11px;color:var(--muted);line-height:1.6;margin:0 0 10px}.quest ol{list-style:none;padding:0;margin:0}.quest li{position:relative;font-size:11px;line-height:1.5;margin:8px 0;padding-left:19px;color:#a7b9bd}.quest li:before{content:'';width:8px;height:8px;border:1px solid #586966;border-radius:50%;position:absolute;left:0;top:4px}.quest li.done{color:#6db7ac}.quest li.done:before{background:#6db7ac;border-color:#6db7ac}.quest li.current{color:#edf0e5}.quest li.current:before{border-color:var(--gold);box-shadow:0 0 0 2px #d7b97920}.quest li b{font-size:10px;font-weight:500;float:right}.reward{border-top:1px solid var(--line);padding-top:12px;margin-top:13px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.1em;color:var(--muted)}.reward strong{color:var(--gold);font-weight:500}.target .section-heading{margin-bottom:9px}.target kbd{border:0;padding:0;font-size:8px}.target-choice{display:flex;align-items:center;justify-content:space-between;gap:8px}.target-choice .quiet{font-size:10px;padding:5px 8px}.target-choice>strong{font-size:13px;font-weight:500}.target p{font-size:10px;color:var(--muted);margin:6px 0 10px}.enemy i{background:#d38d70;width:0}.chat{min-height:155px;flex:1;display:flex;flex-direction:column;padding-bottom:10px}.chat .section-heading{margin-bottom:8px}#chat-messages{flex:1;min-height:60px;max-height:220px;overflow-y:auto;scrollbar-width:thin;font-size:11px;line-height:1.6;color:#b3c3c9;overflow-wrap:anywhere}#chat-messages p{margin:0 0 5px}#chat-messages b{font-weight:500;color:var(--gold)}#chat-form{display:flex;gap:7px;border-top:1px solid var(--line);padding-top:9px;margin-top:7px}input,select{color:var(--ink);background:#0d1d24;border:1px solid #31464e;border-radius:4px;padding:11px;min-width:0}#chat-input{width:100%;border:0;background:transparent;padding:5px 0;font-size:11px}#chat-form button{width:30px;flex-shrink:0}.actionbar{height:94px;border-top:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:14px 22px;background:#0e1e25}.action-label{display:flex;flex-direction:column;gap:8px;margin-right:18px}.action-label>span:last-child{font-size:11px;color:var(--muted)}.ability{height:62px;display:flex;align-items:center;gap:12px;padding:9px 17px;position:relative;min-width:235px;text-align:left}.ability kbd{align-self:flex-start;margin:0 0 0 -9px;font-size:9px;padding:2px 4px}.ability-icon{font-size:33px;color:var(--cyan);width:30px;text-align:center}.ability .shield{font-size:36px;color:#b6c3ee}.ability strong{display:block;font-size:13px;font-weight:500}.ability small{display:block;font-size:10px;color:var(--muted);margin-top:6px}.cooldown{position:absolute;right:9px;top:6px;font-size:11px;color:var(--gold)}.interact-button{padding:17px;margin-left:auto;white-space:nowrap}.interact-button kbd{margin-right:8px}.world-overlays{pointer-events:none;position:absolute;inset:0;z-index:4}#interaction-hint{position:absolute;bottom:45px;left:50%;transform:translateX(-50%);background:#0b1b23ef;border:1px solid #55766c;border-radius:5px;padding:9px 12px;display:flex;align-items:center;gap:9px;white-space:nowrap;font-size:12px;box-shadow:0 5px 25px #0004}#toasts{position:absolute;z-index:5;top:110px;left:50%;transform:translateX(-50%);width:min(450px,90%);pointer-events:none;display:grid;gap:6px}.toast{background:#10262ff5;border:1px solid #59766c;border-left:3px solid var(--gold);padding:12px 15px;border-radius:4px;font-size:12px;line-height:1.5;box-shadow:0 8px 24px #0003;animation:toast-in .2s ease-out}#travel-overlay{inset:0;position:absolute;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;background:#0a1929f7;color:var(--ink)}.travel-symbol{font-size:70px;color:var(--cyan);animation:orbit 1.2s linear infinite}#travel-overlay strong{font:28px Georgia,serif}#travel-label{color:var(--muted)}dialog{color:var(--ink);background:#10212a;border:1px solid #496265;border-radius:10px;padding:0;max-width:min(580px,calc(100vw - 35px));box-shadow:0 30px 100px #0008}dialog::backdrop{background:#06121bb8;backdrop-filter:blur(5px)}.dialog-inner{padding:32px}.dialog-inner h2{font:30px Georgia,serif;font-weight:400;margin:12px 0 18px}.dialog-inner p{font-size:14px;line-height:1.85;color:#bdcbd0}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}.primary{background:var(--cyan);border-color:var(--cyan);color:#103439;font-weight:650;padding:13px 18px}.primary:hover{background:#a8f5e8;border-color:#a8f5e8}.entry-dialog{max-width:min(790px,calc(100vw - 35px));width:790px}.entry-dialog[open]{display:grid;grid-template-columns:230px 1fr}.entry-art{background:radial-gradient(ellipse at center,#235758 0,#183e44 35%,#102632 75%);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:500px}.entry-art>span{font-size:115px;color:#ccece0;text-shadow:0 0 40px #83e5da70;z-index:1}.entry-art small{position:absolute;bottom:40px;letter-spacing:.35em;color:#99bcbb;font-size:10px}.entry-orbit{border:1px solid #6fb4ab55;border-radius:50%;width:290px;height:290px;position:absolute}.entry-orbit:before,.entry-orbit:after{content:'';position:absolute;border:1px solid #6fb4ab44;border-radius:50%;inset:27px}.entry-orbit:after{inset:-25px}.entry-content{padding:38px}.entry-content h2{font:34px Georgia,serif;font-weight:400;margin:15px 0}.entry-content>p{font-size:13px;line-height:1.8;color:var(--muted);margin:0 0 24px}#profile-form label{display:block;font-size:12px;color:#ced7d8;margin:18px 0 9px}.profile-input-row{display:flex;gap:8px}#profile-name{flex:1;width:100%;font-size:14px}#profile-color{font-size:12px;width:99px}#profile-form .primary{width:100%;margin-top:12px;display:flex;justify-content:space-between}.entry-note{display:block;color:#81989d;font-size:10px;margin-top:24px;line-height:1.8}.error{color:#f2ae95!important;font-size:12px!important;margin-top:15px!important}.profile-choice{width:100%;display:flex;align-items:center;justify-content:space-between;text-align:left;padding:12px;margin:7px 0}.profile-choice small{color:var(--gold);font-size:10px}.controls{display:grid;grid-template-columns:145px 1fr;gap:13px;font-size:12px;line-height:1.6}.controls dt{color:var(--gold)}.controls dd{margin:0;color:#c2cdd0}@keyframes toast-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}@keyframes orbit{to{transform:rotate(180deg)}}
@media(max-height:820px){.workspace{padding:12px 18px;gap:12px;height:100dvh}.actionbar{height:84px}.panel{padding:12px}.character-id{margin-bottom:10px}.section-heading{margin-bottom:10px}.stat-row{margin-top:7px}.quest li{margin:5px 0}.quest p{margin-bottom:6px}.target{padding:10px 12px}.chat{min-height:125px}.sidebar{gap:9px}}
@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1fr) 270px;padding:10px;gap:10px}.action-label{display:none}.actionbar{padding:10px}.ability{min-width:210px}}
@media(max-width:720px){body{overflow:auto}.workspace{grid-template-columns:1fr;height:auto;padding:8px}.world-panel{height:65dvh;min-height:420px}.sidebar{display:grid;grid-template-columns:1fr 1fr;overflow:visible}.chat{grid-column:1/-1}.brand{font-size:12px;letter-spacing:.05em}.brand small{font-size:8px}.actionbar{position:sticky;bottom:0;height:80px;gap:6px;z-index:6}.ability{min-width:0;flex:1;padding:8px;gap:5px}.ability-icon{display:none}.ability strong{font-size:11px}.ability small{font-size:8px}.ability kbd{margin:0}.interact-button{font-size:10px;padding:10px}.entry-dialog[open]{grid-template-columns:1fr}.entry-art{display:none}.entry-content{padding:26px}.dialog-inner{padding:25px}.controls{grid-template-columns:110px 1fr}}

.world-column{display:grid;grid-template-rows:minmax(240px,1fr) clamp(170px,25dvh,240px);gap:12px;min-height:0;min-width:0}
.world-column .chat{min-height:0;overflow:hidden;padding:12px 16px;flex:none}
.world-column #chat-messages{min-height:0;max-height:none;font-size:12px;line-height:1.65;padding-right:8px}
.world-column #chat-input{font-size:12px}
.chat-time{color:#8fa8b0;font-variant-numeric:tabular-nums;white-space:nowrap;margin-right:4px}
.chat-header{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:-4px -4px 10px;padding:0 4px;border-bottom:1px solid #547078;flex-shrink:0}
.chat-header-actions{display:flex;align-items:center;gap:8px;align-self:center;color:var(--muted);font-size:10px;white-space:nowrap}
#chat-collapse{width:24px;height:24px;padding:2px;display:grid;place-items:center;background:transparent}
#chat-collapse svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chat-collapsed #chat-collapse svg{transform:rotate(180deg)}
.chat-tabs{display:flex;gap:6px}
.chat-tabs [role=tab]{position:relative;display:flex;align-items:center;justify-content:center;gap:5px;min-width:66px;min-height:26px;padding:3px 10px;font-size:11px;font-weight:600;line-height:1.5;background:#162c35;border:1px solid #547078;border-bottom:0;border-radius:5px 5px 0 0;color:#bdd0d5}
.chat-tabs [role=tab]:hover{background:#25414a;color:#f0fffa}
.chat-tabs [aria-selected=true]{background:#294d48;border-color:#9cd9ca;color:#edfff7;box-shadow:inset 0 3px 0 #9cd9ca}
.chat-tabs [aria-selected=true]:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#294d48}
.chat-tabs [aria-selected=true]:hover{background:#315950}.chat-tabs [aria-selected=true]:hover:after{background:#315950}
.chat-tabs [role=tab]:focus-visible{outline:2px solid var(--gold);outline-offset:-5px}
.chat-unread{min-width:16px;padding:0 4px;border-radius:8px;background:#3d5356;color:#e8d39e;font-size:10px;text-align:center}
.chat-tab-panel{display:flex;flex-direction:column;flex:1;min-height:0}
.roster-row.pinned{position:sticky;top:0;z-index:1;box-shadow:0 3px 6px #09182080}
#combat-messages{flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;padding-right:8px;font-size:13px;line-height:1.7;overflow-wrap:anywhere;color:#dbc5b0}#combat-messages p{margin:0 0 5px}#combat-messages:empty:before{content:'Tutaj pojawi się przebieg walki i użycie technik.';color:var(--muted);font-size:12px}
.chat-shout{color:#ff7e7e}#chat-messages .chat-shout b{color:#ff7e7e}
.chat-entry{padding:3px 0}.chat-entry p{margin:0!important}.chat-interaction{border-left:2px solid var(--gold);padding:7px 10px;margin:5px 0;background:#172e35;border-radius:2px}.chat-interaction b{color:#e8cc90!important}.chat-system{color:#89aaa9;font-size:11px}.chat-system b{color:#8ac8bd!important}
.chat-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:7px}.chat-actions button{padding:6px 12px;font-size:11px;color:#c4f2e5;border-color:#55796e;background:#24423f}.chat-actions button:disabled{background:transparent;opacity:.55}.chat-action-hint{font-size:10px;color:var(--muted)}
@media(max-width:720px){.world-column{display:flex;flex-direction:column}.world-column .world-panel{height:55dvh;min-height:320px}.world-column .chat{height:220px;min-height:220px;grid-column:auto}}


.world-column{grid-template-rows:minmax(240px,1fr) clamp(170px,25dvh,240px);gap:4px}
/* The main action bar floats above the map's XP edge and scales with the viewport. */
.world-column .actionbar{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));width:min(494px,calc(100% - 24px));height:auto;min-height:0;position:absolute;left:50%;bottom:24px;transform:translateX(-50%);padding:6px;gap:4px;border:1px solid #709b9b88;border-radius:8px;background:#0b202bd9;box-shadow:0 4px 16px #0007,inset 0 1px 0 #c9eee51a;z-index:9}
.ability-slot{position:static;min-width:0}.interaction-slot{margin-left:0}
.world-column .ability,.world-column .interact-button{position:relative;display:grid;place-items:center;width:100%;height:auto;aspect-ratio:1;min-width:0;padding:0;margin:0;border-radius:4px;flex:none;background:linear-gradient(#203b46,#102730);border-color:#587981}
.world-column .ability:hover,.world-column .interact-button:hover{border-color:#b3e4d5;background:linear-gradient(#2b5058,#16363e)}
.world-column .ability-icon{display:block;width:64%;height:auto;aspect-ratio:1;line-height:0}.world-column .ability-icon svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.world-column .interact-button{font-size:24px;color:#bed6cd}
.actionbar kbd.ability-shortcut{position:absolute;top:2px;left:3px;z-index:3;margin:0;padding:0 2px;border:0;border-radius:2px;background:#061820a6;color:#e8f6f0;font:600 10px/1.3 Verdana,sans-serif;letter-spacing:0;text-shadow:0 1px 2px #000;pointer-events:none}
.world-panel #interaction-hint{bottom:96px}
.world-panel:has(#activity-progress:not([hidden])) #interaction-hint{bottom:142px}
@property --cooldown-angle{syntax:'<angle>';inherits:true;initial-value:360deg}
.world-column .ability{isolation:isolate;overflow:hidden;transition:--cooldown-angle .1s linear}
.world-column .ability.is-cooling[aria-disabled=true]{opacity:1;border-color:#7f8274;background:#142933}
.ability.is-cooling .ability-icon{opacity:.65}
.ability.is-cooling::after{content:'';position:absolute;inset:0;border-radius:inherit;z-index:1;pointer-events:none;background:conic-gradient(from 0deg,transparent 0deg var(--cooldown-angle),#03121ee6 var(--cooldown-angle) 360deg)}
.cooldown-count{position:absolute;inset:0;display:grid;place-items:center;z-index:2;pointer-events:none;color:#fff7df;font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;text-shadow:0 1px 2px #000,0 0 5px #000;line-height:1}
@media(prefers-reduced-motion:reduce){.world-column .ability{transition:none}}
.ability-tooltip{display:none;position:absolute;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%);min-width:190px;width:max-content;max-width:calc(100% - 8px);padding:10px 12px;border:1px solid #567970;border-radius:5px;background:#10262ff7;box-shadow:0 4px 20px #0006;pointer-events:none;z-index:20;color:var(--ink);font-size:12px;line-height:1.6}
.ability-tooltip strong,.ability-tooltip span,.ability-tooltip small{display:block}.ability-tooltip span{color:var(--muted);font-size:11px}.ability-tooltip small{color:var(--gold);font-size:10px}.ability-slot:hover .ability-tooltip,.ability-slot:focus-within .ability-tooltip{display:block}
.actionbar:has(.ability-slot:hover) .ability-slot:not(:hover) .ability-tooltip{display:none}

@media(max-width:720px){.workspace{height:auto}.ability-tooltip{max-width:240px;min-width:180px}}

.target-overlay{position:absolute;z-index:7;top:12px;left:50%;transform:translateX(-50%);width:min(280px,44%);padding:9px 12px;border:1px solid #b4d7cf88;border-radius:6px;background:#0b202bd9;box-shadow:0 3px 12px #0005;text-shadow:0 1px 3px #03131e,0 0 5px #03131e}
.target-overlay .target-choice>strong{color:#eafaf2;font-size:13px}.target-overlay p{color:#d2e2df;font-size:10px;line-height:1.5;margin:5px 0 7px}.target-overlay .quiet{background:#10232b80;color:#e3eeea}.target-overlay .meter{background:#132b3480}
@media(max-width:720px){.target-overlay{width:min(280px,calc(100% - 24px))}}

.target-overlay .target-choice{justify-content:center;gap:6px;text-align:center;flex-wrap:wrap;font-size:12px;color:#eafaf2}.target-overlay .target-choice>strong{font-size:12px}.target-overlay #target-kind{color:#c3dcd6}.target-overlay .meter{margin-top:7px}


.view-toggle{display:flex;align-items:center;gap:7px;white-space:nowrap}
.view-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.view-toggle[aria-expanded=true],.view-toggle[aria-pressed=true]{color:#c4ebdf;border-color:#496c66;background:#19332f}
@media(max-width:1100px){.view-toggle span{display:none}.view-toggle{width:35px;height:35px;justify-content:center;padding:7px}}


/* Screen typography: wider letterforms and readable small labels. */
:root{font-family:Verdana,Geneva,Arial,sans-serif;line-height:1.5}
h1,.quest h3,.dialog-inner h2,.entry-content h2,#travel-overlay strong{font-family:inherit;font-weight:600;letter-spacing:0}
.brand{font-size:14px;letter-spacing:.06em}.brand small{letter-spacing:.12em}
.eyebrow,.section-heading h2{font-size:11px;letter-spacing:.07em}
.section-heading>span,.reward{font-size:11px;letter-spacing:.03em}
.quest h3,.journal-panel h3{font-size:18px;line-height:1.4}
.quest p,.quest li{font-size:12px;line-height:1.7}.quest li{margin:7px 0}.quest li:before{top:6px}.quest li b{font-size:11px}
.character-id span,.stat-row{font-size:12px}.stat-row.secondary{font-size:11px}
.roster-info strong{font-size:13px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.roster-info small,.roster-distance{font-size:11px;line-height:1.35}
.world-column #chat-messages,.world-column #chat-input{font-size:13px;line-height:1.7}#chat-messages b{font-weight:600}
.chat-system,.chat-action-hint,.chat-actions button{font-size:12px}
.ability-tooltip{font-size:13px}.ability-tooltip span,.ability-tooltip small{font-size:12px}
.target-overlay .target-choice,.target-overlay .target-choice>strong{font-size:13px;line-height:1.5}

.entry-note,.profile-choice small{font-size:12px;line-height:1.7}
@media(max-width:1100px){.brand{font-size:12px}}

.journal-panel{position:absolute;z-index:8;left:14px;top:14px;width:min(270px,calc(100% - 28px));max-height:calc(100% - 70px);overflow-y:auto;scrollbar-width:thin;border:1px solid #48625c;border-radius:5px;background:#0c2029e6;box-shadow:0 3px 12px #0003}
.world-panel:has(>.target-overlay:not([hidden])) .journal-panel{top:70px;max-height:calc(100% - 118px)}
.quest-summary{width:100%;display:flex;align-items:center;gap:9px;text-align:left;padding:9px 12px;border:0;background:transparent;border-radius:4px;color:#e5eee5;font-size:13px;line-height:1.6}
.quest-summary strong{font-weight:600}.quest-summary:hover{background:#28453f}.quest-chevron{color:var(--gold);transition:transform .15s}.quest-summary[aria-expanded=true] .quest-chevron{transform:rotate(90deg)}
#quest-details{padding:0 12px 12px}.journal-panel .quest-summary:focus-visible{outline-offset:-3px}
@media(prefers-reduced-motion:reduce){.quest-chevron{transition:none}}
.connection-panel{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:22px;background:#07161be8;text-align:center}
.connection-panel>div{max-width:420px}.connection-panel h2{font-size:20px;margin:0 0 12px}.connection-panel p{font-size:13px;line-height:1.7;color:var(--muted)}
.connection-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:20px}.connection-actions button{font-size:12px}

/* The game fills the window; identity and controls live in the right column. */
.sidebar>header,.sidebar>.character,.sidebar>.character-menu,.sidebar>.reference{flex-shrink:0}
.sidebar-header{padding:2px 4px 4px}
.sidebar-header .brand{gap:11px;font-size:13px;letter-spacing:.05em}
.sidebar-header .brand small{font-size:9px;letter-spacing:.08em;margin-top:3px}
.sidebar-header .crest{font-size:32px;line-height:1.3}
.server-status{display:flex;align-items:center;gap:8px;margin:10px 0 0 2px;color:var(--muted);font-size:11px;min-height:18px}
.server-status svg,.utility-button svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.server-status svg{width:15px;height:15px}
.character-menu{display:flex;align-items:center;gap:8px;padding:0 2px}
.character-menu .utility-button{display:grid;place-items:center;width:42px;height:40px;padding:9px;flex-shrink:0;color:#acc3c9;background:#122830;border:1px solid var(--line);border-radius:5px}
.character-menu .utility-button svg{width:20px;height:20px}
.character-menu .utility-button:hover{color:#def3ee;background:#1c3842;border-color:#52767e}
.character-menu .utility-button[aria-expanded=true],.character-menu .utility-button[aria-pressed=true]{color:#c4ebdf;border-color:#496c66;background:#19332f}
.character-menu #leave-button{margin-left:auto}
@media(max-width:720px){.sidebar{display:flex}.sidebar-header{padding-top:6px}}

/* Compact area map, expanded map and shared marker labels. */
.world-panel{--minimap-size:clamp(126px,14vw,170px)}
.minimap-button{position:absolute;z-index:9;top:12px;right:12px;width:var(--minimap-size);padding:5px 5px 4px;background:#0b202aee;border:1px solid #53776f;border-radius:6px;box-shadow:0 3px 12px #0005;overflow:hidden}
.minimap-button:hover{background:#17333b;border-color:#95d4c3}.minimap-button:focus-visible{outline-offset:2px}
#minimap-svg{display:block;width:100%;aspect-ratio:4/3;overflow:hidden;border-radius:2px}
.minimap-caption{display:flex;align-items:center;justify-content:space-between;gap:4px;padding:5px 2px 0;color:#d0e2d9;font-size:11px;line-height:1.5}
#minimap-area{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.minimap-caption>svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;flex-shrink:0}
.area-map-dialog{width:min(1100px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);padding:20px;overflow:auto;background:#0d2029}
.area-map-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.area-map-header h2{font-size:22px;font-weight:600;line-height:1.4;margin:4px 0 0}
.map-close{width:26px;height:26px;padding:0;display:grid;place-items:center;flex-shrink:0;background:#172e36}
.area-map-content{display:grid;grid-template-columns:minmax(0,1fr) 205px;gap:20px;align-items:start}
.area-map-svg{display:block;width:100%;aspect-ratio:4/3;max-height:calc(100dvh - 170px);background:#10252d;border:1px solid #405e62;border-radius:5px;overflow:hidden}
.map-player-label{fill:#bceee6;stroke:#0b2029;stroke-width:5px;paint-order:stroke;stroke-linejoin:round;font:600 20px Verdana,Geneva,Arial,sans-serif}.map-marker[data-kind=self] .map-player-label{fill:#fff5cf}
.area-map-key{max-height:calc(100dvh - 170px);overflow-y:auto;scrollbar-width:thin;padding-right:5px}
.area-map-key h3{font-size:13px;color:var(--gold);font-weight:600;margin:0 0 12px}
#map-legend{list-style:none;padding:0;margin:0;display:grid;gap:9px}
#map-legend li{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.5;color:#c0d1d2}
#map-legend svg{flex-shrink:0}.map-swatch{display:block;width:20px;height:15px;flex-shrink:0;border:1px solid #ffffff26;border-radius:2px}
.area-map-key p,.area-map-hint{font-size:11px;line-height:1.7;color:var(--muted);margin:16px 0 0}.area-map-hint{margin-top:12px}
@media(max-width:900px){.area-map-content{grid-template-columns:minmax(0,1fr) 175px;gap:14px}.area-map-dialog{padding:16px}.area-map-header h2{font-size:18px}}
@media(max-width:720px){.area-map-content{grid-template-columns:1fr}.area-map-key{max-height:none;overflow:visible}#map-legend{grid-template-columns:1fr 1fr}.area-map-header{margin-bottom:12px}.area-map-dialog{padding:12px}.target-overlay{top:142px;width:min(280px,calc(100% - 24px))}.journal-panel{max-width:calc(100% - var(--minimap-size) - 40px)}}

.entry-dialog{width:850px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 28px);overflow:auto}
.entry-dialog[open]{grid-template-columns:230px minmax(0,1fr)}
.entry-art{min-height:460px;align-self:stretch}
.entry-art .preview-heading{position:absolute;top:30px;font-size:11px;font-weight:600;letter-spacing:.18em;text-shadow:none;color:#b8d6ca}
#character-preview{width:152px;height:196px;image-rendering:pixelated;position:relative;z-index:1;filter:drop-shadow(0 12px 10px #03192355)}
.entry-content{padding:26px}
.entry-content h2{font-size:27px;margin:12px 0}
.entry-content>p{font-size:12px;line-height:1.6;margin-bottom:15px}
#profile-list{max-height:164px;overflow-y:auto;scrollbar-width:thin}
.profile-choice{gap:10px;padding:5px 9px;margin:5px 0}
.profile-choice strong{flex:1;min-width:0;overflow-wrap:anywhere;font-size:13px}
.profile-choice small{flex-shrink:0}
.profile-portrait{width:30px;height:39px;image-rendering:pixelated;flex-shrink:0}
#profile-form>label{margin:15px 0 7px}
#profile-name{display:block;width:100%;padding:10px}
.appearance-field{margin:15px 0 0;padding:0;border:0;min-width:0}
.appearance-first-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.appearance-field legend{padding:0;margin-bottom:8px;font-size:12px;color:#d0dedb}
.appearance-field legend span{margin-left:8px;color:var(--muted);font-size:11px}
.head-options{display:flex;gap:8px}
.head-choice{flex:1;padding:8px 12px;font-size:12px}
.head-choice[aria-pressed=true]{border-color:#8dcfc0;background:#21423f;color:#e9faf1}
.color-options{display:flex;flex-wrap:wrap;gap:7px}
.color-choice{display:grid;place-items:center;width:30px;height:30px;padding:0;background:var(--swatch);border:2px solid #0d1d24;box-shadow:0 0 0 1px #425960;border-radius:5px}
.color-choice:hover{background:var(--swatch);box-shadow:0 0 0 2px #90b6ae}
.color-choice[aria-pressed=true]{box-shadow:0 0 0 2px #dce9ca}
.color-choice span{visibility:hidden;color:white;font-size:17px;font-weight:700;text-shadow:0 1px 2px #000,1px 0 2px #000}
.color-choice[aria-pressed=true] span{visibility:visible}
@media(max-width:550px){.appearance-first-row{grid-template-columns:1fr;gap:0}}
#profile-form .primary{margin-top:18px;padding:11px 15px}
.entry-note{margin-top:14px}
.avatar{width:48px;height:56px;flex-shrink:0}
#avatar-preview{width:38px;height:49px;image-rendering:pixelated}
@media(max-width:720px){.entry-dialog[open]{grid-template-columns:1fr}.entry-art{display:flex;min-height:170px}.entry-art .preview-heading{top:16px;font-size:9px}#character-preview{width:76px;height:98px}.entry-art small{bottom:12px;font-size:8px}.entry-content{padding:20px}.entry-orbit{width:160px;height:160px}.color-options{gap:9px}}

/* Equipment slots stay in the sidebar; hiding the panel leaves no empty row. */
.character>.equipment{padding-top:12px;margin-top:12px;border-top:1px solid var(--line)}
.equipment .section-heading{margin-bottom:10px;min-height:24px}
#equipment-close{display:grid;place-items:center;width:26px;height:24px;padding:3px;background:transparent;border-color:transparent;color:var(--muted)}
#equipment-close:hover{background:#20383e;border-color:#4d6c71;color:var(--ink)}
#equipment-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.equipment-grid{display:grid;grid-template-columns:repeat(3,52px);grid-template-areas:'. head .' 'weapon body offhand' '. legs pouch' '. feet .';grid-auto-rows:52px;gap:6px;justify-content:center;padding:0 0 4px}
.equipment-slot{position:relative;display:grid;place-items:center;border:1px solid #334c56;border-radius:5px;background:#0b1920;box-shadow:inset 0 2px 5px #0004;outline:none;cursor:default;color:#5c7882}
.equipment-slot[data-slot=head]{grid-area:head}.equipment-slot[data-slot=weapon]{grid-area:weapon}.equipment-slot[data-slot=body]{grid-area:body}.equipment-slot[data-slot=offhand]{grid-area:offhand}.equipment-slot[data-slot=legs]{grid-area:legs}.equipment-slot[data-slot=pouch]{grid-area:pouch}.equipment-slot[data-slot=feet]{grid-area:feet}
.equipment-slot.equipped{background:radial-gradient(ellipse at 50% 65%,#253e44,#13252d);border-color:#587a7c}
.equipment-slot:hover,.equipment-slot:focus-visible{border-color:var(--gold);box-shadow:inset 0 0 0 1px #d7b97966;z-index:2}
.equipment-art{width:44px;height:44px;display:block}
.equipment-slot[data-slot=pouch]{padding:0;cursor:pointer}
.equipment-slot[data-slot=pouch][aria-expanded=true]{border-color:var(--gold);background:#2b302b}
.pouch-capacity{position:absolute;right:3px;bottom:2px;z-index:1;min-width:14px;border-radius:3px;background:#142228;color:var(--gold);font-size:10px;line-height:16px;font-variant-numeric:tabular-nums}
.equipment-pouch{margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.pouch-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:11px;line-height:1.5;color:#bdcbca}.pouch-heading strong{font-weight:500}.pouch-heading>span{color:var(--gold);font-variant-numeric:tabular-nums}
.pouch-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;max-width:230px;margin:0 auto}
.pouch-slot{aspect-ratio:1;min-width:0}
.pouch-empty-mark{width:10px;height:10px;border:1px solid #31464f;border-radius:2px}
.equipment-art svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.inventory-tooltip{position:fixed;z-index:1100;width:max-content;max-width:min(240px,calc(100vw - 16px));padding:7px 10px;background:#08171bf5;border:1px solid #637b76;border-radius:4px;box-shadow:0 4px 12px #0006;color:var(--ink);pointer-events:none;overflow-wrap:anywhere;text-align:left;line-height:1.5;font-size:12px}
.inventory-tooltip strong,.inventory-tooltip>span{display:block}.inventory-tooltip>span{font-size:11px;color:var(--muted)}
.item-menu{position:fixed;z-index:1200;min-width:150px;max-width:min(260px,calc(100vw - 16px));padding:5px;background:#0b202bf5;border:1px solid #637b76;border-radius:5px;box-shadow:0 5px 18px #0008;font-size:12px;color:var(--ink)}
.item-menu-title{display:block;padding:6px 9px 8px;border-bottom:1px solid var(--line);margin-bottom:4px;overflow-wrap:anywhere;font-size:12px}
.item-menu button{display:block;width:100%;border:0;border-radius:3px;background:transparent;padding:8px 9px;text-align:left;font:inherit;color:var(--ink)}
.item-menu button:not(:disabled):hover,.item-menu button:focus-visible{background:#284b50;outline:1px solid #7fc3b7;outline-offset:-1px}
.item-menu button:disabled{color:var(--muted);opacity:.5;cursor:default}
.character .character-id{margin-bottom:0}
.character-id>div:last-child{min-width:0}.character-id strong{overflow-wrap:anywhere}

/* Item transfers use stable native drag targets and a click/keyboard alternative. */
button.equipment-slot{padding:0;min-width:0}
.equipment-slot[draggable=true]{cursor:grab}.equipment-slot[draggable=true]:active{cursor:grabbing}
.equipment-slot.drop-available{border-color:#66b8a5;box-shadow:inset 0 0 0 1px #66b8a544}
.equipment-slot.item-selected{border-color:var(--gold);box-shadow:0 0 0 2px #d7b97999}
.equipment-art{max-width:100%;pointer-events:none}
.equipment-slot.drag-source .equipment-art{opacity:0}
.equipment-slot.drag-source{background:#0b1920}
.inventory-dragging .inventory-tooltip,.inventory-dragging .ability-tooltip{display:none}
button.pouch-heading{width:100%;padding:0;border:0;background:none;text-align:left;justify-content:flex-start;color:var(--gold);cursor:pointer}
.container-panel{flex-shrink:0}.container-panel h2{font-size:11px;letter-spacing:.06em}
.container-count{margin-left:auto;white-space:nowrap;font-size:11px;color:var(--muted)}
.container-close{width:24px;height:24px;padding:0;font-size:20px;line-height:1;background:transparent;border:0;color:var(--muted)}
.container-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.pouch-slot .equipment-art{width:38px;height:38px}
.inventory-status{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:1000;max-width:90vw;padding:8px 12px;border:1px solid #8c805b;border-radius:5px;background:#0b1c23f5;color:var(--gold);font-size:11px;line-height:1.5;pointer-events:none}

/* XP follows the bottom edge of the world, with details on hover or focus. */
.world-xp.meter{position:absolute;z-index:9;left:0;right:0;bottom:0;height:7px;border-radius:0;background:#14242a;box-shadow:0 -1px 0 #5f695b;cursor:default;transition:height .15s}
.world-xp.meter i{background:#c6ab6c}
.world-xp>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;font-size:11px;font-weight:600;color:#fff5d9;text-shadow:0 1px 2px #000,0 0 5px #000;pointer-events:none}
.world-xp:hover,.world-xp:focus-visible{height:20px;outline:1px solid var(--gold);outline-offset:-1px}
.world-xp:hover>span,.world-xp:focus-visible>span{opacity:1}

/* Resources stay with character identity, independently of the chat layout. */
.world-column .chat{display:flex;padding:10px}
.chat-content{display:flex;flex:1;flex-direction:column;min-width:0;min-height:0;padding-top:2px}
.character-resources{display:grid;gap:10px;margin:14px 0 2px}
.character-resource .stat-row{margin:0 0 5px;font-size:11px}
.character-resource .stat-row>span:last-child{font-variant-numeric:tabular-nums}
.character-resource .meter{height:7px}
.character-resource .meter i{height:100%;transition:width .15s}
.character-resource .health i{background:linear-gradient(90deg,#884a40,#bb8271)}
.character-resource .energy i{background:linear-gradient(90deg,#348e92,#6ed6cf)}
.world-column.chat-collapsed{grid-template-rows:minmax(240px,1fr) 36px}
.world-column.chat-collapsed .chat{height:36px;min-height:36px;padding:4px 8px}
.chat-collapsed .chat-content{padding:0}
.chat-collapsed .chat-header{margin:0;padding:0}
.chat-collapsed .chat-header-actions #online-count{display:none}
@media(max-width:720px){.world-column .chat{padding:8px}.chat-header{gap:6px}.chat-header-actions #online-count{display:none}.equipment-grid{grid-template-columns:repeat(3,52px)}}
@media(prefers-reduced-motion:reduce){.world-xp.meter,.character-resource .meter i{transition:none}}

/* Skill levels use the same compact, optional sidebar panel as equipment. */
.skills-panel{flex-shrink:0;padding:12px 14px}.skills-panel .section-heading{margin-bottom:12px}.skills-panel .section-heading button{margin-left:auto;border:0;background:none;font-size:20px;line-height:1;padding:0 4px;color:var(--muted)}
.skill-row{display:grid;grid-template-columns:1fr auto;gap:4px 8px;font-size:12px;margin-top:9px}.skill-row strong{color:var(--gold);font-variant-numeric:tabular-nums}.skill-meter{grid-column:1/-1;height:3px;background:#233a42;overflow:hidden;border-radius:2px}.skill-meter i{display:block;height:100%;background:#84bbae}
.character-menu{gap:6px}.character-menu .utility-button{width:40px;flex:0 1 40px;min-width:32px;padding:8px}
.actionbar{flex-wrap:wrap}.ability-tooltip{width:260px;white-space:normal}.ability.is-active{border-color:#99ddc5;box-shadow:inset 0 0 0 1px #99ddc5}.ability.is-active .ability-icon{color:#baffd9}
#activity-progress{position:absolute;z-index:8;bottom:96px;left:50%;transform:translateX(-50%);max-width:95%;white-space:nowrap;padding:9px 12px;border:1px solid #7cae9c;border-radius:4px;background:linear-gradient(90deg,#274d46 var(--activity),#10262f var(--activity));color:#d7f4e4;font-size:12px;pointer-events:none}

/* Player selection, trading and physical datapad notes. */
.affiliation-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0 16px}.affiliation-fields label{min-width:0}.affiliation-fields select{display:block;width:100%;margin-top:6px;padding:10px 8px;border:1px solid #486269;border-radius:5px;background:#0d222b;color:#e6f2eb;font:12px Verdana}.affiliation-fields select:disabled{color:var(--muted);opacity:.7}
.character-id #player-affiliation{color:var(--muted);font-size:10px;line-height:1.5;margin-top:4px}
#inspect-dialog{width:390px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 28px);overflow:auto}
#inspect-dialog .dialog-inner{padding:22px}
.inspect-heading{display:flex;align-items:center;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--line)}
#inspect-portrait{width:76px;height:98px;object-fit:contain;flex-shrink:0;image-rendering:pixelated;background:#15353e;border:1px solid #446c71;border-radius:6px}
.inspect-heading>div{flex:1;min-width:0}.inspect-heading h2{margin:6px 0 0;font:600 20px/1.4 Verdana;overflow-wrap:anywhere}
#inspect-close{align-self:flex-start;flex-shrink:0;width:30px;height:30px;padding:0;font-size:24px;line-height:1;color:var(--muted);background:transparent}
.inspect-details{margin:18px 0 10px;font-size:13px;line-height:1.6}.inspect-details>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:10px}.inspect-details dt{color:var(--muted)}.inspect-details dd{margin:0;text-align:right;font-weight:600;overflow-wrap:anywhere}.inspect-details>div:first-child dd{color:var(--gold)}
.inspect-health.meter{height:6px}.inspect-health i{background:#83c3ac}
.roster-icon.player{color:#9cdbd3}.roster-row:has(.player) .roster-hp i{background:#83c3ac}
.character-menu{gap:5px}.character-menu .utility-button{width:36px;min-width:0;height:38px;padding:7px;flex-shrink:1}
#trade-invitation{position:fixed;z-index:35;right:18px;bottom:18px;max-width:340px;padding:16px;background:#10252ff5;border:1px solid #92b6a7;border-radius:7px;box-shadow:0 5px 25px #0008}
#trade-invitation p{font-size:13px;line-height:1.6;margin:0 0 12px}#trade-invitation>div{display:flex;gap:8px}#trade-invitation button{font-size:12px;padding:8px 10px}
.trade-dialog{width:740px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 28px);overflow:auto}.trade-dialog .dialog-inner,#notebook-dialog .dialog-inner{padding:22px}
.trade-dialog h2,#notebook-dialog h2{font:600 20px Verdana;margin:0 0 12px}.trade-dialog .dialog-inner>p,#notebook-dialog .dialog-inner>p{font-size:12px;line-height:1.6}
.trade-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}.trade-columns>section{min-width:0;border:1px solid #476267;border-radius:5px;padding:12px;background:#0d1d25}.trade-columns h3{font-size:13px;color:var(--gold);margin:0 0 12px}#trade-mine-count{float:right;color:var(--muted)}
#trade-my-items,#trade-their-items{max-height:310px;overflow:auto;font-size:12px;scrollbar-width:thin}#trade-my-items label{display:flex;align-items:center;gap:8px;padding:5px;border-radius:4px;cursor:pointer}#trade-my-items label:has(:checked){background:#28483f;outline:1px solid #72a592}#trade-my-items input{width:16px;height:16px;flex-shrink:0;accent-color:#84cebb}
.trade-item{display:flex;align-items:center;gap:8px;min-width:0;padding:3px 0}.trade-item .equipment-art{width:32px;height:36px;flex-shrink:0}.trade-item small{display:block;color:var(--muted);font-size:10px;line-height:1.5}.trade-dialog .dialog-actions{margin-top:12px;flex-wrap:wrap}.trade-dialog .dialog-actions button{font-size:12px;padding:10px 12px}
#notebook-dialog{width:600px;max-height:calc(100dvh - 28px);overflow:auto}#notebook-dialog label{font-size:12px;color:var(--gold)}#notebook-text{display:block;width:100%;resize:vertical;min-height:180px;max-height:50dvh;margin:8px 0;padding:12px;line-height:1.7;font:14px/1.7 Verdana;color:#e6f2eb;background:#0a1b22;border:1px solid #547477;border-radius:5px}
@media(max-width:560px){.trade-columns{grid-template-columns:1fr}#trade-my-items,#trade-their-items{max-height:180px}.trade-dialog .dialog-inner,#notebook-dialog .dialog-inner{padding:14px}}

.container-password{width:100%;font-size:11px;padding:7px 10px;margin:0 0 10px;color:var(--cyan);background:#142e36;border-color:#426269}
#chest-password-dialog{width:430px;max-height:calc(100dvh - 28px);overflow:auto}#chest-password-dialog .dialog-inner{padding:24px}#chest-password-dialog h2{font:600 20px Verdana;margin:0 0 14px}#chest-password-dialog p{font-size:12px;line-height:1.6}#chest-password-dialog label{display:block;font-size:12px;color:#bdcbd0;margin:14px 0}#chest-password-dialog input{display:block;width:100%;margin-top:7px}#chest-password-status{min-height:20px;color:var(--gold)}#chest-password-dialog .dialog-actions{margin-top:16px}#chest-password-dialog button{font-size:12px;padding:10px 12px}

#notebook-name{display:block;width:100%;margin:8px 0 16px;font:14px/1.5 Verdana}#notebook-text{min-height:140px;max-height:40dvh}

/* Projection covers the map only; the conversation below remains usable. */
.holo-panel{position:absolute;inset:0;z-index:70;display:flex;flex-direction:column;min-height:0;background:#08171eee;color:var(--ink);backdrop-filter:blur(8px)}
.holo-overlay{position:absolute;z-index:3;top:10px;left:12px;right:10px;display:flex;align-items:flex-start;gap:12px;pointer-events:none;background:transparent;border:0}
.holo-overlay .holo-caption{font-size:10px;line-height:1.5;color:#d7e5e9;opacity:.55;transition:opacity .2s}
.holo-overlay>div{flex:1;min-width:0}.holo-overlay strong{display:block;font-size:11px;font-weight:500}.holo-overlay #holo-host{display:block;overflow-wrap:anywhere}
.holo-has-media .holo-overlay .holo-caption{opacity:.08}
#holo-close{flex:0 0 28px;width:28px;height:28px;padding:0;border:0;background:transparent;color:#d7e5e9;font-size:22px;line-height:1;box-shadow:none;pointer-events:auto;opacity:.65}
.holo-has-media #holo-close{opacity:.3}#holo-close:hover,#holo-close:focus-visible{opacity:1;color:#fff;background:#08171e80}#holo-close:focus-visible{outline:1px solid #b8dcd9;outline-offset:2px}
.holo-session{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 16px;font-size:11px;color:var(--muted)}.holo-session>span:first-child{color:var(--cyan);margin-right:auto}.holo-session button,.holo-controls button,.holo-footer button{padding:7px 11px;font-size:11px}
.holo-controls{padding:0 16px 9px}.holo-controls form,.holo-playback{display:flex;align-items:center;gap:8px;min-width:0}.holo-controls label{font-size:11px;white-space:nowrap}.holo-controls input{padding:7px 9px;min-width:0;background:#0c202a;border:1px solid var(--line);border-radius:4px;color:var(--ink);font-size:12px}.holo-controls input[type=url]{flex:1}.holo-playback{margin-top:8px;flex-wrap:wrap}.holo-playback>button:last-child{margin-left:auto}#holo-time{width:90px}
.holo-screen{flex:1;min-height:200px;position:relative;background:#050b10}#holo-video{position:absolute;inset:0;display:flex;justify-content:center;align-items:center}#holo-video iframe{height:100%;width:100%;border:0}#holo-waiting{position:absolute;inset:0;display:grid;place-content:center;margin:0;padding:20px;font-size:14px;color:var(--muted);pointer-events:none}.holo-footer{display:flex;align-items:center;justify-content:center;gap:10px;font-size:11px;padding:6px 12px;min-height:28px;color:var(--gold)}.holo-footer:has(#holo-error:empty):has(#holo-retry[hidden]){display:none}
#card-dialog{width:min(520px,calc(100vw - 32px))}#card-resources{border:1px solid var(--line);padding:12px;display:grid;gap:12px}#card-resources label{display:flex;gap:12px;align-items:center;font-size:13px}#card-resources input{width:16px;height:16px;accent-color:var(--cyan)}#card-status{line-height:1.6;font-size:13px;color:var(--muted)}#card-dialog button{padding:9px 12px}
@media(max-height:650px){.holo-controls{padding-bottom:5px}.holo-panel{overflow:auto}.holo-screen{flex:1 0 200px}}

/* Shared documents, pictures and direct videos. */
#holo-video>img,#holo-video>video{width:100%;height:100%;object-fit:contain}#holo-video>canvas{display:block;max-width:100%;max-height:100%}
#holo-kind{font-size:11px;padding:7px;max-width:105px}.holo-file-help{display:block;color:var(--muted);font-size:10px;line-height:1.5;margin-top:6px}
#holo-pages,.holo-upload-progress{display:flex;align-items:center;gap:8px}#holo-page{width:64px}#holo-page-count{font-size:11px;white-space:nowrap}.holo-upload-progress{margin-top:8px;font-size:11px}.holo-upload-progress progress{flex:1;min-width:50px;accent-color:var(--cyan)}
@media(max-width:900px){#holo-load-form{flex-wrap:wrap}#holo-url{min-width:130px}.holo-controls{padding-left:10px;padding-right:10px}}

/* Social gestures open above the chat without changing its height. */
#gestures-toggle{display:grid;place-items:center;height:30px;align-self:center;padding:0;line-height:0;color:var(--gold)}
#gestures-toggle svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
#gestures-toggle.active,#gestures-toggle[aria-expanded=true]{background:#244e4a;border-color:var(--cyan)}
#gestures-panel{position:fixed;z-index:60;width:296px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);overflow:auto;background:#10252cf5;border:1px solid #52777b;border-radius:8px;padding:12px;box-shadow:0 8px 28px #0008}
.gesture-heading{display:flex;align-items:center;justify-content:space-between;font-size:13px}.gesture-heading button{width:26px;height:26px}
#gestures-panel h3{margin:12px 0 7px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.gesture-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.gesture-choices.reaction{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.gesture-choices.reaction button{min-width:0;min-height:36px;padding:3px}
.gesture-choices button{position:relative;display:grid;place-items:center;min-height:42px;padding:6px}.gesture-choices button[aria-pressed=true]{background:#28564e;border-color:var(--cyan);color:var(--cyan)}
.gesture-choices svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.gesture-choices canvas{width:26px;height:26px}
.gesture-tooltip{display:none}#gestures-panel .gesture-end{width:100%;padding:7px;margin-top:12px;font-size:11px}

/* Editable action slots and the non-modal ability list. */
.actionbar .ability[aria-disabled=true]{opacity:.5;cursor:default}
.actionbar .ability[aria-disabled=true] .ability-icon{color:#8e9b9e}
.actionbar .ability[aria-disabled=true]:hover{border-color:#40565d;background:#142933}
.actionbar .ability.empty{background:#0a1d2788;border-style:dashed;opacity:1}
.actionbar .ability,.catalogue-ability{touch-action:none;user-select:none;-webkit-user-select:none}
.actionbar .ability-slot.drop-target .ability,.actionbar.hotbar-moving .ability:hover{border-color:var(--gold);box-shadow:inset 0 0 0 2px var(--gold)}
.hotbar-dragging .ability-tooltip{display:none!important}
.drag-source .ability-icon{opacity:0!important}
.hotbar-drag-ghost{position:fixed;z-index:100;width:44px;height:44px;display:grid;place-items:center;pointer-events:none;background:#12333eed;border:1px solid var(--gold);border-radius:4px;box-shadow:0 4px 16px #0008}
.hotbar-drag-ghost .ability-icon{width:28px;height:28px;line-height:0}.hotbar-drag-ghost svg{width:100%;height:100%;fill:none;stroke:var(--cyan);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ability-catalogue{position:absolute;z-index:12;right:12px;bottom:96px;width:294px;max-width:calc(100% - 24px);max-height:calc(100% - 115px);display:flex;flex-direction:column;padding:12px;border:1px solid #63858a;border-radius:7px;background:#0d222bf5;box-shadow:0 6px 20px #0007}
.ability-catalogue header{display:flex;align-items:center;justify-content:space-between;font-size:13px}.ability-catalogue header button{width:25px;height:25px;padding:0;font-size:20px}
.ability-catalogue p{margin:8px 0;font-size:10px;line-height:1.6;color:var(--muted)}
#ability-catalogue-status:empty{display:none}
#ability-catalogue-list{display:grid;gap:5px;min-height:0;overflow-y:auto;scrollbar-width:thin}
.catalogue-ability{display:grid;grid-template-columns:28px 1fr;gap:9px;align-items:center;padding:7px;text-align:left;cursor:grab}
.catalogue-ability .ability-icon{display:block;width:28px;height:28px;color:var(--cyan)}
.catalogue-ability svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.catalogue-ability>span:last-child{display:grid;gap:3px}.catalogue-ability strong{font-size:11px}.catalogue-ability span span,.catalogue-ability small{font-size:10px;color:var(--muted)}.catalogue-ability:not(.on-hotbar) small{color:var(--gold)}

/* The world fills the browser; all controls are overlays within it. */
.workspace{display:block;width:100%;height:100dvh;min-height:320px;padding:0}
.world-column,.world-column.chat-collapsed{display:block;position:relative;width:100%;height:100%;min-height:0}
.world-column .world-panel{position:absolute;inset:0;width:100%;height:100%;min-height:0;border:0;border-radius:0}
.character-resources{position:absolute;z-index:12;left:16px;top:16px;width:240px;max-width:calc(50% - 24px);margin:0;gap:7px;pointer-events:none}
.character-resource{position:relative;height:23px;border:1px solid #879ba977;border-radius:5px;overflow:hidden;background:#091824da;box-shadow:0 2px 7px #0005}
.character-resources .stat-row{position:absolute;inset:0;z-index:1;margin:0;padding:0 8px;display:flex;align-items:center;font-size:11px;font-weight:600;color:#f4f5fa;text-shadow:0 1px 2px #000}
.character-resources .meter{height:100%;border-radius:0;background:transparent}
.character-resource .health i{background:linear-gradient(#cc4d52,#922e3d)}
.character-resource .energy i{background:linear-gradient(#3f89dc,#275bb0)}
.world-panel .journal-panel{top:86px;left:16px;max-width:300px}
.world-panel .minimap-button{top:44px;right:16px;width:205px}
.sidebar-header{position:absolute;z-index:11;top:16px;right:18px;padding:0;margin:0}
.sidebar-header .server-status{margin:0;font-size:10px;background:#0b1f2bb8;padding:3px 6px;border-radius:4px}
.world-panel .character-menu{position:absolute;z-index:12;top:245px;right:16px;display:flex;gap:5px;padding:0;margin:0;background:transparent}
.character-menu .utility-button{position:relative;width:30px;height:30px;padding:5px;margin:0;background:#0d2431da}
.character-menu .utility-button svg{width:18px;height:18px}
.character-menu .utility-button kbd{position:absolute;bottom:0;right:1px;font-size:8px;border:0;background:#10202b;padding:0 2px}
.character-menu #leave-button{margin:0}
.world-column .actionbar{width:min(546px,calc(100% - 24px));grid-template-columns:repeat(11,minmax(0,1fr));bottom:24px}
.world-column .chat{position:absolute;z-index:12;left:16px;bottom:24px;width:min(390px,calc((100% - 546px)/2 - 32px));height:190px;min-height:0;max-height:32dvh;padding:8px;border-color:#597b8677;background:#0b1f2baa;backdrop-filter:blur(2px);box-shadow:0 3px 12px #0003;border-radius:6px}
.world-column .chat #chat-messages,.world-column .chat #chat-input{font-size:11px;line-height:1.6}
.chat-header-actions #online-count{display:none}
.chat-header{margin-bottom:6px}
.world-column.chat-collapsed .chat{height:36px;min-height:36px;max-height:36px;padding:4px 8px}
.chat-tabs button{font-size:10px}
.pouch-hud{position:absolute;z-index:12;right:16px;bottom:24px;padding:7px 8px;border:1px solid #597b8677;border-radius:6px;background:#0b1f2baa;box-shadow:0 3px 12px #0003}
.pouch-hud .equipment-pouch{margin:0;padding:0;border:0}
.pouch-hud .pouch-heading{font-size:10px;padding:0;margin:0 0 6px;color:#bbcace}
.pouch-hud .pouch-slots{display:grid;grid-template-columns:repeat(5,38px);gap:4px;margin:0;padding:0}
.pouch-hud .equipment-slot{width:38px;height:38px;min-width:0;margin:0;padding:4px;grid-template:minmax(0,1fr)/minmax(0,1fr)}
.pouch-hud .equipment-art{width:100%;height:100%;min-width:0;min-height:0}
.character-window{position:absolute;z-index:20;top:50%;left:50%;transform:translate(-50%,-50%);width:530px;max-width:calc(100% - 32px);max-height:calc(100% - 130px);padding:16px;overflow:auto;scrollbar-width:thin;background:#0c222bef;border-color:#5a8089;box-shadow:0 10px 35px #0008}
.window-heading{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:1px solid #62838b66;margin-bottom:14px;font-size:13px}
.window-heading button{width:26px;height:26px;padding:0;font-size:21px}
.character-window-content{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.character-window .character{padding:0;min-width:0}
.character-window .character-id{margin:0 0 12px;gap:9px}
.character-window .character-id strong{font-size:16px}
.character-window .character-id span{font-size:10px}
.character-window .equipment{border-top:1px solid var(--line);margin-top:12px;padding-top:12px}
.character-window .equipment-grid{grid-template-columns:repeat(3,48px);gap:6px;justify-content:center}
.character-window .equipment-slot{width:48px;height:48px}
.character-window .skills-panel{margin:0;padding:0;border:0;background:none}
.character-window .skills-panel .section-heading{margin-bottom:16px}
.world-panel .container-panel{position:absolute;z-index:21;right:16px;bottom:112px;width:258px;max-width:calc(100% - 32px);max-height:calc(100% - 365px);min-height:120px;overflow:auto;scrollbar-width:thin;padding:12px;background:#0c222bef;border-color:#5a8089;box-shadow:0 8px 25px #0007}
.container-panel .section-heading{margin-bottom:10px}
.container-panel .container-slots{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.container-panel .equipment-slot{width:100%;height:auto;aspect-ratio:1;min-width:0}
.ability-catalogue{right:16px;bottom:110px;width:294px;max-height:calc(100% - 130px);z-index:25}
.world-panel:has(#holo-panel:not([hidden])) .chat{z-index:80}
@media(max-width:1100px){.world-column .chat{bottom:102px;width:330px;max-width:calc(100% - 32px);height:165px}.pouch-hud{bottom:102px}.world-panel .container-panel{bottom:192px;max-height:calc(100% - 270px)}.ability-catalogue{right:50%;transform:translateX(50%);bottom:102px}}
@media(max-width:600px){.character-window-content{grid-template-columns:1fr}.character-window{width:310px;max-height:calc(100% - 120px)}.character-window .skills-panel{border-top:1px solid var(--line);padding-top:12px}.character-resources{left:10px;top:10px;width:200px}.world-panel .minimap-button{right:10px;top:38px;width:112px}.sidebar-header{top:10px;right:10px}.world-panel .character-menu{top:159px;right:10px}.world-panel .journal-panel{left:10px;top:80px;max-width:calc(100% - 142px)}.world-column .chat{left:10px;bottom:160px;width:calc(100% - 20px);height:125px;max-height:25dvh}.pouch-hud{right:10px;bottom:88px}.world-panel .container-panel{right:10px;bottom:160px;max-height:calc(100% - 350px)}.world-panel .target-overlay{top:76px;max-width:calc(100% - 24px)}.ability-catalogue{bottom:92px}}
.world-column .chat.chat-sized{width:var(--chat-width);max-width:none}
.world-column:not(.chat-collapsed) .chat.chat-sized{height:var(--chat-height);max-height:none}
.world-column .chat #chat-messages{max-height:none}
#chat-resize{position:absolute;right:0;top:0;width:18px;height:18px;padding:1px;border:0;border-radius:0 5px 0 0;background:transparent;color:#9bc7cd;cursor:ne-resize;touch-action:none;z-index:2}
#chat-resize svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5}
.world-column .chat-header-actions{padding-right:10px}
.chat-collapsed #chat-resize{display:none}
.pouch-hud .pouch-heading{cursor:grab;touch-action:none;user-select:none;display:flex;justify-content:space-between;gap:8px}
.pouch-hud .pouch-heading::after{content:'⠿';color:#99b6bc}
.pouch-hud .pouch-heading:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.hud-arranging,.hud-arranging *{user-select:none!important}
.hud-arranging .inventory-tooltip{display:none}
.hud-arranging .pouch-heading{cursor:grabbing}
.journal-window{position:absolute;z-index:23;left:50%;top:50%;transform:translate(-50%,-50%);width:440px;max-width:calc(100% - 32px);max-height:calc(100% - 100px);overflow-y:auto;scrollbar-width:thin;background:#0c2029f5;box-shadow:0 12px 50px #0007}
.journal-tabs{display:flex;gap:6px;margin:0 0 16px;border-bottom:1px solid #527680}
.journal-tabs button{flex:1;padding:9px 8px;border-radius:5px 5px 0 0;font-size:12px;color:#aabec4}
.journal-tabs button[aria-selected=true]{color:#e1f5ef;background:#2a514f;border-color:#82c3b5;box-shadow:inset 0 3px #9ed7c8}
.journal-entry{border:1px solid var(--line);border-radius:5px;margin-top:8px}
.journal-entry>header{display:flex;align-items:center;justify-content:space-between;gap:6px;background:#142d36;border-radius:4px}
.journal-entry h3{flex:1;min-width:0;font-family:inherit;font-size:14px;margin:0;line-height:1.5}
.journal-entry .quest-summary{font:inherit;padding:9px 10px}
.journal-entry .quest-summary:focus-visible{outline-offset:-3px}
.journal-entry .quest-pin{margin-right:6px}
.journal-entry-details{padding:0 12px 12px}
.quest-pin{width:32px;height:32px;flex-shrink:0;padding:6px;color:#b6c8cd}
.quest-pin svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.quest-pin[aria-pressed=true]{color:#e7c780;border-color:#bda463;background:#403d2c}
.quest-pin[aria-pressed=true] svg{fill:#bda46355}
.journal-empty{font-size:12px;line-height:1.8;color:var(--muted);margin:16px 0}

.hud-pin{width:23px;height:23px;padding:4px;background:#132a35aa;color:#a7bec4;border:1px solid #52707c77}
.hud-pin svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.hud-pin[aria-pressed=true]{color:#f1d08c;border-color:#baa471;background:#453c26}
.hud-pin[aria-pressed=true] svg{fill:#bda46355}
#pouch-pin{position:absolute;top:3px;right:5px;z-index:2;width:22px;height:22px}
.pouch-hud .pouch-heading{padding-right:25px}
.pouch-hud.pouch-locked .pouch-heading{cursor:default}
.pouch-hud.pouch-locked .pouch-heading::after{visibility:hidden}
#content-password-dialog label{display:flex;flex-direction:column;gap:6px;margin:12px 0;font-size:12px}
#notebook-name[readonly],#notebook-text[readonly]{color:#c8d6dc;background:#142831}
#notebook-dialog .dialog-actions{flex-wrap:wrap}

#chat-move{flex:1;min-width:24px;height:26px;padding:0;border:0;background:transparent;box-shadow:none;color:#99b6bc88;cursor:grab;touch-action:none;user-select:none}
#chat-move:hover{color:#bdd6dc;background:#60808b15}
#chat-move:focus-visible{outline:1px solid var(--gold);outline-offset:-2px}
.chat-locked #chat-move{cursor:default}
.chat-locked #chat-move span{visibility:hidden}

.target-overlay #target-player-info{font-size:11px;line-height:1.5;text-align:center;margin:4px 0 0;color:#d1e5e5;overflow-wrap:anywhere}

.ground-items{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}.ground-item{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;padding:1px;border:1px solid transparent;background:transparent;border-radius:4px}.ground-item:hover,.ground-item:focus-visible,.ground-item.is-picked{background:#10252b88;border-color:#d1b775}.ground-item .equipment-art{display:block;width:100%;height:100%}.ground-item-label{display:none;position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:#10232ded;padding:4px 7px;border-radius:3px;white-space:nowrap;font-size:11px;color:#dbe8e5}.ground-item:hover .ground-item-label,.ground-item:focus-visible .ground-item-label,.ground-item.is-picked .ground-item-label{display:block}

#help-dialog{width:960px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}#help-dialog .dialog-inner{padding:22px}#help-dialog h2{margin:0;font-size:22px}#help-dialog .keyboard-intro{font-size:12px;margin:12px 0}.keyboard-row{display:flex;gap:5px;margin:5px 0;justify-content:center}.keyboard-row:nth-child(2){padding-left:25px}.keyboard-row:nth-child(3){padding-left:40px}.keyboard-key{flex:1;min-width:0;max-width:90px;min-height:60px;padding:5px;text-align:left;background:#0c1c24;border-bottom-width:3px;color:#7f969c}.keyboard-row:nth-child(4),.keyboard-row:nth-child(5){display:grid;grid-template-columns:repeat(9,minmax(0,90px))}.keyboard-row:nth-child(5) .keyboard-key:first-child{grid-column:7}.keyboard-key strong{display:block;font-size:14px}.keyboard-key small{font-size:9px;line-height:1.3;display:block;margin-top:6px;overflow-wrap:anywhere}.keyboard-key.is-bound{color:#d4e9e3;border-color:#507c78;background:#193c40}.keyboard-key:hover,.keyboard-key:focus-visible{background:#26575a;color:#fff}#keyboard-description{font-size:13px!important;min-height:44px;margin:14px 0;padding:10px;background:#0c1b23;border-radius:5px}.help-more{margin:12px 0;font-size:12px}.help-more summary{cursor:pointer;color:var(--gold)}@media(max-width:600px){#help-dialog .dialog-inner{padding:12px}.keyboard-row{gap:3px}.keyboard-key{padding:3px;min-height:54px}.keyboard-key small{font-size:8px}.keyboard-row:nth-child(2),.keyboard-row:nth-child(3){padding-left:12px}}

.training-checklist{padding:12px;border:1px solid var(--line);border-radius:5px;background:#0b1c25;margin:12px 0}.training-checklist ol{list-style:none;padding:0;margin:10px 0;max-height:220px;overflow:auto}.training-checklist li{font-size:12px;padding:5px 0;color:var(--muted)}.training-checklist li.done{color:var(--cyan)}#training-dialog{width:600px;max-height:calc(100dvh - 24px);overflow:auto}#training-dialog label{display:block;font-size:12px;margin:12px 0}#training-dialog input,#training-dialog textarea{display:block;width:100%;margin-top:6px;font:inherit;color:var(--ink);background:#0c202b;border:1px solid var(--line);padding:9px}#training-status{color:var(--gold)}.lesson-controls{border-top:1px solid var(--line);padding-top:10px;margin-top:8px;font-size:12px}.lesson-controls>div{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.lesson-controls select{max-width:260px;font-size:12px;padding:6px}.lesson-controls p{font-size:12px;color:var(--muted);margin:8px 0}

/* Hide overlays without changing their layout or individual visibility settings. */
body.actionbar-hidden .actionbar,body.actionbar-hidden .actionbar *,
body.ui-hidden .world-panel > :not(#game):not(.ground-items):not(#connection-panel),
body.ui-hidden .world-panel > :not(#game):not(.ground-items):not(#connection-panel) *,
body.ui-hidden :is(#gestures-panel,#trade-invitation,.item-menu,.inventory-tooltip),
body.ui-hidden :is(#gestures-panel,#trade-invitation,.item-menu,.inventory-tooltip) *,
body.ui-hidden .ground-item-label{visibility:hidden!important;pointer-events:none!important}

body.chat-hidden .chat,body.chat-hidden .chat *{visibility:hidden!important;pointer-events:none!important}
button:has(> .close-icon){display:grid;place-items:center;padding:0;line-height:1;flex-shrink:0}
button > svg.close-icon{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

.pouch-items{display:flex;align-items:flex-end;gap:8px}
.pouch-trash{width:32px;height:38px;padding:5px;display:grid;place-items:center;background:#13262dde;color:#96acb0;flex-shrink:0}
.pouch-trash svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pouch-trash:hover,.pouch-trash[aria-pressed=true],.pouch-trash.drop-available{color:#ffd5cd;border-color:#d89285;background:#523733}
#discard-dialog{max-width:390px}#discard-name{color:var(--gold);font-weight:600;overflow-wrap:anywhere}#discard-confirm{background:#703e3c;border-color:#b97d71;color:#fff}

/* Floating windows open centrally; their headings remain reachable while dragging. */
.window-drag-handle{cursor:grab;touch-action:none;user-select:none}
.window-drag-handle:focus-visible{outline:1px solid #8acabd;outline-offset:3px;border-radius:3px}
.window-dragging,.window-dragging .window-drag-handle{cursor:grabbing;user-select:none}
.movable-window{max-width:calc(100vw - 24px)}
.world-panel .movable-window{max-height:calc(100dvh - 24px)}
#trade-invitation{width:340px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}
#trade-invitation h2{font:600 15px/1.5 Verdana;margin:0 0 12px;color:var(--ink)}
#npc-offer-dialog{width:440px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}
#npc-offer-dialog .dialog-inner{padding:20px}
#npc-offer-dialog h2{margin:0;font:600 17px/1.4 Verdana}
#npc-offer-dialog p{font-size:13px;line-height:1.7}
#npc-offer-hint:empty{display:none}
#npc-offer-dialog .dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}

/* Private conversations share the compact, movable chat window. */
.chat-tabs{min-width:0;max-width:calc(100% - 90px);overflow-x:auto;scrollbar-width:thin;flex-shrink:1}
.chat-tabs [role=tab]{flex-shrink:0;white-space:nowrap}
#chat-private-messages{flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;overflow-wrap:anywhere;font-size:11px;line-height:1.6;color:#c9bada}
#chat-private-messages b{color:#d9c5ef;font-weight:600}
#chat-private-messages .chat-time{color:#b19fbe}
#chat-recipient{font-size:10px;color:#d9c5ef;padding-top:5px}
#chat-send-error{font-size:11px;line-height:1.4;color:#f2ae95;margin:4px 0 0}
#chat-form{position:relative;flex-shrink:0}
#chat-recipients{position:absolute;bottom:100%;left:0;right:0;max-height:150px;overflow-y:auto;padding:4px;background:#10212af5;border:1px solid #547078;border-radius:4px;z-index:3}
#chat-form #chat-recipients button{display:block;width:100%;text-align:left;padding:6px 9px;border:0;background:transparent;font-size:12px}
#chat-form #chat-recipients button:hover,#chat-form #chat-recipients [aria-selected=true]{background:#294d48}

#chat-announcements{flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;overflow-wrap:anywhere;font-size:11px;line-height:1.6;color:#ebddbb}
#chat-announcements b{color:#efcc78}#chat-announcements .chat-entry{padding:8px 0;border-bottom:1px solid #c7b47522}
#chat-announcements-empty{font-size:12px;color:var(--muted);padding:12px 0;flex:1}

.pouch-hud .pouch-heading > span { white-space: nowrap; }
.pouch-hud .pouch-credits { margin-left: auto; color: #e3c779; }
.pouch-hud .pouch-heading::after { flex: 0 0 auto; }
.trade-credit-input { display: flex; gap: 8px; margin-top: 6px; }
.trade-credit-input input { width: 100%; min-width: 0; }
#trade-balance, #trade-their-credits { font-size: 12px; color: #e3c779; }

#chat-system { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; overflow-wrap: anywhere; font-size: 11px; line-height: 1.6; color: var(--muted); }

#management-dialog { width: min(640px, calc(100vw - 28px)); }
#management-target { color: var(--gold, #dfbf78); margin-top: 0; }
.management-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.management-actions button { min-height: 42px; text-align: left; }
.management-hint { color: #aabec4; font-size: 13px; line-height: 1.5; }
.management-profiles { max-height: 240px; overflow: auto; margin: 10px 0; }
.management-check { display: flex; align-items: center; gap: 10px; padding: 7px 4px; font-size: 14px; }
.management-check input { flex: none; width: 17px; height: 17px; margin: 0; accent-color: #83dbca; }
#management-body fieldset { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; margin-top: 10px; }
#management-body select, #management-body input[type=search] { width: 100%; }
#management-status { color: #efb29c; }

.quest-steps .quest-note { display: block; margin: .4rem 0 0 1rem; font-size: .82em; color: var(--muted, #adc3c5); overflow-wrap: anywhere; }
dialog.confirmation-window::backdrop { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
#npc-offer-dialog, #discard-dialog { width: 380px; max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); }
#npc-offer-dialog .dialog-inner, #discard-dialog .dialog-inner { padding: 16px; }
#npc-offer-dialog h2, #discard-dialog h2 { font-size: 17px; }
#npc-offer-dialog .dialog-actions, #discard-dialog .dialog-actions { margin-top: 16px; gap: 8px; }
#npc-offer-dialog .dialog-actions button, #discard-dialog .dialog-actions button { padding: 9px 12px; font-size: 13px; }
.confirmation-hint { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 14px; margin: 14px 0 0; color: var(--muted); font-size: 11px; }
.confirmation-hint span { white-space: nowrap; }
.confirmation-hint kbd { font-size: 10px; padding: 2px 4px; }

/* Menu grows leftwards from the bottom-right corner. */
.world-panel .character-menu{top:auto;bottom:16px;right:16px;left:auto;justify-content:flex-end;flex-wrap:wrap;width:max-content;max-width:calc(100% - 32px)}
.world-panel .pouch-hud{bottom:62px}
@media(max-width:1200px){.world-panel .actionbar{bottom:56px}.world-panel .pouch-hud{bottom:148px}.world-column .chat{bottom:148px}.ability-catalogue{bottom:148px}}
@media(max-width:600px){.world-panel .character-menu{bottom:10px;right:10px}.world-panel .actionbar{bottom:50px}.world-panel .pouch-hud{bottom:136px}.world-column .chat{bottom:210px}}
#mail-dialog{width:560px}#npc-dialog{width:360px}#npc-quest-dialog{width:480px}
#mail-dialog,#npc-dialog,#npc-quest-dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}
#mail-dialog::backdrop,#npc-dialog::backdrop,#npc-quest-dialog::backdrop{background:transparent;backdrop-filter:none}
#mail-dialog .dialog-inner,#npc-dialog .dialog-inner,#npc-quest-dialog .dialog-inner{padding:18px}
#mail-dialog h2,#npc-dialog h2,#npc-quest-dialog h2{margin:0;font:600 17px/1.4 Verdana}
#mail-dialog p,#npc-dialog p,#npc-quest-dialog p{font-size:13px;line-height:1.65}
#mail-dialog button:not(.window-heading button),#npc-dialog button:not(.window-heading button),#npc-quest-dialog button:not(.window-heading button){padding:9px 12px;font-size:13px}
.npc-options{display:grid;gap:8px}.npc-options button{text-align:left}#npc-quest-back{margin-top:16px}#npc-quest-reward{color:var(--gold)}
/* Mail: folders beside a message list and a persistent reading pane. */
#mail-dialog{width:880px;height:620px;max-height:calc(100dvh - 24px);overflow:hidden}
#mail-dialog .dialog-inner{padding:0;height:100%;display:flex;flex-direction:column;min-height:0}
#mail-dialog .window-heading{padding:12px 16px;margin:0;flex-shrink:0;border-bottom:1px solid var(--line)}
.mail-toolbar{display:flex;align-items:center;gap:4px;flex-wrap:wrap;padding:8px 12px;border-bottom:1px solid var(--line);background:#152a34}
#mail-dialog .mail-toolbar button{display:flex;align-items:center;gap:7px;padding:8px 10px;font-size:12px;border-color:transparent;background:transparent;white-space:nowrap}
#mail-dialog .mail-toolbar button:hover:not(:disabled){background:#25434c;border-color:#47616a}
.mail-toolbar button:disabled{opacity:.35}.mail-toolbar svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.mail-toolbar #mail-new{color:var(--cyan)}.mail-toolbar #mail-delete{margin-left:auto}
.mail-workspace{display:grid;grid-template-columns:158px minmax(0,1fr);flex:1;min-height:0}
.mail-folders{display:flex;flex-direction:column;align-items:stretch;gap:3px;padding:16px 8px;background:#0d1e27;border-right:1px solid var(--line);min-width:0;overflow:auto}
.mail-section-label{padding:0 10px 10px;font-size:10px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted)}
#mail-dialog .mail-folders button{display:flex;justify-content:space-between;align-items:center;gap:4px;padding:10px;font-size:12px;text-align:left;border-color:transparent;background:transparent;border-radius:3px}
#mail-dialog .mail-folders [aria-pressed=true]{color:#d4faf4;background:#244941;border-color:#46695f;box-shadow:inset 2px 0 var(--cyan)}
.mail-count{font-size:10px;color:#abc3c8;font-variant-numeric:tabular-nums}.mail-folders [aria-pressed=true] .mail-count{color:#a6e0d4}
#mail-unread{padding:0 10px;color:var(--muted);font-size:10px!important;line-height:1.5!important}
#mail-dialog #mail-refresh{margin-top:auto;color:var(--muted);font-size:11px}
.mail-content{min-width:0;min-height:0;background:#10232d}
#mail-mailbox{display:grid;grid-template-rows:minmax(155px,.9fr) minmax(160px,1.1fr);height:100%;min-height:0}
#mail-list{display:flex;flex-direction:column;min-height:0;border-bottom:1px solid #4a6169}
.mail-columns,.mail-entry{display:grid;grid-template-columns:18px minmax(90px,1fr) minmax(120px,1.7fr) 115px;gap:8px;align-items:center}
.mail-columns{padding:7px 12px;color:#8fa6ae;font-size:10px;background:#182f39;border-bottom:1px solid var(--line);letter-spacing:.3px}
#mail-entries{overflow:auto;min-height:0;flex:1;scrollbar-gutter:stable}
#mail-dialog .mail-entry{width:100%;border:0;border-bottom:1px solid #263e47;border-radius:0;min-height:35px;padding:8px 12px;text-align:left;font-size:11px;color:#aebfc5;background:transparent;line-height:1.45}
#mail-dialog .mail-entry:nth-child(even){background:#142a34}
#mail-dialog .mail-entry:hover{background:#253f49}
#mail-dialog .mail-entry[aria-pressed=true]{background:#2c4c55;color:#ecf7f6;box-shadow:inset 2px 0 var(--cyan)}
#mail-dialog .mail-entry.mail-unread{font-weight:600;color:#deeceb}
.mail-entry>span,.mail-entry>time{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mail-message-state{color:#81989f;font-size:10px}.mail-unread .mail-message-state{color:var(--gold)}
.mail-entry time{font-size:10px;color:#8fa6ae;font-variant-numeric:tabular-nums}.mail-entry-subject{color:inherit}
#mail-empty,#mail-read-empty{padding:20px;color:var(--muted);font-size:12px!important;margin:0}
.mail-pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:4px 10px;font-size:10px;color:var(--muted);border-top:1px solid #243b44}
#mail-total{margin-right:auto}#mail-dialog .mail-pagination button{min-height:24px;min-width:24px;height:24px;line-height:1;padding:1px 8px;font-size:17px;background:transparent;border-color:transparent}
#mail-read{padding:18px 20px;overflow:auto;min-height:0;scrollbar-gutter:stable}
#mail-read-empty{padding:20px 0;text-align:center}#mail-read-subject{font-size:19px;font-weight:500;color:#e0ebea;margin:0 0 10px;overflow-wrap:anywhere}
#mail-read-meta{font-size:10px!important;line-height:1.8!important;color:#91a9b0;white-space:pre-line;overflow-wrap:anywhere;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid #2b424a}
#mail-read-body{font-size:12px;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere;color:#c6d4d7}
#mail-compose{height:100%;overflow:auto;padding:16px 20px;box-sizing:border-box}
#mail-compose-title{font-size:17px;margin:0 0 12px;font-weight:500}#mail-reply-recipients{color:var(--cyan);font-size:12px!important;overflow-wrap:anywhere}
#mail-compose label{display:block;font-size:11px;color:#adc2c8;margin:10px 0 5px}
#mail-compose input:not([type=checkbox]),#mail-compose select,#mail-body{width:100%;font-size:12px;padding:8px;box-sizing:border-box}
#mail-body{font:12px/1.7 Verdana;color:var(--ink);background:#0d1d24;border:1px solid var(--line);border-radius:4px;padding:10px;resize:vertical;min-height:140px;max-height:36dvh}
#mail-body:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
#mail-group-choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}#mail-group-choices fieldset{flex:1;min-width:130px;border:1px solid var(--line);border-radius:4px;font-size:12px}#mail-group-choices label{display:flex;align-items:center;gap:6px}#mail-groups{margin-top:12px}
.mail-footer{display:flex;gap:12px;align-items:center;padding:7px 12px;border-top:1px solid var(--line);min-height:30px;box-sizing:border-box}
#mail-status{color:var(--gold);font-size:11px!important;line-height:1.4!important;margin:0;overflow-wrap:anywhere}#mail-status:empty{display:none}
.mail-key-hint{font-size:10px;white-space:nowrap;color:#8ca3aa;margin-left:auto}
@media(max-width:680px){.mail-workspace{grid-template-columns:116px minmax(0,1fr)}.mail-folders{padding:12px 5px}.mail-columns,.mail-entry{grid-template-columns:12px minmax(60px,1fr) minmax(80px,1.5fr)}.mail-columns>span:last-child,.mail-entry>time{display:none}#mail-dialog .mail-toolbar button{font-size:11px;padding:6px;gap:4px}.mail-toolbar{padding:6px}.mail-toolbar svg{width:15px;height:15px}#mail-read,#mail-compose{padding:14px}#mail-dialog .mail-folders button{padding:9px 6px}.mail-toolbar #mail-delete{margin-left:0}}
@media(max-height:540px){#mail-mailbox{grid-template-rows:minmax(80px,.8fr) minmax(85px,1.2fr)}#mail-dialog .window-heading{padding:6px 12px}.mail-toolbar{padding-top:3px;padding-bottom:3px}.mail-footer{padding-top:3px;padding-bottom:3px}}


.world-panel .character-menu .utility-button{flex:0 0 30px}

/* Contextual actions share one bounded stack above the technique bar. */
.world-panel .world-overlays{position:absolute;inset:auto;left:50%;transform:translateX(-50%);width:min(546px,calc(100% - 24px));height:auto;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:13;pointer-events:none}
.world-panel #interaction-hint,.world-panel:has(#activity-progress:not([hidden])) #interaction-hint,#activity-progress{position:static;transform:none;max-width:100%;white-space:normal;overflow-wrap:anywhere;font-size:12px;line-height:1.4;padding:6px 10px;margin:0}
#action-feedback{max-width:100%;padding:7px 12px;border:1px solid #b58d67;border-radius:5px;background:#192c32f2;color:#ffe0b1;font-size:12px;line-height:1.4;text-align:center;overflow-wrap:anywhere}
#active-effects{display:flex;justify-content:center;flex-wrap:wrap;gap:5px;max-width:100%}
#active-effects span{padding:4px 7px;background:#143d39f2;color:#c0f3df;border:1px solid #65a58d;border-radius:4px;font-size:11px;font-variant-numeric:tabular-nums}
.ability-tooltip.floating-ability-tooltip{display:block;position:fixed;bottom:auto;transform:none;width:260px;min-width:0;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow:hidden;z-index:90;overflow-wrap:anywhere}
.ability-tooltip .technique-effect{color:#a7ebc8}
body.ui-hidden .floating-ability-tooltip,body.actionbar-hidden .floating-ability-tooltip,body.ui-hidden .item-drop-hint{display:none!important}
.interact-button[aria-disabled=true]{opacity:.55}
.equipment-slot.drop-rejected{border-color:#efaa91!important;box-shadow:inset 0 0 0 1px #efaa91!important}
.item-drop-hint{position:fixed;z-index:100;max-width:min(280px,calc(100vw - 16px));padding:7px 10px;border:1px solid #86c6a9;border-radius:5px;background:#102e2ff5;color:#c6f3de;pointer-events:none;font-size:12px;line-height:1.4;overflow-wrap:anywhere}
.item-drop-hint.unavailable{color:#ffcfb9;border-color:#d9957b;background:#352526f5}
.movable-window{max-width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px)!important}
.window-heading{gap:10px}.window-heading h2,.section-heading h2{min-width:0;overflow-wrap:anywhere}.window-heading>button,.section-heading>button{flex-shrink:0}
.item-menu,.inventory-tooltip{max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow-wrap:anywhere}.item-menu{overflow:auto}
#target-distance{font-size:11px;color:#b1c7cb;margin:4px 0 7px;font-variant-numeric:tabular-nums;text-align:center}
@media(max-width:1100px){.world-column .chat:not(.chat-sized){width:min(330px,calc(50% - 24px))}}
@media(max-width:760px){.world-column .chat:not(.chat-sized){width:calc(50% - 24px);height:130px;max-height:32dvh}.world-panel .minimap-button{width:145px}.world-panel .target-overlay{max-width:calc(100% - 340px);top:16px;padding:8px}.target-overlay .target-choice{flex-wrap:wrap}.character-resources{width:155px}.character-resources .stat-row{font-size:9px;padding:0 4px}.world-panel .pouch-hud{right:10px;bottom:112px}.world-column .chat{bottom:112px}.world-column .actionbar{bottom:48px}}
@media(max-width:600px){.world-panel .target-overlay{top:84px;max-width:calc(100% - 170px);left:10px;transform:none}.world-column .chat:not(.chat-sized){width:calc(100% - 20px);height:112px;max-height:26dvh;bottom:200px}.world-panel .pouch-hud{bottom:112px}.world-panel .minimap-button{width:130px}.world-panel .world-overlays{max-width:calc(100% - 20px)}.character-window-content{gap:12px}}
@media(max-height:600px){.world-column .chat:not(.chat-sized){height:120px}.world-panel .minimap-button{width:145px}.dialog-inner{padding:14px}.window-heading{margin-bottom:10px;padding-bottom:8px}.world-panel .world-overlays{gap:3px}#active-effects span{padding:2px 5px}}
@media(max-height:500px){.world-panel .minimap-button{width:132px}}

/* Mail search and durable folders share the existing mailbox layout. */
#mail-search-form{display:flex;gap:6px;padding:7px 12px;border-bottom:1px solid var(--line);flex-shrink:0}
#mail-search{min-width:0;flex:1;font-size:12px;padding:6px 8px}
#mail-dialog #mail-search-form button{font-size:11px;padding:6px 9px}
#mail-space{font-size:10px!important;line-height:1.5!important;color:var(--muted);padding:0 10px;overflow-wrap:anywhere}
#mail-draft-status{color:var(--muted);font-size:11px!important;min-height:1.5em}
#mail-confirm-dialog{width:360px;max-width:calc(100vw - 24px)}
#mail-dialog #mail-mailbox[hidden],#mail-dialog #mail-compose[hidden],#mail-dialog #mail-search-form[hidden],#mail-dialog .mail-toolbar button[hidden]{display:none}
@media(max-height:540px){#mail-search-form{padding:3px 8px}#mail-mailbox{grid-template-rows:minmax(60px,.8fr) minmax(60px,1.2fr)}#mail-space{margin:4px 0}}
#mail-list{overflow:hidden}.mail-columns,.mail-pagination{flex-shrink:0}
#mail-empty{padding:8px 12px;min-height:0;overflow:auto}
@media(max-height:540px){#mail-mailbox{grid-template-rows:minmax(96px,1.2fr) minmax(0,.8fr)}#mail-read{padding:6px 12px}#mail-read-empty{padding:6px 0}}

/* Account entry shares the character window and its responsive layout. */
#account-form { display: grid; gap: .85rem; }
#account-form label { display: grid; gap: .35rem; }
.account-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin: .75rem 0 1rem; }
.account-actions button { font-size: .85rem; padding: .5rem .7rem; }
#account-status { min-height: 1.5em; overflow-wrap: anywhere; }
#account-panel [hidden], #account-summary[hidden], #character-panel[hidden] { display: none !important; }