:root{--ui-bg: #1b1d21;--ui-panel: #232629;--ui-panel-2: #2b2f33;--ui-line: #383c41;--ui-fg: #e8eaed;--ui-muted: #9aa0a6;--ui-primary: #246bfe;--ui-primary-fg: #ffffff;--ui-danger: #e5484d;--ui-ok: #30a46c;--ui-r-sm: 6px;--ui-r-md: 8px;--ui-r-lg: 12px;--ui-sp-1: 4px;--ui-sp-2: 8px;--ui-sp-3: 12px;--ui-sp-4: 16px;--ui-sp-5: 24px;--ui-sp-6: 32px;--ui-text-xs: 11px;--ui-text-sm: 12px;--ui-text-md: 13px;--ui-text-lg: 15px;--ui-ease: cubic-bezier(.16, 1, .3, 1);--pasteboard: #141517}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:Pretendard Variable,-apple-system,Apple SD Gothic Neo,sans-serif;background:var(--ui-bg);color:var(--ui-fg);overflow:hidden;-webkit-font-smoothing:antialiased}.app{height:100%;display:flex;flex-direction:column}.scaffold-bar{display:flex;align-items:center;gap:var(--ui-sp-3);padding:var(--ui-sp-3) var(--ui-sp-4);background:var(--ui-panel);border-bottom:1px solid var(--ui-line);font-size:var(--ui-text-md)}.scaffold-bar h1{font-size:var(--ui-text-lg);font-weight:700}.scaffold-bar button{background:var(--ui-panel-2);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);padding:6px 12px;font-size:var(--ui-text-sm);font-family:inherit;cursor:pointer}.scaffold-bar button.on{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-primary-fg)}.scaffold-meta{margin-left:auto;color:var(--ui-muted);font-size:var(--ui-text-sm)}.gallery{height:100%;overflow-y:auto;padding:var(--ui-sp-6)}.gallery-head h1{font-size:24px;font-weight:800}.gallery-head p{color:var(--ui-muted);font-size:var(--ui-text-md);margin-top:var(--ui-sp-1)}.gallery-sec{margin-top:var(--ui-sp-6)}.gallery-sec h2{font-size:var(--ui-text-lg);font-weight:700;margin-bottom:var(--ui-sp-3)}.gallery-sec h2 small{color:var(--ui-muted);font-weight:400;margin-left:var(--ui-sp-2)}.gallery-sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--ui-sp-3)}.gallery-sec-head h2{margin:0}.theme-pick{font-size:var(--ui-text-sm);color:var(--ui-muted);display:flex;gap:var(--ui-sp-2);align-items:center}.theme-pick select{background:var(--ui-panel-2);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);padding:5px 8px;font-size:var(--ui-text-sm);font-family:inherit}.preset-grid{display:flex;gap:var(--ui-sp-4);flex-wrap:wrap}.preset-card{width:190px;padding:var(--ui-sp-4);background:var(--ui-panel);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-lg);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:var(--ui-sp-2);font-family:inherit;transition:border-color .15s var(--ui-ease)}.preset-card:hover{border-color:var(--ui-primary)}.preset-shape{width:92px;background:var(--ui-panel-2);border:1px solid var(--ui-line);border-radius:var(--ui-r-sm)}.preset-card strong{font-size:var(--ui-text-md)}.preset-card small{color:var(--ui-muted);font-size:var(--ui-text-xs)}.doc-list{list-style:none;display:flex;flex-direction:column;gap:var(--ui-sp-2);max-width:720px}.doc-row{display:flex;gap:var(--ui-sp-2)}.doc-open{flex:1;text-align:left;background:var(--ui-panel);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-md);padding:var(--ui-sp-3) var(--ui-sp-4);cursor:pointer;font-family:inherit;display:flex;flex-direction:column;gap:2px}.doc-open:hover{border-color:var(--ui-primary)}.doc-open strong{font-size:var(--ui-text-md)}.doc-open small{color:var(--ui-muted);font-size:var(--ui-text-xs)}.doc-del{background:transparent;color:var(--ui-muted);border:1px solid var(--ui-line);border-radius:var(--ui-r-md);padding:0 var(--ui-sp-3);cursor:pointer;font-family:inherit;font-size:var(--ui-text-sm)}.doc-del:hover{color:var(--ui-danger);border-color:var(--ui-danger)}.empty{color:var(--ui-muted);font-size:var(--ui-text-md)}.editor{height:100%;display:grid;grid-template-rows:52px 1fr 28px}.ed-body{display:flex;min-height:0}.ed-header{display:flex;align-items:center;gap:var(--ui-sp-2);padding:0 var(--ui-sp-4);background:var(--ui-panel);border-bottom:1px solid var(--ui-line)}.doc-title{background:transparent;border:1px solid transparent;border-radius:var(--ui-r-sm);color:var(--ui-fg);font-family:inherit;font-size:var(--ui-text-md);font-weight:600;padding:5px 8px;min-width:200px}.doc-title:hover{border-color:var(--ui-line)}.doc-title:focus{outline:none;border-color:var(--ui-primary);background:var(--ui-bg)}.hdr-group{display:flex;gap:var(--ui-sp-1);margin-left:var(--ui-sp-2)}.hdr-spacer{margin-left:auto}.btn{background:var(--ui-panel-2);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);padding:6px 12px;font-size:var(--ui-text-sm);font-family:inherit;cursor:pointer}.btn:hover:not(:disabled){background:#343a40}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.primary{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-primary-fg)}.btn.ghost{background:transparent}.ed-rail{width:72px;flex-shrink:0;background:var(--ui-panel);border-right:1px solid var(--ui-line);padding:var(--ui-sp-2);display:flex;flex-direction:column;gap:var(--ui-sp-2)}.rail-btn{background:transparent;color:var(--ui-muted);border:1px solid transparent;border-radius:var(--ui-r-md);padding:var(--ui-sp-2) 0;font-size:var(--ui-text-xs);font-family:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:var(--ui-sp-1)}.rail-btn:hover{background:var(--ui-panel-2);color:var(--ui-fg)}.rail-ico{font-size:18px;font-weight:800}.ed-panel{width:264px;flex-shrink:0;background:var(--ui-panel);border-right:1px solid var(--ui-line);padding:var(--ui-sp-3);overflow-y:auto}.panel-title{font-size:var(--ui-text-sm);font-weight:700;color:var(--ui-muted);margin-bottom:var(--ui-sp-3)}.el-list{list-style:none;display:flex;flex-direction:column;gap:var(--ui-sp-1)}.el-list li{display:flex;gap:var(--ui-sp-1)}.el-list li button:first-child{flex:1;text-align:left;background:var(--ui-panel-2);color:var(--ui-fg);border:1px solid transparent;border-radius:var(--ui-r-sm);padding:6px 8px;font-size:var(--ui-text-sm);font-family:inherit;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.el-list li.on button:first-child{border-color:var(--ui-primary)}.el-list .mini{background:transparent;color:var(--ui-muted);border:none;cursor:pointer;padding:0 6px;font-family:inherit;font-size:var(--ui-text-sm)}.el-list .mini:hover{color:var(--ui-danger)}.ed-status{display:flex;align-items:center;gap:var(--ui-sp-3);padding:0 var(--ui-sp-4);background:var(--ui-panel);border-top:1px solid var(--ui-line);font-size:var(--ui-text-xs);color:var(--ui-muted)}.save-state.dirty,.save-state.saving{color:var(--ui-muted)}.save-state.saved{color:var(--ui-ok)}.save-state.error{color:var(--ui-danger);font-weight:700}.save-error{color:var(--ui-danger)}.dim{color:var(--ui-muted)}.rail-btn.on{background:var(--ui-panel-2);color:var(--ui-fg)}.stack{display:flex;flex-direction:column;gap:var(--ui-sp-2)}.hint{color:var(--ui-muted);font-size:var(--ui-text-xs);line-height:1.6;margin:var(--ui-sp-2) 0}.add-card{background:var(--ui-panel-2);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-md);padding:var(--ui-sp-3);cursor:pointer;font-family:inherit;text-align:left}.add-card:hover{border-color:var(--ui-primary)}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ui-sp-2);margin-top:var(--ui-sp-2)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--ui-sp-1);margin-top:var(--ui-sp-2)}.lib-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:var(--ui-panel-2);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);cursor:pointer;padding:6px}.lib-cell:hover{border-color:var(--ui-primary)}.lib-cell.img{padding:0;overflow:hidden}.lib-cell.img img{width:100%;height:100%;object-fit:cover}.shape-prev{width:70%;height:55%;display:block;color:var(--ui-muted)}.shape-prev.line{height:4px;background:currentColor;align-self:center}.chips{display:flex;flex-wrap:wrap;gap:var(--ui-sp-1);margin-bottom:var(--ui-sp-2)}.chip{background:var(--ui-panel-2);color:var(--ui-muted);border:1px solid var(--ui-line);border-radius:999px;padding:3px 9px;font-size:var(--ui-text-xs);font-family:inherit;cursor:pointer}.chip.on{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-primary-fg)}.theme-card{display:flex;align-items:center;gap:var(--ui-sp-3);text-align:left;background:var(--ui-panel-2);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-md);padding:var(--ui-sp-2) var(--ui-sp-3);cursor:pointer;font-family:inherit}.theme-card.on{border-color:var(--ui-primary)}.theme-card .dots{display:flex;gap:3px}.theme-card .dots i{width:14px;height:14px;border-radius:50%;border:1px solid rgba(255,255,255,.18)}.theme-name{display:flex;flex-direction:column}.theme-name strong{font-size:var(--ui-text-sm)}.theme-name small{color:var(--ui-muted);font-size:var(--ui-text-xs)}.ed-inspector{width:288px;flex-shrink:0;background:var(--ui-panel);border-left:1px solid var(--ui-line);padding:var(--ui-sp-3);overflow-y:auto}.insp-sec{padding:var(--ui-sp-3) 0;border-bottom:1px solid var(--ui-line);display:flex;flex-direction:column;gap:var(--ui-sp-2)}.insp-sec:last-child{border-bottom:0}.sec-label{font-size:var(--ui-text-xs);font-weight:700;color:var(--ui-muted)}.insp-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--ui-sp-2)}.insp-row{display:flex;align-items:center;gap:var(--ui-sp-2);font-size:var(--ui-text-xs);color:var(--ui-muted)}.insp-row>span:first-child{min-width:42px}.insp-row input[type=number],.insp-row select{width:100%;min-width:0;background:var(--ui-bg);color:var(--ui-fg);border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);padding:4px 6px;font-size:var(--ui-text-sm);font-family:inherit}.insp-row input[type=color]{width:30px;height:26px;padding:2px;background:var(--ui-bg);border:1px solid var(--ui-line);border-radius:var(--ui-r-sm)}.color-pick{display:flex;gap:var(--ui-sp-1);align-items:center;width:100%}.val{color:var(--ui-fg);font-size:var(--ui-text-sm)}.btn-row{display:flex;gap:var(--ui-sp-1);flex-wrap:wrap}.btn.mini{padding:3px 8px;font-size:var(--ui-text-xs)}.btn.mini.on{background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-primary-fg)}.btn.wide{width:100%}.btn.danger{background:#3a1b1d;border-color:#5c2427;color:#ffb4b4}.note{font-size:var(--ui-text-xs);color:var(--ui-muted);background:var(--ui-bg);border-radius:var(--ui-r-sm);padding:6px 8px;line-height:1.6}.note.warn{color:#ffcf8f;border:1px solid #5c4524;display:flex;flex-direction:column;gap:6px;align-items:flex-start}.img-missing{color:var(--ui-muted);font-size:14px;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(236px,1fr));gap:var(--ui-sp-4)}.tpl-card{background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:var(--ui-r-lg);padding:var(--ui-sp-2);cursor:pointer;font-family:inherit;color:var(--ui-fg);display:flex;flex-direction:column;gap:var(--ui-sp-2);text-align:left;position:relative;transition:border-color .15s var(--ui-ease)}.tpl-card:hover{border-color:var(--ui-primary)}.tpl-card.my{padding-bottom:var(--ui-sp-2)}.tpl-open{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:var(--ui-sp-2)}.thumb{overflow:hidden;border-radius:var(--ui-r-md);background:#fff;flex-shrink:0}.tpl-meta{display:flex;flex-direction:column;gap:2px;padding:0 var(--ui-sp-1) var(--ui-sp-1)}.tpl-meta strong{font-size:var(--ui-text-sm)}.tpl-meta small{color:var(--ui-muted);font-size:var(--ui-text-xs)}.tpl-card.my .doc-del{position:absolute;right:8px;top:8px;background:#0000008c;padding:2px 8px;font-size:var(--ui-text-xs)}.ed-center{flex:1;min-width:0;display:flex;flex-direction:column}.page-strip{flex-shrink:0;display:flex;align-items:flex-start;gap:var(--ui-sp-2);padding:var(--ui-sp-2) var(--ui-sp-3);background:var(--ui-panel);border-top:1px solid var(--ui-line);overflow-x:auto}.page-item{display:flex;flex-direction:column;gap:3px;align-items:center;flex-shrink:0}.page-thumb{position:relative;background:transparent;border:2px solid transparent;border-radius:var(--ui-r-sm);padding:2px;cursor:pointer}.page-item.on .page-thumb{border-color:var(--ui-primary)}.page-num{position:absolute;left:4px;bottom:4px;background:#0009;color:#fff;font-size:10px;padding:0 4px;border-radius:3px}.page-acts{display:flex;gap:2px}.page-acts .btn.mini{padding:1px 4px;font-size:9px}.page-add{flex-shrink:0;align-self:center;background:transparent;color:var(--ui-muted);border:1px dashed var(--ui-line);border-radius:var(--ui-r-md);padding:var(--ui-sp-3) var(--ui-sp-4);font-size:var(--ui-text-xs);font-family:inherit;cursor:pointer}.page-add:hover{border-color:var(--ui-primary);color:var(--ui-fg)}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;z-index:100;display:flex;align-items:center;justify-content:center}.modal{width:420px;background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:var(--ui-r-lg);box-shadow:0 20px 60px #00000080}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:var(--ui-sp-4);border-bottom:1px solid var(--ui-line)}.modal-body{padding:var(--ui-sp-4);display:flex;flex-direction:column;gap:var(--ui-sp-3)}.modal-foot{display:flex;justify-content:flex-end;gap:var(--ui-sp-2);padding:var(--ui-sp-3) var(--ui-sp-4);border-top:1px solid var(--ui-line)}.field{display:flex;align-items:center;gap:var(--ui-sp-3);font-size:var(--ui-text-sm);color:var(--ui-muted)}.field>span:first-child{min-width:44px}.seg{display:flex;gap:0;border:1px solid var(--ui-line);border-radius:var(--ui-r-sm);overflow:hidden}.seg button{background:var(--ui-panel-2);color:var(--ui-fg);border:0;border-right:1px solid var(--ui-line);padding:6px 14px;font-size:var(--ui-text-sm);font-family:inherit;cursor:pointer}.seg button:last-child{border-right:0}.seg button.on{background:var(--ui-primary);color:var(--ui-primary-fg)}.seg button:disabled{opacity:.5;cursor:not-allowed}.out-spec{font-size:var(--ui-text-sm);color:var(--ui-fg)}.note.ok{color:#9be7bf;border:1px solid #2d6a4a}.artboard-stage{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--pasteboard);position:relative}.artboard-scaler{flex-shrink:0;transform-origin:center center}.artboard{position:relative;overflow:hidden;box-shadow:0 8px 40px #00000080}.el{position:absolute;box-sizing:border-box}.el-text{white-space:pre-wrap;word-break:break-word;overflow:visible}.el-image img{width:100%;height:100%;display:block}.el-icon svg{width:100%;height:100%;display:block}