:root{color-scheme:light;--ink:#324836;--muted:#7b8775;--line:#dce0d1;--paper:#fffdf4;--green:#3f634b}*{box-sizing:border-box}body{margin:0;background:#f0f1e8;color:var(--ink);font:14px/1.5 ui-sans-serif,system-ui,sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;border:1px solid #d5dbcc;border-radius:9px;background:#f7f8ef;color:var(--ink);padding:10px 13px;transition:background .2s,transform .2s}button:hover{background:#e7ecde}button:active{transform:translateY(1px)}button:disabled{cursor:not-allowed;opacity:.45}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #cbac67;outline-offset:3px}[hidden]{display:none!important}header{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 36px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:10px;align-items:center;font-size:31px;line-height:1;color:#526d4d}.brand>span{font-size:23px;font-weight:750;letter-spacing:-.8px}.brand small{display:block;font-size:8px;letter-spacing:2.2px;font-weight:600;margin-top:8px;color:#86917b}.weather-pill{display:flex;gap:14px;align-items:center;background:#f8f9f0;padding:10px 18px;border:1px solid var(--line);border-radius:30px;font-size:12px}#weather-icon{color:#be9743;font-size:20px}#weather-name{border-left:1px solid #d8ddcc;padding-left:12px;color:#8c947e}header>a:last-child{font-size:12px}main{display:grid;grid-template-columns:minmax(0,1fr) 365px;gap:22px;padding:22px;max-width:1800px;margin:auto}.world-stage{position:relative;border-radius:18px;overflow:hidden;min-height:810px;background:#dce7dd;border:1px solid #cddbc8;isolation:isolate}canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.world-title{position:absolute;top:28px;left:30px;pointer-events:none}.eyebrow{font:10px ui-monospace,monospace;letter-spacing:1.65px;color:#829077}.world-title .eyebrow{color:#6b8062}h1{font:clamp(32px,3.2vw,52px)/1.05 Georgia,serif;letter-spacing:-1.7px;font-weight:400;margin:13px 0;color:#3e5740;text-shadow:0 2px 10px #eaf0db}p{margin:9px 0}.world-title p{font-size:12px;color:#6b7f66;max-width:280px}.world-status{position:absolute;bottom:72px;left:50%;transform:translateX(-50%);padding:9px 16px;border-radius:20px;background:#fffdf0ed;border:1px solid #d5dfc7;color:#58704d;font-size:11px;max-width:90%;text-align:center;width:max-content}.camera-controls{position:absolute;bottom:20px;left:20px;display:flex;align-items:center;gap:5px}.camera-controls button{background:#f7f8eddd;width:36px;height:36px;padding:0;font-size:20px}.camera-controls span{margin-left:9px;font-size:10px;color:#697f65}.village-stats{position:absolute;right:20px;top:22px;display:flex;flex-direction:column;align-items:flex-end;gap:7px;font-size:10px;color:#657c60}.village-stats span{background:#fffdf0bb;border-radius:20px;padding:6px 10px}aside{display:flex;flex-direction:column;gap:15px}.panel{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 4px 12px #465e3510}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:17px}.tag{font:9px ui-monospace,monospace;color:#88947d}.controls>label{font-size:12px;font-weight:600}.key-row{display:flex;gap:7px;margin-top:6px}input,select{background:#f5f5eb;border:1px solid #d9decd;border-radius:7px;color:#53634c;padding:9px;min-width:0}#key{flex:1;width:100%;font-size:12px}.quiet{border:none;background:none;padding:7px;font-size:11px}.privacy{font-size:10px;line-height:1.7;color:#909980}.transport{display:flex;gap:8px;margin:16px 0}.transport button{font-size:12px;flex:1}.primary{background:var(--green);color:#fffdf0;border-color:var(--green)}.primary:hover{background:#324f3b}.settings{display:grid;grid-template-columns:1fr 1fr;gap:12px}.settings label{font-size:10px;color:#8a937c}.settings select,.settings input{display:block;width:100%;margin-top:5px;font-size:11px}.usage{display:flex;justify-content:space-between;font-size:9px;color:#929a84;margin-top:12px}#error{font-size:12px;color:#9a4433;background:#f8e9df;padding:10px;border-radius:7px}.residents{display:flex;gap:6px}.residents button{flex:1;font-size:12px;padding:8px}.residents button.selected{background:#e7ecda;border-color:#a4b491}.residents i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px}.mira{background:#dba053}.rowan{background:#72a8a2}.pip{background:#b294c1}.resident-header{display:flex;justify-content:space-between;align-items:center;margin-top:16px}.resident-header h2{font:29px Georgia,serif;margin:0}.resident-header>span{font-size:12px;color:#ac8c43}#personality{font-size:11px;color:#8b947f;line-height:1.65;min-height:36px}.need{margin:12px 0}.need>div{display:flex;justify-content:space-between;font-size:10px;color:#7c8d70;margin-bottom:5px}.need progress{display:block;width:100%;height:6px;appearance:none;border:none;border-radius:9px;background:#edf0e5}.need progress::-webkit-progress-bar{background:#edf0e5;border-radius:9px}.need progress::-webkit-progress-value{background:#9ab387;border-radius:9px}.need progress::-moz-progress-bar{background:#9ab387;border-radius:9px}.need:first-child progress::-webkit-progress-value{background:#d7b879}.thought{background:#f1f3e7;border-left:3px solid #bbcba2;padding:11px 13px;border-radius:0 8px 8px 0;margin-top:17px}.thought>span{font:9px ui-monospace,monospace;color:#8e9d7c;text-transform:uppercase;letter-spacing:1px}.thought p{font-size:12px;margin:5px 0;color:#667958}details{border-top:1px solid var(--line);margin-top:15px;padding-top:12px}summary{font-size:11px;cursor:pointer;color:#6d7d61;display:flex;justify-content:space-between}details p{font-size:11px;color:#8c957f}details pre{font:10px/1.6 ui-monospace,monospace;overflow:auto;max-height:170px}.probability{font-size:11px;display:flex;justify-content:space-between;margin-top:8px}.influence h3{font:22px Georgia,serif;margin:8px 0 13px}.influence>div{display:flex;flex-wrap:wrap;gap:6px}.influence button{font-size:11px;padding:8px 10px}.influence p{font-size:10px;color:#8c987e;margin-top:12px}.journal{grid-column:1/-1;background:#e9ecdf;border-radius:12px;padding:23px 28px;display:grid;grid-template-columns:1fr 1.6fr;gap:30px}.journal h2{font:25px Georgia,serif;margin:9px 0}.journal ol{list-style:none;margin:0;padding:0;max-height:160px;overflow:auto}.journal li{font-size:12px;color:#708064;padding:7px 0;border-bottom:1px solid #d7decb}.journal time{font:10px ui-monospace,monospace;margin-right:14px;color:#9ba58f}footer{padding:10px 30px 25px;display:flex;gap:20px;color:#8e987f;font-size:11px;max-width:1800px;margin:auto}footer>span{margin-right:auto}#render-error{position:absolute;top:50%;left:10%;right:10%;padding:25px;background:#fff5df;border:1px solid #c2aa80;border-radius:12px;text-align:center}@media(min-width:1500px){.world-stage{min-height:850px}}@media(max-width:1000px){main{grid-template-columns:1fr}.world-stage{min-height:640px}aside{display:grid;grid-template-columns:1fr 1fr}.influence{grid-column:1/-1}.world-title h1{font-size:42px}.journal{grid-template-columns:1fr}.journal h2{margin-bottom:0}}@media(max-width:600px){header{height:73px;padding:0 16px}.brand>span{font-size:20px}.brand small{font-size:6px}.weather-pill{padding:7px 10px;gap:5px;font-size:10px}#weather-name{display:none}header>a:last-child{display:none}main{padding:10px;gap:12px}.world-stage{min-height:570px;border-radius:13px}.world-title{left:20px;top:20px}.world-title h1{font-size:35px}.world-title p{max-width:230px;font-size:11px}.village-stats{top:auto;bottom:115px;right:12px;font-size:9px}.camera-controls{left:12px;bottom:15px}.camera-controls span{font-size:9px;max-width:115px}.world-status{font-size:10px;bottom:66px}aside{display:flex}.panel{padding:18px}.journal{padding:20px;gap:10px}.journal h2{font-size:23px}footer{flex-wrap:wrap;padding:15px;font-size:10px}footer>span{width:100%}.settings label,.privacy,.usage{font-size:11px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Game HUD keeps the world in view while longer controls scroll independently. */
@media(min-width:1001px){.world-stage{position:sticky;top:18px;height:calc(100vh - 122px);min-height:620px;max-height:1050px;align-self:start}aside{max-height:calc(100vh - 122px);overflow-y:auto;padding-right:5px;scrollbar-width:thin;scrollbar-color:#b2bda6 transparent}}
.world-title h1{font-size:clamp(36px,4vw,60px);margin:8px 0}.world-title p{max-width:300px}.world-title{z-index:1}.world-title .eyebrow{text-transform:uppercase}.town h3{font:24px Georgia,serif;margin:10px 0}.town-totals{display:flex;justify-content:space-between;font-size:10px;color:#7b8775;margin:16px 0}.town-totals b{display:block;font:26px Georgia,serif;color:#506d47}.goal{display:flex;justify-content:space-between;font-size:11px;padding:9px 0;border-bottom:1px solid #e6e9db}.goal b{font:10px ui-monospace,monospace;color:#9a874a}.upgrades{display:grid;gap:7px;margin-top:16px}.upgrades button{font-size:11px}.town p{font-size:10px;color:#88947d}.thought progress{width:100%;height:5px;accent-color:#6d9060}.camera-controls button[aria-pressed=true]{background:#55704f;color:white}.probability{padding:4px 0;border-bottom:1px solid #edf0e4}.world-stage{box-shadow:inset 0 0 100px #526c3510,0 10px 30px #526c3510}

/* Full viewport game surface and floating HUD. */
.game-ui{height:100dvh;overflow:hidden;background:#dce7dd}
.game-ui main{display:block;margin:0;padding:0;max-width:none}
.game-ui .world-stage{position:fixed;inset:0;width:100%;height:100dvh;min-height:0;max-height:none;border:0;border-radius:0;box-shadow:none}
.game-ui header{position:fixed;z-index:10;top:18px;left:24px;right:24px;height:48px;padding:0;border:0;pointer-events:none}
.game-ui header>*{pointer-events:auto}.game-ui .brand{font-size:27px}.game-ui .brand>span{font:26px Georgia,serif;letter-spacing:-1px}.game-ui .brand small{font:8px ui-monospace,monospace;letter-spacing:2px;color:#667855}
.hud-glass,.game-ui .panel,.game-ui .journal,.game-ui .weather-pill,.game-ui #hud-panels{background:#fffdf0ed;border:1px solid #ffffffe0;box-shadow:0 10px 35px #243e2520,inset 0 0 0 1px #bac8ae40;backdrop-filter:blur(16px)}
.game-ui .weather-pill{position:absolute;left:50%;transform:translateX(-50%);border-radius:14px}
.game-ui #fullscreen{margin-left:auto;width:42px;height:42px;font-size:24px;padding:0;border-radius:12px}
.game-ui .world-title{top:80px;left:26px}.game-ui .world-title .eyebrow{font-size:9px}
.game-ui .village-stats{top:83px;right:24px;flex-direction:row;gap:6px}.game-ui .village-stats span{background:#fffdf0e8;font-size:10px}
.game-ui #hud-panels{position:fixed;z-index:9;top:126px;right:24px;bottom:auto;width:320px;max-height:calc(100dvh - 244px);display:block;overflow-y:auto;border-radius:18px;padding:0;scrollbar-width:thin;scrollbar-color:#b2bda6 transparent}
.drawer-heading{position:sticky;top:0;z-index:1;background:#f7f7ebf5;display:flex;align-items:center;justify-content:space-between;padding:12px 17px;border-bottom:1px solid #dde3d0;font-size:12px;font-weight:650}.drawer-heading button{padding:0;border:0;background:none;font-size:24px;line-height:1;width:28px;height:28px}
.game-ui .panel{border:0;background:transparent;box-shadow:none;border-radius:0;backdrop-filter:none;padding:18px}.game-ui .panel-heading{margin-bottom:13px}.game-ui .panel .tag{font-size:8px}
.game-ui footer{display:flex;flex-wrap:wrap;padding:14px 0 0;gap:10px;font-size:10px;border-top:1px solid #dce0d1;margin-top:18px}.game-ui footer>span{width:100%;margin:0}
.resident-overview{position:fixed;z-index:8;left:24px;top:126px;width:272px;padding:16px;border-radius:17px}.overview-heading{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}#overview-summary{font-size:11px;color:#7b886f}.resident-card{display:block;width:100%;text-align:left;padding:11px 10px;margin-top:7px;background:#f7f8edb0;border:1px solid #dce3cf;border-radius:11px}.resident-card[aria-pressed=true]{border-color:#96ac81;background:#e8efdc}.resident-card-head{display:flex;align-items:center;gap:7px}.resident-card-head i{width:9px;height:9px;border-radius:50%}.resident-card-head b{font-size:12px}.resident-card-head small{margin-left:auto;font-size:9px;color:#859270}.resident-card .resident-task{font-size:11px;color:#617454;display:block;margin:5px 0 7px}.resident-meters{display:flex;gap:8px}.resident-meters span{font-size:9px;color:#7e8b73}.resident-meters strong{font-weight:600;color:#506445}.resident-card.needs-care{border-left:3px solid #cf9c66}
.game-ui .journal{position:fixed;z-index:8;left:24px;bottom:144px;width:290px;display:block;padding:14px 16px;border-radius:15px}.news-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.news-heading .eyebrow{font-size:9px;letter-spacing:1px}.news-heading button{background:none;border:0;padding:3px;font-size:10px}.game-ui .journal ol{max-height:112px;margin-top:7px}.game-ui .journal li{font-size:11px;line-height:1.6}.game-ui .journal time{margin-right:8px}.game-ui .journal li:first-child{color:#435f38}
.game-dock{position:fixed;z-index:12;bottom:max(20px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:12px;align-items:center;padding:9px;border-radius:18px;width:max-content;max-width:calc(100% - 32px)}.game-dock .transport{margin:0;gap:6px}.game-dock .transport button{flex:none;font-size:12px;padding:12px 16px}.dock-tabs{display:flex;gap:3px;border-left:1px solid #d8dfcb;padding-left:10px}.dock-tabs button{background:none;border-color:transparent;font-size:17px;padding:8px 12px}.dock-tabs button span{display:block;font-size:9px;margin-top:2px}.dock-tabs button[aria-expanded=true]{background:#e4ecd8;border-color:#c2d0b1}
.game-ui .camera-controls{bottom:100px;left:50%;transform:translateX(-50%);gap:4px}.game-ui .camera-controls button{width:32px;height:32px;font-size:17px}.game-ui .world-status{bottom:145px;max-width:min(430px,calc(100% - 660px));font-size:10px;padding:8px 13px}.game-ui #render-error{left:32%;right:32%;z-index:2;font-size:12px}
@media(max-width:1100px){.resident-overview{width:230px}.game-ui #hud-panels{width:290px}.game-ui .journal{width:250px}.game-ui .world-status{max-width:320px;bottom:142px}.resident-meters{gap:5px}.resident-meters span{font-size:8px}}
@media(max-height:780px) and (min-width:761px){.game-ui .journal{bottom:145px}.game-ui .journal ol{max-height:55px}.resident-overview{padding:11px}.resident-card{padding:7px;margin-top:4px}.overview-heading{margin-bottom:4px}.game-ui #hud-panels{top:112px;max-height:calc(100dvh - 220px)}}
@media(max-width:760px){.game-ui header{top:12px;left:14px;right:14px}.game-ui .brand>span{font-size:22px}.game-ui .brand{font-size:22px;gap:6px}.game-ui .brand small{font-size:6px}.game-ui .weather-pill{position:static;transform:none;margin-left:auto;margin-right:10px;font-size:9px;padding:7px 9px;gap:4px}.game-ui #fullscreen{margin:0;width:34px;height:34px;font-size:21px}.game-ui #weather-name{display:none}.game-ui .world-title{top:66px;left:16px}.game-ui .village-stats{top:64px;right:14px;left:auto;bottom:auto;gap:3px}.game-ui .village-stats span{font-size:8px;padding:4px 6px}.game-ui .village-stats span:nth-child(2){display:none}.resident-overview{top:97px;left:12px;right:12px;width:auto;padding:8px;border-radius:13px}.overview-heading{margin:0 2px 5px;flex-direction:row;justify-content:space-between}.overview-heading .eyebrow{font-size:8px;letter-spacing:.8px}#overview-summary{font-size:8px}#resident-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.resident-card{padding:7px 6px;margin:0}.resident-card-head b{font-size:10px}.resident-card-head small{display:none}.resident-card .resident-task{font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:3px 0}.resident-meters{flex-wrap:wrap;gap:1px 5px}.resident-meters span{font-size:8px}.game-ui #hud-panels{top:auto;bottom:151px;left:12px;right:12px;width:auto;max-height:calc(100dvh - 355px);border-radius:16px;z-index:11}.game-ui .panel{padding:14px}.game-ui .journal{left:12px;bottom:151px;width:calc(100% - 24px);padding:8px 12px}.game-ui .journal ol{max-height:65px}.game-ui .journal li{font-size:10px}.game-dock{bottom:max(10px,env(safe-area-inset-bottom));width:calc(100% - 24px);max-width:440px;flex-direction:column;gap:5px;padding:7px}.game-dock .transport{width:100%}.game-dock .transport button{flex:1;padding:9px 10px}.dock-tabs{width:100%;border-left:0;border-top:1px solid #d8dfcb;padding:3px 0 0;justify-content:space-around}.dock-tabs button{padding:3px 12px;font-size:15px}.dock-tabs button span{font-size:8px;margin:0}.game-ui .camera-controls{bottom:115px;left:14px;transform:none;gap:3px}.game-ui .camera-controls button{width:26px;height:26px;font-size:16px}.game-ui .world-status{bottom:115px;left:auto;right:12px;transform:none;max-width:calc(100% - 205px);font-size:8px;padding:6px 9px}.game-ui #render-error{left:18px;right:18px;top:42%;padding:14px}}
@media(max-height:620px) and (min-width:761px){.resident-overview{top:106px}.game-ui .journal{display:none}.game-ui .world-title{display:none}.game-ui #hud-panels{max-height:calc(100dvh - 215px)}}

@media(max-height:620px) and (min-width:761px){.resident-overview{max-height:calc(100dvh - 245px);overflow:auto}.game-ui .world-status{max-width:300px}}
@media(max-height:540px) and (max-width:760px){.resident-overview{display:none}.game-ui #hud-panels{max-height:calc(100dvh - 225px);bottom:145px}.game-ui .journal{max-height:70px;overflow:auto}}

/* Quiet activity typography and a moonlit palette for the complete HUD. */
.thought{background:transparent;border:0;border-radius:0;padding:14px 0 4px;margin-top:12px}.thought>span{font:11px ui-sans-serif,system-ui,sans-serif;letter-spacing:0;text-transform:none;color:#839176}.thought p{font:18px/1.4 Georgia,serif;margin:6px 0 10px;color:#415b37}.thought progress{height:3px}
:root[data-night=true]{color-scheme:dark;--ink:#e1e6d7;--muted:#a8b6a2;--line:#536350;--paper:#24352e;--green:#637c53}
[data-night=true] .game-ui{background:#1e2d3b;color:#e1e6d7}
[data-night=true] .hud-glass,[data-night=true] .game-ui .journal,[data-night=true] .game-ui .weather-pill,[data-night=true] .game-ui #hud-panels{background:#1e302cef;border-color:#62706480;box-shadow:0 12px 36px #0005,inset 0 0 0 1px #7e8c6720}
[data-night=true] .game-ui .brand,[data-night=true] .game-ui .brand small,[data-night=true] .game-ui .world-title .eyebrow,[data-night=true] .eyebrow{color:#c0cdb1}
[data-night=true] .drawer-heading{background:#263a32;border-color:#4a5a46;color:#e2e6d4}
[data-night=true] button,[data-night=true] input,[data-night=true] select{color:#e0e6d6;background:#2a3e34;border-color:#4c6146}
[data-night=true] button:hover{background:#3b5140}[data-night=true] .game-ui .primary{background:#718651;color:#fffbe7}
[data-night=true] .resident-card,[data-night=true] .game-ui .village-stats span,[data-night=true] .game-ui .world-status,[data-night=true] .game-ui .camera-controls button{background:#263b31ed;color:#d3dfc5;border-color:#526449}
[data-night=true] .resident-card[aria-pressed=true],[data-night=true] .residents button.selected,[data-night=true] .dock-tabs button[aria-expanded=true]{background:#405139;border-color:#849465;color:#f1eed5}
[data-night=true] .game-ui .panel{background:transparent}
[data-night=true] .resident-meters strong,[data-night=true] .resident-card .resident-task,[data-night=true] .thought p,[data-night=true] .game-ui .journal li:first-child,[data-night=true] .town-totals b{color:#e0e7d1}
[data-night=true] #personality,[data-night=true] .privacy,[data-night=true] .usage,[data-night=true] .settings label,[data-night=true] .resident-meters span,[data-night=true] .resident-card-head small,[data-night=true] #overview-summary,[data-night=true] .game-ui .journal li,[data-night=true] .town p,[data-night=true] .influence p,[data-night=true] .need>div,[data-night=true] .thought>span,[data-night=true] summary,[data-night=true] details p,[data-night=true] .tag,[data-night=true] .town-totals,[data-night=true] footer,[data-night=true] #weather-name{color:#b1bea6}
[data-night=true] .goal,[data-night=true] .probability,[data-night=true] .dock-tabs,[data-night=true] .game-ui .journal li,[data-night=true] details{border-color:#465840}
[data-night=true] .need progress,[data-night=true] .need progress::-webkit-progress-bar{background:#40513b}[data-night=true] .need progress::-webkit-progress-value{background:#a5b877}
[data-night=true] #error,[data-night=true] #render-error{background:#483b2d;color:#f1d5ae;border-color:#8d7250}
[data-night=true] .game-ui .world-stage{background:#1e2d3b}

/* Bigger world: minimap, resident editor, conditions and rules panels. */
@media(min-width:761px){.game-ui #hud-panels{width:340px}}
.game-ui .panel h4{font:600 10px ui-monospace,monospace;letter-spacing:1.2px;text-transform:uppercase;color:#7d8b6f;margin:18px 0 8px}
.game-ui .panel label{display:block;font-size:11px;color:#6f7d63;margin:6px 0}
.game-ui .panel label>input:not([type=checkbox]):not([type=range]),.game-ui .panel label>select,.game-ui .panel label>textarea{display:block;width:100%;margin-top:4px;font-size:12px}
textarea{font:inherit;background:#f5f5eb;border:1px solid #d9decd;border-radius:7px;color:#53634c;padding:8px;width:100%;resize:vertical;min-height:52px}
input[type=color]{padding:2px;height:32px;cursor:pointer}
input[type=range]{width:100%;accent-color:#6d9060;margin:4px 0 0;padding:0;background:none;border:0}
.slider output{float:right;font:10px ui-monospace,monospace;color:#9a874a}
.pair{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:8px}
.check{display:flex!important;align-items:center;gap:8px;cursor:pointer}.check input{accent-color:#55704f;width:15px;height:15px;margin:0}.check small{margin-left:auto;font-size:9px;color:#9aa38c}
.checks{display:grid;gap:2px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chips button,.chip{font-size:11px;padding:7px 10px}
.button-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}.button-row select{flex:1}.button-row button{font-size:11px;padding:8px 11px}
.button-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.button-grid button{font-size:11px;padding:8px}
.warn{color:#9a4433;border-color:#e2c2b4}.warn:hover{background:#f6e3da}
.hint{font-size:10px;color:#909980;line-height:1.6}kbd{font:10px ui-monospace,monospace;background:#eef0e4;border:1px solid #d5dbc8;border-radius:4px;padding:0 4px;margin:0 1px}
.editor{display:grid;gap:2px;padding-top:8px}#edit-error{font-size:11px;color:#9a4433;background:#f8e9df;padding:8px;border-radius:7px}
.goal-line{font-size:11px;color:#8a7a45;font-style:italic;margin:-4px 0 6px}
.skill-row{display:flex;justify-content:space-between;font-size:10px;color:#7c8d70}#skill-stars{color:#c49a3c;letter-spacing:2px}
.bond{margin:9px 0}.bond span{display:flex;align-items:center;gap:6px;font-size:11px;color:#6f7d63;margin-bottom:4px}.bond i{width:8px;height:8px;border-radius:50%;display:inline-block}.bond progress{display:block;width:100%;height:5px;appearance:none;border:none;border-radius:9px;background:#edf0e5}.bond progress::-webkit-progress-bar{background:#edf0e5;border-radius:9px}.bond progress::-webkit-progress-value{background:#d2a0b4;border-radius:9px}.bond progress::-moz-progress-bar{background:#d2a0b4;border-radius:9px}.resident-card{padding:8px 10px;margin-top:5px}.resident-card .resident-task{margin:3px 0 4px}
.residents{flex-wrap:wrap}.residents button{flex:1 1 30%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.residents i,.resident-card-head i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;flex:none}
.residents button.selected{background:#e7ecda;border-color:#a4b491}
#companion-result{font-size:11px;color:#8a6a7a}
.council-result{font-size:11px;color:#55704f;font-style:italic}
.town-totals{gap:8px}.town-totals span{flex:1}.upgrades button{text-align:left}
.resident-overview{max-height:max(180px,calc(100dvh - 480px));overflow-y:auto;scrollbar-width:thin;scrollbar-color:#b2bda6 transparent}.resident-meters{flex-wrap:wrap;row-gap:1px}
.game-ui .weather-pill #season-name{border-left:1px solid #d8ddcc;padding-left:12px;color:#8c947e}
.minimap{position:fixed;z-index:8;right:24px;bottom:24px;padding:7px;border-radius:16px;line-height:0}.minimap canvas{position:static;width:150px;height:150px;border-radius:50%;cursor:crosshair}
body:has(#hud-panels:not([hidden])) .minimap{display:none}
.dock-tabs button{padding:8px 10px}
@media(max-width:1100px) and (min-width:761px){.game-ui #hud-panels{width:310px}}@media(max-width:1100px){.minimap canvas{width:120px;height:120px}}
@media(max-height:780px) and (min-width:761px){.minimap canvas{width:110px;height:110px}.resident-overview{max-height:max(150px,calc(100dvh - 420px))}}
@media(max-width:760px){.minimap{display:none}.game-ui .weather-pill #season-name{display:none}#resident-cards{grid-template-columns:repeat(auto-fill,minmax(92px,1fr))!important;max-height:130px;overflow-y:auto}.resident-meters span:nth-child(4){display:none}.dock-tabs button{padding:3px 6px}}
[data-night=true] textarea,[data-night=true] kbd{color:#e0e6d6;background:#2a3e34;border-color:#4c6146}
[data-night=true] .game-ui .panel h4,[data-night=true] .game-ui .panel label,[data-night=true] .hint,[data-night=true] .skill-row,[data-night=true] .bond span,[data-night=true] .check small{color:#b1bea6}
[data-night=true] .goal-line{color:#d9c68a}[data-night=true] .council-result{color:#c9dcb1}[data-night=true] #companion-result{color:#d9b3c4}
[data-night=true] .warn{color:#f1b7a2;border-color:#7d5646}[data-night=true] #edit-error{background:#483b2d;color:#f1d5ae}
[data-night=true] .game-ui .weather-pill #season-name{color:#b1bea6;border-color:#536350}
[data-night=true] .bond progress,[data-night=true] .bond progress::-webkit-progress-bar{background:#40513b}

/* Liquid glass: every floating surface is translucent, saturated and blurred, with a bright rim and a soft top sheen.
   The sheen is a background layer so it stays put while scrollable panels scroll. */
:root{--glass:linear-gradient(150deg,rgba(255,255,255,.64),rgba(255,255,255,.36));--sheen:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0) 42%);--rim:rgba(255,255,255,.8);--glass-inset:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(255,255,255,.35),inset 0 0 0 1px rgba(255,255,255,.3);--glass-shadow:0 12px 40px rgba(28,48,30,.16),0 2px 8px rgba(28,48,30,.08);--glass-blur:blur(28px) saturate(190%) brightness(1.05);--chip:rgba(255,255,255,.46);--chip-sheen:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 60%);--chip-rim:rgba(255,255,255,.78);--chip-hover:rgba(255,255,255,.75);--ink:#1f2d21;--soft-ink:#4b5a44;--selected:rgba(170,208,150,.42);--selected-rim:rgba(110,160,95,.65)}
:root[data-night=true]{--glass:linear-gradient(150deg,rgba(46,66,60,.62),rgba(16,28,30,.52));--sheen:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 42%);--rim:rgba(255,255,255,.2);--glass-inset:inset 0 1px 0 rgba(255,255,255,.26),inset 0 -1px 0 rgba(255,255,255,.05),inset 0 0 0 1px rgba(255,255,255,.07);--glass-shadow:0 14px 44px rgba(0,0,0,.42);--glass-blur:blur(28px) saturate(160%) brightness(.95);--chip:rgba(255,255,255,.07);--chip-sheen:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0) 60%);--chip-rim:rgba(255,255,255,.16);--chip-hover:rgba(255,255,255,.16);--ink:#eff3e6;--soft-ink:#c3cfb8;--selected:rgba(150,190,120,.24);--selected-rim:rgba(170,210,140,.45)}
.game-ui .hud-glass,.game-ui .weather-pill,.game-ui #hud-panels,.game-ui .journal,.game-ui .village-stats span,.game-ui .world-status,.game-ui .camera-controls button,[data-night=true] .game-ui .hud-glass,[data-night=true] .game-ui .weather-pill,[data-night=true] .game-ui #hud-panels,[data-night=true] .game-ui .journal,[data-night=true] .game-ui .village-stats span,[data-night=true] .game-ui .world-status,[data-night=true] .game-ui .camera-controls button{background:var(--sheen),var(--glass);border:1px solid var(--rim);box-shadow:var(--glass-inset),var(--glass-shadow);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);color:var(--ink)}
.game-ui #hud-panels,.game-ui .resident-overview{border-radius:26px}.game-ui .journal{border-radius:22px}.game-ui .game-dock{border-radius:30px}.game-ui .weather-pill,.game-ui .village-stats span,.game-ui .world-status{border-radius:999px;font-weight:550}.game-ui #fullscreen{border-radius:16px}.game-ui .camera-controls button{border-radius:50%}@media(min-width:761px){.game-ui .weather-pill{padding:10px 20px}.game-ui .village-stats span{padding:6px 12px}.game-ui .world-status{padding:9px 16px}.game-ui .camera-controls button{width:36px;height:36px}}.game-ui .minimap{border-radius:28px}.minimap canvas{box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}
.game-ui .drawer-heading,[data-night=true] .game-ui .drawer-heading{background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.18));border-bottom:1px solid var(--rim);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);color:var(--ink);font-size:13px}
[data-night=true] .game-ui .drawer-heading{background:linear-gradient(180deg,rgba(60,84,76,.55),rgba(30,46,44,.3))}
/* Controls inside glass become lighter glass chips. */
.game-ui #hud-panels button,.game-ui .transport button,.game-ui .camera-controls button,.game-ui #fullscreen,.game-ui .resident-card,.game-ui .news-heading button,[data-night=true] .game-ui #hud-panels button,[data-night=true] .game-ui .transport button,[data-night=true] .game-ui .resident-card,[data-night=true] .game-ui .news-heading button,[data-night=true] .game-ui #fullscreen{background:var(--chip-sheen),var(--chip);border:1px solid var(--chip-rim);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 1px 3px rgba(28,48,30,.07);color:var(--ink);border-radius:14px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
[data-night=true] .game-ui #hud-panels button,[data-night=true] .game-ui .transport button,[data-night=true] .game-ui .resident-card{box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.game-ui #hud-panels button:hover:not(:disabled),.game-ui .transport button:hover:not(:disabled),.game-ui .camera-controls button:hover,.game-ui .resident-card:hover{background:var(--chip-hover)}
.game-ui .dock-tabs button,[data-night=true] .game-ui .dock-tabs button{background:transparent;border:1px solid transparent;box-shadow:none;border-radius:18px;color:var(--ink)}
.game-ui .dock-tabs button[aria-expanded=true],[data-night=true] .game-ui .dock-tabs button[aria-expanded=true],.game-ui .resident-card[aria-pressed=true],[data-night=true] .game-ui .resident-card[aria-pressed=true],.game-ui #hud-panels .residents button.selected,[data-night=true] .game-ui #hud-panels .residents button.selected{background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,0) 70%),var(--selected);border-color:var(--selected-rim);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 2px 10px rgba(60,110,60,.14);color:var(--ink)}
.game-ui .transport .primary,.game-ui #hud-panels .primary,[data-night=true] .game-ui .transport .primary,[data-night=true] .game-ui #hud-panels .primary{background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 55%),linear-gradient(180deg,#5b8a5c,#3b6645);border:1px solid rgba(255,255,255,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 6px 18px rgba(45,95,55,.32);color:#fff;border-radius:16px;font-weight:600}
.game-ui .primary:hover:not(:disabled){filter:brightness(1.08)}
.game-ui #hud-panels .warn{color:#a2402c}[data-night=true] .game-ui #hud-panels .warn{color:#ffb9a3}
.game-ui .resident-card.needs-care{border-left:3px solid #d99a5c}
.game-ui input:not([type=checkbox]):not([type=range]):not([type=color]),.game-ui select,.game-ui textarea,[data-night=true] .game-ui input:not([type=checkbox]):not([type=range]):not([type=color]),[data-night=true] .game-ui select,[data-night=true] .game-ui textarea{background:var(--chip);border:1px solid var(--chip-rim);box-shadow:inset 0 1px 3px rgba(28,48,30,.1);border-radius:12px;color:var(--ink);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.game-ui kbd,[data-night=true] .game-ui kbd{background:var(--chip);border-color:var(--chip-rim);color:var(--ink)}
/* Readable text on glass: stronger ink and a softer secondary ink instead of the faint greys used on paper. */
.game-ui,.game-ui .brand,.game-ui .resident-header h2,.game-ui .thought p,.game-ui .town h3,.game-ui .influence h3,.game-ui .rules h3,.game-ui .town-totals b,.game-ui .resident-meters strong,.game-ui .resident-card-head b,.game-ui .journal li:first-child,[data-night=true] .game-ui .brand,[data-night=true] .game-ui .thought p,[data-night=true] .game-ui .town-totals b,[data-night=true] .game-ui .resident-meters strong,[data-night=true] .game-ui .journal li:first-child{color:var(--ink)}
.game-ui .eyebrow,.game-ui .brand small,.game-ui .world-title .eyebrow,.game-ui .privacy,.game-ui .usage,.game-ui .hint,.game-ui .settings label,.game-ui #personality,.game-ui .resident-meters span,.game-ui .resident-card-head small,.game-ui #overview-summary,.game-ui .journal li,.game-ui .journal time,.game-ui .panel p,.game-ui .need>div,.game-ui .thought>span,.game-ui summary,.game-ui details p,.game-ui .tag,.game-ui .town-totals,.game-ui footer,.game-ui #weather-name,.game-ui .weather-pill #season-name,.game-ui .panel h4,.game-ui .panel label,.game-ui .goal,.game-ui .skill-row,.game-ui .bond span,.game-ui .check small,.game-ui .resident-card .resident-task,.game-ui .slider output,.game-ui .goal b,.game-ui .probability,
[data-night=true] .game-ui .eyebrow,[data-night=true] .game-ui .brand small,[data-night=true] .game-ui .privacy,[data-night=true] .game-ui .usage,[data-night=true] .game-ui .hint,[data-night=true] .game-ui .settings label,[data-night=true] .game-ui #personality,[data-night=true] .game-ui .resident-meters span,[data-night=true] .game-ui .resident-card-head small,[data-night=true] .game-ui #overview-summary,[data-night=true] .game-ui .journal li,[data-night=true] .game-ui .panel p,[data-night=true] .game-ui .need>div,[data-night=true] .game-ui .thought>span,[data-night=true] .game-ui summary,[data-night=true] .game-ui details p,[data-night=true] .game-ui .tag,[data-night=true] .game-ui .town-totals,[data-night=true] .game-ui footer,[data-night=true] .game-ui #weather-name,[data-night=true] .game-ui .panel h4,[data-night=true] .game-ui .panel label,[data-night=true] .game-ui .skill-row,[data-night=true] .game-ui .bond span,[data-night=true] .game-ui .check small,[data-night=true] .game-ui .resident-card .resident-task{color:var(--soft-ink)}
.game-ui .resident-card .resident-task,.game-ui .journal li:first-child{font-weight:550}
.game-ui .goal,.game-ui .probability,.game-ui .journal li,.game-ui details,.game-ui .dock-tabs,.game-ui footer{border-color:rgba(255,255,255,.55)}
[data-night=true] .game-ui .goal,[data-night=true] .game-ui .probability,[data-night=true] .game-ui .journal li,[data-night=true] .game-ui details,[data-night=true] .game-ui .dock-tabs,[data-night=true] .game-ui footer{border-color:rgba(255,255,255,.12)}
.game-ui .need progress,.game-ui .bond progress{background:rgba(255,255,255,.45);box-shadow:inset 0 1px 2px rgba(28,48,30,.12)}.game-ui .need progress::-webkit-progress-bar,.game-ui .bond progress::-webkit-progress-bar{background:rgba(255,255,255,.45)}
[data-night=true] .game-ui .need progress,[data-night=true] .game-ui .bond progress,[data-night=true] .game-ui .need progress::-webkit-progress-bar,[data-night=true] .game-ui .bond progress::-webkit-progress-bar{background:rgba(255,255,255,.1)}
#error,#edit-error{border-radius:12px}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){:root{--glass:linear-gradient(150deg,rgba(255,255,255,.96),rgba(247,249,240,.92))}:root[data-night=true]{--glass:linear-gradient(150deg,rgba(40,58,54,.97),rgba(22,34,34,.95))}}
@media(prefers-reduced-transparency:reduce){:root{--glass:linear-gradient(150deg,rgba(255,255,255,.95),rgba(247,249,240,.92))}:root[data-night=true]{--glass:linear-gradient(150deg,rgba(40,58,54,.96),rgba(22,34,34,.94))}}

/* Floating glass tags for places and residents, positioned over the 3D world every frame. */
.world-tags{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;contain:strict}
.tag3d{position:absolute;left:0;top:0;display:flex;align-items:center;gap:7px;white-space:nowrap;pointer-events:auto;cursor:pointer;color:var(--ink);font:12px/1.15 system-ui,-apple-system,"Segoe UI",sans-serif;border-radius:999px;background:var(--sheen),var(--glass);border:1px solid var(--rim);box-shadow:var(--glass-inset),0 6px 18px rgba(28,48,30,.2);backdrop-filter:blur(14px) saturate(180%);-webkit-backdrop-filter:blur(14px) saturate(180%);transition:opacity .25s,filter .2s;will-change:transform;user-select:none}
.tag3d::after{content:'';position:absolute;left:50%;bottom:-5px;width:9px;height:9px;transform:translateX(-50%) rotate(45deg);background:var(--glass);border-right:1px solid var(--rim);border-bottom:1px solid var(--rim);border-bottom-right-radius:2px}
.tag3d:hover{filter:brightness(1.07);z-index:100000!important}
.tag3d.place{padding:4px 13px 4px 4px}
.tag-icon{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:14px;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.55));box-shadow:inset 0 -1px 2px rgba(28,48,30,.08),0 1px 3px rgba(28,48,30,.12)}
.tag-text{display:flex;flex-direction:column;gap:1px}.tag-text b{font-weight:680;font-size:12px;letter-spacing:-.1px}.tag-text small{font-size:10px;font-weight:550;color:var(--soft-ink)}.tag-text small:empty{display:none}
.tag3d.closed .tag-icon{filter:grayscale(.9);opacity:.7}.tag3d.closed .tag-text small{color:#a0553d}
.tag3d.person{padding:3px 4px 3px 10px;gap:6px;font-size:11.5px}
.tag3d.person i{width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.8)}
.tag3d.person b{font-weight:680}
.tag-act{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.6));box-shadow:0 1px 3px rgba(28,48,30,.12)}
.tag3d.person:not(:has(.tag-act:not([hidden]))){padding-right:11px}
.tag3d.person.selected{border-color:#ffe39a;box-shadow:var(--glass-inset),0 0 0 2px rgba(255,219,120,.75),0 8px 22px rgba(28,48,30,.28)}
.tag3d.person.care{border-color:rgba(230,150,80,.85)}.tag3d.person.care i{box-shadow:0 0 0 2px #f0b070}
.tag3d.person.inside{opacity:.7}
.tag3d.person.thinking .tag-act{animation:tag-think 1.1s ease-in-out infinite}
@keyframes tag-think{50%{transform:scale(1.18)}}
.world-tags.far .tag3d.place{padding:3px 9px 3px 3px;font-size:10px;gap:5px}.world-tags.far .tag-icon{width:19px;height:19px;font-size:10px}.world-tags.far .tag-text b{font-size:10px}.world-tags.far .tag-text small{display:none}
.world-tags.far .tag3d.person{font-size:10px;padding:2px 3px 2px 7px}.world-tags.far .tag-act{width:17px;height:17px;font-size:10px}
[data-night=true] .tag-icon,[data-night=true] .tag-act{background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,.08));box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
[data-night=true] .tag3d{box-shadow:var(--glass-inset),0 6px 18px rgba(0,0,0,.45)}
[data-night=true] .tag3d.closed .tag-text small{color:#f0a88e}
@media(prefers-reduced-motion:reduce){.tag3d.person.thinking .tag-act{animation:none}}
.world-tags.tiny .tag3d.place{padding:2px;gap:0}.world-tags.tiny .tag3d.place .tag-text{display:none}.world-tags.tiny .tag3d.place:hover .tag-text,.world-tags.tiny .tag3d.place:active .tag-text{display:flex;padding:0 8px 0 5px}

/* Line icons and resident portraits. */
.icon{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:-.2em;overflow:visible}
.glyph{display:inline-flex;align-items:center;justify-content:center;font-style:normal;line-height:0}
.game-ui .brand .glyph{font-size:26px;color:#5f8a5c;margin-right:2px}[data-night=true] .game-ui .brand .glyph{color:#c7dca8}
.game-ui .weather-pill #weather-icon{font-size:19px;color:#c79a3a}[data-night=true] .game-ui .weather-pill #weather-icon{color:#e6d59a}
.game-ui #fullscreen .glyph,.game-ui .camera-controls .glyph{font-size:17px}
.game-ui .village-stats span{display:inline-flex;align-items:center;gap:5px}.game-ui .village-stats .glyph{font-size:13px;opacity:.85}.game-ui .village-stats b{font-weight:650}
.dock-tabs button{display:flex;flex-direction:column;align-items:center;gap:3px}.dock-tabs .glyph{font-size:20px}
.game-ui .transport button{display:inline-flex;align-items:center;justify-content:center;gap:7px}.game-ui .transport .glyph{font-size:14px}
#close-panel .glyph{font-size:18px}
summary .glyph{font-size:14px;opacity:.75}
.game-ui .journal li{display:block}.game-ui .journal li .icon{margin-right:6px;font-size:13px;color:var(--ink);opacity:.8}
.probability>span:first-child{display:inline-flex;align-items:center;gap:7px}.probability .icon{font-size:13px}
.resident-task{display:flex!important;align-items:center;gap:6px}.resident-task .glyph{font-size:13px;color:var(--ink)}.resident-task>span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.tag-icon .icon{width:15px;height:15px;color:#3d5a3a}.tag-act .icon{width:13px;height:13px;color:#3d5a3a}
[data-night=true] .tag-icon .icon,[data-night=true] .tag-act .icon{color:#e4edd2}
.world-tags.far .tag-icon .icon{width:11px;height:11px}.world-tags.far .tag-act .icon{width:10px;height:10px}
.face{display:inline-block;width:22px;height:22px;border-radius:50%;overflow:hidden;flex:none;background:#f3efe4;box-shadow:0 0 0 1.5px rgba(255,255,255,.9),0 1px 4px rgba(28,48,30,.18);vertical-align:middle}
.face svg{display:block;width:100%;height:100%}
.face.big{width:46px;height:46px;box-shadow:0 0 0 2.5px rgba(255,255,255,.9),0 4px 12px rgba(28,48,30,.2)}
.resident-header{justify-content:flex-start!important;gap:12px}.resident-header>span:last-child{margin-left:auto}
.residents button{display:inline-flex;align-items:center;justify-content:center;gap:6px}.residents .face{width:20px;height:20px}
.resident-card-head .face{width:26px;height:26px;margin-right:2px}
.bond span .face{width:18px;height:18px}
.tag3d.person{padding:3px 4px 3px 3px}.tag3d.person .face{width:22px;height:22px}.world-tags.far .tag3d.person .face{width:17px;height:17px}
.tag3d.person.care .face{box-shadow:0 0 0 2px #f0b070}
.tag3d.person.selected .face{box-shadow:0 0 0 2px #ffd978}
/* Everything floats as glass: translucent drawer header and fields instead of solid white. */
.game-ui .drawer-heading,[data-night=true] .game-ui .drawer-heading{background:linear-gradient(180deg,rgba(255,255,255,.2),rgba(255,255,255,.04));border-bottom:1px solid rgba(255,255,255,.35);backdrop-filter:blur(22px) saturate(170%);-webkit-backdrop-filter:blur(22px) saturate(170%)}
[data-night=true] .game-ui .drawer-heading{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0));border-bottom-color:rgba(255,255,255,.1)}
:root{--field:rgba(255,255,255,.26);--field-rim:rgba(255,255,255,.62)}:root[data-night=true]{--field:rgba(255,255,255,.06);--field-rim:rgba(255,255,255,.14)}
.game-ui input:not([type=checkbox]):not([type=range]):not([type=color]),.game-ui select,.game-ui textarea,[data-night=true] .game-ui input:not([type=checkbox]):not([type=range]):not([type=color]),[data-night=true] .game-ui select,[data-night=true] .game-ui textarea{background:linear-gradient(180deg,rgba(28,48,30,.05),rgba(255,255,255,0) 60%),var(--field);border:1px solid var(--field-rim);box-shadow:inset 0 1px 2px rgba(28,48,30,.12),0 1px 0 rgba(255,255,255,.5)}
.game-ui input::placeholder,.game-ui textarea::placeholder{color:var(--soft-ink);opacity:.8}
.game-ui #hud-panels .quiet,[data-night=true] .game-ui #hud-panels .quiet{background:transparent;border-color:transparent;box-shadow:none}
.game-ui #close-panel,[data-night=true] .game-ui #close-panel{background:var(--chip);border:1px solid var(--chip-rim);border-radius:50%;width:30px;height:30px;display:grid;place-items:center;padding:0}
/* Camera controls: a vertical glass capsule on the right, clear of the dock. It steps aside for open panels. */
@media(min-width:761px){
 .game-ui .camera-controls{left:auto;right:24px;bottom:198px;top:auto;transform:none;flex-direction:column;gap:5px;padding:6px;border-radius:999px}
 .game-ui .camera-controls button,[data-night=true] .game-ui .camera-controls button{width:34px;height:34px;display:grid;place-items:center;padding:0;border-radius:50%;background:transparent;border:1px solid transparent;box-shadow:none;backdrop-filter:none}
 .game-ui .camera-controls button:hover{background:var(--chip-hover)}
 .game-ui .camera-controls button[aria-pressed=true]{background:var(--selected);border-color:var(--selected-rim);color:var(--ink)}
 body:has(#hud-panels:not([hidden])) .camera-controls{right:388px;bottom:24px}
}
@media(max-width:1100px) and (min-width:761px){.game-ui .camera-controls{bottom:168px}body:has(#hud-panels:not([hidden])) .camera-controls{right:346px}}
@media(max-height:780px) and (min-width:761px){.game-ui .camera-controls{bottom:160px;gap:2px;padding:4px}.game-ui .camera-controls button{width:30px;height:30px}}
@media(max-width:760px){.game-ui .camera-controls{bottom:132px;padding:3px;border-radius:999px;gap:2px}.game-ui .camera-controls button{width:28px;height:28px;display:grid;place-items:center;padding:0;background:transparent;border:0;box-shadow:none}.game-ui .world-status{bottom:132px}.game-ui .journal,.game-ui #hud-panels{bottom:170px}.game-ui #hud-panels{max-height:calc(100dvh - 370px)}}
@media(max-width:760px){.game-ui .world-title{display:none}}

/* Liquid glass, second pass: clearer glass so the world shows through, with depth from rims and shadows instead of white fills.
   Nested surfaces never stack another white layer: headers are clear, fields are recessed, chips are thin. */
:root{--glass:linear-gradient(150deg,rgba(255,255,255,.44),rgba(255,255,255,.16));--sheen:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0) 34%);--glass-blur:blur(30px) saturate(210%) brightness(1.06);--chip:rgba(255,255,255,.2);--chip-rim:rgba(255,255,255,.55);--chip-hover:rgba(255,255,255,.4);--chip-sheen:linear-gradient(180deg,rgba(255,255,255,.3),rgba(255,255,255,0) 55%);--field:rgba(40,70,45,.07);--field-rim:rgba(255,255,255,.45)}
:root[data-night=true]{--field:rgba(0,0,0,.18);--field-rim:rgba(255,255,255,.1)}
.game-ui .drawer-heading,[data-night=true] .game-ui .drawer-heading{background:transparent;border-bottom:1px solid rgba(255,255,255,.28);backdrop-filter:none;-webkit-backdrop-filter:none;position:sticky;top:0}
.game-ui #hud-panels{scroll-padding-top:56px}
.game-ui #hud-panels::-webkit-scrollbar{width:6px}.game-ui #hud-panels::-webkit-scrollbar-thumb{background:rgba(255,255,255,.45);border-radius:9px}
/* Content scrolling under the clear header fades out instead of colliding with the title. */
.game-ui #hud-panels .panel{mask-image:linear-gradient(180deg,transparent 0,#000 14px);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14px)}
.game-ui input:not([type=checkbox]):not([type=range]):not([type=color]),.game-ui select,.game-ui textarea,[data-night=true] .game-ui input:not([type=checkbox]):not([type=range]):not([type=color]),[data-night=true] .game-ui select,[data-night=true] .game-ui textarea{background:var(--field);border:1px solid var(--field-rim);box-shadow:inset 0 1.5px 3px rgba(28,48,30,.14),0 1px 0 rgba(255,255,255,.55);backdrop-filter:none;-webkit-backdrop-filter:none}
[data-night=true] .game-ui input:not([type=checkbox]):not([type=range]):not([type=color]),[data-night=true] .game-ui select,[data-night=true] .game-ui textarea{box-shadow:inset 0 1.5px 3px rgba(0,0,0,.3),0 1px 0 rgba(255,255,255,.06)}
.game-ui input:focus-visible,.game-ui select:focus-visible,.game-ui textarea:focus-visible{outline:2px solid rgba(120,170,100,.7);outline-offset:1px;background:rgba(255,255,255,.28)}
.game-ui #hud-panels button,.game-ui .transport button,.game-ui .resident-card,.game-ui .news-heading button,[data-night=true] .game-ui #hud-panels button,[data-night=true] .game-ui .transport button,[data-night=true] .game-ui .resident-card,[data-night=true] .game-ui .news-heading button{backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 1px 2px rgba(28,48,30,.06)}
.game-ui .tag-icon,.game-ui .tag-act{background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.3))}
.game-ui .face{background:rgba(255,255,255,.35)}
/* Camera capsule: vertically centered on the right edge, clear of the stats, minimap and dock.
   With a panel open it rides along the panel's left side instead of dropping toward the dock. */
@media(min-width:761px){
 .game-ui .camera-controls{top:50%;bottom:auto;right:24px;left:auto;transform:translateY(-50%)}
 body:has(#hud-panels:not([hidden])) .camera-controls{right:calc(24px + 340px + 12px);bottom:auto}
}
@media(max-width:1100px) and (min-width:761px){.game-ui .camera-controls{bottom:auto}body:has(#hud-panels:not([hidden])) .camera-controls{right:calc(24px + 310px + 10px)}}
@media(max-height:780px) and (min-width:761px){.game-ui .camera-controls{bottom:auto}}

/* A villager's day: what they are known for and today's activities, with repeated ones marked as routine. */
.settings .wide{grid-column:1/-1}
.known-line{font-size:11px;font-weight:600;color:var(--ink);margin:-2px 0 6px}
.today{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:4px 0 10px}.today>span{font-size:10px;color:var(--soft-ink)}
.today-log{display:flex;flex-wrap:wrap;gap:4px}.today-chip{display:inline-flex;align-items:center;gap:3px;padding:3px 7px;border-radius:999px;font-size:10px;font-weight:650;color:var(--ink);background:var(--chip);border:1px solid var(--chip-rim)}.today-chip .icon{font-size:12px}
.today-chip.routine{border-color:rgba(220,150,80,.8);background:rgba(240,176,112,.22)}.today-empty{font-size:10px;color:var(--soft-ink);font-style:italic}