@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";@import"https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap";:root{--app-bg: #09090b;--stage-bg: #18181b;--text-primary: #ffffff;--text-secondary: #a1a1aa;--accent-color: #ffffff;--accent-bg: #27272a;--input-bg: rgba(24, 24, 27, .8);--border-color: #27272a;--glass-border: rgba(255, 255, 255, .1);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-full: 999px}html,body{height:100%;margin:0;padding:0;font-family:var(--font-sans);background-color:var(--app-bg);color:var(--text-primary);overflow:hidden}#root{height:100vh;width:100vw;display:flex;flex-direction:column}.immersive-app{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;perspective:1500px;overflow:hidden}.stage-container{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;transition:all .5s cubic-bezier(.25,.8,.25,1)}.empty-state{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--text-secondary);opacity:1;transform:scale(1);transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1),visibility 0s linear .8s;z-index:0;animation:ambientFadeIn 1.5s ease-out forwards;padding:20px}@keyframes ambientFadeIn{0%{opacity:0}to{opacity:1}}.empty-state.fade-out{opacity:0;transform:scale(1.1);visibility:hidden;pointer-events:none}.empty-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:24px;width:100%}.empty-content h1{color:var(--text-primary);font-weight:800;letter-spacing:-.05em;font-size:6rem;margin:0;background:linear-gradient(to bottom right,#fff,#aaa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;opacity:0;animation:dramaticEntrance 1.2s cubic-bezier(.16,1,.3,1) forwards;animation-delay:.2s;text-shadow:0 10px 30px rgba(255,255,255,.1);line-height:1}.empty-content p{font-size:1.4rem;max-width:600px;line-height:1.4;margin:0;opacity:0;color:var(--text-secondary);animation:dramaticEntrance 1.2s cubic-bezier(.16,1,.3,1) forwards;animation-delay:.5s}.surprise-button{margin-top:10px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:12px 24px;border-radius:99px;font-size:1rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:8px;opacity:0;animation:dramaticEntrance 1.2s cubic-bezier(.16,1,.3,1) forwards;animation-delay:.8s;transition:all .3s ease}.surprise-button:hover{background:#fff3;transform:scale(1.05);box-shadow:0 0 20px #fff3}@keyframes dramaticEntrance{0%{opacity:0;filter:blur(20px);transform:translateY(40px) scale(.95)}to{opacity:1;filter:blur(0);transform:translateY(0) scale(1)}}.session-group{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .7s ease,filter .7s ease;transform-style:preserve-3d}.session-group.active-session{transform:translate(0) scale(1);opacity:1;z-index:10;pointer-events:auto}.session-group.past-session{transform:translate(-120%) translateZ(-300px);opacity:0;z-index:5;pointer-events:none}.session-group.future-session{transform:translate(120%) translateZ(-300px);opacity:0;z-index:5;pointer-events:none}.artifact-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;width:95%;max-width:1600px;max-height:calc(100vh - 200px);overflow-y:auto;padding-bottom:40px;perspective:1000px;transition:all .6s cubic-bezier(.16,1,.3,1)}.stage-container.mode-focus .artifact-grid{pointer-events:none}.artifact-card{position:relative;background:#111;border-radius:12px;border:1px solid var(--border-color);overflow:hidden;display:flex;flex-direction:column;cursor:pointer;transition:all .6s cubic-bezier(.16,1,.3,1);box-shadow:0 10px 30px -10px #00000080;transform-origin:center center;pointer-events:auto}.artifact-header{padding:12px 16px;border-bottom:1px solid var(--border-color);background:#0003;display:flex;justify-content:center;font-size:.8rem;letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary);transition:opacity .3s}.artifact-style-tag{background:#ffffff0d;padding:4px 8px;border-radius:4px}.artifact-card:hover{border-color:#ffffff4d;transform:translateY(-4px);box-shadow:0 20px 40px -10px #000000b3}.artifact-card-inner{flex:1;position:relative;background:#fff;width:100%;height:100%}.artifact-iframe{width:100%;height:100%;border:none;display:block;pointer-events:none}.stage-container.mode-focus .artifact-card{opacity:0;pointer-events:none;transform:scale(.8)}.stage-container.mode-focus .artifact-card.focused{position:fixed;top:50%;left:50%;height:85vh;transform:translate(-50%,-50%);z-index:100;opacity:1;pointer-events:auto;box-shadow:0 50px 100px -20px #000c;border-color:#ffffff1a;cursor:default;width:90vw;max-width:1200px}.stage-container.mode-focus .artifact-card.focused[data-preview-size=mobile]{width:375px;max-width:375px}.stage-container.mode-focus .artifact-card.focused[data-preview-size=tablet]{width:768px;max-width:768px}.stage-container.mode-focus .artifact-card.focused[data-preview-size=desktop]{width:90vw;max-width:1200px}.stage-container.mode-focus{perspective:initial!important}.stage-container.mode-focus .session-group.active-session{transform:none!important;transform-style:flat!important}.stage-container.mode-focus .artifact-grid{transform:none!important;perspective:initial!important}.stage-container.mode-focus .artifact-card.focused .artifact-header{display:none}.stage-container.mode-focus .artifact-card.focused .artifact-iframe{pointer-events:auto}.artifact-card.generating{border-color:var(--accent-color);box-shadow:0 0 20px #ffffff1a}.generating-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;background:#000000e6;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}.code-stream-preview{margin:0;padding:20px;color:#4ade80;font-family:Roboto Mono,monospace;font-size:11px;line-height:1.4;white-space:pre-wrap;word-break:break-all;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent,black 20%);mask-image:linear-gradient(to bottom,transparent,black 20%);opacity:.9}.floating-input-container{position:absolute;bottom:30px;width:100%;display:flex;justify-content:center;z-index:100;padding:0 20px;box-sizing:border-box;pointer-events:none}.input-wrapper{pointer-events:auto;width:100%;max-width:800px;background:#1e1e23f2;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:0;display:flex;flex-direction:column;box-shadow:0 8px 32px #0006,0 0 0 1px #ffffff0d inset;transition:all .3s ease;position:relative}.input-wrapper:focus-within{border-color:#ffffff26;box-shadow:0 12px 48px #00000080,0 0 0 1px #ffffff14 inset}.input-wrapper,.input-toolbar,.toolbar-left{overflow:visible}.input-wrapper .input-area{padding:20px 24px 12px;min-height:60px;position:relative}.input-area .animated-placeholder{position:absolute;left:24px;top:20px;right:24px}.input-wrapper textarea{width:100%;min-height:48px;max-height:200px;background:transparent;border:none;outline:none;color:var(--text-primary);font-family:var(--font-sans);font-size:1rem;line-height:1.5;resize:none;padding:0}.input-wrapper textarea::placeholder{color:var(--text-secondary);opacity:.6}.input-toolbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-top:1px solid rgba(255,255,255,.06);background:#0003}.toolbar-left,.toolbar-right{display:flex;align-items:center;gap:8px}.toolbar-btn{display:flex;align-items:center;gap:8px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:8px 14px;color:var(--text-secondary);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;white-space:nowrap}.toolbar-btn:hover:not(:disabled){background:#ffffff1a;color:var(--text-primary);border-color:#ffffff26}.toolbar-btn:disabled{opacity:.4;cursor:not-allowed}.toolbar-btn svg{width:16px;height:16px}.toolbar-btn.active{background:#ffffff2e;border-color:#ffffff4d;color:var(--text-primary)}.toolbar-btn.active:hover:not(:disabled){background:#ffffff38;border-color:#fff6}.cost-display{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#22c55e26;border:1px solid rgba(34,197,94,.3);border-radius:10px;color:#4ade80;font-size:12px;font-weight:500;cursor:default}.cost-display svg{width:14px;height:14px}.cost-display:hover{background:#22c55e33;border-color:#22c55e66}.toolbar-icon-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:transparent;border:1px solid transparent;border-radius:10px;color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.toolbar-icon-btn:hover:not(:disabled){background:#ffffff14;color:var(--text-primary)}.toolbar-icon-btn:disabled{opacity:.4;cursor:not-allowed}.toolbar-icon-btn svg{width:18px;height:18px}.input-toolbar .send-button{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--text-primary);border:none;border-radius:10px;color:var(--app-bg);cursor:pointer;transition:all .2s ease}.input-toolbar .send-button:hover:not(:disabled){transform:scale(1.05);box-shadow:0 4px 12px #fff3}.input-toolbar .send-button:disabled{background:#ffffff1a;color:var(--text-secondary);cursor:not-allowed}.input-toolbar .send-button svg{width:18px;height:18px}.animated-placeholder{position:absolute;left:0;top:0;color:var(--text-secondary);opacity:.6;pointer-events:none;animation:placeholderSlideUp .5s cubic-bezier(.2,.8,.2,1) forwards;white-space:nowrap;overflow:hidden;display:flex;align-items:center;gap:12px;font-size:1rem}.placeholder-text{text-overflow:ellipsis;overflow:hidden}.tab-hint{font-size:.65rem;text-transform:uppercase;background:#ffffff26;padding:3px 7px;border-radius:4px;font-weight:600;color:#ffffffb3;border:1px solid rgba(255,255,255,.1)}@keyframes placeholderSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:.8;transform:translateY(0)}}.input-wrapper.loading{border-color:transparent;box-shadow:0 0 25px -5px #ffffff4d}.input-wrapper.loading:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);animation:shimmerMove 2s infinite linear;pointer-events:none}@keyframes shimmerMove{0%{transform:translate(0)}to{transform:translate(200%)}}.input-wrapper input{flex:1;background:transparent;border:none;outline:none;color:var(--text-primary);font-size:1rem;font-family:var(--font-sans)}.input-wrapper input::placeholder{color:transparent}.input-generating-label{flex:1;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--text-secondary);overflow:hidden;padding-right:8px}.generating-prompt-text{font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.8;animation:pulseText 1.5s infinite alternate ease-in-out}.input-generating-label .spin-icon{animation:spin 1s linear infinite;font-size:1.2rem;flex-shrink:0}@keyframes pulseText{0%{opacity:.4;transform:translate(0)}to{opacity:1;transform:translate(2px)}}.send-button{width:40px;height:40px;border-radius:50%;border:none;background:var(--accent-color);color:#000;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s ease;flex-shrink:0;z-index:2}.send-button:hover:not(:disabled){transform:scale(1.05)}.send-button:disabled{background:var(--accent-bg);color:var(--text-secondary);cursor:not-allowed;opacity:.5}.action-bar{position:fixed;bottom:200px;left:50%;transform:translate(-50%) translateY(20px);display:flex;flex-direction:column;align-items:center;gap:12px;opacity:0;transition:all .4s ease-out .2s;z-index:150;pointer-events:none;padding:0 20px;width:100%;max-width:800px}.action-bar.visible{opacity:1;transform:translate(-50%) translateY(0);pointer-events:auto}.active-prompt-label{color:var(--text-secondary);font-size:.9rem;background:#00000080;padding:6px 12px;border-radius:20px;max-width:80vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:auto}.action-buttons{display:flex;gap:8px;pointer-events:auto;align-items:center;flex-wrap:wrap;justify-content:center}.action-buttons button{background:#1e1e23f2;border:1px solid rgba(255,255,255,.08);color:var(--text-primary);padding:10px 18px;border-radius:12px;font-size:.85rem;font-weight:500;display:flex;align-items:center;gap:8px;cursor:pointer;transition:all .2s ease;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 2px 8px #0000004d}.action-buttons button:hover{background:#323237f2;border-color:#ffffff26;transform:translateY(-1px);box-shadow:0 4px 12px #0006}.action-buttons button:focus-visible{outline:none;border-color:#ffffff4d}.iteration-input-container{display:flex;align-items:center;gap:8px;background:#0006;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:6px 6px 6px 16px;width:100%;max-width:500px;margin-bottom:12px}.iteration-input{flex:1;background:transparent;border:none;outline:none;color:var(--text-primary);font-size:.9rem;font-family:var(--font-sans)}.iteration-input::placeholder{color:var(--text-secondary);opacity:.7}.iteration-send-btn{width:32px;height:32px;border-radius:8px;border:none;background:var(--text-primary);color:var(--app-bg);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;flex-shrink:0}.iteration-send-btn:hover:not(:disabled){transform:scale(1.05)}.iteration-send-btn:disabled{background:#ffffff1a;color:var(--text-secondary);cursor:not-allowed}.iteration-send-btn svg{width:16px;height:16px}.preview-size-toggle{display:flex;gap:2px;background:#1e1e23f2;padding:4px;border-radius:12px;border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.preview-size-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;background:transparent;border:none;color:var(--text-secondary);border-radius:8px;cursor:pointer;font-size:.8rem;font-weight:500;transition:all .2s ease}.preview-size-btn.active{background:#ffffff1f;color:var(--text-primary)}.preview-size-btn:hover:not(.active){background:#ffffff0f;color:var(--text-primary)}.preview-size-btn:focus,.preview-size-btn:focus-visible{outline:none;box-shadow:none}.preview-size-btn svg{width:14px;height:14px}.nav-handle{position:absolute;top:50%;transform:translateY(-50%);background:transparent;border:none;color:var(--text-secondary);padding:20px;cursor:pointer;z-index:80;opacity:0;transition:opacity .3s ease,color .2s ease}.immersive-app:hover .nav-handle{opacity:.5}.nav-handle:hover{opacity:1!important;color:var(--text-primary)}.nav-handle.left{left:10px}.nav-handle.right{right:10px}.drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000004d;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;display:flex;justify-content:flex-end}.drawer-content{width:100%;max-width:420px;background:#09090bd9;backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-left:1px solid var(--glass-border);display:flex;flex-direction:column;animation:slideInRight .4s cubic-bezier(.2,.8,.2,1);box-shadow:-20px 0 50px #00000080}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.drawer-header{padding:24px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--glass-border)}.drawer-header h2{margin:0;font-size:1.25rem;font-weight:600;letter-spacing:-.02em;color:var(--text-primary)}.close-button{background:#ffffff1a;border:none;color:var(--text-secondary);width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;line-height:1;cursor:pointer;transition:all .2s}.close-button:hover{background:#fff3;color:var(--text-primary)}.drawer-body{flex:1;overflow-y:auto;padding:24px}.sexy-grid{display:flex;flex-direction:column;gap:24px}.sexy-card{background:#ffffff08;border:1px solid var(--glass-border);border-radius:16px;overflow:hidden;cursor:pointer;transition:all .3s cubic-bezier(.2,.8,.2,1);position:relative}.sexy-card:hover{transform:translateY(-4px) scale(1.01);border-color:#ffffff40;box-shadow:0 15px 30px -10px #00000080}.sexy-preview{height:220px;background:#000;position:relative;overflow:hidden}.sexy-preview iframe{width:400%;height:400%;border:none;pointer-events:none;transform:scale(.25);transform-origin:top left}.sexy-label{padding:16px;text-align:center;font-weight:500;color:var(--text-primary);background:#0003;border-top:1px solid var(--glass-border);font-size:.95rem}.sexy-card:hover .sexy-label{color:#fff;background:#ffffff0d}.code-block{background:#0000004d;padding:20px;border-radius:12px;overflow-x:hidden;font-family:Roboto Mono,monospace;font-size:.85rem;color:#e5e5e5;border:1px solid var(--glass-border);margin:0;white-space:pre-wrap;word-break:break-word}.loading-state{color:var(--text-secondary);display:flex;align-items:center;gap:12px;justify-content:center;padding:60px 0;font-size:1.1rem}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1024px){.artifact-grid{grid-template-columns:1fr;height:100%;max-height:100vh;overflow-y:auto;display:flex;flex-direction:column;padding:40px 20px 160px;width:100%;box-sizing:border-box;gap:20px;-webkit-overflow-scrolling:touch}.stage-container.mode-focus .artifact-grid{overflow-y:hidden!important;pointer-events:none;height:100vh}.artifact-card{min-height:350px;flex-shrink:0}.empty-content h1{font-size:3.5rem}.stage-container.mode-focus .artifact-card.focused{width:92vw;height:65vh;top:40%;left:50%;transform:translate(-50%,-40%)!important}.action-bar{bottom:160px;width:100%;gap:8px;padding:0 16px}.iteration-input-container{max-width:100%}.action-buttons{flex-wrap:wrap;justify-content:center}.floating-input-container{padding:0 10px;bottom:20px}.sexy-preview{height:160px}.sexy-preview iframe{width:1000px;height:640px;transform:scale(.16)}}.model-selector{position:relative;flex-shrink:0}.model-selector-btn{display:flex;align-items:center;gap:6px;background:#ffffff0d;border:1px solid var(--border-color);border-radius:20px;padding:6px 12px;color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all .2s ease;white-space:nowrap}.model-selector-btn:hover:not(:disabled){background:#ffffff1a;color:var(--text-primary)}.model-selector-btn:disabled{opacity:.5;cursor:not-allowed}.model-dropdown{position:absolute;bottom:calc(100% + 8px);left:0;background:#18181bf2;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border-color);border-radius:12px;padding:6px;min-width:200px;box-shadow:0 10px 40px #00000080;z-index:200;animation:dropdownFadeIn .2s ease}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.model-option{display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:10px 12px;background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all .15s ease;text-align:left}.model-option:hover{background:#ffffff1a}.model-option.selected{background:#ffffff26}.model-name{color:var(--text-primary);font-size:.9rem;font-weight:500}.model-desc{color:#b4b4bc;font-size:.75rem;margin-top:2px}.icon-button{background:transparent;border:none;color:var(--text-secondary);padding:8px;cursor:pointer;border-radius:8px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.icon-button:hover:not(:disabled){background:#ffffff1a;color:var(--text-primary)}.icon-button:disabled{opacity:.4;cursor:not-allowed}.reference-image-preview{position:relative;margin-bottom:12px;border-radius:12px;overflow:hidden;max-width:200px;border:1px solid var(--border-color);animation:imageSlideIn .3s ease}@keyframes imageSlideIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.reference-image-preview img{width:100%;height:auto;max-height:120px;object-fit:cover;display:block}.remove-image-btn{position:absolute;top:6px;right:6px;background:#000000b3;border:none;color:#fff;width:24px;height:24px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.remove-image-btn:hover{background:#ff6464cc;transform:scale(1.1)}.history-sidebar{position:fixed;top:0;left:0;width:320px;height:100vh;background:#09090bf2;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-right:1px solid var(--border-color);z-index:300;transform:translate(-100%);transition:transform .3s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column}.history-sidebar.open{transform:translate(0)}.history-header{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid var(--border-color)}.history-header h3{margin:0;font-size:1rem;font-weight:600;color:var(--text-primary);display:flex;align-items:center;gap:8px}.close-sidebar-btn{background:#ffffff1a;border:none;color:var(--text-secondary);width:32px;height:32px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.close-sidebar-btn:hover{background:#fff3;color:var(--text-primary)}.history-search{padding:16px 20px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border-color);color:var(--text-secondary)}.history-search input{flex:1;background:transparent;border:none;outline:none;color:var(--text-primary);font-size:.9rem}.history-search input::placeholder{color:var(--text-secondary)}.clear-search{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;transition:color .2s}.clear-search:hover{color:var(--text-primary)}.history-list{flex:1;overflow-y:auto;padding:12px}.history-empty{text-align:center;color:var(--text-secondary);padding:40px 20px;font-size:.9rem}.history-item{display:flex;align-items:center;gap:12px;width:100%;padding:12px;background:transparent;border:1px solid transparent;border-radius:12px;cursor:pointer;transition:all .2s ease;text-align:left;margin-bottom:8px}.history-item:hover{background:#ffffff0d;border-color:var(--border-color)}.history-item.active{background:#ffffff1a;border-color:#fff3}.history-item-preview{width:48px;height:48px;border-radius:8px;overflow:hidden;background:var(--accent-bg);flex-shrink:0;display:flex;align-items:center;justify-content:center}.history-item-preview img{width:100%;height:100%;object-fit:cover}.preview-placeholder{color:var(--text-secondary);font-size:1.2rem}.history-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}.history-prompt{color:var(--text-primary);font-size:.85rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-time{color:var(--text-secondary);font-size:.75rem}.top-nav{position:fixed;top:20px;left:20px;z-index:200;display:flex;align-items:center;gap:4px;background:#1e1e23f2;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:4px}.top-nav-btn{background:transparent;border:none;color:var(--text-secondary);width:36px;height:36px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.top-nav-btn:hover{background:#ffffff1a;color:var(--text-primary)}.top-nav-btn svg{width:18px;height:18px}.top-nav-divider{width:1px;height:24px;background:#ffffff1a;margin:0 2px}.top-nav-count{background:#ffffff1a;color:var(--text-secondary);padding:4px 10px;border-radius:8px;font-size:.8rem;font-weight:600;min-width:32px;text-align:center}.history-toggle-btn,.gallery-toggle-btn,.library-toggle-btn{display:none}@media(max-width:1024px){.history-sidebar{width:100%}.model-selector-btn span{display:none}.model-selector-btn{padding:8px}.model-dropdown{left:auto;right:0}.reference-image-preview{max-width:150px}.top-nav{padding:3px;gap:2px}.top-nav-btn{width:32px;height:32px}.top-nav-count{padding:2px 8px;font-size:.75rem}}.history-header-actions{display:flex;align-items:center;gap:8px}.clear-history-btn{background:transparent;border:none;color:var(--text-secondary);padding:8px;border-radius:8px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.clear-history-btn:hover{background:#ef444433;color:#ef4444}.gallery-toggle-btn{position:fixed;top:20px;left:76px;z-index:200;background:var(--input-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border-color);color:var(--text-secondary);padding:10px;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;width:44px;height:44px}.gallery-toggle-btn:hover{background:#ffffff1a;color:var(--text-primary);border-color:#fff3}.gallery-toggle-btn svg{width:18px;height:18px}.gallery-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;background:var(--app-bg);display:flex;flex-direction:column;animation:fadeIn .3s ease;overflow:hidden}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.gallery-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border-color);flex-shrink:0}.gallery-header h2{margin:0;font-size:1.25rem;font-weight:600;display:flex;align-items:center;gap:10px}.gallery-header h2 svg{width:20px;height:20px}.close-gallery-btn{background:transparent;border:none;color:var(--text-secondary);padding:10px;border-radius:10px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.close-gallery-btn:hover{background:#ffffff1a;color:var(--text-primary)}.close-gallery-btn svg{width:20px;height:20px}.gallery-grid{flex:1;overflow-y:auto;padding:24px;display:flex;flex-direction:column;gap:32px}.gallery-session{background:#18181b99;border:1px solid var(--border-color);border-radius:16px;overflow:hidden}.gallery-session-header{padding:16px 20px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;gap:16px}.gallery-prompt{font-weight:500;color:var(--text-primary);font-size:.95rem}.gallery-time{color:var(--text-secondary);font-size:.8rem;flex-shrink:0}.gallery-artifacts{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;padding:16px}.gallery-artifact{background:var(--stage-bg);border:1px solid var(--border-color);border-radius:12px;overflow:hidden;cursor:pointer;transition:all .2s ease}.gallery-artifact:hover{border-color:#ffffff4d;transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.gallery-artifact iframe{width:100%;height:200px;border:none;pointer-events:none;background:#fff}.gallery-artifact-label{padding:12px 16px;font-size:.85rem;color:var(--text-secondary);background:#0000004d;border-top:1px solid var(--border-color)}@media(max-width:768px){.gallery-header{padding:16px}.gallery-grid{padding:16px;gap:24px}.gallery-artifacts{grid-template-columns:1fr}.gallery-session-header{flex-direction:column;align-items:flex-start;gap:8px}}.library-toggle-btn{position:fixed;top:20px;left:124px;z-index:200;width:44px;height:44px;background:var(--input-bg);border:1px solid var(--border-color);border-radius:12px;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.library-toggle-btn:hover{background:#ffffff1a;color:var(--text-primary);border-color:#fff3}.library-toggle-btn svg{width:18px;height:18px}.library-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;background:var(--app-bg);display:flex;flex-direction:column;animation:fadeIn .3s ease;overflow:hidden}.library-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border-color);flex-shrink:0}.library-header h2{margin:0;font-size:1.25rem;font-weight:600;display:flex;align-items:center;gap:10px}.library-header h2 svg{width:20px;height:20px}.close-library-btn{background:transparent;border:none;color:var(--text-secondary);padding:10px;border-radius:10px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.close-library-btn:hover{background:#ffffff1a;color:var(--text-primary)}.close-library-btn svg{width:20px;height:20px}.library-content{flex:1;overflow-y:auto;padding:24px;display:flex;flex-direction:column;gap:24px}.library-empty{text-align:center;color:var(--text-secondary);padding:60px 20px;font-size:1rem}.library-session{background:#1e1e23f2;border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:visible;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);flex-shrink:0}.library-session-header{padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:space-between;gap:16px;background:#0003;border-radius:16px 16px 0 0}.library-prompt{font-weight:600;color:var(--text-primary);font-size:1rem;flex:1;line-height:1.4}.library-session-actions{display:flex;align-items:center;gap:12px}.library-time{color:var(--text-secondary);font-size:.8rem}.library-delete-session{background:transparent;border:none;color:var(--text-secondary);padding:6px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.library-delete-session:hover{background:#ef444433;color:#ef4444}.library-delete-session svg{width:16px;height:16px}.library-artifacts{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;padding:20px;border-radius:0 0 16px 16px}.library-artifact{background:#141419e6;border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:hidden;transition:all .2s ease}.library-artifact:hover{border-color:#fff3;transform:translateY(-2px);box-shadow:0 8px 24px #0006}.library-artifact-preview{position:relative;background:#fff}.library-artifact-preview iframe{width:100%;height:200px;border:none;pointer-events:none;background:#fff;display:block}.library-artifact-info{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#0000004d;border-top:1px solid var(--border-color)}.library-artifact-name{font-size:.85rem;color:var(--text-secondary);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.library-rename-input{flex:1;background:#0000004d;border:1px solid rgba(255,255,255,.2);border-radius:6px;padding:6px 10px;color:var(--text-primary);font-size:.85rem;outline:none}.library-rename-input:focus{border-color:#fff6}.library-artifact-actions{display:flex;gap:4px}.library-artifact-actions button{background:transparent;border:none;color:var(--text-secondary);padding:6px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.library-artifact-actions button:hover{background:#ffffff1a;color:var(--text-primary)}.library-artifact-actions button:last-child:hover{background:#ef444433;color:#ef4444}.library-artifact-actions button svg{width:14px;height:14px}@media(max-width:768px){.library-toggle-btn{right:100px}.library-header,.library-content{padding:16px}.library-artifacts{grid-template-columns:1fr}.library-session-header{flex-direction:column;align-items:flex-start;gap:8px}.library-session-actions{width:100%;justify-content:space-between}}.export-dropdown-container{position:relative}.export-dropdown{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);background:#18181bf2;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border-color);border-radius:12px;padding:6px;min-width:180px;box-shadow:0 10px 40px #00000080;z-index:200;animation:dropdownFadeIn .2s ease}.export-dropdown button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;background:transparent;border:none;border-radius:8px;color:var(--text-secondary);font-size:.85rem;cursor:pointer;transition:all .15s ease;text-align:left}.export-dropdown button:hover{background:#ffffff1a;color:var(--text-primary)}.export-dropdown button svg{width:16px;height:16px;flex-shrink:0}.deploy-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:400;display:flex;align-items:center;justify-content:center;padding:20px}.deploy-modal{background:#18181bf2;border:1px solid var(--border-color);border-radius:20px;width:100%;max-width:480px;max-height:90vh;overflow:hidden;animation:modalSlideUp .3s ease}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.deploy-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border-color)}.deploy-modal-header h2{margin:0;font-size:1.2rem;font-weight:600;display:flex;align-items:center;gap:10px}.deploy-modal-header h2 svg{width:20px;height:20px}.close-deploy-btn{background:transparent;border:none;color:var(--text-secondary);padding:8px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.close-deploy-btn:hover{background:#ffffff1a;color:var(--text-primary)}.deploy-modal-content{padding:24px}.deploy-subtitle{margin:0 0 20px;color:var(--text-secondary);font-size:.9rem}.deploy-options{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}.deploy-option{display:flex;align-items:center;gap:16px;padding:16px;background:#ffffff08;border:1px solid var(--border-color);border-radius:12px;cursor:pointer;transition:all .2s ease;text-align:left;width:100%}.deploy-option:hover{background:#ffffff14;border-color:#fff3;transform:translate(4px)}.deploy-icon{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;flex-shrink:0}.deploy-icon.vercel{background:#000;color:#fff}.deploy-icon.github{background:#24292e;color:#fff}.deploy-icon.github svg{width:24px;height:24px}.deploy-icon.cloudflare{background:#f38020;color:#fff}.deploy-icon.cloudflare svg{width:24px;height:24px}.deploy-icon.hostinger{background:#673de6;color:#fff}.deploy-info{display:flex;flex-direction:column;gap:4px}.deploy-name{font-weight:600;color:var(--text-primary)}.deploy-desc{font-size:.8rem;color:var(--text-secondary)}.deploy-status{padding:12px 16px;background:#22c55e26;border:1px solid rgba(34,197,94,.3);border-radius:10px;color:#4ade80;font-size:.85rem;margin-bottom:20px;text-align:center}.deploy-manual{padding-top:20px;border-top:1px solid var(--border-color);text-align:center}.deploy-manual p{margin:0 0 12px;color:var(--text-secondary);font-size:.85rem}.deploy-download-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;background:#ffffff1a;border:1px solid var(--border-color);border-radius:10px;color:var(--text-primary);font-size:.9rem;cursor:pointer;transition:all .2s ease}.deploy-download-btn:hover{background:#ffffff26;border-color:#ffffff4d}.deploy-download-btn svg{width:16px;height:16px}.toast{position:fixed;top:24px;left:50%;transform:translate(-50%);z-index:9999;display:flex;align-items:center;gap:10px;padding:12px 20px;border-radius:12px;font-size:.9rem;font-weight:500;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:toastSlideIn .3s ease,toastSlideOut .3s ease 2.7s forwards;box-shadow:0 8px 32px #0006}@keyframes toastSlideIn{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes toastSlideOut{0%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-20px)}}.toast-success{background:#22c55e33;border:1px solid rgba(34,197,94,.4);color:#4ade80}.toast-error{background:#ef444433;border:1px solid rgba(239,68,68,.4);color:#f87171}.toast-info{background:#3b82f633;border:1px solid rgba(59,130,246,.4);color:#60a5fa}.toast-icon{font-size:1rem;font-weight:700}.artifact-card-actions{position:absolute;top:8px;right:8px;display:flex;gap:4px;opacity:0;transform:translateY(-4px);transition:all .2s ease;z-index:10}.artifact-card:hover .artifact-card-actions{opacity:1;transform:translateY(0)}.card-action-btn{width:32px;height:32px;border-radius:8px;border:none;background:#000000b3;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.card-action-btn:hover{background:#fff3;transform:scale(1.1)}.card-action-btn svg{width:14px;height:14px}.stage-container.mode-focus .artifact-card.focused .artifact-card-actions{display:none}.iteration-chat{display:flex;gap:8px;margin-top:12px;padding:0 16px}.iteration-chat input{flex:1;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:12px 16px;color:#fff;font-size:.9rem;outline:none;transition:all .2s ease}.iteration-chat input:focus{border-color:#fff6;background:#ffffff26}.iteration-chat input::placeholder{color:#ffffff80}.iteration-chat input:disabled{opacity:.5;cursor:not-allowed}.iteration-send-btn{width:44px;height:44px;border-radius:12px;border:none;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.iteration-send-btn:hover:not(:disabled){transform:scale(1.05);box-shadow:0 4px 20px #667eea66}.iteration-send-btn:disabled{opacity:.5;cursor:not-allowed}.iteration-send-btn svg{width:18px;height:18px}.deploy-btn{background:linear-gradient(135deg,#10b981,#059669)!important}.deploy-btn:hover{box-shadow:0 4px 20px #10b98166}@media(max-width:500px){.deploy-options{grid-template-columns:1fr}}@media(max-width:600px){.nav-handle{padding:12px;min-width:44px;min-height:44px;background:#18181bcc;border-radius:50%;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:.7}.nav-handle.left{left:8px}.nav-handle.right{right:8px}.input-toolbar{flex-direction:row;flex-wrap:nowrap;gap:8px;padding:10px 12px;overflow-x:auto;-webkit-overflow-scrolling:touch}.toolbar-left{flex-wrap:nowrap;gap:6px;flex-shrink:0}.toolbar-right{gap:6px;flex-shrink:0;margin-left:auto}.toolbar-btn{padding:6px 10px;font-size:.8rem;flex-shrink:0;min-height:44px}.floating-input-container{position:fixed;padding:0 8px;padding-bottom:env(safe-area-inset-bottom,0);bottom:max(10px,env(safe-area-inset-bottom,10px));left:0;right:0}.input-wrapper .input-area{padding:12px 14px 8px;min-height:40px}.input-wrapper textarea{min-height:36px;font-size:.9rem}.action-bar{flex-direction:column;gap:8px;padding:0 12px;bottom:auto;top:70px;left:50%;transform:translate(-50%) translateY(0);max-height:calc(100vh - 280px);overflow-y:auto}.action-bar.visible{transform:translate(-50%) translateY(0)}.active-prompt-label{font-size:.8rem;padding:4px 10px;max-width:90vw}.action-buttons{flex-wrap:wrap;justify-content:center;gap:8px}.action-buttons button{padding:6px 10px;font-size:.75rem;border-radius:8px;min-height:44px}.preview-size-toggle{padding:3px}.preview-size-btn{padding:6px 8px;font-size:0;min-width:44px;min-height:44px}.preview-size-btn svg{width:16px;height:16px}.iteration-chat{padding:0 8px;width:100%}.iteration-chat input{padding:10px 12px;font-size:.85rem}.iteration-send-btn,.close-button{width:44px;height:44px}.stage-container.mode-focus .artifact-card.focused{height:50vh;top:50%;transform:translate(-50%,-50%)!important}.drawer-content{max-width:100%}.history-sidebar{width:100%}.deploy-modal{width:calc(100% - 32px);margin:16px;max-height:calc(100vh - 32px);overflow-y:auto}.gallery-header h2,.library-header h2{font-size:1rem}.export-dropdown{left:auto;right:0;transform:none}}@media(max-width:400px){.toolbar-btn span:not(.toolbar-icon){display:none}.toolbar-btn{padding:8px}.empty-content h1{font-size:2.5rem}.artifact-card{min-height:280px}.action-bar{flex-wrap:wrap;justify-content:center}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.artifact-card,.session-group,.empty-state,.drawer-content,.history-sidebar,.toast{animation:none!important;transition:none!important}}*:focus{outline:none}*:focus-visible{outline:2px solid rgba(255,255,255,.6);outline-offset:2px}button:focus-visible,.toolbar-btn:focus-visible,.toolbar-icon-btn:focus-visible,.send-button:focus-visible,.iteration-send-btn:focus-visible{outline:2px solid rgba(255,255,255,.8);outline-offset:2px;box-shadow:0 0 0 4px #ffffff26}.action-buttons button:focus-visible,.preview-size-btn:focus-visible{outline:none;box-shadow:none;border-color:#ffffff40}input:focus-visible,textarea:focus-visible{outline:none;border-color:#fff6;box-shadow:0 0 0 3px #ffffff1a}.artifact-card:focus-visible{outline:2px solid rgba(255,255,255,.6);outline-offset:4px}.history-item:focus-visible{outline:2px solid rgba(255,255,255,.6);outline-offset:-2px;background:#ffffff14}.deploy-modal:focus-visible,.model-dropdown:focus-visible,.export-dropdown:focus-visible{outline:none}.skip-link{position:absolute;top:-40px;left:0;background:var(--text-primary);color:var(--app-bg);padding:8px 16px;z-index:1000;text-decoration:none;font-weight:600;border-radius:0 0 8px;transition:top .3s ease}.skip-link:focus{top:0}