@import "https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;600;700&display=swap";:root{color:#121316;font-synthesis:none;text-rendering:optimizelegibility;background:#efefef;font-family:Roboto Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer;border:0}button:disabled{cursor:not-allowed;opacity:.36}.app{background:linear-gradient(#0000000d,#0000 220px),#f3f3f3;min-height:100vh;padding:16px}.site-header,.filebar,.specimen-board,.editor-grid{max-width:1480px;margin:0 auto}.site-header{justify-content:space-between;align-items:center;gap:24px;min-height:58px;display:flex}.brand{letter-spacing:-.04em;font-size:clamp(1.75rem,3vw,2.55rem)}nav{align-items:center;gap:16px;display:flex}nav button,.save-strip button{color:#17181b;background:#f8f8f8;border:1px solid #dedede;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:38px;padding:0 16px;display:inline-flex;box-shadow:0 1px 1px #0000000a}nav button.active,.save-strip button.dark{color:#f7f7f7;background:#0d0e12;border-color:#0d0e12}.filebar{border-bottom:1px solid #d7d7d7;grid-template-columns:minmax(420px,1fr) auto;align-items:center;gap:14px;padding:22px 0 28px;display:grid}.font-title{color:#111216;letter-spacing:-.05em;background:#e7e7e7;border:0;border-radius:0;outline:none;width:100%;padding:9px 12px;font-size:clamp(1.8rem,3.2vw,2.75rem);font-weight:800}.meta-strip,.save-strip{align-items:center;gap:10px;display:flex}.meta-strip{grid-column:1/-1}.meta-strip label{color:#777;text-transform:uppercase;gap:4px;min-width:0;font-size:.72rem;display:grid}.meta-strip input{color:#16171a;background:#fbfbfb;border:1px solid #d4d4d4;border-radius:7px;outline:none;width:150px;padding:9px 10px}.save-strip{color:#565656;white-space:nowrap;justify-content:flex-end;font-size:.9rem}.specimen-board{background:#f8f8f8;border:1px solid #d5d5d5;border-radius:14px;margin-top:18px;overflow:hidden}.specimen-input{color:#17181a;background:#eee;border:0;border-bottom:1px solid #dedede;outline:none;width:100%;padding:16px 24px}.specimen-preview{flex-wrap:wrap;align-items:flex-end;min-height:132px;padding:24px 28px 18px;display:flex;overflow:hidden}.specimen-mini{border-top:1px solid #e7e7e7;flex-wrap:nowrap;align-items:flex-end;gap:1px;min-height:42px;padding:8px 28px 16px;display:flex;overflow:hidden}.live-char{color:#b9b9b9;place-items:end center;width:.7em;height:1.18em;font-family:Roboto Mono,ui-monospace,monospace;font-size:clamp(2.6rem,5.5vw,5.4rem);line-height:1;display:inline-grid}.live-char.compact{width:.58em;height:1.05em;font-size:1.35rem}.live-char.space{width:.42em}.live-char.drawn svg{width:96%;height:100%;overflow:visible}.live-char.drawn polygon{fill:#08090b}.editor-grid{grid-template-columns:56px 220px minmax(420px,1fr) 280px;gap:14px;margin-top:28px;display:grid}.tool-rail,.control-card,.stage,.glyph-list{background:#fbfbfb;border:1px solid #d5d5d5;border-radius:14px}.tool-rail{flex-direction:column;align-items:center;gap:8px;padding:12px 8px;display:flex}.tool-rail button{aspect-ratio:1;color:#8a8a8a;background:0 0;border-radius:8px;place-items:center;width:36px;display:grid}.tool-rail button.active{color:#f8f8f8;background:#090a0c}.control-card{align-content:start;gap:22px;padding:22px;display:grid}.range-row{color:#242529;gap:12px;font-size:.94rem;font-weight:800;display:grid}input[type=range]{accent-color:#111216;width:100%}.style-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.style-grid button{color:#8a8a8a;background:#f7f7f7;border:1px solid #d8d8d8;border-radius:9px;min-height:36px;font-weight:800}.style-grid button.selected{color:#15161a;border-color:#141519}.stage{align-content:start;gap:10px;padding:18px;display:grid;position:relative}.stage-head{color:#111216;grid-template-columns:1fr auto 1fr;align-items:center;font-weight:900;display:grid}.stage-head span{color:#f7f7f7;background:#111216;border-radius:4px;place-items:center;width:18px;height:18px;font-size:.72rem;display:inline-grid}.stage-head span:last-child{justify-self:end}.stage-head strong{font-size:1.2rem}canvas{aspect-ratio:1;cursor:crosshair;touch-action:none;background:#fafafa;border:1px solid #c9c9c9;border-radius:12px;justify-self:center;width:min(100%,66vh);max-width:760px}.guide-labels{color:#8b8b8b;text-transform:uppercase;grid-template-columns:repeat(4,1fr);gap:8px;font-size:.72rem;font-weight:800;display:grid}.glyph-list{align-content:start;gap:16px;max-height:72vh;padding:14px 10px;display:grid;overflow:auto}.glyph-list div{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;display:grid}.glyph-list p{color:#777;grid-column:1/-1;margin:0 0 8px;font-size:.82rem;font-weight:900}.glyph-list button{color:#1c1d21;background:#f4f4f4;border:1px solid #ddd;border-radius:8px;place-items:center;width:100%;min-height:34px;margin:0;font-size:1.35rem;font-weight:900;display:grid}@media (width>=1360px){.editor-grid{grid-template-columns:64px 260px minmax(420px,1fr) 360px}.glyph-list div{grid-template-columns:repeat(6,minmax(0,1fr))}}.glyph-list button.selected,.glyph-list button.done{color:#f9f9f9;background:#08090b;border-color:#08090b}@media (width<=1120px){.filebar,.editor-grid{grid-template-columns:1fr}.meta-strip,.save-strip{flex-wrap:wrap;justify-content:flex-start}.tool-rail{flex-direction:row;overflow-x:auto}.glyph-list{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none}}@media (width<=640px){.app{padding:10px}.site-header{flex-direction:column;align-items:flex-start;gap:10px}.meta-strip input,.meta-strip label{width:100%}.specimen-preview{min-height:104px;padding:18px}.live-char{font-size:2.6rem}.control-card,.stage{padding:14px}.guide-labels{grid-template-columns:repeat(2,1fr)}}