:root { color-scheme: dark; font-family: "Times New Roman", Times, serif; background: #17231b; color: #f3f1d7; }
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; overflow: hidden; }
body { background: #17231b; }
.game-shell { width: min(1120px, calc(100% - 24px)); height: calc(100% - 24px); height: calc(100dvh - 24px); min-width: 0; min-height: 0; margin: 12px auto; padding: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 0; border: 2px solid #a38e50; background: #17251c; }
.game-header { display: grid; grid-template-columns: auto minmax(150px, 1fr) auto; align-items: center; gap: 18px; min-height: 66px; padding: 8px 12px; background: #17251c; }
.game-brand { min-width: 0; }
.header-actions { display: flex; align-items: stretch; justify-content: flex-end; gap: 0; flex-wrap: wrap; }
#session-status { display: flex; align-items: center; padding: 0 8px; border: 1px solid #8d804f; border-right: 0; color: #c9d8bd; background: #25392b; font-size: 12px; }
.update-modal { position: fixed; inset: 0; z-index: 20; display: grid; place-items: center; background: rgba(10, 18, 12, .72); }
.update-modal-text { padding: 18px 22px; border: 2px solid #a38e50; color: #f3e6aa; background: #1d3024; font-size: 18px; text-align: center; cursor: pointer; }
.game-brand h1 { margin: 0; color: #f3e6aa; font: 700 clamp(24px, 3.2vw, 34px)/.92 inherit; letter-spacing: .13em; }
.game-subtitle { margin: 4px 0 0; color: #c2aa62; font-size: 10px; line-height: 1; letter-spacing: .18em; }
.movement-help { margin: 0; text-align: center; }
.movement-help #online-count { display: block; margin-top: 4px; }
h2 { margin: 3px 0 18px; font-size: calc(clamp(20px, 5vw, 30px) * var(--text-scale, 1)); }
p { margin: 4px 0 0; color: #bfd0b8; font-size: calc(clamp(11px, 2vw, 14px) * var(--text-scale, 1)); }
button { font: inherit; color: #fffbe3; background: #314936; border: 1px solid #a38e50; padding: 8px 12px; cursor: pointer; }
button:hover, button:focus-visible { background: #527c5d; color: #fff8cf; outline: 1px solid #f6db83; outline-offset: -3px; }
button:active { background: #607554; color: #fff8cf; }
button:disabled { opacity: .45; cursor: not-allowed; }
#game-wrap { --text-scale: 1; --left-trigger-width: 80px; --left-utility-buttons-width: 75px; --chat-left-offset: calc(var(--left-trigger-width) + var(--left-utility-buttons-width) + 8px); min-width: 0; min-height: 0; position: relative; border: 0; border-top: 2px solid #a38e50; overflow: hidden; background: #213528; touch-action: none; }
#game { position: absolute; inset: 0; width: 100%; height: 100%; display: block; image-rendering: pixelated; outline: none; cursor: crosshair; }
canvas { width: 100%; height: 100%; display: block; image-rendering: pixelated; outline: none; cursor: crosshair; }
#cursor-action-preview { position: absolute; z-index: 8; pointer-events: none; padding: 4px 7px; border: 1px solid #e4d183; color: #fff1b3; background: rgba(37, 57, 43, .75); opacity: 1; font-size: calc(12px * var(--text-scale)); line-height: 1.25; white-space: nowrap; }
#cursor-action-preview strong { display: block; margin: -4px -7px 4px; padding: 3px 7px; border-bottom: 1px solid #a38e50; color: #fff8cf; background: rgba(49, 73, 54, .9); font-weight: bold; }
#cursor-action-preview div { color: #fff1b3; }
#cursor-action-preview.header-only { padding: 0; }
#cursor-action-preview.header-only strong { margin: 0; border-bottom: 0; }
.idle-action-view { position:absolute;z-index:4;left:50%;top:0;display:flex;flex-direction:column;align-items:center;gap:0;transform:translateX(-50%);pointer-events:none; }
.idle-action-view[hidden] { display:none; }
.active-xp-stack { position:absolute;z-index:5;top:0;left:50%;display:flex;flex-direction:column;gap:0;transform:translateX(-50%);pointer-events:none; }
.active-xp-entry { opacity:1;max-height:20px;overflow:hidden;transition:opacity .35s ease,max-height .35s ease,transform .35s ease; }
.active-xp-entry.is-fading { opacity:0;max-height:0;transform:translateY(-3px); }
.idle-action-controls { display:grid;grid-template-columns:1fr;gap:0;padding:3px 3px 0;border:2px solid #d1bb6f;border-top:0;border-bottom:0;background:#17251cee;pointer-events:none; }
.idle-action-controls strong { display:grid;gap:2px;color:#f2df9d;font-size:calc(12px * var(--text-scale));font-weight:400; }
.idle-action-controls .idle-action-status-title { display:inline;font-weight:700; }
.idle-action-controls .idle-action-time-remaining { display:inline;color:#f2df9d;font-weight:700; }
#idle-action-status > span:first-child { display:block;box-sizing:border-box;width:calc(100% + 6px);margin:-3px -3px 0;white-space:nowrap;padding:0 3px;border:1px solid #a38e50;border-left:0;border-right:0;background:#314936; }
.xp-bar { position:relative;width:150px;height:20px;color:#f2df9d;font-size:calc(14px * var(--text-scale));pointer-events:none; }
.xp-bar > span,.xp-bar > strong { position:relative;z-index:1;display:flex;align-items:center;height:20px;font-weight:400; }
.xp-bar > span { padding-left:6px; }
.xp-bar > strong { position:absolute;top:0;right:6px; }
.xp-bar progress { position:absolute;top:0;left:0;width:100%;height:20px;margin:0; }
.xp-bar[hidden] { display:none; }
.xp-bar.is-hovered { opacity:1; }
.idle-action-controls > span { display:flex;width:calc(100% + 6px);margin:3px -3px 0;gap:0;justify-content:stretch;align-self:start; }
.idle-action-controls button { flex:1 1 50%;width:50%;padding:4px 7px;font-size:calc(11px * var(--text-scale));pointer-events:auto; }
#idle-action-reset, #idle-action-stop { opacity:1; background-color:rgba(49,73,54,.7); }
#idle-action-reset:disabled, #idle-action-stop:disabled { opacity:1; background-color:rgba(49,73,54,.45); }
.idle-action-controls button:first-child { border-left:0; }
.idle-action-controls button:last-child { border-right:0; }
.idle-action-controls button + button { border-left: 0; }
.station-panel{position:absolute;z-index:7;left:50%;top:50%;width:min(470px,calc(100% - 32px));transform:translate(-50%,-50%);padding:10px;border:2px solid #d1bb6f;background:#17251cee;}
.station-panel[hidden]{display:none;}.station-panel h2{margin:0 0 7px;color:#f2df9d;font-size:calc(18px * var(--text-scale));}.station-panel>button{margin-top:7px;}.station-panel #station-recipes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;}.station-recipe{display:grid;grid-template-columns:34px 1fr;gap:7px;min-height:58px;text-align:left;align-items:center;padding:7px;}.station-recipe strong{display:grid;place-items:center;align-self:stretch;color:#f2df9d;border:1px solid #a38e50;font-size:calc(19px * var(--text-scale));}.station-recipe strong.missing-level{color:#ff8b83;border-color:#a94f4a;background:#351b1b;}.station-recipe>span{display:grid;gap:2px;min-width:0;font-size:calc(16px * var(--text-scale));}.station-recipe small{color:#bfd0b8;font-size:calc(12px * var(--text-scale));white-space:normal;}.station-recipe small span{display:inline;}.station-recipe small .missing-ingredient{color:#ff7770;opacity:1;}@media(max-width:560px){.station-panel #station-recipes{grid-template-columns:1fr;}}
.station-recipe small .missing-ingredient{display:inline;color:#ff7770;opacity:1;}
.station-recipe .missing-ingredient{color:#ff7770;opacity:1;}
.left-panel-menu { --left-panel-width: 230px; --left-trigger-height: 36px; position:absolute; z-index:5; left:0; bottom:0; display:block; width:var(--left-panel-width); max-width:100%; pointer-events:none; }
.character-log-toggle, .character-log-panel, .settings-toggle, .settings-panel { pointer-events:auto; }
.highscores-toggle, .highscores-panel, .help-toggle, .help-panel { pointer-events:auto; }
.left-panel-menu[hidden] { display:none; }
.character-log { display: flex; width: var(--left-panel-width); max-width: 100%; flex-direction: column; align-items: flex-start; }
#left-panel-content { scrollbar-width: none; -ms-overflow-style: none; }
#left-panel-content::-webkit-scrollbar { display: none; }
.character-log-toggle { position: relative; z-index: 1; width:var(--left-trigger-width); height:var(--left-trigger-height); padding: 7px 10px; border-color: #9a8952; border-top: 0; border-bottom: 0; border-left: 0; background: #25392b; }
.activity-label-compact { display:none; }
.character-log-toggle:hover, .character-log-toggle:focus-visible, .character-log-toggle:active { border-color: #9a8952; background: #3d5943; outline-offset: -3px; }
.character-log-toggle.has-unread::after { content:''; position:absolute; top:5px; right:5px; width:7px; height:7px; background:#b99a43; }
.character-log-toggle.has-unread.unread-bright::after { background:#ffe991; }
.settings { position:absolute; left:0; bottom:0; width:230px; height:25px; pointer-events:none; }
.settings[hidden], .settings-screen[hidden], .settings-activity-log[hidden], .settings-look[hidden], .settings-movement[hidden] { display:none; }
.settings-panel { position:absolute; left:0; bottom:var(--left-trigger-height); margin:0; }
.settings-panel .character-log-heading { font-size:calc(16px * var(--text-scale)); }
.settings-toggle { position:absolute; z-index:1; left:calc(var(--left-trigger-width) + 50px); bottom:0; width:25px; height:25px; padding:0; border:1px solid #9a8952; border-left:0; border-bottom:0; color:#c9b877; background:#25392b; font-size:13px; line-height:1; }
.highscores { position:absolute; left:0; bottom:0; width:230px; height:25px; pointer-events:none; }
.highscores[hidden], .highscores-panel[hidden] { display:none; }
.highscores-toggle { position:absolute; z-index:1; left:var(--left-trigger-width); bottom:0; width:25px; height:25px; padding:0; border:1px solid #9a8952; border-left:0; border-bottom:0; background:#25392b; line-height:1; }
.highscores-toggle img { display:block; width:16px; height:16px; margin:auto; image-rendering:pixelated; }
.highscores-toggle:hover, .highscores-toggle:focus-visible, .highscores-toggle:active { border-color:#9a8952; background:#3d5943; outline:none; }
.highscores-panel { position:absolute; left:0; bottom:var(--left-trigger-height); margin:0; }
.highscores-panel .character-log-heading { font-size:calc(16px * var(--text-scale)); }
.highscores-panel-content { display:grid; gap:0; }
.highscores-section-body { padding:7px 8px; border:1px solid #53644d; color:#d7dfd0; background:#27352a; font-size:calc(14px * var(--text-scale)); line-height:1.35; white-space:pre; }
.highscores-row { display:grid; gap:1px; min-height:1.35em; padding:4px 0; }
.highscores-row span { padding-left:12px; color:#bfd0b8; }
.help { position:absolute; left:0; bottom:0; width:230px; height:25px; pointer-events:none; }
.help-toggle { position:absolute; z-index:1; left:calc(var(--left-trigger-width) + 25px); bottom:0; width:25px; height:25px; padding:0; border:1px solid #9a8952; border-left:0; border-bottom:0; color:#c9b877; background:#25392b; font-size:13px; line-height:1; }
.help-toggle:hover, .help-toggle:focus-visible, .help-toggle:active { border-color:#9a8952; background:#3d5943; outline:none; }
.help-panel { position:absolute; left:0; bottom:var(--left-trigger-height); margin:0; }
.help-panel .character-log-heading { font-size:calc(16px * var(--text-scale)); }
.help-panel-content { display:grid; gap:0; }
.help-section-list { display:block; margin:0; padding:0; list-style:none; }
.help-section-toggle { width:100%; padding:7px 8px; border:1px solid #53644d; color:#f0d98b; background:#25392b; text-align:left; font-size:calc(16px * var(--text-scale)); }
.help-section-toggle::before { content:'▸ '; }.help-section-toggle[aria-expanded="true"]::before { content:'▾ '; }
.help-section-body { padding:7px 8px; border:1px solid #53644d; color:#d7dfd0; background:#27352a; font-size:calc(14px * var(--text-scale)); line-height:1.35; white-space:pre-wrap; }
.settings-section-toggle { width:100%; padding:7px 8px; border:1px solid #53644d; color:#f0d98b; background:#25392b; text-align:left; font-size:calc(16px * var(--text-scale)); }
.settings-section-toggle::before { content:'▸ '; }.settings-section-toggle[aria-expanded="true"]::before { content:'▾ '; }
.settings-movement { display:grid; gap:7px; padding:7px 8px; border:1px solid #53644d; color:#f0d98b; background:#27352a; font-size:calc(12px * var(--text-scale)); }
.settings-activity-log { display:grid; gap:7px; padding:7px 8px; border:1px solid #53644d; color:#f0d98b; background:#27352a; font-size:calc(12px * var(--text-scale)); }
.settings-activity-log label { display:flex; gap:6px; align-items:center; color:#f2df9d; }
.settings-movement-options { display:grid; gap:5px; color:#f2df9d; }
.settings-movement-options label { display:flex; gap:6px; align-items:center; }
.settings-screen { display:grid; gap:7px; padding:7px 8px; border:1px solid #53644d; color:#f0d98b; background:#27352a; font-size:calc(12px * var(--text-scale)); }
.settings-slider-label { display:flex; justify-content:space-between; color:#f2df9d; }
.settings-slider-value { color:#fff1b3; }
.settings-slider { position:relative; padding:0 5px 15px; }
.settings-slider::before { content:''; position:absolute; z-index:0; top:3px; left:10px; right:10px; height:4px; border:1px solid #8d804f; border-radius:3px; background:#17251c; }
.settings-screen input[type="range"] { position:relative; z-index:2; display:block; width:100%; height:10px; margin:0; appearance:none; -webkit-appearance:none; background:transparent; }
.settings-screen input[type="range"]::-webkit-slider-runnable-track { height:4px; border:1px solid transparent; border-radius:3px; background:transparent; }
.settings-screen input[type="range"]::-moz-range-track { height:4px; border:1px solid transparent; border-radius:3px; background:transparent; }
.settings-screen input[type="range"]::-moz-range-progress { height:4px; border-radius:3px; background:transparent; }
.settings-screen input[type="range"]::-webkit-slider-thumb { width:0; height:0; appearance:none; -webkit-appearance:none; border:0; background:transparent; }
.settings-screen input[type="range"]::-moz-range-thumb { width:0; height:0; border:0; background:transparent; }
.settings-slider-fill { position:absolute; z-index:1; top:3px; left:10px; width:calc(var(--slider-progress,0) * (100% - 20px)); height:4px; border-radius:3px; background:#b99a43; pointer-events:none; }
.settings-slider-stops { position:absolute; z-index:3; top:2px; left:9px; right:9px; display:flex; justify-content:space-between; color:#d8bd62; pointer-events:none; }
.settings-slider-stop { position:relative; display:flex; justify-content:center; width:0; height:15px; font-size:calc(10px * var(--text-scale)); text-align:center; }
.settings-slider-stop::before { content:''; width:5px; height:5px; border:1px solid #d8bd62; border-radius:50%; background:#27352a; }
.settings-slider-stop > span { position:absolute; top:10px; left:50%; white-space:nowrap; transform:translateX(-50%); }
.settings-slider-stop.selected::before { background:#b99a43; }
.settings-slider input[type="range"]::-webkit-slider-thumb { width:0; height:0; appearance:none; -webkit-appearance:none; border:0; background:transparent; }
.settings-slider input[type="range"]::-moz-range-thumb { width:0; height:0; border:0; background:transparent; }
.settings-look { display:grid; gap:7px; }
.settings-look-rows { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
.settings-look-row { display:grid; grid-template-columns:auto 1fr auto; grid-template-rows:auto 42px; gap:3px 4px; align-items:center; padding:5px; border:1px solid #53644d; background:#27352a; }
.settings-look-row strong { grid-column:1 / -1; color:#f2df9d; font-size:calc(12px * var(--text-scale)); font-weight:400; }
.settings-look-row button { width:22px; height:28px; padding:0; font-size:calc(16px * var(--text-scale)); line-height:1; white-space:nowrap; }
.settings-look-preview { position:relative; display:block; width:38px; height:42px; overflow:hidden; justify-self:center; image-rendering:pixelated; }
.settings-look-preview img { position:absolute; left:50%; top:0; width:96px; height:96px; max-width:none; transform:translateX(-50%); image-rendering:pixelated; }
.settings-look-preview-skin { height:27px; margin-top:8px; }
.settings-look-preview-skin img { top:-5px; }
.settings-look-preview-hair { height:42px; }
.settings-look-preview-hair img { top:0; }
.settings-look-preview-shirt { height:31px; margin-top:5px; }
.settings-look-preview-shirt img { top:-24px; }
.settings-look-preview-pants { height:29px; margin-top:7px; }
.settings-look-preview-pants img { top:-56px; }
.settings-look-preview-shoes { height:22px; margin-top:13px; }
.settings-look-preview-shoes img { top:-72px; }
@media(max-width:360px){.settings-look-rows{grid-template-columns:1fr;}}
.character-log-panel { display: flex; width: 230px; max-width: 100%; height: min(350px, calc(100vh - 190px)); min-height: 250px; margin-bottom: 0; flex-direction: column; order: -1; overflow: hidden; border: 2px solid #9a8952; border-left: 0; background: #14201980; }
.character-log-scroll-latest { flex: 0 0 auto; margin: 0 5px 5px; padding: 4px 7px; color: #f2df9d; border: 1px solid #9a8952; background: #25392b; font-size: calc(11px * var(--text-scale)); }
.character-log-scroll-latest:hover, .character-log-scroll-latest:focus-visible { background: #3d5943; }
.character-log-panel[hidden] { display: none; }
.character-log-heading { display: flex; justify-content: space-between; gap: 8px; padding: 9px 10px; border-bottom: 2px solid #4e6048; color: #f0d98b; background: #21312880; }
.character-log-heading span { color: #aebfa8; font-size: calc(11px * var(--text-scale)); }
.character-log-entries { flex: 1; overflow-y: scroll; padding: 8px; scrollbar-color: #758764 #172019; scrollbar-gutter: stable; }
.log-count { color: #d8c477; white-space: nowrap; }
.log-entry { margin: 0 0 7px; color: #d7dfd0; font-size: calc(12px * var(--text-scale)); line-height: 1.3; }
.log-new-marker { display: inline-block; width: 7px; height: 7px; margin-right: 5px; background: #ffe991; vertical-align: 1px; animation: activity-entry-marker-fade 1s ease-out forwards; }
@keyframes activity-entry-marker-fade { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .log-new-marker { animation-duration: .01ms; } }
.log-time { display: block; color: #8fa087; font-size: calc(10px * var(--text-scale)); }
.side-toolbar { position: absolute; z-index: 2; right: 0; bottom: 0; display: flex; flex-direction: column-reverse; gap: 0; }
.side-toolbar[hidden] { display: none; }
.side-toggle { width: 51px; height: 51px; padding: 0; border-color: #e0c876; border-right: 0; border-bottom: 0; background: #263c2d; font-size: 27px; line-height: 1; }
.side-toggle:first-child { border-bottom: 0; }
.side-toggle:hover, .side-toggle:focus-visible, .side-toggle:active { border-color: #e0c876; background: #3d5943; outline: 1px solid #f6db83; outline-offset: -3px; }
.side-toggle:active { background: #526246; }
.side-toggle[aria-expanded="true"] { background: #6b7545; }
.side-toggle[aria-expanded="true"]:hover, .side-toggle[aria-expanded="true"]:focus-visible { background: #788052; }
.minimap-toggle { position:absolute; z-index:3; top:0; right:0; display:grid; place-items:center; width:34px; height:34px; padding:0; border:2px solid #a38e50; border-top:0; border-right:0; background:#314936; }
.minimap-toggle[hidden] { display:none; }
.minimap-toggle img { display:block; width:32px; height:32px; image-rendering:pixelated; }
.minimap-toggle::after { content:''; position:absolute; z-index:1; top:2px; right:2px; bottom:2px; left:2px; border:1px solid transparent; pointer-events:none; }
.minimap-toggle:hover, .minimap-toggle:focus-visible, .minimap-toggle:active { border-color:#f6db83; background:#3d5943; outline:none; }
.minimap-toggle:hover::after, .minimap-toggle:focus-visible::after, .minimap-toggle:active::after { border-color:#f6db83; }
.minimap-panel { position:absolute; z-index:4; top:0; right:0; width:194px; height:194px; padding:0; border:2px solid #a38e50; border-top:0; border-right:0; background:#17251c; }
.minimap-panel[hidden] { display:none; }
.minimap-panel canvas { width:192px; height:192px; image-rendering:pixelated; }
.minimap-close { position:absolute; z-index:1; top:0; right:0; display:grid; place-items:center; width:17px; height:17px; padding:0; border:2px solid #a38e50; border-top:0; border-right:0; color:#fff1b3; background:#314936; font:700 15px/14px "Times New Roman", Times, serif; }
.minimap-close:hover, .minimap-close:focus-visible { background:#527c5d; outline:none; }
.right-menu-panel { position: absolute; z-index: 6; right: 51px; bottom: 0; width: min(330px, calc(100% - 51px)); max-height: 100%; padding: 12px; overflow-y: auto; border: 2px solid #d1bb6f; border-right: 0; border-bottom: 0; background: #17251c; scrollbar-color: #758764 #172019; }
.right-menu-panel[hidden] { display: none; }
.player-hp { margin-bottom: 12px; padding: 9px; border: 1px solid #8d804f; background: #27352a; font-size: calc(16px * var(--text-scale)); }
.player-hp-track { height: 10px; margin-top: 7px; border: 1px solid #a38e50; background: #15251b; }
.player-hp-track span { display: block; height: 100%; background: #8f3e3a; }
.combat-section { margin-bottom: 12px; color: #f2df9d; }
.combat-section > strong { display: block; margin-bottom: 7px; font-size: calc(16px * var(--text-scale)); }
.combat-empty-slot { opacity: .45; cursor: default; }
.equipment-warning { margin: 8px 0; color: #c5d1bd; font-size: calc(12px * var(--text-scale)); }
.combat-style-control { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;padding:8px;border:1px solid #8d804f;background:#27352a;color:#f2df9d;font-size:calc(16px * var(--text-scale)); }
.combat-style-control select { border:1px solid #a38e50;border-radius:0;padding:4px;color:#fffbe3;background:#314936;font:inherit; }
.equipment-slots { display: grid; gap: 0; }
.equipment-slot { display: flex; width: 100%; justify-content: space-between; gap: 8px; border-bottom: 0; text-align: left; background: #27352a; }
.equipment-slot:last-child { border-bottom: 1px solid #8d804f; }
.equipment-slot-name { color: #f2df9d; }
.equipment-slot-item { color: #c5d1bd; font-size: calc(16px * var(--text-scale)); }
.quests-list { display: grid; gap: 0; }
.quest-filters { display:flex;flex-wrap:wrap;gap:4px 10px;margin:0 0 9px;padding:6px 8px;border:1px solid #53644d;color:#c5d1bd;font-size:calc(11px * var(--text-scale)); }
.quest-filters legend { padding:0 3px;color:#f2df9d; }
.quest-filters label { display:flex;align-items:center;gap:4px; }
.quest-giver { border:1px solid #8d804f;background:#17251c; }
.quest-giver-header { display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 8px;border-bottom:1px solid #53644d;background:#25392b; }
.quest-giver-header strong,.quest-giver-header small { display:block; }
.quest-giver-header strong { color:#f2df9d; }
.quest-giver-header small { margin-top:2px;color:#aebfa8;font-size:calc(11px * var(--text-scale)); }
.quest-giver-travel { width:auto;padding:4px 7px;font-size:calc(11px * var(--text-scale));white-space:nowrap; }
.quest-row { display: block; padding: 9px; border: 1px solid #4e7458; background: #15251b; }
.quest-giver .quest-row { border:0;border-bottom:1px solid #4e6048; }
.quest-giver .quest-row:last-child { border-bottom:0; }
.quest-row.finished,.quest-row.finished strong,.quest-row.finished small { color:#8fc98b; }
.quest-row.locked { opacity:.58; }
.quest-row strong, .quest-row small { display: block; }
.quest-row small { margin-top: 3px; color: #b8c8b1; }
.quests-empty { margin: 12px 2px 2px; color: #aebfa8; text-align: center; }
.dialogue-options { position:absolute; z-index:6; display:flex; flex-direction:column; align-items:flex-start; gap:3px; max-width:calc(100% - 24px); pointer-events:auto; }
.dialogue-options button { display:block; width:fit-content; max-width:min(310px,calc(100vw - 24px)); margin:0; padding:5px 8px; text-align:left; border:2px solid #a38e50; background:#fffbe8; color:#252117; font-family:"Times New Roman",Times,serif; white-space:normal; }
.dialogue-options button:not(:disabled):hover { border-color:#d1bb6f; background:#f5e4a6; color:#17251c; }
.dialogue-options button:disabled { opacity: .92; color:#e7dfc8; border-color:#5d675d; background:#29342b; }
.dialogue-options button:disabled .dialogue-requirement-unmet { color:#d94b4b; font-weight:700; }
.item-panel-section-label { display: block; margin: 7px 0 5px; color: #aebfa8; }
.item-panel .inventory-heading button { padding: 4px 8px; font-size: calc(11px * var(--text-scale)); }
.inventory-heading { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 9px; color: #f2df9d; }
.inventory-heading[hidden] { display: none; }
.inventory-heading strong { font-size: calc(19px * var(--text-scale)); }
.inventory-heading small { color: #aebfa8; }
.inventory-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
.inventory-slot { position: relative; aspect-ratio: 1; min-width: 0; padding: 0; border: 1px solid #53644d; background: #27352a; font-size: calc(21px * var(--text-scale)); }
.inventory-slot, .equipment-slot { -webkit-touch-callout: none; user-select: none; }
.inventory-slot:hover, .inventory-slot:focus-visible, .inventory-slot.selected { border-color: #ffe991; background: #64734c; outline: none; }
.item-icon { display: grid; place-items: center; width: 100%; height: 100%; color: #8fd06d; font-size: calc(28px * var(--text-scale)); font-weight: 700; }
.game-icon { display: inline-grid; place-items: center; overflow: hidden; }
.game-icon img { width: 100%; height: 100%; object-fit: contain; image-rendering: auto; }
.item-icon img { width: 32px; height: 32px; image-rendering: pixelated; }
.game-icon-fallback { font-family: inherit; }
.item-count { position: absolute; right: 3px; bottom: 1px; color: #fff; font-size: calc(13px * var(--text-scale)); font-weight: 700; line-height: 1; text-shadow: 1px 1px #000, -1px -1px #000, 1px -1px #000, -1px 1px #000; }
.skills-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.admin-tools { position: absolute; z-index: 6; top: 0; left: 0; display: flex; width: max-content; height: max-content; flex-direction: column; align-items: stretch; gap: 0; }
.admin-menu-toggle { width: 100%; box-sizing: border-box; padding: 4px 7px; border: 1px solid #a38e50; border-top: 0; border-left: 0; color: #fff1b3; background: #27392b; font-size: 11px; }
.admin-tools > #mod-menu-toggle { border-top: 0; }
.admin-menu-toggle[aria-expanded="true"] { background: #46583d; }
.admin-menu { display: grid; min-width: 110px; margin-top: 0; border: 1px solid #a38e50; background: #1c2c21ee; }
.admin-menu[hidden] { display: none; }
.admin-menu button { padding: 6px 8px; border: 0; color: #fff1b3; background: #314936; text-align: left; font-size: 11px; }
.admin-menu button:hover, .admin-menu button:focus-visible { background: #5a704f; outline: 1px solid #f6db83; outline-offset: -3px; }
.admin-skill-editor-panel { position: absolute; z-index: 7; top: 8px; left: 50%; width: max-content; max-width: calc(100% - 16px); max-height: calc(100% - 16px); padding: 12px; overflow: auto; border: 2px solid #a38e50; background: #17251cee; transform: translateX(-50%); }
.admin-skill-editor-panel h2 { margin: 0; color: #f2df9d; font-size: 16px; }
.admin-skill-editor p { margin: 4px 0 8px; color: #c5d1bd; font-size: 11px; }
.admin-skill-editor-list { display: grid; gap: 4px; }
.admin-help-editor-panel { position: absolute; z-index: 7; top: 8px; left: 50%; width: min(520px, calc(100% - 16px)); max-height: calc(100% - 16px); padding: 12px; overflow: auto; border: 2px solid #a38e50; background: #17251cee; transform: translateX(-50%); }
.admin-help-editor-panel h2 { margin: 0; color: #f2df9d; font-size: 16px; }
.admin-help-editor-list { display: grid; gap: 8px; }
.admin-help-row { display: grid; grid-template-columns: minmax(0, 1fr) repeat(4, auto); gap: 4px; align-items: start; padding: 6px; border: 1px solid #53644d; background: #27352a; }
.admin-help-row input, .admin-help-row textarea { box-sizing: border-box; min-width: 0; padding: 4px; border: 1px solid #8d804f; border-radius: 0; color: #fffbe3; background: #17251c; font: inherit; }
.admin-help-row input { grid-column: 1 / -1; }
.admin-help-row textarea { grid-column: 1 / -1; resize: vertical; }
.admin-help-row button, .admin-help-editor-panel > button { padding: 4px 7px; font-size: 11px; }
.admin-help-row button { grid-row: 3; }
.admin-help-row button:first-of-type { grid-column: 2; }
.admin-help-row button:disabled { opacity: .5; }
.admin-skill-row { display: grid; grid-template-columns: 80px 54px 70px auto auto; gap: 4px; align-items: center; justify-content: start; }
.admin-skill-row strong { color: #fff1b3; font-size: 12px; }
.admin-skill-row input { width: 100%; box-sizing: border-box; padding: 4px; border: 1px solid #8d804f; border-radius: 0; color: #fffbe3; background: #27352a; font: inherit; }
.admin-skill-row button { padding: 4px 7px; font-size: 11px; }
.admin-tools { display: flex; width: max-content; height: max-content; flex-direction: column; align-items: stretch; gap: 0; }
.admin-tools[hidden] { display: none; }
.mod-option-panel { position: absolute; z-index: 8; top: 8px; left: 50%; display: grid; width: min(360px, calc(100% - 32px)); max-height: calc(100% - 16px); box-sizing: border-box; gap: 8px; padding: 14px; overflow-y: auto; border: 2px solid #d1bb6f; color: #f2df9d; background: #17251cee; transform: translateX(-50%); }
.mod-option-panel[hidden] { display: none; }
.mod-menu strong { font-size: 11px; }
.mod-option-panel select, .mod-option-panel input { width: 150px; box-sizing: border-box; padding: 4px; border: 1px solid #8d804f; color: #fffbe3; background: #27352a; font: inherit; }
.chat-toggle { position: absolute; z-index: 6; left: 50%; bottom: 0; height: 36px; transform: translateX(-50%); min-width: 64px; padding: 5px 10px; border: 1px solid #d1bb6f; border-bottom: 0; color: #fff1b3; background: #263c2d; }
.chat-toggle.has-unread::after { content:''; position:absolute; top:5px; right:5px; width:7px; height:7px; background:#b99a43; }
.chat-toggle.has-unread.unread-bright::after { background:#ffe991; }
.admin-menu-toggle:hover, .admin-menu-toggle:focus-visible, .chat-toggle:hover, .chat-toggle:focus-visible { outline: none; }
.chat-toggle[hidden], .chat-panel[hidden] { display: none; }
.chat-panel { position: absolute; z-index: 6; left: var(--chat-left-offset); right: 59px; bottom: 0; display: flex; height: min(240px, 100%); min-height: 120px; flex-direction: column; border: 2px solid #d1bb6f; border-bottom: 0; color: #d7dfd0; background: #142019a6; pointer-events: auto; }
#game-wrap:has(#character-log-panel:not([hidden])) .chat-panel,
#game-wrap:has(#settings-panel:not([hidden])) .chat-panel,
#game-wrap:has(#help-panel:not([hidden])) .chat-panel,
#game-wrap:has(#highscores-panel:not([hidden])) .chat-panel { left: 238px; }
#game-wrap:has(.right-menu-panel:not([hidden])) .chat-panel { right: 389px; }
.chat-heading, .chat-compose { display: flex; align-items: center; gap: 6px; padding: 6px 8px; pointer-events: auto; background: transparent; }
.chat-heading { position: absolute; z-index: 2; top: 0; right: 0; width: max-content; height: max-content; justify-content: flex-end; padding: 0; background: transparent; }
.chat-heading strong { display: none; }
.chat-heading button { margin: 0; padding: 1px 4px; color: #f0d98b; background: #314936cc; font-size: 10px; }
.chat-heading button, .chat-compose button, .chat-moderate { pointer-events: auto; }
.chat-entries { flex: 1; min-height: 0; display: block; overflow-y: scroll; padding: 7px 9px 1px; pointer-events: auto; touch-action: pan-y; scrollbar-color: #758764 #172019; scrollbar-width: auto; }
.chat-entries-content { min-height: 100%; display: flex; flex-direction: column; justify-content: flex-end; }
.chat-entry:first-child { padding-right: 70px; }
.chat-entry { display: flex; flex: 0 0 auto; gap: 6px; min-height: 18px; font-size: calc(14px * var(--text-scale)); line-height: calc(1.35 / var(--text-scale)); -webkit-user-select: text; user-select: text; cursor: text; }
.chat-entry-text { min-width: 0; flex: 1; overflow-wrap: anywhere; pointer-events: auto; -webkit-user-select: text; user-select: text; }
.chat-entry.hidden { color: inherit; }
.chat-panel-mod .chat-entry.hidden { color: #89958a; }
.chat-hidden-text { font-style: italic; }
.chat-moderate { flex: 0 0 22px; width: 22px; padding: 0; border: 0; color: #9ca69e; background: transparent; opacity: 0; pointer-events: none; cursor: pointer; -webkit-user-select: none; user-select: none; }
.chat-panel-mod .chat-entry { pointer-events: auto; }
.chat-panel-mod .chat-row-hover .chat-moderate { opacity: 1; pointer-events: auto; }
.chat-panel-mod .chat-row-control-hover { background: #314936; }
.chat-compose { align-items: stretch; padding: 1px 4px 4px; }
.chat-compose input, .chat-compose button { box-sizing: border-box; height: 27px; }
.chat-compose input { min-width: 0; flex: 1; padding: 5px; border: 1px solid #8d804f; color: #fffbe3; background: #27352a; font: inherit; }
.chat-compose button { padding: 2px 8px; line-height: 1; }
.chat-guest-note { margin: 0; padding: 3px 8px; color: #f0d98b; font-size: calc(11px * var(--text-scale)); pointer-events: auto; }
.chat-timeout-row { display: flex; width: max-content; max-width: 100%; align-items: center; gap: 6px; font-size: calc(11px * var(--text-scale)); }
.chat-timeout-row button { width: auto; height: auto; padding: 0 2px; border: 0; color: #d8c477; background: transparent; font-size: calc(14px * var(--text-scale)); line-height: 1; }
.chat-timeout-row button:hover, .chat-timeout-row button:focus-visible { border: 0; color: #fff1b3; background: transparent; outline: none; }
.skills-list[hidden] { display: none; }
.skill-row { display: grid; align-items: center; width: 100%; padding: 9px; border: 1px solid #53644d; color: inherit; background: #27352a; text-align: left; }
.skill-row:hover, .skill-row:focus-visible { border-color: #ffe991; background: #46583d; outline: none; }
.skill-icon { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #8d804f; color: #f4dc83; background: #1a271e; font-size: calc(23px * var(--text-scale)); }
.skill-details { min-width: 0; }
.skill-line { display: flex; justify-content: space-between; gap: 8px; }
.skill-line strong { color: #fff1b3; font-size: calc(16px * var(--text-scale)); }
.skill-line span, .skill-xp { color: #c5d1bd; font-size: calc(12px * var(--text-scale)); }
.skill-xp { display: block; margin-top: 3px; }
.skill-progress { appearance:none; -webkit-appearance:none; width: 100%; height: 8px; margin-top: 6px; border:1px solid #8d804f; border-radius:0; background:#17251c; overflow:hidden; }
.skill-progress::-webkit-progress-bar { background:#263b2a; }
.skill-progress::-webkit-progress-value { background:#b99a43; }
.skill-progress::-moz-progress-bar { background:#b99a43; }
.xp-bar progress.skill-progress { position:absolute;top:0;left:0;width:100%;height:20px;margin:0; }
.skill-detail { display: grid; min-height: 260px; gap: 10px; }
.skill-detail[hidden] { display: none; }
.skill-detail-summary { grid-template-columns: 42px 1fr; gap: 10px; align-self: start; cursor: default; }
.skill-detail-summary:hover { border-color: #53644d; background: #27352a; }
.skill-filters { display:flex; flex-wrap:wrap; gap:4px 9px; margin:0; padding:5px 7px; border:1px solid #53644d; color:#c5d1bd; font-size:calc(11px * var(--text-scale)); }
.skill-filters legend { padding:0 3px; color:#f2df9d; }
.skill-filters label { display:flex; align-items:center; gap:3px; }
.skill-filter-equipment, .skill-category-equipment, .skill-unlock-details .skill-category-equipment { color:#000; text-shadow:-1px -1px 0 #fff, 0 -1px 0 #fff, 1px -1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff, -1px 1px 0 #fff, 0 1px 0 #fff, 1px 1px 0 #fff; }
.skill-filter-recipe, .skill-category-recipe, .skill-unlock-details .skill-category-recipe { color:#000; text-shadow:-1px -1px 0 #57c45f, 0 -1px 0 #57c45f, 1px -1px 0 #57c45f, -1px 0 0 #57c45f, 1px 0 0 #57c45f, -1px 1px 0 #57c45f, 0 1px 0 #57c45f, 1px 1px 0 #57c45f; }
.skill-filter-idle, .skill-category-idle, .skill-unlock-details .skill-category-idle { color:#000; text-shadow:-1px -1px 0 #c7a7e8, 0 -1px 0 #c7a7e8, 1px -1px 0 #c7a7e8, -1px 0 0 #c7a7e8, 1px 0 0 #c7a7e8, -1px 1px 0 #c7a7e8, 0 1px 0 #c7a7e8, 1px 1px 0 #c7a7e8; }
.skill-filter-active, .skill-category-active, .skill-unlock-details .skill-category-active { color:#000; text-shadow:-1px -1px 0 #f38bb5, 0 -1px 0 #f38bb5, 1px -1px 0 #f38bb5, -1px 0 0 #f38bb5, 1px 0 0 #f38bb5, -1px 1px 0 #f38bb5, 0 1px 0 #f38bb5, 1px 1px 0 #f38bb5; }
.skill-filter-unlocks, .skill-category-unlocks, .skill-unlock-details .skill-category-unlocks { color:#000; text-shadow:-1px -1px 0 #e4b83f, 0 -1px 0 #e4b83f, 1px -1px 0 #e4b83f, -1px 0 0 #e4b83f, 1px 0 0 #e4b83f, -1px 1px 0 #e4b83f, 0 1px 0 #e4b83f, 1px 1px 0 #e4b83f; }
.skill-unlocks { min-height: 175px; }
.farming-overview-list h3 { margin: 9px 0 4px; color: #f2df9d; font-size: calc(13px * var(--text-scale)); }
.farming-overview-row { min-height: 45px; padding: 7px; border: 1px solid #53644d; color: #fff1b3; background: #27352a; }
.farming-overview-top { display: flex; align-items: center; gap: 8px; }
.farming-overview-top span { min-width: 0; flex: 1; color: #e7edcf; font-size: calc(12px * var(--text-scale)); }
.farming-overview-location { color: #fff1b3; }
.farming-overview-top button { flex: 0 0 auto; padding: 4px 7px; font-size: calc(11px * var(--text-scale)); }
.farming-overview-time { display: block; margin-top: 3px; color: #c5d1bd; font-size: calc(11px * var(--text-scale)); }
.skill-unlock { display: grid; grid-template-columns: 40px minmax(0, 1fr) 54px; gap: 8px; align-items: center; min-height: 52px; padding: 7px; border: 1px solid #53644d; color: #fff1b3; background: #27352a; }
.skill-unlock-level { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid #8d804f; color: #f4dc83; background: #1a271e; font-size: calc(24px * var(--text-scale)); font-weight: 700; line-height: 1; }
.skill-unlock-level.missing { border-color: #a94f4a; color: #ff8b83; background: #351b1b; }
.skill-unlock-details { min-width: 0; overflow-wrap: anywhere; }
.skill-unlock-details small { color: #c5d1bd; font-size: calc(11px * var(--text-scale)); }
.skill-unlock-details small { display: block; margin-top: 3px; }
.skill-unlock-details .crafting-requirement { text-transform: none; }
.skill-unlock-details .equipment-description { text-transform: none; }
.skill-unlock-details .crafting-requirement-line { margin-top: 3px; color: #c5d1bd; font-size: calc(11px * var(--text-scale)); text-transform: none; white-space: normal; }
.skill-unlock-details .crafting-requirement-line .crafting-requirement { display: inline; margin: 0; }
.skill-unlock-details .crafting-requirement-line { padding-left: 4px; }
.skill-unlock-details .crafting-requirement.missing { color: #ef7770; }
.skill-unlock-action { display: flex; min-width: 0; width: 54px; justify-content: stretch; overflow: hidden; }
.skill-unlock-action button { min-width: 0; max-width: 100%; width: 100%; padding: 4px 3px; font-size: calc(11px * var(--text-scale)); overflow-wrap: anywhere; white-space: normal; touch-action: manipulation; }
.skill-detail #skill-back { justify-self: start; align-self: end; padding: 6px 14px; }
.abilities-list { display: grid; gap: 8px; }
.ability-row { display: grid; grid-template-columns: 42px 1fr auto; gap: 10px; align-items: center; padding: 9px; border: 1px solid #53644d; background: #27352a; }
.ability-icon { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #8d804f; color: #f4dc83; background: #1a271e; font-size: calc(23px * var(--text-scale)); }
.ability-details strong, .ability-details small { display: block; }
.ability-details strong { color: #fff1b3; }
.ability-details small { margin-top: 3px; color: #c5d1bd; font-size: calc(11px * var(--text-scale)); }
.ability-row button { padding: 6px 8px; font-size: calc(11px * var(--text-scale)); }
.foreground-menu { z-index: 7; }
.player-profile-panel { position: absolute; left: 10px; top: 10px; width: max-content; max-width: calc(100% - 20px); padding: 10px; border: 2px solid #d1bb6f; color: #fffbe3; background: #17251cee; }
.player-profile-heading { display: grid; grid-template-columns: 15ch max-content; align-items: center; gap: 18px; padding-bottom: 8px; border-bottom: 1px solid #a38e50; color: #f6db83; }
.player-profile-heading strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.player-profile-heading button { flex: 0 0 auto; padding: 0 2px; border: 0; color: #fff1b3; background: transparent; font-size: calc(22px * var(--text-scale)); line-height: 1; }
.player-profile-skills { display: grid; grid-template-columns: max-content max-content; gap: 5px 1ch; padding-top: 8px; }
.player-profile-skill { display: contents; }
.player-profile-skill > :first-child { text-align: right; }
.player-profile-skill > :last-child { min-width: 2ch; text-align: right; }
.player-profile-message { margin: 10px 0 0; color: #a9c8a3; font-size: calc(12px * var(--text-scale)); }
.context-menu { position: absolute; z-index: 7; min-width: 130px; padding: 0; border: 1px solid #e4d183; color: #fffbe3; background: transparent; }
.context-menu strong { display: block; padding: 7px 8px; border-bottom: 1px solid #a38e50; color: #f6db83; background: #25392b; }
.context-menu strong:has(+ #context-details:not([hidden])) { padding-bottom: 3px; border-bottom: 0; }
.context-menu #context-details { display: block; margin: 0; padding: 0 8px 7px; border-bottom: 1px solid #a38e50; color: #a9c8a3; background: #25392b; font-size: calc(11px * var(--text-scale)); }
.context-menu #context-details { white-space: pre-line; line-height: 1.35; }
.context-menu #context-details[hidden] { display: none; }
.context-menu .context-group-details { display: block; margin: 0; padding: 0 8px 7px; border-bottom: 1px solid #a38e50; color: #a9c8a3; background: #25392b; font-size: calc(11px * var(--text-scale)); white-space: pre-line; line-height: 1.35; }
.context-menu .context-group-label:has(+ .context-group-details) { padding-bottom: 3px; border-bottom: 0; }
.context-menu button { display: block; width: 100%; margin: 0; border: 0; border-top: 1px solid #8d804f; text-align: left; background: #314936; }
.context-menu #context-actions button:first-child { border-top: 0; }
.context-menu #context-actions button { color: #fff1b3; background: #48634c; }
.context-menu #context-actions button .context-requirement-unmet { color: #ff7770; font-weight: 700; }
.context-menu button:hover, .context-menu button:focus-visible, .context-menu button:active { border-color: #8d804f; background: #5a704f; outline: 1px solid #f6db83; outline-offset: -3px; }
.context-menu button:active { background: #687557; }
.world-edit-picker { position: absolute; inset: 0; z-index: 12; display: grid; align-items: start; justify-items: center; padding: 18px; background: transparent; }
.world-edit-picker[hidden] { display: none; }
.world-edit-picker-panel { display: flex; flex-direction: column; width: min(460px, 100%); max-height: min(560px, 100%); border: 2px solid #d1bb6f; color: #fffbe3; background: #17251c; box-shadow: 0 8px 28px #000b; }
.world-edit-picker-heading { display: flex; align-items: center; justify-content: space-between; flex: 0 0 auto; padding: 10px 12px; border-bottom: 1px solid #a38e50; color: #f6db83; background: #25392b; }
.world-edit-picker-heading button { width: 28px; height: 28px; padding: 0; border: 1px solid #a38e50; color: #fff1b3; background: #314936; font-weight: 700; }
.world-edit-picker-heading button:hover, .world-edit-picker-heading button:focus-visible { background: #5a704f; outline: 1px solid #f6db83; outline-offset: -3px; }
.world-edit-picker-search { box-sizing: border-box; width: calc(100% - 24px); margin: 10px 12px 0; padding: 6px 8px; border: 1px solid #8d804f; border-radius: 0; color: #fffbe3; background: #27392b; font: inherit; }
.world-edit-picker-search:focus { border-color: #f6db83; outline: 1px solid #f6db83; outline-offset: -3px; }
.world-edit-picker-error { min-height: 0; padding: 0 12px; color: #ff8a80; font-size: calc(12px * var(--text-scale)); }
.world-edit-picker-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 12px; overflow-y: auto; scrollbar-color: #758764 #172019; }
.world-edit-picker-option { display: grid; gap: 6px; min-width: 0; padding: 8px; border: 1px solid #53644d; color: #fff1b3; background: #27392b; text-align: center; }
.world-edit-picker-option:hover, .world-edit-picker-option:focus-visible { border-color: #f6db83; background: #48634c; outline: 1px solid #f6db83; outline-offset: -3px; }
.world-edit-picker-preview { display: grid; place-items: center; width: 32px; height: 32px; justify-self: center; background: #658f4b; background-image: linear-gradient(135deg, #ffffff18 25%, transparent 25%, transparent 50%, #ffffff18 50%, #ffffff18 75%, transparent 75%); background-size: 12px 12px; color: #f6db83; font-size: 24px; }
.world-edit-picker-preview img { width: 32px; height: 32px; object-fit: contain; image-rendering: pixelated; }
.world-edit-picker-none { background: #1a271e; background-image: none; border: 1px dashed #758764; }
.world-edit-picker-id { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: calc(12px * var(--text-scale)); }
.world-edit-preview-dirt { background-color: #8a6742; background-image: radial-gradient(#503b2966 1px, transparent 1px); background-size: 9px 9px; }
.world-edit-preview-path { background-color: #bc9d62; background-image: radial-gradient(#816a4166 1px, transparent 1px); background-size: 10px 10px; }
.world-edit-preview-cliff, .world-edit-preview-rock { background-color: #6d695f; background-image: linear-gradient(#9a928244 20%, transparent 20%, transparent 55%, #4f4d4844 55%, #4f4d4844 70%, transparent 70%); }
@media (max-width: 520px) { .world-edit-picker { padding: 8px; } .world-edit-picker-panel { max-height: 100%; } .world-edit-picker-grid { gap: 6px; padding: 8px; } .world-edit-picker-option { padding: 5px; } }
.session-screen { position: absolute; inset: 0; z-index: 4; display: grid; align-items: start; justify-items: center; padding: 28px 18px; overflow: auto; background: #101b14e8; }
.session-screen { --text-scale: 1; }
.session-screen[hidden] { display: none; }
.session-layout { display: grid; width: min(820px, 100%); grid-template-columns: minmax(0, 390px) minmax(0, 1fr); align-items: start; gap: 18px; }
.login-panel { width: min(390px, 100%); padding: clamp(20px, 5vw, 32px); border: 2px solid #8aa56f; background: #1d3024; text-align: center; }
.eyebrow { margin: 0; color: #f0d77c; letter-spacing: .15em; text-transform: uppercase; }
.session-layout > .login-panel > .eyebrow:first-child, .patch-notes-panel > .eyebrow:first-child { margin-bottom: 18px; }
.session-layout > .login-panel > .eyebrow:first-child + *, .patch-notes-panel > .eyebrow:first-child + * { margin-top: 0; }
.character-option { margin-bottom: 18px; }
.account-character-row { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: min(280px, 100%); margin: 0 auto 14px; text-align: left; }
.account-character-row span { font-size: 18px; line-height: 1.2; }
.account-character-row button { flex: 0 0 auto; padding: 6px 12px; font-size: 14px; }
.character-card { display: flex; align-items: center; gap: 14px; margin: 0 0 8px; padding: 13px; border: 1px solid #4e7458; background: #15251b; text-align: left; }
.character-card strong, .character-card small { display: block; }
.character-card strong { color: #fff1b3; font-size: 18px; }
.account-badge { display: inline-block; margin-left: 4px; padding: 1px 4px; border: 1px solid #947f46; color: #e7d27f; font-size: 9px; font-weight: 400; vertical-align: middle; }
.character-card small { margin-top: 4px; color: #aebfa8; font-size: 11px; line-height: 1.35; }
.connect-character { width: 100%; padding: 11px; background: #527c5d; }
#disconnect:hover, #disconnect:focus-visible, #disconnect:active { border-color: #a38e50; outline-offset: -3px; }
.login-note { margin: 13px 0 0; font-size: 10px; }
.entry-email { display: grid; justify-items: center; margin: 18px 0 9px; }
.entry-email input { width: min(100%, 300px); box-sizing: border-box; padding: 10px 12px; border: 1px solid #a38e50; border-radius: 0; appearance: none; color: #fffbe3; background: #15251b; font-family: "Times New Roman", Times, serif; font-size: 20px; font-stretch: expanded; letter-spacing: .03em; line-height: 1.2; text-align: center; }
.entry-email input::placeholder { color: #c9b978; opacity: 1; }
.entry-email input:focus { border-color: #f6db83; outline: 1px solid #f6db83; outline-offset: -3px; background: #1d3024; }
.entry-account-actions { display: flex; align-items: center; justify-content: center; gap: 8px; }
.entry-account-actions button { flex: 0 1 auto; }
.entry-account-actions a, .guest-entry a { color: #f0d77c; font-size: 12px; }
.registration-options { display: grid; justify-items: start; width: fit-content; max-width: 100%; margin: 18px auto 20px; gap: 10px; text-align: left; }
.registration-options label { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.registration-options label[hidden] { display: none; }
.registration-options input { flex: 0 0 auto; margin: 0; }
.registration-back-link { display: block; margin-top: 10px; color: #f0d77c; font-size: 12px; }
.guest-entry { margin-top: 28px; padding-top: 22px; border-top: 1px solid #53644d; }
.guest-entry .eyebrow { margin-bottom: 18px; }
.guest-entry-error { margin: 0 0 9px; color: #ef7770; font-size: 12px; line-height: 1.3; }
.guest-entry button { width: 100%; background: #527c5d; }
.guest-entry a { display: block; margin-top: 9px; }
.guest-entry #register-guest-link { display: block; margin-top: 9px; color: #c9d8bd; font-size: 12px; }
.guest-entry #register-guest-link a { display: inline; margin: 0; }
.guest-entry #register-guest-link[hidden] { display: none; }
.patch-notes-panel { min-width: 0; padding: clamp(20px, 5vw, 32px); border: 2px solid #8aa56f; background: #1d3024; text-align: left; }
.patch-notes-panel .eyebrow { text-align: center; }
#patch-notes { max-height: min(520px, calc(100vh - 130px)); margin: 14px 0 0; overflow: auto; color: #c9d8bd; font: 12px/1.5 inherit; white-space: pre-wrap; scrollbar-color: #758764 #172019; }
@media (max-width: 620px) { #game-wrap { --left-trigger-width: 25px; } .game-shell { width: calc(100% - 8px); height: calc(100% - 8px); height: calc(100dvh - 8px); margin: 4px; } .game-header { gap: 10px; min-height: 60px; padding: 6px 8px; } .game-brand h1 { font-size: 25px; } .movement-help { font-size: 11px; } .header-actions { max-width: 165px; } #session-status { width: 100%; text-align: right; } #disconnect { padding: 6px 8px; font-size: 10px; } .side-toggle { width: 45px; height: 45px; font-size: 23px; } .right-menu-panel { right: 45px; width: min(285px, calc(100% - 45px)); max-height: 100%; padding: 9px; z-index: 6; } .shop-panel { z-index: 6; } .context-menu { z-index: 7; } .inventory-grid { gap: 3px; } .character-log-toggle { padding-right: 0; padding-left: 0; text-align: center; } .activity-label-full { display:none; } .activity-label-compact { display:inline; } .character-log, .settings, .help, .highscores { width: 210px; } .character-log-panel, .settings-panel, .help-panel, .highscores-panel { width: 210px; height: min(300px, calc(100vh - 170px)); min-height: 230px; } }
@media (max-width: 700px) { .session-layout { grid-template-columns: 1fr; } .patch-notes-panel { order: 2; } #patch-notes { max-height: min(420px, calc(100vh - 190px)); overflow-y: auto; } }
@media (max-width: 420px) { .game-header { grid-template-columns: auto 1fr; gap: 5px 10px; } .movement-help { grid-column: 1 / -1; grid-row: 2; text-align: left; } .header-actions { width: 100%; max-width: none; justify-content: flex-end; flex-wrap: wrap; } #session-status { width: 100%; min-width: 0; text-align: right; } }

.idle-action-controls { border-color: #a38e50; background-color: #17251c80; }
.character-log-panel { border-color: #a38e50; background-color: #14201980; }
.right-menu-panel { border-color: #a38e50; background-color: #17251c80; scrollbar-color: #758764 #17201980; }
.context-menu { border-color: #a38e50; background-color: #1c2c2180; }
.login-panel { border-color: #a38e50; }
.character-log-toggle, .side-toggle, .inventory-slot, .skill-row, .skill-icon, .skill-unlock, .skill-unlock-level, .ability-row, .ability-icon, .quest-row, .character-card, .account-badge { border-color: #8d804f; }
@media (max-width: 620px) { .chat-panel { z-index: 6; left: var(--chat-left-offset); right: 49px; bottom: 0; height: min(260px, 100%); } }