:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#29263b;background:#f7f6fb;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid #dedce8;border-radius:8px;background:white;color:#454056;padding:9px 13px;font-size:13px;font-weight:550}button:hover{background:#f2efff;border-color:#c1b4f7}button:disabled{opacity:.42;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #ac98ff;outline-offset:3px}a{color:#6750c9}button.primary{background:#6b4eff;border-color:#6b4eff;color:white}button.primary:hover{background:#573cda}.topbar{height:76px;background:white;border-bottom:1px solid #e5e2ee;display:flex;align-items:center;gap:30px;padding:0 30px}.brand{display:flex;gap:9px;align-items:center;text-decoration:none;color:#262236;font-size:30px;font-weight:750;letter-spacing:-1.8px}.brand b{display:grid;place-items:center;background:#6b4eff;color:white;border-radius:10px;width:36px;height:36px;font-size:31px}.topbar nav{display:flex;gap:6px}.topbar nav a{padding:9px 13px;text-decoration:none;color:#7c778a;font-size:13px;font-weight:600;border-radius:8px}.topbar nav a.active{background:#f0ecff;color:#6745e2}.private{margin-left:auto;font-size:12px;color:#7b7787}.layout{display:grid;grid-template-columns:242px minmax(0,1fr);height:calc(100dvh - 76px);min-height:520px}aside{background:#fff;border-right:1px solid #e5e2ee;padding:24px 18px;display:flex;flex-direction:column;min-height:0}.section-heading{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1.5px;font-weight:750;color:#918a9f;margin:0 0 14px}.tag{font-size:9px;background:#f0ecff;color:#795bd7;padding:4px 6px;border-radius:5px}#filename{font-size:14px;overflow-wrap:anywhere}#file-info{font-size:11px;color:#918a9f;margin:7px 0 30px;line-height:1.7}.search-label input{width:100%;border:1px solid #e5e2ec;border-radius:7px;font-size:12px;padding:10px;background:#faf9fc}.layer-actions{display:flex;gap:15px;margin:10px 0}.layer-actions button{padding:3px 0;font-size:11px;background:none;border:0;color:#7b63ca}#layers{overflow:auto;min-height:90px;flex:1}.layer{display:flex;gap:9px;align-items:center;padding:9px 3px;font-size:12px;cursor:pointer}.layer input{accent-color:#7960dc;flex:none}.layer .swatch{width:9px;height:9px;border:1px solid #8e8999;border-radius:2px;flex:none}.layer .layer-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.muted{color:#aba4b5;font-size:12px;line-height:1.8}.side-bottom{margin-top:22px;padding-top:18px;border-top:1px solid #edeaf3}.side-bottom strong{font-size:12px;color:#747083}.side-bottom p,.side-bottom a{font-size:11px;line-height:1.7;color:#9991a9}.workspace{display:flex;flex-direction:column;min-width:0;min-height:0}.toolbar{height:60px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:#fff;border-bottom:1px solid #e5e2ee;gap:8px}.tool-group{display:flex;align-items:center;gap:7px}.toolbar button{font-size:12px;padding:8px 11px}.separator{width:1px;height:22px;background:#e5e2ee;margin:0 5px}button[aria-pressed=true]{background:#eee9ff;color:#6b4eff;border-color:#a391eb}.stage{flex:1;min-height:240px;background:#171e2b;position:relative;overflow:hidden}#viewer{position:absolute!important;inset:0;touch-action:none}#viewer canvas{display:block}#measure-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}#welcome{position:absolute;inset:0;background:radial-gradient(ellipse at 60% 30%,#f1edff,#f8f7fc 66%);display:flex;align-items:center;justify-content:center;overflow:auto;padding:26px}.welcome-content{text-align:center;max-width:660px}.eyebrow{color:#8e76c4;font-size:10px;letter-spacing:2px;font-weight:700}h1{font-size:clamp(30px,3.8vw,53px);letter-spacing:-2px;line-height:1.1;margin:20px 0;color:#302842;font-weight:640}.lead{color:#92899f;font-size:14px;line-height:1.9;margin-bottom:26px}.dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;width:100%;min-height:175px;background:#ffffffa6;border:1px dashed #b8a7db;border-radius:15px;padding:22px}.drawing-icon{display:grid;place-items:center;font-size:31px;background:#eee8ff;border-radius:11px;width:45px;height:45px;color:#7d58cd}.dropzone strong{font-size:15px;color:#5b437a}.dropzone span:not(.drawing-icon){font-size:12px;color:#a395b5}.dropzone small{font-size:10px;color:#afa4bd}.sample{border:none;background:none;color:#9379b1;font-size:12px;margin:14px 0}.features{display:flex;justify-content:center;gap:20px;font-size:10px;color:#9e93ad;flex-wrap:wrap}.statusbar{min-height:35px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 18px;background:#fff;font-size:10px;color:#878292;line-height:1.5}.help{background:#fbfaff;border-top:1px solid #e9e5f0;font-size:11px;color:#82788f;max-height:32%;overflow:auto;flex:none}.help summary{padding:12px 20px;cursor:pointer}.help>div{padding:0 20px 10px;max-width:980px;line-height:1.8}.help p{margin:0 0 10px}#loading{position:absolute;inset:0;background:#171e2bbd;z-index:6;display:grid;place-items:center}.load-card{padding:28px;text-align:center;border:1px solid #544b65;border-radius:16px;background:#fff;max-width:400px;margin:20px}.load-card h2{font-size:17px}.load-card p{font-size:12px;color:#8b8297;line-height:1.7}.spinner{margin:auto;width:27px;height:27px;border:3px solid #e5ddf9;border-top-color:#8160db;border-radius:100%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#error{position:absolute;bottom:20px;left:20px;right:20px;margin:auto;max-width:540px;border:1px solid #e5b2b2;background:#fff5f5;border-radius:12px;padding:20px;z-index:8;font-size:13px}#error strong{color:#9f4545}#error p{color:#74555b;line-height:1.7}#measure-readout{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:#fff;border:1px solid #c4b3eb;color:#614789;padding:11px 18px;border-radius:10px;font-size:12px;z-index:4;max-width:90%;text-align:center;pointer-events:none}.stage.dragover{outline:4px solid #9471ed;outline-offset:-5px}.stage.measuring{cursor:crosshair}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(max-width:850px){.topbar{padding:0 14px;gap:12px}.private{display:none}.topbar .primary{margin-left:auto}.layout{grid-template-columns:185px minmax(0,1fr)}.toolbar{padding:0 10px}.features{gap:9px}#coords{display:none}}@media(max-width:600px){.topbar{height:65px}.brand{font-size:24px}.brand b{width:29px;height:29px;font-size:25px}.topbar nav{gap:0}.topbar nav a{font-size:10px;padding:8px}.topbar .primary{font-size:11px;padding:8px}.layout{height:calc(100dvh - 65px);grid-template-columns:1fr;min-height:550px}.workspace{grid-row:1}.toolbar{height:50px}.toolbar button{padding:8px}.toolbar .separator{margin:0}aside{grid-row:2;max-height:180px;border-top:1px solid #e5e2ee;padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:5px 12px}.side-bottom,#file-info,aside .tag,aside>.section-heading:first-child{display:none}.section-heading{margin:0}#filename{font-size:12px;grid-row:1;grid-column:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.search-label{grid-row:2;grid-column:1}.layer-actions{grid-row:2;grid-column:2;margin:0}#layers{grid-column:1/-1;display:flex;gap:15px;min-height:35px;max-height:70px;overflow:auto}.layer{flex:none;max-width:170px;padding:4px}.muted{margin:0}h1{font-size:31px;margin:12px 0}.lead{font-size:12px;margin:10px 0 14px}.dropzone{min-height:135px;padding:13px;gap:6px}.features{display:none}#welcome{padding:18px}.sample{margin:6px 0}.statusbar{font-size:9px}.help summary{padding:8px 14px}.toolbar button span{font-size:10px}}
dialog{border:1px solid #d9d1e8;border-radius:16px;max-width:400px;padding:26px;color:#443653}dialog::backdrop{background:#16102488}dialog h2{font-size:20px}dialog p{font-size:13px;line-height:1.7;color:#8e8399}.download-link{display:inline-block;background:#6b4eff;color:white;text-decoration:none;padding:11px 16px;border-radius:8px;margin:10px 0 18px}dialog form{display:inline-block;margin-left:15px}
@media(max-width:600px){.topbar{height:auto;min-height:105px;flex-wrap:wrap;gap:8px;padding:10px 14px}.topbar nav{order:3;width:100%;justify-content:center;gap:12px}.topbar nav a{font-size:11px}.layout{height:calc(100dvh - 105px)}}
