@font-face{font-family:Overpass;src:url(assets/overpass.woff2) format('woff2');font-display:swap}*{box-sizing:border-box} :root{--pink:#ff0040;--bg:#17181b;--surface:#202125;--line:#34353c;--text:#f4f4f6;--muted:#9699a4;--amber:#ffbf56}body{margin:0;background:var(--bg);color:var(--text);font:13px Overpass,Arial,sans-serif}button,input,select{font:inherit}button{height:35px;border:1px solid #3c3e47;border-radius:5px;background:#2b2c32;color:var(--text);padding:0 12px;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s}button:hover{background:#3a3c45;border-color:#646774}button:disabled{opacity:.35;cursor:default}.primary{background:var(--pink);border-color:var(--pink);color:white}.primary:hover{background:#e6003a;border-color:#e6003a}.quiet,.subtle{background:transparent}.danger{color:#ff6687}.wide{width:100%;margin-top:10px}.text-btn{border:0;background:none;height:auto;padding:0;color:#b7b8c0;font-size:11px}svg.icon{width:16px;height:16px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}header{height:81px;display:flex;align-items:center;gap:12px;padding:0 25px;border-bottom:1px solid var(--line)}.brand{width:121px;height:51px;display:block}.brand img{width:100%;height:100%;object-fit:contain}.header-divider{height:30px;width:1px;background:var(--line);margin:0 10px}.app-name{font-size:13px;font-weight:bold;letter-spacing:2px}.version{color:#777b87;font-size:10px;letter-spacing:1px}.project-name{margin:auto;display:flex;align-items:center;gap:8px}.project-name input{border:0;background:none;width:150px;font-size:13px;color:white;padding:4px}.project-name #saveState{color:var(--muted);font-size:10px}.status-dot,.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#75c8a0}.workspace-heading{height:110px;padding:25px 28px;display:flex;align-items:center;justify-content:space-between}.eyebrow{font-size:9px;letter-spacing:2px;color:#9396a0;margin-bottom:9px}h1{font-size:27px;line-height:1.2;letter-spacing:-.8px;margin:0;font-weight:400}.heading-note{color:var(--muted);font-size:12px;display:flex;align-items:center;gap:9px}.heading-note .live-dot{background:var(--pink)}main{display:grid;grid-template-columns:258px minmax(360px,1fr) 274px;margin:0 20px;min-height:620px;height:calc(100dvh - 237px);max-height:1100px;border:1px solid var(--line);border-radius:7px;overflow:hidden}.left,.right{background:var(--surface);overflow:auto;scrollbar-width:thin;scrollbar-color:#464851 transparent}.left{border-right:1px solid var(--line)}.right{border-left:1px solid var(--line);display:flex;flex-direction:column}.section-title{height:54px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 18px;font-size:14px}.tag{font-size:9px;color:#b3b5c0;border:1px solid #42444d;border-radius:3px;padding:2px 5px;letter-spacing:1px}details{padding:17px;border-bottom:1px solid var(--line)}summary{font-size:12px;cursor:pointer;margin-bottom:15px;list-style:none;display:flex;align-items:center;gap:8px}summary:before{content:'⌄';color:#9295a0;font-size:13px}details:not([open]) summary{margin:0}details:not([open]) summary:before{content:'›'}summary .tag{margin-left:auto}label{font-size:10px;color:#a9abb5;display:block}input:not([type=checkbox]),select{width:100%;border:1px solid #41434d;background:#292a30;border-radius:4px;color:#eeeef3;height:34px;padding:6px 9px;outline:none;min-width:0}input:focus,select:focus{border-color:var(--pink)!important}input[type=number]{appearance:textfield;-moz-appearance:textfield}input::-webkit-inner-spin-button{appearance:none}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 9px}.field-grid input,.field-grid .unit-input{margin-top:6px}.unit-input{position:relative}.unit-input input{padding-right:32px}.unit-input>span{position:absolute;right:9px;top:10px;color:#8d909a;font-size:10px}.inline-field{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:13px}.inline-field>div,.inline-field>input{width:90px}.inline-field select{width:139px}.toggle-row{display:flex;align-items:center;justify-content:space-between;margin-top:15px}input[type=checkbox]{appearance:none;width:27px;height:15px;background:#51535e;border-radius:20px;position:relative;cursor:pointer;margin:0}input[type=checkbox]:before{content:'';width:11px;height:11px;position:absolute;left:2px;top:2px;border-radius:100%;background:#fff;transition:transform .15s}input[type=checkbox]:checked{background:var(--pink)}input[type=checkbox]:checked:before{transform:translateX(12px)}.button-row{display:flex;gap:7px;margin-top:10px}.button-row>button:first-child{flex:1}.empty-hint{font-size:11px;color:#858894;line-height:1.7}.left>.subtle{width:calc(100% - 34px);margin:16px 17px}.editor{display:flex;flex-direction:column;min-width:0;background:#17191d}.editor-toolbar{height:54px;border-bottom:1px solid var(--line);padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#222328}.segmented{display:flex;gap:2px;background:#17181d;border-radius:5px;padding:3px}.segmented button{border:0;background:none;color:#9d9faa;height:29px;font-size:11px;padding:0 12px}.segmented button.active{background:#36373f;color:#fff;box-shadow:0 1px 4px #0004}.color-dot{width:5px;height:5px;border-radius:50%}.pink{background:var(--pink)}.amber{background:var(--amber)}.tool-buttons{display:flex;gap:3px;align-items:center}.tool-buttons button{border:0;background:none;width:29px;padding:0}.tool-buttons #viewBtn{width:auto;font-size:10px;padding:0 8px}.separator{width:1px;height:20px;background:var(--line);margin:0 5px}.canvas-wrap{position:relative;flex:1;overflow:hidden;min-height:320px;background:#17191d}.canvas-wrap>svg{width:100%;height:100%;touch-action:none;user-select:none;display:block}.canvas-badge{position:absolute;top:18px;left:19px;display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:1.2px;color:#adb0bb;pointer-events:none}.canvas-badge .live-dot{background:#9296a3;width:4px;height:4px}.badge-divider{color:#4c4e58}.canvas-controls{position:absolute;bottom:47px;right:17px;display:flex;align-items:center;background:#25272ee8;border:1px solid #3b3e47;border-radius:5px;padding:3px;gap:2px}.canvas-controls button{border:0;background:none;width:28px;height:27px;font-size:17px;padding:0}.canvas-controls>span:not(.separator){width:48px;text-align:center;font-size:10px;color:#b1b4be}.canvas-bottom{position:absolute;bottom:0;height:30px;left:0;right:0;border-top:1px solid #30323a;display:flex;align-items:center;justify-content:space-between;padding:0 15px;font-size:9px;color:#848895;background:#1b1d22}.summary-strip{height:85px;border-top:1px solid var(--line);display:grid;grid-template-columns:.65fr 1.3fr 1.3fr 1fr;align-items:center;background:#222328}.summary-strip>div{padding:0 17px;border-right:1px solid var(--line)}.summary-strip>div:last-child{border:0}.metric-label{font-size:8px;letter-spacing:1.1px;color:#9396a2;display:block;margin-bottom:9px}.summary-strip strong{font-size:17px;font-weight:400;white-space:nowrap}.summary-strip small{font-size:10px;color:#9699a4}.route-settings,.route-actions{padding:16px 17px;border-bottom:1px solid var(--line)}.route-settings .inline-field:first-child,.route-actions .inline-field:first-child{margin-top:0}.route-actions>button{margin-top:13px}.route-actions .button-row{margin-top:8px}.route-actions .button-row button{font-size:11px}.route-actions .primary{background:#ff004017;border-color:#ff004060;color:#ff507c}.route-actions .primary:hover{background:#ff004030}.list-heading{display:flex;align-items:center;justify-content:space-between;color:#9c9faa;font-size:9px;letter-spacing:1.2px;margin:18px 18px 12px}.route-list{padding:0 13px 10px;overflow:auto;flex:1;min-height:100px;scrollbar-width:thin}.route-card{border:1px solid #3b3d46;border-radius:5px;background:#27282e;margin-bottom:8px;padding:11px 12px;cursor:pointer;position:relative}.route-card:hover{background:#303139}.route-card.active{border-color:var(--route);background:color-mix(in srgb,var(--route) 7%,#25262c)}.route-top{display:flex;align-items:center;gap:9px}.route-color{width:8px;height:8px;border-radius:2px;background:var(--route)}.route-name{font-size:12px;flex:1}.route-count{font-size:9px;color:#a0a3af}.route-card .bar{height:3px;border-radius:5px;background:#41434b;margin-top:11px;overflow:hidden}.route-card .bar span{height:100%;display:block;background:var(--route);max-width:100%}.route-info{display:flex;justify-content:space-between;margin-top:7px;font-size:9px;color:#9da0ac}.route-info.over{color:#ff727c}.route-sequence{font-size:9px;line-height:1.7;color:#bfc1ca;margin-top:8px;word-break:break-word}.route-sequence button{font-size:9px;min-width:20px;height:21px;padding:0 4px;border:0;background:#ffffff08;display:inline;margin:1px;color:#c4c6cf}.route-sequence button:hover{color:#ff718d;background:#ff004022}.route-footer{padding:14px 17px;border-top:1px solid var(--line);font-size:10px;color:#969aa6;line-height:1.6}.route-footer b{color:#e9eaf0;font-weight:400}.route-footer .warning{color:#ffbf56}footer{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#757987;padding:16px 25px;letter-spacing:.6px}footer .muted{padding:0 6px;color:#484b57}footer>span:first-child{color:#989ba7}#emptyCanvas{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;max-width:260px;pointer-events:none}#emptyCanvas h2{font-size:20px;font-weight:400}#emptyCanvas p{color:#9195a2;line-height:1.7}.empty-symbol{font-size:40px;color:var(--pink)}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:#363943;color:white;border:1px solid #5a5e6b;border-radius:6px;padding:12px 18px;opacity:0;pointer-events:none;z-index:20;transition:.2s;max-width:90vw}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{background:#24262c;color:#eee;border:1px solid #4b4e59;border-radius:10px;padding:24px;width:500px;max-width:90vw;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#0009;backdrop-filter:blur(3px)}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.modal-header h2{font-size:21px;font-weight:400;margin:0}.modal-header button{font-size:22px;width:30px;padding:0;background:none;border:0}#modalBody{font-size:12px;line-height:1.8;color:#b9bdc8}#modalBody .export-option{display:flex;align-items:center;justify-content:space-between;width:100%;height:62px;text-align:left;margin-top:10px;padding:12px 15px}.export-option small{color:#969ba8;display:block;font-size:10px}.key{background:#353841;padding:2px 6px;border-radius:3px;font-size:10px}.notice{padding:12px;border:1px solid #5b4b31;background:#ffbf560b;color:#d2bc94;border-radius:5px;margin-top:14px}.draw-active{background:#ff004022!important;border-color:var(--pink)!important;color:#ff6b90}.panel-shape{cursor:grab}.panel-shape:active{cursor:grabbing}.layout-note{padding:18px;font-size:12px;line-height:1.8;color:#a9aebb}.layout-note h3{font-size:17px;font-weight:400;color:white}.layout-note .big{color:#ff507c;font-size:28px;display:block;margin:20px 0 4px}[hidden]{display:none!important}:focus-visible{outline:2px solid #ff547e;outline-offset:3px}@media(min-width:1600px){main{grid-template-columns:280px minmax(360px,1fr) 300px;margin:0 28px}.workspace-heading{padding-left:36px}header{padding:0 34px}.summary-strip strong{font-size:21px}}@media(max-width:1200px){main{grid-template-columns:230px minmax(300px,1fr) 240px}.project-name #saveState,.version,.heading-note{display:none}header{gap:8px;padding:0 18px}.app-name{font-size:11px}.project-name{margin-left:auto;margin-right:0}.tool-buttons #viewBtn{font-size:0;width:27px}.tool-buttons #viewBtn .icon{width:15px}.summary-strip>div{padding:0 10px}.summary-strip strong{font-size:13px}.metric-label{font-size:7px}.canvas-bottom #canvasHint{max-width:210px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.segmented button{padding:0 9px}}@media(max-width:950px){header{height:70px;flex-wrap:wrap}.brand{width:100px}.app-name{margin-right:auto}.project-name{display:none}header button{font-size:11px}main{grid-template-columns:210px minmax(300px,1fr);height:740px;max-height:none}.right{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);display:block;max-height:400px}.route-list{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.route-settings,.route-actions{display:inline-block;width:49%;vertical-align:top}.route-footer{display:none}.editor{min-height:480px}main{height:auto;overflow:visible}.left{grid-row:1;max-height:700px}.editor{grid-row:1}.workspace-heading{height:95px}h1{font-size:23px}footer #footerInfo{display:none}}@media(max-width:600px){header{padding:9px 12px;gap:6px}.brand{width:85px;height:35px}.header-divider,.app-name{display:none}header button{padding:0 9px;margin-left:auto}header button .icon{display:none}header button+button{margin-left:0}main{margin:0 8px;display:flex;flex-direction:column}.workspace-heading{padding:18px 14px;height:90px}h1{font-size:22px}.left{order:2;max-height:none;border:0;display:grid;grid-template-columns:1fr 1fr}.left .section-title{display:none}.left details{padding:13px}.left>button{display:none}.editor{order:1;min-height:480px}.right{order:3;max-height:none}.route-list{grid-template-columns:1fr 1fr}.summary-strip strong{font-size:11px}.summary-strip{height:70px}.summary-strip>div{padding:0 8px}.summary-strip .metric-label{font-size:6px}.summary-strip small{font-size:8px}.tool-buttons{gap:0}.tool-buttons button{width:25px}.editor-toolbar{padding:0 7px}.segmented button{padding:0 8px}.canvas-bottom #canvasHint{max-width:160px}.route-settings,.route-actions{width:100%;display:block}footer{padding:14px;font-size:7px}.route-list{max-height:none}}

.insert-heading{font-size:10px;color:#b6bac5;margin:17px 0 7px}.insert-below{font-size:10px;margin:10px 0 2px;color:#b6bac5}.selection-toolbar{min-height:37px;display:flex;align-items:center;gap:8px;padding:4px 12px;border-bottom:1px solid var(--line);background:#1d1f25;font-size:10px;flex-shrink:0}.selection-toolbar #selectionCount{color:#e2e4ec;white-space:nowrap}.selection-shortcut{font-size:9px;color:#8d93a2;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.selection-toolbar #selectAll{margin-left:auto;font-size:10px;padding:0 8px;height:27px}.selection-toolbar #clearSelection,.selection-toolbar #deleteSelection{width:27px;height:27px;padding:0}.selection-toolbar #clearSelection{font-size:18px}.selection-toolbar .icon{width:14px;height:14px}#groupFields .empty-hint{margin:0 0 12px}.canvas-wrap #canvas{outline:none}@media(max-width:1200px){.selection-shortcut{display:none}}@media(max-width:600px){.selection-toolbar{padding:4px 8px}.insert-heading{font-size:9px}.left{display:block}.left details{border-right:0}}

/* Constrain the grid row so sidebar content scrolls instead of enlarging a clipped row. */
html{min-height:100%;overflow-y:auto}body{min-height:100dvh;overflow-x:hidden;overflow-y:visible}
main{height:max(560px,calc(100dvh - 237px));min-height:0;max-height:none;grid-template-rows:minmax(0,1fr)}
.left,.right,.editor{min-height:0;min-width:0;max-height:100%}.left,.right{overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;scrollbar-width:auto;overscroll-behavior-y:auto}
.right>*{flex-shrink:0}.route-list{flex:none;min-height:0;overflow:visible}.section-title,.editor-toolbar,.summary-strip{flex-shrink:0}.canvas-wrap{min-height:240px;flex:1 1 0}.section-title{position:sticky;top:0;z-index:2;background:var(--surface)}
.routing-hint{margin:9px 0 0;color:#a2a7b5;font-size:10px;line-height:1.6}.drawing-help{border-left:2px solid var(--pink);padding-left:9px;color:#e5b7c3}
@media(max-width:950px){main{height:auto;grid-template-rows:minmax(0,1fr) auto;overflow:visible}.left{height:min(720px,max(560px,calc(100dvh - 200px)));max-height:none}.editor{height:min(720px,max(560px,calc(100dvh - 200px)));max-height:none}.right{max-height:none;overflow:visible}.route-footer{display:block}.route-list{max-height:none}.canvas-wrap{min-height:240px}}
@media(max-width:600px){.left{height:auto;max-height:none;overflow:visible}.left>button{display:flex}.editor{height:560px;min-height:560px}.right{height:auto}.canvas-bottom #canvasHint{max-width:180px}.summary-strip{grid-template-columns:.6fr 1.2fr 1.2fr 1fr}.summary-strip strong{font-size:10px}}
