*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}@font-face{font-family:Inter;src:url(/fonts/inter.woff2)format("woff2");font-weight:100 900;font-style:normal;font-display:swap}:root{--font-ui:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--surface:#fff;--surface-2:#f1f1f3;--canvas:#dcdce1;--line:#d3d3d9;--line-strong:#b4b4bd;--text-1:#1d1d1f;--text-2:#4b4b52;--text-3:#86868f;--accent:#0071e3;--accent-hover:#0062cc;--accent-soft:#0071e314;--accent-ring:#0071e340;--danger:#b42318;--fs-1:11px;--fs-2:12px;--fs-3:13px;--fs-4:15px;--lh:1.4;--h-ctrl:28px;--h-ctrl-sm:22px;--pad-ctrl:10px;--pad-ctrl-sm:8px;--r-sm:4px;--r-md:6px;--r-lg:10px;--shadow-float:0 4px 12px #0000001a, 0 1px 3px #0000000f;--t-micro:.1s;--t-std:.16s;--ease:cubic-bezier(.2, 0, 0, 1);--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--w-panel:316px;--h-top:40px}body{font-family:var(--font-ui);font-size:var(--fs-2);line-height:var(--lh);color:var(--text-1);background:var(--surface);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.login-screen{z-index:9999;background:#f5f5f7 url(/images/containment-render.jpg) 50%/cover no-repeat;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.login-screen:before{content:"";-webkit-backdrop-filter:blur(8px);background:#f5f5f7a6;position:absolute;inset:0}.login-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-float);text-align:center;width:320px;padding:32px;position:relative}.login-logo{width:auto;height:40px;margin-bottom:var(--sp-3)}.login-card .login-sub{font-size:var(--fs-4);color:var(--text-1);margin-bottom:var(--sp-4);font-weight:600}.login-error{color:var(--danger);font-size:var(--fs-1);margin-bottom:var(--sp-2);text-align:left;display:none}.login-card .form-group{margin-bottom:var(--sp-3);text-align:left}.login-card .form-group input,.dlg-input{width:100%;height:36px;padding:0 var(--pad-ctrl);border:1px solid var(--line-strong);border-radius:var(--r-sm);font-size:var(--fs-3);background:var(--surface);transition:border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease)}.login-card .form-group input:focus,.dlg-input:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-ring);outline:none}.login-btn,.dlg-btn{width:100%;height:36px;padding:0 var(--pad-ctrl);background:var(--accent);color:var(--surface);border-radius:var(--r-md);font-size:var(--fs-3);cursor:pointer;transition:background var(--t-micro) var(--ease);border:1px solid #0000;justify-content:center;align-items:center;font-weight:600;display:inline-flex}.login-btn{margin-top:var(--sp-2)}.login-btn:hover,.dlg-btn:hover{background:var(--accent-hover)}.dlg-btn-secondary{background:var(--surface);color:var(--text-1);border-color:var(--line-strong);font-weight:400}.dlg-btn-secondary:hover{background:var(--surface-2)}.login-link{width:100%;margin-top:var(--sp-3);font-size:var(--fs-2);color:var(--text-2);cursor:pointer;background:0 0;border:none;padding:0;display:block}.login-link:hover{color:var(--text-1);text-decoration:underline}.dlg-overlay{z-index:10000;background:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.dlg{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);width:90%;max-width:400px;box-shadow:var(--shadow-float);padding:28px}.dlg-logo{width:auto;height:28px;margin-bottom:var(--sp-4);display:block}.dlg h3{font-size:var(--fs-4);color:var(--text-1);margin:0 0 var(--sp-1);font-weight:600}.dlg p{font-size:var(--fs-2);color:var(--text-2);margin:0 0 var(--sp-4)}.dlg-label{font-size:var(--fs-1);color:var(--text-2);margin-bottom:var(--sp-1);display:block}.dlg-input{margin-bottom:var(--sp-3)}.dlg-error{font-size:var(--fs-1);color:var(--danger);margin:calc(-1 * var(--sp-1)) 0 var(--sp-3);display:none}.dlg-actions{gap:var(--sp-2);display:flex}.dlg-actions .dlg-btn{flex:1}.dlg-choices{gap:var(--sp-2);margin-bottom:var(--sp-3);display:flex}.dlg-choice{border:1px solid var(--line-strong);border-radius:var(--r-md);background:var(--surface);height:32px;color:var(--text-1);font-size:var(--fs-2);cursor:pointer;flex:1}.dlg-choice:hover{background:var(--surface-2)}.dlg-choice.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);font-weight:600}.app-container{grid-template-columns:var(--w-panel) minmax(0, 1fr);grid-template-rows:var(--h-top) minmax(0, 1fr);height:100vh;display:none}.app-container.visible{display:grid}.panel-header{padding:0 var(--sp-4);background:var(--surface);border-bottom:1px solid var(--line);grid-area:1/1;align-items:center;display:flex}.panel-logo{width:auto;height:16px}.control-panel{width:var(--w-panel);background:var(--surface);border-right:1px solid var(--line);flex-direction:column;grid-area:2/1;min-height:0;padding:0;display:flex;overflow-y:auto}.control-panel::-webkit-scrollbar{width:4px}.control-panel::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:var(--r-sm)}.control-panel::-webkit-scrollbar-thumb:hover{background:var(--text-3)}.canvas-area{background:var(--surface-2);flex-direction:column;grid-area:2/2;min-width:0;min-height:0;display:flex;overflow:hidden}.canvas-wrapper{flex-direction:column;flex:1;min-height:0;padding:10px;display:flex;overflow:hidden}.tab-bar{height:var(--h-top);min-width:0;padding:0 var(--sp-3);align-items:center;gap:var(--sp-1);background:var(--surface);border-bottom:1px solid var(--line);flex-wrap:nowrap;flex-shrink:0;grid-area:1/2;display:flex}.tab-bar-tabs{flex-wrap:nowrap;align-self:stretch;gap:0;display:flex}.browser-tab{padding:0 var(--sp-3);cursor:pointer;font-size:var(--fs-2);color:var(--text-2);transition:color var(--t-micro) var(--ease), background var(--t-micro) var(--ease);-webkit-user-select:none;user-select:none;background:0 0;border-radius:0;align-items:center;gap:6px;font-weight:400;display:flex}.browser-tab:hover{background:var(--surface-2);color:var(--text-1)}.browser-tab.active{color:var(--text-1);box-shadow:inset 0 -2px 0 var(--accent)}.browser-tab-label{white-space:nowrap}.browser-tab-close{font-size:var(--fs-2);color:var(--text-3);border-radius:var(--r-sm);width:18px;height:18px;transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);justify-content:center;align-items:center;line-height:1;display:flex}.browser-tab-close:hover{background:var(--surface-2);color:var(--text-1)}.tab-bar-add{height:var(--h-ctrl);padding:0 var(--pad-ctrl);border-radius:var(--r-sm);font-size:var(--fs-2);color:var(--text-2);cursor:pointer;white-space:nowrap;transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);background:0 0;border:none;font-weight:400}.tab-bar-add:hover{background:var(--surface-2);color:var(--text-1)}.tab-rename-input{width:100px;height:var(--h-ctrl-sm);padding:0 var(--sp-1);font-size:var(--fs-1);border:1px solid var(--accent);border-radius:var(--r-sm);outline:none}.control-panel>.containment-card,.control-panel>.panel-section{padding:var(--sp-3) var(--sp-4)}.control-panel>.containment-card{border-bottom:1px solid var(--line)}.user-badge{font-size:var(--fs-1);color:var(--text-3);margin-left:var(--sp-3);white-space:nowrap}.user-badge strong{color:var(--text-2);font-weight:600}.user-badge a{color:var(--text-2);text-decoration:none}.user-badge a:hover{color:var(--text-1);text-decoration:underline}.containment-card{flex-direction:column;gap:0;display:flex}.card-head{justify-content:space-between;align-items:baseline;gap:var(--sp-2);padding-bottom:var(--sp-3);display:flex}.containment-card-label{font-size:var(--fs-3);color:var(--text-1);text-overflow:ellipsis;white-space:nowrap;min-width:0;font-weight:600;overflow:hidden}.card-meta{font-size:var(--fs-1);color:var(--text-3);white-space:nowrap}.sec{gap:var(--sp-2);padding:var(--sp-3) 0 var(--sp-4);border-top:1px solid var(--line);flex-direction:column;display:flex}.sec-h{justify-content:space-between;align-items:center;gap:var(--sp-2);min-height:16px;font-size:var(--fs-1);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);margin-bottom:var(--sp-1);font-weight:600;display:flex}.sec-meta,.sec-help{letter-spacing:0;text-transform:none;color:var(--text-3);font-weight:400}.sec-help{color:var(--accent);cursor:help}.sec-toggle{width:100%;font:inherit;font-size:var(--fs-1);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);cursor:pointer;text-align:left;background:0 0;border:0;padding:0;font-weight:600}.sec-toggle>span:first-child{align-items:center;gap:var(--sp-1);display:inline-flex}.sec-toggle svg{width:12px;height:12px;transition:transform var(--t-micro) var(--ease);flex:none}.sec-toggle[aria-expanded=true] svg{transform:rotate(90deg)}.sec-toggle:hover{color:var(--text-2)}.fld{gap:var(--sp-1);flex-direction:column;min-width:0;display:flex}.fld>label,.fld>.fld-label{font-size:var(--fs-1);color:var(--text-2);white-space:nowrap;text-overflow:ellipsis;line-height:1.3;overflow:hidden}.fld>input,.fld>select,.unit-field>input{width:100%;height:var(--h-ctrl);padding:0 var(--pad-ctrl-sm);border:1px solid var(--line-strong);border-radius:var(--r-sm);font-size:var(--fs-2);background:var(--surface);color:var(--text-1);transition:border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease)}.fld>select{text-overflow:ellipsis}.fld>input:hover,.fld>select:hover,.unit-field>input:hover{border-color:var(--text-3)}.fld>input:focus,.fld>select:focus,.unit-field>input:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-ring);outline:none}.fld-row{gap:var(--sp-2);display:grid}.fld-row.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.fld-row.cols-3{grid-template-columns:1.15fr minmax(0,1fr) minmax(0,1fr)}.unit-field{min-width:0;position:relative}.unit-field>input{font-variant-numeric:tabular-nums;padding-right:30px}.unit-field>input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.unit-field>input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.unit-field>input[type=number]{appearance:textfield}.unit-suffix{right:var(--pad-ctrl-sm);font-size:var(--fs-1);color:var(--text-3);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.fld .field-hint{margin-top:2px}.switch-row{min-height:var(--h-ctrl);font-size:var(--fs-2);color:var(--text-1);cursor:pointer;justify-content:space-between;align-items:center;display:flex}.switch{flex:none;width:30px;height:18px;position:relative}.switch input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.switch-track{background:var(--line-strong);transition:background var(--t-micro) var(--ease);border-radius:999px;position:absolute;inset:0}.switch-track:after{content:"";width:14px;height:14px;transition:transform var(--t-micro) var(--ease);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;box-shadow:0 1px 2px #0003}.switch input:checked+.switch-track{background:var(--accent)}.switch input:checked+.switch-track:after{transform:translate(12px)}.switch input:focus-visible+.switch-track{box-shadow:0 0 0 2px var(--accent-ring)}.panel-section{gap:var(--sp-2);flex-direction:column;display:flex}.panel-section h3{align-items:center;gap:var(--sp-1);min-height:16px;font-size:var(--fs-1);letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);font-weight:600;display:flex}.panel-spacer{min-height:var(--sp-2);flex:1}.field-hint{font-size:var(--fs-1);color:var(--text-3)}.form-group{gap:var(--sp-1);flex-direction:column;min-width:0;display:flex}.form-group label{font-size:var(--fs-1);color:var(--text-2);font-weight:400;line-height:1.3}.form-group input,.form-group select{width:100%;height:var(--h-ctrl);padding:0 var(--pad-ctrl-sm);border:1px solid var(--line-strong);border-radius:var(--r-sm);font-size:var(--fs-2);background:var(--surface);transition:border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease)}.form-group input:hover,.form-group select:hover{border-color:var(--text-3)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-ring);outline:none}.form-group textarea{resize:vertical;width:100%;min-height:56px;padding:6px var(--pad-ctrl-sm);border:1px solid var(--line-strong);border-radius:var(--r-sm);font-size:var(--fs-2);line-height:var(--lh);background:var(--surface);transition:border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease)}.form-row{gap:var(--sp-2);display:flex}.form-row .form-group{flex:1}.prop-ctrl{gap:var(--sp-1);flex-direction:column;min-width:0;display:flex;position:relative}.uitvoering-body{gap:var(--sp-2);margin-top:var(--sp-1);flex-direction:column;display:flex}.uitvoering-body[hidden]{display:none}.btn{height:var(--h-ctrl);padding:0 var(--pad-ctrl);border-radius:var(--r-md);font-size:var(--fs-2);cursor:pointer;transition:background var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease);border:1px solid #0000;justify-content:center;align-items:center;font-weight:400;display:inline-flex}.btn-primary{background:var(--accent);color:var(--surface);font-weight:600}.btn-primary:hover{background:var(--accent-hover)}.btn-secondary{background:var(--surface);color:var(--text-1);border-color:var(--line-strong)}.btn-secondary:hover{background:var(--surface-2)}.config-tabs{height:var(--h-ctrl);background:var(--surface-2);border-radius:var(--r-md);grid-auto-columns:1fr;grid-auto-flow:column;gap:2px;padding:3px;display:grid}.config-tab{height:var(--h-ctrl-sm);border-radius:var(--r-sm);font-size:var(--fs-2);color:var(--text-2);white-space:nowrap;cursor:pointer;transition:color var(--t-micro) var(--ease), background var(--t-micro) var(--ease);background:0 0;border:none;justify-content:center;align-items:center;padding:0 6px;font-weight:400;display:flex}.config-tab:hover:not(.active){color:var(--text-1)}.config-tab.active{background:var(--surface);color:var(--text-1);box-shadow:0 1px 2px #00000014, 0 0 0 1px var(--line);font-weight:500}.config-tab:focus-visible{box-shadow:0 0 0 2px var(--accent-ring);outline:none}.summary-row{font-size:var(--fs-2);color:var(--text-2);justify-content:space-between;padding:2px 0;display:flex}.summary-row span:last-child{color:var(--text-1)}.summary-row.total{margin-top:var(--sp-1);padding-top:var(--sp-2);border-top:1px solid var(--line);font-weight:600}.summary-row.total span{color:var(--text-1)}.panel-actions{gap:var(--sp-2);background:var(--surface);border-top:1px solid var(--line);position:sticky;bottom:0}.panel-actions .btn{width:100%}.rack-type-list{gap:var(--sp-2);flex-direction:column;display:flex}.rack-card{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}.rack-type-item{justify-content:space-between;align-items:center;gap:var(--sp-2);min-height:var(--h-ctrl);padding:7px var(--sp-2);cursor:pointer;font-size:var(--fs-2);transition:background var(--t-micro) var(--ease);display:flex}.rack-type-item>div{flex-direction:column;gap:2px;min-width:0;display:flex}.rack-type-item:hover,.rack-type-item.editing{background:var(--surface-2)}.rack-type-name{color:var(--text-1);white-space:nowrap;text-overflow:ellipsis;font-weight:500;overflow:hidden}.rack-type-dims{color:var(--text-1);font-variant-numeric:tabular-nums;font-weight:400}.rack-type-item.has-name .rack-type-dims{font-size:var(--fs-1);color:var(--text-3)}.rack-type-count{font-size:var(--fs-1);color:var(--text-2);background:var(--surface-2);border-radius:999px;flex:none;padding:2px 8px;font-weight:500}.rack-type-item.editing .rack-type-count{background:var(--surface)}.rack-type-edit{gap:var(--sp-2);padding:var(--sp-2);border-top:1px solid var(--line);background:#fafafc;flex-direction:column;display:none}.rack-type-edit.visible{display:flex}.rack-picker{align-items:center;width:100%;min-width:0;display:flex;position:relative}.rack-picker input{text-overflow:ellipsis;padding-right:26px}.rack-picker[data-state=linked] input{font-weight:500}.rack-picker-clear{border-radius:var(--r-sm);width:20px;height:20px;color:var(--text-3);cursor:pointer;background:0 0;border:none;margin-top:-10px;font-size:15px;line-height:1;position:absolute;top:50%;right:4px}.rack-picker-clear:hover{background:var(--surface-2);color:var(--text-1)}.rack-picker-list{z-index:9600;max-height:280px;padding:var(--sp-1);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-float);position:fixed;overflow-y:auto}.rack-picker-opt{padding:5px var(--pad-ctrl-sm);border-radius:var(--r-sm);font-size:var(--fs-2);color:var(--text-1);cursor:pointer;flex-direction:column;gap:1px;display:flex}.rack-picker-opt.is-active{background:var(--surface-2)}.rack-picker-name{font-weight:500}.rack-picker-dims,.rack-picker-empty{font-size:var(--fs-1);color:var(--text-3)}.rack-picker-empty{padding:6px var(--pad-ctrl-sm)}.rack-picker-hint{margin:2px 0 var(--sp-1);gap:4px;line-height:1.3;display:flex}.rack-picker-hint:before{content:"ⓘ";flex:none}.canvas-wrapper:has(>.drawings-container){padding:0}.drawings-container{background:var(--line);flex:1;grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr;gap:1px;min-width:0;min-height:0;display:grid}.drawing-box{background:var(--surface);flex-direction:column;min-width:0;min-height:0;display:flex;position:relative;overflow:hidden}.drawing-box-top{grid-area:1/1}.drawing-box-front{grid-area:2/1}.drawing-box-3d{background:var(--canvas);grid-area:1/2/3}.drawings-container.hide-3d{grid-template-columns:1fr}.drawings-container.hide-3d .drawing-box-3d{display:none}.drawing-box-3d>div:last-child{flex:1;min-height:0;overflow:hidden}.drawing-box-top>div,.drawing-box-front>div{padding:8px 12px}.drawing-box svg{width:100%;height:100%;display:block}.add-unit-btn:hover .unit-zone,.unit-count-chip:hover .unit-zone,.remove-unit-btn:not(.is-disabled):hover .unit-zone{fill:var(--surface-2)}.add-unit-btn:hover path,.remove-unit-btn:not(.is-disabled):hover path{stroke:var(--text-1)}.app-copyright-fixed{font-size:var(--fs-1);color:var(--text-3);-webkit-backdrop-filter:blur(4px);border-radius:var(--r-sm);z-index:500;pointer-events:none;background:#ffffffb8;padding:3px 10px;position:fixed;bottom:8px;right:12px}.color-field{align-items:center;gap:var(--sp-2);width:100%;height:var(--h-ctrl);padding:0 var(--pad-ctrl-sm);border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface);font:inherit;font-size:var(--fs-2);color:var(--text-1);text-align:left;cursor:pointer;transition:border-color var(--t-micro) var(--ease), box-shadow var(--t-micro) var(--ease);display:flex}.color-field:hover{border-color:var(--text-3)}.color-field:focus-visible,.color-field[aria-expanded=true]{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-ring);outline:none}.color-field-dot{background:linear-gradient(135deg,#3a3a3a 0 45%,#a0a0a0 55% 100%);border:1px solid #0000002e;border-radius:50%;flex:none;width:14px;height:14px}.color-field .color-name{flex:1;min-width:0}.color-field-caret{width:16px;height:16px;color:var(--text-3);flex:none}.color-pop{right:0;top:calc(100% + var(--sp-1));z-index:1200;width:max(100%,232px);padding:var(--sp-2);gap:var(--sp-2);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-float);flex-direction:column;display:flex;position:absolute}.color-pop[hidden]{display:none}.color-options{flex-wrap:nowrap;align-items:center;gap:6px;display:flex}.color-swatch{cursor:pointer;width:24px;height:24px;transition:transform var(--t-micro) var(--ease);border:1px solid #0000002e;border-radius:50%;padding:0}.color-swatch:hover{transform:scale(1.1)}.color-swatch.active{outline:2px solid var(--accent);outline-offset:2px}.color-swatch-default{background:linear-gradient(135deg,#3a3a3a 0 45%,#a0a0a0 55% 100%)}.color-name{font-size:var(--fs-2);color:var(--text-1);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ral-input-row{align-items:center;gap:var(--sp-2);padding-top:var(--sp-2);border-top:1px solid var(--line);display:flex}.ral-label{font-size:var(--fs-1);color:var(--text-2);white-space:nowrap}.ral-input-row input{width:84px;height:var(--h-ctrl-sm);padding:0 var(--pad-ctrl-sm);font-size:var(--fs-2);border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface)}.ral-input-row input:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-ring);outline:none}.ral-preview{border:1px solid #0000002e;border-radius:50%;flex-shrink:0;width:16px;height:16px}.ral-name{font-size:var(--fs-1);color:var(--text-2);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.unit-count-input{text-align:center;width:48px;color:var(--text-1);background:var(--surface);border:1px solid var(--accent);z-index:9999;border-radius:6px;outline:none;padding:4px 2px;font-size:12px;font-weight:600;position:fixed;transform:translate(-50%,-50%);box-shadow:0 4px 14px #0000002e}.drawing-box>div{flex:1;min-height:0;overflow:hidden}.pane-acties{z-index:25;border-radius:var(--r-md);opacity:.75;transition:opacity var(--t-std) var(--ease);background:#ffffffd9;align-items:center;gap:2px;padding:2px;display:flex;position:absolute;top:6px;right:6px}.drawing-box:hover .pane-acties,.pane-acties:focus-within{opacity:1}.pane-acties button{appearance:none;cursor:pointer;font:inherit;border-radius:var(--r-sm);min-width:22px;height:22px;color:var(--text-2);transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);background:0 0;border:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.pane-acties button:hover{background:var(--surface-2);color:var(--text-1)}.pane-acties button:active{transform:scale(.94)}.pane-acties svg{flex:none;width:14px;height:14px;display:block}.pane-acties .drawing-walk{font-size:var(--fs-1);white-space:nowrap;padding:0 6px;font-weight:400;line-height:1}.drawing-preview{inset:var(--h-top) 0 0 calc(var(--w-panel) + 1px);z-index:9000;display:none;position:fixed}.drawing-preview.open{display:block}.drawing-preview-backdrop{display:none}.drawing-preview-panel{background:var(--surface);flex-direction:column;display:flex;position:absolute;inset:0}.drawing-preview[data-view=three] .drawing-preview-panel{background:var(--surface-2)}.drawing-preview-content canvas{max-width:100%;max-height:100%;display:block}.drawing-preview-header{top:6px;right:6px;left:var(--sp-3);z-index:2;pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute}.drawing-preview-title{font-size:var(--fs-1);color:var(--text-2);margin:0;font-weight:400}.drawing-preview-close{pointer-events:auto;width:22px;height:22px;color:var(--text-3);border-radius:var(--r-sm);cursor:pointer;transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex}.drawing-preview-close:hover{background:var(--surface-2);color:var(--text-1)}.drawing-preview-close svg{width:14px;height:14px;display:block}.drawing-preview-content{min-height:0;padding:var(--sp-4);flex:1;justify-content:center;align-items:center;display:flex;overflow:hidden}.drawing-preview[data-view=three] .drawing-preview-content{padding:0}.drawing-preview-content svg{width:100%;max-width:100%;height:100%;max-height:100%}.drawing-preview-content img{object-fit:contain;max-width:100%;max-height:100%}.custom-design-overlay{z-index:2000;background:#00000073;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.custom-design-overlay.active{display:flex}.custom-design-modal{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);width:90%;max-width:520px;box-shadow:var(--shadow-float);padding:28px}.custom-design-modal h3{font-size:var(--fs-4);color:var(--text-1);margin:0 0 var(--sp-1);font-weight:600}.custom-design-modal p{font-size:var(--fs-2);color:var(--text-2);margin:0 0 var(--sp-4)}.custom-design-modal .form-group{margin-bottom:var(--sp-3)}.custom-design-modal .form-group input[type=file]{height:auto;padding:6px var(--pad-ctrl-sm);font-size:var(--fs-1);color:var(--text-2)}.custom-design-modal .modal-actions{gap:var(--sp-2);margin-top:var(--sp-4);display:flex}.custom-design-modal .modal-actions button{flex:1}.rack-editor{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-float);padding:var(--sp-3);z-index:9500;min-width:200px;display:none;position:fixed}.rack-editor h4{font-size:var(--fs-2);color:var(--text-1);margin:0 0 var(--sp-2);justify-content:space-between;align-items:center;font-weight:600;display:flex}.rack-editor .close-editor{border-radius:var(--r-sm);width:22px;height:22px;font-size:var(--fs-4);color:var(--text-3);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:inline-flex}.rack-editor .close-editor:hover{background:var(--surface-2);color:var(--text-1)}.rack-editor .form-group{margin-bottom:var(--sp-2)}.rack-editor .form-group:last-child{margin-bottom:0}.canvas-wrapper:has(>.inv-toolbar){padding:0}.inv-toolbar{height:var(--h-top);padding:0 var(--sp-3);background:var(--surface);border-bottom:1px solid var(--line);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.inv-backdrop{background:var(--canvas);padding:var(--sp-4);flex-direction:column;flex:1;align-items:center;display:flex;overflow:auto}.inv-sheet{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);width:210mm;max-width:100%;font-size:var(--fs-2);color:var(--text-1);flex-shrink:0;line-height:1.6}.inv-section{border-top:1px solid var(--line);padding:40px 48px}.inv-section:first-child{border-top:none}.inv-header{justify-content:space-between;align-items:baseline;gap:var(--sp-3);padding-bottom:var(--sp-3);margin-bottom:var(--sp-4);border-bottom:1px solid var(--line);display:flex}.inv-title{font-size:var(--fs-4);margin:0;font-weight:600}.inv-date{font-size:var(--fs-2);color:var(--text-2)}.inv-p{margin:0 0 var(--sp-2)}.inv-p:last-child{margin-bottom:0}.inv-sign{margin-top:var(--sp-4)}.inv-section h2{font-size:var(--fs-4);margin:0 0 var(--sp-3);font-weight:600}.inv-section h3{font-size:var(--fs-3);margin:var(--sp-4) 0 var(--sp-2);font-weight:600}.inv-section h3:first-of-type{margin-top:0}.inv-notice{margin-bottom:var(--sp-4);padding:var(--sp-3) var(--sp-4);background:var(--surface-2);border-radius:var(--r-md)}.inv-notice strong{margin-bottom:var(--sp-1);font-weight:600;display:block}.inv-notice div{color:var(--text-2)}.inv-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.inv-table th{text-align:left;font-size:var(--fs-1);color:var(--text-2);border-bottom:1px solid var(--line-strong);padding:6px 8px;font-weight:400}.inv-table td{border-bottom:1px solid var(--line);vertical-align:top;padding:6px 8px}.inv-table .num{text-align:right}.inv-table .code{white-space:nowrap}.inv-note{margin-top:var(--sp-2);font-size:var(--fs-1);color:var(--text-3)}.inv-drawing{margin:var(--sp-3) 0 0}.inv-drawing figcaption{font-size:var(--fs-1);color:var(--text-2);margin-bottom:var(--sp-1)}.inv-drawing>div{background:var(--surface)}.inv-drawing svg{pointer-events:none;width:100%;max-width:100%;height:auto;display:block}.inv-drawing img{border-radius:var(--r-sm);width:100%;display:block}.lang-dropdown{margin-left:auto;display:inline-flex;position:relative}.lang-toggle{width:var(--h-ctrl);height:var(--h-ctrl);border-radius:var(--r-sm);color:var(--text-3);cursor:pointer;transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.lang-toggle:hover,.lang-toggle.open{background:var(--surface-2);color:var(--text-1)}.lang-toggle-icon{width:16px;height:16px;display:block}.add-dropdown{display:inline-flex;position:relative}.lang-menu,.add-menu{top:calc(100% + var(--sp-1));min-width:160px;padding:var(--sp-1);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-float);z-index:1000;display:none;position:absolute}.lang-menu{right:0}.add-menu{left:0}.lang-menu.open,.add-menu.open{display:block}.lang-menu-opt,.add-menu-opt{width:100%;height:var(--h-ctrl);padding:0 var(--pad-ctrl-sm);text-align:left;border-radius:var(--r-sm);font-size:var(--fs-2);color:var(--text-1);cursor:pointer;transition:background var(--t-micro) var(--ease);background:0 0;border:none;align-items:center;font-weight:400;display:flex}.lang-menu-opt:hover,.add-menu-opt:hover{background:var(--surface-2)}.lang-menu-opt.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.drawings-doors .drawing-box-front{grid-area:1/1/3}.drawings-doors .drawing-box-3d{grid-area:1/2/3}.browser-tab-badge{font-size:var(--fs-1);color:var(--text-2);background:var(--surface-2);border-radius:var(--r-sm);flex-shrink:0;padding:0 5px;font-weight:400;line-height:16px}.browser-tab-dup{border-radius:var(--r-sm);width:18px;height:18px;font-size:var(--fs-2);color:var(--text-3);cursor:pointer;transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);justify-content:center;align-items:center;display:inline-flex}.browser-tab-dup:hover{background:var(--surface-2);color:var(--text-1)}.help-toggle{height:var(--h-ctrl);padding:0 var(--pad-ctrl) 0 6px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--surface);color:var(--text-2);font-size:var(--fs-2);cursor:pointer;margin-left:var(--sp-1);transition:background var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease), color var(--t-micro) var(--ease);flex-shrink:0;align-items:center;gap:6px;font-weight:400;display:inline-flex}.help-toggle-icon{width:16px;height:16px;font-size:var(--fs-1);border:1px solid;border-radius:50%;justify-content:center;align-items:center;font-weight:600;line-height:1;display:inline-flex}.help-toggle-label{line-height:1}.help-toggle:hover{background:var(--surface-2);border-color:var(--line-strong);color:var(--text-1)}.help-toggle.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}.help-overlay{z-index:8000;pointer-events:none;display:none;position:fixed;inset:0}.help-overlay.visible{display:block}.help-spotlight{border:2px solid var(--accent);pointer-events:none;opacity:0;border-radius:10px;transition:left .32s cubic-bezier(.4,0,.2,1),top .32s cubic-bezier(.4,0,.2,1),width .32s cubic-bezier(.4,0,.2,1),height .32s cubic-bezier(.4,0,.2,1),opacity .2s;position:absolute;box-shadow:0 0 0 9999px #00000047,0 0 0 4px #0071e340}.help-overlay.visible .help-spotlight.active{opacity:1}.help-spotlight.collapsed{border:0;box-shadow:0 0 0 9999px #00000047}.help-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);width:264px;padding:var(--sp-4);box-shadow:var(--shadow-float);z-index:2;pointer-events:auto;transition:left .32s cubic-bezier(.4,0,.2,1),top .32s cubic-bezier(.4,0,.2,1);position:absolute}.help-card-step{font-size:var(--fs-1);color:var(--text-3);margin-bottom:var(--sp-1);font-weight:400}.help-card-title{font-size:var(--fs-4);color:var(--text-1);margin-bottom:var(--sp-1);font-weight:600;line-height:1.3}.help-card-text{font-size:var(--fs-2);color:var(--text-1);margin-bottom:var(--sp-4);line-height:1.5}.help-card-text strong{font-weight:600}.help-card-nav{justify-content:flex-end;align-items:center;gap:var(--sp-2);display:flex}.help-card-actions{gap:var(--sp-2);display:flex}.help-card-close{top:var(--sp-2);right:var(--sp-2);border-radius:var(--r-sm);width:22px;height:22px;color:var(--text-3);font-size:var(--fs-4);cursor:pointer;transition:background var(--t-micro) var(--ease), color var(--t-micro) var(--ease);background:0 0;border:none;justify-content:center;align-items:center;padding:0;line-height:1;display:flex;position:absolute}.help-card-close:hover{background:var(--surface-2);color:var(--text-1)}.help-card-back,.help-card-next{height:var(--h-ctrl);padding:0 var(--pad-ctrl);border-radius:var(--r-md);font-size:var(--fs-2);cursor:pointer;transition:background var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease)}.help-card-back{border:1px solid var(--line-strong);background:var(--surface);color:var(--text-1);font-weight:400}.help-card-back:hover{background:var(--surface-2)}.help-card-back[hidden]{display:none}.help-card-next{background:var(--accent);color:var(--surface);border:1px solid #0000;font-weight:600}.help-card-next:hover{background:var(--accent-hover)}.help-card-next[hidden]{display:none}.help-card-dots{margin-top:var(--sp-3);justify-content:center;gap:6px;display:flex}.help-card-dots span{background:var(--line-strong);width:6px;height:6px;transition:width var(--t-std) var(--ease), background var(--t-std) var(--ease);border-radius:50%}.help-card-dots span.active{background:var(--accent);border-radius:3px;width:18px}.help-card.welcome{width:320px;padding:24px}.help-card.welcome .help-card-title{font-size:17px}.help-card.welcome .help-card-text{font-size:var(--fs-3)}.help-card.stepin{animation:.28s cubic-bezier(.4,0,.2,1) help-card-in}@keyframes help-card-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.help-card-ack{font-size:var(--fs-1);color:var(--text-2);margin:calc(-1 * var(--sp-2)) 0 var(--sp-3);font-weight:600;display:none}.help-card.acted .help-card-ack{display:block}.help-card.acted .help-card-next{animation:1.3s ease-in-out infinite help-next-pulse}@keyframes help-next-pulse{0%,to{box-shadow:0 0 #0071e300}50%{box-shadow:0 0 0 5px #0071e340}}.help-clickhint{z-index:1;pointer-events:none;opacity:.8;width:0;height:0;display:none;position:absolute}.help-overlay.visible .help-clickhint.active{display:block}.help-clickhint-dot{background:#0071e3b3;border-radius:50%;width:14px;height:14px;margin:-7px 0 0 -7px;position:absolute;top:0;left:0;box-shadow:0 0 0 3px #ffffff8c}.help-clickhint-ring{border:2px solid #0071e3b3;border-radius:50%;width:14px;height:14px;margin:-7px 0 0 -7px;animation:1.6s ease-out infinite help-click-pulse;position:absolute;top:0;left:0}@keyframes help-click-pulse{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(3.2)}}.help-clickhint.drag{animation:1.8s ease-in-out infinite help-click-drag}@keyframes help-click-drag{0%,to{transform:translate(-22px)}50%{transform:translate(22px)}}.help-marquee{z-index:1;pointer-events:none;opacity:.9;display:none;position:absolute}.help-overlay.visible .help-marquee.active{display:block}.help-marquee-box{border:1.5px dashed var(--accent);background:#0071e31a;border-radius:3px;width:100%;height:0;animation:2.6s ease-in-out infinite help-marquee-sweep;position:absolute;top:0;left:0}.help-marquee-dot{background:#0071e3b3;border-radius:50%;width:12px;height:12px;position:absolute;bottom:-6px;left:-6px;box-shadow:0 0 0 3px #ffffff8c}@keyframes help-marquee-sweep{0%{opacity:0;height:0}12%{opacity:1}55%{height:100%}80%{opacity:1;height:100%}to{opacity:0;height:100%}}.three-hint{background:var(--surface);color:var(--text-1);border:1px solid var(--line);font-size:var(--fs-2);padding:6px var(--sp-3);border-radius:var(--r-md);pointer-events:none;z-index:10;transition:opacity .6s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@media print{.panel-header,.control-panel,.tab-bar,.no-print,.login-screen,.inv-toolbar{display:none!important}.app-container{display:block!important}.canvas-area{overflow:visible}.canvas-wrapper{padding:0;overflow:visible}.inv-backdrop{padding:0;background:0 0!important}.inv-sheet{border:none;border-radius:0;width:100%}.inv-section{page-break-after:always;border-top:none;padding:20px 24px}body{background:#fff}}#walk-overlay{background:var(--surface-2);z-index:9500;display:none;position:fixed;inset:0}#walk-overlay.open{display:block}#walk-canvas{cursor:pointer;width:100%;height:100%;display:block}.walk-title{top:var(--sp-3);left:var(--sp-3);height:var(--h-ctrl);color:var(--text-1);font-size:var(--fs-2);pointer-events:none;padding:0 var(--pad-ctrl);border:1px solid var(--line);border-radius:var(--r-md);-webkit-backdrop-filter:blur(6px);background:#ffffffd9;align-items:center;font-weight:400;display:inline-flex;position:absolute}.walk-close-btn{top:var(--sp-3);right:var(--sp-3);height:var(--h-ctrl);padding:0 var(--pad-ctrl) 0 var(--pad-ctrl-sm);border:1px solid var(--line);color:var(--text-1);border-radius:var(--r-md);font-size:var(--fs-2);cursor:pointer;transition:background var(--t-micro) var(--ease), border-color var(--t-micro) var(--ease);-webkit-backdrop-filter:blur(6px);background:#ffffffd9;align-items:center;gap:5px;font-weight:400;display:inline-flex;position:absolute}.walk-close-btn:hover{background:var(--surface);border-color:var(--line-strong)}.walk-close-btn svg{width:13px;height:13px;display:block}.walk-crosshair{color:#00000059;pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.walk-crosshair svg{width:16px;height:16px;display:block}.walk-hud{bottom:var(--sp-4);color:var(--text-2);font-size:var(--fs-1);pointer-events:none;white-space:nowrap;padding:6px var(--sp-3);border:1px solid var(--line);border-radius:var(--r-md);-webkit-backdrop-filter:blur(6px);background:#ffffffd9;font-weight:400;position:absolute;left:50%;transform:translate(-50%)}.walk-click-hint{color:var(--text-1);font-size:var(--fs-2);padding:6px var(--sp-3);border:1px solid var(--line);border-radius:var(--r-md);pointer-events:none;-webkit-backdrop-filter:blur(6px);background:#ffffffeb;font-weight:400;transition:opacity .2s;position:absolute;top:50%;left:50%;transform:translate(-50%,calc(36px - 50%))}.walk-click-hint.hidden{opacity:0}