/* STAIR LAB — a quiet drafting workspace */
:root{color-scheme:light;--bg:#eef1ed;--panel:#fff;--panel2:#f4f6f3;--line:#dce3dc;--text:#243b36;--muted:#687c73;--accent:#296c57;--good:#287450;--warn:#996021;--bad:#b34442;--wall:#687970;--level:#ba7771;--guide:#aeb8af;--finish:#357f76;--struct:#a78a54;--clear:#769044;--dim:#809087;--cad:#526b62;--paper:#fcfdf9;--shadow:0 6px 24px #263e3406;--radius:16px}
body{font-family:'Segoe UI','Malgun Gothic',sans-serif;background:var(--bg);color:var(--text);font-size:13px;line-height:1.5;margin:0}
button,input,select,summary{font:inherit}button{cursor:pointer;transition:background .15s,border-color .15s}button:disabled{cursor:not-allowed;opacity:.42}button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8dbfa8;outline-offset:3px}button svg{width:18px;height:18px;flex:none}input,select{background:var(--panel2);color:var(--text);border:1px solid var(--line);border-radius:8px;min-height:38px;padding:8px 10px;font-size:13px;font-variant-numeric:tabular-nums}input[type=checkbox]{accent-color:var(--accent);min-height:0}input[aria-invalid=true]{background:#fff0ec;border-color:var(--bad)}input:hover,select:hover{border-color:#a3b6aa}input:focus,select:focus{border-color:var(--accent)}label{color:var(--text);font-size:12px}
.app{max-width:1920px;padding:0 28px 28px;margin:auto}.top{height:88px;margin:0;gap:24px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}.brandMark{width:42px;height:42px;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:9px;color:var(--accent)}.brandMark svg{width:100%;height:100%}h1{font-size:17px;letter-spacing:.16em;font-weight:800}.sub{font-size:11px;margin-top:3px;color:var(--muted);letter-spacing:.01em}.topRight{display:flex;align-items:center;gap:24px}.modeSwitch{display:flex;gap:4px;margin:0;border:0;background:transparent;align-items:center}.modeSwitch button,#nodeModeBtn{background:transparent;color:var(--muted);border:0;border-radius:7px;padding:9px 12px;font-size:12px;font-weight:600;box-shadow:none;min-width:0;transform:none;text-shadow:none}.modeSwitch button.active,#nodeModeBtn.active{background:#dce8df;color:var(--accent);box-shadow:none;border:0}#nodeModeBtn:hover{background:var(--panel2);color:var(--text);box-shadow:none;transform:none}#nodeModeBtn::before,#nodeModeBtn::after{display:none}.nodeModeInfo{display:none}.badge,.algoStatus{display:none}
.workspaceIntro{display:flex;justify-content:space-between;align-items:flex-end;padding:24px 0 20px;gap:16px}.workspaceIntro h2{font-size:25px;line-height:1.25;letter-spacing:-1px;margin:0 0 5px;font-weight:650}.workspaceIntro p{margin:0;color:var(--muted);font-size:12px}.workspaceTag{color:var(--muted);font-size:11px;border:1px solid var(--line);border-radius:20px;padding:6px 10px;white-space:nowrap}.workspaceTag::before{content:'';display:inline-block;width:6px;height:6px;background:var(--accent);border-radius:50%;margin-right:7px}
.grid{grid-template-columns:350px minmax(0,1fr);gap:20px;align-items:start}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.left{padding:0;position:sticky;top:18px;overflow:hidden;display:flex;flex-direction:column;max-height:calc(100vh - 36px)}.inspectorHead{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 12px}.inspectorHead h2{margin:0;font-size:14px}.unitTag{font-size:10px;color:var(--muted);letter-spacing:.06em}.inspectorTabs{display:flex;margin:0 18px 4px;border-bottom:1px solid var(--line);gap:14px}.inspectorTabs button{background:none;border:0;border-bottom:2px solid transparent;color:var(--muted);padding:10px 2px;font-size:12px;border-radius:0}.inspectorTabs button[aria-selected=true]{color:var(--accent);border-color:var(--accent);font-weight:750}.inspectorBody{padding:0 20px 18px;overflow:auto;min-height:120px;scrollbar-width:thin;scrollbar-color:#c6d2c7 transparent}.inspectorPane[hidden]{display:none}.inspectorPane .sec{margin:0;padding:20px 0 0;border:0}.inspectorPane .sec+.sec{border-top:1px solid var(--line);margin-top:20px}.st{font-size:12px;letter-spacing:.01em;font-weight:750;margin-bottom:12px}.st::before{content:'';display:inline-block;height:11px;width:3px;border-radius:2px;background:var(--accent);margin-right:8px;vertical-align:-1px}.row{grid-template-columns:minmax(0,1fr) 122px;gap:12px;margin:12px 0}.riserrow{grid-template-columns:minmax(0,1fr) 154px;gap:8px;margin:12px 0}.range{grid-template-columns:68px 10px 68px;gap:4px}.range input{width:68px}.range span{color:var(--muted)}.inputSuffix{width:122px}.inputSuffix .suffix{color:var(--muted)}.hint{font-size:11px;color:var(--muted);line-height:1.7}.checkboxOnly{padding:10px;margin-bottom:14px;background:var(--panel2);border-color:var(--line);gap:8px;flex-wrap:wrap}.checkboxOnly .mainLabel{font-size:11px;color:var(--text)}.checkboxOnly .fixedNote{font-size:9px;color:var(--muted)}.infoTip{color:var(--muted);border-color:#a3b5aa}.infoTip .tipText{background:var(--text);color:#fff;border:0;width:215px;left:-20px;top:25px;transform:none;z-index:30;font-size:11px}
.inspectorFooter{flex-shrink:0;background:var(--panel);padding:16px 20px 14px;border-top:1px solid var(--line)}.review{position:static;margin:0;padding:12px;border-radius:9px;background:var(--accent);color:#fff;font-size:13px;font-weight:650;box-shadow:none;letter-spacing:.01em}.review:hover:not(:disabled){filter:brightness(1.08)}.dirty{font-size:11px;line-height:1.65;margin-top:10px;min-height:36px;color:var(--muted)}.reset{font-size:11px;border:0;background:transparent;color:var(--muted);margin:4px 0 0;padding:6px}#cancelReview{background:var(--panel2);border:1px solid var(--line);margin-top:8px;color:var(--bad)}
.floorAdd{height:36px;margin:0 0 8px;border-color:#bdcfc1;font-size:11px;color:var(--accent)}.lvCard{border-color:var(--line);background:var(--panel2);border-radius:10px}.lv{grid-template-columns:34px 1fr auto 20px;padding:10px;gap:6px}.lvn{background:#e2ebe3;color:var(--accent);min-height:32px;font-size:11px;border-radius:6px}.doorGroup{gap:4px}.doorChoice span{min-width:43px;height:30px;padding:0 7px;font-size:10px;border-color:var(--line);background:var(--panel);color:var(--muted);border-radius:6px}.doorChoice input:checked+span{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:none}.floorDelete{width:20px;height:24px;color:var(--muted)}.floorDelete:hover{background:#f5e4de;color:var(--bad)}.hrow{grid-template-columns:34px 1fr;padding:0 10px 10px;gap:6px}.hrow span{font-size:10px}.hrow input{padding:6px 9px;min-height:32px;background:var(--panel)}
.guardrailCompact{grid-template-columns:16px 34px minmax(60px,1fr);gap:10px;background:var(--panel2);border-color:var(--line);padding:12px}.guardrailCompact span{color:var(--text);font-size:11px}.guardrailCompact input[type=number]{width:100%;font-size:12px}.guardrailCompact>span:nth-of-type(2){grid-column:1/3}.guardrailCompact select{grid-column:3;height:36px;font-size:11px;background:var(--panel);padding:4px 6px}.guardrailExpand{grid-column:1/-1;height:32px;background:var(--panel);color:var(--accent);border-color:var(--line);font-size:11px}.guardrailDesigner{padding:12px 0 0;border:0;border-top:1px solid var(--line);background:transparent}.guardrailDesigner .gdTitle{color:var(--text);font-size:11px;flex-wrap:wrap}.gdTitleLeft{flex-wrap:wrap}.guardrailDesigner .gdHint{font-size:9px;color:var(--muted)}.gdMiniBtn{background:var(--panel2);border-color:var(--line);color:var(--text);font-size:10px;height:28px}.guardrailDesigner .gdGrid{grid-template-columns:1fr;gap:8px}.gdField{grid-template-columns:1fr 100px}.guardrailDesigner label{font-size:11px;color:var(--muted)}.guardrailDesigner input,.guardrailDesigner select{font-size:12px;color:var(--text);background:var(--panel2);border-color:var(--line);padding:7px}
.work{display:flex;flex-direction:column;gap:16px;min-width:0}.metrics{display:grid;grid-template-columns:1.25fr repeat(4,1fr);padding:0;gap:0;overflow:hidden}.metric{padding:16px 18px;border:0;border-left:1px solid var(--line);border-radius:0;background:transparent;min-width:0}.metric:last-child{order:-1;border-left:0}.metric span{font-size:10px;margin-bottom:7px;white-space:nowrap;color:var(--muted)}.metric strong{font-size:17px;letter-spacing:-.4px;font-weight:650;white-space:nowrap}.metric small{display:none}.metric br{display:none}.main{display:flex;flex-direction:column;gap:16px;min-height:0}.preview{padding:0;overflow:hidden}.head{margin:0}.preview>.head{padding:16px 20px 10px;display:flex;gap:12px;flex-wrap:wrap}.viewTabs{background:var(--panel2);padding:3px;border-radius:8px;gap:3px}.viewTabs button{font-size:12px;padding:7px 16px;color:var(--muted);background:transparent;border:0;border-radius:6px}.viewTabs button.active{background:var(--panel);color:var(--accent);box-shadow:0 1px 4px #263e3410;font-weight:700}.exportButton{margin-left:auto;color:var(--text);background:var(--panel);border:1px solid var(--line);padding:8px 12px;border-radius:8px;font-size:11px}.exportButton:hover{background:var(--panel2)}.drawingTitle{font-size:11px;color:var(--muted);margin-right:auto;letter-spacing:.02em}.stagePanel{padding:0 20px 12px;margin:0;gap:6px}.stagePanel button,.stagePanel select{font-size:10px;background:transparent;border-color:var(--line);color:var(--muted);padding:6px 9px;border-radius:6px}.stagePanel button.active{color:var(--accent);background:var(--panel2);border-color:#a9bcae}.stagePanel select{width:auto;max-width:190px;min-height:28px}.canvasWrap{height:clamp(440px,66vh,880px);border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background-color:var(--paper);background-image:radial-gradient(#b8c6ba65 .7px,transparent .7px);background-size:20px 20px;touch-action:none}.canvasWrap>#svg{position:relative;z-index:1}.canvasFlip,.zoom button,.planFloor{border-color:var(--line);background:var(--panel);color:var(--muted);box-shadow:0 2px 5px #243b3608}.canvasFlip{top:16px;left:16px;padding:7px 10px;font-size:10px}.zoom{top:auto;bottom:16px;right:16px;gap:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 2px 8px #243b360a}.zoom button{border:0;border-right:1px solid var(--line);border-radius:0;width:34px;height:32px;font-weight:500;font-size:17px}.zoom button:last-child{border:0;font-size:10px}.planFloor{top:16px;left:16px;width:125px;min-height:32px;font-size:11px}.drawingFooter{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 20px;color:var(--muted);font-size:10px}.legend{font-size:10px;gap:14px}.legend i{width:12px;height:3px;border-radius:2px}.stageInfo{margin:0 20px 12px;background:var(--panel2);border-color:var(--line);color:var(--text);font:11px/1.6 inherit}.stageInfo span{color:var(--warn)!important}
.emptyPreview{inset:72px 28px;z-index:2;flex-direction:column;gap:12px;font-size:13px;line-height:1.7;color:var(--muted)}.emptyPreview::before{content:'';display:block;width:126px;height:100px;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 120' fill='none'%3E%3Cpath d='M18 100H142' stroke='%23b9cbbd' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M32 100V80H54V60H76V40H98V20H123V100Z' fill='%23dfebe0' stroke='%235c856d' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M43 68L111 8M43 67V51M111 9V1' stroke='%235c856d' stroke-width='2.5' stroke-linecap='round'/%3E%3Cpath d='M128 29L134 25M137 39H146M128 51L136 54' stroke='%23c0a16a' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");opacity:.85}.emptyPreview[hidden]{display:none}
.results{padding:20px}.results>.head{margin-bottom:16px}.head h2{font-size:13px}.results #cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:10px}.card{padding:14px;margin:0;border:1px solid var(--line);background:var(--panel2);border-radius:10px}.card.best{border-color:var(--line);box-shadow:none}.ct{font-size:12px}.status{font-size:10px}.info{font-size:11px;line-height:1.8}.neutral{color:var(--muted)}.good{color:var(--good)}.warn{color:var(--warn)}.rules{margin-top:16px;padding-top:14px;border-color:var(--line)}.rules summary{cursor:pointer;font-size:12px;font-weight:650;color:var(--muted);padding:3px 0;list-style:none;display:flex;justify-content:space-between}.rules summary::after{content:'＋';font-size:16px}.rules[open] summary::after{content:'−'}.rules #checks{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin-top:12px}.check{padding:9px 0;border-bottom:1px solid var(--line);font-size:11px}.altToggle{background:var(--panel2);border-color:var(--line);color:var(--accent);font-size:11px}.alt{background:var(--panel2);border-color:var(--line);padding:12px}.alt:hover{border-color:var(--accent)}.alt:focus-visible{outline:2px solid var(--accent)}
#nodeModePanel,#railNodeModePanel{grid-column:1/-1;background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}.algoIntro,.railStudioIntro{background:var(--panel);color:var(--text);border-color:var(--line)}.algoIntro strong,.railStudioIntro strong{color:var(--text)}.algoIntro span,.railStudioIntro span,.nodeHelp,.railStudioStatus{color:var(--muted)}.algoManager,.nodePalette,.railStudioPalette{background:var(--panel2);border-color:var(--line)}.algoManager button,.nodePalette button,.railStudioPalette button,.railStudioBack,.railStudioApply{background:var(--panel);color:var(--text);border-color:var(--line)}.nodeGroupTitle{color:var(--muted)}.nodeStage,.railGraphStage{background-color:var(--paper);background-image:radial-gradient(#bdcbbf 1px,transparent 1px)}.nodeCard,.railGraphCard{background:var(--panel);border-color:#acbbb0;box-shadow:0 4px 12px #1f493b12;color:var(--text)}.nodeHead,.railGraphHead{background:var(--panel2);color:var(--text);border-color:var(--line)}.nodeBody,.railGraphBody,.railGraphValue{background:var(--panel);color:var(--text)}.nodeRename,.nodeOption input,.nodeOption select,.railGraphDescription input,.railGraphValue input,.railGraphValue select{background:var(--panel2);color:var(--text);border-color:var(--line)}.nodeOption span,.nodeStat span,.nodeStat b,.railPortLabel,.railGraphTypeTitle{color:var(--text)}.railGraphDescription,.railGraphNote,.railPortType{color:var(--muted)}.nodeWire{stroke:#729d89}.nodeCanvasHud,.railGraphHud{background:var(--panel);border-color:var(--line);color:var(--text)}.nodeCanvasHud button,.railGraphHud button{color:var(--text);background:var(--panel2);border-color:var(--line)}
/* View-only ink palette. Model coordinates and DXF data are untouched. */
#svg text{fill:var(--cad);font-family:'Segoe UI','Malgun Gothic',sans-serif}#svg [stroke]{stroke-linecap:round;stroke-linejoin:round}
#svg [stroke="#e2d500"],#svg [stroke="#d5cf00"]{stroke:var(--struct)}#svg [stroke="#00dce8"],#svg [stroke="#00ffff"]{stroke:var(--finish)}#svg [stroke="#0099cc"]{stroke:#8da8a1}#svg [stroke="#ee2424"]{stroke:var(--level)}#svg [stroke="#777d86"]{stroke:var(--guide)}#svg [stroke="#d9dee5"],#svg [stroke="#ddd"],#svg [stroke="#ffffff"],#svg [stroke="#fff"],#svg [stroke="#e7eaf0"]{stroke:var(--dim)}#svg [stroke="#58ff42"],#svg [stroke="#00e52d"]{stroke:var(--clear)}
:root{--bg:#f1e9d9;--panel:#fffdf5;--panel2:#f5eedf;--line:#ded2b9;--text:#57493e;--muted:#8a7763;--accent:#9b6148;--good:#577647;--warn:#9a6d25;--bad:#b64f43;--paper:#fffcf1;--finish:#638f87;--struct:#b39263;--level:#be8177;--guide:#c8bba4;--dim:#9e8c76;--cad:#786653;--clear:#8c9c5d;--radius:19px 15px 21px 14px;--shadow:3px 4px 0 #d4c7ab38}
:root .panel{border:1.5px solid #c9b99d}:root .brandMark{border:1.5px solid #b7a286;border-radius:12px 9px 14px 10px;background:#f4dfb5;transform:rotate(-4deg);color:#87664d}:root h1{letter-spacing:.13em}:root .workspaceIntro h2{font-family:'Segoe Print','Comic Sans MS','Malgun Gothic',cursive;font-weight:600}:root .workspaceTag{border-style:dashed;background:#f8edca}:root .canvasWrap{background-image:linear-gradient(#c7bca92b 1px,transparent 1px),linear-gradient(90deg,#c7bca92b 1px,transparent 1px);background-size:24px 24px}:root .canvasWrap::after{content:'a little step forward';position:absolute;right:22px;top:18px;font-family:'Segoe Print','Comic Sans MS',cursive;font-size:12px;transform:rotate(-4deg);color:#b59a76;pointer-events:none;z-index:0}:root #svg text{font-family:'Segoe Print','Comic Sans MS','Malgun Gothic',cursive}:root #svg{filter:drop-shadow(.45px .6px .2px #8d715b25)}:root .review{border-radius:10px 7px 12px 8px;box-shadow:2px 3px 0 #c5af90}:root .viewTabs button.active{background:#fff9e8}:root .card{border-radius:11px 8px 13px 9px;border-style:dashed}:root .lvn{background:#ecdfbf;color:#856344}:root .modeSwitch button.active,:root #nodeModeBtn.active{background:#e9dbc1}:root .emptyPreview::before{transform:rotate(-4deg)}:root .inspectorTabs button[aria-selected=true]{border-bottom-style:dashed}:root input,:root select{border-radius:7px 9px 6px 8px}
@media(min-width:1600px){.grid{grid-template-columns:370px minmax(0,1fr)}.app{padding-left:40px;padding-right:40px}.row{grid-template-columns:1fr 140px}.inputSuffix{width:140px}}
@media(max-width:1180px){.grid{grid-template-columns:320px minmax(0,1fr);gap:16px}.app{padding:0 18px 20px}.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.metric:nth-child(3),.metric:nth-child(4){border-top:1px solid var(--line)}.metric{padding:12px 14px}.metric strong{font-size:15px}.row{grid-template-columns:1fr 114px}.inputSuffix{width:114px}.inspectorBody{padding-left:16px;padding-right:16px}.topRight{gap:12px}.drawingTitle{display:none}.rules #checks{grid-template-columns:1fr}}
@media(max-width:850px){.app{padding:0 14px 18px}.top{height:auto;min-height:82px;padding:15px 0;flex-wrap:wrap;gap:12px}.topRight{flex:1;justify-content:flex-end;gap:8px}.modeSwitch button,#nodeModeBtn{font-size:11px;padding:7px}.workspaceIntro{padding:20px 0 16px}.workspaceIntro h2{font-size:22px}.workspaceTag{display:none}.grid{grid-template-columns:1fr}.left{position:static;max-height:none}.inspectorBody{max-height:430px}.inspectorFooter{display:grid;grid-template-columns:1fr auto;gap:4px 12px}.review{grid-column:1/-1}.dirty{margin:6px 0;min-height:0}.reset{width:auto}#cancelReview{grid-column:1/-1}.metrics{grid-template-columns:repeat(3,1fr)}.canvasWrap{height:65vh;min-height:400px;max-height:800px}.preview>.head{padding:12px}.stagePanel{padding:0 12px 10px}.drawingFooter{padding:10px 12px}.results{padding:16px}}
@media(max-width:460px){.brandMark{width:34px;height:34px;padding:7px}.brand h1{font-size:14px}.brand .sub{font-size:10px}.topRight{justify-content:space-between;width:100%}.workspaceIntro p{font-size:11px}.metric{padding:12px 10px}.metric span{font-size:9px}.metric strong{font-size:13px}.viewTabs button{padding:7px 11px}.exportButton{font-size:10px;padding:8px}.drawingFooter .navigationHint{display:none}.results #cards{grid-template-columns:1fr}.stagePanel select{max-width:160px}.canvasWrap::after{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

.infoTip:focus .tipText{visibility:visible;opacity:1}
[hidden]{display:none!important}