@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Poppins:wght@500;600;700&display=swap";:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#f4fbff;--bg:#07111f;--bg-deep:#030912;--text:#f4fbff;--muted:#d5e7f4b8;--soft:#b8d1e485;--line:#7dd1ff26;--line-strong:#7dd1ff47;--panel:#0a1524b8;--panel-strong:#0b1c2fd6;--panel-alt:#06101ce6;--accent:#7be7ff;--accent-strong:#18c4ff;--accent-deep:#0b87d9;--success:#7ff7d4;--danger:#ff9ab4;--shadow:0 24px 80px #0000007a;--shadow-glow:0 0 0 1px #7be7ff14, 0 32px 90px #08122a8f;--radius-lg:28px;--radius-md:20px;--radius-sm:14px;background:#07111f;font-family:Inter,Microsoft YaHei,PingFang SC,sans-serif}html,#app{width:100%;min-height:100%;overflow-x:hidden}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;color:var(--text);background:radial-gradient(circle at 12% 16%,#18c4ff2e,#0000 24%),radial-gradient(circle at 82% 10%,#7be7ff1f,#0000 20%),radial-gradient(circle at 70% 78%,#0b87d929,#0000 28%),linear-gradient(135deg,#020611 0%,#06111f 42%,#030b15 100%);margin:0;overflow-x:hidden}body:before{content:"";pointer-events:none;background-color:#0000;background-image:linear-gradient(#7be7ff09 1px,#0000 1px),linear-gradient(90deg,#7be7ff09 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:44px 44px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000000e0,#0000 82%);mask-image:linear-gradient(#000000e0,#0000 82%)}body:after{content:"";pointer-events:none;opacity:.18;mix-blend-mode:screen;background:radial-gradient(circle,#0000 0 54%,#7be7ff0f 90%),repeating-linear-gradient(#ffffff04 0 1px,#0000 1px 3px);position:fixed;inset:0}button,textarea,input,a{font:inherit}button{cursor:pointer}.page-shell{isolation:isolate;min-height:100vh;padding:28px clamp(18px,3.3vw,56px) 42px;position:relative}.bg-orb,.bg-grid{pointer-events:none;z-index:0;position:fixed}.bg-orb{filter:blur(30px);opacity:.6;border-radius:999px;width:32rem;height:32rem}.orb-one{background:radial-gradient(circle,#18c4ff6b,#0000 68%);animation:18s ease-in-out infinite alternate drift;top:-7rem;left:-8rem}.orb-two{background:radial-gradient(circle,#7be7ff38,#0000 70%);animation:22s ease-in-out infinite alternate-reverse drift;bottom:-10rem;right:-8rem}.bg-grid{background:linear-gradient(#02081229,#02081200),radial-gradient(circle at top,#7dd1ff1a,#0000 42%);inset:0}.topbar,.studio-layout{z-index:1;width:100%;max-width:1440px;margin:0 auto;position:relative}.topbar{justify-content:space-between;align-items:center;gap:18px;margin-bottom:28px;display:flex}.brand-mark,.top-actions,.account-pill,.quota-mini{align-items:center;display:inline-flex}.brand-mark{gap:14px}.brand-copy{gap:4px;display:grid}.brand-copy strong{letter-spacing:.04em;font-family:Poppins,Inter,sans-serif;font-size:1.02rem;font-weight:700}.brand-copy span{color:var(--soft);letter-spacing:.12em;text-transform:uppercase;font-size:.78rem}.brand-sigil,.modal-icon{width:44px;height:44px;color:var(--accent);background:linear-gradient(#7be7ff29,#18c4ff0f),#0a1524c2;border:1px solid #7be7ff47;border-radius:16px;place-items:center;display:grid;box-shadow:inset 0 1px #ffffff14,0 18px 48px #18c4ff1f}.top-actions{gap:12px}.quota-mini,.account-pill{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);min-height:42px;color:var(--muted);background:#08121ead;border-radius:999px;gap:10px;padding:0 14px;box-shadow:inset 0 1px #ffffff0a}.quota-mini{color:var(--accent);font-weight:700}.account-pill span{text-overflow:ellipsis;white-space:nowrap;max-width:240px;overflow:hidden}.account-pill button{color:inherit;background:0 0;border:0;justify-content:center;align-items:center;font-weight:700;display:inline-flex}.glass-panel{border:1px solid var(--line);background:linear-gradient(180deg, #ffffff0f, #ffffff03), var(--panel);box-shadow:var(--shadow-glow);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.studio-layout{grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);align-items:start;gap:24px;display:grid}.control-panel,.preview-panel{border-radius:var(--radius-lg);overflow:hidden}.control-panel{padding:30px;animation:.54s rise-in}.preview-panel{animation:.64s rise-in;position:sticky;top:18px}.panel-heading{grid-template-columns:minmax(0,1fr) 220px;align-items:start;gap:18px;margin-bottom:22px;display:grid}.hero-copy-block{gap:12px;display:grid}.eyebrow,.mini-kicker{color:var(--accent);letter-spacing:.16em;text-transform:uppercase;margin:0;font-size:.76rem;font-weight:800}.panel-heading h1,.section-head h2,.preview-header h2,.auth-modal h2{margin:0;font-family:Poppins,Inter,sans-serif;font-weight:700}.panel-heading h1{letter-spacing:-.04em;max-width:11.5em;font-size:clamp(2.4rem,4.2vw,4.8rem);line-height:1.02}.headline-accent{color:var(--accent);text-shadow:0 0 24px #7be7ff3d;display:inline}.hero-copy{max-width:52rem;color:var(--muted);margin:0;font-size:1.02rem;line-height:1.75}.quota-summary{background:linear-gradient(#7be7ff1f,#7be7ff0a),#081220c7;border:1px solid #7dd1ff3d;border-radius:22px;gap:8px;padding:18px;display:grid}.quota-summary span,.quota-summary small{color:var(--muted)}.quota-summary strong{color:var(--text);font-family:Poppins,Inter,sans-serif;font-size:2rem;line-height:1}.section-head{justify-content:space-between;align-items:end;gap:14px;margin-bottom:18px;display:flex}.section-head h2{margin-top:6px;font-size:1.5rem}.section-head>span{color:var(--soft);font-size:.88rem}.recipe-gallery{margin-bottom:24px}.recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.recipe-card{border-radius:22px;transition:transform .22s,border-color .22s,box-shadow .22s;display:grid;position:relative;overflow:hidden}.recipe-card:after{content:"";pointer-events:none;background:linear-gradient(#ffffff0f,#0000 40%);position:absolute;inset:0}.recipe-card:hover{border-color:#7be7ff57;transform:translateY(-6px);box-shadow:0 0 0 1px #7be7ff14,0 28px 70px #06122a94,0 0 30px #18c4ff1f}.recipe-visual{background:linear-gradient(#08121e66,#040c16e6);min-height:206px;position:relative;overflow:hidden}.recipe-visual:after{content:"";pointer-events:none;background:linear-gradient(#07112105 0%,#07112114 55%,#07112152 100%),radial-gradient(circle at 18% 18%,#ffffff2e,#0000 28%);position:absolute;inset:0}.recipe-cover-image{object-fit:cover;width:100%;height:100%;min-height:206px;display:block}.visual-jellyfish{background:radial-gradient(circle at 30% 30%,#95f2ffe6,#0000 18%),radial-gradient(circle at 70% 42%,#18c4ff47,#0000 24%),linear-gradient(135deg,#082040d9,#05101cf2)}.visual-jellyfish:before{background:#7be7ff57;height:82px;inset:16% 52% auto 10%}.visual-jellyfish:after{background:#1381ff33;height:86px;inset:auto 10% 12% 52%}.visual-product{background:linear-gradient(145deg,#030b14f5,#0e2d48e0),radial-gradient(circle at 80% 20%,#7be7ff38,#0000 24%)}.visual-product:before{filter:blur();background:linear-gradient(90deg,#0b87d93d,#7be7ff3d);border-radius:18px;height:78px;inset:auto 18% 14%}.visual-product:after{filter:blur();background:linear-gradient(#ffffff3d,#7be7ff1f);border-radius:24px;height:98px;inset:22% 36% auto}.visual-mecha{background:radial-gradient(circle at 75% 24%,#7be7ff38,#0000 18%),linear-gradient(135deg,#071121eb,#103550d1),linear-gradient(45deg,#ffffff0f,#0000)}.visual-mecha:before{background:linear-gradient(#7be7ff3d,#0000);inset:18% 54% 18% 18%}.visual-mecha:after{background:#1b7ce233;inset:18% 18% 22% 58%}.visual-terminal{background:linear-gradient(#061526b3,#070f18f5),radial-gradient(circle,#18c4ff38,#0000 42%)}.visual-terminal:before{filter:none;background-color:#0000;background-image:linear-gradient(#7be7ff0f 1px,#0000 1px),linear-gradient(90deg,#7be7ff0f 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:22px 22px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;border:1px solid #7be7ff3d;inset:18% 16%}.visual-terminal:after{background:#7be7ff1f;inset:34% 28%}.recipe-tag{z-index:1;min-height:30px;color:var(--accent);letter-spacing:.08em;text-transform:uppercase;background:#0309124d;border:1px solid #ffffff14;border-radius:999px;align-items:center;padding:0 12px;font-size:.76rem;font-weight:700;display:inline-flex;position:absolute;top:18px;left:18px}.recipe-content{flex-direction:column;align-items:flex-start;gap:12px;padding:20px;display:flex}.recipe-content strong{font-size:1.08rem}.recipe-content p{color:var(--muted);margin:0;line-height:1.7}.card-action,.text-button{width:fit-content;min-height:40px;color:var(--accent);background:#7be7ff14;border:1px solid #7be7ff42;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:.88rem;font-weight:700;transition:transform .18s,border-color .18s,background .18s,box-shadow .18s;display:inline-flex}.card-action{margin-top:auto}.card-action:hover,.text-button:hover{background:#7be7ff24;border-color:#7be7ff80;transform:translateY(-2px);box-shadow:0 10px 24px #18c4ff29}.prompt-form{gap:16px;display:grid}.field-block{border-radius:22px;gap:12px;padding:18px;display:grid}.prompt-block{gap:16px}.field-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:16px;display:grid}.field-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.section-label{align-items:center;gap:9px;font-size:.94rem;font-weight:700;display:inline-flex}.section-label svg,.preview-header svg,.result-title svg{color:var(--accent)}.field-note{color:var(--soft);font-size:.84rem}.prompt-form textarea,.auth-form input{width:100%;color:var(--text);background:#040c16b8;border:1px solid #7dd1ff1f;border-radius:18px;outline:none;transition:border-color .18s,box-shadow .18s,background .18s}.prompt-form textarea{resize:vertical;min-height:178px;padding:16px 18px;line-height:1.72}.prompt-form textarea::placeholder{color:#d5e7f457}.prompt-form textarea:focus,.auth-form input:focus{background:#040c16e0;border-color:#7be7ff66;box-shadow:0 0 0 4px #7be7ff14}.quality-row,.chip-row{flex-wrap:wrap;gap:10px;display:flex}.quality-chip,.chip{min-height:42px;color:var(--muted);background:#ffffff08;border:1px solid #7dd1ff1f;border-radius:999px;padding:0 16px;font-weight:700;transition:transform .18s,border-color .18s,background .18s,color .18s,box-shadow .18s}.quality-chip.active,.chip.active{color:var(--text);background:linear-gradient(#7be7ff2e,#7be7ff14);border-color:#7be7ff70;box-shadow:0 10px 24px #18c4ff1f}.quality-chip.locked{cursor:not-allowed;opacity:.54}.quality-chip small{color:var(--accent);margin-left:6px;font-size:.72rem}.quality-chip:hover:not(:disabled),.chip:hover:not(:disabled){background:#7be7ff14;border-color:#7be7ff52;transform:translateY(-2px)}.ratio-chip{justify-content:center;align-items:center;gap:8px;min-width:82px;display:inline-flex}.ratio-icon{border:2px solid;border-radius:4px;display:inline-block}.ratio-4-3{width:18px;height:14px}.ratio-1-1{width:16px;height:16px}.ratio-16-9{width:22px;height:13px}.ratio-9-16{width:13px;height:22px}.ratio-3-4{width:15px;height:19px}.quota-meter{background:#ffffff0f;border-radius:999px;height:10px;overflow:hidden}.quota-meter span{border-radius:inherit;background:linear-gradient(90deg, var(--accent-deep), var(--accent-strong), var(--accent));height:100%;display:block;box-shadow:0 0 18px #18c4ff4d}.generate-button{min-height:58px;color:var(--text);background:linear-gradient(135deg,#7be7ff3d,#18c4ff2e),#09192ae6;border:1px solid #7be7ff5c;border-radius:18px;justify-content:center;align-items:center;gap:10px;font-size:1rem;font-weight:800;transition:transform .18s,box-shadow .18s,border-color .18s,opacity .18s;display:inline-flex;box-shadow:inset 0 1px #ffffff14,0 18px 38px #18c4ff2e}.generate-button:hover:not(:disabled){border-color:#7be7ff8f;transform:translateY(-3px);box-shadow:inset 0 1px #ffffff1f,0 24px 46px #18c4ff3d,0 0 30px #18c4ff1f}.generate-button:disabled{cursor:not-allowed;opacity:.55}.preview-header{justify-content:space-between;align-items:center;gap:14px;padding:24px 24px 18px;display:flex}.preview-header>div{align-items:center;gap:12px;display:inline-flex}.preview-header h2{font-size:1.46rem}.preview-header span{color:var(--soft);font-weight:600}.preview-body{gap:14px;padding:0 24px 24px;display:grid}.result-card,.history-list,.quota-card{border-radius:22px}.result-card{padding:20px}.result-meta{justify-content:space-between;align-items:center;gap:12px;display:flex}.result-title{align-items:center;gap:10px;display:inline-flex}.result-title strong{font-size:1rem}.result-title span{color:var(--soft);border:1px solid #7dd1ff29;border-radius:999px;padding:4px 10px;font-size:.74rem;font-weight:700}.result-card time{color:var(--soft);font-size:.84rem}.result-prompt{color:var(--muted);margin:16px 0 14px;line-height:1.76}.empty-preview,.loading-preview{min-height:clamp(340px,41vw,570px);color:var(--muted);text-align:center;background:radial-gradient(circle at 50% 10%,#7be7ff24,#0000 30%),linear-gradient(135deg,#08182aeb,#050c16fa);border:1px solid #7dd1ff1f;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:10px;display:flex;position:relative;overflow:hidden}.empty-preview:before{content:"";border:1px solid #7be7ff14;border-radius:999px;position:absolute;inset:18px}.empty-orbit{opacity:.6;position:absolute;inset:16%}.empty-orbit span{border:1px solid #7be7ff2e;border-radius:50%;position:absolute}.empty-orbit span:first-child{inset:0 20%}.empty-orbit span:nth-child(2){inset:16% 0;transform:rotate(-18deg)}.empty-orbit span:nth-child(3){border-color:#18c4ff47;inset:30%}.empty-preview>span{color:var(--text);letter-spacing:-.04em;font-family:Poppins,Inter,sans-serif;font-size:clamp(2.5rem,6vw,5.4rem);font-weight:700;position:relative}.empty-preview p,.loading-preview p{margin:0;position:relative}.result-figure{gap:12px;margin:0;display:grid}.result-figure img{object-fit:contain;background:#01070e99;border-radius:20px;width:100%;max-height:590px}.result-figure figcaption{color:var(--soft);justify-content:space-between;align-items:center;gap:12px;display:flex}.result-figure a{color:var(--accent);align-items:center;gap:8px;font-weight:700;text-decoration:none;transition:transform .18s,color .18s;display:inline-flex}.result-figure a:hover{color:#b8f4ff;transform:translateY(-2px)}.history-list{gap:10px;max-height:280px;padding:12px;display:grid;overflow:auto}.history-item{width:100%;color:var(--text);text-align:left;background:#ffffff06;border:1px solid #0000;border-radius:16px;grid-template-columns:auto 1fr;align-items:center;gap:12px;padding:12px 14px;transition:transform .18s,border-color .18s,background .18s;display:grid}.history-item:hover{background:#7be7ff14;border-color:#7be7ff33;transform:translateY(-2px)}.history-item.active{background:linear-gradient(#7be7ff1f,#7be7ff0f);border-color:#7be7ff57}.history-item-index{color:var(--accent);letter-spacing:.08em;font-size:.82rem;font-weight:800}.history-item-copy{gap:4px;min-width:0;display:grid}.history-item-copy strong,.history-item-copy small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.history-item-copy small{color:var(--soft)}.quota-card{color:var(--muted);flex-wrap:wrap;align-items:center;gap:10px;padding:14px 16px;display:flex}.quota-card strong{color:var(--accent)}.inline-error,.auth-message{color:var(--danger);margin:0;font-weight:700}.modal-backdrop{z-index:10;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#00050cb8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.auth-modal{background:linear-gradient(180deg, #ffffff0f, #ffffff03), var(--panel-strong);border-radius:28px;width:min(440px,100%);padding:28px;position:relative}.modal-close{color:var(--soft);background:0 0;border:0;font-size:1.5rem;position:absolute;top:12px;right:14px}.auth-modal h2{margin:16px 0 8px;font-size:1.8rem}.auth-modal p{color:var(--muted);line-height:1.7}.auth-form{gap:13px;margin-top:18px;display:grid}.auth-form label{color:var(--text);gap:8px;font-weight:700;display:grid}.auth-form input{min-height:46px;padding:0 14px}.switch-auth{width:100%;color:var(--accent);background:0 0;border:0;margin-top:14px;font-weight:700}.spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes drift{0%{transform:translate(0,0)scale(1)}to{transform:translate(18px,24px)scale(1.08)}}@keyframes rise-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (width<=1200px){.studio-layout{grid-template-columns:1fr}.preview-panel{position:static}}@media (width<=900px){.panel-heading,.field-grid{grid-template-columns:1fr}.recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=720px){.page-shell{padding:14px 12px 28px}.topbar,.top-actions,.preview-header,.result-meta,.result-figure figcaption,.section-head{flex-direction:column;align-items:stretch}.brand-mark,.top-actions,.quota-mini,.account-pill{justify-content:center;width:100%}.control-panel,.preview-header,.preview-body{padding-left:16px;padding-right:16px}.control-panel{padding-top:22px;padding-bottom:22px}.panel-heading h1{max-width:9.4em;font-size:clamp(2rem,10vw,2.6rem)}.hero-copy{font-size:.96rem}.recipe-grid{grid-template-columns:1fr}.field-head{flex-wrap:wrap;align-items:flex-start}.text-button,.card-action{width:100%}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}