:root{--bg: #f4f3ef;--bg2: #ecebe6;--panel: #ffffff;--line: rgba(24, 26, 33, .09);--line2: rgba(24, 26, 33, .16);--ink: #1c1d22;--ink2: #5c5f69;--ink3: #8d909a;--accent: #2468f2;--accent-soft: #e7eefe;--danger: #d6404a;--shadow: 0 1px 2px rgba(20, 22, 30, .06), 0 6px 20px rgba(20, 22, 30, .07);--radius: 12px;--font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:13px;-webkit-font-smoothing:antialiased;overflow:hidden}button{font:inherit;color:inherit}#app{display:grid;grid-template-rows:48px 1fr 36px;height:100vh}.topbar{display:flex;align-items:center;gap:6px;padding:0 10px 0 12px;background:var(--panel);border-bottom:1px solid var(--line);position:relative;z-index:5}.brand{display:flex;align-items:center;gap:8px;font-weight:650;font-size:15px;letter-spacing:-.01em;margin-right:10px;user-select:none}.doc-name{padding:4px 8px;border-radius:7px;color:var(--ink2);outline:none;min-width:60px;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.doc-name:hover{background:var(--bg)}.doc-name:focus{background:var(--bg);color:var(--ink);box-shadow:0 0 0 2px var(--accent-soft)}.doc-name.dirty:after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ink3);margin-left:6px;vertical-align:middle}.spacer{flex:1}.group{display:flex;align-items:center;gap:2px;padding:0 6px;border-left:1px solid var(--line)}.group:first-of-type{border-left:0}.ibtn{width:34px;height:34px;display:grid;place-items:center;border:0;background:transparent;border-radius:9px;cursor:pointer;color:var(--ink2);position:relative}.ibtn:hover{background:var(--bg);color:var(--ink)}.ibtn:active{background:var(--bg2)}.ibtn.on{background:var(--accent-soft);color:var(--accent)}.ibtn:disabled{opacity:.35;cursor:default;background:transparent}.tbtn{height:32px;padding:0 10px 0 8px;display:flex;align-items:center;gap:6px;border:0;background:transparent;border-radius:9px;cursor:pointer;color:var(--ink2)}.tbtn:hover{background:var(--bg);color:var(--ink)}.tbtn.primary{background:var(--ink);color:#fff;padding:0 12px 0 10px}.tbtn.primary:hover{background:#33353d}select.units{height:30px;border:1px solid var(--line2);border-radius:8px;background:var(--panel);padding:0 26px 0 10px;font:inherit;color:var(--ink);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235c5f69' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center}select.units:hover{border-color:#181a2147}[data-tip]:hover:after{content:attr(data-tip);position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%);background:#1c1d22;color:#fff;font-size:12px;padding:5px 8px;border-radius:7px;white-space:nowrap;pointer-events:none;z-index:50;box-shadow:var(--shadow)}.toolbar [data-tip]:hover:after{top:50%;left:calc(100% + 10px);transform:translateY(-50%)}[data-tip][data-key]:hover:after{content:attr(data-tip) "   " attr(data-key)}.stage{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#fbfbf9,#f1f0eb 60%,#e9e8e2)}#viewport{position:absolute;inset:0}#viewport canvas{display:block;outline:none}#hud{position:absolute;inset:0;pointer-events:none;overflow:hidden}.stage.cur-draw canvas{cursor:crosshair}.stage.cur-select canvas{cursor:default}.stage.cur-pan canvas{cursor:grab}.stage.cur-panning canvas,.stage.cur-orbiting canvas{cursor:grabbing}.stage.cur-orbit canvas{cursor:move}.toolbar{position:absolute;left:12px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);z-index:3}.toolbar .ibtn{width:40px;height:40px;border-radius:10px}.toolbar .ibtn svg{width:22px;height:22px}.toolbar .sep{height:1px;background:var(--line);margin:4px 6px}.snap-marker,.snap-tip,.dim-pill,.track-mark,.sel-box,.pivot-mark{position:absolute;left:0;top:0;display:none;will-change:transform}.snap-marker{width:16px;height:16px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.18))}.snap-tip{background:#fffffff5;color:var(--ink);border:1px solid var(--line2);font-size:11.5px;padding:3px 7px;border-radius:6px;white-space:nowrap;box-shadow:0 2px 8px #00000014}.dim-pill{background:var(--ink);color:#fff;font:600 11.5px/1 var(--font);font-variant-numeric:tabular-nums;padding:4px 7px;border-radius:6px;white-space:nowrap;box-shadow:0 2px 6px #00000029}.track-mark{width:10px;height:10px;border:1.5px solid #5c5f69;border-radius:2px;background:#ffffffb3;transform-origin:center}.sel-box{border:1.4px solid var(--accent);background:#2468f212}.sel-box.crossing{border-style:dashed;background:#2468f20a}.empty{position:absolute;left:50%;bottom:28px;transform:translate(-50%);background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:12px;padding:10px 14px;color:var(--ink2);display:flex;gap:14px;align-items:center;pointer-events:none;transition:opacity .25s;z-index:2;white-space:nowrap}.empty b{color:var(--ink);font-weight:600}.empty kbd,.help kbd{font:600 11px/1 var(--mono);background:var(--bg);border:1px solid var(--line2);border-bottom-width:2px;border-radius:5px;padding:3px 5px;color:var(--ink)}.empty.hide{opacity:0}.viewcube{position:absolute;right:14px;top:14px;display:flex;gap:2px;padding:4px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:3}.statusbar{display:flex;align-items:center;gap:10px;padding:0 8px 0 14px;background:var(--panel);border-top:1px solid var(--line)}.hint{flex:1;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toggles{display:flex;gap:2px}.toggles .ibtn{width:auto;height:28px;padding:0 8px;gap:5px;display:flex;font-size:12px}.toggles .ibtn svg{width:17px;height:17px}.vcb{display:flex;align-items:center;gap:0;height:28px;border:1px solid var(--line2);border-radius:8px;overflow:hidden;background:var(--bg)}.vcb span{padding:0 9px;color:var(--ink2);font-size:12px;border-right:1px solid var(--line);height:100%;display:flex;align-items:center;background:var(--panel);min-width:74px}.vcb input{width:150px;height:100%;border:0;background:transparent;padding:0 9px;font:600 12.5px var(--font);font-variant-numeric:tabular-nums;color:var(--ink);outline:none}.vcb input::placeholder{color:var(--ink3);font-weight:500}.vcb:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.vcb.bad{animation:shake .3s;border-color:var(--danger)}@keyframes shake{25%{transform:translate(-3px)}75%{transform:translate(3px)}}.menu{position:absolute;top:44px;right:10px;min-width:240px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 40px #14161e29;padding:6px;z-index:30;display:none}.menu.open{display:block}.menu button{display:flex;width:100%;align-items:center;gap:10px;border:0;background:transparent;padding:8px 10px;border-radius:8px;cursor:pointer;text-align:left}.menu button:hover{background:var(--bg)}.menu button svg{color:var(--ink2);flex:none}.menu .mt{display:flex;flex-direction:column}.menu .mt small{color:var(--ink3);font-size:11.5px;margin-top:1px}.menu .msep{height:1px;background:var(--line);margin:5px 4px}.help{position:absolute;right:14px;top:64px;width:330px;max-height:calc(100% - 80px);overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:0 10px 40px #14161e29;padding:14px 16px;z-index:20;display:none}.help.open{display:block}.help h3{margin:4px 0 8px;font-size:13px}.help h4{margin:14px 0 6px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3)}.help .row{display:flex;justify-content:space-between;gap:10px;padding:3px 0;color:var(--ink2)}.help .row span:last-child{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}.help .close{position:absolute;right:8px;top:8px}.toast{position:absolute;left:50%;top:14px;transform:translate(-50%) translateY(-8px);background:var(--ink);color:#fff;padding:8px 12px;border-radius:9px;font-size:12.5px;opacity:0;pointer-events:none;transition:all .2s;z-index:40;box-shadow:var(--shadow)}.toast.show{opacity:1;transform:translate(-50%)}.modal-back{position:fixed;inset:0;background:#14161e38;display:none;place-items:center;z-index:60}.modal-back.open{display:grid}.modal{background:var(--panel);border-radius:14px;padding:18px 18px 14px;width:340px;box-shadow:0 20px 60px #00000040}.modal p{margin:0 0 16px;color:var(--ink2);line-height:1.45}.modal h3{margin:0 0 6px;font-size:14px}.modal .btns{display:flex;justify-content:flex-end;gap:6px}.modal .btns button{height:32px;padding:0 12px;border-radius:8px;border:1px solid var(--line2);background:var(--panel);cursor:pointer}.modal .btns button.danger{background:var(--danger);border-color:var(--danger);color:#fff}.drop{position:absolute;inset:10px;border:2px dashed var(--accent);border-radius:16px;background:#2468f20f;display:none;place-items:center;color:var(--accent);font-weight:600;font-size:15px;z-index:50;pointer-events:none}.drop.on{display:grid}@media(max-width:860px){.doc-name,.tbtn span,.hint{display:none}.vcb input{width:110px}}.float-vcb{position:absolute;left:0;top:0;display:none;align-items:center;height:34px;background:var(--panel);border:1.5px solid var(--accent);border-radius:10px;box-shadow:0 0 0 4px var(--accent-soft),0 8px 24px #14161e29;pointer-events:auto;overflow:hidden;z-index:8}.float-vcb.open{display:flex}.float-vcb span{padding:0 8px 0 10px;color:var(--ink2);font-size:12px;white-space:nowrap}.float-vcb input{width:120px;height:100%;border:0;outline:none;background:transparent;font:650 15px var(--font);font-variant-numeric:tabular-nums;color:var(--ink);padding:0 4px}.float-vcb kbd{font:600 10.5px/1 var(--mono);color:var(--ink3);border:1px solid var(--line2);border-radius:5px;padding:3px 5px;margin-right:8px}.float-vcb.bad{animation:shake .3s;border-color:var(--danger);box-shadow:0 0 0 4px #d6404a26}.modebar{position:absolute;left:12px;top:14px;display:flex;gap:2px;padding:4px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:3}.modebar [data-tip]:hover:after{top:calc(100% + 8px);left:50%;transform:translate(-50%)}.pivot-mark{width:22px;height:22px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}.toolopts{position:absolute;left:50%;top:14px;transform:translate(-50%);display:none;align-items:center;gap:2px;padding:4px 6px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:3}.toolopts.open{display:flex}.toolopts .lbl{color:var(--ink3);font-size:11.5px;padding:0 6px 0 4px;white-space:nowrap}.toolopts .vsep{width:1px;height:22px;background:var(--line);margin:0 6px}.toolopts .ibtn{width:32px;height:30px}.toolopts .axbtn{font:700 12.5px var(--font)}.toolopts .axbtn.x{color:#d9484f}.toolopts .axbtn.y{color:#2e9d5b}.toolopts .axbtn.z{color:#3a62d6}.toolopts .axbtn.on{background:var(--accent-soft);box-shadow:inset 0 0 0 1.5px currentColor}.toolopts [data-tip]:hover:after{top:calc(100% + 8px);left:50%;transform:translate(-50%)}.toolopts .fld{display:flex;align-items:center;height:30px;border:1px solid var(--line2);border-radius:8px;background:var(--bg);margin-left:4px;position:relative}.toolopts .fld span{padding:0 6px 0 8px;color:var(--ink2);font-size:12px}.toolopts .fld input{width:70px;height:100%;border:0;background:transparent;outline:none;font:600 12.5px var(--font);font-variant-numeric:tabular-nums;color:var(--ink);padding:0 8px 0 0}.toolopts .fld:last-child input{width:92px}.toolopts .fld:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--panel)}.planebar .grp{display:flex;align-items:center;gap:2px}.planebar .tbtn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px 0 8px;border:0;border-radius:8px;background:transparent;color:var(--ink);font:600 12.5px var(--font);cursor:pointer;margin-left:2px}.planebar .tbtn svg{width:18px;height:18px}.planebar .tbtn:hover{background:var(--hover, rgba(0,0,0,.05))}.planebar .tbtn.on{background:var(--accent-soft);color:var(--accent)}.planebar .tbtn.primary{background:var(--accent);color:#fff}.planebar .tbtn.primary:hover{filter:brightness(1.06)}.planebar .ibtn.on{color:var(--accent);background:var(--accent-soft)}
