:root{--ink: #294b4a;--ink-soft: #56746f;--sage: #315954;--sage-deep: #1f3b3a;--cream: #f5f5ec;--cream-glass: rgba(250, 248, 240, .88);--line: rgba(255, 255, 255, .65);--line-ink: rgba(41, 75, 74, .18);--terracotta: #b66b44;--terracotta-deep: #a65a35;--gold: #d9a947;--shadow: 0 12px 34px rgba(31, 59, 58, .16);--radius: 14px}html,body{margin:0;overflow:hidden}#app,canvas{display:block;width:100%;height:100dvh}#ui{position:fixed;inset:0;z-index:10;display:grid;grid-template-columns:minmax(230px,300px) 1fr minmax(230px,320px);grid-template-rows:auto 1fr auto;grid-template-areas:"top top top" "guide . inspector" "bottom bottom bottom";gap:14px;padding:18px;align-items:start;pointer-events:none;font-family:Avenir Next,Avenir,Segoe UI,system-ui,sans-serif;color:var(--ink)}#ui *{box-sizing:border-box}.hud-panel{pointer-events:auto;background:var(--cream-glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.hud-top{grid-area:top;display:flex;flex-direction:column;gap:10px;pointer-events:none}.hud-guide{grid-area:guide;justify-self:start;max-width:300px}.hud-inspector{grid-area:inspector;justify-self:end;max-width:320px}.hud-bottom{grid-area:bottom;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}button{font:inherit;color:inherit;border:0;background:transparent;cursor:pointer;border-radius:8px;outline:2px solid transparent;outline-offset:5px;transition:background-color .18s ease,color .18s ease,transform .12s ease,outline-color .18s ease,outline-offset .18s ease}button:hover{background:#3159541a}button:active{transform:translateY(1px) scale(.985)}button:focus-visible{outline-color:var(--sage);outline-offset:2px}button[aria-pressed=true]{background:var(--sage);color:#fffdf0}button[aria-pressed=true]:hover{background:var(--sage-deep)}.hud-masthead{display:flex;align-items:center;flex-wrap:wrap;gap:14px 28px;padding:12px 22px}.hud-masthead h1{font-family:Georgia,Times New Roman,serif;font-weight:400;font-size:26px;margin:0 6px 0 0}.hud-resources[hidden]{display:none}.hud-resources{display:flex;flex-wrap:wrap;gap:18px;margin:0}.hud-resources>div{display:flex;flex-direction:column;gap:2px}.hud-resources dt{font-size:10.5px;text-transform:uppercase;letter-spacing:1px;color:var(--ink-soft)}.hud-resources dd{margin:0;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}.hud-resources dd.hud-debt{color:var(--terracotta-deep)}.hud-clock{display:flex;align-items:center;gap:12px;margin-left:auto}.hud-clock time{font-family:Georgia,Times New Roman,serif;font-size:16px;font-variant-numeric:tabular-nums;white-space:nowrap}.hud-speed:not([hidden]){display:flex;gap:2px;padding:3px;background:#ffffff59;border-radius:8px}.hud-speed button{padding:6px 10px;font-size:12px}.hud-menu-button{padding:6px 12px;font-size:12px;border:1px solid var(--line)}.hud-guide,.hud-inspector{padding:4px 4px 14px}.hud-guide summary,.hud-inspector summary{list-style:none;cursor:pointer;padding:12px 16px;font-family:Georgia,serif;font-size:15px}.hud-guide summary::-webkit-details-marker,.hud-inspector summary::-webkit-details-marker{display:none}.hud-guide summary:after,.hud-inspector summary:after{content:"–";float:right;opacity:.5}.hud-guide[open] summary:after,.hud-inspector[open] summary:after{content:"−"}.hud-guide:not([open]) summary:after,.hud-inspector:not([open]) summary:after{content:"+"}.hud-milestones{list-style:none;margin:0;padding:0 16px;display:flex;flex-direction:column;gap:9px}.hud-milestones[hidden]{display:none}.hud-milestones label{display:flex;align-items:center;gap:9px;font-size:12.5px;line-height:1.4}.hud-milestones input{width:15px;height:15px;accent-color:var(--terracotta);flex-shrink:0}.hud-milestones input:checked+label,.hud-milestones label:has(input:checked){color:var(--ink-soft);text-decoration:line-through;text-decoration-color:#294b4a59}.hud-colour[hidden]{display:none}.hud-colour{display:inline-block;width:9px;height:9px;margin-right:9px;border-radius:50%;background:var(--city-colour, transparent);box-shadow:inset 0 0 0 1px #294b4a33}.hud-banner-title .hud-colour{width:12px;height:12px;margin-right:12px}.hud-guide-unlock{margin:8px 16px 0;font-size:12px;line-height:1.6;color:var(--terracotta-deep)}.hud-guide-note{margin:12px 16px 0;padding-top:10px;border-top:1px solid rgba(41,75,74,.12);font-size:12px;line-height:1.6;color:var(--ink-soft)}.hud-inspector h3{margin:4px 16px 0;font-family:Georgia,serif;font-weight:400;font-size:19px}.hud-inspector-tier{margin:2px 16px 0;font-size:10.5px;text-transform:uppercase;letter-spacing:1.4px;opacity:.55}.hud-inspector-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;margin:14px 16px 0;padding:0}.hud-inspector-stats dt{font-size:10.5px;text-transform:uppercase;letter-spacing:1px;color:var(--ink-soft);margin:0}.hud-inspector-stats dd{margin:2px 0 0;font-size:14px;font-weight:600}.hud-inspector-stats dd:has(.hud-stock-item){display:flex;flex-wrap:wrap;align-items:center;gap:3px 12px}.hud-stock-item{display:inline-flex;align-items:center;gap:5px}.hud-inspector-note{margin:14px 16px 0;font-size:12px;line-height:1.6;opacity:.85}.hud-vendor{margin:14px 16px 0;padding:10px 14px;width:calc(100% - 32px);background:var(--terracotta);color:#fffaf0;font-size:12.5px;font-weight:600;border-radius:8px}.hud-vendor:hover{background:var(--terracotta-deep)}.hud-vendor[aria-pressed=true]{background:var(--sage);color:#fffdf0}.hud-undo{pointer-events:auto;padding:7px 14px;font-size:12px}.hud-undo[hidden]{display:none}.hud-hint{pointer-events:none;margin:0;padding:7px 16px;max-width:min(90vw,520px);text-align:center;font-size:12px;color:var(--sage-deep);background:var(--cream-glass);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow)}.hud-hint[hidden]{display:none}.hud-tooltip{position:fixed;z-index:11;pointer-events:none;display:flex;align-items:center;gap:6px;margin:0;padding:6px 13px;white-space:nowrap;font-size:12.5px;color:var(--sage-deep);background:var(--cream-glass);border:1px solid var(--line);border-radius:999px;box-shadow:var(--shadow);opacity:0;transform:translate(-50%,calc(-100% - 4px)) scale(.94);transition:opacity .16s ease,transform .16s ease}.hud-tooltip-shown{opacity:1;transform:translate(-50%,calc(-100% - 16px)) scale(1)}.hud-resource-icon{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.hud-panel[hidden]{display:none}.claim-labels{position:fixed;inset:0;z-index:9;pointer-events:none;font-family:Avenir Next,Avenir,Segoe UI,system-ui,sans-serif;color:var(--ink)}.claim-label{position:absolute;top:0;left:0;margin:0;padding:5px 13px 6px;white-space:nowrap;font-family:Georgia,Times New Roman,serif;font-size:15px;background:#fffdf6db;backdrop-filter:blur(14px) saturate(115%);border-radius:999px;box-shadow:var(--shadow)}.claim-label[hidden]{display:none}.hud-toolbar{--tool-width: 82px;position:relative;z-index:2;pointer-events:auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:2px;padding:6px;max-width:96vw}.hud-tool-group{position:relative;display:flex;gap:2px}.hud-tool-group[data-group=food],.hud-tool-group[data-group=clear]{margin-left:9px;padding-left:9px;border-left:1px solid var(--line-ink)}.hud-tool-group[hidden]{display:none}.hud-tool-opener{position:relative;padding-top:13px;justify-content:center}.hud-tool-opener[aria-expanded=true]:not([aria-pressed=true]){background:#294b4a1a}.hud-tool-chevron{position:absolute;top:1px;left:50%;width:15px;height:15px;transform:translate(-50%);fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.4;transition:opacity .16s ease}.hud-tool-opener[aria-expanded=true] .hud-tool-chevron{opacity:.75}.hud-tool-glyph{display:flex}.hud-tool-flyout{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);z-index:12;display:flex;gap:2px;padding:6px;background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);animation:hud-flyout-in .16s ease-out}.hud-tool-flyout:after{content:"";position:absolute;top:100%;left:0;right:0;height:10px}.hud-tool-flyout[hidden]{display:none}.hud-tool-flyout-leaving{pointer-events:none;animation:hud-flyout-out .14s ease-in forwards}@keyframes hud-flyout-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@keyframes hud-flyout-out{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,6px)}}.hud-tool{display:flex;flex-direction:column;align-items:center;gap:3px;width:var(--tool-width);flex-shrink:0;padding:8px 4px 7px;border-radius:8px;font-size:12px;line-height:1.2;white-space:nowrap}.hud-tool-entering{animation:hud-tool-in .34s ease-out}@keyframes hud-tool-in{0%{width:0;padding-left:0;padding-right:0;opacity:0;transform:translateY(6px)}60%{width:var(--tool-width);padding-left:4px;padding-right:4px;opacity:1}to{width:var(--tool-width);transform:translateY(0)}}.hud-tool-icon{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.hud-tool-icon .fill{fill:currentColor;stroke:none;opacity:.55}.hud-tool-icon .dash{stroke-dasharray:2 2.5}.hud-tool-label{font-weight:600;max-width:72px;overflow:hidden;text-overflow:ellipsis}.hud-tool-cost{font-size:11px;opacity:.85;font-variant-numeric:tabular-nums}.hud-tool[aria-pressed=true] .hud-tool-cost{opacity:.85}.hud-tool[hidden]{display:none}.hud-tool:disabled{opacity:.4;cursor:not-allowed}.hud-tool-unaffordable:not([aria-pressed=true]){color:var(--ink-soft);opacity:.55}.hud-tool-unaffordable .hud-tool-cost{color:var(--terracotta-deep);opacity:1}.hud-tool[data-tool=demolish]{color:var(--terracotta-deep)}.hud-tool[data-tool=demolish][aria-pressed=true]{background:var(--terracotta-deep);color:#fffaf0}.hud-tool[data-tool=demolish][aria-pressed=true]:hover{background:#90492a}.hud-toast-region{position:fixed;top:150px;left:50%;transform:translate(-50%);z-index:20;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.hud-toast{padding:9px 18px;background:var(--sage);color:#fffdf0;font-size:12.5px;border-radius:999px;box-shadow:var(--shadow);animation:hud-toast-in .2s ease-out}.hud-toast-error{background:var(--terracotta-deep)}@keyframes hud-toast-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.hud-banner{position:fixed;top:38%;left:50%;transform:translate(-50%,-50%);z-index:21;padding:20px 46px;border-radius:var(--radius);background:var(--cream-glass);backdrop-filter:blur(14px);box-shadow:var(--shadow);text-align:center;pointer-events:none;opacity:0;transition:opacity .5s ease-out,transform .5s ease-out}.hud-banner-shown{opacity:1;animation:hud-banner-in .6s ease-out}.hud-banner-title{margin:0;font-family:Georgia,Times New Roman,serif;font-weight:400;font-size:30px}.hud-banner-note{margin:6px 0 0;font-size:11.5px;text-transform:uppercase;letter-spacing:2px;color:var(--ink-soft)}@keyframes hud-banner-in{0%{opacity:0;transform:translate(-50%,-42%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.hud-dialog{pointer-events:auto;border:1px solid var(--line);border-radius:var(--radius);padding:22px 26px;background:var(--cream-glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow);color:var(--ink);max-width:400px;max-height:85dvh;overflow-y:auto}.hud-dialog::backdrop{background:#1f3b3a59;backdrop-filter:blur(2px)}.hud-dialog h2{font-family:Georgia,serif;font-weight:400;font-size:19px;margin:0 0 8px}.hud-dialog p{font-size:13px;line-height:1.6;opacity:.85;margin:0}.hud-island-dialog{width:min(400px,calc(100vw - 36px))}.hud-island-map{display:block;width:100%;height:auto;margin:16px 0 8px;border-radius:6px;cursor:pointer;touch-action:manipulation}.hud-island-choice{display:grid;gap:6px;margin:16px 0;font-size:13px}.hud-island-choice select{width:100%;padding:9px;border:1px solid var(--line);border-radius:6px;background:var(--cream-glass);color:var(--ink);font:inherit}.hud-dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.hud-dialog-actions button{padding:8px 16px;font-size:12.5px;background:#294b4a14}.hud-dialog-actions .hud-primary{background:var(--terracotta);color:#fffaf0}.hud-dialog-actions .hud-primary:hover{background:var(--terracotta-deep)}#status{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:20px 30px;background:#fff9ed;border-radius:8px;font-size:14px;max-width:90vw;color:var(--ink);font-family:Avenir Next,Avenir,sans-serif}#status[hidden]{display:none}body[data-error] #status{background:#fbe9e2;color:var(--terracotta-deep)}@media(max-width:860px){#ui{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"top" "." "bottom";padding:10px;gap:8px}.hud-top{gap:6px}.hud-masthead{padding:8px 12px;gap:6px 14px}.hud-masthead h1{display:none}.hud-resources{gap:0 12px}.hud-resources dt{font-size:8px;letter-spacing:.8px}.hud-resources dd{font-size:13px}.hud-clock{width:100%;gap:8px}.hud-clock time{font-size:13px;margin-right:auto}.hud-guide,.hud-inspector{position:fixed;left:10px;right:10px;bottom:132px;max-width:none;max-height:42dvh;overflow:auto}.hud-guide[hidden]{display:none}.hud-bottom{gap:6px}.hud-toolbar{--tool-width: 64px;max-width:100vw}.hud-tool-group[data-group=food],.hud-tool-group[data-group=clear]{margin-left:6px;padding-left:6px}.hud-tool{font-size:10px}.hud-tool-icon{width:24px;height:24px}.hud-hint{font-size:11px}.hud-toast-region{top:118px;left:10px;right:10px;transform:none}}.hud-menu{min-width:340px}@media(prefers-reduced-motion:reduce){button{transition:none}.hud-toast,.hud-tool-entering,.hud-tool-flyout,.hud-tool-flyout-leaving{animation:none}.hud-tool-chevron,.hud-banner{transition:none}.hud-banner-shown{animation:none}.hud-tooltip{transition:none}}.hud-menu-actions{display:flex;flex-direction:column;gap:4px;margin:14px 0}.hud-menu-actions button{text-align:left;padding:10px 14px;font-size:13px;background:#294b4a0f}.hud-menu-actions button[aria-pressed=true]{background:var(--sage);color:#fffdf0}.hud-menu-danger{color:var(--terracotta-deep)}.hud-keys{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;margin:0;padding:14px 0;border-top:1px solid var(--line);font-size:12px}.hud-keys>div:not([hidden]){display:contents}.hud-keys dt{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;opacity:.7}.hud-keys dd{margin:0}.hud-menu-footer{display:flex;justify-content:space-between;align-items:center;margin:4px 0 0;font-size:12.5px}.hud-menu-footer a{color:var(--terracotta-deep)}.hud-menu-footer button{padding:8px 16px;background:#294b4a14}.hud-connection:not([hidden]){display:flex;flex-direction:column;gap:6px;padding:10px 14px;font-size:13px}.hud-connection button{padding:6px 12px;font-size:12px;border:1px solid var(--line);background:var(--terracotta);color:#fffaf0;align-self:flex-start}.hud-claim-available{padding:10px 16px;font-size:13px;background:var(--terracotta);color:#fffaf0;align-self:flex-start}body[data-boot=join] #app{filter:blur(7px) saturate(1.05);transform:scale(1.05);pointer-events:none}body[data-boot] #ui{display:none}.boot{position:fixed;inset:0;z-index:20;font-family:Avenir Next,Avenir,Segoe UI,system-ui,sans-serif;color:var(--ink)}.boot [hidden]{display:none}.boot-veil{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:linear-gradient(180deg,#d5e7e1,#b1d2cd 58%,#cfdfd4)}.boot-veil h1{margin:0;font-family:Georgia,Times New Roman,serif;font-size:46px;font-weight:400;letter-spacing:5px;color:var(--sage-deep)}.boot-veil p{margin:0;font-size:14px;letter-spacing:.3px;color:var(--ink-soft)}.boot-progress{width:180px;height:3px;border-radius:2px;background:#294b4a24;overflow:hidden}.boot-progress span{display:block;width:40%;height:100%;border-radius:2px;background:var(--terracotta);animation:boot-sweep 1.7s ease-in-out infinite}@keyframes boot-sweep{0%{transform:translate(-110%)}to{transform:translate(360%)}}body[data-error] .boot-veil{background:linear-gradient(180deg,#f4ded4,#ecd2c6)}body[data-error] .boot-veil p{color:var(--terracotta-deep)}body[data-error] .boot-progress{display:none}.boot-scrim{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;background:#294b4a47}.boot-card{display:flex;flex-direction:column;gap:12px;width:min(360px,100%);padding:28px 32px;background:var(--cream-glass);backdrop-filter:blur(14px);border-radius:var(--radius);box-shadow:var(--shadow)}.boot-card h2{margin:0;font-family:Georgia,Times New Roman,serif;font-size:21px;font-weight:400}.boot-card p{margin:0;font-size:13px;line-height:1.5;color:var(--ink-soft)}.boot-card label{display:grid;gap:6px;margin-top:6px;font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--ink-soft)}.boot-card input{padding:9px 11px;font:inherit;font-size:15px;letter-spacing:normal;text-transform:none;color:var(--ink);border:1px solid var(--line);border-radius:8px;background:#ffffffb3}.boot-card input:focus-visible{outline:2px solid var(--sage);outline-offset:1px}.boot-card button{padding:10px 16px;font-size:13.5px;background:var(--terracotta);color:#fffaf0;border-radius:8px}.boot-card button:hover:not(:disabled){background:var(--terracotta-deep)}.boot-card button:disabled{opacity:.6}.boot-card [data-field=join-error]{color:var(--terracotta-deep)}.boot-colours{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 0;padding:0;border:0}.boot-colours legend{padding:0 0 8px;font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--ink-soft)}.boot-swatch{position:relative;margin:0}.boot-swatch input{position:absolute;inset:0;margin:0;padding:0;opacity:0;cursor:pointer}.boot-swatch span{display:block;width:28px;height:28px;border-radius:50%;background:var(--swatch);box-shadow:inset 0 0 0 1px #294b4a2e;text-indent:-999em;overflow:hidden;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.boot-swatch:hover span{transform:scale(1.08)}.boot-swatch input:checked+span{box-shadow:inset 0 0 0 1px #294b4a2e,0 0 0 2px var(--cream-glass),0 0 0 4px var(--swatch)}.boot-swatch input:focus-visible+span{outline:2px solid var(--sage);outline-offset:3px}.boot-swatch input:disabled+span{opacity:.6;cursor:default}@media(prefers-reduced-motion:reduce){.boot-progress span{animation:none;width:100%;opacity:.45}}.frame-meter{position:fixed;right:12px;bottom:12px;z-index:40;padding:8px 10px;white-space:pre;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:11px;line-height:1.45;color:var(--ink);background:var(--cream-glass);border:1px solid var(--line);border-radius:8px;pointer-events:none}.tuner{position:fixed;right:12px;bottom:150px;z-index:40;display:grid;gap:6px;padding:10px 12px;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:11px;color:var(--ink);background:var(--cream-glass);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow)}.tuner-dial{display:grid;grid-template-columns:82px 120px 34px;align-items:center;gap:8px;white-space:nowrap}.tuner-dial input{width:120px;accent-color:var(--sage)}.tuner-dial b{text-align:right;font-weight:600}