:root{--paper:#faf7ed;--bg:#eeece4;--ink:#292d29;--muted:#77796f;--rule:#c9c7bc;--accent:#a84e34;--accent-soft:#efe1d7;--green:#648469;--font:system-ui,-apple-system,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px var(--font)}button,input,select{font:inherit}button{border:1px solid var(--rule);border-radius:5px;background:#f9f7ef;color:var(--ink);padding:9px 12px;cursor:pointer;transition:background .12s}button:hover{background:#e8e3d8}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--ink);border-color:var(--ink);color:#fff}button.primary:hover{background:#41483e}button.danger{color:#a63b2e}button.active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}header{height:90px;display:flex;justify-content:space-between;align-items:center;padding:15px 24px;border-bottom:1px solid var(--rule);gap:16px}.brand{display:flex;gap:14px;align-items:center;flex-shrink:0}.brand-icon{font-size:35px;background:var(--accent);color:white;width:44px;height:44px;text-align:center;line-height:40px}.brand p{font-size:10px;font-weight:750;letter-spacing:3px;color:var(--accent);margin:0 0 5px}h1{font:29px Georgia,serif;margin:0;letter-spacing:-.7px}.header-actions{display:flex;gap:7px;align-items:center}.divider{height:24px;border-left:1px solid var(--rule);margin:0 5px}main{display:grid;grid-template-columns:310px minmax(0,1fr);height:calc(100vh - 90px)}aside{border-right:1px solid var(--rule);overflow:auto;padding-bottom:25px}nav{padding:16px 18px;border-bottom:1px solid var(--rule);display:grid;gap:4px}.step{border:none;background:transparent;text-align:left;display:flex;align-items:center;gap:12px;padding:9px 10px}.step .number{font-size:11px;border:1px solid var(--rule);border-radius:50%;width:24px;height:24px;display:grid;place-items:center}.step.selected{background:var(--accent-soft);color:var(--accent);font-weight:650}.step.selected .number{background:var(--accent);border-color:var(--accent);color:white}.step .tally{margin-left:auto;font-size:11px;color:var(--muted)}#panel{padding:20px 22px}h2{font:23px Georgia,serif;margin:0 0 9px}h3{font-size:12px;text-transform:uppercase;letter-spacing:1.4px;margin:20px 0 12px}.help{color:var(--muted);font-size:13px;line-height:1.55;margin:8px 0 16px}label{display:block;font-size:13px;margin:14px 0}label input:not([type=checkbox]),label select{display:block;width:100%;margin-top:7px;border:1px solid var(--rule);background:#faf8f1;border-radius:4px;padding:7px 9px;color:var(--ink)}label input[type=range]{padding:0;accent-color:var(--accent)}label:has(input[type=checkbox]){display:flex;gap:8px;align-items:center}input[type=checkbox]{accent-color:var(--accent)}.actions{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0}.actions button{flex:1;white-space:normal;font-size:13px}.full{width:100%;margin-top:7px}.selection{border-top:1px solid var(--rule);margin-top:20px;padding-top:16px}.selection p{font-size:13px;line-height:1.5}.badge{font-size:11px;background:var(--accent-soft);color:var(--accent);padding:4px 7px;border-radius:4px}.paper-settings{margin:0 22px;padding-top:15px;border-top:1px solid var(--rule)}summary{cursor:pointer;font-size:13px;color:var(--muted)}.paper-settings button{margin:5px 0;width:100%}.local-note{font-size:11px;color:var(--muted);line-height:1.5;margin:20px 22px 0}.workspace{min-width:0;display:flex;flex-direction:column;padding:16px 22px 12px;min-height:0}.stage-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;color:var(--muted);min-height:34px;margin-bottom:12px}.status-dot{width:7px;height:7px;display:inline-block;border-radius:50%;background:var(--green);margin-right:8px}.zoom{display:flex;gap:5px;align-items:center;white-space:nowrap}.zoom button{padding:4px 8px}.zoom output{min-width:36px;text-align:center}.paper-wrap{background:#d6d3c8;display:flex;align-items:center;justify-content:center;position:relative;padding:20px;flex:1;overflow:hidden;min-height:200px}#canvas{background:var(--paper);box-shadow:0 8px 26px #3632272d;width:100%;max-height:100%;aspect-ratio:420/297;touch-action:none;outline:none}#canvas .art{fill:none;stroke:#303630;stroke-linecap:round;stroke-linejoin:round}#canvas .art.street{stroke:#3b403a}#canvas .art.grass{stroke:#77806c}#canvas .art.sidewalks{stroke:#7e8278}#canvas .art.lots{stroke:#8b8e80}#canvas .art.trees{stroke:#536650}#canvas .art.selected{stroke:var(--accent);stroke-width:.48}#canvas .art.problem{stroke:#b33f31}#canvas .hit{stroke:transparent;stroke-width:3;fill:none;pointer-events:stroke;cursor:pointer}#canvas .lot-hit{fill:transparent;stroke:none;pointer-events:fill}#canvas .lot-highlight{fill:#a84e3410;stroke:var(--accent);stroke-width:.35;stroke-dasharray:1.5 1;pointer-events:none}#canvas .guide{fill:none;stroke:var(--accent);stroke-width:.35;stroke-dasharray:2 2;pointer-events:none;opacity:.6}#canvas .node{fill:var(--paper);stroke:var(--accent);stroke-width:.45;cursor:grab}#canvas .node:hover{fill:var(--accent-soft)}#canvas .node.active{fill:var(--accent)}#canvas .margin{fill:none;stroke:#c895744a;stroke-width:.3;stroke-dasharray:1 1;pointer-events:none}#empty-message{position:absolute;text-align:center;pointer-events:none;color:var(--muted)}#empty-message h2{font-size:28px;color:var(--ink)}#empty-message p{line-height:1.7;margin-bottom:22px}#empty-message button{pointer-events:auto;margin:4px}#issues{background:#f3e0d4;color:#914c31;padding:9px 12px;margin-bottom:10px;border-left:3px solid #b86a42;font-size:12px;line-height:1.5}#issues[hidden]{display:none}footer{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);gap:12px;padding:12px 0 0}#hint{text-align:right}.mode-hint{padding:10px;background:var(--accent-soft);color:var(--accent);font-size:13px;line-height:1.5}.small-row{display:flex;gap:8px}.small-row label{flex:1;min-width:0}.stage-next{margin-top:20px;width:100%;border-color:var(--accent);color:var(--accent)}@media(max-width:1000px){header{padding:12px 16px}.brand-icon{display:none}h1{font-size:24px}.header-actions button{font-size:12px;padding:7px}main{grid-template-columns:270px minmax(0,1fr)}.workspace{padding:12px}.paper-wrap{padding:10px}}@media(max-width:720px){header{height:auto;flex-wrap:wrap}.header-actions{flex-wrap:wrap}main{height:auto;display:flex;flex-direction:column}aside{overflow:visible}nav{grid-template-columns:repeat(4,1fr);gap:2px}.step{font-size:11px;padding:5px;gap:5px}.step .tally{display:none}.step .number{width:19px;height:19px}#panel{padding:16px 20px}.workspace{height:65vh;min-height:450px;order:-1}.stage-bar{font-size:11px}#empty-message h2{font-size:22px}.paper-settings,.local-note{margin:15px 20px}footer #hint{display:none}}

#canvas .shape-hit{fill:transparent;stroke:none;pointer-events:all;cursor:grab}

#canvas .lot-highlight.problem{stroke:#b33f31;fill:#b33f310a}

.sun-control{text-align:center;margin:20px 0}.sun-control>span{display:block;text-align:left}.sun-control small{display:block;margin-top:7px;color:#777}.dial-wrap{position:relative;width:164px;height:164px;margin:12px auto 3px}.dial-wrap>span{position:absolute;font-size:11px;color:#777}.dial-n{top:0;left:78px}.dial-s{bottom:0;left:78px}.dial-e{right:0;top:76px}.dial-w{left:0;top:76px}.sun-knob{position:absolute;inset:23px;border-radius:50%;background:repeating-conic-gradient(#595a54 0deg 2deg,#343731 2deg 8deg);border:4px solid #bdbbb0;box-shadow:0 3px 7px #0003;cursor:grab;touch-action:none;user-select:none}.sun-knob:active{cursor:grabbing}.sun-knob:focus-visible{outline:3px solid #ad4c32;outline-offset:4px}.dial-center{position:absolute;inset:12px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#696b63,#30352f);pointer-events:none}.dial-pointer{position:absolute;inset:5px;transform:rotate(var(--angle));z-index:1;pointer-events:none}.dial-pointer:before{content:'';position:absolute;left:calc(50% - 2px);top:0;width:4px;height:22px;background:#f2c579;border-radius:3px}.sun-control output{font-size:20px;font-variant-numeric:tabular-nums}.sun-elevation output{float:right;font-variant-numeric:tabular-nums}.sun-elevation input[type=range]{width:100%;padding:0;margin:15px 0 7px;accent-color:#ad4c32;cursor:pointer}.slider-labels{display:flex;justify-content:space-between;font-size:11px;color:#777}
