:root{--line:#1f6feb;--dark:#0b3d91;--mid:#9dc1f7;--light:#dce9fd;--lighter:#eef4fe;--bg:#f8fbff;--ink:#0b3d91}*{box-sizing:border-box}#__nuxt,body,html{background:var(--bg);min-height:100%;color:var(--ink);margin:0;font-family:Noto Sans Mono CJK SC,Noto Sans Mono,WenQuanYi Micro Hei Mono,ui-monospace,monospace}button,select,textarea{font:inherit}button{cursor:pointer}.app{flex-direction:column;min-height:100vh}.app,.brand,.controls,.top{display:flex}.top{border-bottom:3px dashed var(--line);background:var(--lighter);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 20px;padding:16px 20px}.brand{flex-direction:column;gap:2px}.brand h1{letter-spacing:2px;margin:0;font-size:20px;font-weight:700}.brand p{letter-spacing:1px;color:var(--line);margin:0;font-size:12px}.controls{flex-wrap:wrap;align-items:center;gap:8px}.btn,.chip{border:2px solid var(--line);background:var(--bg);color:var(--line);letter-spacing:1px;padding:6px 12px}.btn.primary,.chip[data-on=true]{background:var(--line);color:var(--bg)}.btn:disabled{opacity:.45;cursor:not-allowed}.main{flex:1;grid-template-columns:minmax(280px,1fr) minmax(320px,1.3fr);gap:0;display:grid}.main,.pane{min-height:0}.pane{border-right:3px dashed var(--line);flex-direction:column;display:flex}.pane:last-child{border-right:0}.pane-head{letter-spacing:2px;justify-content:space-between;gap:8px;font-size:12px}.examples,.pane-head{border-bottom:2px solid var(--light);padding:10px 16px;display:flex}.examples{gap:6px;overflow-x:auto}.examples button{border:2px solid var(--mid);background:var(--bg);color:var(--dark);flex:none;padding:6px 10px;font-size:12px}.examples button[data-on=true]{border-color:var(--line);background:var(--light)}textarea.editor{resize:none;background:var(--bg);min-height:280px;color:var(--dark);border:0;outline:none;flex:1;padding:16px;line-height:1.45}.preview{background:linear-gradient(var(--lighter) 1px,transparent 1px),linear-gradient(90deg,var(--lighter) 1px,transparent 1px);background-size:24px 24px;flex:1;padding:16px;overflow:auto}.preview svg{background:var(--bg);border:2px solid var(--light);width:100%;height:auto;display:block}.state{border:2px dashed var(--mid);color:var(--line);letter-spacing:1px;padding:28px 20px}.state.error{border-color:var(--dark);background:var(--lighter)}.warns{color:var(--dark);border-top:2px solid var(--light);padding:8px 16px;font-size:12px}@media (width<=860px){.main{grid-template-columns:1fr}.pane{border-right:0;border-bottom:3px dashed var(--line)}}
