:root{--ink:#29443f;--muted:#7b8880;--line:rgba(48,72,60,.12);--green:#3f7059;--paper:#f4f5ed;--accent:#c1d2a5;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);font-size:13px}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#b9d4d4}button,input{font:inherit}button{border:0;cursor:pointer;background:none;color:inherit}button:hover{background:rgba(77,109,80,.09)}button:focus-visible,canvas:focus-visible{outline:2px solid #417c72;outline-offset:3px}button:disabled{opacity:.4;cursor:default}button.active{background:#dfe8d4;color:#31553c}#world{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}.glass{background:rgba(247,248,240,.95);border:1px solid rgba(255,255,255,.65);box-shadow:0 8px 28px #183a3514;backdrop-filter:blur(18px);border-radius:12px}.topbar{position:absolute;top:18px;left:22px;right:22px;min-height:82px;display:flex;align-items:center;padding:14px 20px;gap:24px}.identity{display:flex;align-items:center;gap:14px;flex:1}.brandmark{font-family:Georgia,serif;font-size:64px;position:relative;color:#375f4e;letter-spacing:-7px}.brandmark span{font-size:24px;position:absolute;left:19px;top:20px;color:#adbf8d}.brandmark.small{font-size:40px;letter-spacing:-5px;width:34px}.brandmark.small span{font-size:15px;left:12px;top:13px}.eyebrow{font-size:9px;letter-spacing:1.7px;font-weight:700;color:#89947e}#city-name{padding:3px 0;font-size:22px;font-family:Georgia,serif;letter-spacing:-.3px}#city-name span{font:12px sans-serif;margin-left:8px;color:#8d9c8c}.level{font-size:10px;background:#e5e8d8;border:1px solid #dce2ce;padding:7px 10px;border-radius:20px;color:#6f7d60;white-space:nowrap}.stats{display:flex;gap:32px}.stat{min-width:95px;display:grid;gap:3px}.stat .label{color:#7d897c;font-size:10px}.stat strong{font-size:19px;font-weight:600;letter-spacing:-.5px;font-variant-numeric:tabular-nums}.stat small{font-size:10px;color:#6f9274}.topactions{display:flex;gap:8px;margin-left:12px}.icon-button{width:35px;height:35px;border:1px solid var(--line);border-radius:8px;font-size:18px}.left-panel{position:absolute;top:118px;left:22px;width:243px;padding:20px}.panel-head{display:flex;justify-content:space-between;align-items:center}.live-dot{width:6px;height:6px;border-radius:50%;background:#90ab72;box-shadow:0 0 0 4px #90ab721a}h2{font-family:Georgia,serif;font-weight:400;font-size:23px;letter-spacing:-.6px;margin:19px 0 9px}.muted{color:var(--muted);line-height:1.6;font-size:11px;margin:0}.section-label{font-size:8px;letter-spacing:1.1px;font-weight:700;display:flex;justify-content:space-between;color:#89917f}.demand{margin-top:24px}#demand-bars{display:flex;flex-direction:column;gap:10px;margin-top:14px}.demand-row{display:flex;align-items:center;gap:10px;font-size:10px}.demand-row i{width:7px;height:7px;border-radius:2px}.demand-row span{width:64px}.demand-row .track{height:4px;flex:1;background:#e0e5d9;border-radius:5px;overflow:hidden}.track b{display:block;height:100%;border-radius:5px}.demand-row em{width:20px;text-align:right;font-size:9px;color:#849080;font-style:normal}.divider{height:1px;background:var(--line);margin:18px 0}.service-row{display:flex;align-items:center;justify-content:space-between;font-size:10px;margin-bottom:12px}.service-row strong{font-size:10px;font-weight:500}.service-row .ok{color:#6f9574}.service-row .bad{color:#bb7f58}.panel-link{display:flex;justify-content:space-between;width:100%;padding:12px 0 0;font-size:11px;border-top:1px solid var(--line);margin-top:12px}.panel-link+.panel-link{border:0;margin-top:0;color:#81907f}.right-tools{position:absolute;right:22px;top:118px;padding:6px;display:flex;flex-direction:column;gap:3px}.right-tools button{width:36px;height:36px;border-radius:7px;font-size:20px}.right-tools .divider{margin:5px}.right-bottom{position:absolute;right:22px;bottom:66px;width:166px;display:flex;align-items:end;flex-direction:column;gap:10px}.compass{margin-right:55px}.compass button{font-size:9px;display:flex;flex-direction:column;align-items:center;color:#f4f7e8;text-shadow:0 1px 4px #274c4c}.compass span{font-size:30px}.minimap{width:166px;padding:3px 3px 7px;overflow:hidden}.minimap canvas{display:block;width:158px;height:138px;cursor:crosshair;border-radius:9px}.minimap div{font-size:7px;letter-spacing:1px;padding:8px 7px 0;display:flex;justify-content:space-between;color:#7d8c78}.zoom{display:flex;align-items:center;width:166px;justify-content:space-between;padding:2px 8px}.zoom span{font-size:8px;letter-spacing:1px;color:#8b9988}.zoom button{font-size:20px;width:30px;height:27px}.bottom-wrap{position:absolute;bottom:66px;left:50%;transform:translateX(-50%);width:660px;max-width:calc(100vw - 420px)}.toolbar{display:flex;padding:8px;justify-content:space-between;position:relative;gap:4px}.toolbar button{border-radius:8px;flex:1;min-width:48px;height:65px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.toolbar button>span{font-family:Georgia,serif;font-size:23px;line-height:25px}.toolbar small{font-size:9px}.toolbar kbd{position:absolute;top:3px;right:6px;font-size:7px;opacity:.4;font-family:inherit}.tool-divider{width:1px;background:var(--line);margin:8px 3px}#tool-options{padding:13px 17px;display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;gap:12px;min-height:77px}#tool-options>div:first-child{display:grid;gap:5px}#tool-title{font-family:Georgia,serif;font-weight:400;font-size:17px}#tool-description{font-size:10px;color:#81907f}#tool-category{font-size:8px}#tool-cost{font-size:10px;white-space:nowrap;color:#718568}#density-switch{display:flex;gap:3px}#density-switch[hidden]{display:none}#density-switch button{font-size:9px;padding:7px;border-radius:5px;white-space:nowrap;border:1px solid var(--line)}#submenu{position:absolute;bottom:175px;left:0;right:0;padding:8px;display:flex;gap:5px}#submenu[hidden]{display:none}#submenu button{flex:1;padding:12px 8px;border-radius:7px;font-size:10px;text-align:left;display:grid;gap:7px}#submenu button i{height:4px;border-radius:3px;width:24px}#submenu button small{font-size:8px;opacity:.65}.timebar{position:absolute;bottom:16px;left:22px;right:22px;display:flex;align-items:center;gap:15px;padding:7px 12px;height:36px;border-radius:9px;font-size:10px}.time-controls{display:flex;gap:5px}.time-controls button{width:28px;height:23px;border-radius:4px;font-size:10px}.time-divider{height:15px;width:1px;background:var(--line)}#date{min-width:92px;font-variant-numeric:tabular-nums}#weather-label{color:#7a8c77}#save-status{color:#91a08a;margin-left:auto;font-size:9px}.hint{font-size:9px;color:#8b9885;margin-left:16px}#toast{position:absolute;bottom:254px;left:50%;transform:translateX(-50%) translateY(10px);background:#294a41ed;box-shadow:0 8px 25px #15352c25;color:#f3f5e9;padding:13px 20px;border-radius:9px;opacity:0;transition:.2s;pointer-events:none;max-width:600px;text-align:center;font-size:12px}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}#inspector{position:absolute;left:22px;top:555px;width:243px;padding:18px;font-size:11px}#inspector h3{font-family:Georgia,serif;font-size:19px;font-weight:400;margin:0 0 12px}#inspector p{color:#7b8a78;line-height:1.6;margin:6px 0}#inspector button{float:right}#overlay-label{position:absolute;top:120px;left:50%;transform:translateX(-50%);background:#304d43dc;color:#eef3e4;padding:8px 16px;border-radius:20px;font-size:11px}dialog{border:1px solid #fff8;border-radius:18px;padding:30px;max-width:640px;width:calc(100% - 32px);background:#f6f7ee;color:var(--ink);box-shadow:0 25px 100px #153b414d}dialog::backdrop{background:#173d3d66;backdrop-filter:blur(6px)}dialog h2{font-size:30px;margin:7px 0 10px}dialog p{line-height:1.7;color:#788573;font-size:12px}dialog .close{float:right;font-size:23px;margin-top:-15px;margin-right:-15px;padding:6px 10px}dialog .card-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:22px 0}dialog .card{border:1px solid var(--line);border-radius:10px;padding:16px}dialog .card span{font-size:10px;color:#829077;display:block;margin-bottom:6px}dialog .card strong{font-size:24px;font-weight:500}dialog .primary{background:#3f7059;color:#f7f7ec;padding:12px 20px;border-radius:7px}dialog .secondary{border:1px solid #ccd5c1;padding:12px 20px;border-radius:7px}dialog .actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}dialog label{display:flex;align-items:center;gap:12px;font-size:12px;margin:18px 0}dialog input[type=range]{flex:1;accent-color:#557b5a}dialog input[type=checkbox]{accent-color:#557b5a}dialog input[type=text]{padding:12px;border:1px solid #ccd5c1;border-radius:6px;width:100%;background:#fffefa;color:var(--ink)}.policy{border-top:1px solid var(--line);padding-top:10px;display:flex;justify-content:space-between;align-items:center}.policy span{font-size:10px;color:#829077}.chart{height:80px;display:flex;align-items:end;gap:3px;border-bottom:1px solid #d8dfcd}.chart i{flex:1;background:#9fb591;border-radius:3px 3px 0 0;min-height:2px}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}.help-grid h3{font-size:13px;margin-bottom:0}.help-grid p{font-size:11px}.tag{display:inline-block;font-size:9px;background:#e3ead9;padding:5px 8px;border-radius:5px}.photo-mode>header,.photo-mode>aside,.photo-mode>.bottom-wrap,.photo-mode>.right-bottom,.photo-mode>footer,.photo-mode>#inspector{display:none!important}.photo-exit{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:#f4f5eddf;border-radius:20px;padding:10px 20px;font-size:11px}#loading{position:fixed;inset:0;background:#e8edde;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .5s}#loading h1{font-weight:500;letter-spacing:8px;font-size:16px}#loading p{color:#7f8f75;font-size:12px}.negative{color:#bd785d!important}@media(max-width:1150px){.level{display:none}.stats{gap:20px}.bottom-wrap{max-width:calc(100vw - 320px);left:calc(50% + 80px)}.right-bottom{display:none}.left-panel{width:224px;padding:17px}#inspector{width:224px;top:540px}.hint{display:none}}@media(max-width:760px){.topbar{top:10px;left:10px;right:10px;padding:10px;gap:10px;min-height:70px}.identity{gap:7px}.brandmark.small{display:none}.eyebrow{font-size:7px}#city-name{font-size:19px}.stats{gap:12px}.stat{min-width:55px}.stat strong{font-size:14px}.stat .label{font-size:8px}.stat small{font-size:8px}.happiness,.topactions #save{display:none}.topactions{margin:0}.left-panel{display:none}.right-tools{right:10px;top:92px}.right-tools button{width:30px;height:30px;font-size:18px}.bottom-wrap{width:calc(100vw - 20px);max-width:none;left:50%;bottom:58px}.toolbar button{min-width:28px;height:54px}.toolbar{gap:1px;padding:5px}.toolbar small{font-size:8px}.toolbar kbd{display:none}.tool-divider{margin:6px 0}#tool-options{padding:10px;min-height:68px}#tool-description{max-width:230px;font-size:9px}#tool-cost{font-size:9px}#submenu{bottom:148px;flex-wrap:wrap}#submenu button{min-width:80px;padding:9px}#inspector{top:94px;left:10px;width:210px}.timebar{left:10px;right:10px;bottom:10px;gap:8px;font-size:9px}#weather-label{display:none}#toast{bottom:235px;max-width:90%;width:max-content}.help-grid{grid-template-columns:1fr}dialog{padding:24px}#density-switch{flex-direction:column}#tool-options:has(#density-switch:not([hidden])) #tool-cost{display:none}}
/* Harborlight visual release 2 — quiet, high-contrast city controls. */
:root{--ink:#e4ebe5;--muted:#9fafa7;--line:rgba(201,223,210,.13);--green:#a6ca98;--paper:#172c2d;--accent:#bad598;letter-spacing:.05px}
.glass{background:rgba(21,39,41,.91);border:1px solid rgba(200,222,208,.14);box-shadow:0 10px 36px #0a202929,inset 0 1px 0 #e3f2e807;backdrop-filter:blur(20px);border-radius:11px}
button:hover{background:rgba(192,218,185,.1)}button.active{background:#b4ce981e;color:#c4dda7;box-shadow:inset 0 0 0 1px #adc9953b}button:focus-visible,canvas:focus-visible{outline-color:#c0dca5}.topbar{min-height:74px;top:16px;padding:11px 18px}.brandmark{color:#d3dfc5}.brandmark span{color:#8eaf7e}.eyebrow{color:#9eb69f;letter-spacing:1.55px}.stat .label{color:#9eafa7}.stat small{color:#adca9b}.stat strong{color:#edf1e7;font-weight:500}.stat{gap:5px}.level{background:#b5cd9914;border-color:#a7c48a29;color:#b9cba6}.icon-button{color:#c6d5c6;display:grid;place-items:center}.left-panel{top:108px;width:232px;padding:19px}.panel-head .eyebrow{font-size:8px}.left-panel h2{font-size:23px;margin:17px 0 8px;color:#e1e9da}.muted,#tool-description{color:#9bab9f}.section-label{color:#91a48f}.demand-row em{color:#a3b49c}.demand-row .track{background:#b6cca11a}.service-row .ok{color:#bad0a4}.service-row .bad,.negative{color:#e0ae85!important}.panel-link+.panel-link{color:#a5b99e}.right-tools{top:108px}.right-tools button{color:#a9bcb0}.right-tools button.active{color:#d4e7b3}.right-bottom .minimap{background:#243c3b}.minimap div{color:#b1c4ae}.zoom span{color:#a7bba8}.compass button{color:#e3ebd7}.bottom-wrap{width:680px;max-width:calc(100vw - 440px)}.toolbar button>span{display:grid;place-items:center;height:26px}.toolbar{padding:7px}.toolbar button{height:60px}.toolbar small{color:#b1c1b5;font-size:9px}.toolbar button.active small{color:#d4e5be}.toolbar kbd{font-size:8px}.toolbar button.active:after{content:'';position:absolute;bottom:-8px;height:2px;width:18px;background:#bfd59d;box-shadow:0 0 12px #c4df99}#tool-options{min-height:72px;background:rgba(23,43,43,.9)}#tool-title{color:#e4eadb;font-size:18px}#tool-cost{color:#bed1a5}#density-switch button{color:#adc0ad}#submenu{bottom:163px;background:#193032f5}#submenu button{color:#d1dfce}#submenu button small{color:#b7c8ac;opacity:.8}#inspector{top:530px;width:232px}#inspector h3{color:#e2e9d9}#inspector p{color:#acbda9}#overlay-label{background:#172c30e8;border:1px solid #a5c49b38}#toast{background:#d8e6c9;color:#29423a;font-weight:500;box-shadow:0 8px 35px #142d3155}.timebar{color:#c3d0c3}#save-status{color:#9bb08f}#weather-label{color:#a9be9b}.hint{color:#9fb199}#render-status{font-size:8px;color:#b7cba4;letter-spacing:.6px;cursor:pointer;margin-left:auto;white-space:nowrap}#save-status{margin-left:0}dialog{background:#192f30;border:1px solid #bfd4bc22;color:#e3ebde}dialog::backdrop{background:#0d212583;backdrop-filter:blur(9px)}dialog h2{color:#e4ead9}dialog p{color:#a9bba7}dialog .card{background:#d3e1c607}dialog .card span{color:#a6b99f}dialog .primary{background:#bdd39c;color:#233e35;font-weight:600}dialog .secondary{border-color:#adca952e;color:#ccdac5}.policy span{color:#a6bb9a}dialog input[type=text]{background:#132728;color:#dce7d5;border-color:#b1ca9736}dialog input[type=range],dialog input[type=checkbox]{accent-color:#bdd39c}.chart{border-color:#acc69130}.chart i{background:#8eaf7c}.quality-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:23px 0 12px}.quality-presets button{border:1px solid #b0ca9b25;border-radius:8px;padding:14px 10px;text-align:left;min-height:91px}.quality-presets strong{font-weight:500;font-size:12px;display:block;margin-bottom:8px}.quality-presets span{font-size:9px;color:#9db18f;line-height:1.6;display:block}.quality-presets button.active{background:#aecb9115;border-color:#b5d29488}.graphics-caption{font-size:10px!important;color:#93aa8c!important}.photo-exit{background:#142c30d9;color:#d9e5cc;border:1px solid #bfd6a73b;font-size:10px;letter-spacing:.5px;backdrop-filter:blur(12px)}#loading{background:radial-gradient(ellipse at 50% 20%,#355453,#14282d);color:#dae7cd}#loading p{color:#9eb596}.live-dot{background:#b6cf92;box-shadow:0 0 0 4px #a9c88214,0 0 14px #c4e79d40}
@media(max-width:1150px){.bottom-wrap{max-width:calc(100vw - 290px)}.hint{display:none}.left-panel,#inspector{width:218px}}
@media(max-width:760px){.topbar{top:10px;min-height:66px;padding:9px;gap:7px}.topactions{gap:3px}.icon-button{width:29px;height:31px}.identity .eyebrow{font-size:6px;letter-spacing:.7px}.right-tools{top:88px}.bottom-wrap{width:calc(100vw - 20px);max-width:none}.toolbar button{height:51px}.toolbar small{font-size:8px}#tool-options{min-height:66px}#tool-title{font-size:16px}#submenu{bottom:143px}#inspector{top:88px}#save-status{display:none}#render-status{margin-left:auto}.quality-presets{grid-template-columns:1fr 1fr}.stat strong{font-size:13px}#city-name{font-size:17px}.stat{min-width:48px}.stats{gap:8px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}