:root {
  color-scheme: dark;
  --bg: #080a13;
  --sidebar: #0a0c17;
  --panel: #101321;
  --panel-raised: #15192a;
  --line: #252a3c;
  --line-soft: #1c2233;
  --text: #edf0fa;
  --muted: #8d96ac;
  --dim: #626b80;
  --lime: #61dceb;
  --lime-soft: #7bcfee;
  --blue: #9dbaff;
  --coral: #ffad98;
  --lilac: #c3a7ff;
  --mono: "Segoe UI", "DengXian", "PingFang SC", sans-serif;
  --sans: "Segoe UI Variable Text", "Segoe UI", "DengXian", "PingFang SC", sans-serif;
}

* { box-sizing: border-box; }
html { min-width: 320px; min-height: 100%; background: var(--bg); scroll-behavior: smooth; }
body { min-width: 320px; min-height: 100vh; margin: 0; background: var(--bg); color: var(--text); font-family: var(--sans); font-size: 16px; -webkit-font-smoothing: antialiased; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 1px solid var(--lime); outline-offset: 3px; }
a { color: inherit; }
[hidden] { display: none !important; }

.studio-frame { display: grid; grid-template-columns: 232px minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; top: 0; display: flex; flex-direction: column; height: 100vh; min-height: 680px; padding: 29px 16px 20px; border-right: 1px solid #1e251f; background: var(--sidebar); z-index: 10; }
.brand { display: flex; align-items: center; gap: 12px; min-height: 44px; margin: 0 7px 52px; text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 10px; background: var(--lime); color: #11170a; font-family: var(--mono); font-size: 26px; font-weight: 500; line-height: 1; box-shadow: 0 7px 22px #a7d94a18; }
.brand-copy { display: flex; flex-direction: column; gap: 3px; }
.brand-copy strong { font-family: var(--mono); font-size: 17px; letter-spacing: -.045em; font-weight: 500; }
.brand-copy small { color: #697168; font-family: var(--mono); font-size: 10px; letter-spacing: .105em; }
.nav-caption, .eyebrow { color: #7f897c; font-family: var(--mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }
.nav-caption { margin: 0 13px 12px; }
.main-nav { display: grid; gap: 5px; }
.nav-item { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 45px; padding: 0 12px; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #a5ada2; text-align: left; cursor: pointer; transition: background .18s ease, border-color .18s ease, color .18s ease; }
.nav-item:hover { border-color: #242d24; background: #111712; color: var(--text); }
.nav-item.is-active { border-color: #34432b; background: #182014; color: #eef6df; }
.nav-icon { display: grid; place-items: center; width: 20px; color: #99a394; font-size: 19px; }
.nav-item.is-active .nav-icon { color: var(--lime); }
.nav-key, .nav-count { margin-left: auto; color: #6d776b; font-family: var(--mono); font-size: 12px; }
.nav-count { display: grid; place-items: center; min-width: 20px; height: 20px; border-radius: 10px; background: #1c231d; }
.sidebar-bottom { margin-top: auto; }
.plan-mini { display: grid; gap: 9px; padding: 15px 14px 13px; border: 1px solid #293228; border-radius: 8px; background: linear-gradient(135deg, #141a13, #101511 74%); }
.plan-mini .eyebrow { font-size: 11px; color: #818b7c; }
.plan-mini strong { font-size: 16px; font-weight: 600; }
.plan-mini > span:nth-of-type(2) { color: var(--muted); font-size: 13px; }
.plan-mini button, .universe-link { border: 0; background: none; color: var(--lime-soft); font-size: 13px; cursor: pointer; text-align: left; }
.plan-mini button { display: flex; justify-content: space-between; margin: 4px -2px -1px; padding: 6px 2px 0; }
.universe-link { display: flex; align-items: center; gap: 8px; margin: 25px 10px 18px; color: #a2aaa0; text-decoration: none; }
.universe-link > span:last-child { margin-left: auto; color: #778174; }
.universe-dot { width: 7px; height: 7px; border-radius: 50%; background: #b5ca93; box-shadow: 0 0 9px #cefa6838; }
.version-note { margin: 0 10px; color: #505a50; font: 11px var(--mono); letter-spacing: .09em; }

.main-shell { min-width: 0; min-height: 100vh; background: radial-gradient(ellipse at 83% 4%, #17201640 0, transparent 29%), var(--bg); }
.topbar { position: sticky; top: 0; z-index: 8; display: flex; align-items: center; justify-content: space-between; min-height: 68px; padding: 0 clamp(22px, 3.5vw, 50px); border-bottom: 1px solid #1d241e; background: #0a0d0af2; backdrop-filter: blur(14px); }
.breadcrumb { display: flex; align-items: center; gap: 11px; color: #858f83; font-size: 14px; }
.breadcrumb i { color: #4d584d; font-style: normal; }
.breadcrumb strong { color: #e2e8dc; font-weight: 500; }
.topbar-actions { display: flex; align-items: center; gap: 13px; }
.engine-state { display: flex; align-items: center; gap: 8px; margin-right: 4px; color: #899286; font-size: 13px; }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: #828981; box-shadow: 0 0 0 3px #82898119; }
.engine-state.is-ready .status-dot { background: #aee975; box-shadow: 0 0 0 3px #aee97520; }
.engine-state.is-offline .status-dot { background: #e9a18a; box-shadow: 0 0 0 3px #e9a18a20; }
.credit-pill { display: flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 12px; border: 1px solid #303b2d; border-radius: 6px; background: #141b12; color: #d7eac0; font-size: 13px; cursor: pointer; }
.credit-pill:hover { border-color: #657744; }
.credit-gem { color: var(--lime); font-size: 16px; }
.account-button { display: flex; align-items: center; gap: 8px; padding: 3px 1px 3px 7px; border: 0; background: transparent; color: #e0e5db; font-size: 13px; cursor: pointer; }
.avatar { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid #343e32; border-radius: 50%; background: #182018; color: var(--lime); font-family: var(--mono); font-size: 15px; }
.mobile-menu { display: none; border: 0; background: transparent; color: var(--text); font-size: 20px; }
.content-area { width: min(100%, 1600px); margin: 0 auto; padding: 39px clamp(22px, 3.5vw, 50px) 34px; }
.view { display: none; animation: view-enter .32s ease both; }
.view.is-visible { display: block; }
@keyframes view-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

.welcome-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.welcome-kicker { display: flex; align-items: center; gap: 8px; margin: 1px 0 13px; color: #9ca990; }
.tiny-spark { color: var(--lime); font-size: 16px; }
.welcome-row h1, .page-heading h1 { margin: 0; color: #f0f3eb; font-size: clamp(27px, 2.5vw, 37px); font-weight: 500; letter-spacing: -.045em; line-height: 1.2; }
.welcome-row h1 span { color: var(--lime); }
.welcome-subtitle, .page-heading p { margin: 11px 0 0; color: #879084; font-size: 15px; }
.date-chip { display: flex; align-items: center; gap: 8px; margin-bottom: 3px; padding: 9px 11px; border: 1px solid #242d25; border-radius: 6px; color: #96a091; font-size: 12px; white-space: nowrap; }
.date-mark { color: #b7c0ad; font-size: 16px; }
.overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; margin-bottom: 21px; }
.metric-card { min-height: 105px; padding: 15px 17px 14px; border: 1px solid var(--line-soft); border-radius: 8px; background: #101411; }
.metric-primary { border-color: #35422e; background: linear-gradient(110deg, #151d13, #111612 72%); }
.metric-top { display: flex; align-items: center; justify-content: space-between; color: #98a194; font-size: 13px; }
.metric-icon { color: var(--lime); font-size: 17px; }
.metric-icon-lilac { color: var(--lilac); }
.metric-icon-blue { color: var(--blue); }
.metric-value { margin-top: 9px; color: #f0f3ea; font-family: var(--mono); font-size: 27px; letter-spacing: -.06em; line-height: 1; }
.metric-text { font-family: var(--sans); font-size: 20px; letter-spacing: -.03em; }
.metric-foot { margin-top: 9px; color: #6f7a6f; font-size: 12px; }

.studio-grid { display: grid; grid-template-columns: minmax(0, 1.63fr) minmax(265px, .9fr); align-items: start; gap: 17px; }
.surface { border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.composer-surface { min-width: 0; padding: 22px 23px 18px; }
.surface-heading, .rail-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.surface-heading .eyebrow, .rail-heading .eyebrow { display: flex; align-items: center; gap: 10px; color: #788476; }
.heading-line { width: 33px; height: 1px; background: #303b30; }
.surface-heading h2, .rail-heading h2 { margin: 7px 0 0; font-size: 20px; font-weight: 500; letter-spacing: -.025em; }
.beta-label { padding: 5px 7px; border: 1px solid #2c3827; border-radius: 4px; color: #a5c87c; font: 10px var(--mono); letter-spacing: .08em; }
.mode-tabs { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; margin: 20px 0 21px; padding: 5px; border: 1px solid #252c26; border-radius: 8px; background: #0c100d; }
.mode-tab { position: relative; display: flex; align-items: center; gap: 9px; min-width: 0; min-height: 54px; padding: 8px 10px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #a1a99f; cursor: pointer; text-align: left; transition: .18s ease; }
.mode-tab:hover { background: #141a14; color: #dfe6d8; }
.mode-tab.is-active { border-color: #44513b; background: #1a2117; color: #f0f5e8; box-shadow: inset 0 1px #ffffff05; }
.mode-tab > span:nth-child(2) { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; font-size: 13px; font-weight: 500; white-space: nowrap; }
.mode-tab small { color: #778174; font-size: 11px; font-weight: 400; }
.tab-symbol { display: grid; place-items: center; flex: 0 0 27px; width: 27px; height: 27px; border: 1px solid #4e6535; border-radius: 7px; background: #222d19; color: var(--lime); font-size: 16px; }
.tab-symbol-blue { border-color: #354a5d; background: #18222a; color: var(--blue); }
.tab-symbol-coral { border-color: #593c35; background: #271b19; color: var(--coral); font-size: 21px; }
.experimental-dot { position: absolute; top: 4px; right: 6px; color: #858a7f; font: 9px var(--mono); letter-spacing: .04em; }
.creation-form { display: grid; gap: 19px; }
.field-row { display: grid; gap: 15px; }
.field-row-two { grid-template-columns: minmax(0, 1.55fr) minmax(135px, .8fr); }
.field-block { display: grid; gap: 8px; min-width: 0; }
.field-label { display: flex; align-items: center; gap: 8px; color: #c5ccc0; font-size: 13px; }
.loop-option { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid #ffffff1c; border-radius: 10px; background: #09140e55; cursor: pointer; }
.loop-option[hidden] { display: none !important; }
.loop-option input { width: 16px; height: 16px; margin: 1px 0 0; accent-color: #cefa68; }
.loop-option span { display: grid; gap: 4px; }
.loop-option strong { color: #d5e3fa; font-size: 13px; font-weight: 600; }
.loop-option small { color: #8096bc; font-size: 11px; line-height: 1.5; }
.field-label b { padding: 2px 5px; border-radius: 3px; background: #cefa6812; color: #c5e690; font-size: 10px; font-weight: 500; }
.field-optional, .auth-field i { color: #798377; font-size: 12px; font-style: normal; font-weight: 400; }
.field-block select, .field-block textarea, .auth-field input { width: 100%; min-width: 0; border: 1px solid #2a332b; border-radius: 6px; background: #0c100d; color: #e3e9de; }
.field-block select { height: 39px; padding: 0 11px; }
.field-block select:disabled { opacity: .52; }
.field-block textarea { min-height: 94px; padding: 11px 12px; resize: vertical; line-height: 1.65; }
.field-block textarea::placeholder, .auth-field input::placeholder { color: #525c52; }
.field-hint { color: #707a70; font-size: 11px; line-height: 1.4; }
.tag-block { margin-top: 2px; }
.tag-list { display: flex; flex-wrap: wrap; gap: 7px; min-height: 31px; }
.tag-chip { min-height: 27px; padding: 5px 9px; border: 1px solid #2d382d; border-radius: 4px; background: #131914; color: #aab3a6; font-size: 12px; cursor: pointer; transition: .16s ease; }
.tag-chip:hover { border-color: #55674a; color: #e4ecd9; }
.tag-chip.is-selected { border-color: #718d4e; background: #232e1b; color: #ddf2bf; }
.muted-inline { color: #707970; font-size: 12px; }
.source-fields { display: grid; gap: 13px; }
.source-notice { display: flex; align-items: flex-start; gap: 9px; padding: 10px 11px; border: 1px solid #49342c; border-radius: 6px; background: #211712; color: #d7ad9e; font-size: 12px; line-height: 1.55; }
.notice-icon { color: #f19b79; }
.upload-zone { position: relative; display: grid; justify-items: center; gap: 8px; min-height: 128px; padding: 18px; border: 1px dashed #3c483a; border-radius: 7px; background: #0d120e; cursor: pointer; text-align: center; transition: border-color .18s ease, background .18s ease; }
.upload-zone:hover, .upload-zone.is-dragging { border-color: #9cbf66; background: #111910; }
.upload-zone input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.upload-icon { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid #424c40; border-radius: 7px; color: #d5e8b5; font-size: 20px; }
.upload-zone strong { max-width: 100%; overflow: hidden; color: #dfe6d9; font-size: 13px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.upload-zone > span:not(.upload-icon):not(.upload-progress) { color: #788177; font-size: 11px; }
.upload-progress { color: var(--lime); font-size: 12px; }
.source-preview { width: 100%; height: 35px; }
.source-preview::-webkit-media-controls-panel { background: #dbe8d1; }
.arrangement-field select { max-width: 260px; }
.prompt-block { margin-top: -2px; }
.prompt-footer { display: flex; justify-content: space-between; gap: 10px; color: #717b70; font-size: 11px; }
#prompt-count { flex-shrink: 0; font-family: var(--mono); }
.create-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 14px; border-top: 1px solid #242c25; }
.cost-preview { display: grid; grid-template-columns: 14px auto; align-items: center; column-gap: 7px; row-gap: 3px; color: #dce8cf; font-size: 13px; }
.cost-star { grid-row: span 2; color: var(--lime); }
.cost-detail { grid-column: 2; color: #737e71; font-size: 11px; }
.create-button { display: inline-flex; align-items: center; justify-content: center; gap: 22px; min-width: 144px; min-height: 42px; padding: 0 15px; border: 1px solid #c6ef70; border-radius: 5px; background: var(--lime); color: #12170e; font-size: 13px; font-weight: 700; cursor: pointer; transition: transform .15s ease, background .15s ease, box-shadow .15s ease; }
.create-button:hover { transform: translateY(-1px); background: #d8ff7b; box-shadow: 0 6px 22px #cefa6818; }
.create-button:disabled { transform: none; opacity: .58; cursor: wait; box-shadow: none; }
.form-message { min-height: 14px; margin: -10px 0 0; color: #9ca797; font-size: 12px; }
.form-message.is-error, .auth-message.is-error { color: #f2a38d; }
.form-message.is-success, .auth-message.is-success { color: #bee788; }

.right-rail { display: grid; gap: 13px; }
.task-surface { padding: 17px 16px 15px; }
.rail-heading h2 { font-size: 17px; }
.rail-heading .eyebrow { font-size: 11px; }
.text-action { border: 0; background: none; color: #aaca81; font-size: 12px; cursor: pointer; }
.text-action:hover { color: var(--lime); }
.mini-task-list { display: grid; gap: 8px; margin-top: 14px; }
.mini-task-filters { display:flex;flex-wrap:wrap;gap:6px;margin-top:12px; }
.mini-task-filter { display:inline-flex;align-items:center;gap:5px;min-height:27px;padding:5px 8px;border:1px solid #303b33;border-radius:999px;background:#ffffff05;color:#aeb9ae;font-size:11px;white-space:nowrap;cursor:pointer;transition:background .16s ease,border-color .16s ease,color .16s ease; }
.mini-task-filter span { color:#879486;font:10px var(--mono); }
.mini-task-filter:hover { border-color:#ffffff32;color:#edf2e9; }
.mini-task-filter.is-selected { border-color:#cefa6870;background:#cefa6812;color:#e5ffa0; }
.mini-task-filter.is-selected span { color:#d5f58e; }
.empty-state { display: grid; justify-items: center; gap: 6px; min-height: 133px; padding: 14px; border: 1px dashed #2b342c; border-radius: 6px; color: #899386; text-align: center; }
.empty-orbit { color: #a1c56d; font-size: 25px; }
.empty-state strong { color: #cad2c3; font-size: 12px; font-weight: 500; }
.empty-state span:last-child { max-width: 220px; color: #707a70; font-size: 11px; line-height: 1.55; }
.mini-task { display: block; min-width: 0; padding: 10px 9px; border: 1px solid #262e27; border-radius: 6px; background: #0c110d; }
.mini-task-summary { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 5px 10px; min-width: 0; cursor: pointer; list-style: none; }
.mini-task-summary::-webkit-details-marker { display: none; }
.mini-task-title { overflow: hidden; color: #d7ded1; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.task-status { color: #a8bd82; font-size: 11px; white-space: nowrap; }
.task-status.is-failed { color: #e99b85; }
.task-status.is-ready { color: #c9ef8a; }
.mini-task-meta { color: #758074; font-size: 11px; }
.mini-task-kind { display:inline-block;margin-right:6px;padding:2px 5px;border:1px solid #ffffff1c;border-radius:999px;color:#d6dce4;font-size:10px;line-height:1.35;vertical-align:1px; }
.mini-task-kind-music { border-color:#8bd8a444;background:#8bd8a40c;color:#b6e5c3; }
.mini-task-kind-sfx { border-color:#efbd7844;background:#efbd780c;color:#f0cc96; }
.mini-task-kind-npc_voice { border-color:#c2a3ff44;background:#c2a3ff0c;color:#d6c3ff; }
.mini-task-result-count { display: inline-flex; align-items: center; gap: 5px; color: #a9c67f; font-size: 11px; }
.mini-task-result-count::after { content: '⌄'; transition: transform .15s ease; }
.mini-task[open] .mini-task-result-count::after { transform: rotate(180deg); }
.mini-task-body { display: grid; gap: 7px; margin-top: 9px; padding-top: 8px; border-top: 1px solid #ffffff0b; }
.mini-task-pending { margin: 0; color: #84907f; font-size: 11px; line-height: 1.5; }
.mini-task-result-list { display: grid; gap: 6px; min-width: 0; }
.mini-task-result-list .result-card { min-width: 0; padding: 7px; }
.mini-task-result-list .result-card strong { margin-bottom: 5px; overflow-wrap: anywhere; font-size: 11px; }
.mini-task-result-list .result-card audio { display: block; width: 100%; max-width: 100%; min-width: 0; height: 28px; }
.mini-task-result-list .download-button { margin-top: 5px; padding: 5px 7px; }
.mini-task-open { border: 0; background: none; color: #a9c67f; font-size: 11px; cursor: pointer; }

.sample-card { position: relative; overflow: hidden; padding: 16px 16px 14px; background: linear-gradient(135deg, #141b14 0, #101511 54%, #151510 100%); }
.sample-card::after { position: absolute; top: 24px; right: -31px; width: 114px; height: 114px; border: 1px solid #9ec6641c; border-radius: 50%; content: ""; box-shadow: 0 0 0 17px #9ec66408, 0 0 0 34px #9ec66405; pointer-events: none; }
.sample-card-head { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; }
.sample-kicker { display: flex; align-items: center; gap: 6px; color: #9aab88; font: 10px var(--mono); letter-spacing: .09em; }
.sample-kicker i { width: 5px; height: 5px; border-radius: 50%; background: var(--lime); }
.icon-action { width: 25px; height: 25px; border: 1px solid #3c4937; border-radius: 50%; background: #182018; color: #d0e6b5; cursor: pointer; }
.sample-card h2 { position: relative; z-index: 1; margin: 12px 0 5px; font-size: 17px; font-weight: 500; }
.sample-card > p { position: relative; z-index: 1; margin: 0 0 13px; color: #838d80; font-size: 11px; }
.sample-list { position: relative; z-index: 1; display: grid; gap: 6px; }
.sample-row { display: grid; grid-template-columns: 27px minmax(0, 1fr) 24px; align-items: center; gap: 8px; min-width: 0; padding: 7px 8px; border: 1px solid #283127; border-radius: 5px; background: #0d120fbd; }
.sample-cover { display: grid; place-items: center; width: 27px; height: 27px; overflow: hidden; border-radius: 4px; background: #283022; color: var(--lime); font-size: 13px; }
.sample-cover img { width: 100%; height: 100%; object-fit: cover; }
.sample-details { display: grid; gap: 3px; min-width: 0; }
.sample-details strong { overflow: hidden; color: #d8dfd2; font-size: 11px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.sample-details span { color: #758071; font-size: 10px; }
.sample-play { display: grid; place-items: center; width: 23px; height: 23px; border: 1px solid #3a4735; border-radius: 50%; background: #182018; color: var(--lime); font-size: 11px; cursor: pointer; }
.sample-loading { padding: 13px 0; color: #7c877a; font-size: 11px; }
.beta-card { display: grid; grid-template-columns: 28px minmax(0, 1fr) 23px; align-items: center; gap: 9px; padding: 12px 13px; border: 1px solid #2c332b; border-radius: 7px; background: #141811; }
.beta-flower { color: #d5a38c; font-size: 19px; }
.beta-card > div:nth-child(2) { display: grid; gap: 4px; }
.beta-card strong { color: #d9e1d3; font-size: 12px; font-weight: 500; }
.beta-card span { color: #7e897a; font-size: 10px; }
.beta-card > button { width: 23px; height: 23px; border: 1px solid #424b3d; border-radius: 50%; background: #1a2118; color: #d1e9b4; cursor: pointer; }

.page-heading { margin: 6px 0 25px; }
.page-heading .eyebrow { margin-bottom: 12px; }
.page-heading h1 { font-size: clamp(30px, 3vw, 40px); }
.page-heading p { font-size: 14px; }
.task-page-surface, .membership-surface { padding: 22px; }
.quiet-button { padding: 8px 10px; border: 1px solid #333d33; border-radius: 5px; background: #151b15; color: #adb9a6; font-size: 12px; cursor: pointer; }
.full-task-list { display: grid; gap: 12px; margin-top: 19px; }
.task-card { padding: 15px; border: 1px solid #29322a; border-radius: 7px; background: #0d110e; }
.task-card-top { display: flex; justify-content: space-between; gap: 12px; }
.task-card h3 { margin: 0; color: #e1e8dc; font-size: 15px; font-weight: 500; }
.task-card-meta { margin-top: 6px; color: #7d887b; font-size: 11px; }
.task-card-error { margin-top: 9px; color: #e4a08a; font-size: 12px; }
.result-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); gap: 9px; margin-top: 13px; }
.result-card { padding: 11px; border: 1px solid #263027; border-radius: 6px; background: #121813; }
.result-card strong { display: block; margin-bottom: 8px; color: #dce5d6; font-size: 12px; font-weight: 500; }
.result-card audio { width: 100%; height: 33px; }
.result-card audio::-webkit-media-controls-panel { background: #dbe8d1; }
.download-button { margin-top: 8px; padding: 6px 8px; border: 1px solid #394736; border-radius: 4px; background: #172016; color: #cceaa5; font-size: 11px; cursor: pointer; }
.download-button:disabled { opacity: .55; cursor: wait; }

.works-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.work-card { overflow: hidden; border: 1px solid #273028; border-radius: 8px; background: #101511; }
.work-cover { position: relative; aspect-ratio: 1.5; overflow: hidden; background: #172016; }
.work-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.work-card:hover .work-cover img { transform: scale(1.035); }
.work-cover-placeholder { display: grid; place-items: center; width: 100%; height: 100%; background: radial-gradient(circle at 60% 40%, #52633b, #172018 50%, #101411); color: #d6efac; font: 37px var(--mono); }
.work-info { display: grid; gap: 7px; padding: 13px; }
.work-info strong { color: #e2e9dc; font-size: 14px; font-weight: 500; }
.work-info span { color: #778174; font-size: 11px; }
.work-info audio { width: 100%; height: 30px; margin-top: 3px; }

.credit-overview { display: flex; align-items: center; justify-content: space-between; min-height: 125px; margin-bottom: 14px; padding: 21px 23px; border-color: #344130; background: linear-gradient(110deg, #151d13, #101511 75%); }
.credit-overview > div { display: grid; gap: 7px; }
.credit-overview strong { color: #eff6e6; font: 32px var(--mono); }
.credit-overview > div > span { color: #899583; font-size: 12px; }
.large-credit-icon { color: var(--lime); font-size: 34px; text-shadow: 0 0 28px #cefa6833; }
.credits-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.pricing-surface, .referral-surface { min-height: 205px; padding: 19px; }
.guide-chip, .payment-disabled { padding: 5px 7px; border: 1px solid #303b30; border-radius: 4px; color: #929e8c; font-size: 10px; }
.pricing-list { display: grid; gap: 10px; margin-top: 17px; }
.pricing-row { display: flex; justify-content: space-between; gap: 10px; padding-bottom: 9px; border-bottom: 1px solid #252d26; color: #aab4a6; font-size: 12px; }
.pricing-row:last-child { border-bottom: 0; }
.pricing-row strong { color: #e1e8d8; font-size: 12px; font-weight: 500; }
.payment-note { margin-top: 8px; color: #778175; font-size: 11px; }
.referral-surface h2 { margin: 10px 0 6px; font-size: 17px; font-weight: 500; }
.referral-surface > p { max-width: 370px; margin: 0; color: #828d80; font-size: 11px; line-height: 1.6; }
.referral-code-box { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; padding: 8px 9px; border: 1px solid #2b352b; border-radius: 5px; background: #0c100d; color: #dde8cf; font: 13px var(--mono); }
.referral-code-box button { padding: 5px 8px; border: 1px solid #46533d; border-radius: 4px; background: #1b2417; color: #cde9a9; font: 11px var(--sans); cursor: pointer; }
.referral-meta { display: flex; gap: 16px; margin-top: 10px; color: #778276; font-size: 11px; }
.referral-meta strong { color: #cfd8c7; font-weight: 500; }
.beta-claim-link { margin-top: 12px; padding: 0; border: 0; background: none; color: #c7e58f; font-size: 11px; cursor: pointer; }
.membership-surface { margin-bottom: 4px; }
.membership-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 17px; }
.membership-plan { display: grid; gap: 8px; padding: 12px; border: 1px solid #293129; border-radius: 6px; background: #0d110e; }
.membership-plan.is-current { border-color: #617b45; background: #171e13; }
.membership-plan > span { color: #bde48c; font: 11px var(--mono); letter-spacing: .12em; }
.membership-plan strong { color: #dce4d6; font-size: 12px; font-weight: 500; }
.membership-plan small { color: #828d7e; font-size: 11px; line-height: 1.5; }
.membership-plan em { color: #cad7bd; font: normal 12px var(--mono); }
.membership-plan button { min-height: 28px; border: 1px solid #344030; border-radius: 4px; background: #192116; color: #b1c897; font-size: 10px; cursor: not-allowed; }
.lucky-surface { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 14px; padding: 18px 20px; }
.lucky-surface h2 { margin: 7px 0 5px; font-size: 16px; font-weight: 500; }
.lucky-surface p { max-width: 450px; margin: 0; color: #7d887a; font-size: 11px; line-height: 1.55; }
.lucky-result { display: flex; align-items: center; gap: 13px; }
.lucky-digits { display: flex; gap: 5px; }
.lucky-digits span { display: grid; place-items: center; width: 31px; height: 34px; border: 1px solid #414b3b; border-radius: 5px; background: #141b12; color: #d9edbd; font: 15px var(--mono); }
.lucky-digits span.is-hit { border-color: #b9df72; background: #25301b; color: var(--lime); }
.lucky-copy { display: grid; gap: 5px; }
.lucky-copy strong { color: #cbd8c2; font-size: 11px; font-weight: 500; }
.lucky-copy span { color: #737e71; font-size: 10px; }
.account-dialog h2 { margin: 21px 0 5px; font-size: 21px; font-weight: 500; }
.account-dialog > p { margin: 0; color: #8c9788; font-size: 12px; }
.account-dialog-plan { display: flex; justify-content: space-between; gap: 10px; margin: 18px 0 12px; padding: 11px; border: 1px solid #2f3a2d; border-radius: 6px; color: #8c9788; font-size: 12px; }
.account-dialog-plan strong { color: #d8e5c9; font-weight: 500; }
.account-logout { width: 100%; }

.footer-note { display: flex; justify-content: space-between; gap: 12px; padding: 0 clamp(22px, 3.5vw, 50px) 20px; color: #555f54; font: 10px var(--mono); letter-spacing: .055em; }

.modal-backdrop { position: fixed; inset: 0; z-index: 30; display: grid; place-items: center; overflow-y: auto; padding: 22px; background: #030503cf; backdrop-filter: blur(9px); }
.auth-dialog { position: relative; width: min(100%, 460px); max-height: min(92vh, 900px); overflow: auto; padding: 26px 28px 27px; border: 1px solid #364033; border-radius: 10px; background: #101511; box-shadow: 0 28px 100px #0009; }
.modal-close { position: absolute; top: 14px; right: 15px; width: 29px; height: 29px; border: 1px solid #303a30; border-radius: 50%; background: #151b15; color: #b4bdb0; font-size: 19px; cursor: pointer; }
.auth-brand { display: flex; align-items: center; gap: 10px; color: #9ca794; }
.auth-brand .brand-mark { width: 29px; height: 29px; border-radius: 8px; font-size: 22px; }
.auth-switch { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin: 21px 0 20px; padding: 4px; border: 1px solid #283129; border-radius: 6px; background: #0b0f0c; }
.auth-switch-button { min-height: 30px; border: 0; border-radius: 4px; background: transparent; color: #899385; font-size: 12px; cursor: pointer; }
.auth-switch-button.is-active { background: #20291c; color: #dce9cd; }
.auth-panel { display: none; }
.auth-panel.is-visible { display: block; animation: view-enter .22s ease both; }
.auth-panel h2, .beta-dialog h2 { margin: 0; color: #eff3ea; font-size: 24px; font-weight: 500; }
.auth-panel > p, .beta-dialog > p { margin: 7px 0 18px; color: #879183; font-size: 12px; line-height: 1.6; }
.auth-panel form, .beta-dialog form { display: grid; gap: 12px; }
.auth-field { display: grid; flex: 1; gap: 6px; min-width: 0; color: #b8c1b3; font-size: 11px; }
.auth-field input { height: 37px; padding: 0 10px; font-size: 13px; }
.auth-inline { display: flex; align-items: end; gap: 8px; }
.code-button { flex: 0 0 auto; min-height: 37px; padding: 0 10px; border: 1px solid #40503a; border-radius: 5px; background: #192116; color: #d4e7bf; font-size: 11px; cursor: pointer; }
.code-button:disabled { opacity: .55; cursor: wait; }
.auth-submit { width: 100%; margin-top: 4px; }
.auth-message { min-height: 12px; margin-top: -3px; color: #9ca797; font-size: 11px; line-height: 1.45; }
.beta-dialog { width: min(100%, 400px); }
.beta-dialog > .eyebrow { margin: 4px 0 12px; color: #a7c985; }
.toast { position: fixed; right: 24px; bottom: 24px; z-index: 40; max-width: min(420px, calc(100vw - 32px)); padding: 11px 14px; border: 1px solid #414e3d; border-radius: 6px; background: #182018; color: #e0ebd5; font-size: 13px; box-shadow: 0 14px 45px #0008; opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.toast.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1180px) {
  .studio-frame { grid-template-columns: 205px minmax(0, 1fr); }
  .sidebar { padding-inline: 13px; }
  .studio-grid { grid-template-columns: minmax(0, 1.35fr) minmax(248px, .85fr); gap: 12px; }
  .composer-surface { padding-inline: 18px; }
  .mode-tab { gap: 6px; padding-inline: 7px; }
  .tab-symbol { flex-basis: 23px; width: 23px; height: 23px; }
}
@media (max-width: 980px) {
  .studio-grid { grid-template-columns: 1fr; }
  .right-rail { grid-template-columns: 1fr 1fr; align-items: start; }
  .beta-card { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  .studio-frame { display: block; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: min(280px, 82vw); height: 100dvh; min-height: 0; transform: translateX(-102%); transition: transform .23s ease; box-shadow: 18px 0 44px #0005; }
  .sidebar.is-open { transform: translateX(0); }
  .mobile-menu { display: block; margin-right: 10px; padding: 6px; }
  .topbar { justify-content: flex-start; min-height: 60px; padding: 0 14px; }
  .topbar-actions { gap: 8px; margin-left: auto; }
  .engine-state { display: none; }
  .credit-pill { gap: 5px; min-height: 31px; padding-inline: 8px; font-size: 11px; }
  .account-button { gap: 5px; font-size: 11px; }
  .avatar { width: 26px; height: 26px; }
  .breadcrumb { gap: 7px; font-size: 12px; }
  .content-area { padding: 27px 14px 28px; }
  .welcome-row { align-items: flex-start; margin-bottom: 18px; }
  .welcome-row h1 { max-width: 400px; font-size: clamp(26px, 7vw, 33px); }
  .welcome-subtitle { max-width: 270px; font-size: 13px; }
  .date-chip { display: none; }
  .overview-grid { gap: 7px; margin-bottom: 13px; }
  .metric-card { min-height: 89px; padding: 11px 10px; }
  .metric-top { font-size: 11px; }
  .metric-value { font-size: 21px; }
  .metric-text { font-size: 16px; }
  .metric-foot { font-size: 10px; line-height: 1.4; }
  .composer-surface { padding: 17px 13px 14px; }
  .surface-heading h2 { font-size: 18px; }
  .beta-label { font-size: 9px; }
  .mode-tabs { gap: 3px; margin: 15px 0 17px; padding: 3px; }
  .mode-tab { min-height: 52px; gap: 5px; padding: 6px 5px; }
  .mode-tab > span:nth-child(2) { font-size: 11px; }
  .mode-tab small { font-size: 10px; }
  .tab-symbol { flex-basis: 20px; width: 20px; height: 20px; border-radius: 5px; font-size: 13px; }
  .experimental-dot { top: 2px; right: 3px; font-size: 8px; }
  .field-row-two { grid-template-columns: minmax(0, 1fr) 115px; gap: 8px; }
  .field-block select { height: 37px; padding-inline: 8px; font-size: 12px; }
  .field-hint { font-size: 10px; }
  .field-label { font-size: 12px; }
  .tag-list { gap: 5px; }
  .tag-chip { padding: 5px 7px; font-size: 11px; }
  .field-block textarea { min-height: 86px; font-size: 13px; }
  .prompt-footer { font-size: 10px; }
  .create-footer { align-items: flex-end; }
  .cost-preview { font-size: 12px; }
  .cost-detail { font-size: 10px; }
  .create-button { min-width: 119px; min-height: 39px; gap: 12px; padding-inline: 10px; font-size: 12px; }
  .right-rail { grid-template-columns: 1fr; }
  .beta-card { grid-column: auto; }
  .footer-note { padding-inline: 14px; font-size: 9px; }
  .works-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .work-info { padding: 10px; }
  .credits-grid { grid-template-columns: 1fr; }
  .lucky-surface { align-items: flex-start; flex-direction: column; padding: 15px; }
  .lucky-result { width: 100%; justify-content: space-between; }
  .membership-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .task-page-surface, .membership-surface { padding: 15px 12px; }
  .page-heading { margin-top: 3px; }
  .page-heading h1 { font-size: 30px; }
  .auth-dialog { padding: 23px 18px 21px; }
}
@media (max-width: 390px) {
  .topbar { padding-inline: 9px; }
  .topbar-actions { gap: 5px; }
  .credit-pill { padding-inline: 6px; }
  .breadcrumb > span { display: none; }
  .field-row-two { grid-template-columns: 1fr; }
  .duration-field { max-width: 170px; }
  .mode-tab > span:nth-child(2) { white-space: normal; }
  .works-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Hengchui brand palette with Vision UI layout and dark glass material. */
:root { --bg:#070b09; --panel:#14201a; --line:#ffffff15; --lime:#cefa68; --lime-soft:#d7fa9e; --sans:"Segoe UI Variable Text","Segoe UI","DengXian","PingFang SC",sans-serif; }
html,body { background:#070a08; }
body::before { content:none; }
.studio-frame { position:relative; z-index:1; grid-template-columns:260px minmax(0,1fr); }
.cosmic-backdrop { position:fixed; inset:0; pointer-events:none; overflow:hidden; background:radial-gradient(ellipse at 74% 88%,#162c1c 0,transparent 57%),radial-gradient(ellipse at 30% 65%,#0f2018 0,transparent 48%),#020605; }
.cosmic-backdrop::before { content:"";position:absolute;width:130vw;height:21vh;top:40%;left:-15%;transform:rotate(28deg);background:radial-gradient(ellipse,#d5e3dd0d 0,#92ac9b08 32%,transparent 70%);filter:blur(30px); }
.cosmic-nebula { position:absolute;width:70vw;height:65vh;filter:blur(65px);border-radius:50%;opacity:.5; }
.cosmic-nebula-cyan { right:-25%;bottom:-10%;background:radial-gradient(ellipse,#91b95024,transparent 65%); }
.cosmic-nebula-violet { left:0;top:35%;background:radial-gradient(ellipse,#627c3820,transparent 60%); }
.cosmic-star { position:absolute;width:var(--star-size);height:var(--star-size);border-radius:50%;background:var(--star-color);opacity:var(--star-low);animation:vision-star var(--star-duration) ease-in-out var(--star-delay) infinite; }
.cosmic-star.is-steady { animation:none;opacity:var(--star-low); }
.cosmic-star.is-bright { box-shadow:0 0 5px var(--star-color),0 0 14px var(--star-color),0 0 28px #e1efff36; animation-name:bright-star-flash; }
.cosmic-star.is-bright::before,.cosmic-star.is-bright::after { content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:linear-gradient(transparent,var(--star-color),transparent);opacity:.65; }
.cosmic-star.is-bright::before { width:1px;height:16px; }
.cosmic-star.is-bright::after { width:16px;height:1px;background:linear-gradient(90deg,transparent,var(--star-color),transparent); }
@keyframes vision-star { 0%,100%{opacity:var(--star-low)} 20%{opacity:.25} 44%{opacity:var(--star-peak)} 64%{opacity:.22} 82%{opacity:var(--star-low)} }
@keyframes bright-star-flash { 0%,100%{opacity:.08;transform:scale(.65)} 28%{opacity:.35;transform:scale(.9)} 45%{opacity:1;transform:scale(1.5)} 57%{opacity:.45;transform:scale(1)} 69%{opacity:.8;transform:scale(1.2)} 86%{opacity:.08;transform:scale(.65)} }
.hero-starfield,.sidebar-starfield { display:none; }
.sidebar { padding:28px 23px 20px; background:linear-gradient(127deg,#08120feb 19%,#111d157d 77%);border:0;backdrop-filter:blur(30px); }
.brand { padding-bottom:23px;margin:0 0 18px;border-bottom:1px solid #ffffff19; }
.brand-mark { width:27px;height:27px;border-radius:8px;background:#fff;color:#192822;font-weight:900; }
.brand-copy strong { font-size:18px;letter-spacing:.12em;font-weight:600; }
.brand-copy small { font-size:9px;letter-spacing:.18em;color:#8c9abb; }
.sidebar-account-card { display:flex;align-items:center;gap:12px;padding:10px 12px;margin-bottom:18px; }
.sidebar-avatar { display:grid;place-items:center;position:relative;flex-shrink:0;width:33px;height:33px;border-radius:11px;background:#192822;color:#cefa68;font-weight:700; }
.sidebar-avatar i { position:absolute;bottom:-2px;right:-2px;width:6px;height:6px;border-radius:50%;background:#00c89a; }
.sidebar-account-copy { display:grid;gap:5px;min-width:0; }
.sidebar-account-copy strong { font-size:14px; }
.sidebar-account-copy small { font-size:11px;color:#8d9fbe; }
.sidebar-account-mark,.nexus-pulse,.nav-key,.shortcut-arrow { display:none; }
.nav-caption { font-size:12px;color:#fff;letter-spacing:.06em;margin:6px 12px 13px; }
.main-nav { gap:7px; }
.nav-item { min-height:52px;border:0;border-radius:15px;padding:9px 13px;background:transparent;color:#fff;gap:12px; }
.nav-item:hover { background:#ffffff06; }
.nav-item.is-active { background:#223127;box-shadow:none; }
.nav-icon { display:grid;place-items:center;flex:0 0 31px;width:31px;height:31px;border-radius:11px;background:#192822;color:#cefa68;border:0;font-size:20px; }
.nav-item.is-active .nav-icon { background:#cefa68;color:#fff;box-shadow:0 4px 13px #cefa6830; }
.nav-copy { display:grid;gap:4px;font-size:14px; }
.nav-copy small { color:#8b97b1;font-size:10px; }
.nav-count { background:#243426;color:#89b5ee; }
.sidebar-bottom { gap:12px; }
.plan-mini { border:0;border-radius:20px;padding:19px;background:radial-gradient(ellipse at 100% 0,#729a4555,transparent 55%),linear-gradient(135deg,#799f3940,#14241a 70%); }
.plan-mini strong { color:#fff; }.plan-mini .eyebrow{color:#9eb7d4}.plan-mini button{margin-top:9px;background:#0a150e;border-radius:10px;padding:10px;color:#fff;}
.main-shell { background:transparent; }
.topbar { min-height:91px;padding:0 30px;border:0;background:#0a100c30;backdrop-filter:blur(12px); }
.breadcrumb { color:#909fb7; }.breadcrumb strong{color:#fff;}.credit-pill{background:#19282280;border-color:#ffffff1b;border-radius:15px;color:#dceaff}.avatar{background:#cefa68;border:0;color:#fff;}
.content-area { max-width:1800px;padding:18px 30px 35px; }
.command-hero { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;background:none;border:0;box-shadow:none;padding:0; }
.hero-main,.telemetry-panel { display:contents; }
.brand-mark { background:#192822; }
.brand-mark img,.hero-emblem-core img { display:block;width:100%;height:100%;border-radius:inherit; }
.hero-metric-icon,.nav-item.is-active .nav-icon,.avatar,.create-button { color:#192822; }
.hero-emblem-core { background:#192822; }
.hero-copy { order:0; }
.hero-emblem { order:1; }
.hero-status-row { order:2; }
.telemetry-heading { display:none; }
.hero-metric { order:-2;display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;padding:20px 19px;border:0;border-radius:20px;background:linear-gradient(127deg,#08120fed 19%,#111d157d 77%);backdrop-filter:blur(40px); }
.hero-metric:nth-of-type(5) { display:none; }
.hero-metric-icon { order:2;display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border-radius:14px;background:#cefa68;color:#fff;font-size:24px;box-shadow:0 6px 18px #cefa681a; }
.hero-metric-copy { display:grid;gap:7px;min-width:0; }
.hero-metric-copy small { color:#a0aec0;font-size:13px; }
.hero-metric-copy strong { color:#fff;font-size:25px;font-weight:700;line-height:1; }
.hero-metric-copy em { color:#7e90af;font-size:10px;font-style:normal; }
.hero-metric-copy .hero-mode-value { font-size:19px; }
.hero-copy { position:relative;isolation:isolate;overflow:hidden;grid-column:span 2;min-height:315px;padding:32px 27px;border-radius:22px;background:radial-gradient(ellipse at 95% 10%,#587b2b80,transparent 62%),linear-gradient(130deg,#102017,#1b2d1d); }
.hero-copy::before { content:"";position:absolute;z-index:-1;right:-20%;top:13%;width:85%;height:85%;border-radius:50%;background:repeating-radial-gradient(ellipse at 50% 40%,transparent 0 17px,#cefa6821 18px 19px,transparent 21px 29px);transform:rotate(-28deg);box-shadow:inset 0 0 50px #91c04424; }
.hero-copy::after { content:"";position:absolute;z-index:-1;right:0;top:0;width:60%;height:100%;background:radial-gradient(ellipse at 65% 50%,#a8d64621,transparent 70%); }
.hero-kicker { display:flex;align-items:center;gap:6px;color:#9dbbe2;font-size:10px;letter-spacing:.15em; }
.signal-dot { width:5px;height:5px;border-radius:50%;background:#cefa68;box-shadow:0 0 8px #cefa68; }
.hero-title { margin:20px 0 12px;color:#fff;font-size:34px;font-weight:700;letter-spacing:-.035em; }
.hero-title span { display:none; }
.hero-tagline { color:#d3e2f7;margin:0;font-size:17px;font-weight:400; }
.hero-description { display:block;max-width:270px;margin:10px 0 0;font-size:14px;line-height:1.8;color:#aabedb; }
.hero-signal,.hero-account-row { display:none; }
.hero-actions { position:absolute;bottom:26px;left:27px;display:flex;gap:20px; }
.hero-primary,.hero-secondary { display:inline-flex;align-items:center;gap:13px;border:0;background:transparent;padding:0;color:#fff;font-size:13px;text-decoration:none;cursor:pointer; }
.hero-secondary { color:#a5bae0; }
.hero-emblem { grid-column:span 1;position:relative;display:grid;place-items:center;min-height:315px;border-radius:22px;background:linear-gradient(127deg,#08120fed,#111d157d);backdrop-filter:blur(40px); }
.hero-creator-badge { position:absolute;top:25px;left:24px;color:#fff;font-size:17px;font-weight:700; }
.hero-orbit { position:absolute;left:50%;top:52%;border-radius:50%;transform:translate(-50%,-50%); }
.hero-orbit-outer { width:176px;height:176px;border:14px solid #2d3c2c; }
.hero-orbit-inner { width:176px;height:176px;border:14px solid transparent;border-left-color:#cefa68;border-top-color:#b7eb63;transform:translate(-50%,-50%) rotate(35deg);filter:drop-shadow(0 0 9px #cefa681c); }
.hero-emblem-core { display:grid;place-items:center;position:relative;margin-top:13px;width:54px;height:54px;border:0;border-radius:19px;background:linear-gradient(150deg,#cefa68,#a3d74b);color:#fff;font-size:31px;font-weight:700; }
.hero-orbit-dot { display:none; }
.hero-emblem-caption { position:absolute;bottom:23px;left:20px;right:20px;padding:13px;border-radius:17px;background:#0a140e;color:#a0b5d4;text-align:center;font-size:12px;line-height:1.6; }
.hero-status-row { grid-column:span 1;display:flex;flex-direction:column;justify-content:center;gap:13px;margin:0;padding:24px;border:0;border-radius:22px;background:linear-gradient(127deg,#08120fed,#111d157d);backdrop-filter:blur(40px); }
.hero-status-item { padding:15px;border-radius:16px;background:#0a140ecc;display:grid;gap:8px; }
.hero-status-item > span { font-size:10px;letter-spacing:.12em;color:#8096bc; }
.hero-status-item strong { font-size:14px;color:#e5eeff;line-height:1.7; }
.section-intro { display:flex;align-items:center;justify-content:space-between;margin:26px 0 18px; }
.section-intro .eyebrow { color:#a1b7d7;font-size:10px;letter-spacing:.15em; }
.section-intro h2 { margin:6px 0;font-size:22px;letter-spacing:-.02em; }
.section-intro p { margin:0;color:#98aac7;font-size:13px; }
.module-index { color:#7e96c8;font-size:10px;letter-spacing:.12em; }.module-index i{font-style:normal;color:#cefa68;}
.studio-grid { grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:20px; }
.surface { background:linear-gradient(127deg,#08120fed 19%,#111d157d 77%);border:0;border-radius:22px;box-shadow:0 12px 30px #040a0612;backdrop-filter:blur(40px); }
.composer-surface { padding:26px; }.surface-heading h2,.rail-heading h2{color:#fff;font-weight:700}.eyebrow{color:#8ba5cb}.beta-label{border-color:#4a5c9d;color:#7fbbff;border-radius:8px;}
.mode-tabs { padding:5px;background:#09140e70;border:0;border-radius:14px;gap:6px; }
.mode-tab { border:0;background:transparent;border-radius:12px;min-height:61px; }
.mode-tab.is-active { background:#293d25;box-shadow:inset 0 0 0 1px #cefa6866; }
.tab-symbol,.tab-symbol-blue,.tab-symbol-coral { background:#192822;border:0;color:#cefa68;border-radius:9px; }.mode-tab.is-active .tab-symbol{background:#cefa68;color:#fff;}.mode-tab small{color:#809abc;}
.field-label { color:#d5e3fa; }.field-block select,.field-block textarea,.auth-field input { background:#09140e80;border-color:#ffffff21;border-radius:12px;color:#edf3ff; }.field-hint,.prompt-footer{color:#8096bc}.field-block textarea::placeholder{color:#7189b0}.tag-chip{border-color:#41527a;color:#a8bbd9;background:#17213b50}.tag-chip.is-selected{border-color:#cefa68;color:#cdeaff;background:#cefa6830}
.create-button { border:0;border-radius:12px;background:#cefa68;color:#fff;box-shadow:0 5px 15px #cefa681f; }.cost-preview{color:#dae8ff}.cost-detail{color:#90a5c7}.task-empty{border-color:#ffffff13}.sample-item{background:#09140e99;border-color:#ffffff0b}.sample-play{background:#cefa6822;border-color:#cefa6844;color:#cefa68}.beta-card{background:linear-gradient(130deg,#243c25,#172c1c);border-color:#ffffff0b}.work-card,.auth-dialog{background:#15231a;border-color:#ffffff18}
.footer-note { color:#94a8cf; }.universe-link{color:#b9cbe6}.universe-dot{background:#cefa68}.version-note{color:#536f9f;}
@media(max-width:1180px) { .studio-frame{grid-template-columns:220px minmax(0,1fr)}.sidebar{padding:22px 14px}.content-area{padding:12px 22px 30px}.command-hero{gap:14px}.hero-copy{grid-column:span 2}.hero-emblem,.hero-status-row{grid-column:span 2;min-height:250px}.hero-metric{padding:15px 12px}.hero-metric-icon{width:34px;height:34px;flex-basis:34px;font-size:20px}.hero-metric-copy strong{font-size:22px}.hero-orbit{top:48%}.hero-creator-badge{top:20px}.hero-emblem-caption{bottom:14px}.hero-status-row{padding:18px}.hero-status-item{padding:12px}.studio-grid{grid-template-columns:1fr}.right-rail{grid-template-columns:1fr 1fr} }
@media(max-width:700px) { .studio-frame{display:block}.sidebar{background:#08120ff2}.topbar{min-height:66px;padding-inline:15px}.content-area{padding:12px 14px 25px}.command-hero{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hero-metric{padding:15px;min-height:92px}.hero-metric-copy small{font-size:11px}.hero-metric-copy .hero-mode-value{font-size:16px}.hero-metric-copy em{display:none}.hero-copy{min-height:290px;padding:24px}.hero-actions{left:24px;bottom:23px;gap:17px}.hero-emblem{grid-column:span 1;min-height:240px}.hero-status-row{grid-column:span 1;padding:13px;gap:9px;min-height:240px}.hero-status-item{padding:10px}.hero-status-item strong{font-size:11px}.hero-status-item>span{font-size:8px}.hero-orbit-outer,.hero-orbit-inner{width:128px;height:128px;border-width:10px}.hero-creator-badge{top:18px;left:16px;font-size:14px}.hero-emblem-caption{left:12px;right:12px;font-size:10px;padding:9px}.hero-title{font-size:32px}.hero-description{max-width:250px}.section-intro h2{font-size:21px}.module-index{display:none}.composer-surface{padding:18px 14px}.right-rail{grid-template-columns:1fr} }
@media(prefers-reduced-motion:reduce) { .cosmic-star{animation:none;opacity:var(--star-low)} }

.hero-title { font-weight:600; letter-spacing:-.025em; }
.nav-copy { font-weight:500; font-size:15px; }
.hero-metric-copy strong { font-weight:600; font-variant-numeric:tabular-nums; }
.hero-kicker,.eyebrow,.beta-label,.section-intro .eyebrow { font-weight:500; letter-spacing:.1em; }
.section-intro h2,.surface-heading h2,.rail-heading h2 { font-weight:600; }

.brand-mark,.hero-emblem-core { background:#192822; }
.hero-metric-icon,.nav-item.is-active .nav-icon,.avatar,.create-button { color:#192822; }

/* Creator workspace: quota and three creation modules. */
.hero-copy { font-family:"Bahnschrift","DengXian","PingFang SC",sans-serif; min-height:335px; }
.hero-title { font-family:"Bahnschrift","Segoe UI",sans-serif;font-size:42px;font-weight:600;letter-spacing:-.035em; }
.hero-tagline { font-size:20px;letter-spacing:.025em;font-weight:500; }
.hero-description { max-width:330px;font-size:15px;line-height:1.9;color:#bbccc0; }
.hero-actions { gap:12px;bottom:24px; }
.hero-primary,.hero-secondary { padding:11px 15px;border:1px solid #e8ffe13b;border-top-color:#f2ffe575;border-radius:12px;background:linear-gradient(135deg,#eeffdf19,#ffffff04 55%,#cefa680b);backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 #ffffff18,0 6px 20px #0000001a;color:#edf5e7;font-size:14px;font-weight:500;transition:background .2s,border-color .2s,transform .2s; }
.hero-primary:hover,.hero-secondary:hover { background:#cefa6820;border-color:#cefa6870;transform:translateY(-2px); }
.hero-emblem { min-height:335px; }
.hero-creator-badge { font-family:"DengXian","Segoe UI",sans-serif;font-size:17px;letter-spacing:.04em; }
.quota-ring { position:absolute;left:50%;top:49%;transform:translate(-50%,-50%) rotate(-90deg);width:min(80%,220px);height:auto;overflow:visible; }
.quota-track,.quota-progress { fill:none;stroke-width:12; }
.quota-track { stroke:#354535; }
.quota-progress { stroke:#cefa68;stroke-dasharray:0 100;stroke-linecap:butt;filter:drop-shadow(0 0 5px #cefa6825);transition:stroke-dasharray .7s ease; }
.quota-center { display:grid;gap:7px;text-align:center;margin-top:-5px; }
.quota-center strong { font-family:"Bahnschrift","Segoe UI",sans-serif;font-size:clamp(27px,2.7vw,42px);font-weight:600;color:#f2f8ec; }
.quota-center span { font-size:13px;color:#94a991; }
.hero-emblem-caption { bottom:17px;padding:12px;display:grid;gap:6px; }
.hero-emblem-caption strong { font-size:13px;font-weight:500; }
.hero-emblem-caption small { font-size:11px;color:#7f927e; }
.module-launcher { padding:22px 18px;gap:12px; }
.module-launcher>.eyebrow { font-size:11px;letter-spacing:.12em; }
.module-entry { width:100%;display:flex;align-items:center;gap:12px;padding:15px 12px;border-radius:14px;text-align:left;border:1px solid #ffffff12;background:linear-gradient(140deg,#b8ef9410,#06110b80);color:#edf4e8;cursor:pointer;transition:border-color .2s,background .2s; }
.module-entry:hover { border-color:#cefa6866;background:#cefa6813; }
.module-symbol { display:grid;place-items:center;flex:0 0 32px;height:32px;border:1px solid #cefa682e;border-radius:10px;color:#cefa68;font-size:22px;background:#cefa6809; }
.module-entry>span:nth-child(2) { display:grid;gap:6px;flex:1; }
.module-entry strong { font-size:15px;font-weight:600; }
.module-entry small { font-size:12px;color:#93a791;line-height:1.5; }
.module-entry i { font-style:normal;color:#b0c99d; }
.mode-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
.module-feedback { margin:0 0 16px;padding:13px 18px;border:1px solid #ffffff19;border-radius:12px;color:#aabd9f;font-size:14px;background:#14201899; }
.module-frame { display:block;width:100%;height:calc(100vh - 240px);min-height:650px;border:1px solid #ffffff1b;border-radius:22px;background:#0c1510; }
.module-frame[hidden] { display:none; }
@media(max-width:1100px) { .hero-copy{grid-column:span 2}.hero-emblem,.module-launcher{grid-column:span 1}.hero-actions{gap:8px}.hero-primary,.hero-secondary{padding:10px;font-size:13px}.hero-title{font-size:36px} }
@media(max-width:760px) { .hero-copy,.hero-emblem,.module-launcher{grid-column:1/-1}.hero-copy{min-height:320px}.hero-emblem{min-height:330px}.hero-description{max-width:290px}.module-frame{min-height:700px}.module-launcher{gap:10px} }

/* Quota stays in normal flow so its caption cannot cover the ring. */
.hero-emblem { display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:12px;padding:24px 16px 18px; }
.hero-creator-badge { position:static;align-self:flex-start;margin-left:8px; }
.quota-visual { position:relative;flex:0 0 auto;width:min(100%,190px);aspect-ratio:1;margin:4px auto 0; }
.quota-ring { inset:0;left:0;top:0;width:100%;height:100%;transform:rotate(-90deg);overflow:visible; }
.quota-center { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;margin:0; }
.quota-brand { width:28px;height:28px;border-radius:8px;opacity:.9; }
.quota-center strong { font-size:32px;max-width:85%;word-break:break-all; }
.hero-emblem.is-guest .quota-center strong { font-size:19px;font-weight:500;letter-spacing:.05em; }
.hero-emblem.is-guest .quota-track { stroke:#354634;stroke-dasharray:3 2;stroke-width:9;opacity:.8; }
.hero-emblem-caption { position:static;width:100%;background:transparent;padding:0;gap:5px;margin-top:auto; }
.quota-login { margin:6px auto 0;padding:8px 16px;border-radius:10px;border:1px solid #cefa6840;background:linear-gradient(135deg,#cefa6815,#ffffff04);color:#cefa68;cursor:pointer;font-size:13px; }
.quota-login[hidden] { display:none; }
.agent-status { display:flex;align-items:center;gap:8px;font-size:14px;color:#d5e5c8;padding-bottom:14px;border-bottom:1px solid #ffffff10; }
.agent-status>span:last-child { margin-left:auto;color:#859b83;font-size:12px; }
.agent-thread { display:flex;flex-direction:column;gap:20px;max-height:350px;overflow-y:auto;padding:8px 5px 8px 0;scrollbar-width:thin;scrollbar-color:#405533 transparent; }
.agent-message { display:flex;align-items:flex-start;gap:12px;max-width:94%; }
.agent-avatar { flex:0 0 30px;height:30px;display:grid;place-items:center;background:#192822;border:1px solid #cefa6820;border-radius:10px;font-size:13px;color:#cefa68; }
.agent-avatar img { width:26px;height:26px;border-radius:8px; }
.agent-message>div { flex:1;min-width:0; }
.agent-message strong { display:block;font-size:13px;color:#a9c18f;font-weight:500;margin:2px 0 8px; }
.agent-message p { margin:0;color:#d3ded1;font-size:16px;line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere; }
.agent-message-copy ul { margin:0 0 10px;padding-left:1.35em;color:#d3ded1; }
.agent-message-copy li { padding-left:3px;line-height:1.9;overflow-wrap:anywhere; }
.agent-message-copy strong { display:inline;margin:0;color:#e4f5c4;font-size:inherit;font-weight:700; }
.agent-message-copy code { padding:1px 5px;border-radius:5px;background:#d6f6b40d;color:#dcedb9;font:inherit; }
.agent-message.is-user { align-self:flex-end;flex-direction:row-reverse;background:#cefa680d;border:1px solid #cefa681b;padding:12px 14px;border-radius:15px; }
.agent-message.is-user strong { text-align:right; }.agent-message.is-user p{font-size:15px;}
.agent-starters { display:flex;flex-wrap:wrap;gap:8px; }.agent-starters[hidden]{display:none;}
.agent-starters button { padding:9px 12px;background:#ffffff04;border:1px solid #b7d7912d;border-radius:10px;color:#a7bb9f;font-size:13px;cursor:pointer; }
.agent-starters button:hover { background:#cefa6812;color:#cefa68; }
.agent-input-box { border:1px solid #cefa6838;border-top-color:#cefa6860;border-radius:18px;background:linear-gradient(150deg,#21341f70,#0b140dcc);padding:15px;box-shadow:inset 0 1px 0 #ffffff07; }
.agent-input-box textarea { width:100%;min-height:64px;border:0;background:transparent;resize:vertical;color:#edf2e8;font:16px/1.7 var(--sans);padding:0;outline:none;box-shadow:none; }
.agent-input-box:focus-within { border-color:#cefa6890; }
.agent-input-box textarea::placeholder { color:#7c9078; }
.agent-input-footer { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px; }
.agent-input-footer>span { color:#778a75;font-size:12px; }
.agent-input-footer .agent-input-counter { margin-left:auto;white-space:nowrap;color:#70816d;font-size:11px;font-variant-numeric:tabular-nums; }
.chat-workspace .agent-input-note { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.chat-workspace .agent-input-counter { flex:0 0 auto; }
#agent-send { width:35px;height:35px;border:1px solid #e5ffac55;border-radius:11px;background:#cefa68;color:#192822;font-size:25px;cursor:pointer; }
.agent-draft-heading { display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:14px;color:#c5d4bc; }
.agent-draft-heading small { color:#8fa477;font-size:12px; }
.agent-draft-copy { margin:0;padding:14px 16px;border:1px dashed #b7d79127;border-radius:12px;color:#97ac8f;font-size:14px;line-height:1.8;white-space:pre-wrap; }
.agent-settings { border:1px solid #ffffff12;border-radius:14px;padding:14px;background:#07120b40; }
.agent-settings summary { display:flex;justify-content:space-between;gap:12px;color:#abbfa1;font-size:14px;cursor:pointer;list-style:none; }
.agent-settings summary::-webkit-details-marker { display:none; }.agent-settings summary span{font-size:12px;color:#8ba172;}
.agent-settings[open] summary { margin-bottom:17px; }
.agent-settings .mode-tabs { margin-bottom:18px; }
.agent-settings .prompt-block { margin-top:17px; }
.agent-settings .prompt-block textarea { min-height:85px; }
.agent-form .create-footer { margin-top:0; }
@media(max-width:760px){.hero-emblem{min-height:335px}.agent-message{max-width:100%}.agent-message p{font-size:15px}.agent-starters button{font-size:12px}.agent-draft-heading{align-items:flex-start}.agent-input-footer>span{font-size:11px}}
@media(max-width:480px){.agent-input-footer .agent-input-counter{font-size:10px}}
#creation-form { scroll-margin-top:190px; }

/* Welcome card shares the original Hengchui vinyl identity. */
.hero-copy { background:linear-gradient(130deg,#102017,#1b2d1d); }
.hero-copy::before,.hero-copy::after { content:none; }
.hero-record { position:absolute;z-index:-1;width:58%;aspect-ratio:1;right:-5%;top:50%;transform:translateY(-50%) rotate(-17deg);border-radius:50%;background:repeating-radial-gradient(circle,#192822 0 3px,#33412b 4px,#192822 5px 7px);box-shadow:0 20px 40px #00000035,inset 0 0 0 8px #192822;display:grid;place-items:center; }
.hero-record::before { content:"";position:absolute;inset:-16px;border:1px solid #cefa681c;border-radius:50%; }
.hero-record-label { width:45%;aspect-ratio:1;border-radius:50%;background:#cefa68;color:#192822;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;box-shadow:0 0 25px #cefa680b; }
.hero-record-label img { width:32%;height:auto;border-radius:25%; }
.hero-record-label strong { font-family:"Bahnschrift","Segoe UI",sans-serif;font-size:clamp(14px,1.4vw,25px);font-weight:650;letter-spacing:-.025em; }
.hero-record-label small { font-size:clamp(5px,.3vw,8px);letter-spacing:.1em; }
.hero-copy .hero-description { max-width:52%; }
.hero-copy .hero-kicker { position:relative; }
@media(max-width:760px) { .hero-record{width:56%;right:-12%;top:47%}.hero-copy .hero-description{max-width:64%}.hero-record-label strong{font-size:16px}.hero-record-label small{font-size:6px} }

/* LLM conversation is a bounded chat window with a separate composer. */
.agent-thread { height:300px;min-height:240px;max-height:400px;padding:20px 16px;border:1px solid #ffffff14;border-radius:17px;background:linear-gradient(145deg,#0a140dc2,#1120177a); }
.agent-message:not(.is-user)>div { background:#d6f6b408;border:1px solid #c2daaa13;border-radius:0 14px 14px;padding:12px 14px; }
.agent-message:not(.is-user) strong { margin-top:0; }
.agent-status #agent-connection { margin-left:auto;font-size:12px;color:#92a882; }
#agent-new-chat { color:#bdd5a5;background:#ffffff05;border:1px solid #bdd69e25;border-radius:9px;font-size:12px;padding:7px 10px;cursor:pointer; }
#agent-send:disabled,#agent-new-chat:disabled { opacity:.5;cursor:wait; }
.agent-retry-row { display:flex;align-items:center;justify-content:space-between;font-size:13px;color:#b9c5ae; }
.agent-retry-row[hidden] { display:none; }
#agent-retry { padding:7px 12px;border:1px solid #cefa6839;border-radius:8px;color:#cefa68;background:#cefa680a;cursor:pointer; }
@media(max-width:760px) { .agent-status{flex-wrap:wrap}.agent-status #agent-connection{font-size:11px}.agent-thread{height:310px;padding:14px 10px}.agent-message:not(.is-user)>div{padding:10px}.agent-message{gap:8px} }

/* Named conversation plans with local archives. */
.plan-archive { border:1px solid #d3edb124;border-radius:16px;padding:16px;background:linear-gradient(140deg,#ccfa6810,#09160d70); }
.plan-archive-heading { display:flex;align-items:center;justify-content:space-between;gap:12px;color:#d3e4c4;font-size:14px; }
.plan-archive-heading small { font-size:12px;color:#91a77f; }
.plan-tabs { display:flex;gap:8px;overflow-x:auto;padding:13px 0;scrollbar-width:thin;scrollbar-color:#425833 transparent; }
.plan-tabs button { flex:0 0 auto;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#0c191099;border:1px solid #b5cb9525;border-radius:10px;padding:9px 14px;color:#91a783;font:14px var(--sans);cursor:pointer; }
.plan-tabs button.is-active { color:#cefa68;border-color:#cefa6870;background:#cefa6815;box-shadow:inset 0 1px 0 #ffffff0e; }
.plan-tabs button:disabled { opacity:.6;cursor:wait; }
.plan-name-row { display:flex;align-items:center;gap:10px;padding-top:7px;border-top:1px solid #ffffff0a; }
.plan-name-row label { flex:0 0 auto;font-size:12px;color:#8ea783; }
.plan-name-row input { width:100%;min-width:0;background:transparent;border:0;border-bottom:1px solid #d5edb225;border-radius:0;padding:6px 0;color:#e0ead7;font:15px var(--sans); }
.plan-name-row span { flex:0 0 auto;font-size:11px;color:#768e6a; }
#plan-task-heading { font-size:19px;overflow-wrap:anywhere; }
@media(max-width:760px) { .plan-archive{padding:13px}.plan-name-row span{display:none}.plan-tabs button{padding:8px 12px} }

.plan-delete { flex:0 0 auto;padding:7px 10px;border:1px solid #eeb79e35;border-radius:9px;background:#f1ab8307;color:#c6a493;cursor:pointer;font:12px var(--sans); }
.plan-delete:hover { color:#f2c3ac;background:#f1ab8313;border-color:#eeb79e70; }
.plan-delete:disabled { opacity:.5;cursor:wait; }
.plan-trash { margin-top:12px;border-top:1px solid #ffffff0b;padding-top:10px; }
.plan-trash summary { font-size:12px;color:#7f9474;cursor:pointer; }
#plan-trash-list { display:grid;gap:8px;margin-top:10px; }
#plan-trash-list p { margin:0;font-size:12px;color:#73876c; }
.plan-trash-row { display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:#a1b28f;padding:8px 10px;border:1px solid #ffffff0c;border-radius:9px; }
.plan-trash-row button { padding:5px 10px;border:1px solid #cefa682b;border-radius:7px;background:#cefa6808;color:#c2e58d;cursor:pointer;font:12px var(--sans); }

/* A single conversation workspace: projects left, chat center, audio tasks right. */
html,body { height:100%;overflow:hidden; }
.studio-frame { height:100dvh;min-height:0;grid-template-columns:260px minmax(0,1fr); }
.sidebar { position:relative;top:auto;height:100dvh;min-height:0;display:flex;flex-direction:column;gap:16px;padding:20px 16px;background:#08120fe8;border-right:1px solid #ffffff0d; }
.sidebar .brand { margin:0;padding:0 6px 18px;border:0; }
.sidebar-account-card,.nexus-pulse,.sidebar-bottom { display:none; }
.chat-projects { flex:1;min-height:130px;display:flex;flex-direction:column;padding:0;border:0;border-radius:0;background:none; }
.plan-archive-heading { font-size:12px;color:#86947e;flex-wrap:wrap;gap:10px; }
#plan-save-status { display:none; }
#agent-new-chat { font-size:13px;padding:9px 12px;background:#cefa680b;border-color:#cefa6825;color:#c0dfa0;margin-left:auto; }
.plan-tabs { flex:1;display:flex;flex-direction:column;align-items:stretch;min-height:80px;overflow:auto;padding:10px 0;gap:4px; }
.plan-tabs button { width:100%;max-width:none;text-align:left;flex:0 0 auto;border-color:transparent;background:transparent;padding:11px 13px;border-radius:9px;color:#afbaa5;font-size:14px; }
.plan-tabs button:hover { background:#ffffff06; }
.plan-tabs button.is-active { background:#cefa6810;border-color:#cefa6824;color:#dcf5ba;box-shadow:none; }
.project-menu { border-top:1px solid #ffffff0b;padding-top:10px; }
.project-menu summary { font-size:12px;color:#809378;cursor:pointer;list-style:none; }
.project-menu .plan-name-row { flex-wrap:wrap;border:0;padding-top:8px;gap:7px; }
.project-menu .plan-name-row input { flex:1;width:120px; }
.project-menu .plan-name-row>span { display:none; }
.project-menu .plan-name-row label { display:none; }
.project-menu .plan-conversation-name-row { display:grid;grid-template-columns:68px minmax(0,1fr);align-items:center;gap:5px 8px;padding:9px 0;border-top:1px solid #ffffff0a; }
.project-menu .plan-conversation-name-row label { color:#8ea783;font-size:12px; }
.project-menu .plan-conversation-name-row input { width:100%;min-width:0;padding:6px 0;border:0;border-bottom:1px solid #d5edb225;border-radius:0;background:transparent;color:#e0ead7;font:14px var(--sans); }
.project-menu .plan-conversation-name-row input:focus { outline:0;border-bottom-color:#cefa6875; }
.project-menu .plan-conversation-name-row small { grid-column:2;color:#768e6a;font-size:11px; }
.plan-trash { font-size:12px;margin-top:10px; }
.plan-trash[open] { max-height:150px;overflow:auto; }
.chat-task-panel { flex:0 0 auto;max-height:230px;overflow-y:auto;border-top:1px solid #ffffff12;padding:15px 3px 0; }
.chat-task-panel .eyebrow { display:none; }
.chat-task-panel .rail-heading { margin-bottom:12px;align-items:center; }
.chat-task-panel #plan-task-heading { font-size:14px;font-weight:500;color:#bacaaa; }
.chat-task-panel .text-action { font-size:11px; }
.chat-task-panel .empty-state { min-height:65px;padding:6px 0;border:0;text-align:left;align-items:flex-start;gap:7px; }

/* Project tree: each child is a separate saved conversation. */
.plan-tabs { align-items:stretch;overflow-x:hidden; }
.chat-project-group { flex:0 0 auto;min-width:0; }
.chat-project-heading { display:flex;align-items:center;gap:4px;min-width:0;border-radius:9px; }
.chat-project-heading:hover { background:#ffffff06; }
.chat-project-heading.is-current { background:#cefa6809; }
.plan-tabs .chat-project-toggle { display:flex;align-items:center;gap:9px;flex:1;min-width:0;width:auto;padding:11px 7px 11px 9px;border:0;border-radius:0;background:transparent;color:#c2d0b4;text-align:left;font-size:14px; }
.chat-project-heading.is-current .chat-project-toggle { color:#d9edc3; }
.chat-project-arrow { flex:0 0 12px;color:#77896d;font-size:12px;text-align:center; }
.chat-project-name { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.plan-tabs .chat-project-add { flex:0 0 27px;width:27px;max-width:none;height:27px;padding:0;border:1px solid #cefa6828;border-radius:8px;background:#cefa6808;color:#c6e69d;text-align:center;font:18px var(--sans); }
.plan-tabs .chat-project-add:hover { border-color:#cefa6870;background:#cefa6816;color:#d9fa92; }
.plan-tabs .chat-project-delete { flex:0 0 27px;width:27px;max-width:none;height:27px;padding:0;border:1px solid #e79b8730;border-radius:8px;background:#e79b8707;color:#bb9287;text-align:center;font:19px var(--sans);line-height:1; }
.plan-tabs .chat-project-delete:hover { border-color:#ec9b8575;background:#e79b8717;color:#f0b2a0; }
.chat-conversations { display:grid;gap:3px;padding:1px 0 7px 20px; }
.plan-tabs .chat-conversation { min-height:33px;width:100%;padding:8px 10px;border:1px solid transparent;border-radius:8px;background:transparent;color:#91a18a;text-align:left;font-size:13px; }
.plan-tabs .chat-conversation:hover { background:#ffffff06;color:#c0d1af; }
.plan-tabs .chat-conversation.is-active { border-color:#cefa6822;background:#cefa6810;color:#d6f1ae; }
.chat-project-no-conversations { padding:7px 10px;color:#74836c;font-size:12px; }
.plan-empty-note { padding:0 8px 10px;color:#829178;font-size:12px; }
.plan-empty-note strong,.plan-empty-note span { display:block; }
.plan-empty-note strong { margin-bottom:5px;color:#bfceaf;font-size:13px; }
@media(max-width:480px) { .plan-tabs .chat-project-toggle { font-size:12px;padding-left:5px }.chat-conversations{padding-left:14px}.plan-tabs .chat-conversation{font-size:12px;padding:7px 8px}.plan-tabs .chat-project-add,.plan-tabs .chat-project-delete{flex-basis:24px;width:24px;height:24px} }
.chat-task-panel .empty-orbit,.chat-task-panel .empty-state>span:last-child { display:none; }
.chat-task-panel .empty-state strong { color:#6e8169;font-size:12px;font-weight:400; }
.chat-task-panel .mini-task { padding:9px 0;background:transparent;border:0;border-bottom:1px solid #ffffff08;border-radius:0; }
.workspace-tools { flex:0 0 auto;padding-top:12px;border-top:1px solid #ffffff0c; }
.workspace-tools>summary { font-size:13px;color:#97a38d;cursor:pointer;list-style:none;padding:4px; }
.workspace-tools[open] .main-nav { max-height:220px;overflow:auto;margin-top:9px; }
.workspace-tools .nav-caption { display:none; }
.workspace-tools .nav-item { min-height:35px;padding:6px 9px; }.workspace-tools .nav-copy small{display:none}.workspace-tools .nav-icon{width:23px;height:23px;flex-basis:23px;font-size:16px}
.main-shell { display:flex;flex-direction:column;height:100dvh;min-height:0; }
.topbar { flex:0 0 60px;min-height:60px;position:relative;top:auto;padding:0 26px;background:#08110c80;border-bottom:1px solid #ffffff0a; }
.engine-state { display:none; }
.content-area { flex:1;min-height:0;width:100%;max-width:none;margin:0;padding:0;overflow:auto; }
.footer-note { display:none; }
.chat-workspace>.command-hero,.chat-workspace>.section-intro,.chat-workspace .right-rail { display:none; }
.chat-workspace.is-visible { display:flex;height:100%;min-height:0; }
.chat-workspace .studio-grid { display:contents; }
.chat-workspace .composer-surface { display:flex;flex-direction:column;width:100%;height:100%;min-height:0;padding:0;background:transparent;backdrop-filter:none;border:0;border-radius:0;box-shadow:none;position:relative; }
.chat-workspace .surface-heading { flex:0 0 56px;min-height:56px;margin:0;padding:18px 28px;border-bottom:0;align-items:center; }
.chat-workspace #composer-title { font-size:17px;font-weight:500;margin:0;color:#d4dfc9; }
.chat-header-brand { font-size:12px;color:#7c9270; }
.chat-workspace .agent-form { display:flex;flex-direction:column;flex:1;min-height:0;width:min(100%,860px);margin:0 auto;padding:0 30px 18px;gap:12px;position:relative; }
.chat-workspace .agent-status { flex:0 0 auto;padding:0;border:0;font-size:12px;color:#92a57e; }
.chat-workspace .agent-status #agent-connection { font-size:11px;color:#6c8167; }
.chat-workspace .agent-thread { flex:1;min-height:0;height:auto;max-height:none;border:0;border-radius:0;background:transparent;padding:25px 0; }
.chat-workspace .agent-message { max-width:96%;gap:14px; }
.chat-workspace .agent-message:not(.is-user)>div { border:0;background:transparent;padding:0; }
.chat-workspace .agent-message strong { font-size:13px;color:#abc48b; }
.chat-workspace .agent-message p { font-size:16px;line-height:1.9;color:#d3ddcc; }
.chat-workspace .agent-message.is-user { max-width:85%;padding:13px 17px;border-radius:18px;background:#263524; }
.chat-workspace .agent-starters { justify-content:center;gap:8px;flex:0 0 auto; }
.chat-workspace .agent-starters button { font-size:12px;border-radius:16px;padding:8px 11px;background:#ffffff03;border-color:#ffffff10; }
.chat-workspace .agent-input-box { flex:0 0 auto;margin:0;border-radius:22px;padding:15px 17px;background:#1a281ec9;border-color:#b0cc882e;box-shadow:0 6px 25px #00000015; }
.chat-workspace .agent-input-box textarea { min-height:42px;max-height:120px;font-size:16px;resize:none; }
.chat-workspace .agent-input-footer { margin-top:0; }
.chat-actions { display:flex;align-items:center;justify-content:space-between;gap:12px;flex:0 0 auto; }
.chat-workspace .agent-settings { padding:0;border:0;background:none;border-radius:0; }
.chat-workspace .agent-settings>summary { font-size:12px;border:1px solid #ffffff16;border-radius:9px;padding:7px 11px;gap:20px; }
.chat-workspace .agent-settings[open] { position:absolute;z-index:5;bottom:170px;left:30px;right:30px;max-height:60vh;overflow-y:auto;padding:20px;background:#0e1d15fa;border:1px solid #cefa683b;border-radius:18px;box-shadow:0 10px 40px #0009; }
.chat-workspace .agent-settings[open]>summary { margin-bottom:18px; }
.chat-workspace .agent-settings .agent-draft-copy { margin:12px 0 18px; }
.chat-workspace .create-footer { border:0;padding:0;display:flex;justify-content:flex-end;margin:0; }
.chat-workspace .cost-preview { display:none; }
.chat-workspace .create-button { padding:8px 13px;min-height:0;border-radius:10px;font-size:12px;gap:12px; }
.chat-workspace .form-message { margin:0;font-size:13px; }.chat-workspace .form-message:empty{display:none}
.cosmic-backdrop { opacity:.45; }
.view:not(.chat-workspace) { padding:26px; }
@media(max-width:760px) { .studio-frame{display:grid;grid-template-columns:190px minmax(0,1fr)}.sidebar{display:flex;position:relative;transform:none;visibility:visible;padding:16px 10px;width:auto}.mobile-menu{display:none}.brand-copy small{display:none}.sidebar .brand-copy strong{font-size:15px}.main-shell{height:100dvh}.topbar{padding:0 14px}.credit-pill{display:none}.breadcrumb{font-size:12px}.chat-workspace .agent-form{padding:0 15px 13px}.chat-workspace .surface-heading{padding:15px}.chat-header-brand{display:none}.chat-workspace .agent-starters{display:none}.chat-workspace .agent-settings[open]{left:10px;right:10px}.chat-workspace .agent-message p{font-size:14px}.chat-workspace .agent-message{gap:8px}.plan-archive-heading{gap:7px}.chat-task-panel{max-height:170px} }
@media(max-width:480px) { .studio-frame{grid-template-columns:135px minmax(0,1fr)}.brand-mark{width:22px;height:22px}.brand-copy strong{font-size:13px}.plan-tabs button{font-size:13px;padding:10px}.chat-projects .plan-archive-heading>span{display:none}.chat-workspace .agent-avatar{display:none}.chat-workspace .agent-thread{padding:15px 0}.chat-workspace .agent-input-note{font-size:10px}.chat-workspace .agent-actions{gap:5px} }

.chat-workspace .cost-preview { display:flex;gap:5px;font-size:11px;color:#819575;padding-right:10px; }
.chat-workspace .cost-detail,.chat-workspace .cost-star { display:none; }
.chat-task-result { width:100%;margin:20px 0; }
.chat-task-result .task-card { border:1px solid #cefa6825;background:#102017;border-radius:15px; }
.agent-action-card { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 18px;align-items:center;margin:8px 0 18px 38px;padding:16px 18px;border:1px solid #cffa6840;border-radius:14px;background:linear-gradient(135deg,#d7ff7410,#bcecff08 55%,#d7ff7407);box-shadow:inset 0 1px #ffffff12,0 12px 28px #0003; }
.agent-action-copy { display:grid;gap:6px;min-width:0; }.agent-action-copy strong { color:#e8f3dc;font-size:15px;font-weight:600; }.agent-action-copy span { color:#bac9b4;font-size:14px;line-height:1.6;overflow-wrap:anywhere; }.agent-action-copy small,.agent-action-feedback { color:#91a58c;font-size:12px;line-height:1.5; }
.agent-action-controls { display:flex;gap:8px;align-items:center; }.agent-action-confirm { padding:9px 13px;border:1px solid #d8ff78;border-radius:9px;background:linear-gradient(135deg,#d7ff75,#a8e95b);color:#152012;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 4px 16px #cffa6830; }.agent-action-confirm:disabled { opacity:.62;cursor:wait; }.agent-action-feedback { grid-column:1/-1; }
.agent-action-sfx-meta { display:flex;flex-wrap:wrap;align-items:center;gap:6px 9px;color:#91a58c;font-size:12px; }.agent-action-sfx-meta strong { padding:4px 9px;border:1px solid #cffa6838;border-radius:999px;background:#cffa680c;color:#d4e8b6;font-size:12px;font-weight:500; }
.agent-action-sfx-duration { display:grid;grid-template-columns:auto 1fr;align-items:center;gap:6px 12px;padding:10px 12px;border:1px solid #cffa6830;border-radius:10px;background:#09120b66; }.agent-action-sfx-duration[hidden] { display:none; }.agent-action-sfx-duration label { display:flex;align-items:center;gap:8px;color:#b9c9b4;font-size:13px; }.agent-action-sfx-duration input { width:88px;padding:7px 9px;border:1px solid #cffa6840;border-radius:8px;background:#101a13;color:#eff7e5;font:inherit; }.agent-action-sfx-duration small { color:#91a58c;font-size:12px;line-height:1.5; }.agent-action-sfx-duration [data-sfx-credit-detail] { grid-column:1/-1;color:#d4e8b6; }
@media(max-width:760px) { .agent-action-card { grid-template-columns:1fr;margin-left:0;padding:13px; }.agent-action-controls { justify-content:flex-end;flex-wrap:wrap; } }
.agent-scene-plan-card { position:relative;display:grid;flex:0 0 auto;align-self:stretch;gap:12px;margin:8px 0 20px 44px;padding:20px 22px;max-width:min(860px,calc(100% - 44px));overflow:hidden;border:1px solid #d7ff7570;border-radius:16px;background:linear-gradient(135deg,#d7ff741c,#bcecff0d 48%,#d7ff740b),#101a1cdd;box-shadow:inset 0 1px #ffffff24,0 14px 34px #0005,0 0 26px #cffa6810; }
.agent-scene-plan-card::before { position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,#efffc8a8 22%,#d9f8ff44 70%,transparent);content:"";pointer-events:none; }
.agent-scene-plan-head,.agent-scene-plan-meta { display:flex;align-items:center;justify-content:space-between;gap:16px; }
.agent-scene-plan-identity { display:grid;gap:4px;min-width:0; }.agent-scene-plan-head strong { color:#efffcf;font-size:17px; }.agent-scene-plan-head span,.agent-scene-plan-note { color:#a7b99e;font-size:13px; }
.agent-scene-plan-confirm { flex:0 0 auto;min-height:44px;padding:11px 18px;border-radius:10px;font-size:14px;white-space:nowrap;box-shadow:0 5px 20px #cffa6840; }
.agent-scene-plan-label { margin:0;color:#9fb394;font-size:12px;letter-spacing:.04em; }
.agent-scene-plan-prompt { margin:0;padding:12px 14px;border:1px solid #ffffff12;border-radius:11px;background:#08120e88;color:#e0e8d8;font-size:14px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere; }
.agent-scene-plan-tags { display:flex;flex-wrap:wrap;gap:6px; }.agent-scene-plan-tags span { padding:5px 9px;border:1px solid #cffa6832;border-radius:999px;background:#cffa680e;color:#cde2a7;font-size:12px; }
.agent-scene-plan-meta { justify-content:flex-start;color:#9baa93;font-size:12px; }.agent-scene-plan-note { margin:0;line-height:1.6; }
.agent-scene-plan-card.is-submitted { border-color:#b9e77d50; }.agent-scene-plan-card.is-submitted .agent-scene-plan-head strong { color:#d5f197; }
.agent-scene-plan-card.is-complete { border-color:#cffa6870;background:linear-gradient(135deg,#d7ff7428,#bcecff10 48%,#d7ff7412),#101a1cdd; }
.agent-scene-plan-card.is-failed { border-color:#ff9a7d70; }
body.is-chat .chat-workspace .chat-actions,body.is-chat .chat-workspace .create-footer { display:none !important; }
@media(max-width:760px) { .agent-scene-plan-card { margin-left:0;max-width:100%;padding:14px; }.agent-scene-plan-head { align-items:stretch;flex-direction:column;gap:10px; }.agent-scene-plan-confirm { width:100%; } }
.agent-attach { flex:0 0 auto;padding:7px 9px;border:1px solid #c9e7a022;border-radius:8px;background:#d7ff7408;color:#a9bf93;font:12px var(--sans);cursor:pointer;white-space:nowrap; }
.agent-attach:disabled { opacity:.55;cursor:wait; }
.agent-attach:hover { border-color:#d7ff7455;color:#d7efbd; }
.agent-media-preview { display:flex;align-items:center;gap:9px;margin:0 0 10px;padding:7px 9px;border:1px solid #cffa6822;border-radius:10px;background:#080f0b66;color:#bfd0ad;font-size:12px; }
.agent-media-preview[hidden],.agent-voice-profile[hidden] { display:none; }
.agent-media-preview img { width:40px;height:34px;object-fit:cover;border-radius:5px;border:1px solid #d7ff7433; }
.agent-media-preview span { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.agent-media-preview button { flex:0 0 auto;margin-left:auto;border:0;background:transparent;color:#c7d6b7;font:16px var(--sans);cursor:pointer; }
.agent-voice-profile { min-width:118px;max-width:168px;padding:7px 8px;border:1px solid #c9e7a022;border-radius:8px;background:#101b13;color:#c4d6b4;font:12px var(--sans); }
.agent-message-attachment { display:grid;gap:5px;margin-top:8px;color:#c4d5b0;font-size:12px; }
.agent-message-attachment img { display:block;max-width:min(280px,100%);max-height:180px;object-fit:contain;object-position:left;border:1px solid #ffffff1b;border-radius:9px;background:#09110e; }
.agent-message.is-user .agent-message-attachment { justify-items:end; }
.agent-message.is-user .agent-message-attachment img { object-position:right; }
.agent-module-scene_music .agent-voice-profile,.agent-module-scene_music #agent-voice-attach { display:none; }
.agent-module-npc_voice #agent-image-attach { display:none; }
.agent-module-sfx #agent-image-attach,.agent-module-sfx #agent-voice-attach,.agent-module-sfx .agent-voice-profile { display:none; }
.agent-composer-tags { display:flex;flex-wrap:wrap;gap:7px;padding:0 0 10px; }
.agent-composer-tags[hidden] { display:none; }
.agent-composer-tag { display:inline-flex;align-items:center;gap:7px;min-height:27px;padding:4px 7px 4px 10px;border:1px solid #cffa6863;border-radius:999px;background:linear-gradient(120deg,#cffa681e,#9ddfff12);color:#e1f4b0;font-size:13px;line-height:1.25; }
.agent-composer-tag button { display:grid;place-items:center;width:18px;height:18px;padding:0;border:0;border-radius:50%;background:#ffffff12;color:#d7e7c5;font:16px/1 var(--sans);cursor:pointer; }
.agent-composer-tag button:hover { background:#ffffff26;color:#fff; }
.agent-composer-tag button:disabled { opacity:.5;cursor:wait; }
.agent-message-tags { display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 8px; }
.agent-message-tag { display:inline-flex;padding:4px 8px;border:1px solid #cffa6845;border-radius:999px;background:#cffa6811;color:#d9efaa;font-size:12px;line-height:1.4; }
.chat-workspace .agent-message.is-user .agent-message-tag { border-color:#d5f58b3a;background:#d5f58b12;color:#e7f8bd; }
@media(max-width:760px) { .agent-composer-tags { gap:5px;padding-bottom:8px; }.agent-composer-tag { font-size:12px; } }

/* The console is the product entrance; project chat is its own workspace. */
.home-journey { display:none; }
body:not(.is-chat) .chat-projects,body:not(.is-chat) .chat-task-panel { display:none; }
body:not(.is-chat) .sidebar-account-card { display:flex; }
body:not(.is-chat) .workspace-tools { flex:1;min-height:0;border:0;padding:0;overflow-y:auto; }
body:not(.is-chat) .workspace-tools>summary { display:none; }
body:not(.is-chat) .workspace-tools .main-nav { max-height:none;overflow:visible; }
body:not(.is-chat) .workspace-tools .nav-item { min-height:44px; }
body:not(.is-chat) .sidebar-bottom { display:flex;margin-top:auto; }
body:not(.is-chat) .sidebar-bottom .universe-link,body:not(.is-chat) .sidebar-bottom .version-note { display:none; }
body:not(.is-chat) .chat-workspace.is-visible { display:block;height:auto;min-height:100%;padding:26px;max-width:1600px;margin:0 auto; }
body:not(.is-chat) .chat-workspace>.command-hero { display:grid; }
body:not(.is-chat) .chat-workspace>.section-intro { display:flex; }
body:not(.is-chat) .chat-workspace .composer-surface { display:none; }
body:not(.is-chat) .chat-workspace .studio-grid { display:block; }
body:not(.is-chat) .chat-workspace .right-rail { display:grid;grid-template-columns:1.5fr 1fr;gap:20px;margin-top:24px; }
body:not(.is-chat) .home-journey { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;border:1px solid #ffffff13;background:#0d1c1280;border-radius:20px;padding:24px; }
.home-journey>div { display:grid;align-content:start;gap:10px; }
.home-journey>div>span { color:#cefa68;font-size:13px; }.home-journey strong{font-size:16px;font-weight:500;color:#d4e4c7}.home-journey p{margin:0;color:#8da180;font-size:14px;line-height:1.8}
.home-journey>button { grid-column:1/-1;justify-self:start;border:1px solid #cefa6840;background:#cefa6815;border-radius:11px;color:#cefa68;padding:11px 17px;font-size:14px;cursor:pointer; }
.back-console { display:inline-block;border:0;background:none;color:#869b78;font-size:13px;padding:0;margin:0 14px 0 0;cursor:pointer; }
.chat-workspace .surface-heading>div { display:flex;align-items:center; }
body.is-chat .home-journey { display:none; }
@media(max-width:760px) { body:not(.is-chat) .chat-workspace.is-visible{padding:16px}.home-journey{gap:12px!important;padding:18px!important}body:not(.is-chat) .home-journey{grid-template-columns:1fr}body:not(.is-chat) .chat-workspace .right-rail{grid-template-columns:1fr}.back-console{font-size:12px;margin-right:8px} }

/* Start with a real named project instead of generated A/B placeholders. */
.plan-empty-note { display:grid;gap:7px;padding:13px 11px;border:1px dashed #b9d59a2b;border-radius:11px;background:linear-gradient(145deg,#b5d98c0d,#0a130f20); }
.plan-empty-note strong { color:#c4d7b4;font-size:13px;font-weight:500; }
.plan-empty-note span { color:#75856e;font-size:11px;line-height:1.6; }
.plan-description-row { display:grid;gap:6px;margin-top:11px;color:#8ea783;font-size:12px; }
.plan-description-row textarea { width:100%;min-height:58px;resize:vertical;background:#07110c75;border:1px solid #ffffff13;border-radius:8px;padding:8px;color:#dce8d3;font:13px/1.6 var(--sans); }
.plan-description-row textarea:focus { outline:1px solid #cefa684c;border-color:#cefa685c; }
.project-chat-empty { display:none; }
body.is-chat.has-no-plan .project-chat-empty { display:grid;flex:1;min-height:0;place-items:center;padding:24px; }
body.is-chat.has-no-plan .composer-surface { display:none; }
.project-chat-empty-card { width:min(100%,520px);padding:34px;border:1px solid #d8e9c51c;border-radius:20px;background:radial-gradient(ellipse at 100% 0%,#b9e98013,transparent 48%),linear-gradient(145deg,#18281fc9,#09120dd9);box-shadow:inset 0 1px 0 #ffffff0a,0 24px 70px #0004; }
.project-chat-empty-card .eyebrow,.project-dialog>.eyebrow { color:#a5c47f;font-size:11px;letter-spacing:.14em; }
.project-chat-empty-card h2 { margin:13px 0 8px;color:#edf4e7;font-size:24px;font-weight:550; }
.project-chat-empty-card p { max-width:390px;margin:0 0 22px;color:#91a48a;font-size:14px;line-height:1.8; }
.project-dialog { border-color:#d9edc52c;background:radial-gradient(ellipse at 100% 0%,#c8fa6810,transparent 45%),linear-gradient(145deg,#16231c,#0b110e);box-shadow:inset 0 1px 0 #ffffff0b,0 28px 100px #000b; }
.project-dialog h2 { margin:10px 0 6px;color:#eef4e9;font-size:23px;font-weight:550; }
.project-dialog>p { margin:0 0 20px;color:#8b9c85;font-size:13px;line-height:1.8; }
.project-dialog form { display:grid;gap:14px; }
.project-dialog .auth-field { gap:7px;color:#bdcbb3;font-size:12px; }
.project-dialog .auth-field input,.project-dialog .auth-field textarea { width:100%;border:1px solid #dceccb1c;border-radius:10px;background:#06100ba6;padding:11px 12px;color:#eff5e8;font:14px/1.6 var(--sans); }
.project-dialog .auth-field input { height:42px; }
.project-dialog .auth-field textarea { min-height:104px;resize:vertical; }
.project-dialog .auth-field input:focus,.project-dialog .auth-field textarea:focus { outline:1px solid #cefa6852;border-color:#cefa6860; }
.project-dialog .auth-field input::placeholder,.project-dialog .auth-field textarea::placeholder { color:#657561; }
.project-dialog .auth-field small { color:#71816d;font-size:11px; }
.project-dialog-actions { display:flex;justify-content:flex-end;gap:9px;margin-top:5px; }
.project-dialog-actions .quiet-button,.project-dialog-actions .create-button { min-height:38px;padding:0 14px;border-radius:9px;font-size:12px; }
.project-dialog-actions .create-button { display:flex;align-items:center;gap:11px; }
@media(max-width:520px) { .project-dialog-actions { flex-direction:column-reverse; }.project-dialog-actions>* { width:100%;justify-content:center; }.project-chat-empty-card { padding:25px 20px; } }

/* Creator achievements and the first season sit between the console and creation. */
.home-rewards { display:none; }
body:not(.is-chat) .home-rewards { display:grid;grid-template-columns:1fr 1.35fr;gap:20px;margin-top:24px; }
.reward-card { position:relative;overflow:hidden;border:1px solid #e0f4c51c;border-radius:22px;padding:25px 28px;background:linear-gradient(125deg,#182a20ba,#09150fcc);box-shadow:inset 0 1px 0 #ffffff06;backdrop-filter:blur(16px); }
.reward-heading { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.reward-heading .eyebrow { font-size:11px;letter-spacing:.12em;color:#91a889; }
.reward-status { padding:4px 8px;border:1px solid #c7dfa023;border-radius:20px;font-size:11px;color:#94aa85;white-space:nowrap; }
.reward-card h2 { margin:13px 0 7px;color:#edf3e6;font-size:24px;font-weight:600;letter-spacing:-.02em; }
.reward-card p { margin:0;color:#94a98c;font-size:14px;line-height:1.7; }
.achievement-badges { display:flex;gap:28px;margin:22px 0 15px; }
.achievement-badges>div { display:grid;justify-items:center;gap:10px; }
.achievement-medal { display:grid;place-items:center;width:49px;height:55px;clip-path:polygon(50% 0,94% 24%,94% 76%,50% 100%,6% 76%,6% 24%);background:linear-gradient(145deg,#cefa683c,#cefa6808);color:#c7e68d;font-size:27px; }
.achievement-badges>div:nth-child(2) .achievement-medal { background:linear-gradient(145deg,#a4c5cd35,#a4c5cd08);color:#a4c5cd; }
.achievement-badges>div:nth-child(3) .achievement-medal { background:linear-gradient(145deg,#d9c39a35,#d9c39a08);color:#d9c39a; }
.achievement-badges strong { font-size:12px;font-weight:400;color:#b4c5a5; }
.reward-footnote { font-size:12px;color:#6f886c; }
.season-card { background:linear-gradient(110deg,#233725b8,#10251bc9 60%,#192e2199); }
.season-copy { position:relative;z-index:1;max-width:70%; }
.season-card h2 { font-size:20px;color:#cefa68; }
.season-card h3 { margin:7px 0 12px;font-size:25px;font-weight:600;color:#f0f4e9;letter-spacing:-.02em; }
.season-reward { display:inline-flex;gap:9px;align-items:center;border:1px solid #cefa682d;background:#cefa6809;border-radius:9px;padding:9px 13px;margin-top:18px;color:#d7efb9;font-size:14px; }
.season-reward>span { color:#cefa68; }
.season-coming { display:flex;align-items:center;gap:25px;margin-top:15px;color:#8da981;font-size:12px; }
.season-art { position:absolute;width:200px;height:220px;right:2%;top:50%;transform:translateY(-50%);pointer-events:none; }
.season-orbit { position:absolute;inset:0;border:1px solid #cefa6817;border-radius:50%;transform:rotate(-30deg) scaleY(.8);box-shadow:0 0 0 18px #cefa6803,0 0 0 19px #cefa6807; }
.commission-envelope { position:absolute;top:55px;left:22px;width:155px;height:115px;border:1px solid #b7cf8260;border-radius:10px;background:linear-gradient(150deg,#496444,#263c2c);transform:rotate(-12deg);box-shadow:0 20px 35px #0005,inset 0 1px 0 #eefdc52b; }
.commission-envelope::before,.commission-envelope::after { content:"";position:absolute;inset:0;border-radius:9px;background:linear-gradient(36deg,transparent 49.5%,#bdd69924 50%,transparent 50.5%); }
.commission-envelope::after { transform:scaleX(-1); }
.envelope-fold { position:absolute;inset:0;clip-path:polygon(0 0,100% 0,50% 62%);background:linear-gradient(160deg,#789862,#3e593a);filter:drop-shadow(0 2px 2px #0008); }
.envelope-seal { position:absolute;z-index:1;top:45px;left:59px;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#cefa68;box-shadow:0 3px 8px #0004; }
.envelope-seal img { width:24px;height:24px; }
.season-spark { position:absolute;color:#cefa68;font-size:23px; }.spark-one{right:15px;top:31px}.spark-two{left:11px;bottom:28px;color:#8fbab0;font-size:18px}
@media(max-width:1100px) { .season-art{right:-55px;opacity:.6}.season-copy{max-width:90%}.achievement-badges{gap:20px}.reward-card{padding:23px}.season-card h3{font-size:22px} }
@media(max-width:900px) { body:not(.is-chat) .home-rewards{grid-template-columns:1fr}.season-art{right:3%;opacity:1}.season-copy{max-width:75%}.achievement-badges{gap:35px}.reward-card{min-height:245px} }
@media(max-width:480px) { .reward-card{padding:19px}.season-art{opacity:.25;right:-65px}.season-copy{max-width:100%}.reward-heading .eyebrow{font-size:10px}.achievement-badges{gap:20px}.season-card h3{font-size:21px} }

/* Lime is the brand accent; the console glass uses a richer mineral palette. */
:root { --bg:#080b14;--panel:#131825;--muted:#a1a8ba; }
html,body { background:#080b14; }
.cosmic-backdrop { opacity:.72;background:radial-gradient(ellipse at 78% 84%,#25203e 0,transparent 57%),radial-gradient(ellipse at 25% 55%,#132942 0,transparent 50%),#050810; }
.cosmic-nebula-cyan { background:radial-gradient(ellipse,#69c8ed24,transparent 65%); }
.cosmic-nebula-violet { background:radial-gradient(ellipse,#ad80eb24,transparent 60%); }
.sidebar { background:#0a101be8;border-right-color:#b0bed51a; }
.topbar { background:#090f1cb0;border-bottom-color:#b0bed513; }
.nav-item.is-active { background:#c9d9ed13; }
.nav-icon { background:#9cb3d014;color:#a7bbd7; }
.nav-item[data-view="inspiration"] .nav-icon,.nav-item[data-shortcut-mode="custom"] .nav-icon { color:#c5a5ff;background:#b38aee16; }
.nav-item[data-view="credits"] .nav-icon { color:#efcc91;background:#e9bf7816; }
.nav-item[data-view="sfx"] .nav-icon { color:#83d9f3;background:#71cbe916; }
.nav-item[data-view="npc"] .nav-icon { color:#f3acae;background:#ee9ca316; }
.nav-item.is-active .nav-icon { color:#192822;background:#cefa68; }
.nav-count { background:#b1c6df14;color:#a5b9d6; }
.credit-pill { background:#ffffff05; }
.plan-mini { border:1px solid #b5a0ed25;background:radial-gradient(ellipse at 100% 0,#8c65d62c,transparent 70%),linear-gradient(135deg,#202339,#111827); }
.plan-mini button { background:#c6c1ec0a;border:1px solid #c7b9ed22; }
.hero-copy { background:radial-gradient(ellipse at 98% 5%,#5c7cbd33,transparent 63%),linear-gradient(130deg,#152138,#1d2236);border:1px solid #bacde625; }
.hero-record { background:repeating-radial-gradient(circle at center,#1d2839 0 3px,#a8bed217 4px,#111927 5px 8px);box-shadow:0 18px 45px #0005,inset 0 0 0 1px #a6b9d426; }
.hero-primary,.hero-secondary { background:#dbeaff08;border-color:#c2d4ef38; }
.hero-primary:hover,.hero-secondary:hover { background:#dbeaff15;border-color:#dceaff70; }
.hero-emblem { background:radial-gradient(ellipse at 50% 0,#779ac321,transparent 68%),linear-gradient(145deg,#111c2cdb,#0c1422bd);border:1px solid #a6c5ed20; }
.quota-track { stroke:#64799260; }
.hero-emblem-caption { background:transparent; }
#quota-unit,#quota-note { color:#98a7be; }
.hero-status-row { background:linear-gradient(145deg,#141a2cce,#0d1422c4);border:1px solid #afbedc1c; }
.module-entry { background:#c0c9e905;border-color:#a9b8d720; }
.module-entry:nth-of-type(1) { --module-accent:#c8a6ff; }
.module-entry:nth-of-type(2) { --module-accent:#7dd9ee; }
.module-entry:nth-of-type(3) { --module-accent:#f1a5b3; }
.module-entry .module-symbol { color:var(--module-accent);border-color:color-mix(in srgb,var(--module-accent) 30%,transparent);background:color-mix(in srgb,var(--module-accent) 10%,transparent); }
.module-entry small { color:#9faabd; }
.module-entry i { color:var(--module-accent); }
.module-entry:hover { border-color:color-mix(in srgb,var(--module-accent) 50%,transparent);background:color-mix(in srgb,var(--module-accent) 9%,transparent); }
.achievement-card { background:radial-gradient(ellipse at 5% 0,#ab7aea30,transparent 65%),linear-gradient(125deg,#211c36d6,#141627d4);border-color:#c6a6ff33; }
.achievement-card .eyebrow { color:#b5a1d5; }
.achievement-card p { color:#b4a9c7; }
.achievement-card .reward-status { color:#bbabd1;border-color:#c2a8ed33;background:#b591e70a; }
.achievement-card .reward-footnote { color:#988aa9; }
.achievement-badges strong { color:#cbbfdc; }
.achievement-medal { color:#d4b5ff;background:linear-gradient(145deg,#b888fa75,#5d418a38);filter:drop-shadow(0 4px 8px #b384f528); }
.achievement-badges>div:nth-child(2) .achievement-medal { color:#a6e9ff;background:linear-gradient(145deg,#75c9e575,#24466a45); }
.achievement-badges>div:nth-child(3) .achievement-medal { color:#ffe0a8;background:linear-gradient(145deg,#e1b36475,#6e492938); }
.season-card { background:radial-gradient(ellipse at 100% 5%,#d8a75b2b,transparent 58%),linear-gradient(115deg,#2c2230d9,#1c192bdc 56%,#342a26cd);border-color:#e7c39335; }
.season-card .eyebrow { color:#c5ae95; }
.season-card h2 { color:#efd29f; }
.season-card h3 { color:#fff1df; }
.season-card p { color:#bdacb7; }
.season-reward { color:#ffe1b1;border-color:#f0c68145;background:linear-gradient(120deg,#d5a25b18,#e9c38b08); }
.season-reward>span { color:#f9d391; }
.season-coming { color:#c1a986; }
.season-orbit { border-color:#ecc78426;box-shadow:0 0 0 18px #e9bf7504,0 0 0 19px #e9bf7510; }
.commission-envelope { border-color:#efcc9870;background:linear-gradient(150deg,#ac7e50,#563e3a);box-shadow:0 20px 35px #0005,inset 0 1px 0 #ffe3ba50; }
.commission-envelope::before,.commission-envelope::after { background:linear-gradient(36deg,transparent 49.5%,#ffe1b138 50%,transparent 50.5%); }
.envelope-fold { background:linear-gradient(160deg,#e0b87c,#946846); }
.season-spark { color:#ffe0a3; }.spark-two { color:#c5adff; }
body:not(.is-chat) .home-journey { background:linear-gradient(120deg,#142338a3,#161c2cba);border-color:#adbbdf23; }
.home-journey strong { color:#dce4f2; }.home-journey p{color:#98a9c3}
.home-journey>div:nth-child(1)>span { color:#92dafa; }
.home-journey>div:nth-child(2)>span { color:#c5a9ff; }
.home-journey>div:nth-child(3)>span { color:#f1c893; }
.sample-card { background:radial-gradient(ellipse at 100% 0,#6ca5cd20,transparent 65%),linear-gradient(135deg,#152134ca,#111a29cc);border-color:#a5c6ec20; }
.sample-card::after { border-color:#8dc7ef23;box-shadow:0 0 0 17px #8dc7ef08,0 0 0 34px #8dc7ef05; }
.sample-item { background:#0d1625a3;border-color:#b0c0df18; }
.sample-card>p,.sample-kicker { color:#9fadc4; }
.beta-card { background:radial-gradient(ellipse at 100% 0,#cb8fa829,transparent 70%),linear-gradient(130deg,#302232cc,#1f1b2fcc);border-color:#d9a7c725; }
.beta-card strong { color:#ead7e4; }.beta-card>div:nth-child(2)>span{color:#b7a0b0}.beta-flower{color:#f0b9cd}

/* Light, material and elevation establish the console hierarchy. */
body:not(.is-chat) .hero-copy { background:radial-gradient(ellipse at 82% 22%,#6383c96b,transparent 50%),radial-gradient(ellipse at 8% 90%,#172d4340,transparent 55%),linear-gradient(135deg,#17243b,#111729 75%);border-color:#bad2f040;box-shadow:inset 0 1px 0 #e2edff25,inset 0 -1px 0 #0005,0 18px 36px #0005; }
.hero-copy::after { content:"";position:absolute;z-index:-1;pointer-events:none;inset:0;width:auto;height:auto;background:linear-gradient(120deg,#d5e6ff0b,transparent 35%,transparent 70%,#8ab9fc0b); }
.hero-record { background:repeating-radial-gradient(circle,#080e19 0 3px,#52678250 4px,#141f30 5px 7px);box-shadow:0 25px 30px #0007,0 0 40px #8baee624,inset 0 0 0 2px #bdd2ed35; }
.hero-record::before { content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 25deg,transparent 0 28deg,#dceaff28 42deg,transparent 70deg 195deg,#afc9ec20 225deg,transparent 255deg);pointer-events:none; }
.hero-record-label { position:relative;box-shadow:0 0 0 5px #0b15278c,0 0 0 6px #dbefa143,0 9px 25px #0007,inset 0 2px 4px #faffbf80; }
.hero-primary { background:linear-gradient(135deg,#effaff1f,#b7cbec09);box-shadow:inset 0 1px 0 #ffffff29,0 4px 12px #0003; }
.hero-secondary { background:#ffffff03; }
.hero-emblem { background:radial-gradient(ellipse at 50% 35%,#6084b229,transparent 58%),linear-gradient(145deg,#111b2cba,#080e19df);box-shadow:inset 0 1px 0 #d8e7ff12,0 12px 30px #0003; }
.quota-visual { filter:drop-shadow(0 6px 14px #0005); }
.hero-status-row { background:linear-gradient(145deg,#0e1522ad,#090e19db);box-shadow:inset 0 1px 0 #d8e7ff0c; }
.module-entry { background:linear-gradient(120deg,#ffffff07,#ffffff01);box-shadow:inset 0 1px 0 #ffffff0b,0 5px 12px #0002; }
.module-entry .module-symbol { box-shadow:inset 0 1px 0 #ffffff23,0 5px 12px #0004; }
.reward-card { box-shadow:inset 0 1px 0 #ffffff21,inset 0 -1px 0 #0004,0 14px 28px #0004; }
.achievement-card { background:radial-gradient(ellipse at 7% 3%,#9f72d956,transparent 48%),radial-gradient(ellipse at 90% 100%,#384b8d25,transparent 60%),linear-gradient(125deg,#28203bd9,#101323e8); }
.achievement-card::before { content:"";position:absolute;pointer-events:none;right:-60px;top:-85px;width:220px;height:220px;border:1px solid #d6b6ff13;border-radius:50%;box-shadow:0 0 0 24px #cfacff04,0 0 0 25px #cfacff0a,0 0 0 49px #cfacff03,0 0 0 50px #cfacff08; }
.achievement-badges { position:relative;padding:13px 0 8px;margin-top:13px; }
.achievement-medal { position:relative;width:54px;height:61px;background:linear-gradient(130deg,#edc9ffbd 0,#9365c4 35%,#483668 100%);filter:drop-shadow(0 7px 6px #0007);text-shadow:0 2px 3px #0005; }
.achievement-medal::after { content:"";position:absolute;inset:3px;clip-path:inherit;pointer-events:none;background:linear-gradient(145deg,#ffffff30,transparent 45%,#00000035);border-top:1px solid #ffffff7a; }
.achievement-badges>div:nth-child(2) .achievement-medal { background:linear-gradient(130deg,#c6f5ffb0,#528bad 38%,#283854); }
.achievement-badges>div:nth-child(3) .achievement-medal { background:linear-gradient(130deg,#ffecc5c9,#aa8050 38%,#4f382d); }
.season-card { background:radial-gradient(ellipse at 86% 38%,#d09c5352,transparent 47%),radial-gradient(ellipse at 0 100%,#72478e24,transparent 63%),linear-gradient(120deg,#292133e5,#171321ed 58%,#49382cc4);border-top-color:#f3d6a751; }
.season-art { transform:translateY(-50%) rotate(4deg); }
.season-art::after { content:"";position:absolute;bottom:19px;left:36px;width:130px;height:22px;border-radius:50%;background:#0009;filter:blur(10px); }
.commission-envelope { z-index:1;transform:rotate(-16deg);box-shadow:8px 20px 20px #0008,inset 0 2px 0 #ffdfaa65,inset -2px -2px 0 #3b282950; }
.envelope-seal { box-shadow:0 5px 7px #0008,inset 0 2px 0 #ecffb3; }
.season-orbit { background:radial-gradient(ellipse,#ecc38511,transparent 66%);border-color:#ecc78420; }
.season-reward { box-shadow:inset 0 1px 0 #ffe3b820,0 4px 12px #0003; }
body:not(.is-chat) .home-journey { background:linear-gradient(120deg,#0d172580,#10142394);border-color:#afc7e519;box-shadow:inset 0 1px 0 #ffffff08; }
.home-journey>div { border-left:1px solid #9db5de20;padding-left:16px; }
.home-journey>div>span { font-size:20px;font-weight:300;letter-spacing:-.05em; }
.sample-card { box-shadow:inset 0 1px 0 #c9e7ff12,0 10px 25px #0003; }
@media(max-width:760px) { .home-journey>div{padding-left:12px}.season-art{transform:translateY(-50%)} }

/* Translucent glass, reflected edges and slowly passing light. */
body:not(.is-chat) .hero-copy,body:not(.is-chat) .hero-emblem,body:not(.is-chat) .hero-status-row,.reward-card,.sample-card {
 position:relative;isolation:isolate;overflow:hidden;backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);
 box-shadow:inset 0 1px 0 #ffffff35,inset 1px 0 0 #c8e2ff16,inset 0 -1px 0 #0005,0 18px 35px #0005,0 0 22px #9bbde509;
}
body:not(.is-chat) .hero-copy { background:radial-gradient(ellipse at 82% 22%,#87aef252,transparent 53%),linear-gradient(135deg,#2739569e,#10182cb5); }
.hero-copy::after { z-index:0;background:linear-gradient(115deg,transparent 20%,#d5e8ff04 33%,#e4f2ff23 39%,#d5e8ff08 44%,transparent 53%);transform:translateX(-110%);animation:glass-reflection 15s ease-in-out infinite; }
.hero-copy>.hero-kicker,.hero-copy>.hero-title,.hero-copy>.hero-tagline,.hero-copy>.hero-description,.hero-copy>.hero-actions { position:relative;z-index:2; }
.hero-copy>.hero-actions { position:absolute; }
.hero-copy>.hero-record { z-index:1; }
body:not(.is-chat) .hero-emblem { background:radial-gradient(ellipse at 20% 0,#a3d9ff25,transparent 55%),linear-gradient(145deg,#26395063,#0b122793); }
body:not(.is-chat) .hero-status-row { background:linear-gradient(145deg,#2932485c,#0a11278c); }
.hero-emblem::after,.hero-status-row::after,.reward-card::after,.sample-card::before { content:"";position:absolute;pointer-events:none;z-index:3;inset:-30%;border-radius:inherit;background:linear-gradient(115deg,transparent 28%,#ffffff03 38%,#e4edff16 43%,#ffffff03 48%,transparent 58%);transform:translateX(-115%);animation:glass-reflection 18s ease-in-out infinite; }
.hero-emblem::after { animation-delay:-7s; }.hero-status-row::after { animation-delay:-12s; }
.achievement-card::after { animation-duration:16s;animation-delay:-4s; }
.season-card::after { background:linear-gradient(115deg,transparent 28%,#ffe0b104 38%,#fff0d321 43%,#ffe0b104 48%,transparent 58%);animation-duration:19s;animation-delay:-10s; }
.sample-card::before { animation-delay:-6s; }
.achievement-card { background:radial-gradient(ellipse at 7% 3%,#c697f949,transparent 48%),linear-gradient(125deg,#49336180,#141b31a3); }
.season-card { background:radial-gradient(ellipse at 86% 38%,#f1c68943,transparent 50%),linear-gradient(120deg,#46334799,#191a3299 58%,#6a503975); }
.reward-card .reward-heading,.reward-card h2,.reward-card h3,.reward-card p,.achievement-badges,.reward-footnote { position:relative;z-index:1; }
.module-entry,.hero-primary,.hero-secondary,.season-reward { backdrop-filter:blur(12px);background-image:linear-gradient(135deg,#ffffff0e,#ffffff02 40%,#ffffff06);box-shadow:inset 0 1px 0 #ffffff2b,inset 1px 0 0 #ffffff0a,0 6px 18px #0003; }
.module-entry { transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; }
.module-entry:hover { transform:translateY(-2px);box-shadow:inset 0 1px 0 #ffffff40,0 10px 20px #0004; }
.hero-record::before { animation:vinyl-reflection 24s linear infinite; }
.season-art { animation:commission-drift 9s ease-in-out infinite; }
.cosmic-nebula { animation:nebula-drift 28s ease-in-out infinite alternate; }
.cosmic-nebula-violet { animation-delay:-14s; }
@keyframes glass-reflection { 0%,15%{transform:translateX(-115%);opacity:0} 25%{opacity:.7} 55%{transform:translateX(115%);opacity:.2} 65%,100%{transform:translateX(115%);opacity:0} }
@keyframes vinyl-reflection { from{transform:rotate(0)} to{transform:rotate(360deg)} }
@keyframes commission-drift { 0%,100%{transform:translateY(-50%) rotate(4deg)} 50%{transform:translateY(calc(-50% - 7px)) rotate(1deg)} }
@keyframes nebula-drift { from{transform:translate(-2%,2%) scale(.95)} to{transform:translate(4%,-4%) scale(1.12)} }
@media(prefers-reduced-motion:reduce) { .hero-copy::after,.hero-emblem::after,.hero-status-row::after,.reward-card::after,.sample-card::before,.hero-record::before,.season-art,.cosmic-nebula{animation:none}.hero-copy::after,.hero-emblem::after,.hero-status-row::after,.reward-card::after,.sample-card::before{transform:none;opacity:.35} }

/* Deeper smoked glass makes the reflective highlights visible. */
body:not(.is-chat) .hero-copy { background:radial-gradient(ellipse at 84% 16%,#6087cd33,transparent 53%),linear-gradient(135deg,#101a2bea,#060d1aeb); }
body:not(.is-chat) .hero-emblem { background:radial-gradient(ellipse at 20% 0,#77b5e522,transparent 55%),linear-gradient(145deg,#0b1423ed,#040a14ed); }
body:not(.is-chat) .hero-status-row { background:linear-gradient(145deg,#0c1220ed,#040915f2); }
.achievement-card { background:radial-gradient(ellipse at 5% 0,#925bd636,transparent 47%),linear-gradient(125deg,#1b1229ef,#080c19f0); }
.season-card { background:radial-gradient(ellipse at 88% 30%,#d6a45536,transparent 48%),linear-gradient(120deg,#1e1424f0,#0d0b1bf0 60%,#281b16eb); }
.sample-card { background:radial-gradient(ellipse at 100% 0,#4f9bce24,transparent 65%),linear-gradient(135deg,#0b1525ed,#050c18ef); }
.beta-card { background:radial-gradient(ellipse at 100% 0,#bf719825,transparent 70%),linear-gradient(130deg,#211222ed,#0e0b19ef);box-shadow:inset 0 1px 0 #eccae62c,0 12px 24px #0006; }
body:not(.is-chat) .home-journey { background:linear-gradient(120deg,#081220e8,#080c18ea);box-shadow:inset 0 1px 0 #cbdcfa18,0 12px 25px #0005; }
.plan-mini { background:radial-gradient(ellipse at 100% 0,#895ed328,transparent 65%),linear-gradient(135deg,#151329ef,#080e1aed); }
.module-entry { background:linear-gradient(135deg,#1c24317a,#050a16b3); }
body:not(.is-chat) .hero-copy,body:not(.is-chat) .hero-emblem,body:not(.is-chat) .hero-status-row,.reward-card,.sample-card { border-top-color:#edf4ff57;border-left-color:#c9dfff2e;border-right-color:#94b4e31e;border-bottom-color:#94b4e312;box-shadow:inset 0 1px 0 #ffffff28,inset 1px 0 0 #d9e8ff0c,inset 0 -2px 0 #0007,0 20px 38px #0008; }
.achievement-card { border-top-color:#dfc5ff63; }
.season-card { border-top-color:#ffe1ae63; }
.hero-copy::after { background:linear-gradient(115deg,transparent 20%,#d5e8ff05 33%,#e4f2ff32 39%,#d5e8ff0c 44%,transparent 53%); }
.hero-emblem::after,.hero-status-row::after,.reward-card::after,.sample-card::before { background:linear-gradient(115deg,transparent 28%,#ffffff05 38%,#e4edff27 43%,#ffffff05 48%,transparent 58%); }
.season-card::after { background:linear-gradient(115deg,transparent 28%,#ffe0b106 38%,#fff0d334 43%,#ffe0b106 48%,transparent 58%); }

/* Frosted material needs translucent surfaces over a visible backdrop. */
.cosmic-backdrop { background:radial-gradient(ellipse at 82% 70%,#66517970 0,transparent 45%),radial-gradient(ellipse at 30% 24%,#31587880 0,transparent 42%),radial-gradient(ellipse at 66% 35%,#35446750 0,transparent 32%),#050810; }
body:not(.is-chat) .hero-copy,body:not(.is-chat) .hero-emblem,body:not(.is-chat) .hero-status-row,.reward-card,.sample-card {
 backdrop-filter:blur(34px) saturate(135%);-webkit-backdrop-filter:blur(34px) saturate(135%);
 background-image:var(--frost-tint),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.12' filter='url(%23n)'/%3E%3C/svg%3E");
 background-size:auto,160px 160px;background-blend-mode:normal,soft-light;
 border-top-color:#edf4ff45;border-left-color:#cadfff2e;border-right-color:#c5d8f421;border-bottom-color:#c5d8f417;
 box-shadow:inset 0 1px 0 #ffffff22,inset 0 0 28px #d3e3ff05,0 18px 35px #0006;
}
body:not(.is-chat) .hero-copy { --frost-tint:linear-gradient(135deg,#32456291,#0b1428a3);background-color:#13213733; }
body:not(.is-chat) .hero-emblem { --frost-tint:linear-gradient(145deg,#25374b85,#0a13269c);background-color:#101b2833; }
body:not(.is-chat) .hero-status-row { --frost-tint:linear-gradient(145deg,#2a304885,#0d13299c);background-color:#10162533; }
.achievement-card { --frost-tint:linear-gradient(125deg,#573d7087,#17142c96);background-color:#25133233; }
.season-card { --frost-tint:linear-gradient(120deg,#4d354c87,#1c183396 55%,#7056377d);background-color:#26182933; }
.sample-card { --frost-tint:linear-gradient(135deg,#223b5587,#10192e96);background-color:#101c2b33; }
.module-entry { background:linear-gradient(135deg,#c0d5ee0c,#080f263d);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px); }
.hero-copy::after,.hero-emblem::after,.hero-status-row::after,.reward-card::after,.sample-card::before { filter:blur(5px); }

/* A separate front pane sits above the artwork rather than behind it. */
.glass-cover { position:absolute;z-index:8;inset:0;pointer-events:none;border-radius:inherit;border:1px solid #e6f3ff45;overflow:hidden;
 background:linear-gradient(155deg,#e6f3ff17 0,#c9dcf809 24%,transparent 48%,#9eb7e705 72%,#d9e9ff0b 100%);
 box-shadow:inset 0 2px 1px #ffffff30,inset 2px 0 2px #dceaff14,inset 0 -3px 3px #0007,inset -2px 0 2px #0004;
 backdrop-filter:blur(.45px);-webkit-backdrop-filter:blur(.45px);
}
.glass-cover::before { content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 0 43%,#ffffff03 44%,#eaf5ff20 48%,#ffffff09 53%,transparent 59%),linear-gradient(180deg,#e1edff0d,transparent 28%); }
.glass-cover::after { content:"";position:absolute;left:5%;right:5%;top:0;height:1px;background:linear-gradient(90deg,transparent,#ffffff9c 25%,#e5f0ff50 70%,transparent);box-shadow:0 1px 7px #daeaff30; }
.hero-copy .glass-cover { background:linear-gradient(155deg,#e9f6ff20,#d4e9ff0a 27%,transparent 54%,#b6d4ff06); }
.hero-copy .glass-cover::before { background:linear-gradient(115deg,transparent 0 49%,#ffffff04 50%,#eff7ff21 55%,#ffffff09 60%,transparent 66%); }
.achievement-card .glass-cover { border-color:#ecd9ff43;background:linear-gradient(155deg,#efdeff1d,#d5baff07 35%,transparent 60%,#dacaff08); }
.season-card .glass-cover { border-color:#ffebcd43;background:linear-gradient(155deg,#fff2db19,#ffe8d107 35%,transparent 60%,#ebd8ff08); }
.season-card .glass-cover::before { background:linear-gradient(115deg,transparent 0 48%,#fff9ed04 49%,#fff1db21 54%,#fff7eb09 60%,transparent 66%); }
.hero-emblem .glass-cover::before { background:linear-gradient(115deg,transparent 0 20%,#eff8ff1a 32%,transparent 50%); }
.hero-status-row .glass-cover::before { background:linear-gradient(115deg,transparent 0 35%,#edf7ff15 48%,transparent 65%); }

/* Imagegen concept: aurora glass, crystalline icons and warm commission light. */
.studio-icon { display:block;width:22px;height:22px;flex-shrink:0; }
.nav-icon .studio-icon { width:18px;height:18px; }
.module-symbol .studio-icon { width:27px;height:27px; }
.achievement-medal .studio-icon { width:32px;height:32px;stroke-width:1.4; }
.season-reward .studio-icon { width:21px;height:21px; }
.cosmic-backdrop { background:radial-gradient(ellipse at 73% 70%,#68549448,transparent 48%),radial-gradient(ellipse at 29% 27%,#28789049,transparent 43%),#050b16; }
body:not(.is-chat) .hero-copy { --frost-tint:radial-gradient(ellipse at 72% 28%,#208fa267,transparent 45%),linear-gradient(130deg,#183b5ead,#061327c7);border-color:#9fdcfa70; }
.hero-copy .glass-cover { border-color:#a3eaff67;box-shadow:inset 0 1px 1px #e8fcff6b,inset 0 -1px 0 #78e8f74d; }
.hero-record { background:repeating-radial-gradient(circle,#050c16 0 2px,#9bacbc40 3px,#0b1824 4px 6px);box-shadow:0 0 0 1px #8ec7e9aa,0 0 0 4px #051423,0 0 0 5px #8db4ff80,0 0 20px #74d5ed48,0 18px 25px #0008; }
.hero-record::before { background:conic-gradient(from 25deg,transparent 0 22deg,#eaf7ff50 35deg,transparent 65deg 165deg,#9bceff45 205deg,transparent 240deg); }
.hero-record-label { box-shadow:0 0 0 4px #030e16,0 0 0 5px #e4ffae59,0 10px 20px #0008; }
.hero-primary { background:#cefa68;color:#17241b;border:1px solid #ebffab;box-shadow:0 0 18px #cefa6838,inset 0 1px 0 #ffffff70;border-radius:24px;font-weight:600; }
.hero-primary:hover { background:#d9ff87; }
.hero-secondary { border-color:#acbafa70;background:linear-gradient(135deg,#afbbed15,#121d382e);border-radius:24px; }
body:not(.is-chat) .hero-emblem { --frost-tint:radial-gradient(ellipse at 0 0,#7fbcf64a,transparent 47%),linear-gradient(145deg,#18314797,#080f20bf);border-color:#c0dfff53; }
body:not(.is-chat) .hero-status-row { --frost-tint:radial-gradient(ellipse at 0 0,#9867d933,transparent 60%),linear-gradient(145deg,#2834488a,#101424af);border-color:#d0bfff5c; }
.module-entry:nth-of-type(1) { --module-accent:#b4c7ff;border-color:#a8bcff64;background:linear-gradient(125deg,#8097d927,#24274738); }
.module-entry:nth-of-type(2) { --module-accent:#7bd4ff;border-color:#7cd5f85c;background:linear-gradient(125deg,#539bc727,#162a4238); }
.module-entry:nth-of-type(3) { --module-accent:#eba6df;border-color:#edb2de64;background:linear-gradient(125deg,#b673aa27,#39233938); }
.module-entry .module-symbol { width:43px;height:43px;box-shadow:inset 0 1px 0 #ffffff50,0 0 12px color-mix(in srgb,var(--module-accent) 14%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--module-accent) 25%,transparent),#10162b66);border-radius:13px; }
.achievement-card { --frost-tint:radial-gradient(ellipse at 5% 0,#9a64ee65,transparent 55%),linear-gradient(125deg,#342c6a9c,#14152baa);border-color:#cda7ff70; }
.achievement-card .glass-cover { border-color:#dec8ff6b;box-shadow:inset 0 1px 1px #f2e9ff65,inset 0 -1px 0 #b28aff55; }
.achievement-card::before { border-color:#caadfa28;box-shadow:0 0 0 24px #b783f909,0 0 0 25px #d4baff12,0 0 0 49px #bf85ff04,0 0 0 50px #d4baff0c; }
.achievement-badges { gap:30px; }
.achievement-badges>div { position:relative; }
.achievement-badges>div::before { content:"";position:absolute;top:49px;width:71px;height:16px;border:1px solid #b792ef50;border-radius:50%;background:#ae7aef0c;box-shadow:0 0 14px #b486ef26; }
.achievement-badges>div:nth-child(1)::before { border-color:#8bd5ff55; }
.achievement-badges>div:nth-child(3)::before { border-color:#ffc38355; }
.achievement-medal { width:60px;height:66px;color:#abebff;background:linear-gradient(140deg,#d2f4ffbd,#619ace66 35%,#21405b88 65%,#99e5faaa);filter:drop-shadow(0 0 7px #77cafe44); }
.achievement-badges>div:nth-child(2) .achievement-medal { color:#efbbff;background:linear-gradient(140deg,#e8cdffc9,#9e60c966 35%,#3c225b88 65%,#d2a0ffbb);filter:drop-shadow(0 0 7px #bd77f344); }
.achievement-badges>div:nth-child(3) .achievement-medal { color:#ffe7b8;background:linear-gradient(140deg,#ffe9b9c9,#c9905866 35%,#5b352288 65%,#ffcb8abb);filter:drop-shadow(0 0 7px #eaa56744); }
.achievement-medal::after { inset:4px;background:linear-gradient(135deg,#ffffff40,transparent 35%,#07122738 65%,#ffffff14);border:1px solid #effaff88; }
.season-card { --frost-tint:radial-gradient(ellipse at 98% 5%,#f8b56961,transparent 50%),linear-gradient(120deg,#614130aa,#211a26b3 55%,#73462ba3);border-color:#f2bf8470; }
.season-card .glass-cover { border-color:#f3cd9b70;box-shadow:inset 0 1px 1px #fff2cd70,inset 0 -1px 0 #e8a66855; }
.season-reward { color:#ffe8c6;background:linear-gradient(130deg,#d3995740,#67402730);border-color:#ffd29a80;box-shadow:inset 0 1px 0 #fff4db40,0 0 14px #f8ae5420; }
.season-orbit { transform:rotate(-28deg) scaleY(.65);border:1px solid #ffcf8b9c;box-shadow:0 0 12px #ffd39540,0 0 0 18px #e9bf7503,0 0 0 19px #e9bf7510; }
.commission-envelope { background:linear-gradient(150deg,#c68e4f,#614132);border-color:#ffe0af;box-shadow:0 0 16px #ffca6c33,8px 20px 20px #0007,inset 0 2px 0 #fff2cd90; }
.envelope-fold { background:linear-gradient(145deg,#ffe2a3,#b77a41); }
body:not(.is-chat) .home-journey { background:linear-gradient(130deg,#18304a79,#151d378c);border-color:#b1c8ff55;box-shadow:inset 0 1px 0 #e2edff2b,0 10px 30px #0004; }
.home-journey>div { position:relative;padding-left:59px;min-height:75px;border:0; }
.home-journey .journey-icon { position:absolute;left:0;top:0;display:grid;place-items:center;width:45px;height:52px;font-size:initial;border:1px solid #a2c8ff60;border-radius:14px;background:linear-gradient(145deg,#9bbafb17,#1b315728);color:#a1d2ff;box-shadow:inset 0 1px 0 #e2edff2b; }
.home-journey .journey-icon .studio-icon { width:27px;height:27px; }
.home-journey>div:nth-child(2) .journey-icon { color:#b1baff; }.home-journey>div:nth-child(3) .journey-icon{color:#c5bfff}
.home-journey>div>span:not(.journey-icon){font-size:14px;letter-spacing:0}
@media(max-width:760px) { .home-journey>div{padding-left:59px}.achievement-badges{gap:24px} }

body:not(.is-chat) .hero-copy,body:not(.is-chat) .hero-emblem,body:not(.is-chat) .hero-status-row,.reward-card,.sample-card { background-size:100% 100%;background-repeat:no-repeat; }

/* Keep typography sharp: front reflections must not blur card contents. */
.glass-cover { backdrop-filter:none;-webkit-backdrop-filter:none;z-index:2; }
.hero-copy>.hero-kicker,.hero-copy>.hero-title,.hero-copy>.hero-tagline,.hero-copy>.hero-description,.hero-copy>.hero-actions { z-index:9; }
.hero-creator-badge,.quota-center,.hero-emblem-caption,.module-launcher>.eyebrow,.module-entry,.reward-heading,.reward-card h2,.reward-card h3,.reward-card p,.achievement-badges,.reward-footnote,.season-copy { position:relative;z-index:9; }
.hero-creator-badge { position:absolute; }
.hero-emblem-caption { position:absolute; }
.hero-emblem::after,.hero-status-row::after,.reward-card::after,.sample-card::before { z-index:2; }
.module-entry { backdrop-filter:none;-webkit-backdrop-filter:none; }
.quota-center { position:absolute; } .hero-emblem-caption { position:relative;inset:auto; }

/* Clear glass: remove frost grain and haze while retaining reflections. */
body:not(.is-chat) .hero-copy,body:not(.is-chat) .hero-emblem,body:not(.is-chat) .hero-status-row,.reward-card,.sample-card {
 background-image:var(--frost-tint);background-size:100% 100%;background-repeat:no-repeat;background-blend-mode:normal;
 backdrop-filter:none;-webkit-backdrop-filter:none;
}
.glass-cover { backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(155deg,#eaf5ff06,transparent 35%,transparent 70%,#cbe3ff04); }
.hero-copy .glass-cover,.achievement-card .glass-cover,.season-card .glass-cover { background:linear-gradient(155deg,#ffffff07,transparent 40%,#ffffff02); }
.hero-copy .glass-cover::before,.glass-cover::before,.hero-emblem .glass-cover::before,.hero-status-row .glass-cover::before,.season-card .glass-cover::before { background:linear-gradient(115deg,transparent 0 48%,#ffffff02 50%,#eef8ff12 55%,#ffffff03 60%,transparent 66%); }
.module-entry,.hero-primary,.hero-secondary,.season-reward { backdrop-filter:none;-webkit-backdrop-filter:none; }

/* Locally bundled commercial-use pixel typography and Pixelarticons. */
@font-face { font-family:"Hengchui Pixel";src:url("/Hengchui/studio/assets/pixel/fonts/fusion-pixel-latin.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap;unicode-range:U+0000-024F,U+1E00-1EFF,U+2000-206F,U+20A0-20CF,U+2100-214F; }
@font-face { font-family:"Hengchui Pixel";src:url("/Hengchui/studio/assets/pixel/fonts/fusion-pixel-zh-hans.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap;unicode-range:U+2E80-2EFF,U+3000-303F,U+31C0-31EF,U+3400-4DBF,U+4E00-9FFF,U+F900-FAFF,U+FE30-FE4F,U+FF00-FFEF; }
:root { --sans:"Hengchui Pixel","Segoe UI","DengXian","PingFang SC",sans-serif;--mono:"Hengchui Pixel","Consolas","DengXian",monospace; }
body,body * { font-family:"Hengchui Pixel","Segoe UI","DengXian","PingFang SC",sans-serif !important;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision; }
.studio-icon { display:none !important; }
.pixel-glyph { display:inline-block;width:20px;height:20px;flex:0 0 auto;background:currentColor;mask:var(--pixel-icon) center/contain no-repeat;-webkit-mask:var(--pixel-icon) center/contain no-repeat;image-rendering:pixelated; }
.nav-icon .pixel-glyph { width:19px;height:19px; }
.module-symbol .pixel-glyph { width:25px;height:25px; }
.achievement-medal .pixel-glyph { width:33px;height:33px; }
.season-reward .pixel-glyph { width:21px;height:21px;vertical-align:middle; }
.journey-icon .pixel-glyph { width:27px;height:27px; }
.eyebrow,.nav-caption,.plan-mini .eyebrow,.version-note { font-size:12px;letter-spacing:.06em; }
@media(max-width:760px) { .pixel-glyph { width:18px;height:18px }.nav-icon .pixel-glyph { width:17px;height:17px } }

/* Clear glass navigation: crisp labels, transparent faces, and a restrained edge reflection. */
.sidebar .main-nav .nav-item {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid #a9c2e02e;
  border-radius:14px;
  background:linear-gradient(135deg,#a8c1e013,#859cb70d 58%,#ffffff09);
  box-shadow:inset 0 1px 0 #ffffff10,inset 0 -1px 0 #a9c3df09,0 4px 13px #0003;
  transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.sidebar .main-nav .nav-item > * { position:relative;z-index:1; }
.sidebar .main-nav .nav-item::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:1px;
  border-radius:inherit;
  background:linear-gradient(118deg,#f2f8ff24 0%,#dceaff13 27%,transparent 49%),linear-gradient(110deg,transparent 34%,#e6f4ff18 50%,transparent 66%);
  opacity:.42;
  pointer-events:none;
  transition:opacity .2s ease;
}
.sidebar .main-nav .nav-item:hover {
  border-color:#c5d9f064;
  background:linear-gradient(135deg,#b9cce333,#849ab421 58%,#ffffff10);
  box-shadow:inset 0 1px 0 #ffffff24,inset 0 -1px 0 #c8dcf016,0 5px 16px #0005;
}
.sidebar .main-nav .nav-item:hover::before { opacity:1; }
.sidebar .main-nav .nav-item.is-active {
  border-color:#d3e4f078;
  background:linear-gradient(135deg,#b9cce348 0%,#95acc035 43%,#ffffff19 100%);
  color:#f1f5fc;
  box-shadow:inset 0 1px 0 #ffffff44,inset 0 -1px 0 #d8e7f026,0 8px 24px #0006,0 0 20px #9fc7f022;
}
.sidebar .main-nav .nav-item.is-active::before { opacity:1; }
.sidebar .main-nav .nav-item.is-active .nav-icon {
  border:1px solid #e5f4ff25;
  box-shadow:inset 0 1px 0 #ffffff24,0 3px 12px #0002,0 0 15px #cefa6818;
}
@media(prefers-reduced-motion:reduce) {
  .sidebar .main-nav .nav-item,.sidebar .main-nav .nav-item::before { transition:none; }
}

/* Season 01 reads as a nautical quest launch instead of a monochrome promo card. */
.season-card { border-color:#7bcfdd58;background:radial-gradient(ellipse at 85% 12%,#f4bd6b36,transparent 39%),radial-gradient(ellipse at 2% 100%,#e9797850,transparent 54%),radial-gradient(ellipse at 53% 0,#51cee52a,transparent 68%),linear-gradient(118deg,#10364bc9,#1a263bcf 53%,#332742c9);box-shadow:inset 0 1px 0 #e5f8ff33,0 13px 38px #0107115c; }
.season-card::after { background:linear-gradient(112deg,transparent 25%,#76eaf109 39%,#fff0cc3b 45%,#8cebf20d 52%,transparent 66%); }
.season-card .glass-cover { border-color:#b5eafb69;box-shadow:inset 0 1px 1px #f2fdff4b,inset 0 -1px 0 #63d9e33f; }
.season-card .eyebrow { color:#a9e9f4; }
.season-card h2 { color:#90e7ee; }
.season-card h3 { color:#fff0d8; }
.season-card p { color:#c2ced7; }
.season-card .season-orbit { border-color:#f5cc9060;box-shadow:0 0 18px #f2c27c25,0 0 0 18px #5edbeb08,0 0 0 19px #95e9f01c,0 0 0 39px #c49efb08; }
.season-card .commission-envelope { border-color:#ffe3b8;background:linear-gradient(145deg,#d69755,#785043 65%,#403451);box-shadow:0 0 20px #ffc67735,8px 20px 22px #0008,inset 0 1px 0 #fff1d490; }
.season-card .envelope-fold { background:linear-gradient(150deg,#ffe4a8,#d19354 54%,#956346); }
.season-card .season-reward { color:#ffe3b0;border-color:#f8cb7977;background:linear-gradient(105deg,#e4ae5727,#e6d2860c 55%,#9d7bea1b);box-shadow:inset 0 1px 0 #fff6d536,0 0 20px #eeb45012; }
.season-card .season-reward>span { color:#ffd27d; }
.season-launch { position:relative;display:inline-flex;align-items:center;gap:10px;margin-top:13px;padding:8px 12px;border:1px solid #84e6eb78;border-radius:11px;background:linear-gradient(110deg,#2ac4d22b,#8880ed22 58%,#f2b86226);box-shadow:inset 0 1px 0 #f5ffff45,0 5px 18px #07101b3d;color:#eefbfc;text-decoration:none;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.season-launch:hover { transform:translateY(-2px);border-color:#bbf9f5;box-shadow:inset 0 1px 0 #fff8,0 8px 22px #08101f70,0 0 16px #51d9dd28; }
.season-launch-icon { display:grid;place-items:center;width:27px;height:27px;border:1px solid #f2cf8566;border-radius:8px;background:linear-gradient(145deg,#ffd68130,#8d63c92a);color:#ffe0a2; }
.season-launch-icon .pixel-glyph { width:17px;height:17px; }
.season-launch>span:nth-child(2) { display:grid;gap:3px; }
.season-launch strong { color:#f3f8f0;font-size:12px;font-weight:400; }
.season-launch small { color:#a9c6cd;font-size:10px; }
.season-launch>b { margin-left:4px;color:#a8f2ed;font-size:15px;font-weight:400; }
@media(max-width:1100px) { .season-card .season-copy{max-width:82%}.season-card .season-art{right:-36px;opacity:.75} }
@media(max-width:900px) { .season-card .season-copy{max-width:77%}.season-card .season-art{right:2%;opacity:.88} }
@media(max-width:480px) { .season-card .season-copy{max-width:100%}.season-card .season-art{right:-70px;opacity:.25}.season-card .season-launch{padding:7px 9px}.season-card .season-reward{font-size:12px} }

/* A miniature voyage scene gives the season card the energy of game key art. */
.season-card .season-copy { max-width:68%; }
.season-card .season-art { width:min(47%,300px);height:278px;right:-1%;top:52%;z-index:0;transform:translateY(-50%);opacity:1;animation:sail-art-float 8s ease-in-out infinite; }
.season-card .season-art::after { bottom:5%;left:25%;width:62%;height:18px;border-radius:50%;background:#020b19a6;filter:blur(12px); }
.season-card .season-orbit { inset:8% 4%;border-color:#b4f6ed43;box-shadow:0 0 22px #50d7df22,0 0 0 17px #51d7ea0a,0 0 0 34px #eabd6d0b; }
.season-ship-promo { position:absolute;inset:-9% -8% -7% -9%;width:118%;height:118%;object-fit:contain;filter:drop-shadow(0 11px 16px #0209168a);animation:ship-key-art 4.2s ease-in-out infinite; }
.season-card .season-spark { z-index:1;text-shadow:0 0 13px currentColor; }
.season-card .spark-one { color:#fff0b6; }
.season-card .spark-two { color:#b9b4ff; }
.season-card .season-reward,.season-card .season-launch { display:flex;width:fit-content;max-width:100%;position:relative;z-index:2; }
.season-card .season-launch { margin-top:10px; }
@keyframes sail-art-float { 0%,100%{transform:translateY(-50%) rotate(1deg)}50%{transform:translateY(calc(-50% - 6px)) rotate(-1deg)} }
@keyframes ship-key-art { 0%,100%{transform:translateY(0) rotate(.3deg)}50%{transform:translateY(-4px) rotate(-.5deg)} }
@media(max-width:1100px) { .season-card .season-art{right:-5%;width:48%;opacity:.92}.season-card .season-copy{max-width:72%} }
@media(max-width:900px) { .season-card .season-art{right:0;width:43%;opacity:.95}.season-card .season-copy{max-width:72%} }
@media(max-width:560px) { .season-card .season-art{right:-7%;width:58%;opacity:.48}.season-card .season-copy{max-width:87%}.season-card .season-launch{position:relative;z-index:2} }
@media(prefers-reduced-motion:reduce) { .season-card .season-art,.season-ship-promo{animation:none} }

/* Focused Agent modules use their MCP action card as the only generation path. */
.agent-module-pill { padding:4px 8px;border:1px solid #a9c2e02b;border-radius:999px;background:linear-gradient(120deg,#a9c2e012,#ffffff05);color:#bfd4f4;font-size:11px;letter-spacing:.04em; }
.agent-attach[hidden] { display:none; }
body.is-chat.agent-module-sfx #agent-settings,
body.is-chat.agent-module-sfx .agent-draft-heading,
body.is-chat.agent-module-sfx #agent-draft-copy,
body.is-chat.agent-module-sfx .create-footer,
body.is-chat.agent-module-sfx .cost-preview,
body.is-chat.agent-module-npc_voice #agent-settings,
body.is-chat.agent-module-npc_voice .agent-draft-heading,
body.is-chat.agent-module-npc_voice #agent-draft-copy,
body.is-chat.agent-module-npc_voice .create-footer,
body.is-chat.agent-module-npc_voice .cost-preview { display:none !important; }

/* Keep module choice and its live catalog controls directly beneath Hengchui's welcome. */
.agent-module-picker { display:grid;gap:12px;margin-top:16px;max-width:780px; }
.agent-module-choices,.agent-option-chips { display:flex;flex-wrap:wrap;gap:8px; }
.agent-module-choices button,.agent-option-chip { min-height:36px;padding:8px 13px;border:1px solid #a9c2e02b;border-radius:10px;background:linear-gradient(145deg,#a9c2e00c,#ffffff04);color:#b9c9dd;font:inherit;font-size:13px;line-height:1.35;cursor:pointer;transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease; }
.agent-module-choices button:hover,.agent-option-chip:hover { transform:translateY(-1px);border-color:#cffa6870;color:#e9f1de;background:#cffa6810; }
.agent-module-choices button.is-active { border-color:#cffa687a;color:#d8ff79;background:linear-gradient(130deg,#cffa681b,#b9eaff0b);box-shadow:inset 0 1px #ffffff12,0 5px 18px #0002; }
.agent-module-options { display:grid;gap:12px;padding:12px 13px;border:1px solid #b4cce01c;border-radius:13px;background:linear-gradient(145deg,#bfd5f00a,#ffffff03); }
.agent-module-options[hidden] { display:none; }
.agent-options-note,.agent-options-empty { margin:0;color:#8fa1b8;font-size:12px;line-height:1.6; }
.agent-option-group { display:grid;gap:7px; }
.agent-option-heading { color:#abbdd3;font-size:12px;font-weight:600;letter-spacing:.025em; }
.agent-option-chip { min-height:30px;padding:6px 10px;border-radius:999px;color:#9bacc1;font-size:12px; }
.agent-option-chip.is-selected { border-color:#cffa6885;background:linear-gradient(125deg,#cffa681e,#99dfff12);color:#ddff91;box-shadow:inset 0 1px #ffffff12; }
.npc-action-details { display:grid;gap:7px;margin:10px 0;padding:10px 12px;border:1px solid #ffffff16;border-radius:11px;background:#ffffff05; }
.npc-action-details>div { display:grid;grid-template-columns:minmax(84px,120px) minmax(0,1fr);gap:10px;align-items:start;font-size:13px;line-height:1.55; }
.npc-action-details dt { color:#9cacb7; }
.npc-action-details dd { margin:0;color:#e0e8dc;white-space:pre-wrap;overflow-wrap:anywhere; }
.task-management-result { display:grid;gap:7px;margin-top:12px;padding:12px 14px;border:1px solid #ffffff18;border-radius:12px;background:linear-gradient(145deg,#ffffff0b,#ffffff03);color:#ccd5d0;font-size:13px; }
.task-management-result>strong { color:#d8ff79;font-size:14px; }
.task-management-result ul { display:grid;gap:5px;margin:2px 0 0;padding-left:18px; }
.agent-module-choices button:focus-visible,.agent-option-chip:focus-visible { outline:2px solid #d4ff77;outline-offset:2px; }
@media(max-width:760px) { .agent-module-picker{gap:10px;margin-top:12px}.agent-module-choices button{padding:8px 10px;font-size:12px}.agent-module-options{padding:10px}.agent-option-chip{font-size:11px} }

/* A neutral glass rail keeps task cards readable without another block of green. */
.chat-results-rail { display:none; }
body.is-chat .chat-workspace.is-visible { display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,282px);grid-template-rows:minmax(0,1fr);column-gap:18px;position:relative;overflow:hidden; }
body.is-chat .chat-workspace.is-visible .composer-surface { grid-column:1;grid-row:1;width:auto;min-width:0; }
body.is-chat .chat-workspace .agent-fixed-tools { flex:0 0 auto;width:100%;min-height:0;max-height:min(34vh,320px);overflow-y:auto;padding:0 0 10px;border-bottom:1px solid #ffffff18;scrollbar-width:thin;scrollbar-color:#ffffff32 transparent;overscroll-behavior:contain; }
body.is-chat .chat-workspace .agent-module-picker { width:100%;max-width:none;margin:0;gap:10px; }
body.is-chat .chat-workspace.is-visible .chat-results-rail:not([hidden]) { display:block;position:relative;grid-column:2;grid-row:1;min-width:0;width:auto;min-height:0;margin:68px 14px 14px 0;overflow-y:auto;padding:14px 11px 18px 14px;border:1px solid #ffffff18;border-radius:18px;background:linear-gradient(155deg,#ffffff0c,#ffffff04 48%,#00000016);box-shadow:0 18px 50px #0003,inset 0 1px #ffffff12;backdrop-filter:blur(24px) saturate(125%);-webkit-backdrop-filter:blur(24px) saturate(125%);scrollbar-width:thin;scrollbar-color:#ffffff32 transparent; }
body.is-chat .chat-results-rail .chat-task-panel { display:block;max-height:none;overflow:visible;border:0;padding:0; }
body.is-chat .chat-results-rail .rail-heading { display:grid;gap:9px;padding:3px 3px 14px;border-bottom:1px solid #ffffff16; }
body.is-chat .chat-results-rail .rail-heading>div { min-width:0; }
body.is-chat .chat-results-rail #plan-task-heading { display:block;overflow-wrap:anywhere;font-size:14px;line-height:1.55;color:#f0f3f7; }
body.is-chat .chat-results-rail .text-action { justify-self:start;padding:0;color:#d0d7e0;font-size:12px; }
body.is-chat .chat-results-rail .text-action:hover,.chat-results-rail .mini-task-open:hover { color:#ffffff; }
body.is-chat .chat-results-rail .mini-task-list { gap:10px;margin-top:13px; }
body.is-chat .chat-results-rail .mini-task-filters { gap:6px;margin-top:12px; }
body.is-chat .chat-results-rail .mini-task-filter { min-height:29px;padding:6px 8px;border-color:#ffffff1a;background:#ffffff06;color:#c4ccd6;font-size:11px; }
body.is-chat .chat-results-rail .mini-task-filter span { color:#9da8b5; }
body.is-chat .chat-results-rail .mini-task-filter:hover { border-color:#ffffff38;color:#ffffff; }
body.is-chat .chat-results-rail .mini-task-filter.is-selected { border-color:#cefa6870;background:#cefa6812;color:#e4ffa0; }
body.is-chat .chat-results-rail .mini-task-filter.is-selected span { color:#d5f58e; }
body.is-chat .chat-results-rail .mini-task { padding:12px 11px;border:1px solid #ffffff16;border-radius:13px;background:linear-gradient(145deg,#ffffff0b,#ffffff04 56%,#0000000c);box-shadow:inset 0 1px #ffffff08;transition:background .18s ease,border-color .18s ease,transform .18s ease; }
body.is-chat .chat-results-rail .mini-task:hover { border-color:#ffffff2c;background:linear-gradient(145deg,#ffffff10,#ffffff05 56%,#0000000b); }
body.is-chat .chat-results-rail .mini-task[open] { border-color:#ffffff30; }
body.is-chat .chat-results-rail .mini-task-summary { grid-template-columns:minmax(0,1fr) auto;gap:8px 7px; }
body.is-chat .chat-results-rail .mini-task-title { white-space:normal;overflow-wrap:anywhere;font-size:13px;line-height:1.5;color:#eef1f5; }
body.is-chat .chat-results-rail .task-status { justify-self:end;padding:4px 7px;border:1px solid #ffffff20;border-radius:999px;background:#ffffff08;color:#d7dee8;font-size:11px; }
body.is-chat .chat-results-rail .task-status.is-ready { border-color:#d9ff7960;background:#d9ff7914;color:#e4ffa0; }
body.is-chat .chat-results-rail .task-status.is-failed { border-color:#ffb3a34f;background:#ffb3a30d;color:#ffc2b6; }
body.is-chat .chat-results-rail .mini-task-meta { grid-column:1/-1;color:#aeb7c4;font-size:11px; }
body.is-chat .chat-results-rail .mini-task-kind { margin-right:7px;padding:2px 6px;border-color:#ffffff22;color:#dce2e9;font-size:10px; }
body.is-chat .chat-results-rail .mini-task-kind-music { border-color:#8bd8a455;background:#8bd8a411;color:#b6e5c3; }
body.is-chat .chat-results-rail .mini-task-kind-sfx { border-color:#efbd7855;background:#efbd7811;color:#f0cc96; }
body.is-chat .chat-results-rail .mini-task-kind-npc_voice { border-color:#c2a3ff55;background:#c2a3ff11;color:#d6c3ff; }
body.is-chat .chat-results-rail .mini-task-result-count { grid-column:1/-1;color:#d1d8e1;font-size:12px; }
body.is-chat .chat-results-rail .mini-task-result-count::after { color:#bec7d2; }
body.is-chat .chat-results-rail .mini-task-body { gap:9px;margin-top:11px;padding-top:10px;border-color:#ffffff14; }
body.is-chat .chat-results-rail .mini-task-pending { color:#adb6c2;font-size:12px; }
body.is-chat .chat-results-rail .mini-task-result-list { gap:8px; }
body.is-chat .chat-results-rail .mini-task-result-list .result-card { padding:9px;border:1px solid #ffffff12;border-radius:10px;background:#0000001c; }
body.is-chat .chat-results-rail .mini-task-result-list .result-card strong { margin-bottom:7px;color:#e8edf3;font-size:12px;line-height:1.45; }
body.is-chat .chat-results-rail .mini-task-result-list .muted-inline { display:block;margin:0 0 6px;color:#9ea9b7;font-size:11px; }
body.is-chat .chat-results-rail .mini-task-result-list .result-card audio { display:block;width:100%;max-width:100%;min-width:0;height:34px;color-scheme:light; }
body.is-chat .chat-results-rail .mini-task-result-list .result-card audio::-webkit-media-controls-panel { background:#e8edf2; }
body.is-chat .chat-results-rail .download-button { margin-top:7px;padding:6px 9px;border:1px solid #ffffff24;border-radius:8px;background:#ffffff08;color:#edf1f5;font-size:12px; }
body.is-chat .chat-results-rail .download-button:hover { border-color:#ffffff46;background:#ffffff12; }
body.is-chat .chat-results-rail .mini-task-open { justify-self:start;padding:7px 0 2px;color:#cbd3de;font-size:12px; }
body.is-chat .chat-results-rail .empty-state { min-height:112px;align-content:center;padding:16px 11px;border:1px dashed #ffffff20;border-radius:12px;background:#ffffff04;color:#bdc6d2;text-align:left; }
body.is-chat .chat-results-rail .empty-state strong { color:#e1e6ec;font-size:13px; }
body.is-chat .chat-results-rail .empty-state span:last-child { max-width:none;color:#aab4c1;font-size:12px; }
body.is-chat .chat-results-rail .empty-orbit { color:#d7ff84; }
body:not(.is-chat) .chat-results-rail { display:none !important; }
@media(max-width:1100px) {
  body.is-chat .chat-workspace.is-visible { display:flex;flex-direction:column; }
  body.is-chat .chat-workspace .composer-surface { flex:1 1 auto;width:100%;height:auto;min-height:0; }
  body.is-chat .chat-workspace .agent-fixed-tools { max-height:min(30vh,280px); }
  body.is-chat .chat-workspace.is-visible .chat-results-rail:not([hidden]) { position:relative;inset:auto;flex:0 0 220px;width:auto;max-height:220px;margin:0 18px 12px;padding:12px;border:1px solid #ffffff18;border-radius:16px;background:linear-gradient(155deg,#ffffff0b,#ffffff03); }
  body.is-chat .chat-results-rail .mini-task-list { grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
}

/* Audio results use the Hengchui vinyl as a playable cover, in both task views. */
.result-grid { grid-template-columns:minmax(0,1fr); }
.result-card,
.chat-results-rail .mini-task-result-list .result-card {
  display:flex;align-items:center;gap:16px;min-width:0;padding:12px;
  border:1px solid #cefa6830;border-radius:14px;
  background:linear-gradient(115deg,#cefa6810,#a8c8870b 58%,#ffffff06);
  box-shadow:inset 0 1px #ffffff12;
}
.task-vinyl {
  position:relative;display:grid;place-items:center;flex:0 0 88px;width:88px;height:88px;
  overflow:hidden;border:0;border-radius:50%;background:transparent;
  box-shadow:0 0 0 3px #09110c,0 0 0 4px #cefa6842,0 8px 19px #0008;
}
.task-vinyl-grooves { position:absolute;inset:0;display:block;width:100%;height:100%;overflow:hidden;border-radius:50%; }
.task-vinyl-art { display:block;width:100%;height:100%;object-fit:contain;border-radius:50%; }
.task-vinyl-play {
  position:absolute;z-index:1;top:50%;left:50%;display:grid;place-items:center;width:26px;height:26px;padding:0;transform:translate(-50%,-50%);
  border:1px solid #efffc79e;border-radius:50%;background:#cefa68b8;color:#17241b;font-size:12px;text-shadow:0 1px 2px #ffffff70;box-shadow:0 2px 9px #0007,inset 0 1px #ffffff70;cursor:pointer;
  transition:background .18s ease,color .18s ease;
}
.task-vinyl-play:hover { background:#d9ff87;color:#17241b; }
.task-vinyl-duration {
  position:absolute;z-index:1;right:5px;bottom:5px;max-width:calc(100% - 10px);padding:2px 5px;overflow:hidden;
  border:1px solid #ffffff3b;border-radius:8px;background:#07110cde;color:#f1f7e9;
  font:10px/1.2 "Segoe UI",sans-serif;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;
}
.task-vinyl.is-playing .task-vinyl-grooves { animation:task-vinyl-spin 3s linear infinite; }
.task-vinyl.is-playing { box-shadow:0 0 0 3px #09110c,0 0 0 4px #cefa689c,0 0 22px #a4d95b5c,0 8px 19px #0008; }
.task-vinyl-unavailable { opacity:.55; }
.task-result-content { display:grid;flex:1;gap:7px;min-width:0; }
.task-result-content>strong { display:block;overflow:hidden;margin:0;color:#edf4e8;font-size:15px;font-weight:650;line-height:1.45;text-overflow:ellipsis;white-space:nowrap; }
.task-result-description { display:-webkit-box;overflow:hidden;color:#c0cdb7;font-size:13px;line-height:1.55;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2; }
.task-result-description.is-muted,.task-player-hint { color:#91a286;font-size:12px; }
.task-result-actions { display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0; }
.task-result-kind { color:#a9c28b;font-size:11px;letter-spacing:.04em; }
.task-result-actions .download-button { flex:0 0 auto;margin:0;padding:6px 9px;border-radius:8px; }
.task-preview-audio { display:none!important; }
.result-card.is-compact { gap:10px;padding:9px;border-radius:12px; }
.task-vinyl.is-compact { flex-basis:62px;width:62px;height:62px; }
.task-vinyl.is-compact .task-vinyl-play { width:20px;height:20px;font-size:10px; }
.task-vinyl.is-compact .task-vinyl-duration { right:2px;bottom:2px;padding:1px 3px;font-size:9px; }
.result-card.is-compact .task-result-content { gap:5px; }
.result-card.is-compact .task-result-content>strong { font-size:12px; }
.result-card.is-compact .task-result-description { font-size:11px;line-height:1.4;-webkit-line-clamp:2; }
.result-card.is-compact .task-result-kind { font-size:10px; }
.result-card.is-compact .task-result-actions .download-button { padding:4px 6px;font-size:10px; }
@keyframes task-vinyl-spin { to { transform:rotate(360deg); } }
@media(max-width:600px) {
  .result-card,.chat-results-rail .mini-task-result-list .result-card { gap:10px;padding:9px; }
  .task-vinyl { flex-basis:68px;width:68px;height:68px; }
  .task-result-content>strong { font-size:13px; }
  .task-result-description { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) { .task-vinyl.is-playing .task-vinyl-grooves { animation:none; } }

/* Return the full creation workspace to Hengchui's original forest and lime palette. */
body.is-chat {
  --bg:#070b09;
  --sidebar:#0a100d;
  --panel:#111912;
  --panel-raised:#17221a;
  --line:#d7edc522;
  --line-soft:#d7edc512;
  --text:#edf4e8;
  --muted:#a2b39a;
  --dim:#788675;
  --lime:#cefa68;
  --lime-soft:#d7fa9e;
  --blue:#b4c7a5;
  --coral:#e9a18a;
  --lilac:#c8c49a;
  --module-accent:#cefa68;
  --module-glow:#cefa6824;
  color-scheme:dark;
  background:#070a08;
}
body.is-chat .main-shell { background:transparent; }
body.is-chat .cosmic-backdrop { opacity:.68;background:radial-gradient(ellipse at 78% 76%,#192b1d 0,transparent 54%),radial-gradient(ellipse at 25% 35%,#14291c 0,transparent 48%),#030705; }
body.is-chat .cosmic-backdrop::before { background:radial-gradient(ellipse,#d9efca0c 0,#a4c99208 34%,transparent 72%); }
body.is-chat .cosmic-nebula-cyan { background:radial-gradient(ellipse,#91b95024,transparent 65%); }
body.is-chat .cosmic-nebula-violet { background:radial-gradient(ellipse,#83984c20,transparent 60%); }
body.is-chat .cosmic-star { --star-color:#e4f4ce !important; }
body.is-chat .cosmic-star.is-bright { box-shadow:0 0 5px var(--star-color),0 0 14px var(--star-color),0 0 28px #d5f39b36; }
body.is-chat .sidebar { background:linear-gradient(155deg,#0d1711f2,#090e0bf5 70%,#0b100cf7);border-right-color:#cefa6820; }
body.is-chat .topbar { background:#090f0bd9;border-bottom-color:#cefa681c; }
body.is-chat .brand-copy small,body.is-chat .nav-caption,body.is-chat .eyebrow,body.is-chat .breadcrumb,
body.is-chat .breadcrumb i,body.is-chat .engine-state { color:#94a58a; }
body.is-chat .breadcrumb strong,body.is-chat .account-button { color:#edf4e8; }
body.is-chat .brand-mark,body.is-chat .avatar,body.is-chat .agent-avatar { color:#17241b; }
body.is-chat .nav-item.is-active { border-color:#cefa6836;background:linear-gradient(135deg,#cefa681b,#cefa6808);color:#eff8e2; }
body.is-chat .nav-icon,body.is-chat .nav-item.is-active .nav-icon { color:#cefa68; }
body.is-chat .nav-count { background:#cefa6815;color:#cce9a5; }
body.is-chat .chat-project-heading.is-current { background:linear-gradient(135deg,#cefa6818,#cefa6806); }
body.is-chat .plan-tabs .chat-project-toggle,body.is-chat .plan-tabs .chat-conversation,
body.is-chat .plan-tabs button:not(.chat-project-toggle):not(.chat-project-add):not(.chat-project-delete) { color:#afbd9f;border-color:#d7edc522;background:#ffffff04; }
body.is-chat .plan-tabs .chat-conversation:hover,body.is-chat .plan-tabs .chat-conversation.is-active,
body.is-chat .plan-tabs button.is-active:not(.chat-project-toggle) { border-color:#cefa6860;background:linear-gradient(140deg,#cefa6818,#cefa6807);color:#e9f7d3; }
body.is-chat .plan-tabs .chat-project-add,body.is-chat #agent-new-chat { border-color:#cefa6830;background:#cefa6809;color:#d7efb4; }
body.is-chat .agent-module-pill { border-color:#cefa6838;background:#cefa680c;color:#d9edbb; }
body.is-chat .agent-module-choices button,body.is-chat .agent-option-chip { border-color:#d7edc522;background:linear-gradient(145deg,#ffffff09,#ffffff02);color:#b8c6ac; }
body.is-chat .agent-module-choices button:hover,body.is-chat .agent-option-chip:hover,
body.is-chat .agent-module-choices button.is-active,body.is-chat .agent-option-chip.is-selected { border-color:#cefa6870;background:linear-gradient(130deg,#cefa681c,#a6cb7910);color:#e2f7bf; }
body.is-chat .agent-module-options { border-color:#d7edc522;background:linear-gradient(145deg,#ffffff0a,#ffffff02); }
body.is-chat .agent-options-note,body.is-chat .agent-options-empty,body.is-chat .agent-option-heading { color:#b4c1aa; }
body.is-chat .agent-thread { scrollbar-color:#71884e transparent; }
body.is-chat .agent-message.is-user { border-color:#cefa6833;background:linear-gradient(145deg,#293a25,#1a291c); }
body.is-chat .agent-scene-plan-card,body.is-chat .agent-action-card { border-color:#cefa684d;background:linear-gradient(135deg,#cefa6817,#b2ca8710 48%,#ffffff05),#111a13e8; }
body.is-chat .agent-scene-plan-card::before { background:linear-gradient(90deg,transparent,#efffc899 22%,#b7d28a55 70%,transparent); }
body.is-chat .agent-scene-plan-card.is-complete { border-color:#cefa6870;background:linear-gradient(135deg,#cefa6824,#a7c77712 48%,#cefa680b),#111a13e8; }
body.is-chat .agent-input-box { border-color:#cefa6838;border-top-color:#cefa6860;background:linear-gradient(150deg,#21341f70,#0b140dcc); }
body.is-chat .agent-input-box:focus-within { border-color:#cefa6890; }
body.is-chat .agent-input-box textarea { color:#edf4e8; }
body.is-chat .agent-input-box textarea::placeholder,body.is-chat .agent-input-footer>span,
body.is-chat .agent-input-footer .agent-input-counter { color:#91a286; }
body.is-chat #agent-send { border-color:#e5ffac55;background:#cefa68;color:#192822; }
body.is-chat .chat-results-rail:not([hidden]) { border-color:#cefa6828;background:linear-gradient(155deg,#17231be8,#0d140fe8 52%,#090e0ce8);box-shadow:0 18px 50px #0005,inset 0 1px #ffffff12; }
body.is-chat .chat-results-rail .rail-heading { border-bottom-color:#cefa681c; }
body.is-chat .chat-results-rail #plan-task-heading,body.is-chat .chat-results-rail .mini-task-title,
body.is-chat .chat-results-rail .mini-task-result-list .result-card strong { color:#edf4e8; }
body.is-chat .chat-results-rail .text-action,body.is-chat .chat-results-rail .mini-task-open { color:#bad397; }
body.is-chat .chat-results-rail .mini-task { border-color:#d7edc51f;background:linear-gradient(145deg,#ffffff09,#ffffff02 56%,#0000000c); }
body.is-chat .chat-results-rail .mini-task:hover,body.is-chat .chat-results-rail .mini-task[open] { border-color:#cefa6845; }
body.is-chat .chat-results-rail .task-status { border-color:#d7edc522;background:#ffffff06;color:#bac6b1; }
body.is-chat .chat-results-rail .task-status.is-ready { border-color:#cefa6860;background:#cefa6814;color:#e4ffa0; }
body.is-chat .chat-results-rail .mini-task-meta,body.is-chat .chat-results-rail .mini-task-pending,
body.is-chat .chat-results-rail .mini-task-result-list .muted-inline { color:#9ca992; }
body.is-chat .chat-results-rail .download-button { border-color:#cefa6838;background:#cefa680b;color:#dcefbd; }
body.is-chat .chat-results-rail .download-button:hover { border-color:#cefa6870;background:#cefa6819; }
body.is-chat .chat-results-rail .empty-state { border-color:#d7edc530;background:#ffffff04;color:#c1cdb8; }
body.is-chat .chat-results-rail .empty-state strong,body.is-chat .chat-results-rail .empty-orbit { color:#dff5bd; }
body.is-chat button:focus-visible,body.is-chat a:focus-visible,body.is-chat input:focus-visible,
body.is-chat textarea:focus-visible,body.is-chat select:focus-visible { outline-color:#d9ff87; }

/* Keep completed agent actions readable after their controls are replaced. */
.agent-action-card.is-submitted { display:block;align-self:stretch;width:auto;max-width:calc(100% - 38px);min-width:0;margin:8px 0 18px 38px;padding:0;overflow:hidden; }
.agent-action-result { display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:12px;padding:16px 18px;min-width:0; }
.agent-action-result-icon { display:grid;place-items:center;width:34px;height:34px;border:1px solid #cefa6852;border-radius:11px;background:#cefa6816;color:#cefa68;font-size:18px;font-weight:700; }
.agent-action-result-copy { display:grid;gap:4px;min-width:0; }
.agent-action-result-copy strong { min-width:0;color:#e7f2d9;font-size:15px;line-height:1.45;font-weight:650;overflow-wrap:anywhere;word-break:normal; }
.agent-action-result-copy>span,.agent-action-result-copy small { display:block;min-width:0;color:#aec09f;font-size:13px;line-height:1.55;white-space:normal;overflow-wrap:anywhere;word-break:normal; }
.agent-action-result-copy small { color:#8fa284;font-size:12px; }
.agent-action-result-badge { justify-self:end;padding:6px 10px;border:1px solid #cefa6840;border-radius:999px;background:#cefa680d;color:#d9f3a7;font-size:12px;white-space:nowrap; }
@media(max-width:760px) {
  .agent-action-card.is-submitted { max-width:100%;margin-left:0; }
  .agent-action-result { grid-template-columns:32px minmax(0,1fr);gap:10px;padding:14px; }
  .agent-action-result-icon { width:30px;height:30px; }
  .agent-action-result-badge { grid-column:2;justify-self:start; }
}

/* The achievements and first-season experience unlock with V0.4. */
.reward-card.is-locked { border-color:#cffa6830; }
.reward-card.is-locked .reward-status { border-color:#cefa684d;background:#cefa680d;color:#d4ed9e; }
.season-card.is-locked .season-art { filter:saturate(.72); }
.season-card button.season-launch:disabled { opacity:.78;cursor:not-allowed;filter:saturate(.62);transform:none;box-shadow:inset 0 1px 0 #f5ffff26,0 5px 18px #07101b3d; }
.season-card button.season-launch:disabled:hover { transform:none;border-color:#84e6eb78;box-shadow:inset 0 1px 0 #f5ffff26,0 5px 18px #07101b3d; }

/* NPC voice is a form-driven configuration sheet; scene/SFX keep the agent composer. */
body.is-chat.agent-module-npc_voice #agent-thread,
body.is-chat.agent-module-npc_voice .agent-input-box,
body.is-chat.agent-module-npc_voice #agent-retry-row { display:none !important; }
body.is-chat.agent-module-npc_voice .agent-fixed-tools #loop-option { display:none !important; }
body.is-chat.agent-module-npc_voice .agent-form { width:min(100%,1320px); }
.npc-voice-form { flex:1;min-height:0;overflow:auto;padding:12px 8px 20px 0;scrollbar-width:thin;scrollbar-color:#71884e transparent; }
.npc-voice-form[hidden] { display:none !important; }
.npc-form-intro { display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 24px; }
.npc-form-intro h2 { margin:8px 0 6px;color:#edf4e8;font-size:clamp(24px,2.4vw,34px);line-height:1.2; }
.npc-form-intro p { margin:0;color:#91a68a;font-size:14px;line-height:1.7; }
.npc-form-step { color:#849a7d;font:11px/1.4 var(--mono);letter-spacing:.08em;white-space:nowrap; }
.npc-form-step b { display:inline-grid;place-items:center;width:27px;height:27px;margin-left:7px;border:1px solid #cefa6833;border-radius:9px;color:#d8ff79; }
.npc-form-modes { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 20px; }
.npc-form-modes button { display:grid;gap:6px;min-height:78px;padding:16px 19px;text-align:left;border:1px solid #b9d6a21c;border-radius:16px;background:linear-gradient(145deg,#b8ef940a,#06110b70);color:#e7f0dc;cursor:pointer;transition:border-color .18s,background .18s,transform .18s; }
.npc-form-modes button:hover { transform:translateY(-1px);border-color:#cefa6858; }
.npc-form-modes button[aria-pressed="true"] { border-color:#cefa6880;background:linear-gradient(130deg,#cefa681c,#b9eaff08);box-shadow:inset 3px 0 #cefa68; }
.npc-form-modes strong { font-size:17px; }
.npc-form-modes span { color:#91a68a;font-size:12px;line-height:1.5; }
.npc-form-grid { display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:16px;align-items:start; }
.npc-voice-create-card { grid-column:1/-1; }
.npc-form-card { min-width:0;padding:21px;border:1px solid #b9d6a21c;border-radius:20px;background:linear-gradient(150deg,#17251bdb,#09120de8);box-shadow:inset 0 1px #ffffff07; }
.npc-form-card[hidden] { display:none !important; }
.npc-form-card-title { display:flex;align-items:center;gap:12px;margin:0 0 21px; }
.npc-form-card-title>span { display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:11px;background:#cefa6814;color:#c9f677;font:600 12px var(--mono); }
.npc-form-card-title h3 { margin:0;color:#e7f0dc;font-size:18px; }
.npc-form-card-title p { margin:4px 0 0;color:#82967d;font-size:12px;line-height:1.5; }
.npc-field { display:grid;gap:8px;min-width:0;margin:0 0 17px;color:#a9bd9b;font-size:13px; }
.npc-field>span { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.npc-field>span i { font-style:normal;color:#74896e;font-size:11px; }
.npc-field input:not([type="range"]),.npc-field textarea,.npc-field select { width:100%;min-width:0;border:1px solid #b5d29527;border-radius:13px;background:#08120cba;color:#e5eddd;font:14px/1.65 var(--sans);outline:none; }
.npc-field input:not([type="range"]),.npc-field select { min-height:48px;padding:11px 13px; }
.npc-field textarea { min-height:88px;padding:12px 13px;resize:vertical; }
.npc-field textarea::placeholder,.npc-field input::placeholder { color:#687b67; }
.npc-field :is(input,textarea,select):focus { border-color:#cefa687c;box-shadow:0 0 0 3px #cefa680d; }
.npc-field small { color:#758970;font-size:11px;line-height:1.55; }
.npc-dialogue-count { justify-self:end;margin-top:-4px;font-variant-numeric:tabular-nums; }
.npc-select-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 13px; }
.npc-optimize-button { display:flex;align-items:center;gap:7px;min-height:39px;margin:-6px 0 17px auto;padding:8px 13px;border:1px solid #cefa6836;border-radius:11px;background:#cefa680a;color:#cbea9a;font:600 12px var(--sans);cursor:pointer; }
.npc-optimize-button:hover { border-color:#cefa6883;background:#cefa6816;color:#e2ffaf; }
.npc-optimize-button:disabled { opacity:.65;cursor:wait; }
.npc-fixed-preview { display:grid;gap:8px;margin:8px 0 18px;padding:16px;border:1px dashed #cefa6838;border-radius:14px;background:#cefa6808; }
.npc-fixed-preview>span,.npc-reference-upload small { color:#819579;font-size:11px; }
.npc-fixed-preview strong { color:#e5f4cc;font-size:18px;line-height:1.55; }
.npc-fixed-preview>small { color:#a5ba94;font-size:11px;line-height:1.55; }
.npc-reference-upload { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 14px;border:1px solid #b5d29520;border-radius:13px;background:#08120c73; }
.npc-reference-upload>div { display:grid;gap:4px;min-width:0; }
.npc-reference-upload strong { color:#c8d8bc;font-size:12px; }
.npc-reference-upload small { line-height:1.5; }
.npc-reference-upload button { flex:0 0 auto;padding:8px 11px;border:1px solid #cefa6840;border-radius:10px;background:#cefa680c;color:#d8f6a4;font:12px var(--sans);cursor:pointer; }
.npc-reference-upload button:hover { border-color:#cefa6880;background:#cefa6817; }
.npc-rate-field { margin:2px 0 16px; }
.npc-model-control-note { display:block;margin:-8px 0 16px;color:#7f9477;font-size:11px;line-height:1.55; }
.npc-rate-field output { color:#d5f596;font:600 13px var(--mono); }
.npc-rate-field input[type="range"] { width:100%;accent-color:#cafa68; }
.npc-performance-optimize { margin-top:-4px; }
.npc-form-footer { display:flex;align-items:center;justify-content:space-between;gap:22px;margin:18px 0 0;padding:18px 2px 2px;border-top:1px solid #ffffff12; }
.npc-form-footer>div { display:grid;gap:5px;min-width:0; }
.npc-form-footer strong { color:#c8d8bc;font-size:13px; }
.npc-form-footer small,.npc-form-footer #npc-form-status { color:#82967d;font-size:11px;line-height:1.5; }
.npc-form-footer #npc-form-status:not(:empty) { color:#d9f2a7; }
.npc-generate-button { min-width:180px;min-height:50px;padding:12px 22px;border:1px solid #cafa68;border-radius:14px;background:linear-gradient(135deg,#cafa68,#a9e853);color:#17220e;font:700 15px var(--sans);cursor:pointer;box-shadow:0 8px 25px #b0ee4e18; }
.npc-generate-button:hover { filter:brightness(1.06);transform:translateY(-1px); }
.npc-generate-button:disabled { opacity:.65;filter:saturate(.7);cursor:wait;transform:none; }
@media(max-width:1050px) { .npc-form-grid { grid-template-columns:minmax(0,1fr); }.npc-form-card { padding:18px; } }
@media(max-width:620px) { .npc-voice-form { padding-right:1px; }.npc-form-intro { align-items:flex-start; }.npc-form-step { display:none; }.npc-form-modes { gap:8px; }.npc-form-modes button { min-height:92px;padding:13px; }.npc-form-modes strong { font-size:15px; }.npc-form-modes span { font-size:11px; }.npc-select-grid { grid-template-columns:1fr; }.npc-form-footer { align-items:stretch;flex-direction:column;gap:14px; }.npc-generate-button { width:100%; }.npc-reference-upload { align-items:flex-start;flex-direction:column; }.npc-reference-upload button { width:100%; } }

/* Local form workspace: each conversation has one immutable creation type. */
body.is-chat #agent-module-choices,body.is-chat #agent-thread,body.is-chat .agent-input-box,body.is-chat #agent-retry-row {display:none!important}
body.is-chat.agent-module-scene_music .chat-workspace .chat-actions,body.is-chat.agent-module-scene_music .chat-workspace .create-footer {display:block!important}
body.is-chat.agent-module-scene_music #agent-settings {display:block!important;padding:28px;border:1px solid #71cbc555;background:#102321;border-radius:22px}
body.is-chat #agent-settings>summary,body.is-chat .agent-draft-heading,body.is-chat .agent-draft-copy {display:none!important}
body.is-chat.agent-module-scene_music .create-footer {display:flex!important;margin-top:20px}
#sfx-form {display:none;padding:28px;border:1px solid #d5b36766;border-radius:22px;background:#211e14}
body.is-chat.agent-module-sfx #sfx-form {display:block}
.creation-config-form .field-block {margin:22px 0}.creation-config-form input[type=number]{max-width:180px;padding:14px;border:1px solid #71653f;border-radius:12px;background:#13150e;color:#edf1df}
.config-form-actions{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap}
.chat-conversation{display:flex!important;align-items:center;gap:10px}.conversation-kind{font-size:10px;font-weight:800;letter-spacing:1px;padding:4px 6px;border-radius:5px;flex-shrink:0}
.chat-conversation.conversation-scene_music{border-color:#65c5c266;color:#d9f7f4;background:#152725}.conversation-scene_music .conversation-kind{color:#113b38;background:#a5e6df}
.chat-conversation.conversation-sfx{border-color:#c8a85f66;color:#f2e3bb;background:#282317}.conversation-sfx .conversation-kind{color:#43321a;background:#e5c887}
.chat-conversation.conversation-npc_voice{border-color:#b296d866;color:#e8dbfb;background:#251d30}.conversation-npc_voice .conversation-kind{color:#37264c;background:#d6b8f5}
.conversation-type-options{display:grid;gap:12px;margin:22px 0}.conversation-type-options label{display:grid;grid-template-columns:22px 1fr;gap:8px;padding:18px;border:1px solid #586346;border-radius:14px;cursor:pointer}.conversation-type-options small{grid-column:2;color:#aeb4a2}.conversation-type-options label:has(input:checked){border-color:#cbfa72;background:#29361b}.type-scene strong{color:#b7efe8}.type-sfx strong{color:#ecd19a}.type-npc strong{color:#dfc3fa}

body.is-chat.agent-module-scene_music #agent-module-options{display:none!important}
body.is-chat.agent-module-sfx #agent-module-options .agent-tag-options{display:none!important}

/* Single continuous form; retire the floating chat settings layout. */
body.is-chat.agent-module-scene_music .chat-workspace .chat-actions {
  display:block!important;position:relative;margin:18px 0;padding:28px;
  border:1px solid #76ccc766;border-radius:24px;background:linear-gradient(145deg,#142c29,#101f1d);
}
body.is-chat.agent-module-scene_music .chat-workspace #agent-settings[open] {
  position:static!important;inset:auto!important;width:auto!important;max-height:none!important;
  overflow:visible!important;padding:0!important;margin:0;border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;
}
body.is-chat.agent-module-scene_music .chat-workspace .create-footer {
  display:flex!important;align-items:center;justify-content:space-between;gap:18px;
  margin:24px 0 0!important;padding:22px 0 0!important;border-top:1px solid #87c3bf26;
}
body.is-chat .chat-workspace .agent-form {overflow-y:auto;justify-content:flex-start;gap:0;padding-bottom:24px}
body.is-chat.agent-module-scene_music #agent-fixed-tools {display:none!important}
body.is-chat #sfx-form .agent-fixed-tools {position:static;max-height:none;overflow:visible;margin:20px 0;padding:0;border:0}
body.is-chat #sfx-form .agent-module-options {max-height:none;overflow:visible}
body.is-chat #sfx-form .config-form-actions {margin-top:24px;padding-top:22px;border-top:1px solid #d5b36733}
body.is-chat .chat-workspace .create-button {min-height:48px;padding:12px 26px;font-size:16px;border-radius:13px}
body.is-chat .chat-workspace .cost-preview {display:flex;flex-wrap:wrap;font-size:14px;gap:10px}
body.is-chat .chat-workspace .cost-detail {display:inline;color:#9cae99}
body.is-chat .chat-workspace .mode-tabs {margin-bottom:24px}
body.is-chat .chat-workspace #standard-fields .loop-option {margin:20px 0}
body.is-chat .chat-workspace .prompt-block {margin-top:24px}
@media(max-width:760px){body.is-chat.agent-module-scene_music .chat-workspace .chat-actions,#sfx-form{padding:18px!important}body.is-chat.agent-module-scene_music .chat-workspace .create-footer{flex-wrap:wrap}.config-form-actions .create-button{width:100%}}

body.is-chat.agent-module-sfx #agent-fixed-tools{display:none!important}
body.is-chat #sfx-form{background:linear-gradient(145deg,#17281b,#101c14)!important;border-color:#92b86b66!important}
body.is-chat #sfx-form>#agent-module-options{display:flex!important;flex-direction:column;gap:14px;margin:24px 0;padding:22px 0 0;border:0;border-top:1px solid #92b86b30;border-radius:0;background:transparent;max-height:none;overflow:visible}
body.is-chat #sfx-form .agent-options-note{display:none}
body.is-chat #sfx-form .sfx-curve-module,body.is-chat #sfx-form .sfx-postprocess-option{background:#142318!important;border-color:#92b86b40!important}
body.is-chat #sfx-form .sfx-curve-module{color:#dce7cc}
body.is-chat #sfx-form input[type=number]{border-color:#92b86b55;background:#101c14}
body.is-chat #sfx-form .config-form-actions{border-color:#92b86b30}

body.is-chat .chat-workspace.is-visible {grid-template-columns:minmax(0,1fr) minmax(330px,400px)}
.generation-progress{display:flex;align-items:center;gap:26px;margin:24px 0;padding:30px;border:1px solid #a8d5753b;background:#132118;border-radius:22px;min-height:150px}
.generation-progress[hidden]{display:none}.generation-ring{--ring:#b5de75;position:relative;display:grid;place-items:center;flex-shrink:0;width:100px;height:100px;border-radius:50%;background:conic-gradient(var(--ring) var(--progress,0%),#ffffff10 0);box-shadow:0 0 25px #b5de7517}
.generation-ring:before{content:'';position:absolute;inset:7px;border-radius:50%;background:#132118}.generation-ring span{position:relative;font-size:24px;font-weight:700;color:#ddf2c4}
.is-loading .generation-ring:after{content:'';position:absolute;inset:-7px;border:2px solid transparent;border-top-color:#b5de75;border-radius:50%;animation:generation-spin 2s linear infinite}
.is-complete .generation-ring{--ring:#71e6a2;box-shadow:0 0 24px #71e6a233;animation:generation-glow 2s ease-in-out infinite}.is-failed .generation-ring{--ring:#ee7777;background:#ee7777}.is-failed{border-color:#ee777777}.is-failed .generation-ring span{color:#ffb0a8}
.generation-progress-copy{display:grid;gap:12px;min-width:0}.generation-progress-copy strong{font-size:21px}.generation-progress-copy small{color:#9aaf94;overflow-wrap:anywhere}.generation-progress-copy button{justify-self:start}
.track-controls{display:flex;align-items:center;gap:10px;margin-top:12px;width:100%}.track-controls input{flex:1;min-width:45px;accent-color:#cafa73;cursor:pointer}.track-controls select{width:75px!important;padding:6px!important;font-size:12px;border-radius:8px;background:#18251a;color:#dce8d2}
.chat-results-rail .result-card.is-compact{grid-template-columns:72px minmax(0,1fr);gap:12px}.chat-results-rail .task-result-content{min-width:0}.chat-results-rail .task-result-content>strong{white-space:normal;overflow-wrap:anywhere}.chat-results-rail .task-result-actions{flex-wrap:wrap}.chat-results-rail .task-vinyl.is-compact{width:72px;height:72px}
@keyframes generation-spin{to{transform:rotate(360deg)}}@keyframes generation-glow{50%{box-shadow:0 0 35px #71e6a255}}
@media(max-width:1100px){body.is-chat .chat-workspace.is-visible{grid-template-columns:minmax(0,1fr) minmax(280px,330px)}}
@media(max-width:760px){body.is-chat .chat-workspace.is-visible{display:flex;flex-direction:column;overflow-y:auto}.generation-progress{padding:18px}.generation-ring{width:76px;height:76px}body.is-chat .chat-workspace.is-visible .chat-results-rail:not([hidden]){width:auto;max-height:none;margin:14px}}
@media(prefers-reduced-motion:reduce){.generation-ring,.generation-ring:after{animation:none!important}}

.generation-progress{display:flex;flex-direction:column;align-items:stretch;gap:18px;min-height:120px}
.generation-line{display:flex;align-items:center;gap:16px;width:100%}.generation-line-track{height:10px;flex:1;overflow:hidden;background:#ffffff10;border-radius:999px}.generation-line-fill{position:relative;display:block;width:var(--progress,0%);height:100%;background:linear-gradient(90deg,#8fb65d,#cefa79);border-radius:inherit;transition:width 1s ease}
.generation-line>strong{width:52px;text-align:right;font-size:18px;color:#d8efb9}.is-loading .generation-line-fill:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#ffffff50,transparent);animation:generation-line-shine 2s linear infinite}.is-complete .generation-line-fill{background:#71e6a2}.is-complete .generation-line>strong{color:#71e6a2}.is-failed .generation-line-fill{width:100%;background:#ee7777}.is-failed .generation-line>strong{color:#ff9e95}.generation-progress-copy{gap:10px}
@keyframes generation-line-shine{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.generation-line-fill,.generation-line-fill:after{transition:none;animation:none}}

#creation-form #form-optimize-scene,#creation-form #form-optimize-sfx{display:none!important}
.form-review-dialog{width:min(950px,94vw)!important;max-width:950px!important;max-height:90vh;overflow:auto;padding:32px}
#form-review-content{display:grid;gap:18px}#form-review-content .agent-action-card,#form-review-content .agent-scene-plan-card{margin:0;max-width:none;width:100%;box-sizing:border-box}#form-review-content .agent-action-copy>span{display:block;line-height:1.8}#form-review-content .quiet-button{justify-self:start}

/* Align track controls to the record centre and contain text within its height. */
.result-card,.chat-results-rail .result-card.is-compact{display:grid;grid-template-columns:104px minmax(0,1fr);align-items:center;gap:14px;padding:14px}
.result-card .task-vinyl,.result-card .task-vinyl.is-compact,.chat-results-rail .task-vinyl.is-compact{width:104px;height:104px;flex-basis:104px;margin:0;align-self:center}
.result-card .task-result-content,.result-card.is-compact .task-result-content{height:104px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:28px 48px 28px;gap:0;align-items:center;overflow:hidden}
.result-card .task-result-content>strong,.chat-results-rail .task-result-content>strong{grid-column:1/-1;grid-row:1;align-self:start;max-height:24px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;line-height:24px}
.result-card .track-controls{grid-column:1/-1;grid-row:2;margin:0;align-self:center;gap:10px;height:34px}
.result-card .track-controls input{width:100%;height:20px;margin:0;min-width:0;flex:1}
.result-card .track-controls select{width:62px!important;height:32px;padding:4px 6px!important;margin:0;flex:0 0 62px}
.result-card .task-result-description,.result-card.is-compact .task-result-description{grid-column:1;grid-row:3;display:block;align-self:end;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;line-height:24px;font-size:11px;max-height:24px;padding-right:6px}
.result-card .task-result-actions,.chat-results-rail .task-result-actions{grid-column:2;grid-row:3;display:flex;align-self:end;align-items:center;gap:5px;flex-wrap:nowrap;height:26px;margin:0}
.result-card .task-result-kind{display:none}.result-card .download-button{white-space:nowrap;font-size:10px;padding:5px 7px}.result-card .task-player-hint{grid-column:1/-1;font-size:10px}
.result-card .task-vinyl.is-compact .task-vinyl-play{width:30px;height:30px;font-size:14px}.result-card .task-vinyl.is-compact .task-vinyl-duration{bottom:4px;right:4px;font-size:9px}
@media(max-width:480px){.result-card,.chat-results-rail .result-card.is-compact{grid-template-columns:84px minmax(0,1fr);gap:10px;padding:10px}.result-card .task-vinyl,.result-card .task-vinyl.is-compact,.chat-results-rail .task-vinyl.is-compact{width:84px;height:84px;flex-basis:84px}.result-card .task-result-content,.result-card.is-compact .task-result-content{height:84px;grid-template-rows:24px 36px 24px}.result-card .task-result-content>strong{font-size:12px}.result-card .task-result-description{display:none}.result-card .task-result-actions{grid-column:1/-1;justify-content:flex-end}}

.generation-progress.is-idle .generation-line{display:none}.generation-progress.is-idle{min-height:96px;background:#132118;border-color:#a8d57525}.generation-progress.is-idle [data-progress-title]{color:#9cae91}

.result-card .task-vinyl-art{object-fit:cover;width:100%;height:100%}.result-card .task-vinyl-grooves{pointer-events:none}.result-card .task-vinyl-play{z-index:3;pointer-events:auto}.result-card .task-vinyl-duration{display:none}
.result-card .track-controls{position:relative}.track-time{position:absolute;right:72px;top:-12px;font-size:10px;line-height:12px;color:#b9c9a7;white-space:nowrap}.result-card .track-controls input{margin-top:6px}

.workspace-version{font-size:11px;margin-left:10px;padding:4px 8px;border-radius:6px;border:1px solid #8eae7444;color:#b4d28f;white-space:nowrap}

/* Keep progress text inside its card when the form fills the vertical viewport. */
#creation-form #generation-progress{flex:0 0 auto;height:auto;min-height:120px;box-sizing:border-box;overflow:hidden;padding-bottom:30px}
#creation-form #generation-progress.is-idle{min-height:96px}
#creation-form .generation-progress-copy{display:grid;grid-template-rows:auto auto auto;gap:10px;min-width:0;height:auto;flex:0 0 auto}
#creation-form .generation-progress-copy strong,#creation-form .generation-progress-copy small{display:block;position:static;max-width:100%;margin:0;line-height:1.5;overflow-wrap:anywhere;white-space:normal}

/* Keep the three density choices in the page instead of a native popup. */
.guofeng-density-choices { display:flex; flex-wrap:wrap; gap:8px; }
.guofeng-density-choices label { position:relative; flex:1 1 120px; cursor:pointer; }
.guofeng-density-choices input { position:absolute; width:1px; height:1px; opacity:0; }
.guofeng-density-choices span { display:block; padding:12px 16px; text-align:center; border:1px solid #465831; border-radius:10px; background:#101d16; color:#c8d7b5; }
.guofeng-density-choices input:checked + span { background:#2b4024; border-color:#b4e755; color:#e7ffc2; }
.guofeng-density-choices input:focus-visible + span { outline:2px solid #c7fa69; outline-offset:3px; }

/* Temporary NPC generation maintenance; history stays available. */
.npc-maintenance {display:none;}
.agent-module-npc_voice #npc-voice-form > :not(.npc-maintenance) {display:none!important;}
.agent-module-npc_voice .npc-maintenance {display:block;padding:clamp(28px,5vw,64px);border:1px solid #b6a0d038;border-radius:22px;background:linear-gradient(135deg,#19221b,#0b1510);color:#c7d5ba;}
.npc-maintenance h2 {font-size:clamp(24px,3vw,36px);color:#cefa68;margin:18px 0;}
.npc-maintenance p {line-height:1.8;}.npc-maintenance small {color:#85957b;line-height:1.8;}
.agent-module-npc_voice .agent-input-box,.agent-module-npc_voice .chat-actions {display:none!important;}
.conversation-type-options .type-npc:has(input:disabled) {opacity:.5;cursor:not-allowed;}