:root{--red:#e5322d;--red-dark:#c9211c;--bg:#f4f4f9;--text:#33333b;--muted:#707078;--border:#e3e3ea;color:var(--text);background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.app{flex-direction:column;min-height:100vh;display:flex}.content{flex-direction:column;flex:1;display:flex}.header{z-index:20;background:#fff;align-items:center;gap:32px;height:60px;padding:0 24px;display:flex;position:sticky;top:0;box-shadow:0 1px 4px #00000014}.logo{align-items:center;gap:6px;font-size:22px;font-weight:800;display:flex}.logo-mark{background:var(--red);color:#fff;letter-spacing:.5px;border-radius:6px;padding:2px 7px}.header nav{gap:22px;display:flex;overflow-x:auto}.header nav a{text-transform:uppercase;white-space:nowrap;color:var(--text);border-bottom:3px solid #0000;padding:20px 0;font-size:14px;font-weight:600}.header nav a:hover,.header nav a.active{color:var(--red);border-bottom-color:var(--red)}.home-hero{text-align:center;padding:56px 20px 28px}.home-hero h1{margin:0 0 14px;font-size:42px;font-weight:700}.home-hero p{color:var(--muted);max-width:760px;margin:0 auto;font-size:20px}.tool-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;width:100%;max-width:1180px;margin:0 auto;padding:20px 24px 60px;display:grid}.tool-card{background:#fff;border:1px solid #0000;border-radius:10px;padding:24px 22px;transition:box-shadow .15s,transform .15s;box-shadow:0 1px 3px #0000000f}.tool-card:hover{transform:translateY(-2px);box-shadow:0 6px 22px #0000001f}.tool-card h3{margin:14px 0 8px;font-size:21px}.tool-card p{color:var(--muted);margin:0;font-size:14px;line-height:1.5}.footer{text-align:center;color:var(--muted);border-top:1px solid var(--border);background:#fff;padding:20px;font-size:13px}.tool-hero{text-align:center;padding:64px 20px}.tool-hero h1{margin:0 0 12px;font-size:42px}.tool-hero .subtitle{color:var(--muted);max-width:760px;margin:0 auto 32px;font-size:22px;line-height:1.4}.btn-select{background:var(--red);color:#fff;border:none;border-radius:12px;min-width:330px;padding:26px 64px;font-size:24px;font-weight:600;box-shadow:0 4px 12px #e5322d59}.btn-select:hover{background:var(--red-dark)}.drop-hint{color:var(--muted);margin-top:14px}.privacy{color:var(--muted);align-items:center;gap:6px;margin-top:40px;font-size:13px;display:inline-flex}.error{color:var(--red-dark);background:#fdecec;border-radius:6px;padding:10px 12px;font-size:14px}.tool-hero .error{display:inline-block}.drop-overlay{z-index:50;color:#fff;pointer-events:none;background:#e5322de0;justify-content:center;align-items:center;font-size:34px;font-weight:700;display:flex;position:fixed;inset:0}.busy-overlay{z-index:40;background:#ffffffbf;flex-direction:column;justify-content:center;align-items:center;gap:16px;font-size:18px;font-weight:600;display:flex;position:fixed;inset:0}.spinner{border:4px solid #f3c6c4;border-top-color:var(--red);border-radius:50%;width:42px;height:42px;animation:.8s linear infinite spin}.spinner.small{border-width:3px;width:24px;height:24px}@keyframes spin{to{transform:rotate(360deg)}}.workspace{flex:none;height:calc(100vh - 60px);display:flex}.workspace-main{flex:1;padding:40px 32px;position:relative;overflow:auto}.btn-add{z-index:5;background:var(--red);color:#fff;border:none;border-radius:50%;width:48px;height:48px;font-size:28px;line-height:1;position:absolute;top:18px;right:22px;box-shadow:0 3px 10px #e5322d66}.sidebar{border-left:1px solid var(--border);background:#fff;flex-direction:column;flex-shrink:0;width:340px;height:100%;display:flex}.sidebar h2{text-align:center;border-bottom:1px solid var(--border);margin:0;padding:22px;font-size:22px}.sidebar-body{flex-direction:column;flex:1;gap:14px;padding:20px;display:flex;overflow:auto}.btn-action{background:var(--red);color:#fff;border:none;border-radius:10px;justify-content:center;gap:10px;margin:18px;padding:18px;font-size:20px;font-weight:600;display:flex}.btn-action:hover:not(:disabled){background:var(--red-dark)}.info{color:#2d4a7a;background:#eef4ff;border-radius:6px;margin:0;padding:12px;font-size:14px;line-height:1.45}.hint{color:var(--muted);margin:0;font-size:13px;line-height:1.45}.field{flex-direction:column;gap:6px;font-size:13px;font-weight:600;display:flex}.field-row .field{flex:1;min-width:0}.field input,.field select,.field textarea{font:inherit;border:1px solid var(--border);background:#fff;border-radius:6px;width:100%;min-width:0;padding:9px 10px;font-size:15px;font-weight:400}.field input[type=checkbox]{width:auto}.field input[type=color]{height:40px;padding:2px}.field-row{gap:12px;display:flex}.check{align-items:center;gap:8px;font-size:14px;display:flex}.segmented{border:1px solid var(--border);border-radius:8px;display:flex;overflow:hidden}.segmented button{color:var(--muted);background:#fff;border:none;flex:1;padding:10px 4px;font-size:13px;font-weight:600}.segmented button.active{color:var(--red);background:#fdecec}.btn-row{gap:8px;display:flex}.btn-secondary{border:1px solid var(--border);background:#fff;border-radius:6px;flex:1;padding:9px;font-size:13px;font-weight:600}.btn-secondary:hover{border-color:var(--red);color:var(--red)}.btn-secondary.danger{color:var(--red-dark)}.thumb-grid{flex-wrap:wrap;place-content:flex-start center;gap:22px;display:flex}.thumb{cursor:grab;background:#fff;border:2px solid #0000;border-radius:8px;width:200px;padding:12px;transition:box-shadow .15s;position:relative;box-shadow:0 1px 4px #0000001a}.thumb-grid.small .thumb{width:160px}.thumb:hover{box-shadow:0 4px 16px #00000026}.thumb.clickable{cursor:pointer}.thumb.selected{border-color:var(--red);background:#fff5f5}.thumb-img{justify-content:center;align-items:center;height:200px;display:flex;overflow:hidden}.thumb-grid.small .thumb-img{height:170px}.thumb-img img{max-width:100%;max-height:100%;box-shadow:0 0 0 1px var(--border);transition:transform .2s}.thumb-label{text-align:center;white-space:nowrap;text-overflow:ellipsis;margin-top:10px;font-size:13px;overflow:hidden}.thumb-sub{color:var(--muted);text-align:center;white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.thumb-actions{opacity:0;z-index:2;gap:4px;transition:opacity .15s;display:flex;position:absolute;top:6px;right:6px}.thumb:hover .thumb-actions{opacity:1}.icon-btn{width:28px;height:28px;color:var(--text);background:#fff;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex;box-shadow:0 1px 4px #00000040}.icon-btn:hover{background:var(--red);color:#fff}.panel{flex-direction:column;gap:12px;display:flex}.panel+.panel,.hint+.panel{border-top:1px solid var(--border);padding-top:14px}.panel-head{cursor:default;justify-content:space-between;align-items:center;gap:8px;display:flex}details.panel>summary{cursor:pointer;list-style:none}details.panel>summary::-webkit-details-marker{display:none}.panel h3{margin:0;font-size:15px}.muted{color:var(--muted);font-size:12px;font-weight:400}.mini-btns{gap:6px;display:flex}.mini-btns button,.toggle-group button,.layer-row button{border:1px solid var(--border);min-width:30px;height:30px;color:var(--text);background:#fff;border-radius:6px;justify-content:center;align-items:center;padding:0 6px;display:inline-flex}.mini-btns button:hover,.toggle-group button:hover:not(:disabled){color:#3d7cf5;border-color:#3d7cf5}.mini-btns button.danger:hover{border-color:var(--red);color:var(--red)}.toggle-group{display:inline-flex}.toggle-group button{border-radius:0;margin-left:-1px;font-size:15px}.toggle-group button:first-child{border-radius:6px 0 0 6px;margin-left:0}.toggle-group button:last-child{border-radius:0 6px 6px 0}.toggle-group button.on{color:#2459d6;background:#e8efff;border-color:#3d7cf5;position:relative}.toggle-group.wide{display:flex}.toggle-group.wide button{flex:1}.style-row{justify-content:space-between;gap:8px;display:flex}.fill-row{align-items:center;gap:8px;height:40px;display:flex}.fill-row input[type=color]{flex:1}.field input[type=range]{accent-color:var(--red);padding:0}.layer-group{flex-direction:column;gap:2px;display:flex}.layer-page{text-transform:uppercase;color:var(--muted);letter-spacing:.5px;margin:4px 0 2px;font-size:11px;font-weight:700}.layer-row{cursor:pointer;background:#fafafc;border:1px solid #0000;border-radius:6px;align-items:center;gap:6px;padding:4px 6px;font-size:13px;display:flex}.layer-row:hover{background:#f0f2f8}.layer-row.selected{background:#e8efff;border-color:#b9cdfc}.layer-row.is-hidden .layer-name,.layer-row.is-hidden .layer-icon{opacity:.4}.layer-grip{color:#b0b0ba;cursor:grab;display:flex}.layer-icon{color:var(--muted);display:flex}.layer-name{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.layer-row button{color:#9a9aa4;background:0 0;border-color:#0000;min-width:24px;height:24px;padding:0}.layer-row button:hover,.layer-row button.on{color:var(--text)}.workspace-main:has(.editor){padding-top:0}.editor-toolbar{z-index:15;border-bottom:1px solid var(--border);background:#fff;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin:0 -32px 20px;padding:8px 16px;display:flex;position:sticky;top:0}.tb-group{flex-wrap:wrap;align-items:center;gap:2px;display:flex}.tb-btn{color:var(--text);background:0 0;border:none;border-radius:6px;flex-direction:column;align-items:center;gap:2px;min-width:44px;padding:5px 7px;display:flex}.tb-btn:hover:not(:disabled){background:#f0f0f5}.tb-btn.active{color:var(--red);background:#fdecec}.tb-label{font-size:10.5px;font-weight:600}.tb-sep{background:var(--border);width:1px;height:26px;margin:0 6px}.tb-zoom{text-align:center;min-width:44px;font-size:13px;font-weight:600}.editor-notice{z-index:14;color:#fff;background:#33333b;border-radius:20px;width:fit-content;margin:-8px auto 12px;padding:7px 14px;font-size:13px;position:sticky;top:64px}.editor-notice.subtle{background:#3d7cf5}.editor{flex-direction:column;align-items:center;gap:12px;padding-bottom:40px;display:flex}.editor-page-wrap{flex-direction:column;align-items:center;gap:6px;display:flex}.editor-page{-webkit-user-select:none;user-select:none;touch-action:none;overflow-clip-margin:8px;background:#fff;flex-shrink:0;position:relative;overflow:clip;box-shadow:0 2px 10px #00000026}.editor-page>img{pointer-events:none;width:100%;height:100%;display:block}.editor.tool-text .editor-page{cursor:text}.editor.tool-rect .editor-page,.editor.tool-ellipse .editor-page,.editor.tool-line .editor-page,.editor.tool-arrow .editor-page,.editor.tool-whiteout .editor-page,.editor.tool-highlight .editor-page,.editor.tool-image .editor-page,.editor.tool-pen .editor-page{cursor:crosshair}.page-num{color:var(--muted);font-size:12px}.el{cursor:move;position:absolute}.editor:not(.tool-select) .el,.editor:not(.tool-select) .el *,.el.locked,.el.locked *{pointer-events:none}.el.editing,.el.editing *{pointer-events:auto}.el.locked{cursor:default}.el.selected:not(.el-line):not(.el-arrow){outline-offset:2px;outline:1.5px solid #3d7cf5}.el.selected.locked{outline-style:dashed}.el-text{white-space:pre;padding:0}.el-whiteout{box-shadow:0 0 0 .5px #0000000f}.el-highlight{mix-blend-mode:multiply}.el-image img{pointer-events:none;width:100%;height:100%;display:block}.el-svg{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.el-line,.el-arrow{pointer-events:none}.el .hit{pointer-events:stroke;cursor:move}.editor:not(.tool-select) .el .hit,.el.locked .hit{pointer-events:none}.inline-text{outline-offset:2px;resize:none;white-space:pre;field-sizing:content;cursor:text;background:#fff9;border:none;outline:1.5px dashed #3d7cf5;min-width:1ch;margin:0;padding:0;display:block;overflow:hidden}.handle{pointer-events:auto;z-index:2;background:#fff;border:1.5px solid #3d7cf5;border-radius:2px;width:10px;height:10px;margin:-5px 0 0 -5px;position:absolute}.handle-nw,.handle-se{cursor:nwse-resize}.handle-ne,.handle-sw{cursor:nesw-resize}.handle-start,.handle-end{cursor:crosshair;border-radius:50%}.text-run{cursor:text;border-radius:2px;outline:1px dashed #3d7cf573;position:absolute}.text-run:hover{background:#3d7cf526;outline:1.5px solid #3d7cf5}@media (width<=900px){.workspace{flex-direction:column;height:auto}.sidebar{border-left:none;border-top:1px solid var(--border);width:100%;height:auto;position:static}.home-hero h1,.tool-hero h1{font-size:30px}.btn-select{width:100%;min-width:0;max-width:360px;padding:20px}}.warn{color:#7a5300;background:#fff6e0;border-radius:6px;margin:0;padding:8px 10px;font-size:12.5px;line-height:1.45}.font-picker{position:relative}.font-picker-btn{text-align:left;border:1px solid var(--border);background:#fff;border-radius:6px;justify-content:space-between;align-items:center;gap:8px;width:100%;padding:8px 10px;font-size:16px;font-weight:400;display:flex}.font-picker-btn span:first-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.font-picker-btn .caret{color:var(--muted);font-family:system-ui,sans-serif;font-size:12px}.font-pop{z-index:30;border:1px solid var(--border);background:#fff;border-radius:8px;flex-direction:column;max-height:440px;display:flex;position:absolute;top:calc(100% + 4px);left:0;right:0;box-shadow:0 10px 30px #0000002e}.font-search{font:inherit;border:1px solid var(--border);border-radius:6px;margin:8px;padding:8px 10px;font-size:14px;font-weight:400}.font-list{padding:0 4px 8px;overflow-y:auto}.font-group-title{text-transform:uppercase;letter-spacing:.4px;color:var(--muted);background:#fff;padding:8px 8px 4px;font-family:system-ui,sans-serif;font-size:11px;font-weight:700;position:sticky;top:0}.font-item{text-align:left;white-space:nowrap;text-overflow:ellipsis;width:100%;color:var(--text);background:0 0;border:none;border-radius:5px;padding:6px 10px;font-size:16px;font-weight:400;display:block;overflow:hidden}.font-item:hover{background:#f0f2f8}.font-item.selected{color:#2459d6;background:#e8efff}.font-action{color:#2459d6;background:#f6f9ff;border:1px dashed #b9cdfc;border-radius:6px;width:calc(100% - 12px);margin:4px 6px;padding:7px;font-size:13px;font-weight:600;display:block}.font-note{color:var(--muted);padding:6px 10px;font-size:12.5px;font-weight:400}.font-note.error{color:var(--red-dark)}.link-btn{color:#2459d6;font:inherit;cursor:pointer;background:0 0;border:none;padding:0;text-decoration:underline}.link-btn:disabled{color:var(--muted);cursor:default}