:root{--studio-bg-dark:#0e0e12;--studio-rail-bg:#131318;--studio-drawer-bg:#18181f;--studio-header-bg:#16161c;--studio-props-bg:#1c1c24;--studio-border:#ffffff14;--studio-border-hover:#ffffff29;--studio-accent:#c85a32;--studio-accent-hover:#dd7548;--studio-gold:#d4af37;--studio-selection:#8b5cf6;--studio-selection-ring:#8b5cf659;--studio-text:#f4f4f5;--studio-text-muted:#a1a1aa}.studio-app{background-color:var(--studio-bg-dark);width:100vw;height:100vh;color:var(--studio-text);user-select:none;flex-direction:column;font-family:Manrope,ui-sans-serif,system-ui,-apple-system,sans-serif;display:flex;overflow:hidden}.studio-header{background-color:var(--studio-header-bg);border-bottom:1px solid var(--studio-border);z-index:50;justify-content:space-between;align-items:center;gap:12px;height:56px;min-height:56px;padding:0 16px;display:flex}.studio-header-left,.studio-header-center,.studio-header-right{align-items:center;gap:8px;display:flex}.studio-brand-badge{color:var(--studio-text);align-items:center;gap:8px;font-size:14px;font-weight:700;text-decoration:none;display:flex}.studio-brand-logo{background:linear-gradient(135deg, var(--studio-accent), var(--studio-gold));color:#fff;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;font-family:Fraunces,serif;font-size:16px;font-weight:900;display:flex;box-shadow:0 2px 8px #c85a324d}.studio-title-input{color:#fff;background:0 0;border:1px solid #0000;border-radius:6px;max-width:200px;padding:6px 10px;font-size:13px;font-weight:600;transition:all .15s}.studio-title-input:hover,.studio-title-input:focus{border-color:var(--studio-border-hover);background-color:#ffffff0f;outline:none}.studio-format-pill{border:1px solid var(--studio-border);background-color:#ffffff0d;border-radius:8px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;display:flex}.studio-format-select{color:#fff;cursor:pointer;background:0 0;border:none;outline:none;font-size:12px;font-weight:600}.studio-format-select option{color:#fff;background-color:#18181f}.studio-btn-group{border:1px solid var(--studio-border);background-color:#ffffff0a;border-radius:8px;align-items:center;padding:2px;display:flex}.studio-icon-btn{color:var(--studio-text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px 8px;font-size:12px;transition:all .15s;display:flex}.studio-icon-btn:hover:not(:disabled){color:#fff;background-color:#ffffff14}.studio-icon-btn:disabled{opacity:.3;cursor:not-allowed}.studio-btn-export{color:#fff;cursor:pointer;background:linear-gradient(135deg,#8b5cf6,#7c3aed);border:none;border-radius:8px;align-items:center;gap:8px;padding:8px 16px;font-size:13px;font-weight:700;transition:all .15s;display:flex;box-shadow:0 4px 14px #7c3aed59}.studio-btn-export:hover{transform:translateY(-1px);box-shadow:0 6px 18px #7c3aed73}.studio-props-bar{background-color:var(--studio-props-bg);border-bottom:1px solid var(--studio-border);z-index:40;justify-content:space-between;align-items:center;gap:12px;height:44px;min-height:44px;padding:0 16px;display:flex;overflow-x:auto}.studio-props-left{flex-wrap:nowrap;align-items:center;gap:8px;display:flex}.studio-props-right{flex-shrink:0;align-items:center;gap:8px;display:flex}.studio-select-sm{border:1px solid var(--studio-border);color:#fff;cursor:pointer;background-color:#ffffff0d;border-radius:6px;outline:none;padding:4px 8px;font-size:12px}.studio-select-sm option{color:#fff;background-color:#1c1c24}.studio-stepper{border:1px solid var(--studio-border);background-color:#ffffff0d;border-radius:6px;align-items:center;padding:1px;display:flex}.studio-stepper-btn{color:var(--studio-text-muted);cursor:pointer;background:0 0;border:none;padding:2px 8px;font-weight:700}.studio-stepper-btn:hover{color:#fff}.studio-stepper-val{color:#fbbf24;text-align:center;min-width:28px;font-family:monospace;font-size:11px}.studio-color-pill{border:1px solid var(--studio-border);background-color:#ffffff0d;border-radius:6px;align-items:center;gap:6px;padding:2px 6px;display:flex}.studio-color-input{cursor:pointer;background:0 0;border:1px solid #fff3;border-radius:4px;width:22px;height:22px}.studio-main-body{flex:1;width:100%;height:calc(100vh - 100px);display:flex;position:relative;overflow:hidden}.studio-rail{background-color:var(--studio-rail-bg);border-right:1px solid var(--studio-border);z-index:30;flex-direction:column;align-items:center;gap:6px;width:72px;min-width:72px;height:100%;padding:12px 0;display:flex}.studio-rail-item{width:60px;height:60px;color:var(--studio-text-muted);cursor:pointer;background:0 0;border:none;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:4px;font-size:10px;font-weight:600;transition:all .15s;display:flex}.studio-rail-item:hover{color:#fff;background-color:#ffffff0f}.studio-rail-item.active{color:#a78bfa;background-color:#8b5cf62e}.studio-rail-icon{font-size:20px}.studio-drawer{background-color:var(--studio-drawer-bg);border-right:1px solid var(--studio-border);z-index:25;flex-direction:column;width:340px;min-width:340px;height:100%;padding:16px;display:flex;overflow-y:auto}.studio-drawer-title{color:#fff;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:14px;font-weight:700;display:flex}.studio-template-card{border:1px solid var(--studio-border);cursor:pointer;background-color:#ffffff08;border-radius:12px;margin-bottom:12px;padding:10px;transition:all .2s}.studio-template-card:hover{background-color:#ffffff0f;border-color:#8b5cf6;transform:translateY(-2px);box-shadow:0 8px 24px #0006}.studio-template-thumb{text-align:center;color:#fff;border-radius:8px;justify-content:center;align-items:center;height:120px;margin-bottom:8px;padding:12px;font-size:13px;font-weight:700;display:flex;box-shadow:inset 0 0 20px #0006}.studio-canvas-container{background-color:var(--studio-bg-dark);background-image:radial-gradient(#ffffff14 1px,#0000 1px);background-size:20px 20px;flex:1;height:100%;padding:48px;display:flex;position:relative;overflow:auto}.studio-artboard-wrapper{border-radius:4px;flex-shrink:0;margin:auto;position:relative;box-shadow:0 24px 70px -10px #000000d9,0 0 0 1px #ffffff26}.studio-artboard{border-radius:4px;position:absolute;top:0;left:0;overflow:hidden}.studio-element{cursor:move;-webkit-user-select:none;user-select:none;position:absolute}.studio-element.selected{outline:2px solid var(--studio-selection);box-shadow:0 0 0 4px var(--studio-selection-ring)}.studio-handle{border:2px solid var(--studio-selection);z-index:40;background-color:#fff;border-radius:3px;width:12px;height:12px;position:absolute;box-shadow:0 1px 4px #0006}.studio-handle-nw{cursor:nwse-resize;top:-6px;left:-6px}.studio-handle-ne{cursor:nesw-resize;top:-6px;right:-6px}.studio-handle-sw{cursor:nesw-resize;bottom:-6px;left:-6px}.studio-handle-se{cursor:nwse-resize;bottom:-6px;right:-6px}.studio-delete-pill{color:#fff;cursor:pointer;background-color:#ef4444;border:none;border-radius:6px;padding:4px 8px;font-size:11px;font-weight:700;position:absolute;top:-34px;right:0;box-shadow:0 2px 6px #0006}.studio-delete-pill:hover{background-color:#dc2626}.studio-bottom-zoom{backdrop-filter:blur(8px);border:1px solid var(--studio-border);color:#fff;z-index:40;background-color:#18181fe6;border-radius:30px;align-items:center;gap:8px;padding:6px 14px;font-size:12px;display:flex;position:absolute;bottom:20px;right:24px;box-shadow:0 8px 24px #00000080}.studio-modal-backdrop{backdrop-filter:blur(6px);z-index:100;background-color:#000c;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.studio-modal-box{border:1px solid var(--studio-border);color:#fff;background-color:#181822;border-radius:16px;width:100%;max-width:480px;padding:24px;box-shadow:0 24px 60px #000c}.studio-home-layout{background-color:#0c0c12;width:100vw;height:100vh;font-family:Manrope,sans-serif;display:flex;overflow:hidden}.studio-home-rail{z-index:40;background:#12121a;border-right:1px solid #ffffff12;flex-direction:column;justify-content:space-between;align-items:center;width:76px;min-width:76px;height:100%;padding:16px 0;display:flex}.studio-home-rail-top{flex-direction:column;align-items:center;width:100%;display:flex}.studio-home-logo-box{margin-bottom:12px}.studio-create-pill-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#8b5cf6,#6366f1);border:none;border-radius:20px;align-items:center;gap:5px;margin-bottom:16px;padding:8px 12px;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 4px 14px #8b5cf666}.studio-create-pill-btn:hover{transform:scale(1.05);box-shadow:0 6px 18px #8b5cf68c}.studio-home-nav{flex-direction:column;align-items:center;gap:4px;width:100%;display:flex}.studio-home-nav-item{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:62px;height:58px;font-size:10px;font-weight:600;transition:all .15s;display:flex}.studio-home-nav-item:hover{color:#fff;background:#ffffff0f}.studio-home-nav-item.active{color:#a78bfa;background:#8b5cf629}.studio-home-nav-icon{font-size:18px}.studio-home-rail-bottom{flex-direction:column;align-items:center;width:100%;display:flex}.studio-home-main{background:#0e0e15;flex:1;height:100%;overflow-y:auto}.studio-hero-banner{text-align:center;background:radial-gradient(at 50% 0,#8b5cf640 0%,#c85a3217 45%,#0000 75%),linear-gradient(#161624 0%,#0e0e15 100%);border-bottom:1px solid #ffffff0f;justify-content:center;padding:44px 32px 36px;display:flex}.studio-hero-content{flex-direction:column;align-items:center;width:100%;max-width:840px;display:flex}.studio-hero-title{color:#fff;letter-spacing:-.5px;background:linear-gradient(135deg,#fff 40%,#c4b5fd 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:8px;font-family:Fraunces,serif;font-size:38px;font-weight:800}.studio-hero-subtitle{color:#9ca3af;margin-bottom:22px;font-size:14px;line-height:1.5}.studio-subtabs{background:#ffffff0f;border:1px solid #ffffff14;border-radius:24px;gap:8px;margin-bottom:20px;padding:4px;display:flex}.studio-subtab-btn{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:20px;padding:6px 18px;font-size:12px;font-weight:700;transition:all .15s}.studio-subtab-btn.active{color:#fff;background:#ffffff24;box-shadow:0 2px 6px #0003}.studio-hero-search-wrapper{width:100%;max-width:640px;margin-bottom:20px;position:relative}.studio-hero-search-input{color:#fff;background:#1c1c28;border:1.5px solid #8b5cf659;border-radius:25px;outline:none;width:100%;height:50px;padding:0 45px 0 48px;font-size:14px;transition:border-color .2s,box-shadow .2s;box-shadow:0 8px 30px #0000004d}.studio-hero-search-input:focus{border-color:#a78bfa;box-shadow:0 0 0 3px #8b5cf640}.studio-hero-search-icon{opacity:.7;font-size:16px;position:absolute;top:15px;left:18px}.studio-hero-search-clear{color:#9ca3af;cursor:pointer;background:0 0;border:none;font-size:14px;position:absolute;top:14px;right:16px}.studio-quick-chips{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.studio-chip-btn{color:#d1d5db;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff17;border-radius:20px;align-items:center;gap:6px;padding:6px 14px;font-size:12px;font-weight:600;transition:all .15s;display:flex}.studio-chip-btn:hover{color:#fff;background:#ffffff1a;border-color:#fff3}.studio-chip-btn.active{color:#c4b5fd;background:#8b5cf640;border-color:#8b5cf6}.studio-section{max-width:1360px;margin:0 auto;padding:32px 40px}.studio-section-header{margin-bottom:20px}.studio-section-title{color:#fff;margin-bottom:4px;font-size:20px;font-weight:800}.studio-section-desc{color:#9ca3af;font-size:13px}.studio-formats-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;display:grid}.studio-format-card{cursor:pointer;background:#181822;border:1px solid #ffffff14;border-radius:14px;align-items:center;gap:14px;padding:14px 16px;transition:all .2s;display:flex}.studio-format-card:hover{background:#1e1e2b;border-color:#8b5cf6;transform:translateY(-2px);box-shadow:0 10px 25px #0006}.studio-format-icon-box{background:#8b5cf626;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:20px;display:flex}.studio-format-name{color:#fff;font-size:13px;font-weight:700}.studio-format-dim{color:#9ca3af;margin-top:2px;font-size:11px}.studio-cards-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px;display:grid}.studio-blank-card{cursor:pointer;text-align:center;background:#ffffff05;border:2px dashed #ffffff26;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;min-height:280px;padding:24px;transition:all .2s;display:flex}.studio-blank-card:hover{background:#8b5cf60d;border-color:#8b5cf6;transform:translateY(-3px)}.studio-blank-plus{color:#a78bfa;background:#8b5cf633;border-radius:50%;justify-content:center;align-items:center;width:52px;height:52px;margin-bottom:14px;font-size:28px;display:flex}.studio-blank-title{color:#fff;margin-bottom:4px;font-size:15px;font-weight:700}.studio-blank-desc{color:#9ca3af;font-size:12px}.studio-feed-card{cursor:pointer;background:#161620;border:1px solid #ffffff14;border-radius:16px;flex-direction:column;transition:all .2s;display:flex;overflow:hidden}.studio-feed-card:hover{border-color:#8b5cf6;transform:translateY(-4px);box-shadow:0 16px 36px #00000080}.studio-feed-thumb{background-position:50%;background-size:cover;flex-direction:column;justify-content:space-between;width:100%;height:200px;padding:12px;display:flex;position:relative}.studio-feed-badge{color:#d4af37;backdrop-filter:blur(4px);background:#000000a6;border:1px solid #d4af3766;border-radius:12px;align-self:flex-start;padding:3px 10px;font-size:10px;font-weight:700}.studio-feed-hover-overlay{backdrop-filter:blur(2px);opacity:0;background:#00000073;justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:absolute;inset:0}.studio-feed-card:hover .studio-feed-hover-overlay{opacity:1}.studio-feed-hover-btn{color:#fff;background:#8b5cf6;border-radius:20px;padding:8px 16px;font-size:12px;font-weight:700;box-shadow:0 4px 12px #8b5cf666}.studio-feed-meta{padding:14px 16px}.studio-feed-title{color:#fff;text-overflow:ellipsis;white-space:nowrap;margin-bottom:4px;font-size:14px;font-weight:700;line-height:1.3;overflow:hidden}.studio-feed-sub{color:#9ca3af;align-items:center;gap:6px;font-size:11px;display:flex}