:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;line-height:1.5;font-weight:400;color:#21201c;background:#fdfdfc;font-synthesis:none;--canvas:#fdfdfc;--surface:#fff;--well:#f7f7f5;--ink:#21201c;--secondary:#6f6d66;--tertiary:#a6a49d;--accent:#0d0d0d;--edge:0 0 0 1px rgb(0 0 0 / 8%);--raised:inset 0 1px 0 rgb(255 255 255 / 14%),0 0 0 1px rgb(0 0 0 / 8%),0 2px 2px rgb(0 0 0 / 4%);--overlay:0 0 0 1px rgb(0 0 0 / 6%),0 12px 24px -6px rgb(0 0 0 / 12%),0 32px 64px -16px rgb(0 0 0 / 14%);--ease:cubic-bezier(.22,1,.36,1)}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,input,select,summary{transition:background-color .15s var(--ease),color .15s var(--ease),box-shadow .15s var(--ease),opacity .15s var(--ease)}button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:8px 14px;border:0;border-radius:10px;background:var(--surface);color:var(--ink);font-size:14px;line-height:20px;font-weight:500;box-shadow:var(--edge);cursor:pointer}button:hover:not(:disabled){background:var(--well)}button:disabled{opacity:.35;cursor:default}button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button.primary{min-height:40px;background:var(--accent);color:#fff;box-shadow:var(--raised)}button.primary:hover:not(:disabled){background:#292824}button svg{stroke-width:1.6;flex-shrink:0}.app{height:100dvh;display:flex;flex-direction:column}header{height:76px;flex-shrink:0;display:flex;align-items:center;padding:0 28px;gap:24px;background:var(--canvas)}.brand{display:flex;align-items:center;gap:12px;font-size:18px;white-space:nowrap;letter-spacing:-.3px}.brand strong{font-weight:600}.brand svg{color:var(--ink);stroke-width:1.5}.header-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.header-actions button:not(.primary){background:transparent;box-shadow:none}.header-actions button:not(.primary):hover{background:var(--well)}input[hidden]{display:none}main{flex:1;display:grid;grid-template-columns:360px minmax(0,1fr);min-height:0;padding:0 16px 16px 0;gap:8px}aside{overflow:auto;padding:24px 28px 32px;background:var(--canvas);scrollbar-width:thin;scrollbar-color:#d8d7d1 transparent}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}h2{font-size:16px;font-weight:600;line-height:24px;margin:0;letter-spacing:-.08px}.small{min-height:32px;font-size:13px;padding:6px 14px;box-shadow:none;background:transparent}.small:hover:not(:disabled){background:var(--well)}.cable-list{display:grid;gap:4px;margin-inline:-12px}.cable-row{display:flex;align-items:center;min-height:48px;border-radius:10px;background:transparent;transition:background-color .15s var(--ease)}.cable-row:hover{background:var(--well)}.cable-row.selected{background:#eeede9}.cable-row.selected:hover{background:#e8e7e2}.cable-select{flex:1;min-width:0;justify-content:flex-start;text-align:left;gap:12px;min-height:48px;padding:12px;box-shadow:none;background:transparent;border-radius:6px}.cable-select:hover:not(:disabled){background:transparent}.cable-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.measurement{margin-left:auto;color:var(--secondary);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:400}.icon{min-width:32px;min-height:32px;padding:8px;background:transparent;box-shadow:none;color:var(--secondary)}.icon:hover:not(:disabled){background:#e9e8e3;color:var(--ink)}.cable-actions{position:absolute;right:4px;top:8px;display:flex;opacity:0;pointer-events:none;transition:opacity .15s var(--ease)}.cable-row:is(:hover,:focus-within) .cable-actions{opacity:1;pointer-events:auto}.cable-row:is(:hover,:focus-within) .measurement{opacity:0}.drag-handle{position:absolute;left:12px;opacity:0;transform:translate(-6px);color:var(--secondary);transition:transform .15s var(--ease),opacity .15s var(--ease)}.cable-name{transform:translate(0);transition:transform .15s var(--ease);max-width:calc(100% - 100px)}.cable-row:is(:hover,:focus-within) .drag-handle{opacity:1;transform:translate(0)}.cable-row:is(:hover,:focus-within) .cable-name{transform:translate(24px);max-width:calc(100% - 124px)}.measurement{transition:opacity .15s var(--ease)}.cable-editor{margin-top:48px}.cable-details-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px}label{display:block;margin:0 0 20px;font-size:14px;font-weight:500;color:var(--secondary)}label>input{margin-top:8px}input,select{min-height:36px;width:100%;border:0;border-radius:10px;padding:8px 12px;font-size:14px;line-height:20px;background:var(--surface);color:var(--ink);box-shadow:var(--edge);outline:none}input:focus-visible,select:focus-visible{box-shadow:0 0 0 1px var(--accent),0 0 0 4px #0d0d0d1a}input::placeholder{color:var(--tertiary)}input[type=number]{font-variant-numeric:tabular-nums}select{appearance:none;-webkit-appearance:none;padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236F6D66' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px}select:hover{background-color:var(--well)}.property{display:flex;align-items:center;justify-content:space-between;gap:16px}.property select{width:144px;flex-shrink:0}.unit-input{display:flex;align-items:center;min-height:36px;background:var(--surface);box-shadow:var(--edge);border-radius:10px}.unit-input:focus-within{box-shadow:0 0 0 1px var(--accent),0 0 0 4px #0d0d0d1a}.unit-input input{box-shadow:none!important;min-width:0;background:transparent}.unit-input span{padding-right:12px;font-size:13px;font-weight:400;color:var(--tertiary)}.property .unit-input{width:112px;flex-shrink:0}.label-row{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:12px}.label-row label{margin:0}.text-button{min-height:32px;background:transparent;box-shadow:none;padding:6px 0;font-size:13px;color:var(--secondary)}.text-button:hover:not(:disabled){background:transparent;color:var(--ink)}.presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 0 24px;padding:4px;background:var(--well);border-radius:14px}.presets button{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;min-height:52px;padding:6px 8px;background:transparent;box-shadow:none;border-radius:10px}.presets button:hover:not(:disabled){background:#efeee9}.presets strong{font-weight:500;font-size:14px}.presets span{font-size:12px;font-weight:400;color:var(--secondary);font-variant-numeric:tabular-nums}.settings{margin-top:48px}.settings h2{margin-bottom:24px}.muted{font-size:13px;line-height:1.5;color:var(--secondary);font-weight:400;margin:4px 0 0}details{margin-top:32px}summary{display:flex;align-items:center;gap:8px;min-height:36px;font-size:14px;font-weight:500;color:var(--secondary);cursor:pointer;list-style:none;border-radius:10px}summary::-webkit-details-marker{display:none}summary:hover{color:var(--ink)}summary:after{content:"+";margin-left:auto;padding-right:4px}details[open]>summary:after{content:"−"}details[open]>summary{margin-bottom:20px}.local-status{margin-top:48px;font-size:13px;color:var(--tertiary)}.workspace{position:relative;min-width:0;overflow:hidden;border-radius:16px;background:var(--well)}.viewer{position:absolute;inset:0;touch-action:none}.viewer canvas{display:block;outline:none}.view-toolbar{position:absolute;z-index:2;top:24px;left:24px;right:24px;display:flex;align-items:center;justify-content:space-between;gap:16px}.view-tabs{display:flex;gap:0;background:#eeede8;border-radius:14px;padding:4px}.view-tabs button{position:relative;z-index:1;min-height:32px;padding:6px 14px;background:transparent;border-radius:10px;box-shadow:none;color:var(--secondary)}.view-tabs button:hover:not(:disabled){background:#e7e6e0}.view-tabs button.active{background:var(--surface);color:var(--ink);box-shadow:var(--raised)}.view-tabs button.active:hover:not(:disabled){background:var(--surface)}.preview-tools{display:flex;align-items:center;gap:16px}.icon-button{min-width:36px;min-height:36px;height:36px;padding:8px;box-shadow:var(--raised)}.workspace-bottom{position:absolute;bottom:24px;left:24px;right:24px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px;pointer-events:none}.dimension-readout{display:flex;flex-direction:column;gap:4px;background:#f7f7f5e5;border-radius:10px;padding:8px 0}.dimension-readout strong{font-size:16px;font-weight:500;font-variant-numeric:tabular-nums}.dimension-readout small{font-size:13px;font-weight:400;color:var(--secondary)}.dimension-readout span{font-size:13px;color:var(--secondary)}.empty{text-align:center;padding:24px 0;color:var(--secondary)}.empty p{font-size:14px}.workspace-empty,.model-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;color:var(--secondary);background:var(--well);padding:24px;text-align:center}.model-error{z-index:3}.preset-dialog{border:0;border-radius:14px;width:min(400px,calc(100vw - 32px));padding:24px;background:var(--surface);color:var(--ink);box-shadow:var(--overlay)}.preset-dialog[open]{animation:overlay-enter .25s var(--ease)}.preset-dialog::backdrop{background:#fdfdfc8c;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between}.preset-dialog p{font-size:14px;line-height:1.5;color:var(--secondary);margin:16px 0 24px}.preset-dialog .primary{width:100%;margin-top:8px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);max-width:90vw;z-index:20;display:flex;align-items:center;gap:12px;padding:16px 20px;border-radius:14px;background:var(--surface);color:var(--ink);box-shadow:var(--overlay);font-size:14px;animation:toast-enter .25s var(--ease)}.toast svg{flex-shrink:0;color:var(--secondary)}@keyframes overlay-enter{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@keyframes toast-enter{0%{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}@media(max-width:1100px){main{grid-template-columns:332px minmax(0,1fr)}aside{padding:24px}.view-toolbar{left:20px;right:20px}.preview-tools{gap:12px}.view-tabs button{padding:6px 12px}}@media(max-width:780px){.app{height:auto;min-height:100dvh}header{position:sticky;top:0;z-index:5;height:68px;padding:0 20px;gap:16px}.brand{font-size:16px;gap:8px}.header-actions{gap:8px}.header-actions button:not(.primary){padding:8px}.header-actions button:not(.primary) span{display:none}main{display:flex;flex-direction:column-reverse;padding:0 12px 12px;gap:0}.workspace{height:380px;flex:none}.view-toolbar{top:20px}.viewer{inset:12px 0 20px}aside{overflow:visible;padding:28px 16px}.workspace-bottom{bottom:16px;left:20px;right:20px}}@media(max-width:450px){header{padding:0 16px}.brand svg{width:20px}.header-actions{gap:4px}.header-actions .primary{padding:8px 12px}.header-actions .primary svg{display:none}.header-actions button:not(.primary){padding:8px;min-width:32px}.view-toolbar{left:16px;right:16px;gap:8px}.view-tabs button{padding:6px 10px}.preview-tools{gap:8px}.icon-button{display:none}.workspace{height:340px}.dimension-readout strong{font-size:14px}.brand{font-size:15px}.cable-editor,.settings{margin-top:48px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.view-tabs{position:relative;--segment-width:64px}.view-tabs button{width:var(--segment-width)}.view-indicator{position:absolute;left:4px;top:4px;width:var(--segment-width);height:32px;border-radius:10px;background:var(--surface);box-shadow:var(--raised);transform:translate(calc(var(--selected-index)*100%));transition:transform .25s var(--ease)}.view-tabs button.active,.view-tabs button.active:hover:not(:disabled){background:transparent;box-shadow:none}.presets button{transition:background-color .15s var(--ease),box-shadow .15s var(--ease)}.presets button.active{background:var(--surface);box-shadow:var(--edge)}.presets button.active:hover:not(:disabled){background:var(--surface)}@media(max-width:450px){.view-tabs{--segment-width:54px}}@media(prefers-reduced-motion:reduce){.view-indicator{transition:none}}.fit-controls{margin-top:32px}.fit-preset-action{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.fit-preset-action h3{margin:0;color:var(--secondary);font-size:16px;font-weight:600;line-height:24px;letter-spacing:-.08px}.fit-readout{display:flex;justify-content:space-between;gap:12px;margin:-12px 0 24px;color:var(--secondary);font-size:13px}.fit-readout span{font-variant-numeric:tabular-nums;white-space:nowrap}.fit-controls .muted{margin-top:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.cable-row{position:relative}.cable-select{touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab}.cable-select:active{cursor:grabbing}.cable-row.dragging{z-index:3;background:var(--surface);box-shadow:var(--raised);opacity:.9;pointer-events:none}.cable-row.drop-before:before,.cable-row.drop-after:after{content:"";position:absolute;left:12px;right:12px;height:2px;border-radius:999px;background:var(--accent);pointer-events:none}.cable-row.drop-before:before{top:-3px}.cable-row.drop-after:after{bottom:-3px}.is-dragging{cursor:grabbing}.is-dragging .cable-actions{visibility:hidden}.cable-select:focus-visible{outline-offset:-2px}.section-heading>.small{gap:4px;margin-right:-14px}.help-property{position:relative;margin-bottom:20px;font-size:14px}.property-label{display:flex;align-items:center;gap:4px;min-width:0}.property-label>label{margin:0}.field-help{display:inline-flex;align-items:center}.help-trigger{min-height:28px;min-width:24px;padding:4px;box-shadow:none;background:transparent;color:var(--secondary)}.help-trigger:hover:not(:disabled){background:var(--well);color:var(--ink)}.field-tooltip{position:absolute;z-index:10;left:0;bottom:calc(100% + 8px);width:min(280px,calc(100vw - 56px));padding:16px;border-radius:14px;background:var(--surface);color:var(--ink);box-shadow:var(--overlay);font-size:14px;line-height:1.5;font-weight:400;animation:overlay-enter .15s var(--ease)}.field-tooltip:after{content:"";position:absolute;inset:100% 0 auto;height:12px}.visibility-toggle{min-height:36px;height:36px;padding:8px 14px;gap:6px;white-space:nowrap;box-shadow:var(--raised);background:var(--surface);color:var(--secondary)}.visibility-toggle:hover:not(:disabled){background:var(--well);color:var(--ink)}.visibility-toggle[aria-pressed=true]{background:var(--accent);color:var(--surface)}.visibility-toggle[aria-pressed=true]:hover:not(:disabled){background:#292824;color:var(--surface)}.precise-step input{appearance:textfield;-moz-appearance:textfield;padding:8px 2px 8px 8px}.precise-step>span{padding-right:8px}.precise-step input::-webkit-inner-spin-button,.precise-step input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.number-steppers{display:flex;flex-direction:column;flex:none;margin-right:4px;opacity:0;transition:opacity .15s var(--ease)}.precise-step:hover .number-steppers,.precise-step:focus-within .number-steppers{opacity:1}.number-steppers button{min-height:14px;height:14px;width:16px;padding:0;border-radius:4px;box-shadow:none;background:transparent;color:var(--secondary)}@media(hover:none){.cable-row.selected .cable-actions{opacity:1;pointer-events:auto}.cable-row.selected .drag-handle{opacity:1;transform:translate(0)}.cable-row.selected .cable-name{transform:translate(24px);max-width:calc(100% - 124px)}.cable-row.selected .measurement{opacity:0}.number-steppers{opacity:1}}
