:root,[data-theme=light]{--bg-primary:#f5f5f9;--bg-secondary:#fff;--bg-card:#f0f0f5;--bg-card-hover:#e8e8f0;--bg-glass:#00000008;--bg-glass-hover:#0000000f;--text-primary:#1a1a2e;--text-secondary:#5a5a78;--text-muted:#9090a8;--accent:#6c63ff;--accent-hover:#5a52e0;--accent-glow:#6c63ff33;--accent-gradient:linear-gradient(135deg, #6c63ff 0%, #48c6ef 100%);--success:#00b074;--warning:#fa0;--danger:#ff4757;--border:#00000014;--border-active:#6c63ff80;--shadow-sm:0 2px 8px #0000000f;--shadow-md:0 4px 20px #00000014;--shadow-lg:0 8px 40px #0000001a;--shadow-glow:0 0 30px var(--accent-glow);--card-shadow:0 1px 3px #0000000f, 0 4px 12px #0000000a;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--transition:.2s cubic-bezier(.4, 0, .2, 1);--transition-slow:.4s cubic-bezier(.4, 0, .2, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--bg-primary:#0a0a0f;--bg-secondary:#12121a;--bg-card:#1a1a2e;--bg-card-hover:#22223a;--bg-glass:#ffffff0a;--bg-glass-hover:#ffffff14;--text-primary:#f0f0f5;--text-secondary:#9090a8;--text-muted:#606078;--accent:#6c63ff;--accent-hover:#5a52e0;--accent-glow:#6c63ff4d;--success:#00d68f;--border:#ffffff14;--shadow-sm:0 2px 8px #0000004d;--shadow-md:0 4px 20px #0006;--shadow-lg:0 8px 40px #00000080;--shadow-glow:0 0 30px var(--accent-glow);--card-shadow:0 1px 3px #0000004d, 0 4px 12px #0003;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{background:var(--bg-primary);color:var(--text-primary);min-height:100vh;transition:background var(--transition-slow), color var(--transition-slow);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6;overflow-x:hidden}#app{z-index:1;position:relative}.landing-page{max-width:1100px;margin:0 auto;padding:0 24px 60px}.landing-header{justify-content:space-between;align-items:center;padding:24px 0;display:flex}.header-controls{align-items:center;gap:10px;display:flex}.header-auth-lang{align-items:stretch;gap:6px;display:flex}.ui-lang-menu{position:relative}.ui-lang-toggle{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;transition:all var(--transition);-webkit-user-select:none;user-select:none;align-self:stretch;align-items:center;gap:8px;padding:8px 14px;list-style:none;display:inline-flex}.ui-lang-toggle::-webkit-details-marker{display:none}.ui-lang-toggle:hover,.ui-lang-menu[open] .ui-lang-toggle{background:var(--bg-glass-hover);border-color:var(--border-active)}.ui-lang-icon{font-size:14px}.ui-lang-dropdown{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);min-width:120px;box-shadow:var(--shadow-md);z-index:20;flex-direction:column;gap:6px;padding:8px;display:flex;position:absolute;top:calc(100% + 8px);right:0}.ui-lang-menu:not([open]) .ui-lang-dropdown{display:none}.ui-lang-option{border-radius:var(--radius-sm);width:100%;color:var(--text-secondary);text-align:left;cursor:pointer;transition:all var(--transition);background:0 0;border:1px solid #0000;padding:8px 10px;font-family:inherit;font-size:13px;font-weight:600}.ui-lang-option:hover{background:var(--bg-glass);color:var(--text-primary)}.ui-lang-option.active{border-color:var(--border-active);color:var(--accent);background:#6c63ff1a}.logo{align-items:center;gap:12px;display:inline-flex}.logo-compact{gap:10px}.brand-mark{background:linear-gradient(145deg,#0f172a 0%,#2563eb 42%,#22d3ee 100%);border-radius:13px;flex-shrink:0;width:38px;height:38px;display:inline-flex;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff38,0 12px 24px #2563eb38}.brand-mark-sm{border-radius:10px;width:30px;height:30px}.brand-mark-glow{border-radius:inherit;background:radial-gradient(circle at 76% 22%,#ffffff57,#0000 34%),radial-gradient(circle at 30% 100%,#22d3ee2e,#0000 48%);position:absolute;inset:0}.brand-card{border-radius:7px;position:absolute}.brand-card-back{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffff1f;border:1px solid #ffffff42;width:50%;height:34%;top:18%;left:16%;transform:rotate(-12deg)}.brand-card-front{background:#fffffff0;width:56%;height:40%;bottom:16%;right:16%;box-shadow:0 5px 14px #0f172a2e}.brand-card-front:after{content:"";background:linear-gradient(90deg,#2563eb 0%,#22d3ee 100%);border-radius:999px;width:46%;height:14%;position:absolute;top:20%;left:18%}.brand-card-accent{background:#ffffffe0;border-radius:999px;width:14%;height:14%;position:absolute;top:18%;right:18%;box-shadow:0 0 0 3px #ffffff1f}.logo-text{color:var(--text-primary);letter-spacing:-.06em;font-size:24px;font-weight:800}.theme-btn{background:var(--bg-glass);border:1px solid var(--border);cursor:pointer;width:40px;height:40px;transition:all var(--transition);border-radius:50%;justify-content:center;align-items:center;font-size:18px;display:flex}.theme-btn:hover{background:var(--bg-glass-hover);transform:scale(1.1)}.hero{text-align:center;padding:80px 0 60px}.hero-badge{background:var(--bg-glass);border:1px solid var(--border);color:var(--accent);letter-spacing:.3px;border-radius:100px;margin-bottom:24px;padding:8px 20px;font-size:13px;font-weight:600;display:inline-block}.hero-title{letter-spacing:-1.5px;background:linear-gradient(135deg, var(--text-primary) 0%, var(--accent) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:20px;font-size:56px;font-weight:800;line-height:1.1}.hero-desc{max-width:600px;color:var(--text-secondary);margin:0 auto 36px;font-size:17px;line-height:1.7}.btn-cta{background:var(--accent-gradient);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition);box-shadow:var(--shadow-md);border:none;align-items:center;gap:10px;padding:18px 44px;font-family:inherit;font-size:17px;font-weight:700;display:inline-flex}.btn-cta:hover{box-shadow:var(--shadow-glow), var(--shadow-lg);transform:translateY(-3px)}.btn-cta:active{transform:translateY(0)}.btn-cta .btn-arrow{transition:transform var(--transition)}.btn-cta:hover .btn-arrow{transform:translate(4px)}.features{grid-template-columns:repeat(5,1fr);gap:20px;margin-bottom:60px;display:grid}.feature-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;transition:all var(--transition);box-shadow:var(--card-shadow);padding:32px 24px}.feature-card:hover{box-shadow:var(--shadow-md);transform:translateY(-4px)}.feature-icon{margin-bottom:14px;font-size:36px;display:block}.feature-title{margin-bottom:8px;font-size:16px;font-weight:700}.feature-desc{color:var(--text-secondary);font-size:13px;line-height:1.5}.feature-card-ai{background:linear-gradient(135deg,#6c63ff1f,#48c6ef1a);border-color:#6c63ff4d}.feature-card-ai .feature-icon{background:linear-gradient(135deg,#6c63ff,#48c6ef);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:30px}.ai-highlight{border-radius:var(--radius-lg);background:linear-gradient(135deg,#6c63ff14 0%,#48c6ef0f 100%);border:1px solid #6c63ff33;margin-bottom:60px;padding:56px 48px}.ai-highlight-inner{grid-template-columns:1fr 1fr;align-items:center;gap:48px;max-width:900px;margin:0 auto;display:grid}.ai-highlight-badge{color:#fff;letter-spacing:.08em;text-transform:uppercase;background:linear-gradient(135deg,#6c63ff,#48c6ef);border-radius:20px;margin-bottom:16px;padding:5px 14px;font-size:11px;font-weight:700;display:inline-block}.ai-highlight-title{letter-spacing:-.5px;margin-bottom:14px;font-size:28px;font-weight:800;line-height:1.2}.ai-highlight-desc{color:var(--text-secondary);margin-bottom:20px;font-size:14px;line-height:1.65}.ai-highlight-list{flex-direction:column;gap:9px;margin:0 0 28px;padding:0;list-style:none;display:flex}.ai-highlight-list li{color:var(--text-secondary);align-items:center;gap:8px;font-size:13px;display:flex}.ai-highlight-list li:before{content:"✓";color:#6c63ff;flex-shrink:0;font-weight:700}.btn-cta-sm{padding:12px 24px;font-size:14px}.ai-highlight-visual{justify-content:center;display:flex}.ai-code-block{background:#0d0d14;border:1px solid #6c63ff4d;border-radius:12px;width:100%;max-width:320px;overflow:hidden;box-shadow:0 8px 32px #0000004d}.ai-code-header{background:#ffffff0a;border-bottom:1px solid #ffffff12;align-items:center;gap:6px;padding:10px 14px;display:flex}.ai-code-dot{background:#ffffff26;border-radius:50%;width:10px;height:10px}.ai-code-label{letter-spacing:.1em;color:#6c63ffcc;text-transform:uppercase;margin-left:auto;font-size:10px;font-weight:700}.ai-code-body{color:#a8b4d8;white-space:pre;margin:0;padding:16px 18px;font-family:Menlo,Monaco,Consolas,monospace;font-size:12px;line-height:1.7}.how-it-works{margin-bottom:60px}.section-heading{text-align:center;letter-spacing:-.5px;margin-bottom:40px;font-size:32px;font-weight:800}.steps-showcase{grid-template-columns:repeat(4,1fr);gap:24px;display:grid}.step-showcase-item{text-align:center;padding:24px}.step-number{background:var(--accent-gradient);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;margin-bottom:16px;font-size:20px;font-weight:800;display:inline-flex}.step-showcase-item h4{margin-bottom:8px;font-size:15px;font-weight:700}.step-showcase-item p{color:var(--text-secondary);font-size:13px;line-height:1.5}.app-footer{text-align:center;border-top:1px solid var(--border);color:var(--text-muted);margin-top:24px;padding:48px 0 28px;font-size:14px}.app-ad-banner{max-width:720px;margin:20px auto 0}.adsense-slot{display:block;overflow:hidden}.adsense-slot[data-ad-mounted="1"]{min-height:68px}@media (width<=640px){.app-ad-banner{max-width:100%}.adsense-slot--mock{flex-direction:column;align-items:flex-start}.adsense-mock-copy{text-align:left;margin-left:0}}.app-footer-note,.app-footer-copy{margin:0}.app-footer-note{margin-bottom:8px}.app-footer-brand{color:#4f8ef7;transition:color var(--transition);font-weight:600;text-decoration:none}.app-footer-brand:hover{color:#2563eb;text-decoration:underline}.scroll-to-bottom-btn{color:#111;cursor:pointer;z-index:900;background:#fff;border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:22px;line-height:1;transition:opacity .2s,transform .15s;display:flex;position:fixed;bottom:20px;right:20px;box-shadow:0 4px 16px #0000002e}.scroll-to-bottom-btn:hover{transform:translateY(2px);box-shadow:0 6px 20px #00000038}.main-content{padding-bottom:20px}.studio-layout{max-width:1200px;margin:0 auto;padding:0 24px 60px}.studio-header{justify-content:space-between;align-items:center;gap:16px;padding:16px 0;display:flex}.header-left,.header-right{flex-shrink:0}.header-right{align-items:center;display:flex}.back-home-btn{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition);color:var(--text-primary);align-items:center;gap:8px;padding:8px 16px;font-family:inherit;display:inline-flex}.back-home-btn:hover{background:var(--bg-glass-hover)}.logo-text-sm{color:var(--text-primary);letter-spacing:-.05em;font-size:16px;font-weight:800}.step-nav{flex:1;justify-content:center;gap:4px;display:flex}.step-btn{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-muted);cursor:pointer;transition:all var(--transition);flex-direction:column;align-items:center;gap:4px;min-width:80px;padding:10px 22px;font-family:inherit;font-size:11px;font-weight:600;display:flex}.step-btn:hover:not(.disabled){background:var(--bg-glass-hover);color:var(--text-secondary)}.step-btn.active{border-color:var(--border-active);color:var(--accent);box-shadow:var(--shadow-glow);background:#6c63ff1a}.step-btn.completed{color:var(--success);border-color:#00b0744d}.step-btn.disabled{opacity:.35;cursor:not-allowed}.step-icon{font-size:18px}.step-label{text-transform:uppercase;letter-spacing:.5px}.step-container{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--card-shadow);margin-top:8px;padding:40px;position:relative;overflow:hidden}.step-container:before{content:"";background:linear-gradient(90deg,#0000,#6c63ff40,#0000);height:1px;position:absolute;top:0;left:0;right:0}.step-title{letter-spacing:-.5px;margin-bottom:8px;font-size:28px;font-weight:800}.step-desc{color:var(--text-secondary);margin-bottom:32px;font-size:15px}.btn-primary{background:var(--accent-gradient);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition);box-shadow:var(--shadow-sm);border:none;align-items:center;gap:8px;padding:14px 32px;font-family:inherit;font-size:15px;font-weight:700;display:inline-flex}.btn-primary:hover:not(:disabled){box-shadow:var(--shadow-glow), var(--shadow-md);transform:translateY(-2px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.4;cursor:not-allowed}.btn-arrow{transition:transform var(--transition)}.btn-primary:hover .btn-arrow{transform:translate(3px)}.btn-secondary{background:var(--bg-glass);color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition);align-items:center;gap:8px;padding:14px 28px;font-family:inherit;font-size:15px;font-weight:600;display:inline-flex}.btn-secondary:hover{background:var(--bg-glass-hover);color:var(--text-primary);border-color:#00000026}.btn-danger-subtle{color:#b42318;background:#b423180d;border-color:#b423182e}.btn-danger-subtle:hover{color:#fff;background:#b42318;border-color:#b42318}[data-theme=dark] .btn-secondary:hover{border-color:#ffffff26}.btn-icon{background:var(--accent);color:#fff;border-radius:var(--radius-sm);cursor:pointer;width:36px;height:36px;transition:all var(--transition);border:none;flex-shrink:0;justify-content:center;align-items:center;font-size:20px;font-weight:700;display:flex}.btn-icon:hover{background:var(--accent-hover);transform:scale(1.05)}.btn-mini{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all var(--transition);padding:6px 14px;font-family:inherit;font-size:12px;font-weight:600}.btn-mini:hover{background:var(--bg-glass-hover);color:var(--text-primary)}.step-actions{border-top:1px solid var(--border);justify-content:flex-end;gap:12px;margin-top:36px;padding-top:24px;display:flex}.step-actions.full-width{grid-column:1/-1}.section-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-secondary);margin-bottom:12px;font-size:13px;font-weight:700}.template-filter-bar{flex-wrap:wrap;gap:8px;margin-bottom:24px;display:flex}.filter-btn{border:1.5px solid var(--border);color:var(--text-secondary);cursor:pointer;white-space:nowrap;background:0 0;border-radius:20px;padding:6px 14px;font-size:13px;font-weight:500;transition:all .15s}.filter-btn:hover{border-color:var(--accent);color:var(--accent)}.filter-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.filter-btn-ai{background:linear-gradient(135deg,#6c63ff,#48c6ef);border-color:#0000;margin-left:4px;font-weight:600;color:#fff!important}.filter-btn-ai:hover{opacity:.88;color:#fff;border-color:#0000}.ai-modal-overlay{z-index:1200;background:#0000009e;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.ai-modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;width:100%;max-width:720px;max-height:92vh;display:flex;overflow:hidden;box-shadow:0 24px 60px #0006}.ai-modal-header{border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.ai-modal-title{color:var(--text-primary);font-size:15px;font-weight:700}.ai-modal-close{color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:background var(--transition), color var(--transition);background:0 0;border:none;padding:4px 8px;font-size:16px}.ai-modal-close:hover{background:var(--bg-hover);color:var(--text-primary)}.ai-modal-body{flex-direction:column;gap:18px;padding:20px;display:flex;overflow-y:auto}.ai-modal-desc{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.6}.ai-input-label-row{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.ai-input-label-row .ai-input-label{margin-bottom:0}.ai-clear-btn{color:var(--text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:color var(--transition), background var(--transition);background:0 0;border:none;padding:2px 6px;font-size:13px}.ai-clear-btn:hover{color:var(--danger);background:var(--bg-hover)}.ai-prompt-label,.ai-input-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px;font-size:12px;font-weight:600}.ai-prompt-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);position:relative;overflow:hidden}.ai-prompt-text{color:var(--text-primary);white-space:pre-wrap;word-break:break-word;max-height:220px;margin:0;padding:14px 84px 14px 16px;font-family:JetBrains Mono,Fira Code,Courier New,monospace;font-size:11.5px;line-height:1.65;display:block;overflow-y:auto}.ai-copy-btn{border-radius:var(--radius-sm);background:var(--accent);color:#fff;cursor:pointer;transition:background var(--transition);white-space:nowrap;border:none;padding:5px 12px;font-size:12px;font-weight:600;position:absolute;top:10px;right:10px}.ai-copy-btn:hover{background:var(--accent-hover)}.ai-code-input{border:1.5px solid var(--border);border-radius:var(--radius-md);background:var(--bg-card);width:100%;min-height:160px;color:var(--text-primary);resize:vertical;box-sizing:border-box;transition:border-color var(--transition);padding:12px 14px;font-family:JetBrains Mono,Fira Code,Courier New,monospace;font-size:12px;line-height:1.6}.ai-code-input:focus{border-color:var(--accent);outline:none}.ai-error{color:var(--danger);margin-top:6px;font-size:12px}.ai-editor-actions{justify-content:flex-end;margin-top:4px;display:flex}.template-set{margin-bottom:28px}.template-set:last-child{margin-bottom:0}.template-set-label{text-transform:uppercase;letter-spacing:1.2px;color:var(--text-muted);margin-bottom:12px;font-size:11px;font-weight:700}.template-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:16px;display:grid}.template-card{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition);color:var(--text-primary);flex-direction:column;align-items:center;gap:10px;padding:12px;font-family:inherit;display:flex}.template-card:hover{background:var(--bg-glass-hover);box-shadow:var(--shadow-md);transform:translateY(-3px)}.template-card.selected{border-color:var(--accent);box-shadow:var(--shadow-glow)}.template-preview{border-radius:var(--radius-sm);aspect-ratio:9/16;object-fit:cover;width:100%;height:auto}.template-name{font-size:13px;font-weight:600}.upload-lang-tabs{flex-wrap:wrap;gap:6px;margin-bottom:12px;display:flex}.upload-lang-tab{border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;align-items:center;gap:6px;padding:6px 14px;font-size:13px;font-weight:500;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.upload-lang-tab:hover{background:var(--bg-hover);color:var(--text-primary)}.upload-lang-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.upload-lang-count{background:#ffffff40;border-radius:999px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 5px;font-size:11px;font-weight:700;display:inline-flex}.upload-lang-tab:not(.active) .upload-lang-count{background:var(--accent);color:#fff}.upload-lang-note{color:var(--text-muted);margin-bottom:10px;font-size:12px}.upload-area{border:2px dashed var(--border);border-radius:var(--radius-lg);background:var(--bg-glass);cursor:pointer;transition:all var(--transition);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:60px 40px;display:flex}.upload-area:hover,.upload-area.dragover{border-color:var(--accent);background:#6c63ff0a}.upload-icon{opacity:.7;font-size:48px}.upload-text{color:var(--text-secondary);font-size:15px}.upload-link{color:var(--accent);text-underline-offset:2px;font-weight:600;text-decoration:underline}.upload-hint{color:var(--text-muted);font-size:12px}.uploaded-list{margin-top:28px}.screenshot-thumbs{flex-wrap:wrap;gap:16px;padding:8px;display:flex}.thumb-item{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-card);cursor:grab;transition:box-shadow var(--transition);position:relative;overflow:visible}.thumb-item[draggable]:active{cursor:grabbing}.thumb-item.dragging{opacity:.35}.thumb-item.drop-before:before,.thumb-item.drop-after:after{content:"";background:var(--accent);width:3px;box-shadow:0 0 8px var(--accent-glow);z-index:10;border-radius:2px;position:absolute;top:-4px;bottom:-4px}.thumb-item.drop-before:before{left:-8px}.thumb-item.drop-after:after{right:-8px}.thumb-order{background:var(--accent);color:#fff;z-index:2;width:22px;height:22px;box-shadow:var(--shadow-sm);border-radius:50%;justify-content:center;align-items:center;font-size:11px;font-weight:800;display:flex;position:absolute;top:-8px;left:-8px}.thumb-canvas{border-radius:var(--radius-sm);display:block}.thumb-remove{color:#fff;cursor:pointer;width:22px;height:22px;transition:all var(--transition);opacity:0;z-index:3;background:#ff4757d9;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;font-weight:700;display:flex;position:absolute;top:-6px;right:-6px}.thumb-item:hover .thumb-remove{opacity:1}.thumb-remove:hover{background:var(--danger);transform:scale(1.1)}.thumb-edit{color:#fff;cursor:pointer;transition:all var(--transition);opacity:0;z-index:3;white-space:nowrap;background:#6c63ffe6;border:none;border-radius:10px;padding:2px 8px;font-size:11px;position:absolute;bottom:-6px;left:50%;transform:translate(-50%)}.thumb-item:hover .thumb-edit{opacity:1}.thumb-edit:hover{background:var(--accent-hover);transform:translate(-50%)scale(1.1)}.crop-overlay{z-index:1000;opacity:0;-webkit-backdrop-filter:blur(4px);background:#0009;justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:fixed;inset:0}.crop-overlay.open{opacity:1}.crop-modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-xl);width:calc(100% - 40px);max-width:720px;box-shadow:var(--shadow-lg);padding:28px;transition:transform .2s;transform:scale(.95)}.crop-overlay.open .crop-modal{transform:scale(1)}.crop-header{margin-bottom:20px}.crop-title{margin-bottom:4px;font-size:20px;font-weight:800}.crop-hint{color:var(--text-secondary);font-size:13px}.crop-canvas-wrapper{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);justify-content:center;align-items:center;min-height:200px;margin-bottom:20px;padding:12px;display:flex}.crop-canvas-wrapper canvas{cursor:default;border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);max-width:100%}.crop-info{text-align:center;color:var(--text-secondary);font-variant-numeric:tabular-nums;margin-bottom:16px;font-size:13px;font-weight:600}.crop-actions{align-items:center;gap:10px;display:flex}.text-step-layout{grid-template-columns:1fr 320px;align-items:start;gap:32px;display:grid}.text-editor-panel{min-width:0}.text-preview-panel{position:sticky;top:20px}.lang-manager{margin-bottom:24px}.lang-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.lang-header .section-label{margin-bottom:0}.lang-add{align-items:center;gap:8px;display:flex}.lang-picker{min-width:200px;position:relative}.lang-search{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);transition:all var(--transition);padding:8px 14px;font-family:inherit;font-size:13px;font-weight:500}.lang-search::placeholder{color:var(--text-muted)}.lang-search:focus{border-color:var(--accent);border-bottom-right-radius:0;border-bottom-left-radius:0;outline:none;box-shadow:0 0 0 3px #6c63ff1f}.lang-dropdown{background:var(--bg-secondary);border:1px solid var(--accent);border-bottom-left-radius:var(--radius-sm);border-bottom-right-radius:var(--radius-sm);max-height:220px;box-shadow:var(--shadow-md);z-index:100;border-top:none;display:none;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.lang-dropdown.open{display:block}.lang-option{text-align:left;width:100%;color:var(--text-primary);cursor:pointer;transition:background var(--transition);background:0 0;border:none;justify-content:space-between;align-items:center;padding:9px 14px;font-family:inherit;font-size:13px;display:flex}.lang-option:hover{color:var(--accent);background:#6c63ff14}.lang-option-code{color:var(--text-muted);flex-shrink:0;margin-left:8px;font-size:11px;font-weight:700}.lang-no-results{color:var(--text-muted);text-align:center;padding:12px 14px;font-size:13px}.lang-tags{flex-wrap:wrap;gap:8px;display:flex}.lang-tag{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition);align-items:center;gap:6px;padding:8px 14px;font-size:13px;display:inline-flex}.lang-tag:hover{background:var(--bg-glass-hover)}.lang-tag.active{border-color:var(--accent);color:var(--accent);background:#6c63ff1a}.lang-code{letter-spacing:.5px;font-weight:700}.lang-remove{width:18px;height:18px;color:var(--text-muted);cursor:pointer;transition:all var(--transition);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex}.lang-remove:hover{color:var(--danger);background:#ff475726}.ss-selector{margin-bottom:20px}.ss-tabs{flex-wrap:wrap;gap:8px;display:flex}.btn-change-template{background:var(--bg-glass);border:1.5px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;align-items:center;gap:8px;width:100%;margin-top:10px;padding:7px 12px;font-family:inherit;font-size:13px;font-weight:500;transition:border-color .15s,background .15s;display:flex}.btn-change-template:hover{border-color:var(--accent);background:var(--bg-card)}.ctempl-swatch{border:1px solid #00000026;border-radius:4px;flex-shrink:0;width:22px;height:32px}.ctempl-name{text-align:left;text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.ctempl-arrow{color:var(--text-muted);font-size:16px}.tpicker-overlay{z-index:1000;opacity:0;background:#000000b8;justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:fixed;inset:0}.tpicker-overlay.open{opacity:1}.tpicker-modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;width:min(720px,94vw);max-height:84vh;transition:transform .2s;display:flex;overflow:hidden;transform:translateY(12px);box-shadow:0 24px 60px #00000059}.tpicker-overlay.open .tpicker-modal{transform:translateY(0)}.tpicker-header{border-bottom:1px solid var(--border);background:var(--bg-secondary);flex-shrink:0;justify-content:space-between;align-items:center;padding:18px 22px 14px;display:flex}.tpicker-title{color:var(--text-primary);margin:0;font-size:16px;font-weight:700}.tpicker-close{background:var(--bg-glass);width:30px;height:30px;color:var(--text-secondary);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:18px;transition:background .15s;display:flex}.tpicker-close:hover{background:var(--border)}.tpicker-body{background:var(--bg-primary);flex:1;padding:18px 22px 22px;overflow-y:auto}.ss-tab{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-sm);width:44px;height:44px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition);justify-content:center;align-items:center;font-family:inherit;font-size:15px;font-weight:700;display:flex}.ss-tab:hover{background:var(--bg-glass-hover)}.ss-tab.active{border-color:var(--accent);color:var(--accent);background:#6c63ff1a}.text-inputs{flex-direction:column;gap:16px;display:flex}.text-input-group{flex-direction:column;gap:10px;display:flex}.text-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);font-size:12px;font-weight:700}.text-area{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);width:100%;color:var(--text-primary);resize:vertical;transition:all var(--transition);padding:14px 16px;font-family:inherit;font-size:14px;line-height:1.5}.text-area:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #6c63ff1f}.text-area::placeholder{color:var(--text-muted)}.text-toolbar{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);flex-direction:column;gap:16px;margin-bottom:4px;padding:14px;display:flex}.toolbar-row{align-items:center;gap:10px;display:flex}.toolbar-group{flex:1;align-items:center;gap:6px;min-width:0;display:flex}.toolbar-group--color,.toolbar-group--btn{flex:none}.toolbar-label{color:var(--text-muted);white-space:nowrap;flex-shrink:0;min-width:70px;font-size:11px;font-weight:600}.toolbar-value{color:var(--text-secondary);white-space:nowrap;text-align:right;flex-shrink:0;min-width:38px;font-size:11px;font-weight:600}.toolbar-range{min-width:60px;height:4px;accent-color:var(--accent);cursor:pointer;flex:1}.toolbar-num{background:var(--bg-secondary);border:1px solid var(--border);width:52px;color:var(--text-primary);text-align:right;-moz-appearance:textfield;border-radius:6px;flex-shrink:0;padding:4px 6px;font-family:inherit;font-size:12px;font-weight:600}.toolbar-num::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.toolbar-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.toolbar-num:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 2px #6c63ff26}.toolbar-unit{color:var(--text-muted);flex-shrink:0;width:22px;font-size:11px;font-weight:600}.toolbar-font-select{height:28px;color:var(--text-primary);background:var(--bg-input);border:1px solid var(--border);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 8px center;background-repeat:no-repeat;border-radius:6px;outline:none;flex:1;padding:0 24px 0 8px;font-size:12px;font-weight:500}.toolbar-font-select:focus{border-color:var(--accent);box-shadow:0 0 0 2px #6c63ff26}.toolbar-color{border:1px solid var(--border);background:var(--bg-secondary);cursor:pointer;border-radius:6px;flex-shrink:0;width:28px;height:28px;padding:2px}.toolbar-btn{background:var(--bg-glass);border:1px solid var(--border);width:28px;height:28px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-family:inherit;font-size:13px;font-weight:700;text-decoration:underline;display:flex}.toolbar-btn:hover{background:var(--bg-glass-hover);color:var(--text-primary)}.toolbar-btn.active{border-color:var(--accent);color:var(--accent);background:#6c63ff26}.toolbar-section-divider{background:var(--border);height:1px;margin:8px 0 4px}.toolbar-apply-row{border-top:1px solid var(--border);align-items:stretch;gap:8px;margin-top:4px;padding-top:4px;display:flex}.btn-apply-all{border:1px dashed var(--border);border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;transition:all var(--transition);text-align:center;background:0 0;flex:1 1 0;padding:7px 12px;font-family:inherit;font-size:12px;font-weight:600}.btn-apply-all:hover{border-color:var(--accent);color:var(--accent);background:#6c63ff0f}.btn-reset-text-settings{border-style:solid}.translate-actions{flex-direction:row;align-items:flex-start;gap:10px;display:flex}.translate-actions-text{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.btn-translate-google{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);width:auto;color:var(--text-primary);cursor:pointer;transition:all var(--transition);box-shadow:var(--shadow-sm);text-align:center;word-break:keep-all;flex-direction:row;justify-content:center;align-items:center;gap:6px;padding:7px 12px;font-family:inherit;font-size:10px;font-weight:600;line-height:1.2;display:inline-flex}.google-translate-logo{flex-shrink:0;width:20px;height:20px}.btn-translate-google:hover:not(:disabled){border-color:var(--accent);background:var(--bg-glass-hover)}.btn-translate-google:disabled{opacity:.7;cursor:wait}.btn-spinner{border-width:2px;flex-shrink:0;width:14px;height:14px}.translate-hint{color:var(--text-muted);font-size:12px;line-height:1.5}.translate-status{border-radius:var(--radius-sm);background:var(--bg-glass);border:1px solid var(--border);padding:8px 10px;font-size:12px;font-weight:600;line-height:1.5}.translate-status.success{color:var(--success);background:#00b07414;border-color:#00b0743d}.translate-status.error{color:var(--danger);background:#ff475714;border-color:#ff47573d}.toolbar-color-section{flex:1;align-items:center;gap:8px;min-width:0;display:flex}.color-type-toggle{border:1px solid var(--border);border-radius:6px;flex-shrink:0;display:flex;overflow:hidden}.color-type-btn{color:var(--text-muted);cursor:pointer;transition:all var(--transition);white-space:nowrap;background:0 0;border:none;padding:4px 8px;font-family:inherit;font-size:11px;font-weight:600}.color-type-btn.active{background:var(--accent);color:#fff}.color-solid-ctrl,.color-grad-ctrl{flex-shrink:0;align-items:center;gap:4px;display:flex}.color-solid-ctrl.hidden,.color-grad-ctrl.hidden,.grad-angle-row.hidden{display:none}.custom-editor{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;gap:14px;margin-top:20px;padding:18px 20px;display:flex}.custom-editor.hidden{display:none}.custom-editor-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.custom-editor-label{color:var(--text-muted);white-space:nowrap;min-width:40px;font-size:12px;font-weight:600}.custom-type-toggle{border:1px solid var(--border);border-radius:8px;display:flex;overflow:hidden}.custom-type-btn,.custom-layout-btn{color:var(--text-muted);cursor:pointer;transition:all var(--transition);background:0 0;border:none;padding:6px 14px;font-family:inherit;font-size:13px;font-weight:600}.custom-type-btn.active,.custom-layout-btn.active{background:var(--accent);color:#fff}.custom-solid-row.hidden,.custom-gradient-row.hidden{display:none}#custom-grad-angle{min-width:80px;accent-color:var(--accent);flex:1}.select-input{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);cursor:pointer;transition:all var(--transition);appearance:auto;margin-bottom:12px;padding:10px 14px;font-family:inherit;font-size:13px;font-weight:500}.select-input:focus{border-color:var(--accent);outline:none}.preview-wrapper{background:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border);justify-content:center;align-items:flex-start;padding:16px;display:flex}.live-preview-canvas{border-radius:var(--radius-sm);max-width:100%;height:auto;box-shadow:var(--shadow-md)}.device-select-section{margin-bottom:32px}.device-select-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.device-select-header .section-label{margin-bottom:0}.device-select-actions{gap:8px;display:flex}.device-categories.compact{flex-direction:column;gap:16px;display:flex}.category-title-sm{color:var(--text-secondary);margin-bottom:8px;font-size:13px;font-weight:700}.device-grid.compact{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;display:grid}.device-card.compact{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition);text-align:left;color:var(--text-primary);align-items:center;gap:10px;padding:10px 14px;font-family:inherit;display:flex}.device-card.compact:hover{background:var(--bg-glass-hover)}.device-card.compact.selected{border-color:var(--accent);background:#6c63ff14}.device-check{border:2px solid var(--border);color:#fff;width:22px;height:22px;transition:all var(--transition);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex}.device-card.compact.selected .device-check{background:var(--accent);border-color:var(--accent)}.device-info{flex-direction:column;display:flex}.device-name{font-size:13px;font-weight:700}.device-size{color:var(--text-muted);font-size:11px;font-weight:500}.export-summary{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-bottom:32px;display:grid}.summary-card{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);text-align:center;transition:all var(--transition);flex-direction:column;align-items:center;gap:6px;padding:20px 16px;display:flex}.summary-card.highlight{border-color:var(--border-active);background:#6c63ff14}.summary-icon{font-size:28px}.summary-value{color:var(--text-primary);font-size:18px;font-weight:800}.summary-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);font-size:11px;font-weight:600}.preview-lang-tabs{gap:8px;margin-bottom:20px;display:flex}.preview-lang-tab{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:all var(--transition);letter-spacing:.5px;padding:8px 18px;font-family:inherit;font-size:13px;font-weight:700}.preview-lang-tab:hover{background:var(--bg-glass-hover)}.preview-lang-tab.active{border-color:var(--accent);color:var(--accent);background:#6c63ff1a}.preview-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;margin-bottom:16px;display:grid}.preview-item{flex-direction:column;align-items:center;gap:10px;display:flex}.preview-canvas{border-radius:var(--radius-sm);max-width:100%;height:auto;box-shadow:var(--shadow-md);border:1px solid var(--border)}.preview-label{color:var(--text-muted);font-size:12px;font-weight:600}.btn-export{padding:16px 40px;font-size:16px}.spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:.6s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.fade-in{animation:.4s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media (width<=900px){.hero-title{font-size:40px}.features,.steps-showcase{grid-template-columns:repeat(2,1fr)}.ai-highlight{padding:40px 28px}.ai-highlight-inner{grid-template-columns:1fr;gap:32px}.ai-highlight-visual{order:-1}.ai-code-block{max-width:100%}.ai-highlight-title{font-size:22px}}@media (width<=768px){.studio-layout{padding:0 16px 40px}.studio-header{flex-wrap:wrap;gap:8px}.step-nav{order:3;justify-content:flex-start;width:100%;overflow-x:auto}.step-btn{min-width:65px;padding:8px 14px}.step-label{font-size:10px}.step-container{border-radius:var(--radius-lg);padding:24px 20px}.step-title{font-size:22px}.template-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}.text-step-layout{grid-template-columns:1fr}.text-preview-panel{position:static}.preview-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.device-grid.compact{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}@media (width<=600px){.landing-page{padding:0 16px 40px}.hero{padding:40px 0}.hero-title{font-size:32px}.features{grid-template-columns:1fr}.ai-highlight{padding:32px 20px}.steps-showcase{grid-template-columns:1fr 1fr}.export-summary{grid-template-columns:repeat(2,1fr)}}.google-auth-btn{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;transition:all var(--transition);box-shadow:none;justify-content:center;align-self:stretch;align-items:center;gap:8px;padding:8px 14px;font-family:inherit;font-size:13px;font-weight:600;display:inline-flex}.google-auth-btn:hover:not(:disabled){background:var(--bg-glass-hover);border-color:var(--border-active)}.google-auth-btn:disabled{cursor:wait;opacity:.7}.google-auth-icon{flex-shrink:0;width:14px;height:14px;display:block}.google-auth-label{white-space:nowrap}.google-auth-btn--logged-in{padding:8px 14px 8px 8px}.google-user-avatar{object-fit:cover;border-radius:50%;flex-shrink:0;width:18px;height:18px;display:block}.google-auth-logged-in-text{display:contents}.google-auth-name{text-overflow:ellipsis;white-space:nowrap;max-width:110px;font-size:13px;font-weight:600;overflow:hidden}.google-auth-btn--logged-in .google-auth-label{white-space:nowrap;color:var(--text-muted);font-size:13px;font-weight:600}.google-auth-pill{background:var(--bg-glass);border:1px solid var(--border);border-radius:999px;align-items:center;gap:8px;padding:6px 8px 6px 12px;display:inline-flex}.google-auth-status{color:var(--text-primary);font-size:12px;font-weight:700}.studio-header-spacer{flex:1}.project-toolbar{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);gap:10px;margin-bottom:20px;padding:16px 20px;display:grid}.project-toolbar-main,.project-toolbar-side{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.project-nav-btn{flex-shrink:0}.project-name-field{flex:1;align-items:center;gap:12px;min-width:220px;display:flex}.project-name-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:700}.project-name-input{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);width:100%;min-width:0;color:var(--text-primary);padding:10px 14px;font-family:inherit;font-size:15px;font-weight:700}.project-name-input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #6c63ff26}.project-sync-chip{background:var(--bg-secondary);border:1px solid var(--border);min-height:38px;color:var(--text-secondary);white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;padding:8px 12px;font-size:12px;font-weight:700;display:inline-flex}.project-sync-chip.saved{color:#157347;background:#15734714;border-color:#15734733}.project-sync-chip.local{color:var(--accent);background:#6c63ff14;border-color:#6c63ff3d}.project-sync-chip.saving{color:#9a6700;background:#ffc1071f;border-color:#9a670033}.project-sync-chip.error{color:#b42318;background:#b4231814;border-color:#b4231833}.project-save-drive-btn{white-space:nowrap}.project-toolbar-hint{color:var(--text-muted);margin:0;font-size:12px}.project-hub{gap:18px;padding-bottom:18px;display:grid}.project-hub-header-row{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.project-hub-selection-bar{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.project-selection-count{color:var(--text-secondary);font-size:13px;font-weight:700}.project-selection-actions{align-items:center;gap:10px;display:flex}.project-hub-grid,.project-list-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;display:grid}.project-hub-edit-btn{align-items:center;gap:6px;min-height:40px;padding:10px 16px;font-size:13px;display:inline-flex}.project-list-section{gap:16px;display:grid}.project-list-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.project-list-copy{color:var(--text-muted);margin:6px 0 0;font-size:14px}.project-card{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-direction:column;gap:10px;padding:26px 16px 16px;display:flex;position:relative}.project-card-selectable{cursor:pointer}.project-card-selectable:hover{border-color:var(--border-active);background:var(--bg-glass-hover)}.project-card.selected{border-color:var(--accent);box-shadow:0 0 0 2px #6c63ff1f}.project-card-muted{opacity:.66}.project-card-check{border:1px solid var(--border);background:var(--bg-secondary);width:28px;height:28px;color:var(--text-muted);cursor:pointer;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;font-family:inherit;font-size:13px;font-weight:800;display:inline-flex}.project-card.selected .project-card-check{background:var(--accent);border-color:var(--accent);color:#fff}.project-card-create{background:radial-gradient(circle at top right, #6c63ff29, transparent 55%), var(--bg-glass);justify-content:space-between}.project-card-source-icon{background:#6c63ff1a;border:1px solid #6c63ff24;border-radius:12px;justify-content:center;align-items:center;width:34px;height:34px;font-size:18px;display:inline-flex}.project-card-source-badge{z-index:2;background:var(--bg-secondary);box-shadow:var(--shadow-sm);position:absolute;top:-12px;right:-6px}.project-card-check-corner{z-index:2;position:absolute;top:14px;left:14px}.project-card-preview{aspect-ratio:16/10;border-radius:calc(var(--radius-lg) - 6px);background:linear-gradient(135deg, #6c63ff1f, #48c6ef1f), var(--bg-secondary);border:1px solid var(--border);color:var(--text-muted);justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex;overflow:hidden}.project-card-preview img{object-fit:cover;object-position:top;width:100%;height:100%;display:block}.project-card-body{gap:8px;display:grid}.project-card-body h3{color:var(--text-primary);margin:0;font-size:18px}.project-card-body p{color:var(--text-secondary);margin:0;font-size:14px;line-height:1.5}.project-card-icon{width:48px;height:48px;color:var(--accent);background:#6c63ff1f;border-radius:16px;justify-content:center;align-items:center;font-size:28px;font-weight:300;display:inline-flex}.project-card-meta,.project-card-updated{color:var(--text-muted);font-size:12px;font-weight:700}.project-card-actions{flex-wrap:wrap;gap:10px;display:flex}.project-card-actions.hidden{display:none}.project-hub-message{background:var(--bg-glass);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-secondary);padding:16px 18px;font-size:14px}.project-hub-message.error{color:#b42318;background:#b423180f;border-color:#b4231829}@media (width<=768px){.header-controls{flex-wrap:wrap;justify-content:flex-end;width:100%}.google-auth-pill{border-radius:var(--radius-md);justify-content:space-between;width:100%}.project-toolbar-main,.project-toolbar-side,.project-name-field,.project-list-header,.project-hub-header-row,.project-hub-selection-bar,.project-selection-actions{flex-direction:column;align-items:stretch}.project-sync-chip,.project-save-drive-btn,.project-nav-btn,.google-auth-btn{width:100%}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#0000001f;border-radius:3px}[data-theme=dark] ::-webkit-scrollbar-thumb{background:#ffffff1a}::-webkit-scrollbar-thumb:hover{background:#0003}[data-theme=dark] ::-webkit-scrollbar-thumb:hover{background:#fff3}::selection{color:var(--text-primary);background:#6c63ff33}.lang-section{margin-top:20px}.lang-section-header{align-items:center;gap:8px;margin-bottom:10px;display:flex}.lang-section-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:13px;font-weight:600}.lang-section-header .upload-lang-remove{color:var(--text-muted);cursor:pointer;transition:color var(--transition);background:0 0;border:none;padding:0 4px;font-size:16px;line-height:1}.lang-section-header .upload-lang-remove:hover{color:var(--danger)}.thumb-empty{cursor:pointer;background:var(--bg-glass);border:1.5px dashed var(--border);border-radius:var(--radius-sm);width:130px;height:224px;transition:border-color var(--transition), background var(--transition);justify-content:center;align-items:center;display:flex}.thumb-empty:hover{border-color:var(--accent);background:var(--accent-glow)}.thumb-empty-plus{color:var(--text-muted);pointer-events:none;transition:color var(--transition);font-size:24px;line-height:1}.thumb-empty:hover .thumb-empty-plus{color:var(--accent)}.ss-grid{grid-template-columns:24px 28px repeat(var(--lang-count,1), 1fr);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-secondary);gap:0;display:grid;overflow:hidden}.ss-grid-header,.ss-grid-row{display:contents}.ss-grid-header>*,.ss-grid-row>*{border-bottom:1px solid var(--border)}.ss-grid-header>:last-child,.ss-grid-row:last-child>*{border-bottom:none}.ss-grid-handle-col,.ss-grid-num-col,.ss-grid-lang-col{color:var(--text-muted);text-align:center;background:var(--bg-card);border-right:1px solid var(--border);-webkit-user-select:none;user-select:none;padding:8px 6px;font-size:11px;font-weight:600}.ss-grid-lang-col{text-align:center;border-right:none;border-left:1px solid var(--border);font-size:12px}.ss-grid-handle{cursor:grab;color:var(--text-muted);letter-spacing:-2px;background:var(--bg-card);-webkit-user-select:none;user-select:none;transition:background var(--transition), color var(--transition);justify-content:center;align-items:center;padding:4px 2px;font-size:13px;display:flex}.ss-grid-handle:hover{background:var(--bg-card-hover);color:var(--text-secondary)}.ss-grid-handle:active{cursor:grabbing}.ss-grid-num{color:var(--text-muted);background:var(--bg-card);justify-content:center;align-items:center;padding:4px 2px;font-size:12px;font-weight:500;display:flex}.ss-lang-cell{border-left:1px solid var(--border);min-height:80px;transition:background var(--transition);justify-content:center;align-items:center;padding:6px;display:flex;position:relative}.ss-lang-cell.has-img{background:var(--bg-secondary);cursor:grab}.ss-lang-cell.has-img:active{cursor:grabbing}.ss-lang-cell.empty{background:var(--bg-glass)}.ss-thumb-canvas{object-fit:contain;pointer-events:none;border-radius:4px;width:40px;height:68px;display:block}.ss-cell-remove{background:var(--danger);color:#fff;cursor:pointer;z-index:2;opacity:.9;width:18px;height:18px;transition:opacity var(--transition), transform var(--transition);border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:12px;line-height:1;display:none;position:absolute;top:3px;right:3px}.ss-lang-cell.has-img:hover .ss-cell-remove{display:flex}.ss-cell-remove:hover{opacity:1;transform:scale(1.1)}.ss-cell-crop{color:#fff;cursor:pointer;z-index:2;width:20px;height:20px;transition:background var(--transition);background:#00000080;border:none;border-radius:4px;justify-content:center;align-items:center;padding:0;font-size:11px;display:none;position:absolute;bottom:3px;right:3px}.ss-lang-cell.has-img:hover .ss-cell-crop{display:flex}.ss-cell-crop:hover{background:#000000bf}.ss-cell-add{cursor:pointer;border-radius:var(--radius-sm);border:1px dashed var(--border);width:100%;height:100%;min-height:68px;transition:border-color var(--transition), background var(--transition);background:0 0;justify-content:center;align-items:center;display:flex}.ss-cell-add:hover{border-color:var(--accent);background:var(--accent-glow)}.ss-cell-plus{color:var(--text-muted);pointer-events:none;transition:color var(--transition);font-size:20px;line-height:1}.ss-cell-add:hover .ss-cell-plus{color:var(--accent)}.cell-dragging{opacity:.4}.cell-drop-over{outline:2px dashed var(--accent);outline-offset:-2px;background:var(--accent-glow)!important}.row-dragging{opacity:.4}.row-dragging>*{background:var(--bg-glass)!important}.row-drop-before .ss-grid-handle,.row-drop-before .ss-grid-num,.row-drop-before .ss-lang-cell{box-shadow:0 -2px 0 0 var(--accent) inset}.row-drop-after .ss-grid-handle,.row-drop-after .ss-grid-num,.row-drop-after .ss-lang-cell{box-shadow:0 2px 0 0 var(--accent) inset}.upload-lang-bar{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:12px;display:flex}.upload-lang-remove{color:var(--text-muted);cursor:pointer;transition:color var(--transition);background:0 0;border:none;margin-left:2px;padding:0 2px;font-size:14px;line-height:1}.upload-lang-remove:hover{color:var(--danger)}.mobile-bottom-nav{display:none}@media (width<=768px){*{-webkit-tap-highlight-color:transparent}body{overscroll-behavior-y:contain}.studio-layout.has-bottom-nav .main-content{padding-bottom:calc(68px + env(safe-area-inset-bottom))}.studio-layout>.app-ad-banner{display:none}.app-ad-banner-mobile{margin:16px 0 calc(84px + env(safe-area-inset-bottom));max-width:100%;display:block}.app-ad-banner-mobile .adsense-slot{border-radius:var(--radius-md);min-height:56px}.studio-layout{padding:0 12px}.studio-header{flex-wrap:nowrap;align-items:center;gap:6px;min-height:48px;padding:0 0 8px}.step-nav{display:none!important}.studio-header-spacer{display:none}.header-left{flex-shrink:0}.header-right{margin-left:auto}.header-controls{flex-wrap:nowrap;gap:4px;width:auto!important}.google-auth-label,.google-auth-name,.ui-lang-toggle>span:last-child{display:none}.google-auth-btn{align-self:stretch;width:auto!important;padding:0 8px!important}.google-auth-btn--logged-in{padding:0 8px 0 6px!important}.google-user-avatar{width:22px;height:22px}.ui-lang-toggle{align-self:stretch;gap:0;padding:6px 8px}.theme-btn{width:32px;height:32px;font-size:15px}.project-toolbar{gap:6px;margin-bottom:10px;padding:10px 12px}.project-toolbar-main,.project-toolbar-side{flex-flow:wrap;align-items:center;gap:8px}.project-nav-btn,.project-sync-chip,.project-save-drive-btn{width:auto!important}.project-sync-chip{padding:3px 8px;font-size:11px}.project-save-drive-btn{padding:6px 12px;font-size:12px}.project-name-field{flex:1;min-width:0}.project-name-input{font-size:13px}.project-toolbar-hint{font-size:11px}.mobile-bottom-nav{z-index:300;background:var(--bg-secondary);border-top:1px solid var(--border);padding-top:6px;padding-bottom:calc(6px + env(safe-area-inset-bottom));display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 20px #00000014}[data-theme=dark] .mobile-bottom-nav{box-shadow:0 -2px 20px #0006}.mobile-nav-btn{min-height:44px;color:var(--text-muted);letter-spacing:.01em;cursor:pointer;transition:color var(--transition);background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;padding:4px 2px;font-family:inherit;font-size:10px;font-weight:600;display:flex;position:relative}.mobile-nav-btn:before{content:"";height:2px;transition:background var(--transition);background:0 0;border-radius:0 0 2px 2px;position:absolute;top:0;left:20%;right:20%}.mobile-nav-btn.active{color:var(--accent)}.mobile-nav-btn.active:before{background:var(--accent)}.mobile-nav-btn.completed{color:var(--success)}.mobile-nav-btn:disabled{opacity:.32;cursor:default}.mobile-nav-icon{font-size:18px;line-height:1;display:block}.mobile-nav-label{line-height:1;display:block}.project-hub-header-row{flex-wrap:wrap;align-items:flex-start;gap:8px;flex-direction:row!important}.project-hub-header-row>div{flex:1;min-width:0}.project-hub-grid{grid-template-columns:repeat(2,1fr);gap:10px}.project-hub-selection-bar{flex-wrap:wrap;align-items:center;gap:8px;flex-direction:row!important}.project-selection-actions{gap:8px;flex-direction:row!important}.project-card-preview{height:100px}.project-hub-edit-btn{flex-shrink:0;padding:6px 12px;font-size:12px}.step-container{border-radius:var(--radius-lg);padding:18px 14px}.step-title{font-size:20px}.step-desc{font-size:13px}.step-actions{flex-flow:row;gap:8px}.step-actions .btn-primary,.step-actions .btn-secondary{flex:1;justify-content:center;min-height:46px;font-size:14px}.template-filter-bar{-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;gap:6px;padding-bottom:6px;overflow-x:auto}.template-filter-bar::-webkit-scrollbar{display:none}.filter-btn{white-space:nowrap;flex-shrink:0;padding:5px 12px;font-size:12px}.template-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}.template-name{padding:4px 4px 6px;font-size:11px}.upload-area{padding:28px 16px}.screenshot-thumbs{gap:10px}.thumb-item{width:72px}.thumb-canvas{width:72px;height:126px}.text-step-layout.step-container{box-shadow:none;background:0 0;border:none;flex-direction:column;gap:12px;padding:0;display:flex!important}.text-editor-panel{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);order:1;padding:16px 14px}.text-editor-panel .step-title{font-size:18px}.text-preview-panel{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);order:3;padding:12px 14px;position:static!important}.step-actions.full-width{flex-flow:row;order:4;gap:8px}.step-actions.full-width .btn-primary,.step-actions.full-width .btn-secondary{flex:1;justify-content:center;min-height:46px}.lang-manager{margin-bottom:14px}.lang-header{gap:8px;margin-bottom:8px}.section-label{margin-bottom:8px;font-size:12px}.lang-tags{gap:6px}.lang-tag{padding:4px 8px;font-size:12px}.ss-tabs{flex-wrap:wrap;gap:6px}.ss-tab{min-width:0;padding:5px 10px;font-size:12px}.lang-section{margin-top:14px}.lang-section-label{font-size:11px}.screenshot-thumbs{gap:10px;padding:4px}.text-inputs{margin-top:12px}.toolbar-row{gap:6px;min-height:32px;padding:5px 0}.toolbar-label{width:72px;color:var(--text-secondary);flex-shrink:0;font-size:11px}.toolbar-range{flex:1;min-width:60px}.toolbar-num{width:40px;padding:2px 4px;font-size:11px}.toolbar-font-select{height:28px;font-size:12px}.text-area{min-height:60px;padding:10px 12px;font-size:14px}.translate-actions{flex-direction:column;gap:8px}.translate-actions-text{margin-top:0}.btn-translate-google{justify-content:center;width:100%}.translate-hint{font-size:11px}.device-categories.compact{gap:16px}.device-grid.compact{grid-template-columns:repeat(2,1fr);gap:6px}.device-card.compact{padding:8px 10px}.device-name{font-size:12px}.device-size{font-size:10px}.export-summary{grid-template-columns:repeat(3,1fr);gap:6px}.summary-card{padding:10px 6px}.summary-icon{font-size:18px}.summary-value{font-size:15px}.summary-label{font-size:10px}.preview-lang-tabs{scrollbar-width:none;flex-wrap:nowrap;gap:6px;overflow-x:auto}.preview-lang-tabs::-webkit-scrollbar{display:none}.preview-lang-tab{white-space:nowrap;flex-shrink:0;padding:5px 12px;font-size:12px}.preview-grid{grid-template-columns:repeat(2,1fr);gap:8px}.preview-item canvas{width:100%!important;height:auto!important}.btn-export{justify-content:center;width:100%;min-height:52px;margin-top:4px;font-size:16px}.crop-modal{width:calc(100vw - 24px);max-height:92vh;overflow-y:auto}.tpicker-modal{width:calc(100vw - 24px);max-height:88vh}.tpicker-body{max-height:calc(88vh - 80px);overflow-y:auto}.landing-header{flex-wrap:nowrap;gap:8px;padding:12px 0 16px}.landing-header .header-controls{margin-left:auto}.hero-badge{padding:4px 12px;font-size:11px}.btn-cta{padding:14px 28px;font-size:15px}}@media (width<=480px){.project-hub-grid{grid-template-columns:1fr}.export-summary{grid-template-columns:repeat(2,1fr)}.device-grid.compact{grid-template-columns:1fr}.summary-card.highlight{grid-column:1/-1}}