*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#09090b;--bg-card:#1e293b80;--bg-float:#16161ae6;--bg-topbar:#09090bbf;--bg-input:#ffffff0f;--bg-hover:#ffffff0d;--border:#ffffff0f;--border-hover:#ffffff1f;--text:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--canvas-bg:#ffffff05;--accent:#1e40af;--accent-dark:#1e3a8a;--success:#34d399;--warn:#fbbf24;--danger:#f87171;--purple:#8b5cf6;--text-h1:1.5rem;--text-h2:1.15rem;--text-body:.9rem;--text-sm:.8rem;--text-xs:.7rem;--text-icon:1.2rem;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px}[data-theme=light]{--bg:#f8f9fb;--bg-card:#fff;--bg-float:#fffffff5;--bg-topbar:#f8f9fbd9;--bg-input:#f1f3f6;--bg-hover:#0000000a;--border:#00000017;--border-hover:#0000002e;--text:#111318;--text-primary:#111318;--text-secondary:#4a5568;--text-muted:#9ba3ae;--canvas-bg:#eef0f4;--accent:#2563eb;--accent-dark:#1d4ed8;--danger:#dc2626;--warn:#d97706;--radius-sm:10px;--radius-md:14px;--radius-lg:20px}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,sans-serif;font-size:var(--text-body)}.page-center{height:100vh;padding:var(--space-lg);justify-content:center;align-items:center;display:flex}.workspace{flex-direction:column;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.page-scroll{min-height:100vh}.page-content{padding:var(--space-lg);max-width:960px;margin:0 auto}.topbar{padding:var(--space-sm) var(--space-lg);background:var(--bg-topbar);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);z-index:100;flex-shrink:0;justify-content:space-between;align-items:center;display:flex}[data-theme=light] .topbar{background:#ffffffe0;border-bottom-color:#00000014;box-shadow:0 1px #0000000f}.topbar-right{gap:var(--space-sm);align-items:center;display:flex}.logo{font-size:var(--text-body);font-weight:600}.step-bar{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:var(--radius-md);padding:6px var(--space-sm);z-index:90;background:#09090b66;border:1px solid #ffffff14;align-items:center;display:flex;position:absolute;top:52px;left:50%;transform:translate(-50%)}[data-theme=light] .step-bar{background:#ffffffe6;border:1px solid #0000001a;box-shadow:0 2px 12px #00000014}[data-theme=light] .step-item{color:#4a5568}[data-theme=light] .step-item.active{background:#2563eb14}[data-theme=light] .step-item.active .step-label{color:#111318}[data-theme=light] .step-dot{background:#f1f3f6;border-color:#d1d5db}[data-theme=light] .step-sep{background:#d1d5db}.step-item{border-radius:var(--radius-sm);cursor:default;opacity:.4;white-space:nowrap;align-items:center;gap:6px;padding:6px 14px;transition:all .25s;display:flex}.step-item.active{opacity:1;background:#3b82f626}.step-item.done{opacity:.75;cursor:pointer}.step-item.done:hover{opacity:1;background:var(--bg-hover)}.step-dot{background:var(--bg-input);border:2px solid var(--border-hover);width:26px;height:26px;font-size:var(--text-xs);border-radius:50%;justify-content:center;align-items:center;font-weight:700;transition:all .3s;display:flex}.step-item.active .step-dot{background:var(--accent);border-color:var(--accent);color:#fff}.step-item.done .step-dot{border-color:var(--success);color:var(--success);background:#34d39933}.step-label{font-size:var(--text-sm);color:var(--text-secondary)}.step-item.active .step-label{color:var(--text);font-weight:600}.step-sep{background:var(--border-hover);width:20px;height:1px;margin:0 2px}.canvas-area{flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.canvas-area img,.workspace img{border-radius:12px}.float-panel{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:var(--radius-lg);padding:var(--space-lg);z-index:50;background:#09090b66;border:1px solid #ffffff14;position:absolute;box-shadow:0 8px 32px #0003}.float-panel-center{max-height:calc(100vh - 160px);inset:50% auto auto 50%;overflow-y:auto;transform:translate(-50%,-50%)}.float-panel-right{top:80px;right:var(--space-md);bottom:var(--space-md);gap:var(--space-sm);flex-direction:column;width:280px;display:flex;overflow-y:auto}.float-panel-bottom{bottom:var(--space-md);gap:var(--space-sm);align-items:center;display:flex;left:50%;transform:translate(-50%)}.card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-lg);transition:border-color .2s}.card:hover{border-color:var(--border-hover)}[data-theme=light] .card{border-color:#00000012;box-shadow:0 1px 4px #0000000f,0 4px 16px #0000000a}[data-theme=light] .card:hover{box-shadow:0 2px 8px #00000017,0 8px 24px #0000000d}[data-theme=light] .input{background:#fff;border-color:#dde1e7}[data-theme=light] .input:focus{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}[data-theme=light] .btn-ghost{color:#374151;background:#fff;border-color:#dde1e7}[data-theme=light] .btn-ghost:hover{color:#111318;background:#f1f3f6;border-color:#c7cdd6}[data-theme=light] .btn-ghost.active{color:#2563eb;background:#eff6ff;border-color:#bfdbfe}.input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);color:var(--text);font-size:var(--text-body);outline:none;width:100%;transition:border-color .2s}.input:focus{border-color:var(--accent)}.input::placeholder{color:var(--text-muted)}select.input option,select option{color:#e0e0e0;background:#1e1e2e}.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-dark));color:#fff;border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-lg);font-size:var(--text-body);cursor:pointer;border:none;font-weight:600;transition:all .2s}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 16px #3b82f64d}.btn-primary:active{transform:translateY(0)}.btn-ghost{background:var(--bg-input);color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);cursor:pointer;transition:all .2s}.btn-ghost:hover{background:var(--border-hover);color:var(--text)}.btn-sm{padding:6px var(--space-md)!important;font-size:var(--text-sm)!important}.btn-danger{color:var(--danger);border-radius:var(--radius-sm);padding:var(--space-sm) var(--space-lg);font-size:var(--text-body);cursor:pointer;background:#ef444426;border:1px solid #ef44444d;width:100%}.greeting{font-size:var(--text-h1);margin-bottom:var(--space-xs);font-weight:700}.subtitle{color:var(--text-muted);margin-bottom:var(--space-lg);font-size:var(--text-body)}.meta{color:var(--text-muted);font-size:var(--text-sm);margin-top:var(--space-xs)}.error-text{color:var(--danger);font-size:var(--text-sm);text-align:center}.step-hint{color:var(--text-secondary);font-size:var(--text-body);margin-bottom:var(--space-md)}.login-card{flex-direction:column;gap:14px;width:100%;max-width:360px;display:flex}.login-title{font-size:var(--text-h1);text-align:center;font-weight:700}.login-subtitle{text-align:center;color:var(--text-muted);font-size:var(--text-body)}.project-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.project-card{cursor:pointer}.project-card h3{font-size:var(--text-body);margin-bottom:var(--space-xs)}.new-project{color:var(--text-muted);cursor:pointer;border-style:dashed;flex-direction:column;justify-content:center;align-items:center;min-height:100px;display:flex}.new-icon{margin-bottom:var(--space-xs);font-size:2rem}.upload-zone{border:2px dashed var(--border-hover);border-radius:var(--radius-lg);padding:40px var(--space-lg);text-align:center;cursor:pointer;transition:border-color .2s,background .2s}.upload-zone:hover{border-color:var(--accent);background:#3b82f60a}.upload-icon{margin-bottom:var(--space-md);font-size:2.5rem;display:block}.thumb-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:6px;display:grid}.thumb-item{aspect-ratio:1;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-xs);color:var(--text-muted);cursor:pointer;justify-content:center;align-items:center;transition:all .15s;display:flex}.thumb-item:hover{border-color:var(--accent)}.thumb-item.active{border-color:var(--accent);background:#3b82f61a}.annotate-canvas{background:var(--canvas-bg);cursor:crosshair;width:100%;height:100%;position:relative}.pin-marker{background:var(--accent);width:26px;height:26px;font-size:var(--text-xs);color:#fff;cursor:grab;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;font-weight:700;transition:transform .15s;display:flex;position:absolute;transform:translate(-50%,-50%);box-shadow:0 2px 8px #0006}.pin-marker:hover{transform:translate(-50%,-50%)scale(1.2)}.edit-panel{background:var(--bg-float);border:1px solid var(--border);border-radius:var(--radius-md);gap:var(--space-sm);flex-direction:column;padding:14px;display:flex}.edit-row{align-items:center;gap:var(--space-sm);display:flex}.edit-label{color:var(--text-muted);font-size:var(--text-sm);flex-shrink:0;width:50px}.ai-bar{border-radius:var(--radius-sm);padding:var(--space-sm) 14px;justify-content:space-between;align-items:center;gap:var(--space-sm);background:#34d3991a;border:1px solid #34d39933;display:flex}.ai-bar .ai-text{color:var(--success);font-size:var(--text-sm)}.ai-sort-group{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-md)}.ai-sort-header{justify-content:space-between;align-items:center;display:flex}.review-table{border-collapse:collapse;text-align:left;width:100%}.review-table th{color:var(--text-muted);font-size:var(--text-sm);padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--border)}.review-table td{padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--border);font-size:var(--text-body)}.generate-cards{gap:var(--space-md);display:flex}.generate-card{text-align:center;flex:1}.generate-card span{font-size:2rem}.generate-card h3{margin:var(--space-sm) 0 var(--space-xs);font-size:var(--text-body)}.file-list{gap:var(--space-sm);flex-direction:column;display:flex}.file-item{padding:var(--space-sm) 14px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);justify-content:space-between;align-items:center;display:flex}.file-item-actions{gap:6px;display:flex}.file-item-actions button{padding:var(--space-xs) var(--space-md);font-size:var(--text-sm)}.status-ok{color:var(--success)}.status-warn{color:var(--warn)}.pool-tab{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);cursor:pointer;font-size:var(--text-sm);background:var(--bg-input);border:1px solid #0000;justify-content:space-between;align-items:center;transition:all .15s;display:flex}.pool-tab:hover{background:var(--border-hover)}.pool-tab.active{color:#60a5fa;background:#3b82f626;border-color:#3b82f64d}.pool-tab .meta{margin:0}.new-pool{border-style:dashed;border-color:var(--border);color:var(--text-muted);justify-content:center}.new-pool:hover{border-color:var(--accent);color:var(--accent)}.admin-tabs{gap:var(--space-sm);padding:var(--space-md);justify-content:center;display:flex}.admin-tabs .active{color:#60a5fa;background:#3b82f633;border-color:#3b82f64d}@media (width<=768px){:root{--text-h1:1.25rem;--text-h2:1.05rem;--text-body:.95rem;--text-sm:.82rem;--text-xs:.72rem}html{-webkit-text-size-adjust:100%}body{width:100%;position:fixed;overflow:hidden}.workspace,.page-center{height:100dvh}.page-content{padding:14px}.topbar{padding:6px var(--space-md)}.topbar .logo{font-size:var(--text-sm)}.topbar-right{gap:4px}.topbar-right .btn-ghost{font-size:var(--text-xs);padding:4px 8px}.topbar-right .meta{font-size:var(--text-xs)}.step-bar{border-radius:20px;padding:4px 8px;top:46px}.step-item{gap:4px;padding:2px 6px}.step-label{display:none}.step-dot{width:24px;height:24px;font-size:.65rem}.step-sep{width:12px}.float-panel-center{padding:var(--space-md);max-height:80vh;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.float-panel-right{border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100%;height:45vh;inset:auto 0 0}.float-panel-bottom{border-radius:20px;padding:8px 16px;bottom:6px}.project-grid{gap:var(--space-sm);grid-template-columns:1fr 1fr}.greeting{font-size:var(--text-h2)}.upload-zone{padding:24px var(--space-md)}.upload-icon{margin-bottom:var(--space-sm);font-size:2rem}.thumb-grid{grid-template-columns:repeat(auto-fill,minmax(64px,1fr))}.pin-marker{width:30px;height:30px;font-size:var(--text-xs)}.edit-panel{font-size:var(--text-sm)}.generate-cards{flex-direction:column}.btn-primary,.btn-ghost,.btn-danger{min-height:44px}.input{padding:10px var(--space-md);font-size:16px}.mobile-bottom-sheet{background:var(--bg-float);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-top:1px solid var(--border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:var(--space-md);padding-bottom:calc(var(--space-md) + env(safe-area-inset-bottom));z-index:200;max-height:70vh;position:fixed;bottom:0;left:0;right:0;overflow-y:auto;box-shadow:0 -8px 32px #0000004d}.mobile-bottom-sheet .drag-handle{background:var(--text-muted);width:36px;height:4px;margin:0 auto var(--space-md);opacity:.5;border-radius:2px}.mobile-fullcard{flex-direction:column;display:flex;position:absolute;inset:42px 0 0;overflow:hidden}.mobile-fullcard-content{-webkit-overflow-scrolling:touch;padding:var(--space-md);padding-bottom:calc(80px + env(safe-area-inset-bottom));flex:1;overflow-y:auto}.mobile-fullcard-footer{padding:var(--space-md);padding-bottom:calc(var(--space-md) + env(safe-area-inset-bottom));background:var(--bg-float);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--border);gap:var(--space-sm);z-index:100;justify-content:center;align-items:center;display:flex;position:fixed;bottom:0;left:0;right:0}.swipe-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);touch-action:none;-webkit-user-select:none;user-select:none;width:calc(100% - 32px);position:absolute;left:16px;overflow:hidden;box-shadow:0 8px 32px #0003}.swipe-card-image{aspect-ratio:4/3;object-fit:cover;width:100%}.swipe-card-body{padding:var(--space-md)}.swipe-hint{pointer-events:none;font-size:2.5rem;position:absolute;top:50%;transform:translateY(-50%)}.swipe-hint-left{left:20px}.swipe-hint-right{right:20px}.admin-tabs{flex-wrap:wrap}}