:root{--bg:#f6f8fb;--panel:#fff;--line:#dfe6f2;--muted:#64748b;--text:#0f1b35;--blue:#2f6df6;--violet:#6655f6;--soft-blue:#edf3ff;--danger:#ef4444}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);letter-spacing:0;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font:inherit}button{background:linear-gradient(135deg, var(--blue), var(--violet));color:#fff;cursor:pointer;border:0;border-radius:8px;font-weight:700}.app-shell{grid-template-columns:260px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{border-right:1px solid var(--line);background:#fbfdff;flex-direction:column;gap:28px;padding:24px 20px;display:flex}.brand,.title-row,.actions,.panel-header,.layer-row{align-items:center;display:flex}.brand{gap:12px;font-size:20px}.brand-mark{grid-template-columns:repeat(2,13px);gap:3px;display:grid}.brand-mark span{border-radius:10px;width:13px;height:26px}.brand-mark span:first-child{background:#ff4fb3}.brand-mark span:nth-child(2){background:#6b5cff}.brand-mark span:nth-child(3){background:#ffd43b}.brand-mark span:nth-child(4){background:#35c66f}.nav-list{gap:8px;display:grid}.nav-list a{color:#38506f;border-radius:8px;align-items:center;gap:12px;min-height:46px;padding:0 14px;text-decoration:none;display:flex}.nav-list a.active{color:#1f55ef;background:#eef3ff;font-weight:700}.nav-icon,.bolt{width:26px;height:26px;color:var(--blue);background:#eaf0ff;border-radius:7px;place-items:center;font-weight:800;display:grid}.sidebar-note{gap:10px;margin-top:auto;line-height:1.45;display:grid}.sidebar-note p,.topbar p,.export-panel p{color:var(--muted);margin:0}.font-picker{grid-template-columns:220px 220px;gap:12px;margin-top:16px;display:grid}.workspace{min-width:0;padding:28px 24px}.topbar{justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:24px;display:flex}.back-link{color:#1f4788;text-decoration:none}h1,h2{margin:0}h1{font-size:30px;line-height:1.2}h2{font-size:16px}.title-row{gap:16px;margin:12px 0 8px}.saved{color:#16854d;background:#dbf7e8;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:800}.actions{gap:12px}.actions button,.panel-header button,.export-panel button{min-height:44px;padding:0 22px}.secondary,.icon-button,.mini-toolbar button{border:1px solid var(--line);color:var(--text);background:#fff}.icon-button{width:44px;padding:0}.editor-grid,.bottom-grid{gap:16px;display:grid}.editor-grid{grid-template-columns:330px minmax(520px,1fr) 330px;align-items:start}.bottom-grid{grid-template-columns:minmax(0,1fr) 380px;margin-top:16px}.panel{border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:20px;box-shadow:0 14px 34px #0f1b350d}.tabs{color:var(--muted);grid-template-columns:repeat(4,1fr);gap:4px;margin:16px 0;font-size:13px;display:grid}.tabs button{min-height:34px;color:var(--muted);background:0 0;border:0;font-size:13px;font-weight:700}.tabs button.active{background:var(--soft-blue);color:var(--blue);text-align:center;border-radius:999px;padding:8px 0}.character-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.character-grid button{aspect-ratio:1;border:1px solid var(--line);color:var(--text);background:#fff;font-size:24px;position:relative}.character-grid button.selected{border:2px solid var(--blue)}.character-grid i{background:#ffbf2e;border-radius:50%;width:7px;height:7px;position:absolute;bottom:8px;right:8px}.panel-header{justify-content:space-between;gap:16px;margin-bottom:12px}.mini-toolbar{gap:8px;display:flex}.mini-toolbar button{min-height:36px;padding:0 12px;font-size:13px}.quick-add{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:12px;display:grid}.quick-add button,.upload-button{border:1px solid var(--line);color:#1f4788;cursor:pointer;background:#fff;border-radius:8px;place-items:center;min-height:38px;font-size:13px;font-weight:700;display:grid}.upload-button input{opacity:0;pointer-events:none;width:1px;min-height:1px;position:absolute}.canvas-body{grid-template-columns:64px minmax(0,1fr);gap:16px;display:grid}.tool-rail{gap:8px;display:grid}.tool-rail button{color:#425675;background:#f3f6fb;border:1px solid #0000;min-height:54px;font-size:12px}.tool-rail button.active{color:var(--blue);background:#edf3ff;border-color:#d5e0ff}.canvas{border:1px solid var(--line);background-color:#fff;background-image:linear-gradient(45deg,#eef3fb 25%,#0000 25%),linear-gradient(-45deg,#eef3fb 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#eef3fb 75%),linear-gradient(-45deg,#0000 75%,#eef3fb 75%);background-position:0 0,0 12px,12px -12px,-12px 0;background-size:24px 24px;border-radius:8px;place-items:center;min-height:486px;display:grid}.selection-box{aspect-ratio:1;border:2px solid var(--blue);background:#ffffff61;place-items:center;width:min(72%,420px);display:grid}.glyph-art{filter:drop-shadow(0 12px #2f6df61f);touch-action:none;-webkit-user-select:none;user-select:none;width:82%;overflow:visible}.glyph-art.small{pointer-events:none;width:90px;min-width:64px}.canvas-object{cursor:pointer}.canvas-object.moveable{cursor:grab}.canvas-object.moveable:active{cursor:grabbing}.selection-handles{pointer-events:none}.resize-handle,.rotate-handle{fill:#fff;stroke:#2f6df6;stroke-width:2px;pointer-events:all}.resize-handle{cursor:nwse-resize}.rotate-handle{cursor:grab}.layers-table{gap:8px;margin-top:16px;display:grid}.layer-row{border:1px solid var(--line);color:#52637d;text-align:left;background:#fff;border-radius:8px;gap:12px;width:100%;min-height:42px;padding:0 12px;font-weight:600}.selected-layer{border-color:var(--blue);background:#f4f8ff}.swatch{border-radius:6px;width:20px;height:20px}.layer-row code{color:#64748b;margin-left:auto}.properties,.export-panel{gap:16px;display:grid}label{color:#52637d;gap:8px;font-size:13px;font-weight:700;display:grid}input,select{border:1px solid var(--line);width:100%;min-height:44px;color:var(--text);background:#fff;border-radius:8px;padding:0 14px}.form-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.danger{min-height:44px;color:var(--danger);background:#fff;border:1px solid #fecaca}.danger:disabled{cursor:not-allowed;opacity:.45}.helper-text{color:var(--muted);background:#f6f8fb;border-radius:8px;margin:0;padding:12px;font-size:13px;line-height:1.4}.preview-panel input{margin-bottom:18px}.font-preview{background:linear-gradient(#fff,#f2f6fc);border-radius:8px;align-items:center;gap:8px;min-height:150px;padding:20px;display:flex;overflow:hidden}.space{width:42px}.option{border:1px solid var(--line);color:var(--text);border-radius:8px;padding:18px}.option input{width:auto;min-height:auto;margin-right:10px}.option.checked{border-color:var(--blue)}.inline-check{align-items:center;gap:10px;display:flex}.inline-check input{width:18px;min-height:18px}.export-panel p{color:#1f62d0;background:#eaf4ff;border-radius:8px;padding:14px;font-size:13px}@media (max-width:1180px){.app-shell{grid-template-columns:1fr}.sidebar{display:none}.editor-grid,.bottom-grid{grid-template-columns:1fr}}@media (max-width:760px){.workspace{padding:18px 12px}.topbar{display:grid}.actions{flex-wrap:wrap}.font-picker,.quick-add,.canvas-body{grid-template-columns:1fr}.tool-rail{grid-template-columns:repeat(4,1fr)}.canvas{min-height:360px}.character-grid{grid-template-columns:repeat(5,1fr)}}