:root{--bg: #0c1215;--bg-subtle: #111a1e;--panel: #172126;--panel-hover: #1d2a30;--panel-active: #123832;--border: #26363d;--border-strong: #41545d;--text: #f4f8f7;--text-muted: #a9b8bd;--text-dim: #75878f;--accent: #2dd4bf;--accent-strong: #5eead4;--accent-soft: rgba(45, 212, 191, .13);--success: #15803d;--warning: #b45309;--danger: #dc2626;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 12px 30px rgba(0, 0, 0, .28);--shadow-lg: 0 24px 60px rgba(0, 0, 0, .42);--radius-sm: 6px;--radius-md: 8px;--radius-lg: 8px;--radius-full: 9999px;--font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#96a7ad transparent}html,body,#root{height:100%;margin:0;overflow:hidden}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);line-height:1.45;-webkit-font-smoothing:antialiased}button{all:unset;align-items:center;cursor:pointer;display:inline-flex;font-weight:700;gap:8px;justify-content:center;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease,transform .16s ease;-webkit-user-select:none;user-select:none}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,label:focus-within,input:focus-visible{outline:3px solid rgba(45,212,191,.26);outline-offset:2px}.btn-primary{background:var(--accent);border:1px solid var(--accent);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);color:#06211e;min-height:40px;overflow:hidden;padding:8px 18px;position:relative;text-align:center}.btn-primary:hover:not(:disabled){background:var(--accent-strong);border-color:var(--accent-strong);box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn-primary:active:not(:disabled){box-shadow:var(--shadow-sm);transform:translateY(0)}.btn-primary svg{color:currentColor}.btn-ghost{border:1px solid transparent;border-radius:var(--radius-sm);color:var(--text-muted);min-height:34px;padding:6px 10px}.btn-ghost:hover{background:var(--bg-subtle);border-color:var(--border);color:var(--text)}.btn-danger{border:1px solid rgba(220,38,38,.28);border-radius:var(--radius-sm);color:var(--danger);padding:6px 12px}.btn-danger:hover{background:#dc262614;border-color:var(--danger)}.app-shell{display:flex;flex-direction:column;gap:8px;height:100dvh;margin:0 auto;max-width:1720px;padding:8px;width:100%}.hero-band{align-items:center;background:#0f181c;border:1px solid #24343a;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);color:#fff;display:grid;flex-shrink:0;gap:12px;grid-template-columns:minmax(220px,1fr) auto minmax(360px,1fr);min-height:60px;padding:8px 16px}.header-left{display:flex;justify-content:flex-start}.brand{align-items:center;display:flex;gap:12px;justify-content:center;min-width:0}.logo-icon{background:#0c1215;border:2px solid rgba(45,212,191,.58);border-radius:var(--radius-md);color:var(--accent-strong);display:grid;flex:0 0 auto;font-size:18px;font-weight:900;height:36px;place-items:center;width:36px}.brand-info{min-width:0}.brand-info h1{color:#fff;font-size:1.2rem;font-weight:900;letter-spacing:0;line-height:1.1;margin:0;white-space:nowrap}.brand-info span{color:#a9b8bd;display:block;font-size:.68rem;font-weight:700;letter-spacing:0;margin-top:3px;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.header-actions{align-items:center;display:flex;gap:14px;justify-content:flex-end;min-width:0}.stat-group{background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-md);display:flex;gap:1px;overflow:hidden;padding:3px}.stat-item{background:#ffffff0f;display:flex;flex-direction:column;min-width:76px;padding:4px 11px}.stat-item:first-child,.stat-item:last-child{border-radius:var(--radius-sm)}.stat-item label{color:#a9b8bd;font-size:.68rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.stat-item span{color:#fff;font-size:1rem;font-weight:900;line-height:1.15}.text-accent{color:#5eead4!important}.text-success{color:var(--success)}.workspace{display:flex;flex:1;flex-direction:row;gap:10px;min-height:0;overflow:hidden}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;min-height:0;overflow:hidden}.panel-upload{flex-shrink:0;width:360px}.panel-options{flex-shrink:0;width:340px}.panel-preview{background:#0f171b!important;flex:1;min-width:0}.panel-header{align-items:center;background:#141e23;border-bottom:1px solid var(--border);display:flex;flex-shrink:0;gap:12px;justify-content:space-between;min-height:44px;padding:8px 14px}.panel-preview .panel-header{background:#141e23;flex-direction:row;min-height:44px}.panel-preview .panel-header>div{gap:8px!important}.panel-preview .btn-ghost{min-height:30px;padding:4px 7px!important}.panel-preview .stepper{align-items:center;display:flex;gap:8px;min-height:34px;padding:6px 8px}.panel-preview .stepper-label{margin:0}.panel-preview .stepper-value{gap:6px}.panel-preview .stepper-value span{font-size:.98rem}.panel-preview .step-btn{height:26px;width:26px}.panel-header h2{color:var(--text);font-size:.92rem;font-weight:900;letter-spacing:0;margin:0}.panel-header span{white-space:nowrap}.panel-content{flex:1;overflow-y:auto;padding:14px}.card-type-select{display:grid;gap:8px;grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:14px}.type-btn{background:#111a1e;border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);flex-direction:column;gap:7px;min-height:80px;min-width:0;padding:12px 8px;text-align:center}.type-btn:hover{background:var(--panel-hover);border-color:var(--border-strong)}.type-btn.active{background:var(--accent-soft);border-color:var(--accent);box-shadow:inset 0 0 0 1px #2dd4bf2e;color:var(--accent-strong)}.type-btn svg{color:var(--text-dim);height:24px;width:24px}.type-btn.active svg{color:var(--accent)}.type-btn span{font-size:.82rem;font-weight:900;overflow-wrap:anywhere}.custom-uploader{display:grid;gap:8px;margin-bottom:14px}.custom-upload-slot{background:#111a1e;border:1px dashed var(--border-strong);border-radius:var(--radius-md);cursor:pointer;display:flex;flex-direction:column;gap:4px;overflow:hidden;padding:12px;position:relative}.custom-upload-slot:hover,.custom-upload-slot.ready{background:var(--accent-soft);border-color:var(--accent)}.custom-upload-slot span{color:var(--text-muted);font-size:.72rem;font-weight:900;letter-spacing:0;text-transform:uppercase}.custom-upload-slot strong{color:var(--text);font-size:.9rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.custom-upload-slot input{cursor:pointer;top:0;right:0;bottom:0;left:0;opacity:0;position:absolute}.custom-add-btn{width:100%}.empty-upload-zone{align-items:center;background:#111a1e;border:1px dashed var(--border-strong);border-radius:var(--radius-md);display:flex;flex:1;flex-direction:column;gap:16px;justify-content:center;min-height:260px;padding:34px 18px;text-align:center;transition:background .16s ease,border-color .16s ease}.empty-upload-zone:hover{background:var(--accent-soft);border-color:var(--accent)}.upload-icon-large{background:#0c1215;border:1px solid var(--border);border-radius:var(--radius-md);color:var(--accent);display:grid;height:60px;margin-bottom:4px;place-items:center;width:60px}.upload-icon-large svg{height:30px;width:30px}.empty-upload-zone h3{color:var(--text);font-weight:900}.entry-list{display:flex;flex-direction:column;gap:10px}.entry-item{background:#111a1e;border:1px solid var(--border);border-radius:var(--radius-md);padding:10px;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease}.entry-item:hover{background:var(--panel-hover);border-color:var(--accent);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.entry-info{align-items:center;display:flex;gap:8px;justify-content:space-between;margin-bottom:8px}.entry-title{flex:1;min-width:0}.entry-name{color:var(--text);display:block;font-size:.9rem;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.entry-meta{color:var(--text-muted);display:block;font-size:.72rem;font-weight:800;letter-spacing:0;margin-top:2px;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.entry-previews{display:grid;gap:8px;grid-template-columns:1fr 1fr}.entry-previews img{aspect-ratio:86.5 / 55;background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);object-fit:cover;width:100%}.preview-area{background:linear-gradient(90deg,rgba(169,184,189,.055) 1px,transparent 1px),linear-gradient(0deg,rgba(169,184,189,.055) 1px,transparent 1px),#0f171b;background-size:24px 24px;display:flex;height:100%;min-height:0;overflow:auto;position:relative;scrollbar-gutter:stable}.sheet-container{align-items:flex-start;display:flex;flex-shrink:0;justify-content:center;margin:auto;padding:16px 24px 24px}.a4-sheet{background:#fff;box-shadow:0 18px 44px #14202638,0 0 0 1px #14202614;flex-shrink:0}.sep-dot{background:#111;border-radius:50%;height:2.5px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:2.5px;z-index:10}.control-section{margin-bottom:22px}.control-section h3{color:var(--text-muted);font-size:.75rem;font-weight:900;letter-spacing:0;margin:0 0 10px;text-transform:uppercase}.stepper-grid{display:grid;gap:10px;grid-template-columns:1fr 1fr}.stepper{background:#111a1e;border:1px solid var(--border);border-radius:var(--radius-md);min-width:0;padding:10px 12px}.stepper-label{color:var(--text-muted);display:block;font-size:.74rem;font-weight:800;margin-bottom:6px}.stepper-value{align-items:center;display:flex;gap:8px;justify-content:space-between}.stepper-value span{color:var(--text);font-size:1.08rem;font-weight:900;min-width:0}.stepper-btns{display:flex;flex-shrink:0;gap:5px}.step-btn{background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:18px;height:28px;width:28px}.step-btn:hover{background:var(--accent);border-color:var(--accent);color:#06211e}.toggle-item{align-items:center;background:#111a1e;border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;display:flex;justify-content:space-between;margin-bottom:9px;padding:12px;transition:background .16s ease,border-color .16s ease}.toggle-item:hover{background:var(--panel-hover);border-color:var(--border-strong)}.toggle-info strong{color:var(--text);display:block;font-size:.95rem;font-weight:900;margin-bottom:1px}.toggle-info span{color:var(--text-muted);font-size:.78rem}.switch{background:#41545d;border-radius:var(--radius-full);flex:0 0 auto;height:24px;padding:2px;position:relative;transition:background .16s ease;width:44px}.switch.active{background:var(--accent)}.knob{background:#fff;border-radius:50%;box-shadow:var(--shadow-sm);height:20px;transition:transform .16s ease;width:20px}.switch.active .knob{transform:translate(20px)}.modal-overlay{background:#080c0ec2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:grid;top:0;right:0;bottom:0;left:0;place-items:center;position:fixed;z-index:100}.modal-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:28px;width:400px}.modal-card h2{color:var(--text);font-size:1.35rem;font-weight:900;margin:0 0 14px}.modal-card input{background:var(--bg-subtle);border:1px solid var(--border-strong);border-radius:var(--radius-md);color:var(--text);font-size:1rem;margin-bottom:22px;padding:13px 16px;width:100%}.progress-overlay{align-items:center;background:#080c0ee6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;gap:22px;top:0;right:0;bottom:0;left:0;justify-content:center;position:fixed;z-index:200}.progress-container{background:#ffffff24;border:1px solid rgba(255,255,255,.18);border-radius:var(--radius-full);height:14px;overflow:hidden;width:400px}.progress-fill{background:#5eead4;height:100%;transition:width .26s ease-out}.progress-text{color:#fff;font-size:2.5rem;font-variant-numeric:tabular-nums;font-weight:900;letter-spacing:0}.progress-status{color:#d7e0e3;font-size:1rem;font-weight:800;letter-spacing:0;text-transform:uppercase}.big-upload-btn,.btn-upload-header{background:var(--accent);border-radius:var(--radius-md);color:#06211e;cursor:pointer;font-weight:900;padding:10px 16px}@media (max-width: 1180px){html,body,#root{min-height:100%;overflow:auto}.app-shell{height:auto;max-width:none;min-height:100dvh}.hero-band{grid-template-columns:1fr}.header-left,.brand,.header-actions{justify-content:center}.header-actions{flex-wrap:wrap}.workspace{flex-direction:column;overflow:visible}.panel-upload,.panel-options{width:100%}.panel-preview{min-height:70dvh}.card-type-select{grid-template-columns:repeat(5,minmax(0,1fr))}.custom-uploader{grid-template-columns:1fr 1fr auto}}@media (max-width: 760px){.app-shell{gap:8px;padding:8px}.hero-band{gap:12px;padding:10px}.brand{order:-1}.header-left,.header-actions,.header-left .btn-primary,.header-actions .btn-primary{width:100%}.header-left .btn-primary,.header-actions .btn-primary{justify-content:center}.stat-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.stat-item{min-width:0;padding:7px 8px;text-align:center}.panel-header{align-items:flex-start;flex-direction:column}.panel-preview .panel-header{align-items:center;flex-direction:row}.panel-preview .panel-header>div{flex-wrap:wrap;gap:10px!important;width:100%}.panel-preview .panel-header>div{justify-content:flex-start}.panel-preview .stepper{flex:1}.panel-content{padding:12px}.card-type-select{grid-template-columns:repeat(2,minmax(0,1fr))}.custom-uploader{grid-template-columns:1fr}.type-btn{min-height:76px}.stepper-grid{grid-template-columns:1fr}.toggle-item{gap:12px}.preview-area{min-height:64dvh}.sheet-container{margin:0 auto;padding:14px}.modal-card{padding:24px;width:min(400px,calc(100vw - 32px))}.progress-container{width:min(400px,calc(100vw - 48px))}}@media (max-width: 420px){.brand-info span{display:none}.brand-info h1{font-size:1.15rem}.logo-icon{font-size:18px;height:38px;width:38px}.stat-item label{font-size:.64rem}.stat-item span{font-size:1rem}.card-type-select{grid-template-columns:1fr}.type-btn{flex-direction:row;min-height:56px}}