*{box-sizing:border-box}body{color:var(--ink);background-color:var(--bg);-webkit-font-smoothing:antialiased;margin:0;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,PingFang SC,Microsoft YaHei,sans-serif;font-size:13px}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}header{justify-content:space-between;align-items:center;height:52px;padding:0 20px;display:flex}.brand{align-items:center;gap:12px;display:flex}.brand .mark{color:#fff;letter-spacing:-.5px;border-radius:9px;place-items:center;width:34px;height:34px;font-size:14px;font-weight:800;display:grid}.brand h1{letter-spacing:-.2px;margin:0;font-size:15px;font-weight:700}.brand p{letter-spacing:1.6px;color:var(--faint);text-transform:uppercase;margin:2px 0 0;font-size:9px}nav{gap:6px;display:flex}nav button,.tools button{background:var(--fill);color:var(--ink);border:0;border-radius:8px;align-items:center;gap:6px;padding:8px 12px;font-weight:500;display:flex}svg{width:16px;height:16px}.workspace{grid-template-columns:320px minmax(0,1fr);height:calc(100vh - 52px);display:grid}aside{overscroll-behavior:contain;padding:16px;overflow:auto}aside section{box-shadow:var(--shadow-sm);background:#fff;border:0;border-radius:12px;margin-bottom:12px;padding:16px 16px 14px}h2{letter-spacing:.1px;color:var(--muted);margin:0 0 12px;font-size:13px;font-weight:600}aside h2{color:var(--muted);align-items:center;gap:6px;display:flex}aside h2 svg{width:14px;height:14px;color:var(--blue);flex:none}aside h2.clickable{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:7px;justify-content:space-between;margin:-4px -6px 10px;padding:5px 8px 5px 6px;transition:background-color .16s}aside h2.clickable:hover{background:var(--bg)}aside h2.clickable:focus-visible{box-shadow:0 0 0 3px var(--ring);outline:0}aside h2.clickable svg{transition:transform .24s var(--ease-out)}aside h2.clickable.open svg{transform:rotate(180deg)}.advancedBody{transition:grid-template-rows .24s var(--ease-out);grid-template-rows:0fr;display:grid}.advancedBody>div{overflow:hidden}.advancedBody.open{grid-template-rows:1fr}.advancedBodyInner{padding:2px 0 0}.clickable{justify-content:space-between;align-items:center;display:flex}.field{color:var(--ink);grid-template-columns:118px minmax(0,1fr);align-items:center;gap:8px;margin:10px 0;display:grid}.field>span{color:var(--muted);font-size:12px;line-height:1.3}.field>div{min-width:0}.inputWrap{background:var(--fill);border-radius:8px;align-items:center;height:34px;padding-left:10px;display:flex}.inputWrap input{width:100%;min-width:0;color:var(--ink);background:0 0;border:0;outline:0;flex:1;font-size:13px}.inputWrap b{color:var(--faint);padding-right:10px;font-size:12px;font-weight:400}.seg{background:#78788024;border-radius:9px;height:32px;padding:2px;display:flex;overflow:hidden}.seg button{color:var(--muted);white-space:nowrap;background:0 0;border:0;border-radius:7px;flex:1;font-size:13px}.seg button.active{color:var(--blue);background:#fff;font-weight:600}.seg.small button{padding:0 3px;font-size:11px}.radioStack{flex-direction:column;gap:6px;display:flex}.radioCard{background:var(--bg);min-height:36px;color:var(--ink);text-align:left;white-space:nowrap;text-overflow:ellipsis;border:0;border-radius:10px;align-items:center;gap:8px;padding:6px 10px;font-size:13px;transition:background-color .16s;display:flex;overflow:hidden}.radioCard:active{transform:scale(.97)}.radioCard .radioDot{background:#fff;border:1.5px solid #78788066;border-radius:50%;flex:none;width:18px;height:18px;transition:border-color .16s,background-color .16s}.radioCard.active{background:var(--blue-wash);color:var(--blue-ink);font-weight:600}.radioCard.active .radioDot{border-color:var(--blue);background:var(--blue);box-shadow:inset 0 0 0 4.5px #fff}.generate{color:#fff;letter-spacing:.2px;border:0;border-radius:980px;width:100%;height:40px;margin-bottom:12px;font-size:15px;font-weight:600}.summary{border-radius:10px!important;padding:4px 12px!important}.summary dl{margin:0}.summary dl div{border-bottom:.5px solid var(--separator);justify-content:space-between;align-items:baseline;padding:9px 0;display:flex}.summary dl div:last-child{border:0}.summary dt{color:var(--muted)}.summary dd{font-variant-numeric:tabular-nums;color:var(--ink);margin:0}.content{min-width:0;padding:16px;overflow:auto}.canvasHead{border-radius:14px;justify-content:space-between;align-items:flex-start;min-height:0;padding:14px 18px 12px;display:flex}.canvasHead h2{letter-spacing:-.2px;color:var(--ink);margin-bottom:10px;font-size:16px;font-weight:700}.canvasHead h2 em{color:var(--muted);font-size:13px;font-style:normal;font-weight:500}.legend{flex-wrap:wrap;gap:16px;display:flex}.legend span{color:var(--muted);align-items:center;gap:6px;display:flex}.legend i,.swatch{border-radius:3.5px;width:13px;height:13px;display:inline-block}.diagramScroll{box-shadow:var(--shadow-sm);background-color:#fff;background-image:linear-gradient(#7878800a 1px,#0000 1px),linear-gradient(90deg,#7878800a 1px,#0000 1px),linear-gradient(#7878800f 1px,#0000 1px),linear-gradient(90deg,#7878800f 1px,#0000 1px);background-position:0 0;background-repeat:repeat;background-size:8px 8px,8px 8px,40px 40px,40px 40px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border-radius:14px;margin:12px 0 0;overflow:auto}.roadSvg{height:430px;display:block}.roadSvg .zoneColor,.roadSvg .cone,.roadSvg .sign{transform-box:fill-box}.drawingTables{grid-template-columns:minmax(0,500px) minmax(0,1fr);gap:12px;margin-top:12px;display:grid}.tableWrap{box-shadow:var(--shadow-sm);background:#fff;border:0;border-radius:14px;padding:16px;overflow:auto}.drawingTables .tableWrap{margin:0}.tableWrap h2{letter-spacing:-.2px;color:var(--ink);margin-bottom:12px;font-size:15px;font-weight:700}table{border-collapse:collapse;width:100%;min-width:720px}.compactTable table{min-width:0}th,td{text-align:center;border-bottom:.5px solid var(--separator);padding:9px 10px;font-size:12px}th{color:var(--muted);font-variant-numeric:tabular-nums;background:0 0;font-weight:600}td{font-variant-numeric:tabular-nums;color:var(--ink)}td:last-child{text-align:left;color:var(--muted)}.swatch{vertical-align:middle;border-radius:2px;width:20px;height:8px;margin-right:8px}.note{color:#8a5a00;border-left:3px solid var(--orange);background:#fff9e6;margin:12px 0 0;padding:9px 12px;font-size:11px}.pageNote{margin:12px 12px 0}@media (width<=900px){header nav button{gap:0;padding:8px 10px;font-size:0}header nav svg{width:18px;height:18px}.drawingTables{grid-template-columns:1fr}.workspace{grid-template-columns:1fr;height:auto}aside,.content{overflow:visible}.canvasHead{gap:12px}.tools button{gap:0;padding:8px 10px;font-size:0}.field{grid-template-columns:140px minmax(0,1fr)}.sidebarToggle{display:block;top:calc(50vh - 26px)}.sidebarCollapsed{grid-template-columns:0 minmax(0,1fr)}.sidebarCollapsed aside{display:none}}@media (width<=560px){header{height:52px;padding:0 12px;position:sticky;top:0}.brand{gap:8px;min-width:0}.brand h1{white-space:nowrap;font-size:13px}.brand p{display:none}.brand .mark{border-radius:8px;width:30px;height:30px}nav{gap:2px}header nav button{justify-content:center;width:40px;height:40px;padding:0}header nav svg{width:18px;height:18px}aside{padding:12px}aside section{margin-bottom:10px;padding:14px 14px 12px}.field{grid-template-columns:116px minmax(0,1fr);gap:8px;margin:8px 0}.field>span{font-size:12px;line-height:1.35}.inputWrap,.seg{height:40px}.seg button{min-width:0;padding:0 7px}.radioCard{min-height:40px}.generate{height:44px}.summary{padding:2px 12px!important}.summary dl div{gap:10px;padding:8px 0}.summary dd{text-align:right;max-width:62%;font-size:12px}.content{border-top:.5px solid var(--separator);padding:12px}.canvasHead{border-radius:12px;padding:12px;display:block}.canvasHead h2{margin-bottom:8px;line-height:1.4}.canvasHead h2 em{margin-top:2px;font-size:12px;display:block}.legend{scrollbar-width:none;flex-wrap:nowrap;gap:14px;padding-bottom:5px;overflow-x:auto}.legend::-webkit-scrollbar{display:none}.legend span{flex:none}.tools{align-items:stretch;width:100%;margin-top:10px}.toolBtns button{flex:1;justify-content:center;min-height:40px;padding:0 12px}.zoomSliderWrap{width:100%}.diagramScroll{-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;border-radius:12px;margin-top:10px}.roadSvg{height:350px}.tableWrap{border-radius:12px;margin:10px 0 0;padding:14px 0 4px}.tableWrap h2{margin:0 14px 10px}table{min-width:740px}th,td{padding:10px 8px}.note{margin:10px 0 0}}@media (width<=360px){.brand h1{font-size:12px}header nav button{width:36px}.field{grid-template-columns:104px minmax(0,1fr)}}.alignHint{border-left:3px solid var(--orange);background:var(--orange-wash);border-radius:0 10px 10px 0;flex-direction:column;align-items:flex-start;gap:3px;margin:12px 0 0;padding:9px 11px;display:flex}.alignHint span{letter-spacing:.4px;color:var(--faint);text-transform:uppercase;font-size:10px;font-weight:600}.alignHint b{color:#b06200;font-size:13px;font-weight:600;line-height:1.5}.alignHint em{color:var(--muted);font-size:11px;font-style:normal;font-weight:500}@media (width<=560px){.alignHint{margin:6px 0 0}}:root{--ease-out:cubic-bezier(.32,.72,0,1);--ease-spring:cubic-bezier(.23,1,.32,1);--blue:#007aff;--blue-ink:#0055d4;--blue-wash:#007aff14;--ring:#007aff4d;--orange:#ff9f0a;--orange-deep:#e8890b;--orange-wash:#ff9f0a21;--orange-glow:#ff9f0a52;--ink:#1d1d1f;--muted:#6e6e73;--faint:#98989d;--bg:#f5f5f7;--fill:#7878801f;--fill-hover:#78788033;--separator:#3c3c431f;--separator-strong:#3c3c434a;--red:#ff3b30;--green:#34c759;--shadow-sm:0 1px 2px #0000000a, 0 2px 8px #0000000d;--shadow-md:0 2px 6px #0000000d, 0 10px 28px #00000017;--shadow-lg:0 8px 20px #0000001a, 0 24px 60px #0000002e}::selection{color:#1d1d1f;background:#007aff38}button{transition:transform .14s var(--ease-out), background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, opacity .16s ease}button:active{transform:scale(.97)}button:focus-visible,input:focus-visible{box-shadow:0 0 0 3px var(--ring);outline:0}header{-webkit-backdrop-filter:blur(20px)saturate(180%);box-shadow:0 .5px 0 var(--separator);z-index:20;background:#ffffffb8;position:sticky;top:0}.brand .mark{background:linear-gradient(160deg, #ffb340, var(--orange-deep));box-shadow:inset 0 1px 0 #fff6, 0 3px 10px var(--orange-glow)}nav button:hover,.tools button:hover{background:var(--fill);color:var(--blue)}nav button:focus-visible,.tools button:focus-visible{box-shadow:0 0 0 3px var(--ring)}.exportControl{position:relative}.exportMenu{-webkit-backdrop-filter:blur(30px)saturate(180%);width:200px;box-shadow:var(--shadow-lg);z-index:30;transform-origin:100% 0;animation:menuIn .2s var(--ease-out);background:#ffffffd1;border:0;border-radius:14px;padding:6px;position:absolute;top:calc(100% + 8px);right:0}@keyframes menuIn{0%{opacity:0;transform:scale(.92)translateY(-4px)}to{opacity:1;transform:none}}.exportGroup{flex-wrap:wrap;gap:2px;padding:2px;display:flex}.exportGroup+.exportGroup{border-top:.5px solid var(--separator);margin-top:2px;padding-top:6px}.exportGroupLabel{color:var(--faint);letter-spacing:.2px;white-space:nowrap;flex:0 0 100%;padding:4px 8px 6px;font-size:11px;font-weight:600}.exportGroup button{text-align:center;border-radius:8px;flex:1;justify-content:center;align-items:center;min-height:38px;padding:8px 4px;display:flex}.exportGroup button b{color:var(--ink);font-size:13px;font-weight:500}.exportGroup button:hover{background:var(--blue-wash)}.exportGroup button:hover b{color:var(--blue)}aside{z-index:1;position:relative}aside section{transition:box-shadow .18s,border-color .18s}aside section:hover{box-shadow:var(--shadow-md)}.inputWrap,.seg{transition:background-color .16s,box-shadow .16s}.inputWrap:hover{background:var(--fill-hover)}.inputWrap:focus-within{box-shadow:0 0 0 3.5px var(--ring);background:#fff}.seg button:hover:not(.active){color:var(--ink);background:#78788014}.seg button.active{color:var(--blue);background:#fff;box-shadow:0 1px 3px #00000014,0 1px 1px #0000000a}.generate{background:var(--blue);box-shadow:0 4px 12px #007aff59,inset 0 1px #ffffff40}.generate:hover{background:#2f8bff;box-shadow:0 6px 16px #007aff6b,inset 0 1px #ffffff40}.generate:active{background:#0068e0;box-shadow:0 2px 6px #007aff59}.summary{box-shadow:var(--shadow-sm);background:#fff}.summary dd{font-weight:600}.canvasHead{-webkit-backdrop-filter:blur(16px)saturate(160%);box-shadow:0 .5px 0 var(--separator);z-index:1;background:#ffffffa6;position:relative}.legend span{padding:3px 0}.tools button{background:#fff;border-color:#3c3c431a;box-shadow:0 1px 2px #0000000d}.tools button:hover{background:var(--blue-wash);border-color:#007aff40}.diagramScroll{scrollbar-color:#78788059 transparent;scrollbar-width:thin}.tableWrap{box-shadow:var(--shadow-sm)}thead{z-index:1;position:sticky;top:0}tbody tr{transition:background-color .14s}tbody tr:hover{background:var(--bg)}th{color:var(--muted);font-weight:600}.zoneName{text-align:left;white-space:nowrap;align-items:center;width:112px;display:inline-flex}.zoneName .swatch{flex:0 0 20px;margin-right:12px}.note{border-radius:0 8px 8px 0}.toast{-webkit-backdrop-filter:blur(20px)saturate(180%);color:#fff;z-index:100;animation:toastIn .26s var(--ease-out);pointer-events:none;white-space:nowrap;background:#28282cd1;border-radius:980px;padding:11px 22px;font-size:13px;font-weight:500;position:fixed;top:64px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #00000038}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(-10px)scale(.96)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}.loadingOverlay{z-index:200;-webkit-backdrop-filter:blur(20px)saturate(160%);background:#f5f5f78c;flex-direction:column;justify-content:center;align-items:center;gap:16px;animation:.15s fadeIn;display:flex;position:fixed;inset:0}.loadingOverlay span{color:var(--muted);font-size:15px;font-weight:500}.loadingSpinner{border:3px solid #78788033;border-top-color:var(--blue);border-radius:50%;width:34px;height:34px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.sidebarToggle{z-index:15;-webkit-backdrop-filter:blur(16px)saturate(160%);width:26px;height:52px;color:var(--muted);cursor:pointer;background:#ffffffd9;border:0;border-radius:0 10px 10px 0;padding:0;font-size:20px;line-height:1;display:none;position:fixed;top:50%;left:0;box-shadow:2px 4px 14px #0000001a}.sidebarToggle:hover{color:var(--blue);background:#fff}.sidebarCollapsed aside{display:none}.sidebarCollapsed{grid-template-columns:0 minmax(0,1fr)}.sidebarCollapsed .sidebarToggle{left:0}.tools{flex-direction:column;align-items:flex-end;gap:6px;display:flex}.toolBtns{gap:6px;display:flex}.toolBtns button{border-radius:8px;padding:8px 12px}.toolBtns button svg{width:15px;height:15px}.zoomSliderWrap{align-items:center;gap:10px;width:168px;display:flex}.zoomSlider{appearance:none;cursor:pointer;background:#78788038;border-radius:2px;outline:none;flex:1;height:4px}.zoomSlider::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#fff;border:.5px solid #0000000f;border-radius:50%;width:22px;height:22px;transition:transform .12s;box-shadow:0 2px 6px #0000002e}.zoomSlider::-webkit-slider-thumb:hover{transform:scale(1.12)}.zoomSlider::-moz-range-thumb{cursor:pointer;background:#fff;border:.5px solid #0000000f;border-radius:50%;width:22px;height:22px;box-shadow:0 2px 6px #0000002e}.zoomLevel{min-width:40px;color:var(--muted);font-variant-numeric:tabular-nums;text-align:right;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:12px;font-weight:600}.field.hasError .inputWrap{background:#ff3b300f;box-shadow:0 0 0 1.5px #ff3b3080}.field.hasError .inputWrap:focus-within{box-shadow:0 0 0 3.5px #ff3b3038}.fieldError{color:var(--red);margin-top:5px;font-size:11px;line-height:1.3;animation:.16s ease-out errorIn;display:block}@keyframes errorIn{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){button,.inputWrap,.seg,tbody tr,aside section{transition:none}.toast,.loadingOverlay,.loadingSpinner,.fieldError,.exportMenu{animation:none}.advancedBody,aside h2.clickable svg{transition:none}}@media (prefers-reduced-transparency:reduce){header,.canvasHead,.exportMenu,.toast,.loadingOverlay,.sidebarToggle{-webkit-backdrop-filter:none;background:#fff}}@media (width<=560px){.toast{padding:9px 18px;font-size:12px;top:58px}.exportMenu{position:fixed;top:58px;left:auto;right:10px}.exportGroup button{min-height:42px}.canvasHead{background:#fffc}}