@charset "UTF-8";
:root{color-scheme:dark;--bg:#101923;--panel:#17222e;--panel-deep:#121d28;--canvas:#101a25;--line:#2a3948;--text:#e5edf4;--muted:#93a5b5;--accent:#68e1c2;--accent-bg:#1b3c3b;--amber:#f5c578;--font:Tahoma,"Noto Sans Thai",system-ui,sans-serif;font-family:var(--font);font-size:14px;color:var(--text);background:var(--bg)}*{box-sizing:border-box}body{margin:0;height:100dvh;display:flex;flex-direction:column;overflow:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer;white-space:nowrap;border:1px solid transparent;background:transparent;color:var(--text);border-radius:5px;padding:8px 11px;transition:background .12s,border-color .12s}button:hover{background:#273847}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:disabled{opacity:.35;cursor:default}input,select,textarea{background:#101b26;border:1px solid var(--line);color:var(--text);border-radius:5px;padding:9px 10px;min-width:0;width:100%;outline:none}input[type=color]{padding:3px;height:34px}h1,h2,p{margin:0}h2{font-size:14px;font-weight:500}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.topbar{display:flex;align-items:center;gap:26px;min-height:76px;padding:12px 22px;border-bottom:1px solid var(--line);background:var(--panel-deep)}.brand{display:flex;gap:9px;align-items:center;text-decoration:none;color:var(--text);font-family:system-ui,sans-serif;font-size:21px;font-weight:650;letter-spacing:-.6px;min-width:204px}.brand svg{width:34px;height:34px;stroke:var(--accent);stroke-width:2;fill:none}.brand-light{font-weight:350}.brand small{display:block;color:var(--muted);font:12px var(--font);letter-spacing:0;margin-top:2px}.document-meta{flex:1;max-width:340px;min-width:100px}.document-meta input{background:none;border:0;padding:1px 0;font-size:15px}.document-meta>span{font-size:12px;color:var(--muted)}.file-actions{display:flex;gap:9px;margin-left:auto;align-items:center}.primary{background:var(--accent);color:#0c2c27;font-weight:600;border-color:var(--accent)}.primary:hover{background:#8fecda}.secondary{border-color:#405261;background:#22323f}.key{font:11px system-ui,sans-serif;color:var(--muted);margin-left:7px}.toolbar{display:flex;align-items:center;gap:12px;min-height:58px;padding:7px 18px;background:var(--panel);border-bottom:1px solid var(--line);overflow-x:auto}.toolgroup{display:flex;gap:3px;align-items:center}.tool{display:flex;align-items:center;gap:8px;padding:9px}.tool span{font:22px system-ui;width:22px;text-align:center;line-height:22px;color:#a8bbcc}.tool.active,.status-toggles .active{color:var(--accent);background:var(--accent-bg);border-color:#366660}.tool.active span{color:var(--accent)}.history{border-left:1px solid var(--line);padding-left:10px}.history button{font-size:22px;padding:3px 10px}.toolbar-end{display:flex;gap:2px;align-items:center;margin-left:auto;white-space:nowrap}.toolbar-end>button:last-child{border:1px solid var(--line);border-radius:50%;width:28px;height:28px;padding:0;margin-left:7px}.workspace{display:grid;grid-template-columns:224px minmax(200px,1fr) 230px;flex:1;min-height:0}.panel{background:var(--panel);min-height:0;overflow-y:auto}.library{border-right:1px solid var(--line);padding:18px 14px 0;display:flex;flex-direction:column}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.count{border-radius:4px;font:12px system-ui;background:#293744;color:#a5b9ca;padding:2px 6px}.search{margin:10px 0 14px;background:#1b2936;font-size:13px}.symbols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-content:start;overflow-y:auto;min-height:100px;flex:1}.symbol-card{display:flex;align-items:center;flex-direction:column;gap:6px;border:1px solid var(--line);padding:10px 4px 8px;background:#192633;border-radius:6px;font-size:12px;height:91px;white-space:normal;line-height:1.45}.symbol-card svg{width:67px;height:40px;color:#d4e4ec;overflow:visible}.symbol-card.active{background:#1c3b3b;border-color:var(--accent);color:var(--accent)}.symbol-card.active svg{color:var(--accent)}.subtle{color:var(--muted);font-size:13px}.full{width:100%;margin-top:10px}.library-note{padding:12px 1px 14px;color:var(--muted);font-size:12px;line-height:1.9}kbd{font:11px var(--font);background:#2a3a47;border:1px solid #41515f;border-radius:3px;padding:0 4px;color:#c9d6df}.library-bottom{padding:14px 0;display:flex;gap:8px;align-items:center;border-top:1px solid var(--line);font-size:12px;color:#b2c3d0}.library-bottom small{display:block;font-size:11px;color:var(--muted);margin-top:3px}.offline-icon{color:var(--accent);font-size:25px}.drawing-area{display:flex;flex-direction:column;min-width:0;min-height:0}.canvas-heading{display:flex;align-items:center;gap:9px;height:43px;padding:0 18px;background:#131f2b;border-bottom:1px solid var(--line);font-size:13px}.canvas-heading strong{font-weight:400;max-width:230px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.tab-mark{width:7px;height:7px;background:var(--accent);border-radius:2px}.canvas-mode{font:10px system-ui;letter-spacing:1px;color:#6b8498;border-left:1px solid var(--line);padding-left:10px}.canvas-heading button{font-size:12px;color:var(--muted);margin-left:auto;padding:5px}#viewport{flex:1;min-height:100px;position:relative;overflow:hidden;outline:none;touch-action:none}#canvas{display:block;width:100%;height:100%;touch-action:none}#empty-state{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;color:#a6b8c8;width:280px}#empty-state h1{font-size:19px;color:#c3d2dc;font-weight:400;margin:10px 0}#empty-state p{font-size:14px;line-height:1.9}#empty-state button{pointer-events:auto;margin-top:17px;font-size:13px}.empty-cross{font-size:30px;font-weight:200;color:#5d847f;border:1px solid #31504e;width:53px;height:53px;margin:0 auto;border-radius:12px;line-height:49px}.view-controls{position:absolute;right:17px;bottom:17px;display:flex;border:1px solid #344858;background:#192634e8;box-shadow:0 4px 16px #0002;border-radius:6px}.view-controls button{font-size:14px;padding:7px 11px}.commandbar{display:flex;align-items:center;gap:9px;padding:9px 15px;min-height:41px;border-top:1px solid var(--line);font-size:12px;line-height:1.5;background:#14212e}.prompt-arrow{color:var(--accent);font-size:23px;line-height:20px}.shortcut{margin-left:auto;color:#8095a7;white-space:nowrap;font-size:11px}.inspector{border-left:1px solid var(--line);padding:18px 15px}.property-empty{color:#a9bccb;line-height:1.9;padding:22px 3px 29px;font-size:14px}.property-empty small{font-size:12px;color:var(--muted)}#properties label{display:block;font-size:12px;color:var(--muted);margin-bottom:10px}#properties input,#properties select{display:block;margin-top:5px;font-size:14px}.property-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.selection-actions{display:flex;gap:2px;margin:10px 0}.selection-actions button{font-size:13px;padding:7px 8px;border:1px solid var(--line)}.danger{color:#ff9d9d}.layer-heading{border-top:1px solid var(--line);padding-top:19px;margin:15px 0 8px}.layer-heading button{padding:2px 6px;font-size:18px}.layer-row{display:flex;align-items:center;gap:7px;min-height:37px;padding:3px 4px;border:1px solid transparent;border-radius:4px;margin:3px -5px}.layer-row.active{background:#21373b;border-color:#325354}.layer-swatch{width:9px;height:9px;border-radius:2px;flex:none}.layer-name{overflow:hidden;text-overflow:ellipsis;text-align:left;font-size:13px;flex:1;padding:4px 0}.layer-row button.icon-button{padding:3px;width:25px;font-size:13px;color:var(--muted)}.layer-row.off{opacity:.48}.settings{margin-top:24px;padding-top:19px;border-top:1px solid var(--line);display:grid;gap:13px}.settings label{color:var(--muted);font-size:12px}.settings input,.settings select{font-size:13px;display:block;margin-top:6px}.statusbar{display:flex;align-items:center;gap:20px;min-height:33px;padding:0 16px;border-top:1px solid var(--line);font:12px system-ui,var(--font);background:#13212c;color:#96aebb}.status-label{margin-right:8px;color:#687f91}.statusbar output{color:#c0d1dc;min-width:190px;display:inline-block;font-variant-numeric:tabular-nums}.status-toggles{display:flex;margin-left:auto;gap:6px;height:26px}.status-toggles button{padding:2px 10px;border-radius:3px;font-size:12px}.version{color:#647d8f}#toast{position:fixed;bottom:63px;left:50%;transform:translateX(-50%);z-index:20;background:#e0f5ee;color:#17362e;border:1px solid #9bbfaf;border-radius:7px;padding:12px 20px;box-shadow:0 10px 30px #0004;max-width:min(600px,90vw);line-height:1.7;display:none}#toast.visible{display:block}dialog{color:var(--text);background:var(--panel);border:1px solid #405565;border-radius:12px;padding:25px;width:min(560px,92vw);max-height:85vh;box-shadow:0 30px 100px #0007}dialog::backdrop{background:#071018bd;backdrop-filter:blur(3px)}dialog h2{font-size:21px;margin:0 0 15px}dialog p,dialog li{line-height:1.8;font-size:14px}dialog label{display:block;color:var(--muted);margin:14px 0}dialog input,dialog select{margin-top:6px}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:22px}.notice{background:#28342e;border:1px solid #536744;border-radius:6px;padding:12px 14px;margin:15px 0;color:#dae8c4;font-size:13px;line-height:1.8}.report{background:#111d28;border:1px solid var(--line);padding:15px;margin:14px 0;border-radius:5px;max-height:200px;overflow:auto;font-size:13px;line-height:1.9}dialog a{color:var(--accent)}#print-sheet{display:none}.loading{pointer-events:none;opacity:.6}.empty-library{font-size:13px;color:var(--muted);line-height:1.8;grid-column:1/-1;padding:15px 2px}@media(max-width:1250px){.workspace{grid-template-columns:195px minmax(200px,1fr) 200px}.topbar{gap:15px;padding:11px 14px}.brand{min-width:174px;font-size:19px}.toolbar{gap:6px;padding:7px 10px}.tool{font-size:12px;padding:8px 6px;gap:4px}.toolbar-end button{font-size:12px;padding:8px}.shortcut{display:none}.key{display:none}}@media(max-width:1000px){.workspace{grid-template-columns:177px minmax(220px,1fr)}.inspector{display:none}.topbar{flex-wrap:wrap;gap:8px}.brand{min-width:150px}.document-meta{max-width:200px}.file-actions{gap:3px}.file-actions button{font-size:12px;padding:8px}.toolgroup .tool{font-size:0;gap:0;padding:7px 10px}.toolgroup .tool span{font-size:21px}.library{padding:14px 10px 0}.statusbar{gap:8px;padding:0 8px}.statusbar output{min-width:120px}.status-label,.version{display:none}.canvas-mode{display:none}}@media(max-width:640px){.workspace{grid-template-columns:113px minmax(160px,1fr)}.brand{font-size:17px;min-width:144px}.brand small{font-size:10px}.document-meta{flex:1}.file-actions{width:100%;justify-content:flex-end}.symbols{grid-template-columns:1fr}.symbol-card{height:77px}.library{padding:12px 8px 0}.library h2{font-size:12px}.library-note,.library-bottom,.library .count{display:none}.library select{font-size:12px;padding:6px 2px}.search{font-size:11px;padding:7px 4px}.statusbar output{min-width:100px;font-size:10px}.statusbar #entity-count{display:none}.status-toggles button{font-size:10px;padding:2px 5px}.toolbar{min-height:48px}.canvas-heading{padding:0 8px;gap:5px}.canvas-heading button{font-size:10px}.commandbar{font-size:11px;padding:7px}#empty-state{width:180px}#empty-state h1{font-size:16px}#empty-state p{font-size:12px}.full{font-size:11px;white-space:normal}.toolbar-end{padding-right:8px}}@media print{body{display:block;height:auto;background:white}body>*:not(#print-sheet){display:none!important}#print-sheet{display:block!important;color:black;background:white}#print-sheet svg{display:block;max-width:none}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}
.property-type{color:var(--accent);margin-bottom:13px;font-size:13px}.property-row{margin-top:6px}#inspector-toggle{display:none}#empty-state[hidden]{display:none!important}.inspector input{font-variant-numeric:tabular-nums}@media(max-width:1000px){#inspector-toggle{display:block;margin-left:2px;color:var(--accent)}body.inspector-open .inspector{display:block;position:absolute;right:0;top:155px;bottom:34px;width:230px;z-index:10;box-shadow:-10px 0 35px #0005;border-left:1px solid #4d686a}.canvas-heading #demo{font-size:11px}}@media(max-width:640px){.canvas-heading #demo{display:none}.canvas-heading{height:38px}.canvas-heading #inspector-toggle{margin-left:auto;font-size:11px}.commandbar{min-height:44px}#empty-state{top:40%;width:160px}.empty-cross{width:42px;height:42px;line-height:38px}.canvas-heading strong{font-size:11px}}