@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Noto+Sans+SC:wght@400;500;700&family=Sora:wght@500;600;700&display=swap";:root{--bg: #f5f3ee;--bg-deep: #ebe5da;--surface: rgba(255, 255, 255, .76);--surface-strong: rgba(255, 255, 255, .92);--surface-soft: rgba(255, 250, 243, .78);--line: rgba(52, 64, 63, .1);--line-strong: rgba(52, 64, 63, .16);--text: #1f2937;--muted: #5e6a67;--subtle: #7f8a86;--accent: #7c8b7a;--accent-strong: #5e6f5d;--gold: #c7a56b;--gold-deep: #a9854d;--success: #547463;--error: #a55d4d;--shadow: 0 24px 70px rgba(48, 42, 29, .08);--radius-xl: 28px;--radius-lg: 22px;--radius-md: 16px}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{font-family:Noto Sans SC,sans-serif;color:var(--text);background:radial-gradient(circle at top left,rgba(199,165,107,.2),transparent 32%),radial-gradient(circle at 85% 12%,rgba(124,139,122,.18),transparent 26%),linear-gradient(180deg,#f8f6f1 0%,var(--bg) 52%,var(--bg-deep) 100%)}button,input,textarea{font:inherit}button{cursor:pointer}.studio-page{position:relative;min-height:100vh;overflow:hidden}.studio-background{position:fixed;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.24),transparent 38%),radial-gradient(circle at 30% 20%,rgba(255,255,255,.5),transparent 28%)}.studio-topbar,.studio-layout,.studio-card,.hero-card,.result-shell,.recent-shell{position:relative;z-index:1}.studio-topbar{width:min(1180px,calc(100% - 32px));margin:24px auto 0;padding:18px 22px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:24px}.studio-topbar>div:first-child{display:flex;align-items:center;gap:16px}.brand-mark{width:48px;height:48px;border-radius:18px;display:grid;place-items:center;font-family:Sora,sans-serif;font-size:20px;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--accent-strong),var(--gold))}.brand-copy h1,.hero-copy h2,.card-header h3,.result-header h3,.recent-header h3{margin:0;font-family:Sora,sans-serif}.brand-copy h1{font-size:22px}.brand-copy p,.hero-copy p,.card-header p,.result-header p,.upload-copy p,.result-empty p,.analysis-block p,.recent-card span{margin:0;color:var(--muted)}.topbar-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.studio-badge{min-width:132px;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:#ffffff80;display:flex;flex-direction:column;gap:4px}.studio-badge span,.eyebrow,.field-label{font-family:IBM Plex Mono,monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase}.studio-badge strong{font-size:14px;font-weight:600}.studio-badge-accent{border-color:#c7a56b4d;background:#fff8ecd1}.studio-badge-success{border-color:#5474633d;background:#f1f8f3e6}.studio-layout{width:min(1180px,calc(100% - 32px));margin:24px auto 48px;display:grid;gap:22px}.hero-card,.studio-card,.result-shell,.recent-shell{border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--surface);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--shadow)}.hero-card{padding:34px;display:grid;gap:24px;overflow:hidden}.hero-card:after{content:"";position:absolute;inset:auto 32px 0 auto;width:220px;height:220px;border-radius:999px;background:radial-gradient(circle,rgba(199,165,107,.26),transparent 68%);pointer-events:none}.hero-copy{max-width:760px;display:grid;gap:12px}.eyebrow{color:var(--subtle)}.hero-copy h2{font-size:clamp(30px,5vw,54px);line-height:1.1}.suggestion-row{display:flex;flex-wrap:wrap;gap:10px}.suggestion-chip,.size-pill,.ghost-button,.generate-button,.recent-card,.remove-button{border:0;transition:transform .2s ease,background .2s ease,border-color .2s ease,opacity .2s ease}.suggestion-chip,.size-pill,.ghost-button{padding:11px 14px;border-radius:999px;border:1px solid var(--line);background:#ffffff94;color:var(--muted)}.suggestion-chip:hover,.size-pill:hover,.ghost-button:hover,.recent-card:hover{transform:translateY(-1px)}.studio-card,.result-shell,.recent-shell{padding:28px}.card-header,.result-header,.recent-header{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:20px}.card-header h3,.result-header h3,.recent-header h3{font-size:24px}.upload-panel{border:1px dashed rgba(124,139,122,.34);border-radius:var(--radius-lg);padding:22px;min-height:168px;background:linear-gradient(135deg,#ffffffa6,#faf6efcc),repeating-linear-gradient(135deg,transparent 0,transparent 12px,rgba(124,139,122,.02) 12px,rgba(124,139,122,.02) 24px);display:flex;align-items:center;justify-content:space-between;gap:20px}.upload-panel-dragging{border-color:#7c8b7ab8;background:linear-gradient(135deg,#ffffffd1,#f7f4edfa),#ffffffe6}.upload-copy{display:grid;gap:8px}.upload-copy h4{margin:0;font-family:Sora,sans-serif;font-size:20px}.preview-grid{margin-top:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px}.preview-card{position:relative;padding:10px;border-radius:20px;border:1px solid var(--line);background:var(--surface-soft)}.preview-card img,.result-image,.recent-card img{display:block;width:100%;object-fit:cover}.preview-card img{aspect-ratio:1 / 1;border-radius:14px}.remove-button{position:absolute;right:18px;bottom:18px;padding:8px 10px;border-radius:999px;background:#1f2937c2;color:#fff}.composer-panel{margin-top:20px;display:grid;gap:10px}.field-label{color:var(--subtle)}.prompt-input{width:100%;min-height:180px;padding:20px 22px;border-radius:24px;border:1px solid var(--line);background:#ffffffbd;outline:none;resize:vertical;color:var(--text);line-height:1.7}.prompt-input:focus{border-color:#7c8b7a7a;box-shadow:0 0 0 4px #7c8b7a14}.toolbar,.size-switcher,.result-actions,.meta-grid,.recent-grid{display:flex;gap:12px}.toolbar{margin-top:20px;align-items:center;justify-content:space-between;flex-wrap:wrap}.size-switcher{flex-wrap:wrap}.size-pill-active{background:#7c8b7a24;border-color:#7c8b7a4d;color:var(--accent-strong)}.generate-button{min-width:148px;padding:14px 22px;border-radius:999px;color:#fff;background:linear-gradient(135deg,var(--accent-strong),var(--gold));box-shadow:0 18px 36px #685c3a2e}.generate-button:disabled{opacity:.62;cursor:not-allowed}.status-banner{margin-top:16px;padding:12px 14px;border-radius:16px}.status-banner-error{border:1px solid rgba(165,93,77,.18);background:#faefede6;color:var(--error)}.result-card{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:24px}.result-image-wrap{padding:12px;border-radius:24px;border:1px solid var(--line);background:#ffffffa3}.result-image{border-radius:18px}.result-meta{display:grid;gap:16px}.meta-grid{flex-wrap:wrap}.prompt-block,.analysis-block{padding:18px;border-radius:20px;border:1px solid var(--line);background:#ffffff8f;display:grid;gap:10px}.prompt-block pre{margin:0;white-space:pre-wrap;word-break:break-word;line-height:1.75;color:var(--muted)}.result-actions{flex-wrap:wrap}.ghost-button-strong{background:#7c8b7a24;color:var(--accent-strong);border-color:#7c8b7a42}.result-empty{padding:28px;border-radius:22px;border:1px dashed var(--line-strong);background:#fff6}.recent-grid{flex-wrap:wrap}.recent-card{width:164px;padding:10px;border-radius:20px;background:#fff9;border:1px solid var(--line);display:grid;gap:10px;text-align:left}.recent-card img{aspect-ratio:1 / 1;border-radius:14px}@media(max-width:900px){.studio-topbar,.card-header,.result-header,.recent-header,.upload-panel,.result-card,.toolbar{grid-template-columns:1fr;flex-direction:column;align-items:stretch}.studio-topbar{padding:18px}.studio-topbar>div:first-child{align-items:flex-start}.topbar-status{justify-content:flex-start}.hero-card,.studio-card,.result-shell,.recent-shell{padding:22px}}@media(max-width:640px){.studio-topbar,.studio-layout{width:min(100% - 20px,1180px)}.hero-copy h2{font-size:30px}.brand-copy h1{font-size:18px}.brand-copy p,.card-header p,.result-header p{font-size:14px}.generate-button,.ghost-button,.size-pill,.suggestion-chip{width:100%;justify-content:center}.recent-card{width:100%}}