:root{--bg:#f7f7f5;--surface:#fff;--text:#1d1d1b;--muted:#5f5e5a;--border:#d9d8d2;--accent:#2563eb;--accent-text:#fff;--ok:#15803d;--bad:#b91c1c;--notice:#fdf6e3;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#161615;--surface:#1f1f1d;--text:#ecebe6;--muted:#a3a29c;--border:#3a3936;--accent:#60a5fa;--accent-text:#0b1220;--ok:#4ade80;--bad:#f87171;--notice:#2a2618}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:system-ui,Segoe UI,Arial,sans-serif;line-height:1.5}a{color:var(--accent)}.nav{border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap;gap:16px;padding:12px 16px;display:flex}.nav a[aria-current=page]{font-weight:600;text-decoration:none}.page{max-width:720px;margin:0 auto;padding:16px}h1{margin:8px 0 16px;font-size:1.5rem}.muted{color:var(--muted)}.error{color:var(--bad)}.notice{background:var(--notice);border:1px solid var(--border);border-radius:8px;padding:12px 16px}.steps li{margin-bottom:8px}button{border:1px solid var(--border);background:var(--surface);min-width:44px;min-height:44px;color:var(--text);font:inherit;cursor:pointer;border-radius:8px;padding:8px 16px}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text);font-weight:600}button.big{width:100%;min-height:64px;font-size:1.25rem}button.link{min-width:0;min-height:0;color:var(--accent);background:0 0;border:0;padding:0;text-decoration:underline}.field{flex-direction:column;gap:4px;margin-bottom:12px;display:flex}input{border:1px solid var(--border);background:var(--surface);min-height:44px;color:var(--text);font:inherit;border-radius:8px;width:100%;padding:8px}table{border-collapse:collapse;width:100%}th,td{border-bottom:1px solid var(--border);text-align:start;padding:6px 8px}td input{max-width:110px}td.ok{color:var(--ok);font-weight:600}td.bad{color:var(--bad);font-weight:600}.xr-overlay{pointer-events:none;color:#fff;flex-direction:column;justify-content:space-between;display:flex;position:fixed;inset:0}.xr-overlay.hidden{display:none}.xr-top,.xr-bottom{pointer-events:auto;background:#0000008c;padding:12px 16px}.xr-top{padding-top:max(12px, env(safe-area-inset-top))}.xr-bottom{padding-bottom:max(16px, env(safe-area-inset-bottom));flex-direction:column;gap:8px;display:flex}.xr-bottom .row{gap:8px;display:flex}.xr-bottom .row button{flex:1}.board{aspect-ratio:1;background:var(--surface);border:1px solid var(--border);touch-action:none;border-radius:8px;width:100%;max-width:480px;margin:16px auto;display:block}.square{fill:var(--accent);cursor:grab}.tabs{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.login{max-width:360px}.planpage{flex-direction:column;flex:1;min-height:0;display:flex}#root{flex-direction:column;min-height:100dvh;display:flex}#root:has(.planpage){height:100dvh}.plantools{background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;gap:8px;padding:8px 12px;display:flex}.toolgroup{flex-wrap:wrap;gap:6px;display:flex}.tbtn,.btn{border:1px solid var(--border);background:var(--surface);min-width:44px;min-height:44px;color:var(--text);font:inherit;cursor:pointer;border-radius:8px;align-items:center;gap:6px;padding:6px 12px;display:inline-flex}.tbtn.on,.btn.primary,.seg button.on{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}.tbtn:disabled,.btn:disabled{opacity:.45;cursor:default}.btn.danger{color:var(--bad)}.tbtn.check input{width:18px;height:18px}.planbody{flex:1;min-height:0;display:flex}.canvaswrap{background:var(--bg);flex:1;min-width:0;position:relative}.topview{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.topview .grid{stroke:var(--border);stroke-width:.5px;vector-effect:non-scaling-stroke;opacity:.6}.topview .room{opacity:.55;stroke:none}.topview .room.sel{opacity:.8}.topview .wall{stroke:var(--text);stroke-linecap:square}.topview .wall.sel{stroke:var(--accent)}.topview .wallhit{stroke:#0000;stroke-linecap:round;cursor:pointer}.topview .dim{fill:var(--muted);paint-order:stroke;stroke:var(--bg);stroke-width:3px;vector-effect:non-scaling-stroke}.topview .roomlabel{fill:var(--text);pointer-events:none;font-weight:600}.topview .roomlabel .area{fill:var(--muted);font-weight:400}.topview .opening-gap{stroke:var(--bg)}.topview .opening.sel .opening-gap{stroke:var(--notice)}.topview .opening-glass{stroke:var(--accent)}.topview .doorswing line,.topview .doorswing path{stroke:var(--text);stroke-width:1.5px;vector-effect:non-scaling-stroke}.topview .draftline{fill:none;stroke:var(--accent);stroke-dasharray:6 4}.topview .draftpt{fill:var(--accent)}.topview .draftpt.first{fill:var(--ok)}.topview .cursor{fill:none;stroke:var(--accent);stroke-width:1.5px;vector-effect:non-scaling-stroke}.hint{inset-inline:12px;background:var(--notice);border:1px solid var(--border);pointer-events:none;border-radius:8px;padding:8px 12px;position:absolute;bottom:12px}.emptystate{text-align:center;color:var(--muted);pointer-events:none;place-content:center;padding:24px;display:grid;position:absolute;inset:0}.card{background:var(--surface);border-inline-start:1px solid var(--border);flex:none;width:300px;padding:12px 16px;overflow-y:auto}.card h2{margin:8px 0;font-size:1.1rem}.summary{border-bottom:1px solid var(--border);flex-direction:column;margin-bottom:8px;padding-bottom:8px;display:flex}.summary span,.muted{color:var(--muted)}.field{flex-direction:column;gap:2px;margin:8px 0;display:flex}.field input:not([type=color]){border:1px solid var(--border);background:var(--bg);width:100%;min-height:44px;color:var(--text);font:inherit;border-radius:8px;padding:6px 10px}.field input[type=color]{width:64px;height:44px}.inputrow{align-items:center;gap:6px;display:flex}.btnrow{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.template{background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:flex-end;gap:8px 12px;padding:8px 12px;display:flex}.template .field{width:120px;margin:0}.seg{border:1px solid var(--border);border-radius:8px;display:inline-flex;overflow:hidden}.seg button{background:var(--surface);min-height:44px;color:var(--text);font:inherit;border:0;padding:0 14px}@media (width<=800px){.planbody{flex-direction:column}.card{border-inline-start:0;border-top:1px solid var(--border);width:auto;max-height:42%}.plantools{padding:6px 8px}.tbtn{padding:6px 10px}}@media (width<=600px){.nav{gap:10px;padding:6px 10px;font-size:.85rem}.plantools,.toolgroup{gap:4px}.tbtn{gap:4px;padding:4px 8px;font-size:.85rem}}.topview .itembody{stroke:var(--text);stroke-width:1px;vector-effect:non-scaling-stroke;cursor:grab;opacity:.92}.topview .elevated{fill:none;stroke:var(--text);stroke-dasharray:4 3;pointer-events:none;vector-effect:non-scaling-stroke}.topview .itemlabel{fill:#111;pointer-events:none}.topview .itemsel{fill:none;stroke:var(--accent)}.topview .gaplabel{fill:var(--accent);paint-order:stroke;stroke:var(--bg);stroke-width:3px;vector-effect:non-scaling-stroke;font-weight:600}.catalog{background:var(--surface);border-bottom:1px solid var(--border);flex-direction:column;gap:8px;max-height:40vh;padding:8px 12px;display:flex;overflow-y:auto}.catalog .cats{flex-wrap:wrap;gap:6px;display:flex}.catalog .cats button{border:1px solid var(--border);background:var(--surface);min-height:44px;color:var(--text);font:inherit;border-radius:999px;padding:4px 12px}.catalog .cats button.on{background:var(--accent);color:var(--accent-text)}.catalog ul{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.catalog li button{text-align:start;border:1px solid var(--border);background:var(--bg);width:100%;min-height:44px;color:var(--text);font:inherit;border-radius:8px;justify-content:space-between;gap:8px;padding:6px 10px;display:flex}.catalog li small{color:var(--muted)}.catalog input[type=search]{border:1px solid var(--border);background:var(--bg);min-height:44px;color:var(--text);font:inherit;border-radius:8px;padding:6px 10px}.gaps{flex-wrap:wrap;gap:6px;display:flex}.gapinput{border:1px solid var(--border);background:var(--bg);width:84px;min-height:44px;color:var(--text);font:inherit;border-radius:8px;padding:6px 8px}.catalog li{gap:4px;display:flex}.favbtn{border:1px solid var(--border);background:var(--surface);min-width:44px;color:var(--text);font:inherit;border-radius:8px}.card h3{margin:12px 0 4px;font-size:.95rem}.linkbtn{min-height:32px;color:var(--accent);font:inherit;cursor:pointer;background:0 0;border:0;margin-inline-start:auto;padding:0 8px;text-decoration:underline}.savestatus{min-height:44px;color:var(--muted);align-items:center;gap:4px;padding:0 8px;font-size:.9rem;display:inline-flex}.savestatus.saved{color:var(--ok)}.savestatus.offline{color:var(--bad)}.notices{inset-inline:12px;pointer-events:none;z-index:10;flex-direction:column;gap:6px;display:flex;position:fixed;bottom:12px}.notice-bar{pointer-events:auto;background:var(--notice);border:1px solid var(--border);color:var(--text);border-radius:8px;justify-content:space-between;align-items:center;gap:12px;padding:8px 12px;display:flex}.page.wide{max-width:1100px}.listhead{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:12px;display:flex}.listhead h1{margin:0;margin-inline-end:auto}.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.card2{border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:12px}.card2 h2{margin:8px 0 0;font-size:1.1rem}.card2 p{margin:4px 0}.cardopen{background:var(--bg);cursor:pointer;border:0;border-radius:8px;width:100%;padding:0;display:block}.thumb{width:100%;height:140px;display:block}.thumbroom{fill:#d8c7a8;fill-opacity:.7;stroke:var(--text);stroke-width:1px;vector-effect:non-scaling-stroke}.thumbtext{fill:var(--muted)}.nav a,.linkbtn{align-items:center;min-height:44px;padding-inline:4px;display:inline-flex}@media (width<=600px){.nav{gap:4px 12px;padding:0 10px}}.planhead{background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:4px 12px;padding:2px 12px;display:flex}.planhead .summary{border:0;flex-direction:row;align-items:baseline;gap:8px;margin:0;margin-inline-end:auto;padding:0}.layers{position:relative}.popover{inset-inline-end:0;z-index:20;border:1px solid var(--border);background:var(--surface);white-space:nowrap;border-radius:8px;flex-direction:column;gap:2px;margin-top:4px;padding:6px 12px;display:flex;position:absolute;top:100%;box-shadow:0 4px 16px #0000002e}.popover .check,.tbtn.check{align-items:center;gap:8px;min-height:44px;display:flex}.popover input{width:20px;height:20px}.closecard{display:none}@media (width<=800px){.planbody{flex-direction:column;position:relative}.card{inset-inline:0;border-inline-start:0;border-top:1px solid var(--border);z-index:5;width:auto;max-height:46%;position:absolute;bottom:0;box-shadow:0 -4px 16px #00000026}.card.nothing{display:none}.closecard{margin-top:8px;display:inline-flex}.hint{bottom:8px}}.topview .grid.major{opacity:1}.topview .wallmeasured{stroke:var(--bg);stroke-dasharray:6 4;pointer-events:none}.totalarea{background:var(--surface);border:1px solid var(--border);pointer-events:none;border-radius:8px;padding:4px 10px;font-size:.9rem;position:absolute;inset-block-start:8px;inset-inline-start:8px}.totalarea .legend{color:var(--muted);font-size:.8rem;display:block}.drawpanel{inset-inline:8px;border:1px solid var(--border);background:var(--surface);z-index:4;border-radius:10px;flex-wrap:wrap;align-items:flex-end;gap:6px 10px;padding:8px 12px;display:flex;position:absolute;bottom:56px}.drawpanel .field{width:190px;margin:0}.topview .itemdetail{fill:none;stroke:var(--text);stroke-width:1px;opacity:.55;vector-effect:non-scaling-stroke;pointer-events:none}.topview .itembody.tobuy{stroke-dasharray:6 4;fill-opacity:.45}.shapethumb{width:44px;height:32px;color:var(--text);flex:none}.catalog li button:first-child{align-items:center}.topview .rotatehandle{fill:var(--surface);stroke:var(--accent);stroke-width:2px;vector-effect:non-scaling-stroke;cursor:grab}.swatches{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.swatch{border:2px solid var(--border);cursor:pointer;border-radius:8px;width:44px;height:44px}.swatch.on{border-color:var(--accent);outline:2px solid var(--accent)}.morebtn{display:none}@media (width<=800px),(height<=500px){.planpage>.plantools{border-bottom:0;border-top:1px solid var(--border);flex-wrap:wrap;order:10;gap:4px;padding:4px 6px}.planpage>.template,.planpage>.catalog{order:6}.planpage>.planbody{order:5}.planpage>.planhead{order:1;padding:0 8px}.plantools .toolgroup{flex-wrap:wrap;gap:4px}.plantools .more{display:none}.plantools.open .more{display:inline-flex}.plantools.open .layers.more{display:block}.morebtn{display:inline-flex}.planbody{flex-direction:column;position:relative}.card{inset-inline:0;border-inline-start:0;border-top:1px solid var(--border);z-index:5;width:auto;max-height:55%;position:absolute;bottom:0;box-shadow:0 -4px 16px #00000026}.card.nothing{display:none}.closecard{margin-top:8px;display:inline-flex}.popover{margin-top:0;margin-bottom:4px;top:auto;bottom:100%}}@media (height<=500px){.nav{gap:0 12px;padding-block:0}}.canvaswrap{min-height:0;overflow:hidden}.canvaswrap>.topview,.threeview{position:absolute;inset:0}.threehost{background:linear-gradient(var(--bg), var(--surface));position:absolute;inset:0}.threebar{inset-inline:8px;pointer-events:none;flex-wrap:wrap;gap:6px;display:flex;position:absolute;top:8px}.threebar>*{pointer-events:auto;background:var(--surface)}.eyeheight{border:1px solid var(--border);border-radius:8px;width:150px;margin:0;padding:2px 8px}.measureflow{z-index:30;background:var(--bg);position:fixed;inset:0;overflow-y:auto}.measurepanel{flex-direction:column;gap:12px;max-width:640px;margin:0 auto;padding:16px;display:flex}.reviewlist{margin:0;padding:0;list-style:none}.reviewrow{grid-template-columns:70px 1fr auto auto;align-items:center;gap:8px;padding:4px 0;display:grid}.reviewrow input{border:1px solid var(--border);background:var(--bg);min-height:44px;color:var(--text);font:inherit;border-radius:8px;padding:6px 10px}.exportpreview{border:1px solid var(--border);background:#fff;max-height:60vh;overflow:auto}.historyrow{text-align:start;width:100%;margin-bottom:4px}.historyrow.on{border-color:var(--accent)}.onboarding{background:var(--notice);border-bottom:1px solid var(--border);flex-wrap:wrap;order:4;justify-content:space-between;align-items:center;gap:6px 16px;padding:8px 12px;display:flex}.onboarding p{margin:2px 0 0}@media (width>=801px) and (width<=1000px){.card{width:250px}}.planbody>.catalog{border-bottom:0;border-inline-end:1px solid var(--border);flex:none;width:300px;max-height:none;overflow-y:auto}.planbody>.catalog ul{grid-template-columns:1fr}.catalog li button span{white-space:normal;text-align:start;flex:auto;min-width:0}.catalog li button small{white-space:nowrap;flex:none}.catalog li button:first-child{flex:auto;min-width:0}.catalog li .favbtn{flex:none;width:44px;min-height:44px}@media (width<=1000px),(height<=500px){.planbody>.catalog{inset-inline:0;z-index:6;border-inline-end:0;border-top:1px solid var(--border);width:auto;max-height:60%;position:absolute;bottom:0;box-shadow:0 -4px 16px #00000026}.planbody>.catalog ul{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}}@media (height<=500px){.planbody>.catalog{max-height:95%}.catalog .cats{flex-wrap:nowrap;flex:none;overflow-x:auto}.catalog .cats button{flex:none}}.topview .resizedot{fill:var(--surface);stroke:var(--accent);stroke-width:2px;vector-effect:non-scaling-stroke;pointer-events:none}.topview .resizehit{fill:#0000;cursor:nwse-resize}.topview .gapline{stroke:var(--accent);stroke-width:1px;stroke-dasharray:4 3;vector-effect:non-scaling-stroke;pointer-events:none}.topview .gaphit{fill:#0000;cursor:text}.gapedit{z-index:5;position:absolute;transform:translate(-50%,-50%)}.gapedit input{border:2px solid var(--accent);background:var(--surface);width:96px;min-height:44px;color:var(--text);font:inherit;border-radius:8px;padding:4px 8px}.gapfield{flex-direction:column;gap:2px;min-width:84px;display:flex}.topview .gaphit{pointer-events:all}.walkpad{inset-inline:0;pointer-events:none;justify-content:center;gap:8px;display:flex;position:absolute;bottom:56px}.walkpad>*{pointer-events:auto;background:var(--surface);justify-content:center;min-width:56px;min-height:56px;font-size:1.3rem}
