:root{--bg:#0b1220;--panel:#111a2d;--panel2:#17233b;--line:#2a3b5f;--text:#eef4ff;--muted:#9eb0ce;--accent:#53b3ff;--ok:#42d392;--warn:#ffbd4a;--bad:#ff6b6b;--shadow:0 12px 30px rgba(0,0,0,.28)}
*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}button,input,select{font:inherit}.app{min-height:100%;display:grid;grid-template-rows:auto auto auto 1fr}.topbar{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#0e1728;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.brand{font-weight:800;letter-spacing:.3px;white-space:nowrap}.product{color:var(--accent);font-weight:700}.topbar .spacer{flex:1}.btn{border:1px solid var(--line);background:var(--panel2);color:var(--text);padding:9px 12px;border-radius:9px;cursor:pointer}.btn:hover{filter:brightness(1.1)}.btn.primary{background:var(--accent);color:#07111e;border-color:transparent;font-weight:800}.btn.danger{background:#3a1820;border-color:#6d2835}.template-tools{display:flex;gap:7px;min-width:340px}.template-select{min-width:210px;max-width:360px;background:#09111f;border:1px solid var(--line);color:var(--text);border-radius:8px;padding:8px}.template-btn{white-space:nowrap}.template-info{padding:6px 14px;background:#0a1322;border-bottom:1px solid #1b2c48;color:#9fb6d8;font-size:11px}.setup{display:grid;grid-template-columns:repeat(6,minmax(110px,1fr));gap:9px;padding:10px 14px;background:#0d1627;border-bottom:1px solid var(--line)}.field{display:flex;flex-direction:column;gap:4px}.field label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.field input,.field select{width:100%;background:#09111f;border:1px solid var(--line);color:var(--text);border-radius:8px;padding:8px}.workspace{display:grid;grid-template-columns:220px minmax(400px,1.15fr) minmax(400px,1.05fr);gap:10px;padding:10px;min-height:0}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);min-height:0;overflow:hidden}.panel h3{font-size:13px;margin:0;padding:11px 12px;border-bottom:1px solid var(--line);color:#cfe0fb}.palette{padding:10px;display:grid;grid-template-columns:1fr;gap:7px;overflow:auto;max-height:calc(100vh - 205px)}.part{display:flex;align-items:center;gap:9px;padding:9px;border:1px solid var(--line);border-radius:9px;background:var(--panel2);cursor:grab;user-select:none}.part:active{cursor:grabbing}.part .icon{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:#0b1424}.center{display:grid;grid-template-rows:auto 1fr auto}.canvasbar,.previewbar{display:flex;align-items:center;gap:8px;padding:9px 10px;border-bottom:1px solid var(--line);background:#0e182a}.canvasbar .hint{margin-left:auto;color:var(--muted);font-size:11px}.canvaswrap{position:relative;min-height:540px;background-image:linear-gradient(#20304d55 1px,transparent 1px),linear-gradient(90deg,#20304d55 1px,transparent 1px);background-size:24px 24px;background-color:#08111e;overflow:hidden}.floor{position:absolute;border:2px solid #4c6f9f;background:#0b1c31aa;left:6%;top:8%;width:88%;height:84%;border-radius:3px;overflow:visible}.placed{position:absolute;display:flex;align-items:center;justify-content:center;text-align:center;padding:3px;border:1px solid #8cbbe8;background:#17314ed9;color:white;border-radius:5px;cursor:move;user-select:none;font-size:11px;overflow:hidden}.placed.selected{outline:2px solid #ffd166;z-index:5}.placed.wall{background:#315a75}.placed.door{background:#79573d}.placed.window{background:#286a8a}.placed.extension{background:#5d3f85}.placed.furniture{background:#335a48}.statusbar{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;padding:9px;border-top:1px solid var(--line);background:#0e182a}.stat{background:#09111f;border:1px solid var(--line);border-radius:8px;padding:8px}.stat small{display:block;color:var(--muted);font-size:10px}.stat b{font-size:14px}.right{display:grid;grid-template-rows:auto 1fr auto}.preview{min-height:540px;position:relative;background:linear-gradient(#a9c4df 0 58%,#678459 58% 100%);overflow:hidden}#preview3d{width:100%;height:100%;display:block;min-height:540px;touch-action:none;cursor:grab}#preview3d:active{cursor:grabbing}.preview-help{position:absolute;left:10px;bottom:9px;background:#07101dcc;color:#d8e6f5;border:1px solid #ffffff22;border-radius:8px;padding:6px 8px;font-size:10px;pointer-events:none}.view-controls{position:absolute;top:9px;left:9px;right:9px;display:flex;flex-wrap:wrap;gap:5px;z-index:4;pointer-events:none}.view-controls button{pointer-events:auto;border:1px solid #ffffff35;background:#0c1724dd;color:#eef6ff;border-radius:8px;padding:6px 8px;font-size:11px;cursor:pointer;box-shadow:0 3px 12px #0005}.view-controls button.active{background:#15618f;border-color:#5ec1ff}.walk-pad{display:none;position:absolute;right:10px;bottom:10px;z-index:5;text-align:center}.walk-pad.show{display:block}.walk-pad button{width:38px;height:35px;border:1px solid #ffffff44;border-radius:8px;background:#071421d9;color:white;margin:2px;font-weight:900}.props{border-top:1px solid var(--line);padding:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#0d1728}.props .wide{grid-column:1/-1}.notice{font-size:11px;color:var(--muted);padding:8px 10px;border-top:1px solid var(--line)}.badge{display:inline-block;padding:3px 7px;border-radius:999px;font-size:11px;font-weight:700}.ok{background:#16382d;color:#78efb6}.warn{background:#3b2e16;color:#ffd27b}.bad{background:#411e24;color:#ff9fa7}.empty{color:var(--muted);font-size:12px}.calc-note{font-size:11px;color:var(--muted);line-height:1.35;background:#09111f;border:1px solid var(--line);border-radius:8px;padding:7px 8px}.field input[readonly]{color:#8fe7bd;background:#0b1a1a;cursor:default}.toast{position:fixed;right:18px;bottom:18px;background:#162841;border:1px solid #36577e;color:white;padding:12px 16px;border-radius:10px;z-index:99;box-shadow:0 10px 30px #0008;max-width:min(420px,calc(100vw - 36px))}
@media(max-width:1200px){.topbar{flex-wrap:wrap}.template-tools{min-width:300px}.setup{grid-template-columns:repeat(3,1fr)}.workspace{grid-template-columns:190px 1fr}.right{grid-column:1/-1;min-height:600px}.palette{max-height:650px}.preview,#preview3d{min-height:520px}}
@media(max-width:720px){.topbar{gap:7px}.brand{width:100%}.template-tools{order:5;width:100%;min-width:0}.template-select{min-width:0;flex:1}.template-btn{padding:8px}.setup{grid-template-columns:repeat(2,1fr)}.workspace{grid-template-columns:1fr}.palette{grid-template-columns:repeat(2,1fr);max-height:none}.canvaswrap{min-height:440px}.right{grid-column:auto;min-height:580px}.statusbar{grid-template-columns:repeat(2,1fr)}.canvasbar .hint{display:none}.preview,#preview3d{min-height:480px}.view-controls{right:55px}.preview-help{max-width:220px}.props{grid-template-columns:1fr 1fr}}
.app,.topbar,.setup,.workspace,.panel,.template-info{min-width:0;max-width:100vw}.workspace>*{min-width:0}.template-tools{max-width:100%;min-width:0}.template-select{width:100%;min-width:0}
@media(max-width:720px){.app,.topbar,.setup,.workspace,.template-info{width:100%;max-width:100%}.topbar>*{min-width:0}.template-tools{display:grid;grid-template-columns:minmax(0,1fr) auto}.template-btn{font-size:12px;padding:8px 9px}.panel{width:100%;max-width:100%}.props>*{min-width:0}}