:root{color:#172033;background:#f5f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.app-shell{min-height:100vh;padding:20px}.topbar{align-items:center;display:flex;gap:16px;justify-content:space-between;margin:0 auto 18px;max-width:1440px}.eyebrow{color:#64748b;font-size:12px;font-weight:700;letter-spacing:0;margin:0 0 4px;text-transform:uppercase}h1,h2{letter-spacing:0;margin:0}h1{color:#0f172a;font-size:28px;line-height:1.15}h2{color:#172033;font-size:18px;line-height:1.25;overflow-wrap:anywhere}.page-indicator{color:#64748b;font-size:13px;margin:6px 0 0}.page-watermark-toggle{align-items:center;color:#475569;display:inline-flex;font-size:13px;gap:8px;margin-top:8px}.page-watermark-toggle input{accent-color:#2563eb}.watermark-exit-row{align-items:center;border-bottom:1px solid #e2e8f0;display:flex;justify-content:center;padding:10px 16px}.exit-watermark-button{align-items:center;background:#dc2626;border:0;border-radius:8px;color:#fff;display:inline-flex;font-size:13px;font-weight:700;gap:6px;justify-content:center;min-height:32px;padding:0 10px}.exit-watermark-button:hover{background:#b91c1c}.account{align-items:center;display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.quota-pill{align-items:center;background:#fff;border:1px solid #d9e2ef;border-radius:999px;display:flex;gap:8px;padding:8px 12px}.quota-pill span{color:#64748b;font-size:13px}.primary-button,.ghost-button,.tool-button,.tool-command{border:0;border-radius:8px;min-height:40px;padding:0 14px}.action-button{align-items:center;display:inline-flex;gap:7px;justify-content:center}.action-button svg,.tool-button svg,.thumb-card button svg,.upload-icon svg{flex:0 0 auto}.primary-button{background:#2563eb;color:#fff;font-weight:700}.primary-button:hover{background:#1d4ed8}.ghost-button,.tool-button,.tool-command{background:#fff;border:1px solid #d9e2ef;color:#172033}.ghost-button:hover,.tool-button:hover,.tool-command:hover{border-color:#94a3b8}.ghost-button.danger,.tool-command.danger{color:#dc2626}.compact{min-height:36px}.hidden-input{display:none}.workspace{display:grid;gap:16px;grid-template-columns:280px minmax(0,1fr) 240px;margin:0 auto;max-width:1440px}.queue-panel,.editor-panel,.tool-panel{background:#fff;border:1px solid #d9e2ef;border-radius:8px;min-width:0}.queue-panel{display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 112px);overflow:hidden;padding:12px}.upload-zone{align-items:center;background:#eef6ff;border:1px dashed #60a5fa;border-radius:8px;color:#1e3a8a;display:grid;gap:6px;justify-items:center;min-height:142px;padding:18px}.upload-zone.active{background:#dbeafe}.upload-zone input{display:none}.blank-page-action{align-items:center;background:#fff;border:1px solid #d9e2ef;border-radius:8px;color:#172033;display:inline-flex;gap:8px;height:38px;justify-content:center;width:100%}.blank-page-action:hover{border-color:#2563eb;color:#1d4ed8}.blank-page-action:disabled{cursor:not-allowed;opacity:.5}.primary-page-action{background:#2563eb;border-color:#2563eb;color:#fff}.primary-page-action:hover:not(:disabled){background:#1d4ed8;border-color:#1d4ed8;color:#fff}.queue-check{align-items:center;color:#475569;display:inline-flex;font-size:13px;gap:8px}.queue-check input{accent-color:#2563eb}.upload-icon{align-items:center;background:#2563eb;border-radius:999px;color:#fff;display:inline-flex;font-size:28px;height:42px;justify-content:center;line-height:1;width:42px}.queue-actions{display:grid;gap:8px;grid-template-columns:repeat(5,minmax(0,1fr))}.icon-command{align-items:center;background:#fff;border:1px solid #d9e2ef;border-radius:8px;color:#172033;display:inline-flex;height:40px;justify-content:center;padding:0}.icon-command:hover{border-color:#94a3b8}.icon-command.active{background:#eef6ff;border-color:#2563eb;color:#1d4ed8}.icon-command:disabled{cursor:not-allowed;opacity:.45}.icon-command.danger{color:#dc2626}.icon-command.primary-icon{background:#2563eb;border-color:#2563eb;color:#fff}.icon-command.primary-icon:hover{background:#1d4ed8;border-color:#1d4ed8}.upload-zone small{color:#64748b}.page-settings{background:#f8fafc;border:1px solid #d9e2ef;border-radius:8px;display:grid;gap:10px;padding:10px}.settings-toggle{align-items:center;background:transparent;border:0;color:#172033;display:inline-flex;font-weight:800;gap:8px;justify-content:flex-start;min-height:32px;padding:0}.settings-grid{display:grid;gap:10px}.settings-grid label{color:#475569;display:grid;font-size:13px;font-weight:700;gap:6px}.settings-grid select{background:#fff;border:1px solid #cbd5e1;border-radius:6px;color:#172033;min-height:36px;padding:0 8px}.thumb-list{display:grid;gap:10px;overflow:auto;padding-right:2px}.thumb-card{align-items:center;border:1px solid #e2e8f0;border-radius:8px;display:grid;gap:10px;grid-template-columns:56px minmax(0,1fr) 30px;padding:8px}.thumb-card.selected{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1f}.thumb-card img{aspect-ratio:1;background:#f1f5f9;border-radius:6px;object-fit:cover;width:56px}.thumb-card div{min-width:0}.thumb-card strong{display:block;font-size:13px}.thumb-card span{color:#64748b;display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.thumb-card button{align-items:center;background:transparent;border:0;color:#94a3b8;display:inline-flex;font-size:22px;height:30px;justify-content:center;padding:0}.editor-panel{display:flex;flex-direction:column;min-height:calc(100vh - 112px);overflow:hidden}.editor-head{align-items:center;border-bottom:1px solid #e2e8f0;display:flex;gap:12px;justify-content:space-between;padding:14px 16px}.editor-actions{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.zoom-readout{color:#475569;font-size:13px;font-weight:800;min-width:46px;text-align:center}.tool-button{font-size:18px;padding:0;width:40px}.tool-button.text-tool{font-size:13px;font-weight:700;width:48px}.canvas-wrap{align-items:center;background:linear-gradient(45deg,#e5e7eb 25%,transparent 25%),linear-gradient(-45deg,#e5e7eb 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e5e7eb 75%),linear-gradient(-45deg,transparent 75%,#e5e7eb 75%);background-color:#f8fafc;background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;display:flex;flex:1;justify-content:center;overflow:hidden;padding:18px}.canvas-wrap.scrollable{overflow:auto}.konva-editor{background:transparent;line-height:0}.canvas-wrap.editing-canvas .konva-editor .konvajs-content{touch-action:none}.canvas-wrap:not(.editing-canvas) .konva-editor .konvajs-content{touch-action:pan-y}.empty-state{align-items:center;color:#64748b;display:flex;flex:1;justify-content:center;min-height:360px}.tool-panel{align-content:start;display:grid;gap:14px;max-height:calc(100vh - 112px);overflow:auto;padding:12px}.tool-group{display:grid;gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}.tool-command.active{background:#e0f2fe;border-color:#38bdf8;color:#075985;font-weight:700}.secondary-panel{background:#f8fafc;border:1px solid #d9e2ef;border-radius:8px;display:grid;gap:10px;padding:10px}.secondary-title{color:#334155;font-size:13px;font-weight:800}.crop-adjust{display:grid;gap:6px;grid-template-columns:repeat(2,minmax(0,1fr))}.crop-adjust button{background:#fff;border:1px solid #d9e2ef;border-radius:6px;color:#334155;min-height:34px;padding:0 8px}.draw-tools{display:grid;gap:10px}.draw-tools label,.login-panel label{color:#475569;display:grid;font-size:13px;font-weight:700;gap:7px}.draw-tools input[type=color]{background:transparent;border:0;height:40px;padding:0;width:100%}.draw-tools input[type=range]{width:100%}.draw-tools select{background:#fff;border:1px solid #cbd5e1;border-radius:8px;color:#172033;min-height:38px;padding:0 10px;width:100%}.draw-tools .check-row{align-items:center;display:flex;flex-direction:row;gap:8px}.draw-tools .check-row input{height:16px;width:16px}.draw-tools textarea{border:1px solid #cbd5e1;border-radius:8px;color:#172033;min-height:78px;padding:8px 10px;resize:vertical;width:100%}.mini-actions{display:flex;gap:8px}.mini-actions button{background:#eef6ff;border:1px solid #bfdbfe;border-radius:6px;color:#1d4ed8;font-size:12px;padding:6px 8px}.tool-hint{color:#64748b;font-size:13px;line-height:1.5;margin:0}.layers-panel{background:#f8fafc;border:1px solid #d9e2ef;border-radius:8px;display:grid;gap:10px;padding:10px}.layers-head{align-items:center;display:flex;gap:10px;justify-content:space-between}.layers-head span{align-items:center;color:#334155;display:inline-flex;font-size:13px;font-weight:800;gap:6px}.layer-actions{display:flex;gap:4px}.layer-actions button,.layer-row-actions span{align-items:center;background:#fff;border:1px solid #d9e2ef;border-radius:6px;color:#475569;display:inline-flex;height:28px;justify-content:center;padding:0;width:28px}.layer-list{display:grid;gap:6px;max-height:260px;overflow:auto}.layer-row{align-items:center;background:#fff;border:1px solid #e2e8f0;border-radius:7px;color:#172033;display:grid;gap:8px;grid-template-columns:42px minmax(0,1fr) auto;min-height:42px;padding:6px 8px;text-align:left}.layer-row.active{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1f}.layer-row.hidden{opacity:.58}.layer-row.base-layer{cursor:default;opacity:.72}.layer-kind{background:#eef2ff;border-radius:999px;color:#3730a3;font-size:11px;font-weight:800;justify-self:start;padding:4px 7px}.layer-row strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-row-actions{display:flex;gap:4px}.generate{min-height:48px;width:100%}.progress-panel{background:#f8fafc;border:1px solid #d9e2ef;border-radius:8px;display:grid;gap:8px;padding:10px}.progress-panel div{align-items:center;color:#475569;display:flex;font-size:13px;justify-content:space-between}.progress-panel progress{accent-color:#2563eb;height:10px;width:100%}.status-message,.form-message{color:#475569;font-size:13px;margin:0}.modal-backdrop{align-items:center;background:#0f172a7a;display:flex;top:0;right:0;bottom:0;left:0;justify-content:center;padding:20px;position:fixed;z-index:20}.confirm-backdrop{align-items:center;background:#0f172a6b;display:flex;top:0;right:0;bottom:0;left:0;justify-content:center;padding:20px;position:fixed;z-index:30}.confirm-panel{background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 24px 80px #0f172a47;display:grid;gap:12px;max-width:380px;padding:22px;text-align:center;width:100%}.confirm-icon{align-items:center;background:#fee2e2;border-radius:999px;color:#dc2626;display:inline-flex;font-size:24px;font-weight:800;height:48px;justify-content:center;justify-self:center;width:48px}.confirm-icon.success-icon{background:#dbeafe;color:#2563eb}.settings-dialog{background:#fff;border:1px solid #e2e8f0;border-radius:8px;box-shadow:0 24px 80px #0f172a47;display:grid;gap:16px;max-width:420px;padding:22px;width:100%}.dialog-head{align-items:flex-start;display:flex;gap:16px;justify-content:space-between}.dialog-head h2,.confirm-panel h2{font-size:20px}.confirm-panel p{color:#64748b;font-size:14px;line-height:1.6;margin:0}.watermark-intro{text-align:left}.watermark-intro .confirm-icon,.watermark-intro h2{justify-self:center;text-align:center}.watermark-intro ul{color:#475569;display:grid;font-size:14px;gap:8px;line-height:1.5;margin:0;padding-left:18px}.confirm-actions{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:4px}.dialog-field{color:#475569;display:grid;font-size:13px;font-weight:700;gap:7px;text-align:left}.dialog-field input{border:1px solid #cbd5e1;border-radius:8px;min-height:38px;padding:0 10px}.danger-button{background:#dc2626}.danger-button:hover{background:#b91c1c}.login-panel{background:#fff;border-radius:8px;box-shadow:0 24px 80px #0f172a47;display:grid;gap:16px;max-width:420px;padding:22px;width:100%}.auth-tabs{background:#f1f5f9;border-radius:8px;display:grid;gap:4px;grid-template-columns:repeat(3,minmax(0,1fr));padding:4px}.auth-tabs button{background:transparent;border:0;border-radius:6px;color:#64748b;min-height:36px;padding:0 8px}.auth-tabs button.active{background:#fff;box-shadow:0 1px 4px #0f172a1f;color:#172033;font-weight:700}.login-panel h2{font-size:22px}.login-panel input{border:1px solid #cbd5e1;border-radius:8px;min-height:42px;padding:0 12px}.code-row{display:grid;gap:8px;grid-template-columns:minmax(0,1fr) auto}.modal-actions{display:flex;gap:10px;justify-content:flex-end}.admin-shell{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}.admin-sidebar{background:#0f172a;color:#fff;display:grid;grid-template-rows:auto 1fr;gap:28px;padding:22px}.admin-sidebar .eyebrow,.admin-sidebar h1{color:#fff}.admin-nav{align-content:start;display:grid;gap:8px}.admin-nav button{background:transparent;border:1px solid rgba(255,255,255,.12);border-radius:8px;color:#cbd5e1;min-height:42px;padding:0 12px;text-align:left}.admin-nav button.active{background:#2563eb;border-color:#2563eb;color:#fff;font-weight:800}.admin-main{display:grid;gap:16px;grid-template-rows:auto 1fr;padding:20px}.admin-topbar,.admin-panel{background:#fff;border:1px solid #d9e2ef;border-radius:8px;padding:18px}.admin-topbar{align-items:center;display:flex;justify-content:space-between}.admin-panel p{color:#64748b;line-height:1.7;margin:12px 0 0}@media (max-width: 1100px){.workspace{grid-template-columns:240px minmax(0,1fr)}.tool-panel{grid-column:1 / -1;grid-template-columns:repeat(4,minmax(0,1fr));max-height:none}.layers-panel,.secondary-panel,.generate,.status-message{grid-column:span 2}}@media (max-width: 760px){.app-shell{padding:12px}.topbar{align-items:flex-start;flex-direction:column}.account{justify-content:flex-start;width:100%}.workspace{grid-template-columns:1fr}.queue-panel,.editor-panel,.tool-panel{max-height:none}.queue-panel{overflow:visible}.thumb-list{grid-auto-flow:column;grid-auto-columns:220px;overflow-x:auto}.editor-panel{min-height:480px}.tool-panel{grid-template-columns:1fr}.layers-panel,.secondary-panel,.generate,.status-message{grid-column:auto}.button-text{display:none}.action-button{gap:0;min-width:40px;padding-left:10px;padding-right:10px}.queue-actions{grid-template-columns:repeat(5,48px)}.admin-shell{grid-template-columns:1fr}.admin-sidebar{gap:14px}.admin-topbar{align-items:flex-start;flex-direction:column;gap:12px}}