:root {
  --ink: #19181d;
  --ink-2: #494750;
  --ink-3: #77737f;
  --line: #e7e3ea;
  --line-strong: #d8d2df;
  --surface: #ffffff;
  --canvas: #f6f4f7;
  --soft: #f0edf3;
  --purple: #7555e8;
  --purple-dark: #5f3fd2;
  --purple-soft: #eee9ff;
  --green: #1e956e;
  --green-soft: #e5f5ef;
  --amber: #c87a1e;
  --amber-soft: #fff1dc;
  --red: #c94c5b;
  --red-soft: #fce9ec;
  --sidebar: #17161b;
  --sidebar-2: #232128;
  --sidebar-width: 220px;
  --page-max: 1440px;
  --shadow-sm: 0 10px 24px rgba(20, 16, 28, .06), 0 2px 6px rgba(20, 16, 28, .03);
  --shadow-lg: 0 30px 90px rgba(24, 18, 39, .18);
  --radius: 16px;
  --radius-sm: 10px;
  --text-xs: 14px;
  --text-sm: 15px;
  --text-base: 17px;
  --text-md: 19px;
  --text-lg: 23px;
}

/* V4 visual, product-first home */
.dashboard-v4 { display:grid; gap:30px; }
.v4-launch { display:grid; grid-template-columns:minmax(360px,.78fr) minmax(520px,1.22fr); min-height:390px; overflow:hidden; color:#fff; background:linear-gradient(135deg,#181522 0%,#29213c 57%,#17141f 100%); border:1px solid rgba(255,255,255,.08); border-radius:28px; box-shadow:0 28px 74px rgba(25,18,38,.2); }
.v4-launch-copy { position:relative; z-index:2; display:flex; min-width:0; justify-content:center; flex-direction:column; padding:42px; }
.v4-launch-copy::before { content:''; position:absolute; inset:0; z-index:-1; background:radial-gradient(circle at 18% 15%,rgba(135,99,255,.26),transparent 42%); pointer-events:none; }
.v4-launch-copy .eyebrow { color:#c5b5ff; }
.v4-launch-copy h1 { max-width:580px; margin:9px 0 14px; font-size:clamp(34px,3vw,46px); letter-spacing:-.055em; line-height:1.08; }
.v4-launch-copy > p { max-width:620px; margin:0; color:#c8c1d2; font-size:14px; line-height:1.8; }
.v4-launch-chips { display:flex; flex-wrap:wrap; gap:8px; margin:22px 0 25px; }
.v4-launch-chips span { padding:7px 10px; color:#eae4f5; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.12); border-radius:999px; font-size:11px; }
.v4-launch-actions { display:flex; flex-wrap:wrap; gap:10px; }
.v4-launch-actions .primary-button { min-height:48px; box-shadow:0 13px 30px rgba(117,85,232,.35); }
.v4-launch-actions .secondary-button { color:#fff; background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.2); }
.v4-launch-actions .secondary-button:hover { background:rgba(255,255,255,.13); }
.v4-launch-gallery { display:grid; min-width:0; grid-template-columns:1fr 1fr; grid-template-rows:minmax(0,1fr) 122px; gap:10px; padding:14px 14px 14px 0; }
.v4-launch-gallery figure { position:relative; min-width:0; min-height:0; margin:0; overflow:hidden; background:#27212f; border:1px solid rgba(255,255,255,.1); border-radius:18px; }
.v4-launch-gallery figure[data-route-path], .v4-capability-visual[data-route-path], .v4-product-media[data-page-link], .v4-work-card img[data-page-link] { cursor:pointer; }
.v4-launch-gallery figure[data-route-path]:focus-visible, .v4-capability-visual[data-route-path]:focus-visible, .v4-product-media[data-page-link]:focus-visible, .v4-work-card img[data-page-link]:focus-visible { outline:3px solid var(--purple); outline-offset:-3px; }
.v4-launch-gallery figure::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 50%,rgba(12,9,17,.78)); pointer-events:none; }
.v4-launch-gallery img { display:block; width:100%; height:100%; object-fit:cover; }
.v4-launch-gallery figcaption { position:absolute; z-index:2; right:14px; bottom:12px; left:14px; color:#fff; font-size:11px; font-weight:750; }
.v4-launch-gallery figcaption span,.v4-launch-gallery figcaption strong { display:block; }
.v4-launch-gallery figcaption span { margin-bottom:5px; color:#d2c7ea; font-size:9px; letter-spacing:.06em; }
.v4-launch-gallery figcaption strong { font-size:16px; }
.v4-launch-main { grid-column:1/-1; }
.v4-product-section,.v4-capability-section { display:grid; gap:14px; }
.v4-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.v4-section-head > div { min-width:0; }
.v4-section-head h2 { margin:5px 0 0; font-size:26px; letter-spacing:-.04em; }
.v4-section-head p { margin:7px 0 0; color:var(--ink-3); font-size:12px; line-height:1.6; }
.v4-section-head.compact { align-items:flex-start; }
.v4-product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.v4-product-card { display:grid; min-width:0; grid-template-columns:76px minmax(0,1fr) auto; align-items:center; gap:13px; padding:12px; background:rgba(255,255,255,.94); border:1px solid var(--line); border-radius:17px; box-shadow:var(--shadow-sm); }
.v4-product-media { display:grid; width:76px; height:76px; place-items:center; overflow:hidden; color:var(--ink-3); background:var(--soft); border-radius:13px; }
.v4-product-media img { width:100%; height:100%; object-fit:cover; }
.v4-product-placeholder { font-size:10px; font-weight:700; }
.v4-product-card > div:nth-child(2) { display:flex; min-width:0; flex-direction:column; gap:4px; }
.v4-product-card > div:nth-child(2) > strong,.v4-product-card > div:nth-child(2) > small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.v4-product-card > div:nth-child(2) > small { color:var(--ink-3); }
.v4-product-empty { display:grid; grid-template-columns:minmax(280px,.76fr) minmax(0,1.24fr); align-items:stretch; overflow:hidden; background:linear-gradient(135deg,#fff,#f7f3ff); border:1px solid #e3daf4; border-radius:20px; box-shadow:var(--shadow-sm); }
.v4-product-empty figure { position:relative; min-height:220px; margin:0; overflow:hidden; background:#e7e1ea; }
.v4-product-empty figure::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 56%,rgba(19,15,24,.72)); }
.v4-product-empty figure img { width:100%; height:100%; object-fit:cover; }
.v4-product-empty figcaption { position:absolute; z-index:2; right:14px; bottom:13px; left:14px; color:#fff; font-size:10px; font-weight:700; }
.v4-product-empty > div { align-self:center; padding:30px 34px; }
.v4-product-empty h3 { margin:6px 0 10px; font-size:24px; letter-spacing:-.035em; }
.v4-product-empty p { max-width:680px; margin:0 0 18px; color:var(--ink-3); font-size:13px; line-height:1.75; }
.v4-capability-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.v4-capability-card { --module-accent:#7555e8; --module-glow:rgba(117,85,232,.2); display:flex; min-width:0; overflow:hidden; flex-direction:column; background:rgba(255,255,255,.96); border:1px solid var(--line); border-radius:21px; box-shadow:0 13px 34px rgba(29,22,40,.07); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.v4-capability-card:hover { transform:translateY(-3px); border-color:#cbbfe4; box-shadow:0 20px 42px rgba(29,22,40,.12); }
.v4-capability-card.tone-midnight { --module-accent:#6f63d9; }
.v4-capability-card.tone-emerald { --module-accent:#168b6a; }
.v4-capability-card.tone-rose { --module-accent:#a75c7a; }
.v4-capability-card.tone-amber { --module-accent:#b77723; }
.v4-capability-card.tone-blue { --module-accent:#3479a8; }
.v4-capability-visual { position:relative; aspect-ratio:16/10; margin:0; overflow:hidden; background:#e8e4eb; }
.v4-capability-visual::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 52%,rgba(13,10,18,.72)); pointer-events:none; }
.v4-capability-visual img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .38s ease; }
.v4-capability-card:hover .v4-capability-visual img { transform:scale(1.035); }
.v4-capability-visual figcaption { position:absolute; z-index:2; right:13px; bottom:12px; left:13px; color:#fff; font-size:10px; font-weight:700; }
.v4-capability-visual > span { position:absolute; z-index:2; top:12px; right:12px; display:grid; width:32px; height:32px; place-items:center; color:#fff; background:rgba(17,13,23,.5); border:1px solid rgba(255,255,255,.22); border-radius:10px; backdrop-filter:blur(8px); font-size:10px; font-weight:850; }
.v4-capability-copy { display:flex; flex:1; flex-direction:column; padding:18px; }
.v4-capability-copy > small { color:var(--module-accent); font-size:9px; font-weight:850; letter-spacing:.12em; }
.v4-capability-copy h3 { margin:5px 0 8px; font-size:20px; letter-spacing:-.035em; }
.v4-capability-copy p { min-height:60px; margin:0; color:var(--ink-3); font-size:12px; line-height:1.65; }
.v4-capability-copy > strong { display:flex; align-items:center; gap:7px; margin:11px 0 14px; color:var(--module-accent); font-size:10px; }
.v4-capability-copy > strong i { display:grid; width:19px; height:19px; place-items:center; color:#fff; background:var(--module-accent); border-radius:6px; font-size:9px; font-style:normal; }
.v4-capability-copy > button { display:flex; width:100%; min-height:41px; align-items:center; justify-content:space-between; margin-top:auto; padding:0 12px; color:#3d3744; background:#f8f6fa; border:1px solid #e9e4ed; border-radius:11px; font-size:11px; font-weight:750; }
.v4-capability-copy > button:hover { color:var(--module-accent); background:#fff; border-color:#cbbfe4; }
.v4-activity-grid { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(410px,.92fr); gap:16px; }
.v4-activity-panel { min-width:0; padding:20px; background:rgba(255,255,255,.92); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow-sm); }
.v4-work-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:15px; }
.v4-work-card { min-width:0; overflow:hidden; background:#f8f6fa; border:1px solid var(--line); border-radius:14px; }
.v4-work-card > img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--soft); }
.v4-work-card > .v4-work-media { display:block; width:100%; padding:0; border:0; border-radius:0; overflow:hidden; background:var(--soft); cursor:pointer; }
.v4-work-card > .v4-work-media img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .2s ease,filter .2s ease; }
.v4-work-card > .v4-work-media:hover img,.v4-work-card > .v4-work-media:focus-visible img { transform:scale(1.02); filter:brightness(1.03); }
.v4-work-card > .v4-work-media:focus-visible { outline:3px solid var(--purple); outline-offset:-3px; }
.v4-work-card > div { display:flex; align-items:flex-start; flex-direction:column; gap:4px; padding:11px; }
.v4-work-card > div > span { color:var(--green); font-size:9px; font-weight:800; }
.v4-work-card strong,.v4-work-card small { overflow:hidden; width:100%; text-overflow:ellipsis; white-space:nowrap; }
.v4-work-card small { color:var(--ink-3); font-size:9px; }
.v4-work-card button { margin-top:4px; }
.v4-compact-empty { display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:12px; margin-top:15px; padding:16px; color:var(--ink-2); background:#f8f6fa; border:1px dashed #d9d1e1; border-radius:14px; }
.v4-compact-empty > span { display:grid; width:38px; height:38px; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:11px; }
.v4-compact-empty strong,.v4-compact-empty p { display:block; margin:0; }
.v4-compact-empty p { margin-top:4px; color:var(--ink-3); font-size:10px; line-height:1.5; }
.model-guard { display:flex; align-items:center; gap:12px; min-height:64px; padding:12px 16px; margin:0 0 18px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface); }
.model-guard.is-pending { border-color:#ead8b7; background:#fffaf2; }
.model-guard-icon { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--purple-soft); color:var(--purple-dark); font-weight:800; }
.model-guard.is-pending .model-guard-icon { background:var(--amber-soft); color:var(--amber); }
.model-guard div { display:flex; flex-direction:column; gap:2px; flex:1; }
.model-guard small { color:var(--ink-3); }
.model-guard-state { color:var(--green); font-weight:700; }
.v3-status { width:max-content; padding:2px 7px; border-radius:99px; background:var(--amber-soft); color:var(--amber); font-size:12px; }
.v3-status.is-ready { background:var(--green-soft); color:var(--green); }
.preset-selector { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; flex:1; }
.preset-option { padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); text-align:left; }
.preset-option.is-selected { border-color:var(--purple); background:var(--purple-soft); box-shadow:inset 0 0 0 1px var(--purple); }
.preset-option strong,.preset-option small { display:block; }
.preset-option small { margin-top:4px; color:var(--ink-3); line-height:1.4; }
.v3-task-list { display:grid; gap:8px; }
.generation-cost-summary { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding:11px 12px; margin-bottom:10px; border:1px solid var(--line); border-radius:10px; background:var(--soft); }
.generation-cost-summary strong { color:var(--purple-dark); }
.generation-cost-summary small { color:var(--ink-3); }
@media (max-width:1180px) { .v4-launch { grid-template-columns:minmax(330px,.88fr) minmax(430px,1.12fr); } .v4-launch-copy { padding:34px; } .v4-capability-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .v4-activity-grid { grid-template-columns:1fr; } }
@media (max-width:900px) { .v4-launch { grid-template-columns:1fr; } .v4-launch-gallery { min-height:380px; padding:0 14px 14px; } .v4-product-grid { grid-template-columns:1fr; } .v4-product-empty { grid-template-columns:minmax(230px,.72fr) minmax(0,1.28fr); } }
@media (max-width:700px) { .dashboard-v4 { gap:24px; } .v4-launch-copy { padding:28px 24px; } .v4-launch-gallery { grid-template-rows:230px 96px; min-height:340px; } .v4-section-head { align-items:flex-start; flex-direction:column; gap:8px; } .v4-product-empty { grid-template-columns:1fr; } .v4-product-empty figure { min-height:190px; } .v4-product-empty > div { padding:24px; } .v4-capability-grid { grid-template-columns:1fr; } .v4-activity-panel { padding:16px; } .v4-work-grid { grid-template-columns:1fr; } .v4-compact-empty { grid-template-columns:38px minmax(0,1fr); } .v4-compact-empty > button { grid-column:1/-1; justify-self:start; } .preset-selector { grid-template-columns:1fr; } }
@media (max-width:400px) { .dashboard-v4 { gap:20px; } .v4-launch { grid-template-columns:1fr; border-radius:20px; } .v4-launch-copy { padding:24px 19px; } .v4-launch-copy h1 { font-size:32px; } .v4-launch-actions { align-items:stretch; flex-direction:column; } .v4-launch-actions button { width:100%; } .v4-launch-gallery { grid-template-columns:1fr 1fr; grid-template-rows:205px 86px; min-height:305px; padding:0 9px 9px; gap:7px; } .v4-launch-gallery figure { border-radius:12px; } .v4-launch-gallery figcaption { right:9px; bottom:8px; left:9px; } .v4-launch-gallery figcaption strong { font-size:13px; } .v4-product-card { grid-template-columns:62px minmax(0,1fr); } .v4-product-media { width:62px; height:62px; } .v4-product-card > button { grid-column:1/-1; justify-self:start; } .v4-capability-grid { grid-template-columns:1fr; } .v4-capability-copy p { min-height:0; } .v4-activity-panel { padding:14px; border-radius:16px; } }
@media (max-width:390px) { .v4-launch { grid-template-columns:1fr; } .v4-capability-grid { grid-template-columns:1fr; } .v4-launch-actions { flex-direction:column; } }

/* DiscoveryShell: the public home is a feature-discovery surface.  The
   workspace sidebar remains available on creation and management pages. */
.discovery-shell .sidebar { display:none; }
.discovery-shell .main-stage { width:100%; margin-left:0; }
.discovery-shell .discovery-nav { display:flex; }
.discovery-nav { display:none; align-items:center; justify-content:flex-start; gap:7px; flex:1; min-width:0; padding:6px 10px; background:rgba(255,255,255,.74); border:1px solid rgba(218,213,222,.9); border-radius:15px; box-shadow:0 5px 18px rgba(37,28,51,.06); }
.discovery-nav button { display:inline-flex; align-items:center; gap:8px; min-height:42px; border:1px solid transparent; background:transparent; color:var(--ink-2); border-radius:11px; padding:9px 13px; font-size:15px; font-weight:800; cursor:pointer; white-space:nowrap; transition:.18s ease; }
.discovery-nav button:hover,.discovery-nav button:focus-visible { color:var(--ink); background:#f0ebf8; border-color:#e0d6f2; outline:none; transform:translateY(-1px); }
.discovery-nav-icon { display:grid; width:24px; height:24px; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:8px; font-size:14px; font-weight:900; }
.nav-free-direct { gap:8px; }
.nav-free-direct b { margin-left:auto; padding:3px 7px; color:#166a53; background:#e1f5eb; border-radius:999px; font-size:12px; }
.v4-capability-copy > small { font-size:12px; letter-spacing:.08em; }
.v4-capability-copy p { font-size:14px; line-height:1.55; }
.v4-capability-copy > strong { font-size:13px; }
.v4-capability-copy > button { font-size:14px; }
.discovery-source-picker { display:grid; grid-template-columns:auto minmax(180px,1fr) auto; gap:10px; align-items:center; margin-top:22px; }
.discovery-source-picker label { display:block; }
.discovery-source-picker input { width:100%; min-height:44px; padding:0 13px; border:1px solid #d9d1e3; border-radius:12px; background:#fff; color:var(--ink); font-size:14px; }
.discovery-source-picker .text-button { grid-column:1/-1; justify-self:start; font-size:14px; }
.discovery-function-square { display:grid; gap:14px; }
.discovery-tool-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.discovery-tool-card { display:grid; grid-template-columns:28px 1fr auto; gap:4px 10px; align-items:center; padding:15px; color:var(--ink); text-align:left; background:#fff; border:1px solid var(--line); border-radius:14px; cursor:pointer; }
.discovery-tool-card:hover,.discovery-tool-card:focus-visible { border-color:#bca9dc; box-shadow:0 8px 22px rgba(48,34,71,.09); outline:none; }
.discovery-tool-card > span { grid-row:1/3; display:grid; width:28px; height:28px; place-items:center; color:#fff; background:#7056ad; border-radius:9px; font-weight:850; }
.discovery-tool-card strong { font-size:15px; }
.discovery-tool-card small { grid-column:2/3; color:var(--ink-3); font-size:13px; line-height:1.4; }
.discovery-tool-card b { grid-column:3; grid-row:1/3; color:#6a4aa2; font-size:13px; white-space:nowrap; }
.discovery-free-strip { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:22px 24px; background:linear-gradient(110deg,#f0eafb,#fff); border:1px solid #ded4ef; border-radius:18px; }
.discovery-free-strip h2 { margin:3px 0 0; font-size:22px; }
.discovery-free-strip p { margin:5px 0 0; color:var(--ink-3); font-size:14px; }
.next-feature-section { margin-top:22px; padding:18px; background:#faf8fd; border:1px solid #e4dcef; border-radius:16px; }
.next-feature-section h3 { margin:0 0 12px; font-size:18px; }
.next-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.next-feature-card { display:grid; gap:4px; padding:13px; text-align:left; color:var(--ink); background:#fff; border:1px solid #e6deee; border-radius:12px; cursor:pointer; }
.next-feature-card:hover,.next-feature-card:focus-visible { border-color:#b9a2d8; outline:none; }
.next-feature-card strong { font-size:15px; }
.next-feature-card small { color:var(--ink-3); font-size:13px; line-height:1.4; }
.next-feature-card b { color:#6a4aa2; font-size:13px; }
@media (max-width:700px) { .discovery-source-picker { grid-template-columns:1fr; } .discovery-source-picker .text-button { grid-column:auto; } .discovery-tool-grid { grid-template-columns:1fr; } .discovery-free-strip { align-items:flex-start; flex-direction:column; } }
@media (max-width:1180px) { .discovery-nav { gap:2px; padding-inline:5px; } .discovery-nav button { gap:5px; padding-inline:8px; font-size:13px; } .discovery-nav-icon { width:21px; height:21px; font-size:12px; } }
@media (max-width:820px) { .discovery-nav { display:none !important; } }

/* V2 product-first home layer */
.v2-welcome { margin-bottom: 18px; }
.v2-welcome h1 { letter-spacing: -.03em; }
.v2-intent-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:0 0 22px; }
.v2-intent-card { min-height:126px; padding:18px; border:1px solid var(--line,#e5e7eb); border-radius:14px; background:var(--surface,#fff); text-align:left; display:flex; flex-direction:column; align-items:flex-start; cursor:pointer; transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; }
.v2-intent-card:hover { transform:translateY(-2px); border-color:var(--brand,#6d5dfc); box-shadow:0 8px 22px rgba(31,35,45,.08); }
.v2-intent-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:9px; background:#f0efff; color:#5145cd; font-size:18px; margin-bottom:11px; }
.v2-intent-card strong { font-size:15px; color:var(--text,#111827); }
.v2-intent-card small { margin-top:5px; color:var(--muted,#6b7280); line-height:1.45; }
.v2-intent-card i { margin-top:auto; padding-top:10px; font-style:normal; color:#5145cd; font-size:12px; font-weight:650; }
.feedback-detail-label { display:grid; gap:8px; color:var(--ink-2); font-size:12px; font-weight:750; }
.feedback-detail-label textarea { width:100%; min-height:82px; resize:vertical; padding:12px; color:var(--ink-1); background:#fbfafc; border:1px solid var(--line); border-radius:11px; line-height:1.55; }
.feedback-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:14px 0 4px; }
.feedback-choice { display:flex; min-height:68px; align-items:flex-start; justify-content:center; flex-direction:column; text-align:left; white-space:normal; }
.feedback-choice small { display:block; margin-top:4px; color:var(--ink-3); font-size:9px; font-weight:500; line-height:1.45; }
.feedback-safety-note { margin:13px 0 0; padding:10px 12px; color:#5f5570; background:#f6f2fb; border-radius:10px; font-size:10px; line-height:1.55; }
@media (max-width:900px) { .v2-intent-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .v2-intent-grid { grid-template-columns:1fr; } .v2-intent-card { min-height:100px; } }

* { box-sizing: border-box; }
html { color-scheme: light; }
body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at top left, rgba(117, 85, 232, .08), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(18, 140, 110, .06), transparent 28%),
    linear-gradient(180deg, #f8f6fa 0%, #f4f1f7 100%);
  color: var(--ink);
  font-family: Inter, "Segoe UI", "Microsoft YaHei UI", "PingFang SC", system-ui, sans-serif;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
}
button, input, textarea, select { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid rgba(117, 85, 232, .24);
  outline-offset: 2px;
}
button { cursor: pointer; }
img { display: block; max-width: 100%; }

.app-shell { display: flex; min-height: 100vh; background: transparent; }
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 20;
  display: flex;
  width: var(--sidebar-width);
  flex-direction: column;
  padding: 22px 14px 14px;
  color: #ddd9e5;
  background:
    radial-gradient(circle at 12% -4%, rgba(139, 103, 255, .24), transparent 31%),
    linear-gradient(180deg, #1d1a23 0%, #17151c 72%, #151319 100%);
  border-right: 1px solid rgba(255,255,255,.09);
  box-shadow: 12px 0 34px rgba(24,18,31,.08);
}
.brand { display: flex; align-items: center; gap: 12px; padding: 5px 10px 24px; }
.brand strong { display: block; color: #fff; font-size: 19px; letter-spacing: .035em; }
.brand small { display: block; margin-top: 4px; color: #aaa3b3; font-size: 11px; letter-spacing: .12em; }
.brand-logo { width: 35px; height: 35px; flex: 0 0 auto; filter: drop-shadow(0 6px 13px rgba(117,85,232,.28)); }
.nav-list { display: flex; min-height: 0; flex-direction: column; gap: 5px; overflow-y: auto; padding-right: 2px; scrollbar-width:none; }
.nav-list::-webkit-scrollbar { width:0; height:0; }
.nav-section-label { display:flex; align-items:center; gap:9px; padding:14px 13px 7px; color:#d0c9d7; font-size:13px; font-weight:800; letter-spacing:.06em; }
.nav-section-label::before { content:''; width:5px; height:5px; flex:0 0 auto; background:#9c7bf4; border-radius:50%; box-shadow:0 0 0 4px rgba(156,123,244,.1); }
.nav-section-label::after { content:''; height:1px; flex:1; background:linear-gradient(90deg,rgba(187,168,255,.28),rgba(255,255,255,.025)); }
.nav-item {
  display: flex;
  min-height: 48px;
  width: 100%;
  align-items: center;
  gap: 11px;
  padding: 0 13px;
  color: #d1cbd8;
  background: rgba(255,255,255,.038);
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.018), 0 4px 12px rgba(0,0,0,.035);
  font-size: 16px;
  font-weight: 600;
  text-align: left;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.nav-item:hover { color:#fff; background:rgba(255,255,255,.095); border-color:rgba(205,190,224,.15); transform:translateX(2px); box-shadow:0 8px 18px rgba(0,0,0,.09); }
.nav-item.is-active { color:#fff; background:linear-gradient(90deg,rgba(126,92,239,.48),rgba(103,74,202,.22)); border-color:rgba(178,151,255,.32); box-shadow:inset 3px 0 #b197ff,0 13px 26px rgba(0,0,0,.18); }
.nav-icon { display:grid; width:31px; height:31px; place-items:center; flex:0 0 auto; color:#b9b1c3; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.065); border-radius:10px; font-size:17px; }
.nav-item:hover .nav-icon { color:#e5dff0; background:rgba(255,255,255,.075); }
.nav-item.is-active .nav-icon { color: #ded4ff; background:rgba(178,151,255,.17); border-color:rgba(190,169,255,.16); }
.nav-count { margin-left: auto; color: #97909f; font-size: 12px; }
.nav-pill { margin-left: auto; padding: 4px 8px; color: #d5c8ff; background: rgba(126,92,239,.24); border:1px solid rgba(181,156,255,.12); border-radius: 12px; font-size: 11px; font-weight:700; }
.nav-dot { width: 6px; height: 6px; margin-left: auto; background: #a98cff; border-radius: 50%; box-shadow: 0 0 0 4px rgba(169,140,255,.11); }
.sidebar-spacer { flex: 1; min-height: 10px; }
.workspace-card { margin: 10px 3px 13px; padding: 14px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 16px; box-shadow: inset 0 1px 0 rgba(255,255,255,.04); backdrop-filter: blur(6px); }
.workspace-top { display: flex; justify-content: space-between; color: #aaa5b2; font-size: var(--text-xs); }
.workspace-top strong { color: #e6e1ec; font-size: var(--text-xs); }
.progress-track { height: 4px; margin: 10px 0 8px; overflow: hidden; background: #37343d; border-radius: 4px; }
.progress-track i { display: block; height: 100%; background: linear-gradient(90deg, #7555e8, #a98cff); border-radius: inherit; }
.workspace-card small { color: #8a8491; font-size: 11px; }
.settings-entry { margin-bottom: 7px; }
.account-card { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 9px; width: 100%; padding: 12px 9px 8px; color: inherit; background: transparent; border: 0; border-top: 1px solid rgba(255,255,255,.06); border-radius: 10px; font: inherit; text-align: left; cursor: pointer; transition: background .16s ease, box-shadow .16s ease; }
.account-card:hover { background: rgba(255,255,255,.055); }
.account-card:focus-visible { outline: none; background: rgba(255,255,255,.07); box-shadow: 0 0 0 2px rgba(169,140,255,.7); }
.avatar { display: grid; width: 32px; height: 32px; place-items: center; color: white; background: linear-gradient(145deg, #9c84f5, #6040d3); border-radius: 10px; font-weight: 600; }
.account-meta { min-width: 0; }
.account-card strong { display: block; max-width: 130px; overflow: hidden; color: #e6e2ea; font-size: var(--text-sm); text-overflow: ellipsis; white-space: nowrap; }
.account-card small { display: block; margin-top: 3px; color: #8b8592; font-size: 11px; }
.account-menu { color: #77727f; font-weight: 700; letter-spacing: .08em; }

.main-stage { position: relative; min-width: 0; width: calc(100% - var(--sidebar-width)); margin-left: var(--sidebar-width); }
.main-stage::before {
  content: '';
  position: fixed;
  inset: 0 0 0 var(--sidebar-width);
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.38) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.38) 1px, transparent 1px);
  background-size: 42px 42px;
  opacity: .18;
  mask-image: linear-gradient(180deg, rgba(0,0,0,.4), transparent 24%);
}
.topbar {
  position: sticky;
  top: 0;
  z-index: 15;
  display: flex;
  height: 72px;
  align-items: center;
  justify-content: space-between;
  padding: 0 30px;
  background: rgba(246,244,247,.86);
  border-bottom: 1px solid rgba(218,213,222,.7);
  backdrop-filter: blur(18px);
}
.breadcrumb { display: flex; align-items: center; gap: 9px; font-size: var(--text-sm); }
.breadcrumb span { color: var(--ink-3); }
.breadcrumb i { color: #c0bbc5; font-style: normal; }
.breadcrumb strong { font-weight: 600; }
.top-actions { display: flex; align-items: center; gap: 8px; }
.icon-button, .mobile-menu { display: grid; width: 36px; height: 36px; place-items: center; background: rgba(255,255,255,.62); border: 1px solid var(--line); border-radius: 10px; font-size: 18px; }
.icon-button:hover { background: #fff; border-color: var(--line-strong); }
.notification-button { position: relative; font-size: 15px; }
.notification-button span { position: absolute; top: 7px; right: 7px; width: 5px; height: 5px; background: var(--red); border: 1px solid white; border-radius: 50%; }
.mobile-menu { display: none; }
.primary-button, .secondary-button, .ghost-button, .danger-button {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 16px;
  border-radius: 11px;
  font-weight: 600;
  transition: .18s ease;
}
.primary-button { color: white; background: linear-gradient(135deg, #7e5fea, #6745dc); border: 1px solid #6240d4; box-shadow: 0 5px 15px rgba(103,69,220,.22); }
.primary-button:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(103,69,220,.28); }
.primary-button:disabled { cursor: not-allowed; opacity: .42; transform: none; }
.primary-button.compact { min-height: 38px; padding: 0 14px; font-size: var(--text-base); }
.secondary-button { background: white; border: 1px solid var(--line-strong); }
.secondary-button:hover { border-color: #b9b0c1; background: #fbfafc; }
.ghost-button { color: var(--ink-2); background: transparent; border: 1px solid transparent; }
.ghost-button:hover { background: var(--soft); }
.danger-button { color: var(--red); background: var(--red-soft); border: 1px solid #f1cbd1; }
.text-button { padding: 0; color: var(--purple-dark); background: none; border: 0; font-weight: 600; }

.page-container { max-width: var(--page-max); margin: 0 auto; padding: 28px 32px 44px; }
.page { display: none; animation: pageIn .28s ease; }
.page.is-active { display: block; }
@keyframes pageIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
.page-heading {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 12px;
  padding: 16px 18px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(249,246,255,.96));
  border: 1px solid rgba(223,216,233,.92);
  border-radius: 16px;
  box-shadow: var(--shadow-sm);
}
.page-heading::before {
  content: '';
  position: absolute;
  top: -42px;
  right: -24px;
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, rgba(117,85,232,.12), transparent 70%);
}
.page-heading > div { position: relative; z-index: 1; }
.page-heading h1 { margin: 0; font-size: 32px; letter-spacing: -.045em; line-height: 1.08; }
.page-heading p { max-width: 760px; margin: 8px 0 0; color: var(--ink-3); line-height: 1.75; }
.heading-actions { display: flex; gap: 9px; }
.eyebrow { display: block; margin-bottom: 7px; color: var(--purple); font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }

/* Work pages lead with the controls. Context stays in the operation panels instead of
   consuming the first viewport before the customer can start. */
#page-shooting > .page-heading,
#page-studio > .page-heading,
#page-modeling > .page-heading,
#page-detail > .page-heading,
#page-tasks > .page-heading {
  min-height:0;
  align-items:center;
  margin-bottom:10px;
  padding:12px 16px;
  border-radius:14px;
}
#page-shooting > .page-heading h1,
#page-studio > .page-heading h1,
#page-modeling > .page-heading h1,
#page-detail > .page-heading h1,
#page-tasks > .page-heading h1 { font-size:24px; line-height:1.15; }
#page-shooting > .page-heading .eyebrow,
#page-studio > .page-heading .eyebrow,
#page-modeling > .page-heading .eyebrow,
#page-detail > .page-heading .eyebrow,
#page-tasks > .page-heading .eyebrow,
#page-shooting > .page-heading p,
#page-studio > .page-heading p,
#page-modeling > .page-heading p,
#page-detail > .page-heading p,
#page-tasks > .page-heading p { display:none; }
#page-shooting > .creation-access-banner,
#page-studio > .creation-access-banner,
#page-modeling > .creation-access-banner,
#page-detail > .creation-access-banner {
  min-height:38px;
  margin-bottom:10px;
  padding:7px 10px;
}
#page-shooting > .creation-access-banner > span,
#page-studio > .creation-access-banner > span,
#page-modeling > .creation-access-banner > span,
#page-detail > .creation-access-banner > span { width:24px; height:24px; }
#page-shooting > .creation-access-banner small,
#page-studio > .creation-access-banner small,
#page-modeling > .creation-access-banner small,
#page-detail > .creation-access-banner small { display:none; }

.hero-panel {
  position: relative;
  display: grid;
  min-height: 286px;
  grid-template-columns: 1.15fr .85fr;
  overflow: hidden;
  color: white;
  background:
    radial-gradient(circle at 75% 20%, rgba(159,130,255,.28), transparent 32%),
    linear-gradient(125deg, #1a1821 0%, #272231 52%, #17161b 100%);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 26px;
  box-shadow: 0 20px 56px rgba(22,18,31,.15);
}
.hero-copy { position: relative; z-index: 2; padding: 46px; }
.hero-copy .eyebrow { color: #bba9ff; }
.hero-copy h1 { max-width: 610px; margin: 0; font-size: clamp(32px, 3vw, 48px); line-height: 1.12; letter-spacing: -.05em; }
.hero-copy p { max-width: 560px; margin: 16px 0 24px; color: #aaa4b2; line-height: 1.8; }
.hero-actions { display: flex; gap: 10px; }
.hero-actions .secondary-button { color: #eeeaf3; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); }
.hero-visual { position: relative; min-height: 260px; }
.orb { position: absolute; border-radius: 50%; filter: blur(.2px); }
.orb-a { top: 37px; right: 55px; width: 190px; height: 190px; background: radial-gradient(circle at 30% 25%, #b99aff, #6942e1 44%, #25202c 71%); box-shadow: 0 0 65px rgba(121,82,239,.24); }
.orb-b { right: 200px; bottom: 15px; width: 75px; height: 75px; background: radial-gradient(circle at 32% 25%, #9fe8d1, #238c70 50%, #202229 75%); }
.hero-product { position: absolute; right: 86px; bottom: 18px; width: 145px; transform: rotate(-6deg); filter: drop-shadow(0 30px 28px rgba(0,0,0,.35)); }
.hero-gridline { position: absolute; inset: 0; opacity: .15; background-image: linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px); background-size: 38px 38px; mask-image: linear-gradient(to left, #000, transparent); }

.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 18px 0 20px; }
.metric-card { padding: 20px; background: rgba(255,255,255,.94); border: 1px solid rgba(224,217,232,.92); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.metric-top { display: flex; align-items: center; justify-content: space-between; color: var(--ink-3); font-size: var(--text-xs); }
.metric-icon { display: grid; width: 29px; height: 29px; place-items: center; color: var(--purple); background: var(--purple-soft); border-radius: 9px; }
.metric-card strong { display: block; margin: 14px 0 6px; font-size: 25px; letter-spacing: -.03em; }
.metric-card small { color: var(--ink-3); }
.trend-up { color: var(--green); }
.trend-down { color: var(--red); }

.content-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 16px; }
.panel {
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(223,217,231,.92);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  backdrop-filter: blur(8px);
}
.panel-header {
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  border-bottom: 1px solid rgba(231,227,234,.92);
  background: linear-gradient(180deg, rgba(255,255,255,.86), rgba(251,248,253,.9));
}
.panel-header h2, .panel-header h3 { margin: 0; font-size: 15px; }
.panel-header p { margin: 4px 0 0; color: var(--ink-3); font-size: 13px; line-height: 1.5; }
.panel-body { padding: 20px; }
.workflow-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.workflow-card { position: relative; min-height: 150px; padding: 18px; overflow: hidden; background: linear-gradient(180deg, #ffffff, #faf8ff); border: 1px solid rgba(227,221,235,.96); border-radius: 18px; text-align: left; }
.workflow-card:hover { border-color: #bfb4d4; transform: translateY(-2px); box-shadow: 0 14px 28px rgba(35,25,54,.08); }
.workflow-card .workflow-icon { display: grid; width: 36px; height: 36px; place-items: center; color: white; background: linear-gradient(135deg, var(--purple), #a27ff0); border-radius: 12px; box-shadow: 0 8px 18px rgba(117,85,232,.22); }
.workflow-card strong { display: block; margin-top: 20px; font-size: 17px; }
.workflow-card small { display: block; margin-top: 6px; color: var(--ink-3); font-size: var(--text-xs); line-height: 1.5; }
.workflow-card i { position: absolute; right: 12px; bottom: 10px; color: #c5bfca; font-style: normal; }

.workspace-welcome { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:24px; padding:8px 4px 2px; }
.workspace-welcome h1 { margin:0; font-size:clamp(34px,3.4vw,52px); letter-spacing:-.055em; line-height:1; }
.workspace-welcome p { max-width:760px; margin:12px 0 0; color:var(--ink-3); font-size:15px; line-height:1.75; }
.workspace-welcome-actions { display:flex; flex:0 0 auto; gap:10px; }
.workspace-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:22px; margin:8px 0 15px; }
.workspace-section-head > div > span { color:var(--purple); font-size:11px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.workspace-section-head h2 { margin:5px 0 0; font-size:25px; letter-spacing:-.035em; }
.workspace-section-head > p { margin:0 0 2px; color:var(--ink-3); font-size:13px; }
.workspace-section-head.compact { margin:0 0 15px; }
.workspace-module-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.workspace-module-card { --module-accent:#7555e8; --module-glow:rgba(117,85,232,.22); display:flex; min-width:0; flex-direction:column; overflow:hidden; background:rgba(255,255,255,.96); border:1px solid rgba(220,214,228,.95); border-radius:24px; box-shadow:0 15px 38px rgba(28,21,40,.075); transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
.workspace-module-card:hover { transform:translateY(-3px); border-color:#c8bce0; box-shadow:0 23px 48px rgba(28,21,40,.12); }
.workspace-module-card.tone-midnight { --module-accent:#6f63d9; --module-glow:rgba(64,51,129,.25); }
.workspace-module-card.tone-emerald { --module-accent:#168b6a; --module-glow:rgba(22,139,106,.24); }
.workspace-module-card.tone-rose { --module-accent:#a75c7a; --module-glow:rgba(167,92,122,.24); }
.workspace-module-card.tone-amber { --module-accent:#b77723; --module-glow:rgba(183,119,35,.24); }
.workspace-module-card.tone-blue { --module-accent:#3479a8; --module-glow:rgba(52,121,168,.24); }
.workspace-module-visual { position:relative; min-height:0; aspect-ratio:3/2; overflow:hidden; background:#1b1820; }
.workspace-module-visual::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,8,14,.02) 42%,rgba(13,10,18,.8) 100%); pointer-events:none; }
.workspace-module-visual img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.workspace-module-case { position:absolute; inset:0; display:grid; grid-template-columns:minmax(0,.9fr) 34px minmax(0,1.1fr); align-items:stretch; background:#e5e1dc; }
.workspace-module-case-composite { display:block; }
.workspace-module-case-composite > img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.workspace-module-case-label { position:absolute; z-index:4; top:16px; padding:7px 11px; color:#fff; background:rgba(24,20,25,.72); border:1px solid rgba(255,255,255,.32); border-radius:999px; box-shadow:0 6px 18px rgba(20,16,22,.18); backdrop-filter:blur(10px); font-size:10px; font-weight:800; letter-spacing:.05em; }
.workspace-module-case-label.is-input { left:16px; }
.workspace-module-case-label.is-output { right:16px; background:color-mix(in srgb,var(--module-accent) 84%,#17131c); }
.workspace-module-case-composite .workspace-module-flow { position:absolute; z-index:5; top:50%; left:50%; align-self:auto; margin:0; transform:translate(-50%,-50%); background:var(--module-accent); box-shadow:0 9px 24px var(--module-glow); }
.workspace-module-case figure { position:relative; min-width:0; margin:0; overflow:hidden; }
.workspace-module-case figure:first-child img { object-position:50% 48%; }
.workspace-module-case figure:last-child img { object-position:50% 28%; }
.workspace-module-card.module-detail .workspace-module-case figure:last-child img,
.workspace-module-card.module-image .workspace-module-case figure:last-child img,
.workspace-module-card.module-delivery .workspace-module-case figure:last-child img { object-position:50% 55%; }
.workspace-module-case figcaption { position:absolute; z-index:2; top:16px; right:10px; padding:5px 8px; color:#fff; background:rgba(24,20,25,.76); border:1px solid rgba(255,255,255,.3); border-radius:999px; box-shadow:0 5px 14px rgba(20,16,22,.18); backdrop-filter:blur(8px); font-size:10px; font-weight:800; letter-spacing:.04em; }
.workspace-module-case figure:first-child figcaption { right:auto; left:14px; }
.workspace-module-flow { position:relative; z-index:3; display:grid; place-items:center; align-self:center; width:34px; height:34px; margin-left:-17px; margin-right:-17px; color:#fff; background:#a75c7a; border:3px solid rgba(255,255,255,.9); border-radius:50%; box-shadow:0 8px 20px rgba(79,36,54,.32); font-size:18px; font-weight:900; }
.workspace-module-card.tone-violet .workspace-module-visual img { object-position:50% 20%; }
.workspace-module-card:hover .workspace-module-visual img { transform:scale(1.035); }
.workspace-module-index { position:absolute; z-index:3; right:14px; bottom:14px; display:grid; width:35px; height:35px; place-items:center; color:#fff; background:rgba(14,11,18,.5); border:1px solid rgba(255,255,255,.22); border-radius:11px; backdrop-filter:blur(12px); font-size:11px; font-weight:800; }
.workspace-module-overlay { position:absolute; z-index:2; right:18px; bottom:18px; left:18px; color:#fff; }
.workspace-module-overlay small { display:block; color:#d7cfff; font-size:10px; font-weight:800; letter-spacing:.13em; }
.workspace-module-overlay h2 { margin:6px 0 0; font-size:25px; letter-spacing:-.045em; }
.workspace-module-body { display:flex; min-width:0; flex:1; flex-direction:column; padding:22px; }
.workspace-module-body > p { min-height:48px; margin:0; color:var(--ink-2); font-size:13px; line-height:1.72; }
.workspace-module-proof { display:flex; align-items:center; gap:7px; margin:12px 0 15px; color:var(--module-accent); font-size:11px; font-weight:700; }
.workspace-module-proof span { display:grid; width:20px; height:20px; place-items:center; color:#fff; background:var(--module-accent); border-radius:7px; box-shadow:0 5px 12px var(--module-glow); }
.workspace-module-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:auto; }
.workspace-module-actions button { position:relative; display:flex; min-width:0; min-height:43px; align-items:center; gap:6px; padding:8px 28px 8px 11px; color:#3f3b46; background:#f9f7fb; border:1px solid #e9e4ed; border-radius:12px; font-size:12px; font-weight:650; line-height:1.25; text-align:left; transition:.16s ease; }
.workspace-module-actions button:hover { color:var(--module-accent); background:#fff; border-color:#c8bce0; box-shadow:0 7px 16px var(--module-glow); }
.workspace-module-actions button i { position:absolute; right:10px; color:#aaa4b1; font-style:normal; }
.workspace-module-actions button em { padding:2px 5px; color:var(--module-accent); background:#f2edf9; border-radius:5px; font-size:9px; font-style:normal; white-space:nowrap; }
.task-result-link { min-height:32px; padding:6px 10px; color:#fff; background:#7555e8; border:0; border-radius:9px; font-size:11px; font-weight:800; white-space:nowrap; }
.task-result-link:hover { background:#6143d5; }
.task-result-preview { overflow:hidden; min-height:360px; background:#17141c; border-radius:18px; }
.task-result-preview img { display:block; width:100%; max-height:68vh; object-fit:contain; }
.task-result-inline { display:grid; grid-template-columns:150px 1fr; gap:16px; align-items:center; margin-bottom:18px; padding:12px; background:#f5f2fa; border:1px solid #e3dcec; border-radius:16px; }
.task-result-inline img { width:150px; height:112px; object-fit:cover; border-radius:11px; }
.task-result-inline span { color:#7555e8; font-size:9px; font-weight:900; letter-spacing:.12em; }
.task-result-inline strong { display:block; margin:5px 0; }
.task-result-inline p { margin:0; color:var(--ink-3); font-size:11px; line-height:1.55; }
.modeling-run-status { display:grid; grid-template-columns:1fr auto; gap:9px 12px; align-items:center; margin-top:13px; padding:11px; color:#3a3340; background:rgba(255,255,255,.74); border:1px solid rgba(117,85,232,.2); border-radius:12px; }
.modeling-run-status > div:first-child { display:flex; align-items:center; gap:9px; min-width:0; }
.modeling-run-status > div:first-child > span { display:grid; flex:0 0 auto; width:26px; height:26px; place-items:center; color:#fff; background:#7555e8; border-radius:8px; font-weight:900; }
.modeling-run-status p { min-width:0; margin:0; }
.modeling-run-status p strong,.modeling-run-status p small { display:block; }
.modeling-run-status p strong { font-size:11px; }
.modeling-run-status p small { overflow:hidden; margin-top:3px; color:#7f7787; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.modeling-run-status > b { color:#7555e8; font-size:11px; }
.modeling-run-progress { overflow:hidden; grid-column:1/-1; height:5px; background:#e5dfec; border-radius:999px; }
.modeling-run-progress i { display:block; height:100%; background:linear-gradient(90deg,#7555e8,#b775b0); border-radius:inherit; transition:width .25s ease; }
.modeling-run-status button { grid-column:1/-1; min-height:33px; color:#fff; background:#7555e8; border:0; border-radius:9px; font-size:10px; font-weight:800; }
.modeling-run-status.status-success { border-color:rgba(23,143,104,.28); background:#f0faf6; }
.modeling-run-status.status-success > div:first-child > span,.modeling-run-status.status-success button { background:#178f68; }
.modeling-run-status.status-failed { border-color:rgba(197,63,79,.25); background:#fff4f5; }
.modeling-run-status.status-failed > div:first-child > span,.modeling-run-status.status-failed button { background:#c53f4f; }
.modeling-run-status.status-failed p small { overflow:visible; white-space:normal; line-height:1.45; }
.modeling-spotlight { display:grid; grid-template-columns:minmax(340px,.78fr) minmax(0,1.22fr); min-height:330px; margin:18px 0; overflow:hidden; color:#fff; background:linear-gradient(125deg,#18161d,#282230 58%,#17151b); border:1px solid rgba(255,255,255,.06); border-radius:26px; box-shadow:0 22px 58px rgba(24,18,33,.16); }
.modeling-spotlight-media { position:relative; min-height:330px; overflow:hidden; }
.modeling-spotlight-media::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(18,15,23,.02),#201b27 100%); }
.modeling-spotlight-media img { width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.84) contrast(1.04); }
.modeling-spotlight-media > span { position:absolute; z-index:2; left:20px; bottom:20px; padding:7px 10px; color:#e8e0ff; background:rgba(20,16,26,.52); border:1px solid rgba(255,255,255,.16); border-radius:8px; backdrop-filter:blur(10px); font-size:10px; font-weight:800; letter-spacing:.12em; }
.modeling-spotlight-copy { align-self:center; padding:36px 42px 36px 28px; }
.modeling-spotlight-copy .eyebrow { color:#bba8ff; }
.modeling-spotlight-copy h2 { max-width:700px; margin:0; font-size:31px; letter-spacing:-.045em; line-height:1.16; }
.modeling-spotlight-copy p { max-width:720px; margin:14px 0; color:#b6afbc; font-size:13px; line-height:1.8; }
.modeling-spotlight-copy > div { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.modeling-spotlight-copy > div span { padding:7px 10px; color:#dcd5e4; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.09); border-radius:999px; font-size:11px; }
.dashboard-management { margin-top:22px; }
.dashboard-management-grid { display:grid; grid-template-columns:minmax(0,1.36fr) minmax(300px,.64fr); gap:16px; }
.management-shortcuts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.management-shortcuts button { display:grid; min-width:0; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:10px; padding:15px; background:rgba(255,255,255,.94); border:1px solid var(--line); border-radius:17px; text-align:left; box-shadow:var(--shadow-sm); }
.management-shortcuts button:hover { transform:translateY(-2px); border-color:#cfc4e4; }
.management-shortcuts button > span { display:grid; width:38px; height:38px; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:12px; font-size:17px; }
.management-shortcuts strong,.management-shortcuts small { display:block; }
.management-shortcuts strong { font-size:13px; }
.management-shortcuts small { margin-top:4px; color:var(--ink-3); font-size:10px; line-height:1.35; }
.management-shortcuts i { color:#aaa4b1; font-style:normal; }
.shooting-option-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.shooting-option-card { overflow:hidden; padding:0; background:#fff; border:1px solid var(--line); border-radius:21px; box-shadow:var(--shadow-sm); text-align:left; transition:.2s ease; }
.shooting-option-card:hover { transform:translateY(-3px); border-color:#c8bbe6; box-shadow:0 18px 38px rgba(35,25,54,.11); }
.shooting-option-media { position:relative; display:block; height:220px; overflow:hidden; background:#ece8ef; }
.shooting-option-media::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(12,10,15,.58)); }
.shooting-option-media img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.shooting-option-card:hover img { transform:scale(1.035); }
.shooting-option-media i { position:absolute; z-index:2; left:14px; bottom:13px; color:#fff; font-size:10px; font-style:normal; font-weight:800; letter-spacing:.13em; }
.shooting-option-media > b { position:absolute; z-index:2; top:13px; right:13px; padding:5px 9px; color:#2d2440; background:rgba(255,255,255,.9); border:1px solid rgba(255,255,255,.72); border-radius:999px; box-shadow:0 5px 16px rgba(28,20,40,.12); backdrop-filter:blur(8px); font-size:9px; font-weight:800; letter-spacing:.03em; }
.shooting-option-media img.is-contain { object-fit:contain; background:linear-gradient(145deg,#eef0f2,#d7d8dc); }
.shooting-option-copy { display:block; padding:17px 18px 19px; }
.shooting-option-copy strong { display:block; font-size:18px; }
.shooting-option-copy small { display:block; min-height:38px; margin-top:7px; color:var(--ink-3); font-size:12px; line-height:1.55; }
.shooting-option-copy em { display:block; margin-top:11px; color:var(--purple); font-size:11px; font-style:normal; font-weight:750; }
.shooting-assurance { display:grid; grid-template-columns:auto 1fr auto 1fr auto 1fr; align-items:center; gap:12px; margin-top:17px; padding:17px 19px; background:rgba(255,255,255,.9); border:1px solid var(--line); border-radius:18px; }
.shooting-assurance > span { display:grid; width:34px; height:34px; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:11px; font-size:10px; font-weight:800; }
.shooting-assurance strong,.shooting-assurance small { display:block; }
.shooting-assurance strong { font-size:12px; }
.shooting-assurance small { margin-top:4px; color:var(--ink-3); font-size:10px; line-height:1.45; }
.tool-model-select { display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,.82fr); align-items:center; gap:20px; margin:12px 0 16px; padding:15px 16px; background:linear-gradient(135deg,#f5f1ff,#fff); border:1px solid #ded4f7; border-radius:15px; }
.tool-model-select span,.tool-model-select strong,.tool-model-select small { display:block; }
.tool-model-select span { color:var(--purple); font-size:9px; font-weight:850; letter-spacing:.14em; }
.tool-model-select strong { margin-top:3px; font-size:14px; }
.tool-model-select small { margin-top:4px; color:var(--ink-3); font-size:10px; }
.tool-model-select select { width:100%; min-width:0; height:42px; padding:0 12px; background:#fff; border:1px solid #d8cdef; border-radius:11px; font-size:12px; }
.detail-workflow-switch { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.detail-workflow-switch button { display:grid; min-width:0; grid-template-columns:auto minmax(0,1fr); gap:10px; padding:14px; background:rgba(255,255,255,.92); border:1px solid var(--line); border-radius:16px; text-align:left; }
.detail-workflow-switch button.is-active { background:linear-gradient(135deg,#f3eeff,#fff); border-color:#bda9ed; box-shadow:0 12px 28px rgba(98,70,166,.11); }
.detail-workflow-switch button > span { display:grid; width:29px; height:29px; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:9px; font-size:9px; font-weight:850; }
.detail-workflow-switch strong,.detail-workflow-switch small { display:block; }
.detail-workflow-switch strong { font-size:12px; line-height:1.35; }
.detail-workflow-switch small { margin-top:5px; color:var(--ink-3); font-size:10px; line-height:1.45; }
.detail-workflow-switch em { grid-column:2; width:fit-content; padding:3px 7px; color:var(--purple); background:var(--purple-soft); border-radius:999px; font-size:9px; font-style:normal; font-weight:750; }
.detail-workflow-context { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:16px; padding:15px 17px; background:#f1fbf7; border:1px solid #cfecdf; border-radius:16px; }
.detail-workflow-context.needs-modeling { background:#f6f1ff; border-color:#ddd0fa; }
.detail-workflow-context > div:first-child > span { color:var(--green); font-size:9px; font-weight:850; letter-spacing:.12em; }
.detail-workflow-context.needs-modeling > div:first-child > span { color:var(--purple); }
.detail-workflow-context strong { display:block; margin-top:3px; font-size:14px; }
.detail-workflow-context p { margin:4px 0 0; color:var(--ink-3); font-size:11px; }
.detail-context-ready { color:var(--green); font-size:11px; font-weight:750; }
.detail-source-choice { display:flex; align-items:center; gap:7px; }
.detail-source-choice > span { margin-right:3px; color:var(--ink-3); font-size:10px; }
.detail-source-choice button { height:36px; padding:0 10px; background:#fff; border:1px solid var(--line); border-radius:10px; font-size:10px; }
.detail-source-choice button.is-active { color:#fff; background:var(--purple); border-color:var(--purple); }
.product-preparation-choice { display:grid; grid-template-columns:1fr; gap:9px; margin:12px 0 16px; padding:14px; border:1px solid #e5dcfb; border-radius:16px; background:linear-gradient(145deg,#fdfcff,#f6f2ff); box-shadow:0 7px 22px rgba(88,61,170,.07); }
.product-preparation-choice > strong { display:block; margin-bottom:1px; font-size:13px; color:var(--ink); letter-spacing:.01em; }
.product-preparation-choice label { display:grid; grid-template-columns:18px minmax(0,1fr); gap:3px 9px; align-items:start; width:100%; box-sizing:border-box; padding:11px 12px; border:1px solid #e7e1f1; border-radius:12px; background:#fff; font-size:12px; font-weight:650; line-height:1.4; cursor:pointer; transition:.18s ease; }
.product-preparation-choice label:hover { border-color:#c8b9f4; transform:translateY(-1px); }
.product-preparation-choice label:has(input:checked) { border-color:#9c83ed; background:#f3efff; box-shadow:0 4px 13px rgba(103,72,200,.1); }
.product-preparation-choice input { grid-row:1 / 3; margin:2px 0 0; accent-color:var(--purple); }
.product-preparation-choice small { grid-column:2; display:block; color:var(--ink-3); font-size:10px; font-weight:400; line-height:1.5; }
.detail-settings-panel .is-preparation-hidden { display:none !important; }
.detail-upload-inline { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:8px 0; }
.detail-upload-inline span { color:var(--ink-3); font-size:11px; }
.brand-mode-choice { display:grid; gap:8px; }
.brand-mode-choice > div { display:flex; flex-wrap:wrap; gap:8px; }
.brand-mode-choice label { font-size:11px; color:var(--ink-2); }
.task-management-links { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:16px; }
.task-management-links button { display:grid; grid-template-columns:34px minmax(0,1fr); align-items:center; gap:10px; padding:13px; background:#fff; border:1px solid var(--line); border-radius:15px; text-align:left; }
.task-management-links button > span { display:grid; width:34px; height:34px; grid-row:1 / span 2; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:10px; }
.task-management-links strong,.task-management-links small { display:block; }
.task-management-links strong { font-size:12px; }
.task-management-links small { color:var(--ink-3); font-size:10px; }

.task-list { display: flex; flex-direction: column; }
.task-row { display: grid; grid-template-columns: 42px minmax(130px,1fr) minmax(100px,.6fr) 95px 76px 30px; align-items: center; gap: 12px; min-height: 70px; padding: 10px 20px; border-bottom: 1px solid var(--line); }
.task-row:last-child { border-bottom: 0; }
.task-thumb { width: 42px; height: 42px; overflow: hidden; background: var(--soft); border-radius: 9px; }
.task-thumb img { width: 100%; height: 100%; object-fit: cover; }
.task-name strong { display: block; overflow: hidden; font-size: var(--text-sm); text-overflow: ellipsis; white-space: nowrap; }
.task-name small, .task-time { color: var(--ink-3); font-size: var(--text-xs); }
.task-name small { display: block; margin-top: 4px; }
.mini-progress { height: 5px; overflow: hidden; background: var(--soft); border-radius: 5px; }
.mini-progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--purple), #9a7af1); border-radius: inherit; transition: width .4s; }
.status-badge { display: inline-flex; width: fit-content; align-items: center; gap: 5px; padding: 6px 9px; border-radius: 20px; font-size: var(--text-xs); font-weight: 600; }
.status-running { color: var(--purple-dark); background: var(--purple-soft); }
.status-success { color: var(--green); background: var(--green-soft); }
.status-partial { color:#8a5d18; background:#fff6df; }
.status-failed { color: var(--red); background: var(--red-soft); }
.status-queued { color: var(--amber); background: var(--amber-soft); }
.row-menu { min-height:32px; padding:6px 10px; color:#5c43c9; background:#efe8ff; border:1px solid rgba(92,67,201,.14); border-radius:999px; font-size:12px; font-weight:750; cursor:pointer; }
.row-menu:hover { background:#e2d6ff; }

.activity-list { display: flex; flex-direction: column; gap: 18px; }
.activity-item { display: grid; grid-template-columns: 30px 1fr; gap: 10px; }
.activity-dot { display: grid; width: 30px; height: 30px; place-items: center; color: var(--purple); background: var(--purple-soft); border-radius: 50%; font-size: 11px; }
.activity-item p { margin: 0; color: var(--ink-2); font-size: var(--text-sm); line-height: 1.55; }
.activity-item time { display: block; margin-top: 5px; color: #99939f; font-size: 11px; }

.toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.search-field { position: relative; width: min(340px, 100%); }
.search-field span { position: absolute; left: 13px; top: 10px; color: var(--ink-3); }
.search-field input { width: 100%; height: 39px; padding: 0 13px 0 36px; background: white; border: 1px solid var(--line); border-radius: 10px; }
.filter-group { display: flex; gap: 7px; }
.filter-chip { height: 38px; padding: 0 13px; color: var(--ink-2); background: white; border: 1px solid var(--line); border-radius: 9px; font-size: var(--text-sm); }
.filter-chip.is-active { color: var(--purple-dark); background: var(--purple-soft); border-color: #d6cafa; }
.asset-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.asset-card { overflow: hidden; background: white; border: 1px solid var(--line); border-radius: var(--radius); transition: .2s; }
.asset-card:hover { transform: translateY(-3px); border-color: #cfc7d6; box-shadow: 0 12px 28px rgba(29,23,37,.09); }
.asset-cover { position: relative; height: 190px; overflow: hidden; background: #ece9ef; }
.asset-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.asset-card:hover .asset-cover img { transform: scale(1.025); }
.asset-cover .asset-type { position: absolute; top: 11px; left: 11px; padding: 5px 8px; color: #403a47; background: rgba(255,255,255,.88); border: 1px solid rgba(255,255,255,.8); border-radius: 7px; backdrop-filter: blur(8px); font-size: 11px; }
.asset-cover .asset-more { position: absolute; top: 9px; right: 9px; display: grid; width: 30px; height: 30px; place-items: center; background: rgba(255,255,255,.86); border: 0; border-radius: 8px; }
.asset-info { padding: 15px; }
.asset-info strong { display: block; overflow: hidden; font-size: var(--text-base); text-overflow: ellipsis; white-space: nowrap; }
.asset-sku { display: block; margin: 6px 0 13px; color: var(--ink-3); font-size: var(--text-xs); }
.asset-meta { display: flex; align-items: center; justify-content: space-between; color: var(--ink-3); font-size: var(--text-xs); }
.asset-meta span:first-child { display: inline-flex; align-items: center; gap: 4px; }
.asset-meta i { width: 6px; height: 6px; background: var(--green); border-radius: 50%; }
.asset-fidelity-banner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; margin-bottom: 16px; padding: 17px 19px; color: white; background: linear-gradient(120deg,#1d1924,#302746 64%,#49368a); border: 1px solid rgba(255,255,255,.08); border-radius: 15px; box-shadow: 0 15px 35px rgba(34,25,52,.13); }
.asset-fidelity-banner > div:first-child { display: grid; width: 72px; height: 62px; place-items: center; align-content: center; background: rgba(141,110,255,.16); border: 1px solid rgba(174,151,255,.28); border-radius: 13px; }
.asset-fidelity-banner > div:first-child span { font-size: 21px; font-weight: 800; }
.asset-fidelity-banner > div:first-child small { color: #bdb4c8; font-size: 8px; }
.asset-fidelity-banner strong { display: block; font-size: 15px; }
.asset-fidelity-banner p { margin: 5px 0 0; color: #bdb4c8; font-size: 10px; line-height: 1.55; }
.asset-fidelity-banner .secondary-button { color: white; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.14); }
.asset-apparel-crop { background-image: var(--asset-image); background-repeat: no-repeat; background-size: 300% auto; background-position: var(--asset-position) center; }
.asset-apparel-crop[style*="--asset-position:left"] { background-position: left center; }
.asset-apparel-crop[style*="--asset-position:center"] { background-position: center center; }
.asset-apparel-crop[style*="--asset-position:right"] { background-position: right center; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.add-asset-card { display: grid; min-height: 273px; place-items: center; color: var(--ink-3); background: rgba(255,255,255,.45); border: 1px dashed #cbc4d1; border-radius: var(--radius); }
.add-asset-card:hover { color: var(--purple); background: var(--purple-soft); border-color: #ae9be6; }
.add-asset-card span { display: grid; width: 45px; height: 45px; margin: 0 auto 12px; place-items: center; color: var(--purple); background: white; border: 1px solid var(--line); border-radius: 14px; font-size: 22px; }

.studio-layout { display: grid; grid-template-columns: 270px minmax(0, 1fr) 350px; min-height: calc(100vh - 130px); gap: 16px; align-items: start; }
.tool-panel, .config-panel, .preview-panel {
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(223,217,231,.92);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  backdrop-filter: blur(8px);
}
.tool-panel { padding: 12px 10px 14px; }
.tool-search { position: relative; margin: 0 3px 12px; }
.tool-search input { width: 100%; height: 42px; padding: 0 11px 0 32px; background: var(--canvas); border: 1px solid transparent; border-radius: 11px; font-size: var(--text-sm); }
.tool-search span { position: absolute; left: 11px; top: 8px; color: var(--ink-3); }
.tool-group-label { display:flex; align-items:center; gap:8px; padding: 15px 8px 7px; color: #847b8d; font-size: 11px; font-weight: 800; letter-spacing: .06em; white-space:nowrap; }
.tool-group-label::after { content:''; height:1px; flex:1; background:linear-gradient(90deg,#e5deec,transparent); }
.tool-item { display: grid; grid-template-columns: 25px minmax(0,1fr) auto; width: 100%; min-width:0; min-height: 42px; align-items: center; gap: 7px; margin:2px 0; padding: 0 7px; background: transparent; border: 1px solid transparent; border-radius: 11px; color: var(--ink-2); text-align: left; font-size: 13px; line-height:1; }
.tool-item:hover { background: #f6f3f9; border-color:#ece6f2; }
.tool-item.is-active { color: var(--purple-dark); background: linear-gradient(90deg,#eee8ff,#f5f1ff); border-color:#e2d8ff; box-shadow:inset 3px 0 #8565e6; font-weight: 700; }
.tool-item .tool-item-icon { display: grid; width: 25px; height: 25px; place-items: center; color: currentColor; background: white; border: 1px solid var(--line); border-radius: 8px; font-size: 11px; }
.tool-item .tool-item-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tool-item em { flex:0 0 auto; padding:3px 5px; color: var(--purple-dark); background: #eee9ff; border-radius: 7px; font-size: 11px; font-style: normal; font-weight:700; white-space:nowrap; }
.config-panel { min-width: 0; }
.config-title { display: flex; align-items: center; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid rgba(231,227,234,.92); background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(249,247,252,.95)); }
.config-title h2 { margin: 0; font-size: 24px; letter-spacing: -.03em; }
.config-title p { margin: 6px 0 0; color: var(--ink-3); font-size: 14px; }
.model-mode { display: inline-flex; gap: 5px; padding: 6px 9px; color: var(--green); background: var(--green-soft); border-radius: 20px; font-size: 11px; }
.config-scroll { padding: 22px 24px 24px; }
.input-section { margin-bottom: 23px; }
.section-label { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.section-label strong { font-size: 16px; }
.section-label span { color: var(--ink-3); font-size: 12px; }
.upload-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.upload-slot { position: relative; display: grid; min-height: 165px; place-items: center; overflow: hidden; color: var(--ink-3); background: var(--canvas); border: 1px dashed #c9c3ce; border-radius: 16px; text-align: center; }
.upload-slot:hover { color: var(--purple); background: #f8f6ff; border-color: #ab99df; }
.upload-slot.has-file { border-style: solid; }
.upload-slot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.upload-slot::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 55%, rgba(15,12,20,.55)); opacity: 0; }
.upload-slot.has-file::after { opacity: 1; }
.upload-content { position: relative; z-index: 2; }
.upload-slot.has-file .upload-content { align-self: end; width: 100%; padding: 12px; color: white; text-align: left; }
.upload-plus { display: grid; width: 36px; height: 36px; margin: 0 auto 9px; place-items: center; color: var(--purple); background: white; border: 1px solid var(--line); border-radius: 12px; font-size: 18px; box-shadow: var(--shadow-sm); }
.upload-slot strong { display: block; font-size: 15px; }
.upload-slot small { display: block; margin-top: 6px; color: currentColor; font-size: var(--text-xs); opacity: .78; }
.material-layout { display: grid; grid-template-columns: minmax(210px, 1fr) minmax(250px, .92fr); gap: 12px; align-items: stretch; }
.material-layout .upload-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); align-content: start; }
.tool-example-card { min-width: 0; overflow: hidden; background: #17141d; border: 1px solid rgba(112,84,202,.3); border-radius: 18px; box-shadow: 0 18px 42px rgba(30,22,46,.18); }
.example-media { position: relative; height: 210px; overflow: hidden; background: radial-gradient(circle at 20% 10%, #59408f, #17141d 60%); }
.example-media::after { content: ''; position: absolute; inset: auto 0 0; height: 45%; pointer-events: none; background: linear-gradient(transparent, rgba(10,8,13,.7)); }
.example-badge { position: absolute; z-index: 8; top: 10px; left: 10px; display: inline-flex; align-items: center; gap: 4px; padding: 7px 10px; color: white; background: rgba(23,18,31,.68); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; backdrop-filter: blur(10px); font-size: 10px; font-weight: 700; letter-spacing: .04em; }
.example-copy { padding: 16px 16px 17px; color: white; }
.example-copy > small { color: #9d87f2; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.example-copy h3 { margin: 8px 0 7px; font-size: 16px; line-height: 1.35; }
.example-copy p { margin: 0; color: #b9b1c2; font-size: 12px; line-height: 1.6; }
.example-copy > div { display: flex; align-items: flex-start; gap: 5px; margin-top: 10px; padding-top: 10px; color: #ded8e6; border-top: 1px solid rgba(255,255,255,.09); font-size: 11px; line-height: 1.45; }
.example-copy > div span { color: #72d7b1; }
.example-art { position: absolute; inset: 0; overflow: hidden; }
.example-art > img, .example-art span > img { width: 100%; height: 100%; object-fit: cover; }
.case-compare-art { background: #17131c; isolation: isolate; }
.case-compare-art > img { width: 100%; height: 100%; object-fit: cover; object-position: center; transform: scale(1.01); transition: transform .65s ease, filter .65s ease; }
.case-compare-art.is-fashion > img { object-position: center 8%; }
.tool-example-card:hover .case-compare-art > img { transform: scale(1.035); filter: saturate(1.04) contrast(1.03); }
.case-compare-vignette { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(10,8,15,.08) 34%, rgba(10,8,15,.88) 100%), linear-gradient(90deg, rgba(10,8,15,.18), transparent 42%, rgba(10,8,15,.12)); }
.case-compare-label { position: absolute; z-index: 3; top: 14px; padding: 6px 9px; color: rgba(255,255,255,.92); background: rgba(21,17,28,.68); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; backdrop-filter: blur(12px); font-size: 9px; font-weight: 800; letter-spacing: .05em; box-shadow: 0 7px 18px rgba(0,0,0,.16); }
.case-compare-label.before-label { left: 108px; }
.case-compare-label.after-label { right: 14px; color: #f4efff; background: linear-gradient(135deg, rgba(111,82,227,.92), rgba(45,145,231,.82)); border-color: rgba(255,255,255,.3); }
.case-compare-divider { position: absolute; z-index: 4; top: 0; bottom: 0; left: 50%; width: 2px; transform: translateX(-50%); background: rgba(255,255,255,.88); box-shadow: 0 0 18px rgba(255,255,255,.48); }
.case-compare-divider i { position: absolute; top: 50%; left: 50%; display: grid; width: 34px; height: 34px; transform: translate(-50%,-50%); place-items: center; color: #5d40bf; background: rgba(255,255,255,.96); border: 4px solid rgba(112,80,221,.92); border-radius: 50%; box-shadow: 0 10px 25px rgba(11,8,18,.36); font-size: 15px; font-style: normal; font-weight: 900; }
.case-compare-caption { position: absolute; z-index: 3; right: 16px; bottom: 16px; left: 16px; color: white; text-shadow: 0 2px 12px rgba(0,0,0,.38); }
.case-compare-caption small { display: block; color: #d2c4ff; font-size: 8px; font-weight: 800; letter-spacing: .17em; }
.case-compare-caption strong { display: block; margin-top: 4px; font-size: 16px; line-height: 1.2; }
.case-compare-caption span { display: block; margin-top: 5px; color: rgba(255,255,255,.76); font-size: 9px; }
.example-shine { position: absolute; top: -40%; left: -65%; width: 55%; height: 180%; transform: rotate(20deg); background: linear-gradient(90deg, transparent, rgba(255,255,255,.24), transparent); animation: exampleShine 5.5s ease-in-out infinite; }
@keyframes exampleShine { 0%,58% { left:-65%; } 85%,100% { left:130%; } }
@keyframes example-camera { from { transform:scale(1.08) translateX(-1%); } to { transform:scale(1.17) translateX(2%); } }
@keyframes example-progress { from { width:0; } to { width:100%; } }
.hero-art img, .retouch-art img { transform: scale(1.03); }
.catalog-art { background: white; }
.catalog-art img, .cutout-art img { object-fit: contain; }
.cutout-art { background-color: #f5f5f5; background-image: linear-gradient(45deg,#e6e6e6 25%,transparent 25%),linear-gradient(-45deg,#e6e6e6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e6e6e6 75%),linear-gradient(-45deg,transparent 75%,#e6e6e6 75%); background-size: 18px 18px; background-position: 0 0,0 9px,9px -9px,-9px 0; }
.cutout-art img { width:78% !important; height:82% !important; margin:auto; filter:drop-shadow(0 18px 24px rgba(40,27,48,.18)); border-radius:8px; }
.compare-art .compare-line { position: absolute; z-index: 3; top: 0; bottom: 0; left: 46%; width: 2px; background: white; box-shadow: 0 0 14px rgba(0,0,0,.4); }
.compare-art .compare-line i { position: absolute; top: 48%; left: 50%; width: 24px; height: 24px; transform: translate(-50%,-50%); background: white; border: 6px solid rgba(110,80,212,.9); border-radius: 50%; }
.compare-art > b { position: absolute; z-index: 4; right: 10px; bottom: 10px; padding: 5px 7px; color: white; background: rgba(28,22,35,.7); border-radius: 6px; font-size: 9px; }
.zoom-art > img { transform: scale(1.25); }
.zoom-lens { position: absolute; z-index: 4; right: 14px; bottom: 15px; width: 92px; height: 92px; overflow: hidden; background: #23202a; border: 3px solid white; border-radius: 50%; box-shadow: 0 10px 25px rgba(0,0,0,.4); }
.zoom-lens img { width: 190%; height: 190%; transform: translate(-32%,-27%); object-fit: cover; }
.zoom-lens b { position: absolute; right: 2px; bottom: 2px; display: grid; width: 25px; height: 25px; place-items: center; color: white; background: #7555e8; border-radius: 50%; font-size: 9px; }
.zoom-art > span { position: absolute; z-index: 4; top: 15px; right: 13px; color: rgba(255,255,255,.8); font-size: 9px; font-weight: 800; letter-spacing: .15em; text-align: right; }
.poster-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(24,13,42,.9),rgba(63,37,110,.24) 65%,transparent); }
.poster-art > img { transform: scale(1.06); }
.poster-art > div { position: absolute; z-index: 3; top: 50%; left: 15px; transform: translateY(-45%); color: white; }
.poster-art small { display: block; margin-bottom: 7px; color: #bcaaff; font-size: 7px; letter-spacing: .13em; }
.poster-art strong { display: block; font-size: 23px; line-height: 1.05; letter-spacing: .03em; }
.poster-art span { display: inline-block; margin-top: 10px; padding: 5px 7px; color: #261842; background: white; border-radius: 5px; font-size: 8px; font-weight: 700; }
.translate-art > img { filter: brightness(.78); transform: scale(1.08); }
.translation-before, .translation-after { position: absolute; z-index: 3; left: 12px; right: 12px; padding: 8px 10px; color: white; border: 1px solid rgba(255,255,255,.25); border-radius: 8px; backdrop-filter: blur(9px); }
.translation-before { top: 42px; background: rgba(22,18,29,.55); }
.translation-after { bottom: 15px; background: rgba(102,72,213,.82); }
.translation-before small, .translation-after small { display: block; opacity: .68; font-size: 7px; letter-spacing: .12em; }
.translation-before strong, .translation-after strong { display: block; margin-top: 2px; font-size: 12px; }
.translate-art > b { position: absolute; z-index: 5; top: 50%; right: 18px; display: grid; width: 28px; height: 28px; transform: translateY(-50%); place-items: center; color: #6c4ed1; background: white; border-radius: 50%; box-shadow: 0 8px 16px rgba(0,0,0,.25); }
.multi-art { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; padding: 2px; background: #d9d4df; }
.multi-art > span { position: relative; min-width: 0; overflow: hidden; background: white; }
.multi-art img { object-fit: contain !important; transform: scale(.92); }
.multi-art > span:nth-child(2) img { transform: scale(.92) rotateY(18deg); }
.multi-art > span:nth-child(3) img { transform: scale(.92) rotateY(180deg); }
.multi-art > span:nth-child(4) img { transform: scale(.92) rotateY(-18deg); }
.multi-art i { position: absolute; z-index: 3; left: 5px; bottom: 4px; padding: 2px 4px; color: #302b38; background: rgba(255,255,255,.86); border-radius: 4px; font-size: 7px; font-style: normal; }
.multi-art b { position: absolute; top: 5px; right: 5px; color: #776f7f; font-size: 7px; }
.fashion-art { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #cfc9d7; }
.fashion-art > span { position: relative; min-width: 0; overflow: hidden; background: #f4f2f5; }
.fashion-art > span img { object-position: top center; }
.fashion-art .fashion-after { isolation: isolate; }
.fashion-art .fashion-after > img:not(.garment-layer) { object-fit: cover; object-position: top center; }
.fashion-art .garment-layer { position: absolute; z-index: 2; top: 12%; left: 18%; width: 64%; height: 73%; object-fit: contain; mix-blend-mode: multiply; filter: saturate(1.06) contrast(1.04); }
.fashion-art > span i { position: absolute; z-index: 3; left: 7px; bottom: 7px; padding: 4px 6px; color: white; background: rgba(24,20,29,.65); border-radius: 5px; font-size: 8px; font-style: normal; }
.fashion-art > em { position: absolute; z-index: 5; right: 7px; top: 8px; padding: 5px 7px; color: white; background: rgba(108,76,215,.9); border-radius: 12px; font-size: 8px; font-style: normal; font-weight: 700; }
.fusion-arrow { position: absolute; z-index: 6; top: 50%; left: 50%; display: grid; width: 28px; height: 28px; transform: translate(-50%,-50%); place-items: center; color: #6c4ed1; background: white; border-radius: 50%; box-shadow: 0 7px 16px rgba(23,15,41,.28); font-size: 12px; }
.extract-art .fashion-before img { object-position: 20% top; }
.addmodel-art .fashion-before img { object-fit: contain; background: white; }
.adjust-art { display: grid; grid-template-columns: 1fr 1.18fr; gap: 2px; background: #7d6b94; }
.adjust-art span { position: relative; overflow: hidden; }
.adjust-art span:first-child img { filter: grayscale(.6) brightness(.78); transform: scale(1.18); transform-origin: center top; }
.adjust-art span:last-child img { transform: scale(1.05) translateY(-3%); transform-origin: center top; }
.adjust-art i { position: absolute; z-index: 3; bottom: 7px; left: 7px; padding: 4px 6px; color: white; background: rgba(20,16,26,.64); border-radius: 5px; font-size: 8px; font-style: normal; }
.adjust-art > b { position: absolute; z-index: 5; top: 12px; right: 12px; color: white; font-size: 23px; text-shadow: 0 4px 12px rgba(0,0,0,.4); }
.premium-fashion-case { isolation: isolate; color: white; background: #1a171e; }
.premium-fashion-case::after { content:''; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(180deg,rgba(12,9,16,.05) 35%,rgba(12,9,16,.88) 100%); }
.premium-fashion-case .fashion-result,.premium-fashion-case .fashion-source { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.premium-fashion-case:hover .fashion-result { transform:scale(1.035); }
.fashion-flow-case { padding:16px 16px 88px; background:linear-gradient(145deg,#f4eadb 0%,#f8efe3 48%,#ddc6a7 100%); }
.fashion-flow-case::after { background:linear-gradient(180deg,rgba(12,9,16,0) 50%,rgba(12,9,16,.9) 100%); }
.flow-title { position:absolute; z-index:5; top:12px; left:16px; right:110px; color:#1f1a22; font-size:15px; font-weight:900; line-height:1.25; text-shadow:0 1px 0 rgba(255,255,255,.55); }
.flow-stage { position:relative; z-index:3; display:grid; grid-template-columns:1fr 34px 1.18fr; align-items:end; gap:10px; height:100%; padding-top:34px; }
.flow-input,.flow-original,.flow-result,.flow-garment-stack { position:relative; min-width:0; height:210px; }
.flow-input.duo { display:grid; grid-template-columns:1fr 1fr; gap:8px; align-items:end; }
.flow-input figure,.flow-original,.flow-result,.flow-garment-stack { margin:0; overflow:hidden; background:rgba(255,255,255,.92); border:1px solid rgba(70,54,38,.14); border-radius:10px; box-shadow:0 14px 30px rgba(57,40,24,.18); }
.flow-input figure,.flow-original,.flow-result { display:grid; place-items:center; }
.flow-input img,.flow-original img,.flow-result img { width:100%; height:100%; object-fit:cover; object-position:center top; }
.flow-original img { filter:saturate(.92) contrast(.94); }
.flow-result img { object-fit:cover; background:#f8f7fb; filter:saturate(1.06) contrast(1.04); }
.flow-arrow { z-index:4; align-self:center; display:grid; width:34px; height:34px; place-items:center; color:#fff; background:linear-gradient(145deg,#6d56e8,#22a6f2); border-radius:50%; box-shadow:0 10px 22px rgba(68,57,159,.28); font-size:22px; font-weight:900; }
.flow-input figcaption,.flow-original figcaption,.flow-result figcaption,.flow-garment-stack figcaption { position:absolute; z-index:5; top:8px; left:8px; padding:5px 8px; color:#fff; background:rgba(23,18,31,.74); border-radius:6px; font-size:11px; font-weight:800; backdrop-filter:blur(8px); }
.flow-result figcaption { right:8px; left:auto; background:linear-gradient(135deg,#6d56e8,#20a7f2); box-shadow:0 7px 16px rgba(39,90,186,.28); }
.garment-card { display:block; width:100%; height:100%; min-height:84px; background-color:#f7f5f6; background-repeat:no-repeat; border-radius:8px; }
.garment-luxury-black { background:#111 url('/app/assets/examples/fashion-luxury-black-dress.jpg') center 24%/135% auto no-repeat !important; }
.garment-luxury-cream { background:#f4f0eb url('/app/assets/examples/fashion-luxury-cream-dress.jpg') center 40%/125% auto no-repeat !important; }
.floating-garment { position:absolute; z-index:6; right:10px; bottom:10px; width:62px; height:82px; overflow:hidden; color:white; border:2px solid rgba(255,255,255,.88); border-radius:10px; box-shadow:0 12px 25px rgba(21,14,25,.32); text-indent:-999px; }
.floating-garment::after { content:attr(class); position:absolute; right:4px; bottom:4px; left:4px; padding:3px 2px; color:white; background:rgba(17,13,22,.74); border-radius:4px; font-size:0; text-indent:0; }
.tryon-premium .floating-garment::after,.replace-premium .floating-garment::after { content:'目标礼服'; font-size:9px; font-weight:800; text-align:center; }
.flow-garment-stack { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:34px 9px 12px; align-items:center; }
.flow-garment-stack .garment-card,.mini-garments .garment-card { border:1px solid rgba(30,22,35,.08); box-shadow:0 10px 20px rgba(50,38,56,.12); }
.mini-garments { display:grid; grid-template-columns:1fr; gap:7px; align-self:center; height:auto; }
.mini-garments .garment-card { width:54px; height:72px; min-height:0; background-color:#fff; }
.replace-premium .mini-garments { position:absolute; z-index:7; top:72px; left:calc(50% - 30px); padding:6px; background:rgba(255,255,255,.82); border:1px solid rgba(255,255,255,.7); border-radius:12px; box-shadow:0 16px 32px rgba(37,24,55,.22); backdrop-filter:blur(10px); }
.replace-premium .mini-garments .garment-card { width:46px; height:58px; }
.replace-premium .flow-stage { grid-template-columns:1fr 34px 1fr; }
.extracted-board { padding:30px 18px 20px; background-color:#fff !important; background-image:linear-gradient(45deg,#ece9ee 25%,transparent 25%),linear-gradient(-45deg,#ece9ee 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ece9ee 75%),linear-gradient(-45deg,transparent 75%,#ece9ee 75%) !important; background-size:18px 18px !important; background-position:0 0,0 9px,9px -9px,-9px 0 !important; }
.before-muted img { filter:grayscale(.72) brightness(.76) contrast(.9); transform:scale(1.08); }
.after-polished img { object-fit:cover; object-position:center 45%; filter:saturate(1.18) contrast(1.1) brightness(1.08); transform:scale(1.08); }
.tryon-premium .flow-original img,.replace-premium .flow-original img,.adjust-premium .flow-original img,.adjust-premium .flow-result img { object-position:center 45%; }
.tryon-premium .flow-result img,.replace-premium .flow-result img { object-position:center 28%; }
.addmodel-premium .flow-result img { object-position:center 28%; }
.tryon-premium .fashion-result,.replace-premium .fashion-result { object-position:center 21%; }
.addmodel-premium::after { background:linear-gradient(180deg,rgba(12,9,16,.02) 42%,rgba(12,9,16,.78) 100%); }
.addmodel-premium .fashion-result { object-fit:contain; object-position:center center; background:linear-gradient(145deg,#f7f7fb,#eeedf4 58%,#d8d7df); }
.adjust-premium .fashion-result { object-position:center 42%; }
.premium-fashion-case > em { position:absolute; z-index:5; top:12px; right:10px; color:rgba(255,255,255,.86); font-size:7px; font-style:normal; font-weight:800; letter-spacing:.16em; text-shadow:0 2px 8px rgba(0,0,0,.45); }
.fashion-proof { position:absolute; z-index:5; right:12px; bottom:12px; left:12px; }
.fashion-proof b { display:block; font-size:13px; letter-spacing:.01em; }
.fashion-proof small { display:block; margin-top:3px; color:rgba(255,255,255,.76); font-size:8px; }
.fashion-input-stack { position:absolute; z-index:6; top:38px; left:10px; display:flex; gap:6px; }
.fashion-input-stack > span { position:relative; width:46px; height:58px; overflow:hidden; background:#f5f3f6; border:1px solid rgba(255,255,255,.7); border-radius:9px; box-shadow:0 8px 22px rgba(9,7,12,.35); }
.fashion-input-stack > span > img { width:100%; height:100%; object-fit:cover; object-position:center top; }
.fashion-input-stack i,.extracted-garment > span,.adjust-before > span { position:absolute; right:3px; bottom:3px; left:3px; padding:3px 2px; color:white; background:rgba(18,14,24,.72); border-radius:4px; font-size:6px; font-style:normal; font-weight:700; text-align:center; backdrop-filter:blur(6px); }
.fashion-input-stack.single > span { width:58px; height:72px; }
.garment-swatch { background-color:#f4f3f5; background-image:url('/app/assets/examples/apparel-categories.png'); background-repeat:no-repeat; background-size:300% 100%; }
.garment-blue { background-position:right center; }
.garment-ivory { background-color:#ded9e2; background-position:center center; filter:contrast(1.12) drop-shadow(0 5px 8px rgba(36,28,48,.18)); }
.garment-photo { background:#e3e4ef url('/app/assets/examples/fashion-blue-dress.jpg') center 41%/180% auto no-repeat !important; }
.identity-lock { position:absolute; z-index:6; top:38px; left:10px; display:flex; align-items:center; gap:7px; padding:5px 7px 5px 5px; color:#2c2533; background:rgba(255,255,255,.92); border:1px solid rgba(255,255,255,.8); border-radius:30px; box-shadow:0 8px 22px rgba(9,7,12,.32); backdrop-filter:blur(8px); }
.identity-lock img { width:34px; height:34px; object-fit:cover; object-position:center 9%; border-radius:50%; }
.identity-lock span { font-size:6px; line-height:1.45; }
.identity-lock b { color:#6d4ed6; font-size:8px; }
.extract-premium { display:grid; grid-template-columns:1.05fr .95fr; gap:1px; background:#ece9ee; }
.fashion-flow-case.extract-premium { display:block; }
.extract-premium::after { background:linear-gradient(180deg,transparent 42%,rgba(16,12,20,.9) 100%); }
.extract-premium .fashion-source { object-position:center 18%; }
.extracted-garment { position:relative; display:grid; place-items:center; padding:18px 8px 28px; background:radial-gradient(circle at 50% 35%,#fff,#eae7ed); }
.garment-large { width:100%; height:100%; max-height:142px; background-size:300% 100%; filter:drop-shadow(0 10px 12px rgba(49,42,58,.14)); }
.extracted-garment > span { z-index:4; right:8px; bottom:10px; left:8px; }
.adjust-before { position:absolute; z-index:6; top:38px; left:10px; width:58px; height:72px; overflow:hidden; border:1px solid rgba(255,255,255,.72); border-radius:9px; box-shadow:0 8px 22px rgba(9,7,12,.35); }
.adjust-before img { width:100%; height:100%; object-fit:cover; object-position:center 42%; filter:grayscale(.85) brightness(.7); transform:scale(1.14); }

.fashion-material-layout { grid-template-columns:minmax(240px,.72fr) minmax(420px,1.28fr); align-items:stretch; }
.fashion-material-layout .upload-grid { grid-template-columns:1fr; }
.fashion-material-layout .upload-slot { min-height:190px; }
.fashion-example-card .example-media { height:310px; }
.fashion-example-card .example-copy { padding:18px 20px 20px; }
.fashion-example-card .example-copy > small { font-size:12px; }
.fashion-example-card .example-copy h3 { font-size:18px; }
.fashion-example-card .example-copy p { font-size:13px; }
.fashion-example-card .example-copy > div { font-size:12px; }
.fashion-example-card .example-badge { font-size:11px; }
.fashion-example-card .fashion-proof b { font-size:17px; }
.fashion-example-card .fashion-proof small { font-size:12px; }
.fashion-example-card .fashion-input-stack { top:48px; left:14px; }
.fashion-example-card .fashion-input-stack > span { width:58px; height:74px; }
.fashion-example-card .fashion-input-stack.single > span { width:76px; height:94px; }
.fashion-example-card .identity-lock { top:48px; left:14px; }
.fashion-example-card .identity-lock img { width:42px; height:42px; }
.fashion-example-card .identity-lock span { font-size:8px; }
.fashion-example-card .identity-lock b { font-size:10px; }
.fashion-example-card .adjust-before { top:48px; left:14px; width:76px; height:94px; }
.video-art > img { transform: scale(1.08); }
.video-art::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle,transparent 30%,rgba(9,7,12,.7)); }
.video-art > button { position: absolute; z-index: 5; top: 50%; left: 50%; display: grid; width: 48px; height: 48px; transform: translate(-50%,-58%); place-items: center; color: #4e36a7; background: rgba(255,255,255,.94); border: 0; border-radius: 50%; box-shadow: 0 12px 25px rgba(0,0,0,.34); font-size: 15px; }
.video-art > button.is-playing { color: white; background: var(--purple); }
.video-art:has(> button.is-playing) > img { animation: example-camera 5s ease-in-out infinite alternate; }
.video-art:has(> button.is-playing) .video-timeline i { animation: example-progress 5s linear infinite; }
.video-timeline { position: absolute; z-index: 5; right: 12px; bottom: 14px; left: 12px; display: flex; align-items: center; gap: 8px; color: white; font-size: 7px; }
.video-timeline::before { content: ''; flex: 1; height: 3px; background: rgba(255,255,255,.3); border-radius: 3px; }
.video-timeline i { position: absolute; left: 0; width: 58%; height: 3px; background: #8f71ff; border-radius: 3px; }
.video-art > b { position: absolute; z-index: 5; top: 10px; right: 10px; padding: 5px 7px; color: white; background: rgba(22,18,29,.62); border-radius: 6px; font-size: 8px; }
.video-concept-label { position:absolute; z-index:5; right:12px; bottom:12px; left:12px; padding:9px 12px; color:#fff; background:rgba(22,18,29,.78); border-radius:8px; font-size:10px; text-align:center; }
.batch-art { display: grid; grid-template-columns: repeat(3,1fr); gap: 4px; padding: 7px; background: linear-gradient(145deg,#20182d,#6040a7); }
.batch-art span { position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.24); border-radius: 6px; box-shadow: 0 4px 9px rgba(0,0,0,.18); }
.batch-art span:nth-child(2), .batch-art span:nth-child(5) { transform: translateY(5px); }
.batch-art img { transform: scale(1.12); }
.batch-art i { position: absolute; right: 3px; bottom: 3px; color: white; font-size: 6px; font-style: normal; }
.resize-art { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 14px; background: linear-gradient(145deg,#f3eefc,#d7ccef); }
.resize-art > span { position: relative; overflow: hidden; background: white; border: 2px solid white; border-radius: 6px; box-shadow: 0 8px 18px rgba(55,37,94,.22); }
.resize-art .ratio-square { width: 70px; height: 70px; }
.resize-art .ratio-post { width: 62px; height: 78px; }
.resize-art .ratio-story { width: 52px; height: 94px; }
.resize-art img { object-fit: cover !important; }
.resize-art i { position: absolute; right: 3px; bottom: 3px; padding: 2px 3px; color: white; background: rgba(30,22,41,.75); border-radius: 3px; font-size: 6px; font-style: normal; }
.suite-art { display: grid; grid-template-rows: 1.15fr .85fr; gap: 7px; padding: 7px; background: linear-gradient(155deg,#1b1624,#5e42b0); }
.suite-hero, .suite-grid span, .packaging-stack span, .closeup-grid span { position: relative; overflow: hidden; border-radius: 10px; }
.suite-hero { min-height: 115px; box-shadow: 0 12px 26px rgba(0,0,0,.24); }
.suite-hero::after { content:''; position:absolute; inset:0; background: linear-gradient(180deg,rgba(10,8,15,.08),rgba(10,8,15,.76)); }
.suite-hero-copy { position:absolute; left:10px; right:10px; bottom:10px; z-index:2; color:white; }
.suite-hero-copy small { display:block; color:#c7b8ff; font-size:7px; letter-spacing:.14em; }
.suite-hero-copy strong { display:block; margin-top:4px; font-size:12px; line-height:1.25; }
.suite-hero-copy span { display:inline-block; margin-top:6px; padding:4px 6px; color:#28194e; background:white; border-radius:5px; font-size:7px; font-weight:700; }
.suite-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; }
.suite-grid span { min-height: 54px; background:#251c35; }
.suite-grid img { transform: scale(1.1); }
.suite-grid i, .packaging-stack i, .closeup-grid i { position:absolute; left:5px; bottom:5px; z-index:2; color:white; font-style:normal; font-size:6px; background:rgba(20,14,28,.7); padding:3px 4px; border-radius:5px; }
.suite-grid b, .packaging-stack b, .closeup-grid b { position:absolute; top:5px; right:5px; z-index:2; color:#22163a; background:rgba(255,255,255,.92); font-size:6px; padding:2px 4px; border-radius:5px; }
.clone-art, .buyer-art, .endorse-art, .shoe-art, .accessory-art, .scene-art, .material-art, .packaging-art, .selling-art, .modelswap-art, .pose-art { display:grid; gap:6px; padding:7px; background:linear-gradient(155deg,#1d1826,#4c347f); color:white; }
.clone-art { grid-template-columns: 1fr auto 1fr; align-items:stretch; }
.clone-art figure, .modelswap-art figure { position:relative; overflow:hidden; border-radius:10px; background:#f5f1fb; }
.clone-art figcaption, .modelswap-art figcaption { position:absolute; left:8px; top:8px; padding:4px 6px; color:white; background:rgba(42,28,68,.75); border-radius:5px; font-size:7px; }
.clone-art > b, .modelswap-art > b { grid-column:1/-1; color:#dacdff; font-size:8px; line-height:1.45; }
.clone-art > em, .modelswap-art > em { position:absolute; right:10px; bottom:10px; color:#fff; font-style:normal; font-size:7px; letter-spacing:.14em; }
.pose-art { grid-template-rows: 1.05fr .82fr auto; background:radial-gradient(circle at 20% 12%,rgba(183,153,255,.36),transparent 34%),linear-gradient(150deg,#18131f,#3b245f 55%,#866be8); }
.pose-hero { position:relative; overflow:hidden; border-radius:12px; min-height:104px; background:#17131d; }
.pose-hero img { width:100%; height:100%; object-fit:cover; object-position:center 18%; opacity:.82; }
.pose-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(15,11,20,.8),rgba(15,11,20,.08)); }
.pose-hero-copy { position:absolute; z-index:2; left:10px; right:54px; bottom:10px; }
.pose-hero-copy small { display:block; color:#cdbfff; font-size:7px; font-weight:800; letter-spacing:.14em; }
.pose-hero-copy strong { display:block; margin-top:4px; font-size:12px; line-height:1.25; }
.pose-hero-copy span { display:block; margin-top:5px; color:#eee8ff; font-size:7px; line-height:1.45; }
.pose-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.pose-grid figure { position:relative; overflow:hidden; min-height:72px; margin:0; border:1px solid rgba(255,255,255,.14); border-radius:10px; background:#efeaf8; }
.pose-grid img { width:100%; height:100%; object-fit:cover; }
.pose-grid figure:nth-child(1) img { object-position:left center; }
.pose-grid figure:nth-child(2) img { object-position:center center; }
.pose-grid figure:nth-child(3) img { object-position:right center; }
.pose-grid figcaption { position:absolute; left:5px; bottom:5px; padding:3px 5px; color:white; background:rgba(20,15,28,.72); border-radius:999px; font-size:7px; font-weight:800; }
.pose-grid b { position:absolute; top:5px; right:5px; color:#2b1d44; background:rgba(255,255,255,.9); border-radius:6px; padding:2px 4px; font-size:6px; }
.pose-art > b { color:#ddd2ff; font-size:8px; line-height:1.45; }
.shoe-art .shoe-visual, .accessory-art .accessory-visual, .endorse-art .endorse-visual, .material-art .material-left, .material-art .material-right, .scene-art .scene-before, .scene-art .scene-after { position:relative; overflow:hidden; min-height:118px; border-radius:10px; background:#211926; }
.shoe-art .shoe-visual img, .accessory-art .accessory-visual img, .endorse-art .endorse-visual img, .material-art img, .scene-art img { width:100%; height:100%; object-fit:cover; }
.shoe-copy, .accessory-copy, .endorse-copy, .packaging-copy, .selling-copy { position:relative; padding:2px 2px 0; }
.shoe-copy small, .accessory-copy small, .endorse-copy small, .packaging-copy small, .selling-copy small { display:block; color:#c8b7ff; font-size:7px; letter-spacing:.14em; }
.shoe-copy strong, .accessory-copy strong, .endorse-copy strong, .packaging-copy strong, .selling-copy strong { display:block; margin-top:4px; font-size:12px; line-height:1.25; }
.shoe-copy span, .accessory-copy span, .endorse-copy span, .packaging-copy span, .selling-copy span { display:block; margin-top:5px; color:#ddd4ea; font-size:8px; line-height:1.45; }
.shoe-art > b, .accessory-art > b, .endorse-art > b, .packaging-art > b, .selling-art > b { color:#c9beff; font-size:8px; line-height:1.45; }
.buyer-top { display:grid; grid-template-columns:72px 1fr; gap:8px; align-items:center; }
.buyer-top img { width:72px; height:72px; object-fit:cover; border-radius:12px; }
.buyer-top small { display:block; color:#c6b6ff; font-size:7px; letter-spacing:.13em; }
.buyer-top strong { display:block; margin-top:4px; font-size:12px; }
.buyer-top span { display:inline-block; margin-top:5px; padding:3px 5px; background:rgba(255,255,255,.1); border-radius:999px; font-size:7px; }
.buyer-art blockquote { margin:0; padding:8px 10px; background:rgba(255,255,255,.08); border-left:3px solid rgba(183,153,255,.8); border-radius:8px; font-size:8px; line-height:1.5; }
.endorse-art .endorse-visual span, .scene-art .scene-before span, .scene-art .scene-after span { position:absolute; top:8px; left:8px; padding:4px 6px; color:white; background:rgba(26,16,42,.68); border-radius:999px; font-size:7px; }
.closeup-art, .packaging-art { display:grid; gap:6px; padding:7px; background:linear-gradient(155deg,#201a2c,#6040a7); }
.closeup-main { position:relative; overflow:hidden; min-height:108px; border-radius:12px; }
.closeup-main span { position:absolute; right:10px; bottom:10px; padding:4px 6px; color:white; background:rgba(27,18,44,.7); border-radius:999px; font-size:7px; }
.closeup-grid, .packaging-stack { display:grid; grid-template-columns:repeat(2,1fr); gap:5px; }
.closeup-grid span, .packaging-stack span { min-height:54px; background:#251c37; }
.closeup-grid img, .packaging-stack img { transform:scale(1.08); }
.selling-art { grid-template-columns: 1.15fr .85fr; align-items:stretch; }
.selling-copy { padding:6px 4px 4px; }
.selling-copy span { display:block; margin-top:6px; padding:5px 6px; background:rgba(255,255,255,.08); border-radius:8px; }
.scene-art { grid-template-columns: 1fr auto 1fr; align-items:stretch; }
.scene-art > b { grid-column:1/-1; color:#dccfff; font-size:8px; line-height:1.45; }
.material-art { grid-template-columns: 1fr 1fr; align-items:stretch; }
.material-art .material-left span, .material-art .material-right span { position:absolute; left:8px; top:8px; padding:4px 6px; color:white; background:rgba(16,13,20,.65); border-radius:999px; font-size:7px; }
.scene-art em { grid-column:1/-1; text-align:right; font-style:normal; font-size:7px; color:#d8cbff; letter-spacing:.13em; }
.packaging-copy { grid-column:1/-1; }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.prompt-assistant { margin-bottom: 14px; padding: 14px; background: linear-gradient(135deg,#f5f1ff,#fcfbff 55%,#f1edff); border: 1px solid #ded4fa; border-radius: 13px; box-shadow: 0 10px 25px rgba(89,63,156,.08); }
.prompt-assistant-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.prompt-assistant-head > div > span { display: block; color: var(--purple); font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.prompt-assistant-head strong { display: block; margin-top: 4px; color: #2d2638; font-size: 13px; }
.prompt-assistant-head small { display: block; margin-top: 3px; color: var(--ink-3); font-size: 8px; }
.prompt-ready { flex: 0 0 auto; padding: 5px 8px; color: var(--green); background: var(--green-soft); border-radius: 15px; font-size: 8px; font-weight: 700; }
.prompt-assistant-main { display: grid; grid-template-columns: minmax(0,1fr) 230px; gap: 10px; }
.prompt-keyword-box, .prompt-model-box { padding: 10px; background: rgba(255,255,255,.78); border: 1px solid rgba(105,78,170,.1); border-radius: 10px; }
.prompt-keyword-box label, .prompt-model-box label { display: block; margin-bottom: 6px; color: var(--ink-2); font-size: 9px; font-weight: 700; }
.prompt-keyword-box > div:first-of-type { display: flex; gap: 7px; }
.prompt-keyword-box input, .prompt-model-box select { min-width: 0; width: 100%; height: 37px; padding: 0 10px; background: white; border: 1px solid #dcd5e5; border-radius: 8px; outline: 0; font-size: 9px; }
.prompt-keyword-box input:focus, .prompt-model-box select:focus { border-color: #9a83df; box-shadow: 0 0 0 3px rgba(117,85,232,.08); }
.prompt-keyword-box .primary-button { flex: 0 0 auto; white-space: nowrap; }
.prompt-suggestions { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.prompt-suggestions button { padding: 4px 6px; color: #67557e; background: #f1edf7; border: 0; border-radius: 10px; font-size: 7px; }
.prompt-suggestions button:hover { color: var(--purple-dark); background: #e7defc; }
.prompt-model-box small { display: block; margin-top: 6px; color: var(--ink-3); font-size: 7px; line-height: 1.4; }
.prompt-style-row { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; margin-top: 10px; padding-top: 9px; border-top: 1px solid rgba(105,78,170,.12); }
.prompt-style-row > span { margin-right: 3px; color: var(--ink-3); font-size: 8px; font-weight: 700; }
.prompt-style-row button { padding: 5px 7px; color: #675d72; background: rgba(255,255,255,.72); border: 1px solid #ded8e6; border-radius: 13px; font-size: 8px; }
.prompt-style-row button.is-active { color: white; background: var(--purple); border-color: var(--purple); }
.assistant-layout { display:grid; grid-template-columns: 260px minmax(0,1fr) 330px; gap: 14px; }
.assistant-skill-panel, .assistant-chat-panel, .assistant-right-panel { min-height: 720px; }
.assistant-skill-list { display:grid; gap: 10px; }
.assistant-skill { width:100%; padding: 12px; border:1px solid var(--line); border-radius: 14px; background:#faf8fd; text-align:left; }
.assistant-skill.is-active { background: var(--purple-soft); border-color: #d9cdf8; }
.assistant-skill strong { display:block; font-size: 13px; }
.assistant-skill small { display:block; margin-top:4px; color: var(--ink-3); line-height: 1.55; }
.assistant-skill span { display:block; margin-top:8px; color: var(--purple); font-size: 10px; }
.assistant-hero-card { display:flex; justify-content:space-between; gap: 16px; padding: 16px; margin-bottom: 12px; border-radius: 16px; background: linear-gradient(135deg,#f3efff,#fff); border: 1px solid #e1d6fb; }
.assistant-hero-card h2 { margin: 4px 0 6px; font-size: 22px; }
.assistant-hero-card p { margin:0; color: var(--ink-3); line-height: 1.7; }
.assistant-hero-card > div > span { color: var(--purple); font-size: 11px; font-weight: 800; letter-spacing:.08em; }
.image-model-shelf { margin: 14px 0; padding: 14px; border: 1px solid #e0d7f7; border-radius: 18px; background: linear-gradient(135deg,#faf7ff,#fff); box-shadow: 0 12px 24px rgba(97,72,162,.06); }
.image-model-shelf.is-compact { padding: 12px; margin: 12px 0; }
.image-model-shelf-head { display:flex; justify-content:space-between; gap: 12px; align-items:flex-start; margin-bottom: 12px; }
.image-model-shelf-head span { color: var(--purple); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.image-model-shelf-head h2 { margin: 4px 0 5px; font-size: 16px; }
.image-model-shelf-head p { margin: 0; color: var(--ink-3); line-height: 1.55; font-size: 12px; }
.image-model-strategy { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.image-model-strategy span { padding:4px 8px; color: var(--purple-dark); background: rgba(124,92,255,.10); border-radius: 999px; font-size: 10px; font-weight: 700; }
.image-model-current { flex:0 0 auto; min-width: 132px; padding: 10px 12px; border-radius: 14px; background: rgba(124,92,255,.08); border: 1px solid rgba(124,92,255,.16); }
.image-model-current small { display:block; color: var(--ink-3); font-size: 10px; }
.image-model-current strong { display:block; margin-top: 4px; color: var(--purple-dark); font-size: 13px; }
.image-model-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; }
.image-model-card { padding: 13px; border: 1px solid var(--line); border-radius: 16px; background:#fff; text-align:left; box-shadow: 0 6px 16px rgba(33,24,57,.03); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.image-model-card:hover { transform: translateY(-2px); border-color: #ccbdf5; box-shadow: 0 12px 24px rgba(84,63,147,.08); }
.image-model-card.is-active { border-color: #9b7df0; background: linear-gradient(180deg,#f8f3ff,#fff); box-shadow: 0 14px 28px rgba(117,85,232,.12); }
.image-model-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap: 8px; }
.image-model-card-top strong { font-size: 13px; line-height: 1.4; }
.image-model-card-top span { color: var(--purple); font-size: 10px; font-weight: 700; text-align:right; }
.image-model-card p { margin: 8px 0 10px; color: var(--ink-3); font-size: 11px; line-height: 1.6; }
.image-model-card-foot { display:flex; align-items:center; justify-content:space-between; gap: 8px; }
.image-model-card-foot small { color: var(--ink-3); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.image-model-card-foot b { color: var(--purple-dark); font-size: 10px; }
.image-model-pickline { display:grid; grid-template-columns: 120px minmax(0,1fr); gap: 10px; align-items:center; margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(124,92,255,.12); }
.image-model-pickline label { color: var(--ink-2); font-size: 11px; font-weight: 700; }
.image-model-pickline select { width:100%; height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 12px; background:#fff; font-size: 11px; }
.image-model-pickline small { grid-column: 2; color: var(--ink-3); font-size: 10px; line-height: 1.5; }
.assistant-skill-proof { min-width: 140px; padding: 12px; border-radius: 14px; background: rgba(124,92,255,.08); border: 1px solid rgba(124,92,255,.18); }
.assistant-skill-proof strong { display:block; color: var(--purple-dark); }
.assistant-skill-proof small { display:block; margin-top: 5px; color: var(--ink-3); }
.assistant-quick-cards { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-bottom: 12px; }
.assistant-quick-cards button { padding: 12px; border:1px solid var(--line); border-radius: 14px; background:#fff; text-align:left; }
.assistant-quick-cards strong { display:block; font-size: 12px; }
.assistant-quick-cards small { display:block; margin-top:4px; color: var(--ink-3); line-height: 1.5; }
.assistant-message-list { display:grid; gap: 10px; max-height: 360px; overflow:auto; padding-right: 4px; }
.assistant-message { padding: 12px 14px; border-radius: 14px; line-height: 1.7; white-space: normal; }
.assistant-message.is-ai { background: linear-gradient(135deg,#f5f1ff,#fbf9ff); border:1px solid #dfd4fb; }
.assistant-message.is-user { background: rgba(46,211,183,.10); border:1px solid rgba(46,211,183,.20); }
.assistant-composer { display:grid; grid-template-columns: auto 190px minmax(0,1fr) auto auto; gap: 10px; margin-top: 12px; }
.assistant-composer input, .assistant-composer select { min-width:0; padding: 12px 13px; border:1px solid var(--line); border-radius: 12px; background:white; }
.assistant-tabs { display:grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-bottom: 10px; }
.assistant-tabs button { padding: 10px 8px; border:1px solid var(--line); border-radius: 12px; background:#faf8fc; font-size: 12px; }
.assistant-tabs button.is-active { background: var(--purple-soft); border-color: #dacffd; color: var(--purple-dark); }
.assistant-tab-desc { margin-bottom: 12px; color: var(--ink-3); font-size: 11px; line-height: 1.6; }
.assistant-empty { display:grid; place-items:center; gap: 8px; min-height: 220px; padding: 20px; color: var(--ink-3); text-align:center; background:#faf8fc; border: 1px dashed var(--line); border-radius: 16px; }
.assistant-empty span { font-size: 28px; color: var(--purple); }
.assistant-result, .assistant-reference { padding: 12px 14px; border:1px solid var(--line); border-radius: 14px; background:#fff; }
.assistant-result + .assistant-result { margin-top: 10px; }
.assistant-result strong, .assistant-reference strong { display:block; font-size: 13px; }
.assistant-result p, .assistant-reference small { display:block; margin: 6px 0 0; color: var(--ink-3); line-height: 1.6; }
.assistant-reference { display:grid; gap: 10px; }
.assistant-reference span { display:block; color: var(--purple); font-size: 10px; letter-spacing:.08em; text-transform:uppercase; }
.assistant-task-list { display:grid; gap: 10px; }
.assistant-task-list .task-row { background:#fff; border:1px solid var(--line); }
.assistant-dedupe-audit { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.assistant-audit-head strong { display:block; font-size: 13px; }
.assistant-audit-head small { display:block; margin-top: 4px; color: var(--ink-3); font-size: 11px; }
.assistant-audit-row { display:grid; grid-template-columns: auto 1fr; gap: 10px; align-items:flex-start; padding: 10px 0; border-bottom: 1px solid rgba(0,0,0,.04); }
.assistant-audit-row:last-child { border-bottom: 0; }
.audit-tag { display:inline-flex; align-items:center; justify-content:center; min-width: 46px; padding: 4px 8px; border-radius: 999px; font-size: 10px; font-weight: 700; }
.audit-tag.is-new { color: #1b8f72; background: rgba(46,211,183,.12); }
.audit-tag.is-reuse { color: var(--purple-dark); background: var(--purple-soft); }
.assistant-audit-row strong { display:block; font-size: 12px; }
.assistant-audit-row small { display:block; margin-top: 3px; color: var(--ink-3); line-height: 1.45; }
.fashion-input-guide { display:flex; align-items:center; flex-wrap:wrap; gap:6px; margin-top:10px; padding:10px 12px; color:var(--ink-2); background:#f8f6fb; border:1px solid #e6e0ec; border-radius:10px; }
.fashion-input-guide strong { margin-right:2px; font-size:8px; }
.fashion-input-guide span { display:flex; align-items:flex-start; gap:4px; max-width:330px; font-size:8px; line-height:1.45; }
.fashion-input-guide span i { display:grid; width:14px; height:14px; flex:0 0 auto; place-items:center; color:white; background:var(--purple); border-radius:50%; font-size:6px; font-style:normal; }
.fashion-input-guide small { width:100%; color:var(--ink-3); font-size:7px; }
.fashion-execution-panel { margin-top:14px; overflow:hidden; background:linear-gradient(145deg,#1b1722,#27202f); border:1px solid rgba(137,108,235,.34); border-radius:13px; box-shadow:0 13px 28px rgba(28,21,39,.12); color:white; }
.fashion-execution-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:14px 15px 12px; background:radial-gradient(circle at 85% 0,rgba(128,90,236,.28),transparent 42%); }
.fashion-execution-head span { display:block; color:#a98ff9; font-size:9px; font-weight:800; letter-spacing:.16em; }
.fashion-execution-head strong { display:block; margin-top:5px; font-size:14px; }
.fashion-execution-head small { display:block; margin-top:5px; color:#bfb6c9; font-size:10px; line-height:1.5; }
.fashion-execution-head > b { padding:6px 9px; color:#d9ceff; background:rgba(125,87,231,.18); border:1px solid rgba(163,135,244,.36); border-radius:20px; font-size:9px; letter-spacing:.1em; }
.fashion-pipeline { display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:rgba(255,255,255,.08); border-top:1px solid rgba(255,255,255,.07); border-bottom:1px solid rgba(255,255,255,.07); }
.fashion-pipeline > div { min-width:0; padding:9px 7px; background:rgba(18,15,23,.84); }
.fashion-pipeline i { display:block; color:#9a7cf2; font-size:9px; font-style:normal; font-weight:800; }
.fashion-pipeline span { display:block; margin-top:4px; color:#eeeaf2; font-size:9px; line-height:1.4; }
.fashion-contract-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:12px 15px; }
.fashion-contract-grid small { color:#a99eb3; font-size:9px; font-weight:700; }
.fashion-contract-grid p { display:flex; flex-wrap:wrap; gap:4px; margin:6px 0 0; }
.fashion-contract-grid p span { padding:5px 7px; color:#e4dee9; background:rgba(255,255,255,.06); border-radius:10px; font-size:9px; }
.fashion-execution-panel details { border-top:1px solid rgba(255,255,255,.08); }
.fashion-execution-panel summary { padding:11px 15px; color:#c9bfD1; cursor:pointer; font-size:10px; }
.fashion-execution-panel details > div { padding:0 15px 13px; }
.fashion-execution-panel details strong { display:block; margin-top:8px; color:#b59df8; font-size:10px; }
.fashion-execution-panel details p { margin:4px 0 0; color:#c9c1d1; font-size:10px; line-height:1.65; }
.task-fashion-audit { padding:11px 12px; background:var(--purple-soft); border:1px solid #e1d8fa; border-radius:10px; }
.task-fashion-audit p { display:flex; flex-wrap:wrap; gap:5px; margin:0; }
.task-fashion-audit p span { padding:4px 6px; color:var(--purple-dark); background:white; border-radius:10px; font-size:8px; }
.task-fashion-audit small { display:block; margin-top:8px; color:var(--ink-3); font-size:8px; }
.task-fashion-audit > b { display:block; margin-top:8px; color:var(--green); font-size:8px; }
.product-lock-result { margin-bottom:18px; padding:16px; background:linear-gradient(135deg,#f2fbf7,#f7f4ff); border:1px solid #d8ece3; border-radius:14px; }
.product-lock-result > div:first-child > span { color:var(--purple); font-size:11px; font-weight:800; letter-spacing:.08em; }
.product-lock-result > div:first-child > strong { display:block; margin-top:5px; color:#215f49; font-size:17px; }
.product-lock-result > div:first-child > p { margin:5px 0 0; color:var(--ink-2); font-size:13px; line-height:1.55; }
.product-lock-result-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-top:13px; }
.product-lock-result-grid span { padding:9px 8px; color:var(--ink-3); background:rgba(255,255,255,.82); border-radius:9px; font-size:11px; text-align:center; }
.product-lock-result-grid b { display:block; margin-bottom:2px; color:var(--ink); font-size:14px; }
.product-lock-result > small { display:block; margin-top:10px; color:#7a5f39; font-size:12px; line-height:1.5; }
.task-failure-panel { margin-bottom:18px; padding:16px; color:#622431; background:linear-gradient(135deg,#fff3f5,#fff8f5); border:1px solid #f0cbd1; border-radius:14px; }
.task-failure-panel > span { color:#b13a4d; font-size:10px; font-weight:900; letter-spacing:.1em; }
.task-failure-panel > strong { display:block; margin-top:5px; font-size:18px; }
.task-failure-panel > p { margin:6px 0 12px; color:#7f4a54; font-size:12px; line-height:1.6; }
.task-failure-panel > div { padding:10px 12px; background:rgba(255,255,255,.82); border-radius:10px; }
.task-failure-panel > div b,.task-failure-panel > div small { display:block; }
.task-failure-panel > div b { color:#8f3040; font-size:11px; }
.task-failure-panel > div small { margin-top:3px; color:#69464d; font-size:12px; line-height:1.5; }
.task-failure-panel > code { display:block; margin-top:10px; color:#9a6870; font-size:10px; }
.fashion-model-stack { margin-top:16px; }
.fashion-model-stack-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
.fashion-model-stack-grid > div { position:relative; min-width:0; padding:14px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.fashion-model-stack-grid span,.fashion-model-stack-grid strong,.fashion-model-stack-grid small { display:block; }
.fashion-model-stack-grid span { color:var(--ink-3); font-size:10px; }
.fashion-model-stack-grid strong { margin-top:5px; font-size:12px; line-height:1.4; }
.fashion-model-stack-grid small { margin-top:4px; color:var(--ink-3); font-size:9px; line-height:1.45; }
.fashion-model-stack-grid i { display:block; margin-top:8px; color:var(--purple); font-size:9px; font-style:normal; font-weight:700; }
.field { display: flex; flex-direction: column; gap: 7px; }
.required-mark { color: #c43d52; font-weight: 800; }
.admin-required-hint { margin: 8px 0 0; color: var(--ink-3); font-size: var(--text-xs); line-height: 1.55; }
.field.full { grid-column: 1 / -1; }
.field label { color: var(--ink-2); font-size: var(--text-xs); font-weight: 600; }
.field input, .field select, .field textarea { width: 100%; color: var(--ink); background: #fbfafc; border: 1px solid var(--line); border-radius: 9px; }
.field input, .field select { height: 43px; padding: 0 12px; }
.field output { display:flex; width:100%; min-height:43px; align-items:center; padding:0 12px; color:var(--ink-2); background:#f3f0f6; border:1px solid var(--line); border-radius:9px; font-weight:750; }
.field textarea { min-height: 85px; padding: 11px; resize: vertical; line-height: 1.6; }
.field-help { color: var(--ink-3); font-size: var(--text-xs); line-height: 1.55; }
.segmented { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; padding: 4px; background: var(--canvas); border-radius: 10px; }
.segmented button { min-height: 38px; background: transparent; border: 0; border-radius: 7px; color: var(--ink-3); font-size: var(--text-sm); }
.segmented button.is-active { color: var(--ink); background: white; box-shadow: var(--shadow-sm); font-weight: 600; }
.advanced-toggle { display: flex; width: 100%; align-items: center; justify-content: space-between; margin-top: 16px; padding: 15px 0; background: none; border: 0; border-top: 1px solid var(--line); font-size: var(--text-sm); font-weight: 600; }
.advanced-fields { display: none; padding-top: 4px; }
.advanced-fields.is-open { display: grid; }
.preview-panel { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.preview-stage { position: relative; display: grid; min-height: 320px; flex: 1; place-items: center; overflow: hidden; background-color: #ebe8ee; background-image: linear-gradient(45deg,#e0dce3 25%,transparent 25%),linear-gradient(-45deg,#e0dce3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e0dce3 75%),linear-gradient(-45deg,transparent 75%,#e0dce3 75%); background-size: 20px 20px; background-position: 0 0,0 10px,10px -10px,-10px 0; }
.preview-stage img { width: 100%; height: 100%; object-fit: cover; }
.empty-preview { max-width: 190px; padding: 20px; color: var(--ink-3); text-align: center; }
.empty-preview span { display: grid; width: 48px; height: 48px; margin: 0 auto 12px; place-items: center; color: var(--purple); background: rgba(255,255,255,.75); border-radius: 16px; font-size: 20px; }
.empty-preview strong { display: block; color: var(--ink-2); font-size: var(--text-base); }
.empty-preview p { margin: 8px 0 0; font-size: var(--text-xs); line-height: 1.6; }
.preview-footer { padding: 17px; background: white; border-top: 1px solid var(--line); }
.cost-line { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; color: var(--ink-3); font-size: var(--text-xs); }
.cost-line strong { color: var(--ink); font-size: 15px; }
.preview-footer .primary-button { width: 100%; }
.safety-note { display: flex; gap: 7px; margin-top: 11px; color: var(--ink-3); font-size: var(--text-xs); line-height: 1.5; }

.stepper { display: flex; align-items: center; margin: 4px 0 24px; }
.step { display: flex; align-items: center; gap: 9px; color: var(--ink-3); font-size: var(--text-xs); }
.step i { display: grid; width: 28px; height: 28px; place-items: center; background: white; border: 1px solid var(--line); border-radius: 50%; font-style: normal; }
.step.is-active { color: var(--purple-dark); font-weight: 600; }
.step.is-active i { color: white; background: var(--purple); border-color: var(--purple); }
.step-line { width: 70px; height: 1px; margin: 0 8px; background: var(--line); }
.modeling-layout { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(320px,.92fr); gap: 16px; }
.modeling-assurance { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 15px; margin-bottom: 16px; padding: 14px 18px; color: #eae5f1; background: linear-gradient(115deg,#211c29,#382a50); border: 1px solid #4b3b61; border-radius: 14px; }
.modeling-assurance > span { padding: 7px 9px; color: #bdaaff; background: rgba(126,91,235,.15); border-radius: 7px; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.modeling-assurance strong { display: block; font-size: 16px; }
.modeling-assurance p { margin: 4px 0 0; color: #c7c0cf; font-size: 13px; line-height: 1.55; }
.modeling-assurance > b { color: #86e1bd; font-size: 16px; white-space: nowrap; }
.capture-guide { padding: 24px; }
.capture-guide h2 { margin: 0 0 8px; font-size: var(--text-lg); }
.capture-guide > p { margin: 0 0 20px; color: var(--ink-3); font-size: var(--text-sm); line-height: 1.65; }
.angle-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.angle-grid-six { grid-template-columns: repeat(3,1fr); }
.angle-grid-dynamic { grid-template-columns: repeat(4,1fr); }
.angle-slot { position: relative; display: grid; aspect-ratio: 1; place-items: center; overflow: hidden; background: var(--canvas); border: 1px dashed #cac3d0; border-radius: 13px; }
.angle-slot.is-required { border-color: #ae9ce4; background: #faf8ff; }
.angle-slot img { position: absolute; width: 100%; height: 100%; object-fit: cover; }
.angle-slot .angle-label { position: absolute; left: 7px; bottom: 7px; z-index: 2; padding: 6px 9px; color: white; background: rgba(20,17,25,.8); border-radius: 6px; font-size: 12px; }
.angle-slot button { position: relative; z-index: 1; color: var(--purple); background: none; border: 0; font-size: 19px; }
.shot-number { position: absolute; top: 7px; right: 7px; z-index: 3; display: grid; width: 22px; height: 22px; place-items: center; color: #67557c; background: rgba(255,255,255,.85); border-radius: 7px; font-size: 7px; font-style: normal; font-weight: 800; }
.capture-plan-summary { display: grid; grid-template-columns: 96px 96px 1fr; align-items: center; gap: 10px; margin-bottom: 14px; padding: 12px; background: linear-gradient(135deg,#f6f2ff,#fbfafe); border: 1px solid #e5ddf6; border-radius: 12px; }
.capture-plan-summary > div { display: grid; place-items: center; padding: 8px; background: white; border-radius: 9px; }
.capture-plan-summary strong { color: var(--purple-dark); font-size: 23px; }.capture-plan-summary strong small { font-size: 12px; }.capture-plan-summary span { color: var(--ink-3); font-size: 12px; }
.capture-plan-summary p { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.6; }.capture-plan-summary p b { color: var(--purple-dark); }
.capture-rules { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }.capture-rules span { padding: 6px 9px; color: #4d4260; background: #f3f0f7; border-radius: 14px; font-size: 12px; }
.capture-score { display: flex; align-items: center; gap: 13px; margin-top: 18px; padding: 14px; background: var(--green-soft); border-radius: 12px; }
.score-ring { display: grid; width: 45px; height: 45px; place-items: center; color: var(--green); background: conic-gradient(var(--green) calc(var(--score,0) * 1%), #cce7dc 0); border-radius: 50%; }
.score-ring::after { content: 'AI'; display: grid; width: 35px; height: 35px; place-items: center; background: var(--green-soft); border-radius: 50%; font-size: 11px; font-weight: 700; }
.capture-score strong { display: block; font-size: var(--text-sm); }
.capture-score small { display: block; margin-top: 4px; color: #4c7b69; font-size: var(--text-xs); }
.modeling-preview-column { display: grid; min-width: 0; align-content: start; gap: 12px; }
.model-preview { position: relative; min-height: 390px; overflow: hidden; color: white; background: radial-gradient(circle at 50% 42%, #4b4159, #201d27 62%, #17161b); border-radius: var(--radius); }
.model-preview:not(.model-preview-style) { min-height:520px; }
.model-preview-style { min-height: 430px; background: radial-gradient(circle at 75% 12%,#4c3c65,#211c2a 55%,#17141c); box-shadow:0 18px 40px rgba(34,26,45,.18); }
.identity-product-stage { position:absolute; inset:54px 24px 82px; overflow:hidden; background-color:#f5f3f6; background-image:var(--identity-image); background-repeat:no-repeat; background-position:center; background-size:contain; border:1px solid rgba(255,255,255,.22); border-radius:18px; box-shadow:0 24px 45px rgba(4,3,7,.34),inset 0 0 0 1px rgba(255,255,255,.44); }
.identity-product-stage.identity-strip { right:auto; left:50%; width:min(62%,240px); transform:translateX(-50%); background-size:300% auto; }.identity-product-stage.identity-split { background-size:200% auto; }.identity-product-stage.crop-left { background-position:left center; }.identity-product-stage.crop-center { background-position:center; }.identity-product-stage.crop-right { background-position:right center; }
.identity-product-stage.identity-fashion-photo { background-size:cover; }.identity-product-stage.photo-dress { background-position:center 58%; }.identity-product-stage.photo-outerwear { background-position:center 46%; }.identity-product-stage.photo-knit { background-position:center 52%; }
.identity-product-stage.identity-product-photo { background-color:#e9e4ee; background-size:cover; }.identity-product-stage.photo-package { background-position:center 52%; }
.identity-product-stage.photo-category { background-position:center; }
.identity-preview-label { position:absolute; z-index:3; right:12px; bottom:12px; left:12px; padding:7px 9px; overflow:hidden; color:white; background:rgba(25,20,31,.68); border:1px solid rgba(255,255,255,.1); border-radius:9px; font-size:8px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; backdrop-filter:blur(10px); }
.identity-product-stage.has-upload { display:grid; place-items:center; background:linear-gradient(145deg,#f9f8fa,#ebe8ee); }.identity-uploaded-object { width:100%; height:100%; padding:12px; object-fit:contain; }
.identity-product-stage.is-empty { display:grid; place-content:center; justify-items:center; gap:7px; padding:30px; color:#6e6576; text-align:center; background:radial-gradient(circle at 50% 38%,#fff,#ece8f0 72%); }.identity-product-stage.is-empty > span { display:grid; width:44px; height:44px; place-items:center; color:var(--purple); background:#eee8ff; border-radius:14px; font-size:20px; }.identity-product-stage.is-empty strong { color:#413947; font-size:13px; }.identity-product-stage.is-empty small { max-width:240px; font-size:9px; line-height:1.55; }
.identity-product-stage.is-category-concept { isolation:isolate; display:flex; flex-direction:column; justify-content:flex-end; padding:28px; color:#fff; background:radial-gradient(circle at 72% 18%,color-mix(in srgb,var(--concept-accent) 66%,white),transparent 0 20%,transparent 44%),linear-gradient(145deg,var(--concept-dark),color-mix(in srgb,var(--concept-dark) 73%,#09070c)); border-color:rgba(255,255,255,.18); }
.identity-product-stage.is-category-concept::before { content:''; position:absolute; z-index:-1; right:-28px; bottom:52px; width:220px; height:76px; background:linear-gradient(145deg,color-mix(in srgb,var(--concept-accent) 80%,white),var(--concept-accent)); border-radius:50%; opacity:.7; filter:blur(.2px); transform:rotate(-9deg); box-shadow:0 28px 50px rgba(0,0,0,.32); }
.identity-concept-orbit { position:absolute; top:28px; right:32px; width:146px; height:146px; border:1px solid color-mix(in srgb,var(--concept-accent) 62%,white); border-radius:50%; opacity:.62; box-shadow:0 0 0 18px rgba(255,255,255,.025),0 0 0 42px rgba(255,255,255,.018); }.identity-concept-orbit::after { content:''; position:absolute; top:12px; right:20px; width:20px; height:20px; background:var(--concept-accent); border:5px solid rgba(255,255,255,.7); border-radius:50%; box-shadow:0 8px 24px color-mix(in srgb,var(--concept-accent) 66%,transparent); }
.identity-concept-mark { position:absolute; z-index:2; top:66px; right:65px; display:grid; width:82px; height:82px; place-items:center; color:#fff; background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.04)); border:1px solid rgba(255,255,255,.34); border-radius:28px; font-family:var(--display); font-size:38px; font-weight:900; text-shadow:0 10px 28px rgba(0,0,0,.34); backdrop-filter:blur(12px); transform:rotate(-6deg); }
.identity-concept-copy { position:relative; z-index:2; display:grid; gap:4px; max-width:75%; }.identity-concept-copy small { color:color-mix(in srgb,var(--concept-accent) 58%,white); font-size:8px; font-weight:800; letter-spacing:.12em; }.identity-concept-copy strong { font-size:18px; line-height:1.15; }.identity-concept-copy span { color:rgba(255,255,255,.7); font-size:9px; }.identity-product-stage.is-category-concept > p { position:relative; z-index:2; max-width:82%; margin:10px 0 0; color:rgba(255,255,255,.54); font-size:8px; line-height:1.5; }
.derived-preview-frame { position:absolute; inset:54px 24px 82px; overflow:hidden; background:#f2eff4; border:1px solid rgba(255,255,255,.18); border-radius:16px; box-shadow:0 24px 42px rgba(4,3,7,.38); }
.derived-preview-frame .derived-style-media { width:100%; height:100%; border-radius:0; }
.derived-preview-frame .derived-style-media > i,.derived-preview-frame .derived-style-media > b { top:12px; padding:6px 8px; font-size:9px; }
.derived-preview-frame .derived-style-media > i { left:12px; }.derived-preview-frame .derived-style-media > b { right:12px; }
.derived-preview-watermark { position:absolute; z-index:6; right:16px; bottom:15px; left:16px; display:grid; color:white; text-shadow:0 3px 12px rgba(0,0,0,.5); pointer-events:none; }
.derived-preview-watermark span { font-size:8px; font-weight:800; letter-spacing:.13em; opacity:.82; }.derived-preview-watermark strong { margin-top:2px; font-size:19px; }.derived-preview-watermark small { margin-top:2px; font-size:9px; opacity:.78; }
.preview-mode-switch button { width:auto; padding:0 10px; font-size:9px; font-weight:800; }
.preview-style-code { align-items:center; }.preview-style-code > span { padding:0 6px; color:#cbbcff; font-size:9px; font-weight:800; letter-spacing:.08em; }
.model-preview .grid-floor { position: absolute; left: -15%; right: -15%; bottom: -30%; height: 60%; transform: perspective(420px) rotateX(63deg); background-image: linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px); background-size: 35px 35px; }
.model-object { position: absolute; top: 50%; left: 50%; width: 160px; transform: translate(-50%,-52%); filter: drop-shadow(0 30px 20px rgba(0,0,0,.45)); animation: float 4s ease-in-out infinite; }
.model-apparel-object { position: absolute; top: 50%; left: 50%; width: 245px; height: 280px; transform: translate(-50%,-53%); background-image: url('/app/assets/examples/apparel-categories.png'); background-repeat: no-repeat; background-size: 300% auto; filter: drop-shadow(0 25px 20px rgba(0,0,0,.42)); animation: float 4s ease-in-out infinite; }
.model-apparel-object.apparel-left { background-position: left center; }.model-apparel-object.apparel-center { background-position: center center; }.model-apparel-object.apparel-right { background-position: right center; }
.model-softgoods-object { position: absolute; top: 50%; left: 50%; width: 285px; height: 245px; transform: translate(-50%,-52%); background-image: url('/app/assets/examples/softgoods-categories.png'); background-repeat: no-repeat; background-size: 300% auto; filter: drop-shadow(0 25px 20px rgba(0,0,0,.42)); animation: float 4s ease-in-out infinite; }
.model-softgoods-object.softgoods-left { background-position: left center; }.model-softgoods-object.softgoods-center { background-position: center center; }.model-softgoods-object.softgoods-right { background-position: right center; }
.model-preview-apparel { background: radial-gradient(circle at 50% 42%,#564a68,#24202c 62%,#17161b); }
.model-preview .model-object,.model-preview .model-apparel-object,.model-preview .model-softgoods-object { transition: transform .35s ease, filter .35s ease; }
.model-preview.is-focused .model-object,.model-preview.is-focused .model-apparel-object,.model-preview.is-focused .model-softgoods-object { transform: translate(-50%,-52%) scale(1.3); filter: drop-shadow(0 34px 24px rgba(0,0,0,.58)); }
.model-preview.is-wireframe::after { content:''; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(rgba(144,118,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(144,118,255,.2) 1px,transparent 1px); background-size:18px 18px; mix-blend-mode:screen; }
.model-preview.is-rotating .model-object,.model-preview.is-rotating .model-apparel-object,.model-preview.is-rotating .model-softgoods-object { animation:model-inspect 2.2s ease-in-out infinite; }
.model-toolbar button.is-active { color:white; background:var(--purple); }
@keyframes float { 50% { transform: translate(-50%,-55%); } }
@keyframes model-inspect { 0%,100% { transform:translate(-50%,-52%) scaleX(1); } 50% { transform:translate(-50%,-54%) scaleX(.78); } }
.model-toolbar { position: absolute; top: 13px; left: 13px; right: 13px; display: flex; justify-content: space-between; }
.glass-control { display: flex; gap: 5px; padding: 5px; background: rgba(20,17,24,.62); border: 1px solid rgba(255,255,255,.1); border-radius: 10px; backdrop-filter: blur(12px); }
.glass-control button { display: grid; width: 30px; height: 30px; place-items: center; color: #ddd7e5; background: transparent; border: 0; border-radius: 7px; }
.glass-control button:hover { background: rgba(255,255,255,.1); }
.model-caption { position: absolute; left: 20px; right: 20px; bottom: 18px; display: flex; align-items: flex-end; justify-content: space-between; }
.model-caption strong { display: block; font-size: var(--text-base); }
.model-caption small { color: #aaa4b0; font-size: var(--text-xs); }
.model-caption .status-badge { color: #92e0c2; background: rgba(48,151,113,.18); }
.modeling-style-dock { overflow:hidden; padding:15px; background:linear-gradient(145deg,#fff,#faf8ff); border-color:#ddd5f0; }
.style-dock-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.style-dock-head h3 { margin:4px 0 3px; font-size:17px; }.style-dock-head p { margin:0; color:var(--ink-3); font-size:13px; }.style-dock-head > b { display:grid; min-width:42px; height:32px; place-items:center; color:#fff; background:linear-gradient(135deg,#6f4fd6,#9d73f1); border-radius:9px; font-size:12px; box-shadow:0 8px 18px rgba(94,65,178,.23); }
.style-output-tabs { display:grid; grid-template-columns:repeat(5,minmax(52px,1fr)); gap:4px; margin-top:12px; padding:4px; background:#f1eef6; border-radius:11px; }
.style-output-tabs button { min-width:0; padding:7px 4px; color:var(--ink-3); background:transparent; border:0; border-radius:8px; text-align:center; }.style-output-tabs button.is-active { color:var(--purple-dark); background:#fff; box-shadow:0 5px 12px rgba(60,43,95,.1); }.style-output-tabs span,.style-output-tabs small { display:block; }.style-output-tabs span { font-size:10px; font-weight:800; }.style-output-tabs small { margin-top:2px; font-size:7px; }
.style-dock-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; margin-top:10px; }
.style-dock-card { min-width:0; padding:5px; overflow:hidden; text-align:left; background:#fff; border:1px solid #e5e0eb; border-radius:10px; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }.style-dock-card:hover { transform:translateY(-1px); border-color:#a58dec; }.style-dock-card.is-active { border-color:var(--purple); box-shadow:0 0 0 2px rgba(117,85,232,.12),0 7px 15px rgba(67,47,119,.12); }
.style-dock-card .derived-style-media { height:92px; border-radius:9px; }.style-dock-card .derived-style-media > b { display:none; }.style-dock-card .derived-style-media > i { display:block; top:6px; left:6px; padding:4px 5px; font-size:7px; }
.style-dock-card > span:last-child { display:block; min-width:0; padding:7px 3px 3px; }.style-dock-card strong,.style-dock-card small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.style-dock-card strong { color:var(--ink); font-size:13px; }.style-dock-card small { margin-top:3px; color:var(--ink-3); font-size:11px; }
.style-dock-card.is-active .derived-style-media::before { content:'✓'; position:absolute; z-index:7; right:5px; bottom:5px; display:grid; width:18px; height:18px; place-items:center; color:white; background:var(--purple); border:1px solid white; border-radius:50%; font-size:8px; font-weight:900; }
.style-dock-selection { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; padding:12px; background:#27212f; border-radius:11px; }.style-dock-selection > div { min-width:0; }.style-dock-selection small,.style-dock-selection strong,.style-dock-selection span { display:block; }.style-dock-selection small { color:#bdb4c6; font-size:11px; }.style-dock-selection strong { margin-top:2px; color:#fff; font-size:14px; }.style-dock-selection span { margin-top:3px; overflow:hidden; color:#c9c1cf; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.style-dock-selection .primary-button { flex:0 0 auto; padding:0 14px; min-height:38px; font-size:13px; }
.style-dock-guard { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }.style-dock-guard span { padding:5px 8px; color:#5c4d83; background:#f1edfb; border-radius:9px; font-size:11px; font-weight:700; }
.style-dock-reference { display:grid; grid-template-columns:auto 1fr 42px; align-items:center; gap:8px; margin-top:10px; padding-top:10px; border-top:1px solid var(--line); }.style-dock-reference > span { color:var(--ink-3); font-size:12px; line-height:1.5; }.style-dock-reference img { width:42px; height:34px; object-fit:cover; border-radius:7px; }
.fidelity-panel { margin-top: 16px; overflow: hidden; }
.fidelity-status { padding: 6px 9px; color: var(--green); background: var(--green-soft); border-radius: 16px; font-size: 10px; font-weight: 700; }
.fidelity-group-overview { display:flex; flex-wrap:wrap; gap:7px; padding:0 17px 14px; }.fidelity-group-overview span { display:flex; align-items:center; gap:5px; padding:7px 10px; color:var(--ink-3); background:#f6f4f8; border:1px solid #ebe7ef; border-radius:18px; font-size:12px; }.fidelity-group-overview b { color:var(--ink-2); font-size:12px; }
.fidelity-lock-groups { display:grid; gap:10px; padding:0 17px 16px; }.fidelity-lock-group { overflow:hidden; background:#fcfbfd; border:1px solid var(--line); border-radius:13px; }.fidelity-lock-group[open] { background:#fff; border-color:#ddd6ea; box-shadow:0 8px 22px rgba(40,28,61,.055); }.fidelity-lock-group > summary { display:flex; align-items:center; justify-content:space-between; min-height:62px; padding:12px 14px; cursor:pointer; list-style:none; }.fidelity-lock-group > summary::-webkit-details-marker { display:none; }.fidelity-lock-group > summary > span { display:grid; grid-template-columns:34px auto; column-gap:10px; align-items:center; }.fidelity-lock-group > summary i { grid-row:1 / 3; display:grid; width:34px; height:34px; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:9px; font-size:11px; font-style:normal; font-weight:900; }.fidelity-lock-group > summary strong { font-size:15px; }.fidelity-lock-group > summary small { color:var(--ink-3); font-size:12px; }.fidelity-lock-group > summary > b { color:var(--ink-3); font-size:14px; transition:transform .18s ease; }.fidelity-lock-group[open] > summary > b { transform:rotate(180deg); }.fidelity-lock-group > .fidelity-lock-grid { padding:0 12px 12px; border-top:1px solid #f0edf3; }
.fidelity-lock-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; padding: 17px; }
.fidelity-lock { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; align-items: start; gap: 10px; min-width: 0; padding: 14px; background: #faf9fb; border: 1px solid var(--line); border-radius: 11px; }
.fidelity-lock.is-critical { background: linear-gradient(135deg,#f8f5ff,#fff); border-color: #dcd2fb; }
.fidelity-lock > span { display: grid; width: 28px; height: 28px; place-items: center; color: var(--purple); background: var(--purple-soft); border-radius: 7px; font-size: 12px; }
.fidelity-lock strong { display: block; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.fidelity-lock small { display: block; margin-top: 4px; color: var(--ink-3); font-size: 12px; line-height:1.45; }
.fidelity-lock .toggle { transform: scale(.78); transform-origin: right; }
.fidelity-lock-content { min-width:0; }
.lock-observation { display:grid; grid-template-columns:148px minmax(0,1fr); gap:9px; margin-top:11px; }
.lock-observation label { display:grid; gap:3px; min-width:0; }
.lock-observation label > span { color:var(--ink-3); font-size:12px; font-weight:700; }
.lock-observation select,.lock-observation input { width:100%; height:36px; min-width:0; padding:0 10px; color:var(--ink-2); background:#fff; border:1px solid #e1dce7; border-radius:7px; font:inherit; font-size:13px; outline:none; }
.lock-observation select:focus,.lock-observation input:focus { border-color:#9a7df0; box-shadow:0 0 0 2px rgba(126,91,235,.1); }
.lock-observation em { grid-column:1 / -1; color:#7c6d93; font-size:11px; line-height:1.45; font-style:normal; }
.lock-required { width:auto!important; height:auto!important; padding:6px 9px; color:#6d51c7!important; background:#eee9ff!important; border-radius:12px!important; font-size:11px!important; font-weight:800; white-space:nowrap; }
.fidelity-thresholds { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 17px 17px; }
.fidelity-thresholds span { padding: 7px 10px; color: #4b3d79; background: #f2effa; border-radius: 15px; font-size: 12px; font-weight: 700; }
.model-output-studio { margin-top: 16px; overflow: hidden; }
.model-output-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; padding: 0 17px 17px; }
.model-output-card { display: grid; min-width: 0; grid-template-columns: 94px minmax(0,1fr); gap: 13px; min-height: 132px; padding: 9px; text-align: left; background: linear-gradient(145deg,#fff,#f8f5ff); border: 1px solid #ded7f1; border-radius: 15px; box-shadow: 0 8px 20px rgba(70,50,120,.06); transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.model-output-card:hover { border-color: #9c82ee; transform: translateY(-2px); box-shadow: 0 13px 28px rgba(70,50,120,.12); }
.model-output-card.is-active { border-color: var(--purple); box-shadow: 0 0 0 2px rgba(117,85,232,.1),0 14px 28px rgba(80,54,165,.13); }
.model-output-copy { display: flex; min-width: 0; align-items: flex-start; flex-direction: column; padding: 5px 4px 4px 0; }
.model-output-copy > small { color: #8a72d6; font-size: 9px; font-weight: 800; letter-spacing: .06em; }
.model-output-copy > strong { margin-top: 6px; color: var(--ink); font-size: 15px; }
.model-output-copy > span { margin-top: 5px; color: var(--ink-3); font-size: 11px; line-height: 1.5; }
.model-output-copy > em { margin-top: auto; padding-top: 8px; color: var(--purple); font-size: 10px; font-style: normal; font-weight: 800; }
.derived-style-media { position:relative; display:block; height:155px; overflow:hidden; isolation:isolate; background-color:#eeeaf2; border-radius:12px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.35); }
.derived-style-media > img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.derived-style-media.has-dedicated-media { background:#eeeaf2; }
.derived-style-media.category-placeholder { background-image:radial-gradient(circle at 78% 10%,color-mix(in srgb,var(--concept-accent) 65%,white),transparent 0 17%,transparent 42%),linear-gradient(145deg,var(--concept-dark),color-mix(in srgb,var(--concept-dark) 72%,#08070b))!important; }
.derived-style-media.category-placeholder::after { content:''; position:absolute; z-index:1; right:-10%; bottom:-30%; width:78%; height:60%; background:linear-gradient(145deg,color-mix(in srgb,var(--concept-accent) 80%,white),var(--concept-accent)); border:1px solid rgba(255,255,255,.22); border-radius:50%; opacity:.58; box-shadow:0 20px 34px rgba(0,0,0,.34); }
.derived-style-media.category-placeholder .category-concept { position:absolute; z-index:3; inset:0; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; padding:12px; color:#fff; background:linear-gradient(180deg,transparent 28%,rgba(5,4,8,.72)); }
.derived-style-media.category-placeholder .category-concept em { position:absolute; top:50%; left:50%; display:grid; width:42px; height:42px; place-items:center; color:#fff; background:linear-gradient(145deg,rgba(255,255,255,.25),rgba(255,255,255,.06)); border:1px solid rgba(255,255,255,.35); border-radius:14px; font-size:18px; font-style:normal; font-weight:900; backdrop-filter:blur(9px); transform:translate(-50%,-64%); box-shadow:0 12px 30px rgba(0,0,0,.28); }
.derived-style-media.category-placeholder .category-concept strong { display:block; max-width:92%; font-size:10px; line-height:1.35; }.derived-style-media.category-placeholder .category-concept small { margin-top:3px; color:color-mix(in srgb,var(--concept-accent) 52%,white); font-size:7px; font-weight:700; }
.derived-style-media.category-placeholder.is-compact .category-concept { padding:7px; }.derived-style-media.category-placeholder.is-compact .category-concept em { width:30px; height:30px; border-radius:10px; font-size:13px; }.derived-style-media.category-placeholder.is-compact .category-concept strong { font-size:8px; }.derived-style-media.category-placeholder.is-compact .category-concept small { display:none; }
.derived-style-media.is-compact { height: 112px; border-radius: 10px; }
.derived-style-media > i,.derived-style-media > b { position: absolute; z-index: 4; top: 8px; padding: 4px 6px; border-radius: 8px; font-size: 8px; font-style: normal; line-height: 1; backdrop-filter: blur(9px); }
.derived-style-media > i { left: 8px; color: #fff; background: rgba(19,16,24,.66); font-weight: 800; letter-spacing: .04em; }
.derived-style-media > b { right: 8px; color: #493b70; background: rgba(255,255,255,.82); }
.derived-style-media.is-compact > i { display: none; }
.derived-style-media.is-compact > b { top: 7px; right: 7px; }
.derived-style-media::after { content:''; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 60%,rgba(20,16,25,.16)); }
.derived-style-library { margin: 0 17px 17px; padding: 18px; background: linear-gradient(145deg,#201c29,#2e273a); border: 1px solid rgba(255,255,255,.08); border-radius: 17px; box-shadow: 0 18px 38px rgba(32,24,48,.2); }
.derived-style-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:15px; }
.derived-style-head .eyebrow { color:#a993f2; }.derived-style-head h3 { margin:5px 0 5px; color:#fff; font-size:19px; }.derived-style-head p { max-width:710px; margin:0; color:#c1bac8; font-size:13px; line-height:1.6; }
.derived-style-head > span { flex:0 0 auto; padding:7px 10px; color:#d4c7ff; background:rgba(143,111,238,.15); border:1px solid rgba(169,147,242,.22); border-radius:15px; font-size:11px; font-weight:700; }
.derived-style-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; }
.derived-style-card { display:block; min-width:0; padding:7px; overflow:hidden; color:inherit; text-align:left; background:#fdfcfe; border:1px solid rgba(255,255,255,.12); border-radius:14px; box-shadow:0 8px 16px rgba(6,4,10,.13); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.derived-style-card:hover { transform:translateY(-2px); border-color:#a88cff; box-shadow:0 13px 24px rgba(6,4,10,.25); }
.derived-style-card.is-active { border-color:#a88cff; box-shadow:0 0 0 2px rgba(157,126,245,.32),0 14px 26px rgba(5,3,9,.28); }
.derived-style-card.is-active .derived-style-media::before { content:'✓'; position:absolute; z-index:5; right:8px; bottom:8px; display:grid; width:23px; height:23px; place-items:center; color:white; background:var(--purple); border:2px solid white; border-radius:50%; font-size:11px; font-weight:900; box-shadow:0 5px 12px rgba(50,31,110,.32); }
.derived-style-copy { display:block; padding:10px 5px 5px; }
.derived-style-copy > span { display:flex; align-items:center; gap:6px; }.derived-style-copy strong { color:#24202a; font-size:14px; }.derived-style-copy em { padding:3px 6px; color:#7252d4; background:#eee9ff; border-radius:7px; font-size:10px; font-style:normal; font-weight:800; }
.derived-style-copy small { display:block; min-height:40px; margin-top:5px; color:#706a77; font-size:12px; line-height:1.55; }.derived-style-copy > b { display:block; margin-top:5px; overflow:hidden; color:#8d8495; font-size:11px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.derived-style-selection { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:12px; margin-top:14px; padding:13px 14px; color:white; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.09); border-radius:13px; }
.derived-selection-check { display:grid; width:32px; height:32px; place-items:center; color:white; background:linear-gradient(135deg,#7f5de9,#a77df4); border-radius:10px; font-weight:900; }
.derived-style-selection small { display:block; color:#bdb4c6; font-size:11px; }.derived-style-selection strong { display:block; margin-top:2px; font-size:15px; }.derived-style-selection p { margin:3px 0 0; color:#c9c1cf; font-size:12px; }
.derived-style-actions { display:flex; align-items:center; gap:13px; }.derived-style-actions > span { color:#bdb4c6; font-size:11px; line-height:1.5; text-align:right; }.derived-style-actions > span b { color:#8fe0bf; }
.derived-style-policy { display:flex; flex-wrap:wrap; gap:7px; margin-top:11px; }.derived-style-policy span { padding:6px 8px; color:#c8c0cf; background:rgba(255,255,255,.055); border-radius:8px; font-size:11px; }
.model-reference-upload { display: grid; grid-template-columns: auto 1fr 62px; align-items: center; gap: 12px; margin: 0 17px 17px; padding: 12px; background: #faf9fc; border: 1px dashed #d8cff2; border-radius: 12px; }
.model-reference-upload span { color: var(--ink-3); font-size: 10px; line-height: 1.5; }
.model-reference-upload img { width: 62px; height: 48px; object-fit: cover; border-radius: 8px; }
.model-case-section { margin-top: 16px; }
.model-case-section > .panel-header { padding-right: 0; padding-left: 0; }
.model-case-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; }
.model-case-card { overflow: hidden; background: white; border: 1px solid var(--line); border-radius: 13px; box-shadow: var(--shadow-sm); }
.model-case-image { position: relative; height: 210px; background-image: url('/app/assets/examples/apparel-categories.png'); background-repeat: no-repeat; background-size: 300% auto; }
.model-case-image.apparel-left { background-position: left center; }
.model-case-image.apparel-center { background-position: center center; }
.model-case-image.apparel-right { background-position: right center; }
.model-case-image.softgoods-left, .model-case-image.softgoods-center, .model-case-image.softgoods-right { background-image: url('/app/assets/examples/softgoods-categories.png'); }
.model-case-image.softgoods-left { background-position: left center; }.model-case-image.softgoods-center { background-position: center center; }.model-case-image.softgoods-right { background-position: right center; }
.model-case-image span { position: absolute; top: 10px; left: 10px; padding: 5px 7px; color: #21684f; background: rgba(235,255,247,.9); border-radius: 15px; backdrop-filter: blur(8px); font-size: 9px; font-weight: 700; }
.model-case-card > div:last-child { padding: 13px; }
.model-case-card strong { display: block; font-size: 13px; }
.model-case-card p { margin: 5px 0; color: var(--ink-2); font-size: 9px; }
.model-case-card small { color: var(--ink-3); font-size: 8px; }
.category-concept-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; margin-top:13px; }
.category-concept-tile { position:relative; min-height:182px; overflow:hidden; padding:14px; color:#fff; background:radial-gradient(circle at 82% 12%,color-mix(in srgb,var(--concept-accent) 68%,white),transparent 0 14%,transparent 38%),linear-gradient(145deg,var(--concept-dark),color-mix(in srgb,var(--concept-dark) 75%,#08070a)); border:1px solid rgba(255,255,255,.15); border-radius:14px; box-shadow:0 16px 32px color-mix(in srgb,var(--concept-dark) 32%,transparent); }
.category-concept-tile::after { content:''; position:absolute; right:-24px; bottom:34px; width:120px; height:38px; background:linear-gradient(145deg,color-mix(in srgb,var(--concept-accent) 80%,white),var(--concept-accent)); border-radius:50%; opacity:.63; transform:rotate(-10deg); box-shadow:0 16px 28px rgba(0,0,0,.28); }
.category-concept-tile > div { position:relative; height:72px; }.category-concept-tile > div > span { position:absolute; z-index:2; top:7px; right:17px; display:grid; width:52px; height:52px; place-items:center; color:#fff; background:linear-gradient(145deg,rgba(255,255,255,.24),rgba(255,255,255,.05)); border:1px solid rgba(255,255,255,.34); border-radius:17px; font-size:22px; font-weight:900; backdrop-filter:blur(10px); transform:rotate(-6deg); box-shadow:0 12px 24px rgba(0,0,0,.22); }.category-concept-tile > div > i { position:absolute; top:-22px; right:-14px; width:98px; height:98px; border:1px solid color-mix(in srgb,var(--concept-accent) 58%,white); border-radius:50%; opacity:.5; box-shadow:0 0 0 15px rgba(255,255,255,.025); }
.category-concept-tile > small { color:color-mix(in srgb,var(--concept-accent) 52%,white); font-size:7px; font-weight:800; letter-spacing:.08em; }.category-concept-tile > strong { display:block; margin-top:4px; font-size:12px; }.category-concept-tile > p { position:relative; z-index:2; min-height:28px; margin:6px 0; color:rgba(255,255,255,.66); font-size:8px; line-height:1.45; }.category-concept-tile > b { position:relative; z-index:2; color:rgba(255,255,255,.42); font-size:7px; font-weight:700; }
.category-concept-tile.has-category-photo { background-image:linear-gradient(180deg,rgba(12,10,15,.04) 18%,rgba(12,9,16,.3) 52%,rgba(9,7,12,.94) 100%),var(--category-image); background-position:center; background-size:cover; }
.category-concept-tile.has-category-photo::after { display:none; }
.category-concept-tile.has-category-photo > div { height:78px; }
.category-concept-tile.has-category-photo > div > i { border-color:rgba(255,255,255,.48); }
.category-concept-tile.has-category-photo > small,.category-concept-tile.has-category-photo > strong,.category-concept-tile.has-category-photo > p,.category-concept-tile.has-category-photo > b { text-shadow:0 2px 12px rgba(0,0,0,.7); }

.detail-policy { display: flex; align-items: center; gap: 9px; margin-bottom: 16px; padding: 12px 15px; color: #ddd6e6; background: #211d27; border-radius: 12px; font-size: 9px; }
.detail-policy span { padding: 5px 7px; color: #b9a5ff; background: rgba(126,91,235,.16); border-radius: 6px; font-weight: 800; }
.detail-policy i { color: #7e5bea; font-style: normal; }
.detail-policy b { margin-left: auto; color: #75d8b2; }
.detail-case-hero { overflow: hidden; padding: 22px; background: radial-gradient(circle at 80% 10%,#f2edff,white 46%); }
.detail-case-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.detail-case-head h2 { margin: 6px 0 7px; font-size: 21px; }
.detail-case-head p { max-width: 650px; margin: 0; color: var(--ink-3); font-size: 10px; line-height: 1.65; }
.detail-case-badge { padding: 7px 10px; color: var(--purple-dark); background: var(--purple-soft); border-radius: 15px; font-size: 9px; font-weight: 700; }
.detail-compare { display: grid; grid-template-columns: minmax(200px,.85fr) 130px minmax(230px,1fr); align-items: center; gap: 18px; max-width: 850px; margin: 22px auto 0; }
.detail-phone { position: relative; height: 440px; overflow: hidden; background: white; border: 7px solid #201b27; border-radius: 25px; box-shadow: 0 20px 45px rgba(35,26,48,.18); }
.detail-phone > small { position: absolute; z-index: 8; top: 10px; left: 10px; padding: 5px 7px; color: white; background: rgba(20,16,25,.7); border-radius: 10px; font-size: 7px; }
.reference-hero { height: 165px; background: linear-gradient(145deg,#7d7488,#332d3e); }
.reference-hero::after { content: ''; display: block; width: 70px; height: 95px; margin: auto; transform: translateY(32px); background: linear-gradient(145deg,#b0a5b8,#5a5263); border-radius: 35% 35% 15% 15%; box-shadow: 0 18px 25px rgba(0,0,0,.3); }
.reference-hero em { position: absolute; z-index: 2; top: 100px; right: 15px; color: white; font-size: 8px; font-style: normal; }
.reference-grid, .rebuilt-grid { display: grid; grid-template-columns: 1fr 1fr; height: 88px; gap: 4px; padding: 4px; }
.reference-grid i { background: linear-gradient(135deg,#d5d0d9,#aaa3b0); }
.reference-copy { display: grid; gap: 8px; padding: 16px; }
.reference-copy i { display: block; height: 8px; background: #d8d3dc; border-radius: 6px; }
.reference-copy i:nth-child(2) { width: 76%; }.reference-copy i:nth-child(3) { width: 55%; }
.reference-strip { height: 90px; background: linear-gradient(145deg,#bbb4c2,#ece8f0); }
.detail-phone > b { position: absolute; z-index: 8; right: 8px; bottom: 8px; left: 8px; padding: 6px; color: white; background: rgba(24,19,30,.76); border-radius: 8px; font-size: 7px; text-align: center; }
.detail-transform { display: grid; justify-items: center; gap: 7px; color: var(--ink-2); text-align: center; }
.detail-transform > span { display: grid; width: 48px; height: 48px; place-items: center; color: white; background: linear-gradient(135deg,#7555e8,#a178ff); border-radius: 15px; box-shadow: 0 10px 22px rgba(112,77,220,.28); font-weight: 800; }
.detail-transform strong { font-size: 10px; }.detail-transform i { color: var(--purple); font-size: 28px; font-style: normal; }.detail-transform small { color: var(--ink-3); font-size: 8px; line-height: 1.6; }
.rebuilt-page { border-color: #5d43ba; }
.rebuilt-hero { position: relative; height: 165px; overflow: hidden; background: #2a203d; }
.rebuilt-hero img, .rebuilt-grid img, .rebuilt-strip img { width: 100%; height: 100%; object-fit: cover; }
.rebuilt-hero span { position: absolute; z-index: 2; top: 30px; left: 15px; color: white; font-size: 16px; font-weight: 800; line-height: 1.05; text-shadow: 0 3px 10px rgba(0,0,0,.4); }
.rebuilt-copy { padding: 13px 15px; }.rebuilt-copy strong { display: block; font-size: 11px; }.rebuilt-copy p { margin: 5px 0 0; color: var(--ink-3); font-size: 7px; }.rebuilt-strip { height: 110px; }
.detail-workspace { display: grid; grid-template-columns: 1fr .8fr 1.1fr; gap: 14px; margin-top: 16px; }
.detail-workspace > .panel { padding: 18px; }
.detail-workspace .panel-header { padding: 0 0 15px; }
.detail-dropzone { display: grid; min-height: 180px; width: 100%; place-items: center; align-content: center; color: var(--ink-3); background: #faf8fc; border: 1px dashed #bfb4cf; border-radius: 13px; text-align: center; }
.detail-dropzone:hover { color: var(--purple); background: #f7f3ff; border-color: #8d72df; }
.detail-dropzone span { display: grid; width: 38px; height: 38px; place-items: center; color: var(--purple); background: white; border: 1px solid var(--line); border-radius: 11px; font-size: 18px; }
.detail-dropzone strong { margin-top: 10px; font-size: 11px; }.detail-dropzone small { max-width: 220px; margin-top: 5px; font-size: 8px; line-height: 1.5; }
.detail-source-row { display: flex; gap: 7px; margin-top: 10px; }.detail-source-row input { min-width: 0; flex: 1; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; font-size: 9px; }
.rights-check { display: flex; gap: 9px; margin-top: 12px; padding: 10px; background: var(--green-soft); border-radius: 10px; }.rights-check > span { color: var(--green); }.rights-check strong,.rights-check small { display: block; }.rights-check strong { font-size: 9px; }.rights-check small { margin-top: 3px; color: #4b7b69; font-size: 7px; line-height: 1.4; }
.detail-module-list { display: grid; gap: 7px; }.detail-module { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 8px; width: 100%; padding: 9px; color: var(--ink-2); background: #faf9fb; border: 1px solid var(--line); border-radius: 9px; text-align: left; }.detail-module.is-active { color: var(--purple-dark); background: var(--purple-soft); border-color: #d5cafa; }.detail-module > span { display: grid; width: 28px; height: 28px; place-items: center; background: white; border-radius: 7px; font-size: 8px; }.detail-module strong,.detail-module small { display: block; }.detail-module strong { font-size: 10px; }.detail-module small { margin-top: 2px; color: var(--ink-3); font-size: 7px; }.detail-module i { color: var(--green); font-style: normal; }
.detail-detected { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 11px; color: #8a3d3d; background: #fff2f2; border-radius: 10px; }.detail-detected > span { font-size: 23px; font-weight: 800; }.detail-detected strong,.detail-detected small { display: block; }.detail-detected strong { font-size: 9px; }.detail-detected small { margin-top: 3px; font-size: 7px; }
.detail-asset-mini { display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 9px; margin: 10px 0 15px; padding: 8px; background: #f7f5f9; border-radius: 10px; }.detail-asset-mini img { width: 52px; height: 52px; object-fit: cover; border-radius: 8px; }.detail-asset-mini strong,.detail-asset-mini small { display: block; }.detail-asset-mini strong { font-size: 9px; }.detail-asset-mini small { margin-top: 3px; color: var(--ink-3); font-size: 7px; }.detail-asset-mini > span { color: var(--green); font-size: 9px; font-weight: 800; }
.creative-locks { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 15px; }.creative-locks button { display: flex; align-items: center; gap: 6px; padding: 8px; color: #54446e; background: #f5f1fd; border: 1px solid #e2d9f7; border-radius: 8px; font-size: 8px; text-align: left; }.creative-locks button span { color: var(--purple); }
.brand-clean-grid { display: flex; flex-wrap: wrap; gap: 5px; }.brand-clean-grid span { padding: 5px 7px; color: #8d4040; background: #fff1f1; border-radius: 12px; font-size: 7px; font-weight: 700; }.detail-run { width: 100%; margin-top: 15px; }

.brand-layout { display: grid; grid-template-columns: 340px 1fr; gap: 16px; }
.brand-kit { overflow: hidden; }
.brand-kit-cover { padding: 26px; color: white; background: linear-gradient(135deg, #211e28, #5e43b4); }
.brand-kit-cover small { color: #c8c1d0; font-size: 11px; }
.brand-kit-cover h2 { margin: 9px 0 22px; font-size: 22px; }
.swatches { display: flex; gap: 8px; }
.swatches i { width: 30px; height: 30px; border: 2px solid rgba(255,255,255,.45); border-radius: 50%; }
.brand-details { padding: 20px; }
.brand-row { display: flex; align-items: center; justify-content: space-between; padding: 13px 0; border-bottom: 1px solid var(--line); }
.brand-row:last-child { border-bottom: 0; }
.brand-row span { color: var(--ink-3); font-size: var(--text-sm); }
.brand-row strong { font-size: var(--text-sm); }
.template-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.template-card { overflow: hidden; background: white; border: 1px solid var(--line); border-radius: 13px; }
.template-card:hover { border-color: #bfb6cb; box-shadow: var(--shadow-sm); }
.template-cover { position: relative; height: 178px; overflow: hidden; background: var(--soft); }
.template-cover img { width: 100%; height: 100%; object-fit: cover; }
.template-config-preview { width: 100%; height: 100%; display: grid; align-content: center; gap: 6px; padding: 24px; color: #fff; background: linear-gradient(135deg,#241d35,#6d52c7 58%,#8fb8a9); }
.template-config-preview span, .template-config-preview small { color: rgba(255,255,255,.78); font-size: 11px; }
.template-config-preview strong { font-size: 20px; }
.template-evidence-label { position: absolute; left: 10px; bottom: 10px; z-index: 1; padding: 5px 8px; color: #fff; background: rgba(20,16,28,.72); border-radius: 999px; font-size: 9px; }
.template-overlay { position: absolute; inset: 0; display: grid; place-items: center; opacity: 0; background: rgba(21,17,27,.42); transition: .2s; }
.template-card:hover .template-overlay { opacity: 1; }
.template-info { padding: 12px; }
.template-info strong { display: block; font-size: var(--text-base); }
.template-info small { color: var(--ink-3); font-size: var(--text-xs); }
.template-info .text-button { margin-top: 10px; }

.task-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 16px; }
.summary-chip { display: flex; align-items: center; gap: 12px; padding: 15px; background: white; border: 1px solid var(--line); border-radius: 13px; }
.summary-chip i { display: grid; width: 35px; height: 35px; place-items: center; background: var(--soft); border-radius: 10px; font-style: normal; }
.summary-chip strong { display: block; font-size: 16px; }
.summary-chip small { color: var(--ink-3); font-size: var(--text-xs); }
.tasks-table { overflow: hidden; }
.table-header, .table-row { display: grid; grid-template-columns: minmax(220px,1.4fr) 130px 110px 100px 100px 90px 55px; align-items: center; gap: 12px; padding: 0 18px; }
.table-header { min-height: 46px; color: var(--ink-3); background: #faf9fb; border-bottom: 1px solid var(--line); font-size: var(--text-xs); font-weight: 600; }
.table-row { min-height: 76px; border-bottom: 1px solid var(--line); font-size: var(--text-sm); }
.table-row:last-child { border-bottom: 0; }
.table-primary { display: flex; align-items: center; gap: 11px; min-width: 0; }
.table-primary .task-thumb { flex: 0 0 auto; }
.table-primary strong { display: block; overflow: hidden; font-size: var(--text-sm); text-overflow: ellipsis; white-space: nowrap; }
.table-primary small { color: var(--ink-3); font-size: 11px; }
.cost-cell { font-variant-numeric: tabular-nums; }

.settings-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.provider-card { padding: 19px; background: white; border: 1px solid var(--line); border-radius: var(--radius); }
.provider-head { display: flex; align-items: center; justify-content: space-between; }
.provider-logo { display: grid; width: 38px; height: 38px; place-items: center; color: white; background: linear-gradient(135deg,#212027,#77707e); border-radius: 11px; font-size: 12px; font-weight: 700; }
.provider-logo.aliyun { background: linear-gradient(135deg,#ff812f,#e34b2c); }
.provider-logo.tripo { background: linear-gradient(135deg,#6843e1,#9b79f4); }
.provider-logo.meshy { background: linear-gradient(135deg,#1d8f79,#56bfa5); }
.provider-logo.openai { background: linear-gradient(135deg,#222,#4c4c4c); }
.provider-logo.relay { background: linear-gradient(135deg,#7047d8,#d1a64f); }
.provider-logo.deepseek { background: linear-gradient(135deg,#315bd9,#6d8cff); }
.provider-logo.doubao { background: linear-gradient(135deg,#5b3de1,#a45cff); }
.provider-logo.local { background: linear-gradient(135deg,#285276,#477ba4); }
.provider-card h3 { margin: 14px 0 6px; font-size: 15px; }
.provider-card > p { min-height: 40px; margin: 0; color: var(--ink-3); font-size: var(--text-xs); line-height: 1.6; }
.provider-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--line); }
.connection-state { display: inline-flex; align-items: center; gap: 5px; color: var(--ink-3); font-size: var(--text-xs); }
.connection-state i { width: 6px; height: 6px; background: #b6b0ba; border-radius: 50%; }
.connection-state.mock { color: var(--green); }
.connection-state.mock i { background: var(--green); }
.mapping-panel { margin-top: 16px; }
.mapping-row { display: grid; grid-template-columns: 1.1fr 1fr 1fr 110px 55px; align-items: center; gap: 12px; min-height: 64px; padding: 0 18px; border-bottom: 1px solid var(--line); font-size: var(--text-xs); }
.mapping-row:last-child { border-bottom: 0; }
.mapping-head { min-height: 44px; color: var(--ink-3); background: #faf9fb; font-size: 11px; font-weight: 600; }
.tier-tag { width: fit-content; padding: 5px 8px; color: var(--purple-dark); background: var(--purple-soft); border-radius: 12px; font-size: 11px; }
.toggle { position: relative; width: 34px; height: 20px; background: #d5d0d9; border: 0; border-radius: 20px; }
.toggle::after { content: ''; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; background: white; border-radius: 50%; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: .2s; }
.toggle.is-on { background: var(--purple); }
.toggle.is-on::after { left: 17px; }
.mock-banner { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 16px; padding: 17px 20px; color: #e9e4ef; background: linear-gradient(110deg,#242129,#302a3a); border: 1px solid #3b3545; border-radius: 14px; }
.mock-banner strong { display: block; font-size: var(--text-base); }
.mock-banner p { margin: 5px 0 0; color: #b4adbc; font-size: var(--text-xs); }
.mock-banner .toggle { flex: 0 0 auto; }

.modal-layer, .command-palette { position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(18,15,23,.48); backdrop-filter: blur(8px); }
.modal-layer.is-open, .command-palette.is-open { display: flex; }
.modal-card { width: min(620px,100%); max-height: 90vh; overflow: auto; background: white; border: 1px solid rgba(255,255,255,.5); border-radius: 20px; box-shadow: var(--shadow-lg); animation: modalIn .22s ease; }
@keyframes modalIn { from { opacity:0; transform:scale(.98) translateY(8px); } to { opacity:1; transform:none; } }
.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.modal-header h2 { margin: 0; font-size: var(--text-lg); }
.modal-close { display: grid; width: 32px; height: 32px; place-items: center; background: var(--canvas); border: 0; border-radius: 9px; }
.modal-body { padding: 22px; }
.modal-footer { display: flex; justify-content: flex-end; gap: 9px; padding: 16px 22px; border-top: 1px solid var(--line); }
.modal-footer.split { align-items: center; justify-content: space-between; }
.modal-footer.split > div { display: flex; gap: 9px; }
.auth-modal-head { align-items: flex-start; background: radial-gradient(circle at 80% 0,#f0eaff,transparent 45%),linear-gradient(145deg,#fff,#faf8ff); }
.auth-modal-head p { margin: 7px 0 0; color: var(--ink-3); font-size: var(--text-xs); }
.auth-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; background: var(--canvas); border: 1px solid var(--line); border-radius: 12px; }
.auth-switch button { padding: 9px; color: var(--ink-3); background: transparent; border: 0; border-radius: 9px; font-weight: 700; }
.auth-switch button.is-active { color: var(--purple-dark); background: white; box-shadow: 0 4px 13px rgba(37,24,57,.09); }
.auth-form { margin-top: 18px; }
.auth-message { margin-top: 14px; padding: 10px 12px; color: #9b3c4a; background: #fff1f3; border: 1px solid #f6d4da; border-radius: 10px; font-size: var(--text-xs); }
.auth-benefits { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 16px; }
.auth-benefits span { padding: 6px 9px; color: #38715c; background: #eefaf5; border-radius: 999px; font-size: 11px; font-weight: 700; }
.account-identity-panel { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 12px; margin-bottom: 18px; padding: 14px; color: white; background: linear-gradient(135deg,#221d2b,#46377a); border-radius: 14px; }
.account-identity-panel .avatar.large { width: 48px; height: 48px; font-size: 17px; }
.account-identity-panel strong,.account-identity-panel small { display: block; }
.account-identity-panel small { margin-top: 3px; color: rgba(255,255,255,.64); font-size: 11px; }
.account-identity-panel > span { padding: 6px 9px; color: #e8ddff; background: rgba(255,255,255,.1); border-radius: 999px; font-size: 11px; font-weight: 700; }
.danger-text-button { color: #b64758; background: none; border: 0; font-weight: 700; }
.billing-account-callout { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 22px; margin: 0 0 18px; padding: 19px 20px; overflow: hidden; color: white; background: radial-gradient(circle at 82% -20%,rgba(173,146,255,.38),transparent 45%),linear-gradient(135deg,#1d1925,#40316c); border: 1px solid rgba(255,255,255,.08); border-radius: 16px; box-shadow: 0 14px 34px rgba(40,28,70,.16); }
.billing-account-callout::after { content: ''; position: absolute; right: 128px; bottom: -56px; width: 130px; height: 130px; border: 1px solid rgba(255,255,255,.09); border-radius: 50%; }
.billing-account-callout > div,.billing-account-callout > button { position: relative; z-index: 1; }
.billing-account-callout > div > span { color: #bdb2cf; font-size: 11px; font-weight: 700; letter-spacing: .1em; }
.billing-account-callout strong { display: block; margin-top: 5px; font-size: 25px; letter-spacing: -.03em; }
.billing-account-callout strong small { color: #c8bfd5; font-size: 12px; font-weight: 600; letter-spacing: 0; }
.billing-account-callout p { max-width: 360px; margin: 5px 0 0; color: #aea5ba; font-size: 12px; line-height: 1.55; }
.billing-account-callout .primary-button { flex: 0 0 auto; color: #20182f; background: linear-gradient(135deg,#fff,#e7dcff); border-color: rgba(255,255,255,.7); box-shadow: 0 8px 22px rgba(0,0,0,.2); }
.billing-modal-card { width: min(940px,100%); }
.billing-modal-head { align-items: flex-start; background: radial-gradient(circle at 82% 0,rgba(117,85,232,.14),transparent 38%),linear-gradient(145deg,#fff,#faf8ff); }
.billing-modal-head p { margin: 7px 0 0; color: var(--ink-3); font-size: var(--text-xs); }
.billing-modal-body { padding: 0 22px 22px; background: linear-gradient(180deg,#fbfaff,#f7f5f9); }
.billing-balance-hero { position: relative; display: flex; min-height: 142px; align-items: center; justify-content: space-between; margin: 0 -22px 22px; padding: 24px 30px; overflow: hidden; color: white; background: radial-gradient(circle at 78% 20%,rgba(174,144,255,.31),transparent 35%),linear-gradient(118deg,#19171e,#312943 64%,#1c1824); }
.billing-balance-hero::after { content: ''; position: absolute; right: 22%; bottom: -110px; width: 220px; height: 220px; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; }
.billing-balance-hero > div { position: relative; z-index: 1; }
.billing-balance-hero > div:first-child > span { display: block; color: #bdb7c4; font-size: 12px; font-weight: 600; }
.billing-balance-hero > div:first-child > strong { display: block; margin: 3px 0 4px; font-size: 40px; letter-spacing: -.04em; }
.billing-balance-hero > div:first-child > small { color: #938c9c; font-size: 11px; }
.billing-balance-mark { display: grid; min-width: 108px; justify-items: end; }
.billing-balance-mark span { color: #f0eaff; font-size: 24px; font-weight: 800; letter-spacing: .14em; }
.billing-balance-mark b { margin-top: 5px; color: #9a8dae; font-size: 10px; letter-spacing: .28em; }
.billing-section { margin-top: 22px; }
.billing-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
.billing-section-head .eyebrow { margin-bottom: 4px; }
.billing-section-head h3 { margin: 0; font-size: var(--text-md); letter-spacing: -.02em; }
.billing-section-head > small { color: var(--ink-3); font-size: 11px; text-align: right; }
.billing-package-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.billing-package { position: relative; display: flex; min-width: 0; flex-direction: column; padding: 19px; background: rgba(255,255,255,.94); border: 1px solid var(--line); border-radius: 17px; box-shadow: 0 8px 22px rgba(31,23,45,.045); }
.billing-package.is-featured { background: radial-gradient(circle at 95% 0,rgba(117,85,232,.13),transparent 35%),#fff; border-color: rgba(117,85,232,.48); box-shadow: 0 13px 28px rgba(83,56,164,.11); }
.billing-package-badge { position: absolute; top: 14px; right: 14px; padding: 4px 8px; color: white; background: linear-gradient(135deg,#8264ec,#6845dd); border-radius: 999px; font-size: 10px; font-weight: 700; }
.billing-package-kicker { color: var(--purple); font-size: 10px; font-weight: 700; letter-spacing: .09em; }
.billing-package h3 { margin: 7px 0 15px; font-size: var(--text-base); }
.billing-points { display: flex; align-items: baseline; gap: 6px; }
.billing-points strong { font-size: 29px; letter-spacing: -.04em; line-height: 1; }
.billing-points span { color: var(--ink-3); font-size: 11px; }
.billing-price { display: flex; align-items: baseline; gap: 7px; margin-top: 11px; }
.billing-price strong { color: var(--purple-dark); font-size: var(--text-base); }
.billing-price small { color: var(--ink-3); font-size: 10px; }
.billing-package p { min-height: 40px; margin: 12px 0 16px; color: var(--ink-3); font-size: 12px; line-height: 1.6; }
.billing-package-action { width: 100%; margin-top: auto; }
.billing-package-action:disabled { cursor: not-allowed; opacity: .5; transform: none; }
.billing-orders { padding: 17px 18px 2px; background: rgba(255,255,255,.9); border: 1px solid var(--line); border-radius: 17px; }
.billing-order-list { margin: 0 -18px; border-top: 1px solid var(--line); }
.billing-order-row { display: grid; grid-template-columns: minmax(190px,1.3fr) minmax(110px,.7fr) 94px minmax(120px,.7fr); align-items: center; gap: 14px; min-height: 70px; padding: 10px 18px; border-bottom: 1px solid var(--line); }
.billing-order-row:last-child { border-bottom: 0; }
.billing-order-main,.billing-order-value { min-width: 0; }
.billing-order-main strong,.billing-order-main small,.billing-order-value strong,.billing-order-value small { display: block; }
.billing-order-main strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.billing-order-main small { margin-top: 4px; overflow: hidden; color: var(--ink-3); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.billing-order-value strong { font-size: 12px; }
.billing-order-value small { margin-top: 4px; color: var(--ink-3); font-size: 10px; }
.billing-order-status { display: inline-flex; width: fit-content; align-items: center; gap: 6px; padding: 6px 8px; color: var(--amber); background: var(--amber-soft); border-radius: 999px; font-size: 10px; font-weight: 700; }
.billing-order-status i { width: 6px; height: 6px; background: currentColor; border-radius: 50%; }
.billing-order-status.is-paid { color: var(--green); background: var(--green-soft); }
.billing-order-status.is-failed,.billing-order-status.is-cancelled,.billing-order-status.is-expired { color: var(--red); background: var(--red-soft); }
.billing-order-status.is-refunded { color: var(--ink-3); background: var(--soft); }
.billing-order-action { display: flex; justify-content: flex-end; }
.billing-order-action .compact { min-height: 34px; padding: 0 11px; font-size: 11px; }
.billing-paid-proof { color: var(--green); font-size: 11px; font-weight: 700; }
.billing-empty { display: flex; grid-column: 1 / -1; min-height: 92px; align-items: center; justify-content: center; gap: 12px; padding: 18px; color: var(--ink-3); text-align: left; }
.billing-empty > span { display: grid; width: 34px; height: 34px; place-items: center; color: var(--purple); background: var(--purple-soft); border-radius: 11px; }
.billing-empty strong { display: block; color: var(--ink-2); font-size: 13px; }
.billing-empty p { margin: 4px 0 0; font-size: 11px; }
.billing-error { display: flex; align-items: center; gap: 10px; margin: 16px 0; padding: 11px 13px; color: #963a48; background: #fff2f4; border: 1px solid #f3d1d7; border-radius: 11px; }
.billing-error > span { display: grid; width: 23px; height: 23px; place-items: center; flex: 0 0 auto; color: white; background: var(--red); border-radius: 8px; font-weight: 800; }
.billing-error p { flex: 1; margin: 0; font-size: 12px; }
.billing-loading { display: grid; min-height: 430px; place-content: center; justify-items: center; text-align: center; }
.billing-loading i { width: 36px; height: 36px; margin-bottom: 14px; border: 3px solid var(--purple-soft); border-top-color: var(--purple); border-radius: 50%; animation: billingSpin .8s linear infinite; }
.billing-loading strong { font-size: var(--text-base); }
.billing-loading span { margin-top: 6px; color: var(--ink-3); font-size: 11px; }
@keyframes billingSpin { to { transform: rotate(360deg); } }
.billing-trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; margin-top: 17px; color: #4b7867; font-size: 10px; font-weight: 600; }
.billing-footer-note { margin-right: auto; color: var(--ink-3); font-size: 11px; }
.command-dialog { width: min(650px,100%); overflow: hidden; background: white; border: 1px solid rgba(255,255,255,.5); border-radius: 17px; box-shadow: var(--shadow-lg); transform: translateY(-12vh); }
.command-input { display: flex; height: 58px; align-items: center; gap: 12px; padding: 0 17px; border-bottom: 1px solid var(--line); }
.command-input > span { color: var(--purple); font-size: 21px; }
.command-input input { flex: 1; height: 100%; background: none; border: 0; outline: 0; }
kbd { padding: 3px 6px; color: var(--ink-3); background: var(--canvas); border: 1px solid var(--line); border-radius: 5px; font-size: 10px; }
.command-results { max-height: 360px; overflow: auto; padding: 9px; }
.command-result { display: flex; width: 100%; align-items: center; gap: 11px; padding: 10px; background: none; border: 0; border-radius: 9px; text-align: left; }
.command-result:hover { background: var(--canvas); }
.command-result span { display: grid; width: 30px; height: 30px; place-items: center; color: var(--purple); background: var(--purple-soft); border-radius: 9px; }
.command-result strong { display: block; font-size: var(--text-sm); }
.command-result small { color: var(--ink-3); font-size: var(--text-xs); }
.empty-state { padding: 45px 20px; color: var(--ink-3); text-align: center; }
.empty-state strong { display: block; color: var(--ink-2); }
.empty-state p { margin: 7px 0 0; font-size: var(--text-xs); }
.toast-region { position: fixed; right: 22px; bottom: 22px; z-index: 150; display: flex; width: min(360px,calc(100vw - 44px)); flex-direction: column; gap: 9px; }
.modal-open .toast-region { top: 18px; right: 22px; bottom: auto; }
.toast { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 10px; padding: 12px 13px; background: rgba(25,23,29,.95); color: white; border: 1px solid rgba(255,255,255,.09); border-radius: 12px; box-shadow: 0 14px 35px rgba(20,16,27,.24); animation: toastIn .25s ease; }
@keyframes toastIn { from { opacity: 0; transform: translateY(10px); } }
.toast-icon { display: grid; width: 26px; height: 26px; place-items: center; color: #ae99ff; background: rgba(117,85,232,.2); border-radius: 8px; }
.toast strong { display: block; font-size: var(--text-sm); }
.toast small { color: #c0bac5; font-size: var(--text-xs); }
.toast button { color: #8f8994; background: none; border: 0; }

.nav-item { min-height:46px; gap:10px; padding:0 11px; border-radius:12px; font-size:15px; font-weight:600; white-space:nowrap; }
.nav-item > span:nth-child(2) { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-icon { width:29px; height:29px; border-radius:9px; font-size:15px; }
.nav-section-label { padding:13px 11px 6px; font-size:12px; }
.tool-item,.breadcrumb { font-size:13px; }
.nav-count,.nav-pill,.workspace-card small,.account-card small { font-size:12px; }
.brand small,.tool-group-label,.eyebrow { font-size:11px; }
.brand strong { font-size:19px; }
.page-heading p,.panel-header p,.config-title p { font-size:13px; }
.section-label strong,.section-label span { font-size:13px; }
.example-copy > small { font-size:12px; }
.example-copy h3 { font-size:17px; }
.example-copy p { font-size:13px; }
.example-copy > div { font-size:12px; }
.fashion-input-guide strong,.fashion-input-guide span { font-size:11px; }
.fashion-input-guide small { font-size:10px; }
.prompt-assistant-head > div > span { font-size:11px; }
.prompt-assistant-head strong { font-size:15px; }
.prompt-assistant-head small,.prompt-ready,.prompt-keyword-box label,.prompt-model-box label,.prompt-keyword-box input,.prompt-model-box select,.prompt-style-row button { font-size:11px; }

@media (max-width: 1680px) {
  .studio-layout { grid-template-columns: 250px minmax(0,1fr); }
  .preview-panel { grid-column: 1 / -1; min-height: 430px; }
  .preview-stage { min-height: 340px; }
}
@media (max-width: 1180px) {
  .workspace-module-card { grid-template-columns:1fr; }
  .workspace-module-visual { height:235px; min-height:235px; }
  .dashboard-management-grid { grid-template-columns:1fr; }
  .shooting-option-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .detail-workflow-switch { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .asset-grid { grid-template-columns: repeat(3,1fr); }
  .studio-layout { grid-template-columns: 220px minmax(0,1fr); }
  .assistant-layout { grid-template-columns: 1fr; }
  .assistant-skill-panel, .assistant-chat-panel, .assistant-right-panel { min-height: auto; }
  .assistant-composer { grid-template-columns: 1fr 1fr; }
  .assistant-composer input { grid-column: 1 / -1; }
  .workflow-grid { grid-template-columns: repeat(2,1fr); }
  .settings-grid { grid-template-columns: repeat(2,1fr); }
  .fidelity-lock-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .model-output-grid { grid-template-columns: repeat(2,1fr); }
  .derived-style-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .detail-workspace { grid-template-columns: 1fr 1fr; }
  .detail-settings-panel { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  /* 发现页桌面端隐藏侧栏，移动端打开菜单时必须恢复抽屉布局。 */
  .discovery-shell .sidebar { display: flex; }
  .workspace-welcome { align-items:flex-start; flex-direction:column; }
  .workspace-module-card { grid-template-columns:1fr; }
  .modeling-spotlight { grid-template-columns:1fr; }
  .modeling-spotlight-media { min-height:250px; }
  .modeling-spotlight-media::after { background:linear-gradient(180deg,transparent,#201b27); }
  .modeling-spotlight-copy { padding:28px; }
  .shooting-assurance { grid-template-columns:auto 1fr; }
  .task-management-links { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sidebar { transform: translateX(-100%); transition: transform .22s; }
  .sidebar.is-open { transform: translateX(0); box-shadow: 30px 0 80px rgba(0,0,0,.3); }
  .main-stage { width: 100%; margin-left: 0; }
  .mobile-menu { display: grid; }
  .breadcrumb span, .breadcrumb i { display: none; }
  .hero-panel { grid-template-columns: 1fr; }
  .hero-visual { display: none; }
  .metric-grid { grid-template-columns: repeat(2,1fr); }
  .content-grid, .modeling-layout, .brand-layout { grid-template-columns: 1fr; }
  .asset-grid { grid-template-columns: repeat(2,1fr); }
  .task-summary { grid-template-columns: repeat(2,1fr); }
  .asset-fidelity-banner { grid-template-columns: auto 1fr; }
  .asset-fidelity-banner .secondary-button { grid-column: 1 / -1; }
  .image-model-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .image-model-pickline { grid-template-columns: 1fr; }
  .image-model-pickline small { grid-column: 1; }
  .fidelity-lock-grid { grid-template-columns: 1fr; }
  .model-output-grid { grid-template-columns: repeat(2,1fr); }
  .derived-style-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .derived-style-selection { grid-template-columns: 34px minmax(0,1fr); }
  .derived-style-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .model-case-grid { grid-template-columns: 1fr 1fr; }
  .category-concept-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .detail-compare { grid-template-columns: 1fr 90px 1fr; gap: 10px; }
  .table-header { display: none; }
  .table-row { grid-template-columns: 1fr auto auto; padding: 12px 16px; }
  .table-row > :nth-child(2), .table-row > :nth-child(4), .table-row > :nth-child(5) { display: none; }
  .billing-order-row { grid-template-columns: minmax(0,1fr) auto; gap: 8px 14px; padding-block: 13px; }
  .billing-order-value { text-align: right; }
  .billing-order-action { grid-column: 2; }
}

/* 1024px 级别的平板与小型笔记本优先保留完整左右工作台，侧栏改为抽屉。 */
@media (max-width: 1180px) and (min-width: 901px) {
  .sidebar { transform: translateX(-100%); transition: transform .22s; }
  .sidebar.is-open { transform: translateX(0); box-shadow: 30px 0 80px rgba(0,0,0,.3); }
  .main-stage { width:100%; margin-left:0; }
  .main-stage::before { inset:0; }
  .mobile-menu { display:grid; }
}
@media (max-width: 640px) {
  .workspace-welcome { margin-bottom:20px; }
  .workspace-welcome h1 { font-size:34px; }
  .workspace-welcome-actions { width:100%; flex-direction:column; }
  .workspace-welcome-actions button { width:100%; }
  .workspace-section-head { align-items:flex-start; flex-direction:column; gap:6px; }
  .workspace-section-head > p { font-size:11px; }
  .workspace-module-grid { grid-template-columns:1fr; gap:14px; }
  .workspace-module-visual { height:230px; min-height:230px; }
  .workspace-module-body { padding:18px; }
  .workspace-module-actions { grid-template-columns:1fr 1fr; }
  .modeling-spotlight { grid-template-columns:1fr; }
  .modeling-spotlight-media { min-height:220px; }
  .modeling-spotlight-copy { padding:23px 20px; }
  .modeling-spotlight-copy h2 { font-size:25px; }
  .management-shortcuts { grid-template-columns:1fr; }
  .shooting-option-grid { grid-template-columns:1fr; }
  .shooting-option-media { height:230px; }
  .tool-model-select { grid-template-columns:1fr; gap:11px; }
  .detail-workflow-switch { grid-template-columns:1fr; }
  .detail-workflow-context { align-items:stretch; flex-direction:column; }
  .detail-source-choice { align-items:stretch; flex-direction:column; }
  .task-management-links { grid-template-columns:1fr; }
  .product-lock-result-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .model-preview-style { min-height:390px; }
  .derived-preview-frame { inset:54px 16px 82px; }
  .style-dock-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .style-dock-card .derived-style-media { height:92px; }
  .style-dock-selection { align-items:stretch; flex-direction:column; }
  .style-dock-selection .primary-button { width:100%; }
  .style-dock-reference { grid-template-columns:1fr; }
  .style-dock-reference img { display:none; }
  .model-output-grid { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .model-output-grid::-webkit-scrollbar { display:none; }
  .model-output-card { min-width:260px; scroll-snap-align:start; }
  .derived-style-library { margin-right:10px; margin-left:10px; padding:13px; }
  .derived-style-head { align-items:flex-start; flex-direction:column; gap:9px; }
  .derived-style-head h3 { font-size:16px; }
  .derived-style-grid { display:flex; overflow-x:auto; padding:2px 2px 10px; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .derived-style-grid::-webkit-scrollbar { display:none; }
  .derived-style-card { min-width:190px; scroll-snap-align:start; }
  .derived-style-selection { grid-template-columns:32px minmax(0,1fr); }
  .derived-style-actions { align-items:stretch; flex-direction:column; }
  .derived-style-actions > span { text-align:left; }
  .derived-style-actions .primary-button { width:100%; }
  .model-reference-upload { grid-template-columns: 1fr; }
  .modal-footer.split { align-items: stretch; flex-direction: column-reverse; }
  .modal-footer.split > div { display: grid; grid-template-columns: 1fr 1fr; }
  .account-identity-panel { grid-template-columns: 42px 1fr; }
  .account-identity-panel > span { grid-column: 1 / -1; width: fit-content; }
  .billing-account-callout { align-items: stretch; flex-direction: column; gap: 14px; }
  .billing-account-callout .primary-button { width: 100%; }
  .billing-modal-head p { max-width: 250px; }
  .billing-modal-body { padding: 0 14px 14px; }
  .billing-balance-hero { min-height: 128px; margin: 0 -14px 18px; padding: 20px; }
  .billing-balance-hero > div:first-child > strong { font-size: 34px; }
  .billing-balance-mark { min-width: 82px; }
  .billing-balance-mark span { font-size: 19px; }
  .billing-section-head { align-items: flex-start; flex-direction: column; gap: 5px; }
  .billing-section-head > small { text-align: left; }
  .billing-package-grid { grid-template-columns: 1fr; }
  .billing-package p { min-height: 0; }
  .billing-orders { padding-inline: 14px; }
  .billing-order-list { margin-inline: -14px; }
  .billing-order-row { grid-template-columns: minmax(0,1fr) auto; padding-inline: 14px; }
  .billing-order-value { grid-column: 1; grid-row: 2; text-align: left; }
  .billing-order-status { grid-column: 2; grid-row: 1; }
  .billing-order-action { grid-column: 2; grid-row: 2; }
  .billing-footer-note { display: none; }
  html, body { max-width: 100%; overflow-x: hidden; }
  .page-container { padding: 20px 14px; }
  .topbar { padding: 0 14px; }
  .top-actions .icon-button { display: none; }
  .page-heading { align-items: flex-start; flex-direction: column; }
  .page-heading h1 { font-size: 23px; }
  .hero-copy { padding: 28px 24px; }
  .hero-copy h1 { font-size: 30px; }
  .hero-actions, .heading-actions { width: 100%; flex-wrap: wrap; }
  .hero-actions > *, .heading-actions > * { flex: 1; }
  .metric-grid, .asset-grid, .settings-grid, .template-grid { grid-template-columns: 1fr; }
  .workflow-grid { grid-template-columns: 1fr 1fr; }
  .assistant-hero-card { flex-direction: column; }
  .image-model-shelf-head { flex-direction: column; }
  .image-model-grid { grid-template-columns: 1fr; }
  .assistant-quick-cards, .assistant-tabs, .assistant-composer { grid-template-columns: 1fr; }
  .assistant-composer input { grid-column: auto; }
  .content-grid { display: block; }
  .content-grid > * { margin-bottom: 14px; }
  .task-row { grid-template-columns: 42px minmax(0,1fr) auto; gap: 10px; padding: 10px 14px; }
  .task-row > :nth-child(3) { justify-self: end; }
  .task-row .task-time, .task-row .cost-cell, .task-row .row-menu { display: none; }
  .studio-layout { display: block; }
  .tool-panel { margin-bottom: 12px; }
  .tool-panel .tool-list { display: flex; overflow-x: auto; gap: 6px; }
  .tool-group-label, .tool-search { display: none; }
  .tool-item { width: auto; min-width: fit-content; padding: 0 11px; }
  .tool-item em { display: none; }
  .config-panel, .preview-panel { margin-bottom: 12px; }
  .material-layout { grid-template-columns: 1fr; }
  .fashion-material-layout { grid-template-columns: 1fr; }
  .material-layout .upload-grid, .upload-grid, .form-grid { grid-template-columns: 1fr; }
  .prompt-assistant-main { grid-template-columns: 1fr; }
  .prompt-assistant-head { flex-direction: column; }
  .prompt-keyword-box > div:first-of-type { flex-direction: column; }
  .prompt-keyword-box .primary-button { width: 100%; }
  .fashion-execution-head { flex-direction:column; }
  .fashion-pipeline { grid-template-columns:repeat(5,minmax(105px,1fr)); overflow-x:auto; }
  .fashion-contract-grid { grid-template-columns:1fr; }
  .fashion-model-stack-grid { grid-template-columns:1fr; }
  .tool-example-card { order: 2; }
  .example-media { height: 232px; }
  .fashion-example-card .example-media { height: 310px; }
  .angle-grid { grid-template-columns: repeat(2,1fr); }
  .angle-grid-six, .angle-grid-dynamic { grid-template-columns: repeat(2,1fr); }
  .capture-plan-summary { grid-template-columns: 1fr 1fr; }
  .capture-plan-summary p { grid-column: 1 / -1; }
  .modeling-assurance { grid-template-columns: 1fr auto; }
  .modeling-assurance > span { grid-column: 1 / -1; width: fit-content; }
  .fidelity-lock-grid, .model-case-grid, .detail-workspace { grid-template-columns: 1fr; }
  .lock-observation { grid-template-columns: 1fr; }
  .lock-observation em { grid-column: 1; }
  .fidelity-lock { grid-template-columns: 28px minmax(0,1fr); }
  .lock-required { grid-column: 2; justify-self:start; }
  .category-concept-grid { grid-template-columns:1fr; }
  .detail-settings-panel { grid-column: auto; }
  .asset-fidelity-banner { grid-template-columns: 1fr; }
  .asset-fidelity-banner > div:first-child { width: 100%; height: 52px; }
  .asset-fidelity-banner .secondary-button { grid-column: auto; }
  .detail-policy { flex-wrap: wrap; }
  .detail-policy b { width: 100%; margin-left: 0; }
  .detail-case-hero { padding: 17px; }
  .detail-case-head { flex-direction: column; }
  .detail-compare { grid-template-columns: 1fr; max-width: 280px; }
  .detail-transform i { transform: rotate(90deg); }
  .detail-phone { height: 430px; }
  .step-line { width: 24px; }
  .step span { display: none; }
  .mapping-row { grid-template-columns: 1fr auto; }
  .mapping-row > :nth-child(2), .mapping-row > :nth-child(3), .mapping-row > :nth-child(4) { display: none; }
}

/* Administrator center: server-authoritative status cards with no secret fields. */
.admin-only-entry[hidden] { display:none !important; }
.admin-section-nav { position:sticky; z-index:6; top:62px; display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:7px; margin:16px 0 0; padding:8px; background:rgba(249,248,246,.94); border:1px solid var(--line-soft); border-radius:14px; box-shadow:0 8px 22px rgba(42,31,54,.05); backdrop-filter:blur(16px); }
.admin-section-nav button { min-width:0; min-height:38px; padding:8px 10px; color:var(--ink-2); background:#fff; border:1px solid var(--line-soft); border-radius:10px; font-size:11px; font-weight:800; }
.admin-section-nav button:hover,.admin-section-nav button:focus-visible { color:var(--accent); border-color:#cfc0f3; box-shadow:0 5px 14px rgba(102,68,184,.1); }
.admin-section-nav button.is-active { color:#fff; border-color:var(--accent); background:linear-gradient(135deg,var(--accent),#7655d8); box-shadow:0 7px 16px rgba(102,68,184,.2); }
.admin-page-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:18px; }
.admin-card { min-width:0; padding:20px; }
.admin-card-security { grid-column:1 / -1; }
.admin-card-proxy-fallback { grid-column:1 / -1; border-color:#d9cef5; background:linear-gradient(180deg,#fff 0%,#fbf9ff 100%); }
.admin-proxy-settings { align-items:end; margin:12px 0 15px; padding:12px; background:#f7f3ff; border:1px solid #e4daf8; border-radius:12px; }
.admin-proxy-settings .field { min-width:0; display:grid; gap:6px; color:var(--ink-2); font-size:11px; font-weight:750; }
.admin-proxy-settings input[type=number],.admin-proxy-settings select { min-height:36px; padding:7px 9px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.admin-proxy-settings input[type=checkbox] { width:18px; height:18px; accent-color:var(--accent); }
.admin-proxy-save-field { display:flex !important; justify-content:flex-end; }
.admin-proxy-subhead { align-items:center; margin:14px 0 5px; padding-top:12px; border-top:1px solid var(--line-soft); }
.admin-proxy-subhead strong { display:block; color:var(--ink); font-size:13px; }
.admin-proxy-subhead small { display:block; margin-top:3px; color:var(--ink-3); font-size:10px; font-weight:500; }
.admin-proxy-account-list,.admin-proxy-subscription-list { gap:0; }
.admin-proxy-account-list .admin-status-row,.admin-proxy-subscription-list .admin-status-row { padding:11px 0; }
.admin-proxy-account-list .admin-status-row > span,.admin-proxy-subscription-list .admin-status-row > span { min-width:0; }
.admin-proxy-account-list .admin-status-row > span small,.admin-proxy-subscription-list .admin-status-row > span small { display:block; margin-top:4px; overflow-wrap:anywhere; }
.admin-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:16px; }
.admin-card-head h2 { margin:5px 0 0; font-size:18px; }
.admin-card-head .text-button { flex:0 0 auto; }
.admin-status-list { display:grid; gap:9px; }
.admin-status-row { display:flex; align-items:center; justify-content:space-between; gap:14px; min-width:0; padding:9px 0; border-bottom:1px solid var(--line-soft); }
.admin-status-row:last-child { border-bottom:0; }
.admin-status-row span { min-width:0; color:var(--ink-3); font-size:12px; }
.admin-status-row strong { max-width:65%; overflow:hidden; color:var(--ink); font-size:12px; text-align:right; text-overflow:ellipsis; white-space:nowrap; }
.admin-provider-row { display:grid; grid-template-columns:minmax(120px,1fr) auto auto; }
.admin-provider-row > span b,.admin-provider-row > span small { display:block; }
.admin-provider-row > span small,.admin-ledger-list .admin-status-row span small { margin-top:3px; color:var(--ink-3); font-size:9px; }
.admin-row-actions { display:flex; align-items:center; justify-content:flex-end; gap:7px; }
.admin-row-actions .text-button { padding:5px 7px; font-size:10px; white-space:nowrap; }
.admin-badge { display:inline-flex; align-items:center; min-height:24px; padding:4px 9px; color:var(--ink-3); background:var(--surface-2); border:1px solid var(--line); border-radius:999px; font-size:10px; font-weight:750; white-space:nowrap; }
.admin-badge.is-enabled { color:#236c52; background:#edf8f2; border-color:#cfe8da; }
.admin-badge.is-warning { color:#8a5d18; background:#fff6df; border-color:#ecdcae; }
.admin-safe-note,.admin-ok-note { margin:14px 0 0; color:var(--ink-3); font-size:11px; line-height:1.65; }
.admin-warning-list { display:grid; gap:5px; margin-top:14px; padding:10px 12px; color:#805c1a; background:#fff8e9; border:1px solid #eedfb7; border-radius:10px; font-size:11px; }
.admin-warning-list span { color:#88631d; }
.admin-stat-row { display:grid; grid-template-columns:auto 1fr auto 1fr; align-items:end; gap:6px 10px; padding:9px 0; }
.admin-stat-row strong { color:var(--accent); font-size:20px; }
.admin-stat-row span { color:var(--ink-3); font-size:11px; }
.admin-policy-summary { min-height:38px; margin:0; color:var(--ink-2); font-size:12px; line-height:1.65; }
.admin-customer-list { display:grid; gap:8px; }
.admin-customer-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line-soft); }
.admin-customer-row:last-child { border-bottom:0; }
.admin-customer-row strong,.admin-customer-row small { display:block; }
.admin-customer-row strong { color:var(--ink); font-size:12px; }
.admin-customer-row small { margin-top:3px; color:var(--ink-3); font-size:10px; }
.admin-customer-row > span { color:var(--ink-3); font-size:10px; text-align:right; white-space:nowrap; }
.admin-customer-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.admin-customer-actions .text-button { font-size:10px; white-space:nowrap; }
.admin-subscription-list { display:grid; gap:0; margin-top:10px; }
.admin-card-billing { grid-column:1 / -1; }
.admin-billing-offers { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:9px; margin:12px 0 14px; }
.admin-billing-offer { display:grid; gap:5px; min-width:0; padding:13px; background:var(--surface-2); border:1px solid var(--line-soft); border-radius:12px; }
.admin-billing-offer.is-membership { color:white; background:linear-gradient(145deg,#7855dc,#5f3bc6); border-color:transparent; }
.admin-billing-offer span { color:var(--ink-3); font-size:10px; font-weight:750; }
.admin-billing-offer.is-membership span,.admin-billing-offer.is-membership em { color:rgba(255,255,255,.78); }
.admin-billing-offer strong { color:var(--ink); font-size:20px; line-height:1; }
.admin-billing-offer.is-membership strong,.admin-billing-offer.is-membership b { color:white; }
.admin-billing-offer b { overflow:hidden; color:var(--accent); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.admin-billing-offer em { color:var(--ink-3); font-size:9px; font-style:normal; line-height:1.4; }
.admin-membership-save { display:flex; align-items:flex-end; }
.admin-membership-save button { width:100%; }
.admin-billing-tip { margin:10px 0 0; padding:10px 12px; color:var(--ink-2); background:#f5f1ff; border:1px solid #ded3f7; border-radius:10px; font-size:12px; font-weight:700; }
.admin-tester-form { margin-top:8px; }
.admin-tester-form .field.full:last-child { display:flex; justify-content:flex-end; }
.admin-tester-list { margin-top:12px; padding-top:4px; border-top:1px solid var(--line-soft); }
.admin-card-pricing { grid-column:1 / -1; }
.admin-pricing-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.admin-pricing-grid label,.admin-pricing-publish > label { display:grid; gap:6px; min-width:0; padding:11px; color:var(--ink-2); background:var(--surface-2); border:1px solid var(--line-soft); border-radius:11px; font-size:11px; font-weight:750; }
.admin-pricing-grid input,.admin-pricing-publish input,.admin-pricing-publish select { width:100%; min-width:0; min-height:38px; padding:8px 10px; color:var(--ink); background:white; border:1px solid var(--line); border-radius:8px; font:inherit; }
.admin-pricing-grid small { color:var(--ink-3); font-size:9px; font-weight:600; }
.admin-model-route-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:14px; }
.admin-model-route-list > strong { grid-column:1 / -1; font-size:12px; }
.admin-model-route-list label { display:grid; grid-template-columns:auto minmax(0,1fr); gap:3px 8px; min-width:0; padding:10px; background:#fbfafc; border:1px solid var(--line-soft); border-radius:10px; cursor:pointer; }
.admin-model-route-list input { grid-row:1 / span 2; margin-top:2px; accent-color:var(--accent); }
.admin-model-route-list span,.admin-model-route-list small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.admin-model-route-list span { font-size:11px; font-weight:750; }.admin-model-route-list small { color:var(--ink-3); font-size:9px; }
.admin-pricing-publish { display:grid; grid-template-columns:minmax(180px,.7fr) minmax(240px,1.3fr) auto; align-items:end; gap:10px; margin-top:14px; padding-top:14px; border-top:1px solid var(--line-soft); }
.admin-pricing-publish > div { display:flex; gap:8px; }
.admin-pricing-publish button { white-space:nowrap; }
.admin-loading,.admin-error { display:grid; gap:8px; margin-top:18px; padding:24px; }
.admin-loading strong,.admin-error strong { font-size:15px; }
.admin-loading p,.admin-error p { margin:0; color:var(--ink-3); font-size:12px; }
.admin-empty-inline { padding:12px 0; color:var(--ink-3); font-size:12px; }
.admin-check-field { align-content:start; }
.admin-check-field input { width:18px; height:18px; accent-color:var(--accent); }
.admin-check-field small { color:var(--ink-3); font-size:10px; line-height:1.5; }
.admin-audit-table { max-width:100%; overflow:auto; margin-top:12px; border:1px solid var(--line-soft); border-radius:12px; }
.admin-audit-row { display:grid; grid-template-columns:150px minmax(130px,.8fr) minmax(140px,1fr) minmax(220px,1.8fr); gap:10px; min-width:760px; align-items:center; padding:10px 12px; border-bottom:1px solid var(--line-soft); font-size:10px; }
.admin-audit-row:last-child { border-bottom:0; }
.admin-audit-row time,.admin-audit-row span,.admin-audit-row small { color:var(--ink-3); }
.admin-pagination { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; color:var(--ink-3); font-size:10px; }
.admin-reconciliation { display:grid; gap:9px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line-soft); }
.admin-reconciliation .admin-card-head { margin-bottom:2px; }
.admin-reconciliation .admin-card-head small { display:block; margin-top:4px; color:var(--ink-3); font-size:10px; }
.admin-reconciliation-row { display:grid; grid-template-columns:minmax(160px,1.2fr) minmax(100px,.45fr) minmax(160px,.8fr) auto; align-items:end; gap:9px; padding:11px; background:var(--surface-2); border:1px solid var(--line-soft); border-radius:11px; }
.admin-reconciliation-row > div:first-child strong,.admin-reconciliation-row > div:first-child small { display:block; overflow-wrap:anywhere; }
.admin-reconciliation-row > div:first-child small { margin-top:4px; color:var(--ink-3); font-size:9px; }
.admin-reconciliation-row label { display:grid; gap:5px; color:var(--ink-3); font-size:9px; }
.admin-reconciliation-row input { width:100%; min-width:0; min-height:36px; padding:7px 9px; border:1px solid var(--line); border-radius:8px; }
.admin-reconciliation-row > div:last-child { display:flex; gap:7px; }

@media (max-width: 640px) {
  .admin-section-nav { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-page-grid { grid-template-columns:1fr; gap:12px; }
  .admin-card-security { grid-column:auto; }
  .admin-card { padding:16px; }
  .admin-stat-row { grid-template-columns:auto 1fr; }
  .admin-stat-row strong:nth-of-type(2) { grid-column:1; }
  .admin-stat-row span:nth-of-type(2) { grid-column:2; }
  .admin-card-pricing { grid-column:auto; }
  .admin-card-billing { grid-column:auto; }
  .admin-card-proxy-fallback { grid-column:auto; }
  .admin-proxy-settings { grid-template-columns:1fr 1fr; }
  .admin-pricing-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-billing-offers { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .admin-model-route-list { grid-template-columns:1fr; }
  .admin-pricing-publish { grid-template-columns:1fr; }
  .admin-pricing-publish > div { align-items:stretch; flex-direction:column; }
  .admin-reconciliation-row { grid-template-columns:1fr 1fr; }
  .admin-reconciliation-row > div:first-child,.admin-reconciliation-row > div:last-child { grid-column:1 / -1; }
}

@media (max-width: 400px) {
  .admin-section-nav { grid-template-columns:1fr 1fr; gap:5px; padding:6px; }
  .admin-section-nav button { min-height:36px; padding:6px; font-size:10px; }
  .admin-page-grid { margin-top:12px; }
  .admin-card { padding:14px; border-radius:14px; }
  .admin-card-head { gap:8px; margin-bottom:11px; }
  .admin-card-head h2 { font-size:16px; }
  .admin-card-head .text-button { padding:5px 0; font-size:11px; }
  .admin-status-row { gap:8px; padding:8px 0; }
  .admin-status-row span,.admin-status-row strong { font-size:11px; }
  .admin-status-row strong { max-width:58%; }
  .admin-customer-list,.admin-customer-row { min-width:0; width:100%; max-width:100%; }
  .admin-customer-row { align-items:flex-start; flex-direction:column; gap:4px; overflow:hidden; }
  .admin-customer-row > div:first-child { min-width:0; width:100%; max-width:100%; }
  .admin-customer-row strong,.admin-customer-row small { max-width:100%; overflow-wrap:anywhere; }
  .admin-customer-row > span { text-align:left; }
  .admin-customer-actions { justify-content:flex-start; width:100%; max-width:100%; flex-wrap:wrap; }
  .admin-provider-row { grid-template-columns:1fr auto; align-items:start; }
  .admin-provider-row .admin-row-actions { grid-column:1 / -1; justify-content:flex-start; width:100%; }
  .admin-session-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; width:100%; }
  .admin-session-row > span { min-width:0; overflow-wrap:anywhere; }
  .admin-session-row > span small { display:block; margin-top:3px; overflow-wrap:anywhere; }
  .admin-session-row > strong { max-width:none; overflow:visible; text-align:left; text-overflow:clip; white-space:normal; }
  .admin-session-row > button { grid-column:1 / -1; justify-self:start; }
  .admin-audit-table { min-width:0; width:100%; max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; }
  .admin-pagination { align-items:stretch; flex-direction:column; }
  .admin-reconciliation-row { grid-template-columns:1fr; }
  .admin-reconciliation-row > div:first-child,.admin-reconciliation-row > div:last-child { grid-column:auto; }
  .admin-reconciliation-row > div:last-child { display:grid; grid-template-columns:1fr 1fr; }
  .admin-pricing-grid { grid-template-columns:1fr; }
  .admin-billing-offers { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-proxy-settings { grid-template-columns:1fr; }
  .admin-proxy-subhead { align-items:flex-start; flex-direction:column; }
  .admin-proxy-subhead .admin-card-head-actions { width:100%; }
  .admin-proxy-subhead .admin-card-head-actions button { flex:1; }
  .admin-pricing-publish button { width:100%; }
  .admin-safe-note,.admin-ok-note,.admin-warning-list { font-size:10px; }
}

/* V14 information architecture: selling points first, utilities secondary. */
:root { --sidebar-width: 244px; --page-max: 2400px; }
.nav-list { overflow:auto; scrollbar-width:none; padding-bottom:10px; }
.nav-list::-webkit-scrollbar { display:none; }
.nav-creation-group { display:grid; margin-top:4px; }
.nav-creation-summary { display:grid; grid-template-columns:minmax(0,1fr) 42px; align-items:center; gap:4px; min-height:48px; cursor:pointer; list-style:none; border-radius:13px; }
.nav-creation-summary::-webkit-details-marker { display:none; }
.nav-creation-summary::marker { content:''; }
.nav-creation-summary:focus-visible { outline:2px solid #b99cff; outline-offset:2px; }
.nav-creation-summary .nav-item { min-width:0; pointer-events:none; }
.nav-primary-creation > span:nth-child(2) { overflow:visible; font-size:13px; text-overflow:clip; white-space:nowrap; }
.nav-primary-creation .nav-pill { flex:0 0 auto; padding-inline:7px; font-size:8px; }
.nav-collapse-toggle { display:grid; width:42px; height:48px; place-items:center; color:#c9c2d2; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.07); border-radius:12px; font-size:18px; pointer-events:none; }
.nav-collapse-toggle > span { transition:transform .2s ease; }
.nav-creation-group:not([open]) .nav-collapse-toggle > span { transform:rotate(-90deg); }
.nav-creation-summary:hover .nav-collapse-toggle { color:#fff; background:rgba(255,255,255,.09); }
.nav-creation-group > .nav-creation-submenu { grid-column:1 / -1; display:grid; gap:3px; margin:3px 0 8px 16px; padding-left:10px; border-left:1px solid rgba(183,158,255,.28); }
.nav-subitem { display:grid; min-width:0; grid-template-columns:27px minmax(0,1fr); gap:0 8px; align-items:center; padding:7px 8px; color:#c8c1ce; background:transparent; border:1px solid transparent; border-radius:10px; text-align:left; }
.nav-subitem > span { grid-row:1 / 3; display:grid; width:27px; height:27px; place-items:center; color:#cdbdff; background:rgba(153,119,242,.12); border-radius:8px; font-size:10px; font-weight:850; }
.nav-subitem strong { overflow:hidden; color:inherit; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.nav-subitem small { overflow:hidden; color:#817a87; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.nav-subitem:hover,.nav-subitem.is-active { color:#fff; background:rgba(132,94,235,.2); border-color:rgba(183,158,255,.2); }
.nav-fold-group { display:grid; margin-top:4px; }
.nav-rebuild-group > .nav-fold-summary { display:grid; grid-template-columns:minmax(0,1fr) 42px; align-items:center; gap:4px; min-height:48px; cursor:pointer; list-style:none; border-radius:13px; }
.nav-fold-summary::-webkit-details-marker { display:none; }
.nav-fold-summary::marker { content:''; }
.nav-fold-summary:focus-visible { outline:2px solid #b99cff; outline-offset:2px; }
.nav-rebuild-group > .nav-fold-summary .nav-item { min-width:0; pointer-events:none; }
.nav-fold-chevron { display:grid; width:42px; height:48px; place-items:center; color:#c9c2d2; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.07); border-radius:12px; font-size:18px; transition:transform .2s ease; }
.nav-rebuild-group:not([open]) .nav-fold-chevron { transform:rotate(-90deg); }
.nav-fold-submenu { display:grid; gap:3px; margin:3px 0 8px 16px; padding-left:10px; border-left:1px solid rgba(183,158,255,.28); }
.nav-free-group { margin-top:8px; border-top:1px solid rgba(255,255,255,.07); }
.nav-free-group > .nav-fold-summary { display:flex; min-height:40px; align-items:center; justify-content:space-between; padding:0 12px; color:#bdb5c7; cursor:pointer; list-style:none; font-size:11px; font-weight:800; }
.nav-free-group > .nav-fold-summary i { font-style:normal; transition:transform .2s ease; }
.nav-free-group[open] > .nav-fold-summary i { transform:rotate(180deg); }
.nav-utility-group { margin-top:8px; border-top:1px solid rgba(255,255,255,.07); }
.nav-utility-group > summary { display:flex; align-items:center; justify-content:space-between; min-height:42px; padding:0 12px; color:#a8a0ad; cursor:pointer; font-size:11px; font-weight:750; list-style:none; }
.nav-utility-group > summary::-webkit-details-marker { display:none; }
.nav-utility-group > summary i { font-style:normal; transition:transform .2s ease; }
.nav-utility-group[open] > summary i { transform:rotate(180deg); }
.nav-utility-group .nav-item { min-height:40px; margin-block:2px; font-size:12px; }
.workspace-card-compact { margin:6px 3px; padding:9px 11px; border-radius:12px; }
.workspace-card-compact .workspace-top { margin:0; }
.workspace-card-compact .workspace-top span { font-size:10px; }
.workspace-card-compact .workspace-top strong { font-size:13px; }
.workspace-card-compact .progress-track { height:2px; margin:6px 0 4px; opacity:.45; }
.workspace-card-compact small { display:block; overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-utility-actions { display:grid; grid-template-columns:1fr 1fr; gap:5px; margin:3px; }
.sidebar-utility-button { display:flex; min-width:0; align-items:center; justify-content:center; gap:6px; min-height:36px; color:#aaa2b1; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.065); border-radius:10px; }
.sidebar-utility-button:hover,.sidebar-utility-button.is-active { color:#fff; background:rgba(126,92,239,.22); }
.sidebar-utility-button small { font-size:9px; }
.sidebar-footer-compact { display:grid; grid-template-columns:minmax(0,1fr) auto 38px auto; align-items:center; gap:4px; margin-top:4px; padding:6px 3px 3px; border-top:1px solid rgba(255,255,255,.07); }
.sidebar-footer-compact .account-card { min-width:0; grid-template-columns:28px minmax(0,1fr); gap:7px; min-height:40px; padding:4px 6px; border-top:0; }
.sidebar-footer-compact .avatar { width:28px; height:28px; border-radius:9px; font-size:12px; }
.sidebar-footer-compact .account-card strong { max-width:84px; font-size:10px; }
.sidebar-footer-compact .account-card small { display:none; }
.sidebar-credit-chip { display:grid; min-width:48px; align-content:center; gap:1px; padding:4px 6px; color:#aaa2b1; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.065); border-radius:9px; text-align:center; }
.sidebar-credit-chip > span { font-size:8px; }
.sidebar-credit-chip > strong { max-width:64px; overflow:hidden; color:#eee9f3; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-footer-compact .sidebar-utility-button { width:38px; min-height:40px; margin:0; padding:0; border-radius:9px; }

.creation-access-banner { display:flex; align-items:center; gap:11px; margin:0 0 18px; padding:12px 14px; border:1px solid #dce8df; border-radius:14px; background:#f5fbf7; }
.creation-access-banner > span { display:grid; flex:0 0 auto; width:28px; height:28px; place-items:center; color:#fff; background:#22a06b; border-radius:50%; font-weight:850; }
.creation-access-banner > div { display:grid; min-width:0; gap:2px; }
.creation-access-banner strong { color:#214333; font-size:12px; }
.creation-access-banner small { color:#6d7f74; font-size:10px; line-height:1.5; }
.creation-access-banner.is-blocked { border-color:#efcf9c; background:#fff9ef; }
.creation-access-banner.is-blocked > span { background:#dc8a17; }
.creation-access-banner.is-blocked strong { color:#714a10; }
.creation-access-banner.is-blocked small { color:#866837; }
.creation-access-banner .secondary-button { flex:0 0 auto; margin-left:auto; }
.studio-layout { grid-template-columns:minmax(400px,440px) minmax(0,1fr); min-height:calc(100vh - 170px); }
.studio-context-bar { display:grid; grid-template-columns:38px minmax(0,1fr); align-items:center; gap:10px; margin-bottom:10px; padding:10px 12px; background:#fff; border:1px solid #e4dde7; border-radius:13px; }
.studio-context-bar > span { display:grid; width:38px; height:38px; place-items:center; color:#fff; background:var(--purple); border-radius:11px; font-size:11px; font-weight:850; }
.studio-context-bar small,.studio-context-bar strong { display:block; }
.studio-context-bar small { color:var(--ink-3); font-size:9px; }
.studio-context-bar strong { margin-top:2px; font-size:12px; }
.studio-layout .config-panel { min-height:calc(100vh - 230px); }
.studio-layout .preview-panel { min-height:calc(100vh - 170px); }
.studio-layout .workbench-control-column { position:sticky; top:86px; align-self:start; }
.studio-layout .config-panel { display:flex; height:calc(100vh - 184px); min-height:620px; max-height:calc(100vh - 104px); overflow:hidden; flex-direction:column; }
.studio-layout .config-scroll { min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; }
.studio-layout .workbench-submit-bar { position:static; flex:0 0 auto; }

.feature-mobile-tabs { display:none; }
.feature-workbench { display:grid; grid-template-columns:minmax(380px,430px) minmax(0,1fr); gap:18px; align-items:start; min-height:calc(100vh - 190px); }
.feature-control-pane,.feature-output-pane { min-width:0; overflow:hidden; background:#fff; border:1px solid #e2dbe6; border-radius:20px; box-shadow:0 12px 34px rgba(42,30,53,.065); }
.feature-control-pane { padding:22px; }
.feature-pane-head > span,.feature-output-copy > small { color:var(--purple); font-size:9px; font-weight:850; letter-spacing:.1em; }
.feature-pane-head h2,.feature-output-copy h2 { margin:6px 0 0; font-size:24px; }
.feature-pane-head p,.feature-output-copy p { margin:7px 0 0; color:var(--ink-3); font-size:11px; line-height:1.7; }
.shooting-choice-list { display:grid; gap:8px; margin-top:18px; }
.shooting-choice { display:grid; grid-template-columns:68px minmax(0,1fr) auto; align-items:center; gap:12px; min-height:72px; padding:8px; background:#faf8fb; border:1px solid #e7e1e9; border-radius:14px; text-align:left; }
.shooting-choice:hover,.shooting-choice.is-active { background:#f5f0ff; border-color:#a68cdf; box-shadow:inset 3px 0 var(--purple); }
.shooting-choice > span { position:relative; display:block; width:68px; height:54px; overflow:hidden; border-radius:10px; }
.shooting-choice img { width:100%; height:100%; object-fit:cover; }
.shooting-choice i { position:absolute; right:4px; bottom:4px; padding:2px 4px; color:#fff; background:rgba(24,18,31,.7); border-radius:4px; font-size:6px; font-style:normal; }
.shooting-choice strong,.shooting-choice small { display:block; }
.shooting-choice strong { font-size:13px; }
.shooting-choice small { margin-top:5px; color:var(--ink-3); font-size:9px; line-height:1.5; }
.shooting-choice > b { color:var(--purple); }
.feature-guard-list { display:flex; gap:7px; margin-top:14px; flex-wrap:wrap; }
.feature-guard-list span { padding:6px 8px; color:#28765a; background:#eff8f4; border-radius:999px; font-size:8px; font-weight:750; }
.feature-output-pane { position:sticky; top:86px; min-height:calc(100vh - 190px); }
.feature-output-hero { position:relative; min-height:460px; height:62vh; overflow:hidden; background:#eee9f1; }
.feature-output-hero img { width:100%; height:100%; object-fit:cover; }
.feature-output-hero img.is-contain { object-fit:contain; }
.feature-output-hero > span { position:absolute; top:16px; left:16px; padding:7px 10px; color:#fff; background:rgba(25,20,30,.75); border-radius:9px; font-size:9px; font-weight:750; }
.feature-output-copy { padding:22px; }
.feature-output-copy > div { display:flex; gap:7px; margin:13px 0 17px; flex-wrap:wrap; }
.feature-output-copy > div span { padding:6px 9px; color:#5c5361; background:#f3eff5; border-radius:999px; font-size:9px; }

.detail-two-pane { display:grid; grid-template-columns:minmax(390px,440px) minmax(0,1fr); gap:14px 18px; align-items:start; }
.detail-two-pane > .detail-workflow-switch,.detail-two-pane > .detail-workflow-context,.detail-two-pane > .detail-policy,.detail-two-pane > .detail-workspace { grid-column:1; }
.detail-two-pane > .detail-workflow-switch { grid-row:1; grid-template-columns:1fr 1fr; margin:0; }
.detail-two-pane > .detail-workflow-context { grid-row:2; margin:0; }
.detail-two-pane > .detail-policy { grid-row:3; min-width:0; }
.detail-two-pane > .detail-workspace { grid-row:4; display:grid; grid-template-columns:1fr; gap:12px; }
.detail-two-pane > .detail-case-hero { position:sticky; top:86px; grid-column:2; grid-row:1 / span 4; min-width:0; max-height:calc(100vh - 104px); margin:0; overflow:auto; }
.detail-two-pane .detail-case-head { align-items:flex-start; flex-direction:column; }
.detail-two-pane .detail-case-compare { grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr); }
.detail-two-pane .detail-case-page-frame { max-height:none; }

.management-workbench { display:grid; grid-template-columns:minmax(270px,310px) minmax(0,1fr); gap:18px; align-items:start; }
.management-side-panel { position:sticky; top:86px; display:grid; gap:12px; min-width:0; padding:18px; background:#fff; border:1px solid #e2dbe5; border-radius:18px; box-shadow:0 10px 30px rgba(42,31,51,.055); }
.management-side-head > span,.management-content-head span { color:var(--purple); font-size:9px; font-weight:850; letter-spacing:.1em; }
.management-side-head h2,.management-content-head h2 { margin:6px 0 0; font-size:20px; }
.management-side-head p,.management-content-head p { margin:6px 0 0; color:var(--ink-3); font-size:10px; line-height:1.65; }
.management-search { display:grid; gap:6px; padding-top:6px; border-top:1px solid #eee9ef; }
.management-search > label { color:#766d7a; font-size:9px; font-weight:750; }
.management-search .search-field { width:100%; }
.management-filter-list { display:grid; gap:4px; }
.management-filter-list > button { display:flex; align-items:center; justify-content:space-between; min-height:39px; padding:0 11px; color:#635b68; background:#faf8fb; border:1px solid #ebe5ed; border-radius:10px; text-align:left; }
.management-filter-list > button.is-active { color:var(--purple-dark); background:#f1ebff; border-color:#b7a3e7; font-weight:800; }
.management-filter-list b { color:var(--purple); }
.management-note { padding:13px; background:#f2f8f5; border:1px solid #d7e9df; border-radius:12px; }
.management-note strong { color:#286b53; font-size:10px; }
.management-note p { margin:5px 0 8px; color:#557064; font-size:9px; line-height:1.6; }
.management-content-panel { display:grid; min-width:0; gap:18px; }
.management-content-head { display:flex; align-items:end; justify-content:space-between; gap:16px; padding:4px 2px 10px; }
.management-content-panel > .asset-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.task-management-workbench { grid-template-columns:minmax(320px,380px) minmax(0,1fr); }
.task-management-workbench .output-directory-card { grid-template-columns:44px minmax(0,1fr); margin:0; padding:15px; }
.task-management-workbench .output-directory-icon { width:44px; height:44px; border-radius:13px; }
.task-management-workbench .output-directory-actions { grid-column:1 / -1; justify-content:stretch; }
.task-management-workbench .output-directory-actions button { min-width:0; flex:1 1 0; white-space:normal; }
.task-management-workbench .output-directory-copy { overflow-wrap:normal; word-break:normal; }
.task-management-workbench .output-directory-copy > p,
.task-management-workbench .output-directory-copy > small { overflow-wrap:anywhere; }
.task-management-workbench .task-summary { grid-template-columns:1fr 1fr; margin:0; }
.task-management-links.compact { grid-template-columns:1fr 1fr; margin:0; }
.task-management-links.compact button { min-width:0; padding:10px; }
.task-management-links.compact small { font-size:8px; }
.generated-results-section,.tasks-list-section { min-width:0; }

@media (max-width:1280px) {
  .creation-category-grid,.creation-function-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .studio-layout { grid-template-columns:minmax(360px,400px) minmax(0,1fr); }
  .feature-workbench { grid-template-columns:minmax(350px,390px) minmax(0,1fr); }
  .detail-two-pane { grid-template-columns:minmax(350px,390px) minmax(0,1fr); }
  .management-content-panel > .asset-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .task-management-workbench { grid-template-columns:1fr; }
  .task-management-workbench .management-side-panel { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .task-management-workbench .management-side-panel > .output-directory-card,
  .task-management-workbench .management-side-panel > .task-management-links { grid-column:1 / -1; }
}
@media (max-width:760px) {
  .creation-category-grid,.creation-function-grid { grid-template-columns:1fr; }
  .creation-category-card { min-height:145px; }
  .creation-function-section { padding:16px; }
  .task-management-workbench .management-side-panel { grid-template-columns:1fr; }
  .feature-mobile-tabs { position:sticky; z-index:20; top:68px; display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:10px; padding:6px; background:rgba(247,246,244,.96); border:1px solid #e5dfe8; border-radius:13px; }
  .feature-mobile-tabs button { min-height:42px; color:#5f5764; background:#fff; border:1px solid #e5dfe8; border-radius:10px; font-weight:750; }
  .feature-mobile-tabs button.is-active { color:#fff; background:var(--purple); border-color:var(--purple); }
  .feature-workbench { display:block; min-height:0; }
  .feature-workbench[data-mobile-pane="controls"] [data-feature-pane="results"] { display:none; }
  .feature-workbench[data-mobile-pane="results"] [data-feature-pane="controls"] { display:none; }
  .feature-output-pane { position:static; min-height:calc(100vh - 190px); }
  .feature-output-hero { min-height:360px; height:55vh; }
  .studio-layout .workbench-control-column { position:static; }
  .studio-layout .config-panel { display:block; height:auto; min-height:0; max-height:none; overflow:visible; }
  .studio-layout .config-scroll { overflow:visible; }
  .detail-two-pane { display:block; }
  .detail-two-pane[data-mobile-pane="controls"] > .detail-case-hero { display:none; }
  .detail-two-pane[data-mobile-pane="results"] > :not(.detail-case-hero) { display:none; }
  .detail-two-pane > .detail-case-hero { position:static; max-height:none; }
  .detail-two-pane > .detail-workflow-switch { display:flex; margin-bottom:10px; }
  .detail-two-pane > .detail-workflow-context,.detail-two-pane > .detail-policy { margin-bottom:10px; }
  .management-workbench { display:block; }
  .management-side-panel { position:static; margin-bottom:14px; }
  .management-content-panel > .asset-grid { grid-template-columns:1fr; }
}
@media (max-width:390px) {
  .creation-directory-head { align-items:flex-start; flex-direction:column; }
  .creation-category-card { grid-template-columns:46px minmax(0,1fr) auto; padding:17px; }
  .creation-category-icon { width:46px; height:46px; }
  .creation-function-card { min-height:0; }
  .feature-control-pane { padding:15px; }
  .shooting-choice { grid-template-columns:58px minmax(0,1fr) auto; }
  .shooting-choice > span { width:58px; height:50px; }
  .feature-output-hero { min-height:320px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* 2026 visual closeout: readable type, light modeling surfaces and unobstructed cases */
body { font-size: var(--text-sm); }
small { font-size: var(--text-xs) !important; }

.brand small,
.nav-count,
.nav-pill,
.workspace-card small,
.account-card small,
.tool-group-label,
.eyebrow,
.workspace-section-head > div > span,
.workspace-module-index,
.workspace-module-overlay small,
.workspace-module-proof,
.workspace-module-actions button em,
.management-shortcuts small,
.shooting-option-copy em,
.shooting-assurance small,
.task-management-links small,
.activity-item time,
.asset-cover .asset-type,
.asset-fidelity-banner p,
.model-mode,
.fashion-input-guide strong,
.fashion-input-guide span,
.fashion-input-guide small,
.table-primary small,
.mapping-head,
.tier-tag,
kbd { font-size: var(--text-xs); }

.panel-header h2,
.panel-header h3,
.section-label strong,
.upload-slot strong,
.tool-item,
.breadcrumb { font-size: var(--text-base); }

.heading-actions > button,
.preview-mode-switch button { white-space: nowrap; }
.preview-mode-switch button { min-width: max-content; }

.page-heading p,
.panel-header p,
.config-title p,
.section-label span,
.field label,
.field-help { font-size: var(--text-xs); }

/* The workflow and prompt controls need to read as working UI, not microcopy. */
.detail-workflow-switch button {
  min-height: 126px;
  align-content: start;
  padding: 16px;
}
.detail-workflow-switch button > span {
  width: 34px;
  height: 34px;
  font-size: var(--text-xs);
}
.detail-workflow-switch strong { font-size: var(--text-base); }
.detail-workflow-switch small,
.detail-workflow-switch em,
.detail-workflow-context > div:first-child > span,
.detail-workflow-context p,
.detail-context-ready,
.detail-source-choice > span,
.detail-source-choice button { font-size: var(--text-xs); }
.detail-workflow-switch em { grid-column: 1 / -1; margin-left: 44px; }
.detail-workflow-context strong { font-size: var(--text-base); }
.detail-workflow-context p { line-height: 1.6; }
.detail-source-choice { flex-wrap: wrap; justify-content: flex-end; }
.detail-source-choice button { min-height: 40px; }

.prompt-assistant { padding: 18px; border-radius: 17px; }
.prompt-assistant-head > div > span,
.prompt-assistant-head small,
.prompt-ready,
.prompt-keyword-box label,
.prompt-model-box label,
.prompt-keyword-box input,
.prompt-model-box select,
.prompt-suggestions button,
.prompt-model-box small,
.prompt-style-row > span,
.prompt-style-row button { font-size: var(--text-xs); }
.prompt-assistant-head strong { font-size: var(--text-base); }
.prompt-keyword-box,
.prompt-model-box { padding: 13px; }
.prompt-keyword-box input,
.prompt-model-box select { min-height: 42px; }
.prompt-suggestions { gap: 7px; }
.prompt-suggestions button,
.prompt-style-row button { min-height: 34px; padding: 6px 9px; line-height: 1.35; }
.prompt-assistant-main { grid-template-columns: minmax(0,1fr) minmax(250px, .7fr); }

.tool-item { min-width: 0; min-height: 42px; grid-template-columns: 23px minmax(0,1fr) auto; gap: 6px; padding-right: 6px; padding-left: 6px; }
.tool-item .tool-item-icon { width: 23px; height: 23px; }
.tool-item .tool-item-name { font-size: 13px; line-height: 1.2; }
.tool-item em {
  flex: 0 0 auto;
  padding: 3px 4px;
  color: var(--purple-dark);
  background: var(--purple-soft);
  border-radius: 7px;
  font-size: 10px;
  font-weight: 700;
}

/* Example cards keep all narrative copy below the image. */
.tool-example-card {
  background: #fffdfb;
  border-color: #ded6eb;
  box-shadow: 0 16px 36px rgba(57,42,84,.11);
}
.example-media { background: #f1edf5; border-bottom: 1px solid #e5dfec; }
.example-media::after,
.case-compare-vignette,
.premium-fashion-case::after,
.suite-hero::after { display: none; }
.case-compare-caption,
.fashion-proof,
.suite-hero-copy { display: none; }
.example-copy { color: var(--ink); background: #fffdfb; }
.example-copy > small { color: var(--purple); font-size: var(--text-xs); }
.example-copy h3 { color: var(--ink); font-size: var(--text-md); }
.example-copy p { color: var(--ink-2); font-size: var(--text-sm); }
.example-copy > div {
  color: var(--ink-2);
  border-top-color: var(--line);
  font-size: var(--text-xs);
}
.example-copy > div span { color: var(--purple); }
.example-badge,
.case-compare-label { font-size: var(--text-xs); }
.example-media:has(.case-compare-art) > .example-badge { display: none; }
.case-compare-label {
  max-width: calc(100% - 24px);
  color: #3d3448;
  background: rgba(255,253,249,.9);
  border-color: rgba(99,76,132,.18);
  box-shadow: 0 6px 16px rgba(53,38,75,.12);
  white-space: nowrap;
}
.case-compare-label.before-label { top: 12px; left: 12px; }
.case-compare-label.after-label {
  top: auto;
  right: 12px;
  bottom: 12px;
  color: #fff;
  background: rgba(103,69,220,.9);
}

/* Single-image cases expand to the full visual stage after narrative copy moves below. */
.example-art.visual-only { display: block; padding: 0; background: #f1edf5; }
.example-art.visual-only > .shoe-visual,
.example-art.visual-only > .accessory-visual,
.example-art.visual-only > .endorse-visual { height: 100%; min-height: 0; border-radius: 0; }
.example-art.visual-only > .shoe-visual img,
.example-art.visual-only > .accessory-visual img,
.example-art.visual-only > .endorse-visual img { width: 100%; height: 100%; object-fit: cover; }
.packaging-art.visual-only { display: block; padding: 7px; }
.packaging-art.visual-only .packaging-stack { height: 100%; }
.poster-art::after { display: none; }

/* Product modeling uses one light material system across its large surfaces. */
.modeling-assurance {
  color: var(--ink);
  background: linear-gradient(120deg,#fffdf9,#f7f2ff 72%,#f0eaff);
  border-color: #ded3f1;
  box-shadow: 0 12px 28px rgba(74,51,113,.08);
}
.modeling-assurance > span {
  color: var(--purple-dark);
  background: #eee8ff;
  font-size: var(--text-xs);
}
.modeling-assurance strong { font-size: var(--text-base); }
.modeling-assurance p { color: var(--ink-2); font-size: var(--text-xs); }
.modeling-assurance > b { color: var(--purple-dark); font-size: var(--text-base); }

.model-preview,
.model-preview-apparel,
.model-preview-style {
  color: var(--ink);
  background:
    radial-gradient(circle at 54% 38%,rgba(255,255,255,.98),rgba(249,246,255,.94) 46%,rgba(235,228,247,.96) 100%);
  border: 1px solid #ded5ea;
  box-shadow: 0 18px 40px rgba(70,51,101,.12);
}
.model-preview .grid-floor {
  background-image:
    linear-gradient(rgba(117,85,232,.1) 1px,transparent 1px),
    linear-gradient(90deg,rgba(117,85,232,.1) 1px,transparent 1px);
}
.model-object,
.model-apparel-object,
.model-softgoods-object { filter: drop-shadow(0 24px 22px rgba(66,49,94,.2)); }
.model-preview.is-focused .model-object,
.model-preview.is-focused .model-apparel-object,
.model-preview.is-focused .model-softgoods-object { filter: drop-shadow(0 30px 25px rgba(66,49,94,.27)); }
.model-toolbar { z-index: 12; }
.glass-control {
  background: rgba(255,253,249,.88);
  border-color: rgba(104,77,151,.18);
  box-shadow: 0 7px 20px rgba(66,48,93,.1);
}
.glass-control button { color: var(--ink-2); }
.glass-control button:hover { color: var(--purple-dark); background: var(--purple-soft); }
.preview-mode-switch button,
.preview-style-code > span { font-size: var(--text-xs); }
.preview-style-code > span { color: var(--purple-dark); }
.model-caption { z-index: 10; min-width: 0; gap: 12px; }
.model-caption > div { min-width: 0; }
.model-caption strong { color: var(--ink); font-size: var(--text-base); }
.model-caption small { display: block; overflow-wrap: anywhere; color: var(--ink-3); }
.model-caption .status-badge { flex: 0 0 auto; color: var(--purple-dark); background: var(--purple-soft); }
.identity-preview-label { font-size: var(--text-xs); }
.identity-product-stage,
.derived-preview-frame {
  border-color: rgba(116,88,159,.18);
  box-shadow: 0 20px 38px rgba(69,51,94,.17),inset 0 0 0 1px rgba(255,255,255,.68);
}

.style-dock-selection {
  color: var(--ink);
  background: #f7f2ff;
  border: 1px solid #e2d8f3;
}
.style-dock-selection small { color: var(--ink-3); }
.style-dock-selection strong { color: var(--ink); font-size: var(--text-base); }
.style-dock-selection span { color: var(--ink-2); font-size: var(--text-xs); }
.style-output-tabs button { min-height: 52px; }
.style-output-tabs span,
.style-output-tabs small,
.style-dock-card small,
.style-dock-reference > span,
.style-dock-guard span { font-size: var(--text-xs); }

.derived-style-library {
  background: linear-gradient(145deg,#fffdf9,#faf7ff 68%,#f3edff);
  border-color: #ded4ef;
  box-shadow: 0 18px 38px rgba(69,48,105,.11);
}
.derived-style-head .eyebrow { color: var(--purple); }
.derived-style-head h3 { color: var(--ink); font-size: var(--text-md); }
.derived-style-head p { color: var(--ink-2); font-size: var(--text-xs); }
.derived-style-head > span {
  color: var(--purple-dark);
  background: var(--purple-soft);
  border-color: #d9ccf7;
  font-size: var(--text-xs);
}
.derived-style-card {
  border-color: #e2dce8;
  box-shadow: 0 8px 18px rgba(56,42,78,.07);
}
.derived-style-card:hover,
.derived-style-card.is-active { box-shadow: 0 12px 24px rgba(76,54,122,.13); }
.derived-style-copy strong { font-size: var(--text-base); }
.derived-style-copy em,
.derived-style-copy small,
.derived-style-copy > b { font-size: var(--text-xs); }
.derived-style-copy small { min-height: 0; }
.derived-style-selection {
  color: var(--ink);
  background: rgba(242,237,255,.9);
  border-color: #dfd4f4;
}
.derived-style-selection small { color: var(--ink-3); font-size: var(--text-xs); }
.derived-style-selection strong { color: var(--ink); font-size: var(--text-base); }
.derived-style-selection p { color: var(--ink-2); font-size: var(--text-xs); }
.derived-style-actions > span { color: var(--ink-3); font-size: var(--text-xs); }
.derived-style-actions > span b { color: var(--purple-dark); }
.derived-style-policy span {
  color: #5d4a86;
  background: #eee8fb;
  font-size: var(--text-xs);
}
.derived-style-media > i,
.derived-style-media > b,
.derived-preview-frame .derived-style-media > i,
.derived-preview-frame .derived-style-media > b { font-size: var(--text-xs); }
.model-reference-upload span,
.model-output-copy > small,
.model-output-copy > span,
.model-output-copy > em,
.fidelity-status,
.lock-observation em,
.lock-required { font-size: var(--text-xs) !important; }

.model-case-image span,
.model-case-card p,
.model-case-card small { font-size: var(--text-xs); }
.model-case-card strong { font-size: var(--text-base); }
.model-case-card > div:last-child { padding: 16px; }

.detail-policy,
.detail-case-head p,
.detail-case-badge,
.detail-phone > small,
.reference-hero em,
.detail-phone > b,
.detail-transform strong,
.detail-transform small,
.rebuilt-copy p,
.detail-dropzone small,
.detail-source-row input,
.rights-check strong,
.rights-check small,
.detail-module > span,
.detail-module strong,
.detail-module small,
.detail-detected strong,
.detail-detected small,
.detail-asset-mini strong,
.detail-asset-mini small,
.detail-asset-mini > span,
.creative-locks button,
.brand-clean-grid span { font-size: var(--text-xs); }
.detail-policy { color: var(--ink-2); background: #f2edfb; border: 1px solid #dfd5ef; }
.detail-module { grid-template-columns: 34px minmax(0,1fr) auto; min-height: 62px; }
.detail-module > span { width: 34px; height: 34px; }

.toast-region { width: min(420px,calc(100vw - 44px)); }
.toast { grid-template-columns: 32px minmax(0,1fr) auto; padding: 14px 15px; }
.toast strong { font-size: var(--text-base); }
.toast small { color: #d4ced9; font-size: var(--text-xs) !important; line-height: 1.5; }

/* One-image product modeling: the primary path stays short; extra capture guidance is optional. */
.capture-guide-simplified { padding: 24px; }
.modeling-essential-fields { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; min-width:0; margin-top: 18px; }
.modeling-essential-fields > input[type="hidden"] { display: none; }
.modeling-essential-fields > .field,.modeling-essential-fields input,.modeling-essential-fields select,.modeling-essential-fields textarea { min-width:0; width:100%; }
.modeling-quick-start { display: grid; grid-template-columns: minmax(0,1fr); gap: 12px; min-width:0; margin-top: 16px; }
.quick-upload-card { display: grid; grid-template-columns: 72px minmax(0,1fr); align-items: center; gap: 14px; min-width:0; max-width:100%; min-height: 150px; padding: 14px; color: var(--ink); text-align: left; background: linear-gradient(145deg,#fbf9ff,#f3effb); border: 1px dashed #bba9df; border-radius: 16px; transition: border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.quick-upload-card:hover { border-color: var(--purple); box-shadow: 0 14px 30px rgba(79,55,130,.12); transform: translateY(-1px); }
.quick-upload-card.is-dragover { background:#eee7ff; border-color:var(--purple); border-style:solid; box-shadow:0 0 0 4px rgba(117,85,232,.12); transform:translateY(-2px); }
.quick-upload-card.has-evidence { background: linear-gradient(145deg,#fff,#f5f1fc); border-style: solid; border-color: #d5caea; }
.quick-upload-card > img { width: 72px; height: 96px; padding: 6px; object-fit: contain; background: white; border: 1px solid #e5deee; border-radius: 12px; }
.quick-upload-icon { display: grid; width: 72px; height: 72px; place-items: center; color: var(--purple); background: white; border: 1px solid #e1d7f2; border-radius: 20px; font-size: 30px; box-shadow: 0 10px 24px rgba(69,46,116,.09); }
.quick-upload-copy { min-width: 0; overflow-wrap:anywhere; }
.quick-upload-copy strong,.quick-upload-copy small { display: block; }
.quick-upload-copy strong { font-size: var(--text-base); }
.quick-upload-copy small { margin-top: 7px; color: var(--ink-3); line-height: 1.55; }
.quick-upload-actions { grid-column:1 / -1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; width:100%; min-width:0; }
.quick-upload-actions button { min-width:0; padding: 9px 10px; color: var(--purple-dark); background: white; border: 1px solid #ddd2ef; border-radius: 9px; font-size: var(--text-xs); font-weight: 800; white-space:normal; }
.quick-upload-actions button:hover { color: white; background: var(--purple); border-color: var(--purple); }
.quick-lock-card { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; max-width:100%; min-height: 154px; padding: 18px; overflow:hidden; background: linear-gradient(135deg,#25202c,#3a2d4c); border: 1px solid #4a3c5a; border-radius: 16px; box-shadow: 0 16px 34px rgba(34,25,47,.16); }
.quick-lock-card > span { color: #c8b7ff; font-size: var(--text-xs); font-weight: 800; letter-spacing: .08em; }
.quick-lock-card > strong { margin-top: 8px; color: white; font-size: var(--text-base); line-height: 1.35; }
.quick-lock-card > p { flex: 1; margin: 8px 0 14px; color: #d0c8d8; font-size: var(--text-xs); line-height: 1.65; }
.quick-lock-card .primary-button { width: 100%; }
.quick-lock-card .modeling-submit-button:disabled { color:#aaa0b4; background:#e9e4ed; border-color:#e9e4ed; box-shadow:none; cursor:not-allowed; }
.modeling-upload-receipt { margin-top:12px; padding:14px; background:#f7fbf9; border:1px solid #d9ebe2; border-radius:14px; }
.modeling-upload-receipt-head { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.modeling-upload-receipt-head strong,.modeling-upload-receipt-head small { display:block; }
.modeling-upload-receipt-head strong { color:#267052; font-size:13px; }
.modeling-upload-receipt-head small { margin-top:4px; color:#648073; font-size:10px; }
.modeling-upload-receipt-head > span { color:#527064; font-size:10px; white-space:nowrap; }
.modeling-upload-preview-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(135px,1fr)); gap:9px; margin-top:12px; }
.modeling-upload-preview { position:relative; display:grid; grid-template-columns:48px minmax(0,1fr); align-items:center; gap:8px; min-width:0; margin:0; padding:7px 30px 7px 7px; background:white; border:1px solid #e0ebe5; border-radius:11px; }
.modeling-upload-preview img { width:48px; height:52px; object-fit:contain; background:#f7f5f8; border-radius:7px; }
.modeling-upload-preview figcaption { min-width:0; }
.modeling-upload-preview strong,.modeling-upload-preview small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.modeling-upload-preview strong { font-size:10px; }
.modeling-upload-preview small { margin-top:4px; color:#438067; font-size:9px; }
.modeling-upload-preview > button { position:absolute; top:6px; right:6px; display:grid; width:20px; height:20px; place-items:center; padding:0; color:#96717a; background:#f7eef0; border:0; border-radius:6px; }
.modeling-upload-preview > button:hover { color:white; background:#bd4c5d; }
.optional-capture-details { margin-top: 14px; overflow: hidden; background: #fbfafc; border: 1px solid #e6e1ea; border-radius: 14px; }
.optional-capture-details > summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 70px; padding: 14px 16px; cursor: pointer; list-style: none; }
.optional-capture-details > summary::-webkit-details-marker { display: none; }
.optional-capture-details > summary span,.optional-capture-details > summary strong,.optional-capture-details > summary small { display: block; }
.optional-capture-details > summary strong { font-size: var(--text-base); }
.optional-capture-details > summary small { margin-top: 4px; color: var(--ink-3); }
.optional-capture-details > summary > b { color: var(--purple-dark); font-size: var(--text-xs); white-space: nowrap; }
.optional-capture-details[open] > summary { background: #f6f2fb; border-bottom: 1px solid #e8e1ef; }
.optional-capture-body { padding: 14px; }

@media (max-width: 900px) {
  .modeling-essential-fields,.modeling-quick-start { grid-template-columns: 1fr; }
  .detail-workflow-switch button { min-height: 0; }
  .prompt-assistant-main { grid-template-columns: 1fr; }
  .derived-style-head { min-width: 0; }
  .derived-style-selection { grid-template-columns: 36px minmax(0,1fr); }
  .derived-style-actions { grid-column: 1 / -1; }
}

@media (max-width: 1280px) {
  .fashion-material-layout { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .capture-guide-simplified { padding: 18px; }
  .quick-upload-card { grid-template-columns: 72px minmax(0,1fr); min-height: 150px; padding: 13px; }
  .quick-upload-card > img { width: 72px; height: 96px; }
  .quick-upload-icon { width: 62px; height: 62px; border-radius: 17px; }
  .quick-upload-actions { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; width: 100%; }
  .modeling-upload-receipt-head { align-items:flex-start; flex-direction:column; }
  .modeling-upload-receipt-head > span { white-space:normal; }
  .optional-capture-details > summary { align-items: flex-start; flex-direction: column; }
  .optional-capture-details > summary > b { white-space: normal; }
  .optional-capture-body .angle-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .tool-panel .tool-list { padding-bottom: 6px; scrollbar-width: thin; }
  .tool-item { flex: 0 0 auto; min-width: max-content; }
  .tool-item em { display: inline-flex; }
  .detail-workflow-switch em { margin-left: 44px; }
  .modeling-assurance { grid-template-columns: 1fr; }
  .modeling-assurance > span { grid-column: 1; max-width: 100%; overflow-wrap: anywhere; }
  .modeling-assurance > b { white-space: normal; }
  .model-caption { right: 14px; bottom: 14px; left: 14px; align-items: flex-start; flex-direction: column; }
  .model-caption .status-badge { align-self: flex-start; }
  .derived-style-library { overflow: hidden; }
  .derived-style-grid { max-width: 100%; }
  .derived-style-card { min-width: min(82vw,250px); }
  .derived-style-selection { grid-template-columns: 34px minmax(0,1fr); }
  .derived-style-actions { align-items: stretch; flex-direction: column; }
  .derived-style-actions > span { text-align: left; }
  .model-case-image { height: 230px; }
  .detail-source-row { min-width: 0; flex-wrap: wrap; }
  .detail-source-row input { flex-basis: 100%; min-height: 42px; }
  .creative-locks { grid-template-columns: 1fr; }
  .toast-region { right: 12px; bottom: 12px; width: calc(100vw - 24px); }
}

/* Local-first generation delivery and honest image loading states. */
.output-directory-card { display:grid; grid-template-columns:52px minmax(0,1fr) auto; align-items:center; gap:16px; margin-bottom:18px; padding:18px 20px; background:linear-gradient(135deg,#fff,#f6f1ff); border:1px solid #ded3f0; border-radius:17px; box-shadow:0 14px 30px rgba(67,46,105,.08); }
.output-directory-card.is-required { background:linear-gradient(135deg,#fff9f3,#fff,#f7f1ff); border-color:#e8cda9; }
.output-directory-icon { display:grid; width:52px; height:52px; place-items:center; color:white; background:linear-gradient(145deg,var(--purple),#9c73ff); border-radius:15px; font-size:20px; font-weight:900; box-shadow:0 10px 22px rgba(107,77,199,.22); }
.output-directory-card.is-required .output-directory-icon { background:linear-gradient(145deg,#a96520,#e1a458); }
.output-directory-copy { min-width:0; }
.output-directory-copy > span,.output-directory-copy > strong,.output-directory-copy > small { display:block; }
.output-directory-copy > span { color:var(--purple); font-size:10px; font-weight:900; letter-spacing:.1em; }
.output-directory-copy > strong { margin-top:4px; font-size:15px; }
.output-directory-copy > p { margin:5px 0; color:var(--ink-2); font-size:11px; line-height:1.55; }
.output-directory-copy > small { color:var(--ink-3); font-size:10px; }
.output-directory-actions { display:flex; gap:8px; }
.output-directory-actions button[disabled] { opacity:.45; cursor:not-allowed; }
.generated-results-section { margin-bottom:18px; padding:20px; background:#fff; border:1px solid var(--line); border-radius:17px; box-shadow:var(--shadow-soft); }
.generated-results-section .panel-header { margin-bottom:14px; }
.generated-results-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
.generated-results-grid > .empty-state { grid-column:1 / -1; }
.generated-result-card { min-width:0; overflow:hidden; background:#fbfafc; border:1px solid #e5dfea; border-radius:14px; }
.generated-result-card.is-expired { background:#f7f5f8; }
.generated-result-media { position:relative; height:190px; overflow:hidden; background:linear-gradient(145deg,#eeeaf3,#ddd7e5); }
.generated-result-media > img { width:100%; height:100%; object-fit:cover; }
.workbench-result-gallery { display:grid; width:100%; height:100%; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px; background:#e8e2ed; }
.workbench-result-gallery.count-1 { grid-template-columns:1fr; }
.workbench-result-gallery img { width:100%; height:100%; min-height:0; object-fit:cover; }
.task-result-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.task-result-gallery figure { min-width:0; margin:0; overflow:hidden; background:#f6f3f8; border:1px solid var(--line); border-radius:13px; }
.task-result-gallery a { display:block; color:inherit; text-decoration:none; }
.task-result-gallery img { display:block; width:100%; height:min(42vh,360px); object-fit:contain; background:linear-gradient(145deg,#f5f2f7,#e8e2ed); }
.task-result-gallery figcaption { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; padding:9px 11px; color:var(--ink-2); font-size:10px; }
.task-result-gallery figcaption > div { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.generated-result-media > span { position:absolute; z-index:3; top:9px; left:9px; padding:5px 7px; color:#fff; background:rgba(28,22,34,.72); border-radius:7px; font-size:9px; font-weight:800; backdrop-filter:blur(8px); }
.generated-result-media > .repair-status { position:absolute; z-index:4; top:9px; right:9px; max-width:132px; padding:6px 8px; color:#372354; background:rgba(255,255,255,.92); border:1px solid rgba(104,68,166,.22); border-radius:999px; font-size:9px; font-weight:850; box-shadow:0 5px 16px rgba(32,24,46,.12); backdrop-filter:blur(10px); }
.generated-result-media > .repair-status.status-approved { color:#0c6b4d; border-color:rgba(21,145,103,.22); }
.generated-result-media > .repair-status.status-failed,.generated-result-media > .repair-status.status-qa-failed { color:#a13c45; border-color:rgba(177,67,76,.22); }
.generated-result-body { padding:13px; }
.generated-result-body > strong,.generated-result-body > small { display:block; }
.generated-result-body > strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.generated-result-body > small { margin-top:4px; color:var(--ink-3); font-size:9px; }
.generated-result-body > p { min-height:32px; margin:8px 0 10px; color:var(--ink-2); font-size:10px; line-height:1.55; }
.generated-result-actions { display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
.generated-result-actions .text-button { font-size:9px; }
.record-expired-label { color:var(--ink-3); font-size:9px; }
.repair-compare { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.repair-compare figure { min-width:0; margin:0; overflow:hidden; background:#f4f1f7; border:1px solid var(--line); border-radius:13px; }
.repair-compare img { display:block; width:100%; height:260px; object-fit:contain; background:linear-gradient(145deg,#f5f2f7,#e8e2ed); }
.repair-compare figcaption { padding:9px 11px; color:var(--ink-2); font-size:10px; font-weight:750; }
.repair-plan { margin-top:18px; }
.repair-plan h3 { margin:0 0 9px; font-size:13px; }
.repair-plan-row { display:grid; grid-template-columns:120px minmax(0,1fr); gap:4px 10px; padding:10px 0; border-top:1px solid var(--line); }
.repair-plan-row span { grid-row:1 / span 2; width:fit-content; padding:4px 7px; color:var(--purple-dark); background:#f0eafa; border-radius:7px; font-size:9px; font-weight:800; }
.repair-plan-row strong { font-size:11px; }
.repair-plan-row small { color:var(--ink-3); font-size:9px; line-height:1.45; }
.repair-review-footer { align-items:center; flex-wrap:wrap; }
.repair-qa-note { min-width:220px; flex:1 1 320px; margin-right:auto; }
.repair-qa-note strong,.repair-qa-note p { display:block; }
.repair-qa-note strong { font-size:11px; }
.repair-qa-note p { margin:3px 0 0; color:var(--ink-3); font-size:9px; line-height:1.5; }
.task-result-placeholder { display:flex; width:100%; height:100%; min-height:120px; align-items:center; justify-content:center; flex-direction:column; padding:18px; color:var(--ink-2); text-align:center; background:linear-gradient(145deg,#f1edf4,#e7e1ec); }
.task-result-placeholder > span { display:grid; width:36px; height:36px; place-items:center; margin-bottom:8px; color:white; background:var(--purple); border-radius:50%; font-weight:900; }
.task-result-placeholder > strong,.task-result-placeholder > small { display:block; }
.task-result-placeholder > small { margin-top:4px; color:var(--ink-3); font-size:9px; }
.task-progress-cell strong,.task-progress-cell small { display:block; }
.task-progress-cell small { max-width:150px; margin-top:3px; color:var(--ink-3); font-size:9px; line-height:1.35; }
.task-progress-cell.is-failed strong,.task-progress-cell.is-failed small { color:var(--red); }
.output-file-row { display:grid; width:100%; grid-template-columns:28px minmax(0,1fr) auto; align-items:center; gap:10px; padding:10px; color:var(--ink); text-align:left; background:#f8f6fa; border:1px solid #ebe5ef; border-radius:10px; }
.output-file-row + .output-file-row { margin-top:7px; }
.output-file-row > span { display:grid; width:28px; height:28px; place-items:center; color:var(--purple); background:#eee8fb; border-radius:8px; }
.output-file-row strong,.output-file-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.output-file-row strong { font-size:11px; }.output-file-row small { margin-top:3px; color:var(--ink-3); font-size:9px; }.output-file-row b { color:var(--purple); font-size:10px; }
.output-folder-summary { display:flex; align-items:flex-start; gap:11px; margin-bottom:14px; padding:13px; background:#f2fbf7; border:1px solid #cae9da; border-radius:11px; }
.output-folder-summary > span { color:var(--green); font-weight:900; }.output-folder-summary strong,.output-folder-summary p { display:block; margin:0; }.output-folder-summary p { margin-top:4px; color:var(--ink-2); font-size:10px; line-height:1.5; }
.output-file-list { max-height:48vh; overflow:auto; }
.link-button { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
.image-state-container { position:relative; }
.image-state-container.has-image-load-issue > img { opacity:.18; }
.image-load-notice { position:absolute; z-index:12; inset:0; display:flex; align-items:center; justify-content:center; flex-direction:column; padding:12px; color:#514762; text-align:center; background:linear-gradient(145deg,rgba(246,243,249,.96),rgba(233,227,239,.96)); }
.image-load-notice > span { display:grid; width:30px; height:30px; place-items:center; margin-bottom:6px; color:white; background:var(--purple); border-radius:50%; font-weight:900; }.image-load-notice strong,.image-load-notice small { display:block; }.image-load-notice strong { font-size:10px; }.image-load-notice small { margin-top:3px; font-size:8px; }.image-load-notice button { margin-top:7px; padding:5px 8px; color:var(--purple-dark); background:white; border:1px solid #d8cdec; border-radius:7px; font-size:8px; font-weight:800; }

@media (max-width: 1100px) {
  .generated-results-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .output-directory-card { grid-template-columns:48px minmax(0,1fr); }
  .output-directory-actions { grid-column:1 / -1; justify-content:flex-end; }
}

@media (max-width: 640px) {
  .generated-results-grid { grid-template-columns:1fr; }
  .generated-result-media { height:210px; }
  .task-result-gallery { grid-template-columns:1fr; }
  .task-result-gallery img { height:300px; }
  .output-directory-card { grid-template-columns:40px minmax(0,1fr); padding:14px; }
  .output-directory-icon { width:40px; height:40px; border-radius:12px; }
  .output-directory-actions { align-items:stretch; flex-direction:column; }
  .output-directory-actions button { width:100%; }
  .feedback-grid,.repair-compare { grid-template-columns:1fr; }
  .repair-compare img { height:210px; }
  .repair-plan-row { grid-template-columns:1fr; }
  .repair-plan-row span { grid-row:auto; }
  .repair-review-footer { align-items:stretch; flex-direction:column; }
  .repair-review-footer > button { width:100%; }
}
/* Selective locked-model derivative generation */
.derivative-selection-panel{margin-top:18px;padding:18px;border:1px solid var(--line,#e7e2ef);border-radius:18px;background:var(--panel,#fff)}
.derivative-selection-panel .panel-header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.derivative-selection-panel h3{margin:4px 0}.derivative-selection-panel p{margin:4px 0;color:var(--muted,#6b6475)}
.derivative-select-group{margin-top:14px;padding-top:12px;border-top:1px solid var(--line,#eee);}.derivative-select-group>div:first-child{display:flex;justify-content:space-between}
.derivative-select-group small{color:var(--muted,#6b6475)}.derivative-select-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:8px}
.derivative-select-grid label{display:flex;gap:6px;align-items:center;padding:8px;border:1px solid var(--line,#e7e2ef);border-radius:10px;font-size:12px;cursor:pointer}.derivative-select-grid input{accent-color:#6d4aff}
.derivative-selection-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:16px}.derivative-selection-footer span{font-size:12px;color:var(--muted,#6b6475)}
@media(max-width:900px){.derivative-select-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.derivative-selection-footer{align-items:stretch;flex-direction:column}}

/* Detail studio: the case study is a product workflow preview, not an ad poster. */
.detail-case-hero { padding: 26px 30px 30px; background: #fffdfa; border-color: #e7e1d9; }
.detail-case-head { align-items: flex-start; gap: 24px; margin-bottom: 22px; }
.detail-case-head h2 { max-width: 680px; font-family: "Noto Serif SC", "Songti SC", serif; font-size: 26px; font-weight: 600; letter-spacing: -.02em; }
.detail-case-head p { max-width: 660px; color: #756d78; font-size: 14px; line-height: 1.75; }
.detail-case-badge { color: #655e67; background: #f4f0eb; border-color: #e6ded5; font-size: 11px; }
.detail-compare { align-items: stretch; gap: 18px; }
.detail-phone { height: 520px; padding: 10px; background: #f7f5f1; border: 1px solid #ded8d0; border-radius: 18px; box-shadow: 0 10px 24px rgba(45,35,25,.08); }
.detail-phone > small { top: 16px; left: 16px; color: #4e4750; background: rgba(255,253,250,.94); border: 1px solid #e6ded5; border-radius: 7px; font-size: 10px; letter-spacing: .03em; }
.reference-hero em { display: none; }
.reference-page > b, .rebuilt-page > b { right: 12px; bottom: 12px; left: 12px; padding: 8px 10px; color: #574f57; background: rgba(255,253,250,.94); border: 1px solid #e6ded5; border-radius: 8px; font-size: 10px; font-weight: 600; }
.detail-transform { gap: 9px; color: #665d6b; }
.detail-transform > span { color: #fff; background: #6650bb; box-shadow: 0 8px 18px rgba(102,80,187,.2); }
.detail-transform strong { font-size: 11px; font-weight: 700; }
.detail-transform small { color: #837a87; font-size: 10px; line-height: 1.7; }
.rebuilt-hero span { display: none; }
.rebuilt-copy { padding: 12px 13px; background: #fffdfa; }
.rebuilt-copy strong { color: #29242b; font-family: "Noto Serif SC", "Songti SC", serif; font-size: 12px; font-weight: 600; }
.rebuilt-copy p { color: #756d78; font-size: 10px; }

/* Dashboard product identity: one quiet product example, not a decorative collage. */
.modeling-spotlight { min-height: 330px; grid-template-columns: minmax(300px,.78fr) minmax(0,1.22fr); color: var(--ink); background: #efede8; border: 1px solid #e2ddd5; border-radius: 20px; box-shadow: 0 14px 34px rgba(38,30,21,.07); }
.modeling-spotlight-media { min-height: 330px; background: #ded9d1; }
.modeling-spotlight-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 54%, rgba(27,22,31,.14)); }
.modeling-spotlight-media > img { width: 100%; height: 100%; object-fit: cover; object-position: 45% center; }
.modeling-spotlight-media > span { left: 18px; bottom: 18px; color: #4a414d; background: rgba(255,253,250,.88); border: 1px solid rgba(91,80,65,.13); border-radius: 8px; font-size: 10px; letter-spacing: .04em; }
.modeling-spotlight-copy { align-self: center; padding: 48px 52px; }
.modeling-spotlight-copy .eyebrow { color: #6851c7; }
.modeling-spotlight-copy h2 { color: #221d25; font-family: "Noto Serif SC", "Songti SC", serif; font-size: clamp(28px,2.5vw,39px); font-weight: 600; letter-spacing: -.03em; }
.modeling-spotlight-copy p { max-width: 680px; color: #6c6470; font-size: 14px; line-height: 1.8; }
.modeling-spotlight-copy > div { gap: 8px; margin: 20px 0 24px; }
.modeling-spotlight-copy > div span { color: #665e68; background: #fffdfa; border-color: #dfd8cf; font-size: 11px; }
@media (max-width: 900px) { .modeling-spotlight { grid-template-columns: 1fr; } .modeling-spotlight-media { min-height: 260px; } .modeling-spotlight-copy { padding: 32px; } }

/* Cross-page hierarchy cleanup: Chinese product names lead; English metadata stays quiet. */
.workspace-module-overlay small, .shooting-option-media i, .example-badge, .workspace-module-index { opacity: .82; letter-spacing: .06em; }
.workspace-module-overlay small, .shooting-option-media i { font-size: 9px; }
.workspace-module-card, .shooting-option-card, .template-card { overflow: hidden; }
.workspace-module-visual, .shooting-option-media, .template-cover { background: #eeeae4; }
.workspace-module-visual::after, .shooting-option-media::after { background: linear-gradient(180deg, transparent 40%, rgba(24,20,25,.66)); }
.workspace-module-overlay h2, .shooting-option-copy strong, .template-info strong { font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei UI", sans-serif; font-weight: 650; }
.workspace-module-body > p, .shooting-option-copy small, .template-info small { color: #756d78; }
.workspace-module-actions button { color: #51495a; background: #fffdfa; border-color: #e5ded5; box-shadow: none; }
.workspace-module-actions button:hover { color: #4e399f; background: #f4f0fb; border-color: #d8ccef; }
.detail-case-hero .detail-case-head h2, .modeling-spotlight-copy h2 { text-wrap: balance; }
.hero-panel { background: #25212c; }
.hero-copy p { color: #bdb6c4; }
.hero-visual .orb-a { opacity: .62; }
.hero-visual .orb-b { opacity: .45; }
.nav-section-label { color: #bdb6c7; }
.nav-pill { font-size: 10px; font-weight: 650; }
.metric-card strong { font-variant-numeric: tabular-nums; }
.quick-generate { display:grid; grid-template-columns:minmax(270px,.72fr) minmax(0,1.28fr); gap:34px; align-items:center; min-height:238px; margin:26px 0 36px; padding:32px 36px; background:#fffdfa; border:1px solid #e6e0d8; border-radius:20px; box-shadow:0 10px 30px rgba(35,28,20,.055); }
.quick-generate-copy h2 { margin:5px 0 6px; color:#28222a; font-family:"Noto Serif SC","Songti SC",serif; font-size:25px; font-weight:600; letter-spacing:-.025em; }
.quick-generate-copy p { margin:0; color:#776e7c; font-size:13px; line-height:1.7; }
.quick-generate-form { min-width:0; }
.quick-generate-form textarea { width:100%; min-height:72px; resize:vertical; padding:13px 15px; color:#2c2630; background:#faf8f5; border:1px solid #dfd8cf; border-radius:12px; outline:none; font-size:14px; line-height:1.6; }
.quick-generate-input-row { display:grid; grid-template-columns:150px minmax(0,1fr); gap:12px; align-items:stretch; }
.quick-upload { display:flex; min-height:96px; align-items:center; justify-content:center; gap:8px; padding:10px; color:#5d47b7; background:#f7f3ff; border:1px dashed #b9a7e6; border-radius:12px; font-size:12px; font-weight:700; }
.quick-upload:hover { background:#f1ebff; border-color:#8d74d5; }
.quick-upload img { width:44px; height:44px; object-fit:cover; border-radius:8px; }
.quick-generate-form textarea:focus { border-color:#b8a7e5; box-shadow:0 0 0 3px rgba(104,81,199,.11); }
.quick-generate-controls { display:grid; grid-template-columns:repeat(3,minmax(130px,1fr)) auto; gap:9px; align-items:end; margin-top:10px; }
.quick-generate-controls label { display:grid; gap:5px; color:#716875; font-size:11px; font-weight:650; }
.quick-generate-controls select { height:38px; padding:0 10px; color:#38303c; background:#fffdfa; border:1px solid #dfd8cf; border-radius:9px; font-size:12px; }
.quick-generate-controls .primary-button { min-height:38px; white-space:nowrap; }
@media(max-width:900px){.quick-generate{grid-template-columns:1fr}.quick-generate-input-row{grid-template-columns:120px minmax(0,1fr)}.quick-generate-controls{grid-template-columns:1fr 1fr}.quick-generate-controls .primary-button{grid-column:1/-1}}
@media(max-width:520px){.quick-generate{padding:22px 18px}.quick-generate-input-row{grid-template-columns:minmax(0,1fr)}.quick-upload{min-height:64px}.quick-generate-controls{grid-template-columns:minmax(0,1fr)}.quick-generate-controls label,.quick-generate-controls select{min-width:0;width:100%}}

/* Video downloader: independent workspace module with simple admin controls. */
.video-download-hero { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr); gap:18px; margin-bottom:18px; padding:20px; }
.video-download-entry, .video-download-summary, .video-download-preview-card, .video-download-policy-card, .video-download-history { min-width:0; }
.video-download-entry textarea { width:100%; min-height:150px; margin-top:8px; resize:vertical; }
.video-download-entry-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:12px; color:var(--ink-3); font-size:10px; }
.video-download-alert { display:grid; grid-template-columns:28px minmax(0,1fr); gap:10px; margin-top:14px; padding:12px 14px; border-radius:12px; }
.video-download-alert.is-error { background:#fff4f4; border:1px solid #f0cbcb; }
.video-download-alert > span { display:grid; width:28px; height:28px; place-items:center; color:#fff; background:#c34c52; border-radius:50%; font-weight:900; }
.video-download-alert strong, .video-download-alert p, .video-download-alert small { display:block; margin:0; }
.video-download-alert p { margin-top:3px; color:#5c4450; font-size:11px; line-height:1.6; }
.video-download-alert small { margin-top:4px; color:#8d6670; font-size:10px; }
.video-download-summary { padding:18px; background:linear-gradient(145deg,#f7f3ff,#fffdf9); border:1px solid #e7dff4; border-radius:16px; box-shadow:0 8px 24px rgba(78,57,159,.06); }
.video-download-summary h3 { margin:4px 0 6px; font-size:18px; }
.video-download-summary p { margin:0; color:var(--ink-2); font-size:11px; line-height:1.6; }
.quota-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:14px; }
.quota-grid > div { padding:12px; background:#fff; border:1px solid #e8e1f1; border-radius:12px; text-align:center; }
.quota-grid strong { display:block; font-size:18px; color:var(--purple-dark); }
.quota-grid small { color:var(--ink-3); font-size:10px; }
.quota-note { display:flex; gap:8px; align-items:flex-start; margin-top:14px; padding:10px 11px; background:#f8f7fb; border:1px solid #ebe4f4; border-radius:11px; color:var(--ink-2); font-size:10px; line-height:1.55; }
.quota-note > span:first-child { color:var(--purple); font-weight:900; }
.video-download-detail-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:18px; margin-bottom:18px; }
.video-download-parsed { display:grid; grid-template-columns:180px minmax(0,1fr); gap:16px; align-items:start; }
.video-download-parsed > img, .video-download-cover-fallback { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:14px; background:#eee8f3; border:1px solid #e8e0ef; }
.video-download-cover-fallback { display:grid; place-items:center; color:var(--purple); font-size:30px; font-weight:900; }
.video-download-parsed-copy h3 { margin:5px 0 6px; font-size:18px; }
.video-download-parsed-copy p { margin:0; color:var(--ink-2); font-size:11px; }
.video-download-parsed-copy small { display:block; margin-top:6px; color:var(--ink-3); font-size:10px; line-height:1.5; }
.video-download-parsed-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.video-download-policy-list { display:grid; gap:10px; margin-top:12px; }
.video-download-policy-row { padding:12px; background:#fbfafc; border:1px solid #e8e1ef; border-radius:13px; }
.video-download-policy-row.is-current { background:#f5f1ff; border-color:#d9caf4; }
.video-download-policy-row > div:first-child strong, .video-download-policy-row > div:first-child small { display:block; }
.video-download-policy-row > div:first-child small { margin-top:4px; color:var(--ink-3); font-size:10px; }
.policy-inputs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:10px; }
.policy-inputs label { display:grid; gap:5px; color:var(--ink-3); font-size:10px; }
.policy-inputs input { width:100%; min-height:38px; padding:0 10px; border-radius:10px; }
.video-download-history { padding:20px; }
.video-download-history-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; color:var(--ink-3); font-size:10px; }
.video-download-request-list { display:grid; gap:12px; }
.video-download-request-card { display:grid; grid-template-columns:124px minmax(0,1fr); gap:14px; padding:14px; background:#fff; border:1px solid #e8e1ef; border-radius:16px; }
.video-download-request-card.is-failed { background:#fff8f8; border-color:#f1d1d1; }
.video-download-request-media { height:100%; min-height:120px; overflow:hidden; background:linear-gradient(145deg,#efeaf6,#dfd7e8); border-radius:12px; }
.video-download-request-media > img { width:100%; height:100%; object-fit:cover; }
.video-download-request-media > span { display:grid; width:100%; height:100%; place-items:center; color:var(--purple); font-size:28px; font-weight:900; }
.video-download-request-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.video-download-request-head strong, .video-download-request-head small { display:block; }
.video-download-request-head strong { font-size:13px; }
.video-download-request-head small { margin-top:4px; color:var(--ink-3); font-size:10px; line-height:1.5; }
.video-download-request-body p { margin:10px 0 12px; color:var(--ink-2); font-size:11px; line-height:1.6; }
.video-download-request-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; color:var(--ink-3); font-size:10px; }
.video-download-scope { display:flex; gap:8px; flex-wrap:wrap; }

@media (max-width: 1100px) {
  .video-download-hero, .video-download-detail-grid { grid-template-columns:1fr; }
  .video-download-parsed { grid-template-columns:150px minmax(0,1fr); }
}

@media (max-width: 640px) {
  .video-download-hero, .video-download-history { padding:16px; }
  .video-download-request-card { grid-template-columns:1fr; }
  .video-download-request-media { min-height:180px; }
  .video-download-parsed { grid-template-columns:1fr; }
  .video-download-history-head { align-items:flex-start; flex-direction:column; }
  .policy-inputs { grid-template-columns:1fr; }
  .quota-grid { grid-template-columns:1fr; }
}

/* Premium visual language: calmer type, fewer decorative effects, clearer hierarchy. */
:root {
  --ink: #17151a;
  --ink-2: #514b59;
  --ink-3: #69616f;
  --canvas: #f7f6f4;
  --surface: #fffdfa;
  --line: #e9e5df;
  --line-strong: #d8d1c8;
  --purple: #6851c7;
  --purple-dark: #4e399f;
  --purple-soft: #f0edfb;
  --radius: 16px;
  --radius-sm: 10px;
}
body {
  background: #f7f6f4;
  font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei UI", "Microsoft YaHei", Inter, system-ui, sans-serif;
  font-size: 15px;
  letter-spacing: 0;
}
.main-stage::before { opacity: .07; background-size: 56px 56px; }
.topbar { height: 68px; gap:16px; padding-inline: 36px; background: rgba(247,246,244,.92); }
.page-container { padding: 14px 24px 44px; }
.page-heading, .workspace-welcome { border-radius: 18px; box-shadow: 0 8px 28px rgba(35,28,20,.045); }
.page-heading h1, .workspace-welcome h1, .hero-copy h1 { font-family: "Noto Serif SC", "Songti SC", "STSong", serif; font-weight: 600; letter-spacing: -.025em; }
.eyebrow, .workspace-section-head > div > span { letter-spacing: .08em; font-size: 10px; }
.workspace-module-card, .panel, .metric-card, .asset-card, .template-card { border-color: #e9e5df; box-shadow: 0 7px 22px rgba(35,28,20,.045); }
.workspace-module-card:hover, .asset-card:hover, .template-card:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(35,28,20,.08); }
.workspace-module-overlay h2 { font-family: "Noto Serif SC", "Songti SC", serif; font-weight: 600; letter-spacing: -.02em; }
.primary-button { background: #5d47b7; border-color: #503aa5; box-shadow: 0 6px 16px rgba(93,71,183,.18); }
.primary-button:hover { background: #503aa5; }
.nav-item { background: transparent; border-color: transparent; box-shadow: none; }
.nav-item.is-active { background: rgba(126,92,239,.25); box-shadow: inset 3px 0 #b197ff; }
.hero-panel { border-radius: 20px; box-shadow: 0 16px 42px rgba(22,18,31,.11); }
input, textarea, select { color: var(--ink); }
::selection { color: #fff; background: #6851c7; }
.admin-error-code { color:var(--ink-3); font-size:11px; }
.admin-error-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px; }

/* Detail page studio v3: real before/after case, left-to-right task flow, readable premium UI. */
#page-detail { color:#1d1920; }
#page-detail .page-heading > div > p { max-width:760px; color:#5f5864; font-size:14px; line-height:1.75; }
#page-detail .panel { background:#fffdfa; border-color:#e3ddd5; box-shadow:0 10px 30px rgba(34,27,21,.055); }
#page-detail .panel-header h2 { font-size:19px; letter-spacing:-.01em; }
#page-detail .panel-header p { color:#665f6b; font-size:12px; line-height:1.65; }
#page-detail .eyebrow { color:#654fc0; font-size:10px; font-weight:800; letter-spacing:.09em; }

.detail-workflow-switch { gap:12px; margin-bottom:14px; }
.detail-workflow-switch button { min-height:92px; padding:16px; background:#fffdfa; border-color:#e3ddd5; border-radius:15px; }
.detail-workflow-switch button.is-active { background:#f3effb; border-color:#9d89dc; box-shadow:inset 0 0 0 1px rgba(93,71,183,.08),0 8px 22px rgba(74,53,133,.08); }
.detail-workflow-switch button > span { width:32px; height:32px; color:#5d47b7; background:#ede8fa; font-size:10px; }
.detail-workflow-switch strong { color:#27212b; font-size:14px; }
.detail-workflow-switch small { margin-top:6px; color:#665f6b; font-size:11px; line-height:1.55; }
.detail-workflow-switch em { padding:4px 8px; color:#5b45ad; background:#ece7f8; font-size:10px; }
.detail-workflow-context { padding:16px 18px; background:#f3f8f5; border-color:#d5e7dd; }
.detail-workflow-context > div:first-child > span { font-size:10px; }
.detail-workflow-context strong { font-size:15px; }
.detail-workflow-context p { color:#605a65; font-size:12px; line-height:1.6; }
.detail-policy { gap:10px; padding:13px 16px; color:#51495a; background:#f2eef8; border:1px solid #ddd4ec; font-size:11px; }
.detail-policy strong { color:#37313c; }
.detail-policy span { color:#5d47b7; background:#e9e3f6; }
.detail-policy b { color:#2a7058; }

.detail-case-hero { padding:30px 34px 28px; background:linear-gradient(160deg,#fffdfa 0%,#f6f2ed 100%); border-color:#ded7ce; }
.detail-case-head { display:flex; align-items:flex-start; justify-content:space-between; gap:28px; margin-bottom:24px; }
.detail-case-head h2 { max-width:760px; margin:7px 0 8px; color:#211b23; font-family:"Noto Serif SC","Songti SC",serif; font-size:29px; font-weight:600; line-height:1.35; letter-spacing:-.025em; }
.detail-case-head p { max-width:760px; margin:0; color:#5e5662; font-size:14px; line-height:1.8; }
.detail-case-badge { flex:0 0 auto; padding:8px 11px; color:#4e4650; background:#f0ebe4; border:1px solid #ded5cb; border-radius:999px; font-size:11px; font-weight:700; }
.detail-case-compare { display:grid; grid-template-columns:minmax(260px,1fr) 132px minmax(260px,1fr); align-items:center; gap:22px; max-width:1040px; margin:0 auto; }
.detail-case-page { min-width:0; margin:0; }
.detail-case-page-frame { height:610px; overflow:hidden; padding:12px; background:#e9e4dd; border:1px solid #d6cec4; border-radius:18px; box-shadow:0 18px 38px rgba(37,28,19,.11); }
.detail-case-page.is-result .detail-case-page-frame { background:#171e30; border-color:#273450; box-shadow:0 20px 42px rgba(18,24,42,.2); }
.detail-case-page-frame img { width:100%; height:100%; object-fit:contain; object-position:center top; background:#f2eee8; border-radius:10px; }
.detail-case-page.is-result .detail-case-page-frame img { background:#101827; }
.detail-case-page figcaption { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:10px; margin-top:13px; }
.detail-case-page figcaption > span { display:grid; width:34px; height:34px; place-items:center; color:#5d47b7; background:#ece7f8; border-radius:10px; font-size:10px; font-weight:850; }
.detail-case-page figcaption strong,.detail-case-page figcaption small { display:block; }
.detail-case-page figcaption strong { color:#28212a; font-size:14px; }
.detail-case-page figcaption small { margin-top:3px; color:#655d68; font-size:11px; line-height:1.45; }
.detail-case-page figcaption b { padding:6px 9px; color:#286a53; background:#eaf6f0; border-radius:999px; font-size:10px; white-space:nowrap; }
.detail-case-flow { display:grid; justify-items:center; gap:9px; color:#554d5a; text-align:center; }
.detail-case-flow > span { display:grid; width:54px; height:54px; place-items:center; color:#fff; background:linear-gradient(145deg,#765ed0,#4d389e); border-radius:17px; box-shadow:0 10px 24px rgba(77,56,158,.25); font-size:17px; font-weight:850; }
.detail-case-flow strong { font-size:13px; }
.detail-case-flow small { color:#6a626e; font-size:11px; line-height:1.75; }
.detail-case-flow i { color:#5d47b7; font-size:30px; font-style:normal; }
.detail-case-principles { display:flex; justify-content:center; gap:9px; flex-wrap:wrap; margin-top:23px; }
.detail-case-principles span { padding:7px 10px; color:#4f4852; background:rgba(255,253,250,.9); border:1px solid #ddd6cd; border-radius:999px; font-size:11px; }

.detail-workspace { display:grid; grid-template-columns:minmax(330px,.86fr) minmax(0,1.14fr); gap:18px; margin-top:18px; }
.detail-workspace > .panel { padding:22px; }
.detail-import-panel { grid-column:1 / -1; }
.detail-import-layout { display:grid; grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr); gap:18px; align-items:stretch; }
.detail-import-actions { display:flex; min-width:0; flex-direction:column; justify-content:center; }
.detail-import-actions > label { margin-bottom:7px; color:#39323d; font-size:12px; font-weight:750; }
.detail-dropzone { min-height:148px; padding:18px; color:#625a68; background:#f7f3ee; border:1px dashed #b8a99a; border-radius:14px; }
.detail-dropzone span { width:42px; height:42px; color:#5d47b7; border-color:#d9d0e8; }
.detail-dropzone strong { margin-top:10px; color:#302a34; font-size:14px; }
.detail-dropzone small { max-width:310px; margin-top:6px; color:#665e6a; font-size:11px; }
.detail-source-row { min-height:44px; margin-top:0; }
.detail-source-row input { min-height:44px; padding:0 13px; background:#fff; border-color:#d8d0c7; font-size:12px; }
.detail-source-row .primary-button { min-width:104px; }
.detail-upload-inline { gap:8px; margin:10px 0; }
.detail-upload-inline strong { color:#4c4551; font-size:11px; }
.detail-upload-inline span { color:#6d6571; font-size:11px; }
.detail-assist-row { align-items:center; }
.detail-assist-state { color:#6d6571; font-size:11px; }
.rights-check { margin-top:10px; padding:11px 12px; background:#edf7f2; border:1px solid #d3e9dd; }
.rights-check strong { color:#2e493f; font-size:11px; }
.rights-check small { color:#526d63; font-size:10px; line-height:1.55; }

.detail-module-panel { grid-column:1; }
.detail-module-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.detail-module { min-height:58px; padding:11px; color:#4e4752; background:#faf8f5; border-color:#e3ddd5; border-radius:11px; }
.detail-module > span { width:30px; height:30px; color:#5d47b7; font-size:9px; }
.detail-module strong { color:#312a35; font-size:12px; }
.detail-module small { margin-top:3px; color:#6b6470; font-size:10px; }
.detail-detected { padding:13px; border:1px solid #efd8d8; }
.detail-detected strong { font-size:11px; }
.detail-detected small { color:#7e5656; font-size:10px; line-height:1.5; }

.detail-settings-panel { grid-column:2; }
.product-preparation-choice { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:0 0 15px; padding:14px; background:#f5f1fa; border-color:#ded4ed; box-shadow:none; }
.product-preparation-choice > strong { grid-column:1 / -1; font-size:13px; }
.product-preparation-choice label { min-height:72px; padding:12px; font-size:12px; }
.product-preparation-choice small { color:#625b67; font-size:10px; }
.detail-settings-main { display:grid; grid-template-columns:minmax(0,1fr) minmax(210px,.74fr); gap:14px; align-items:start; }
.detail-settings-panel .field label { color:#3d3641; font-size:12px; }
.detail-settings-panel select { min-height:42px; border-color:#d9d1c8; background:#fff; font-size:12px; }
.detail-asset-mini { margin:9px 0 0; padding:10px; background:#f7f4f0; border:1px solid #e5ded5; }
.detail-asset-mini strong { font-size:11px; }
.detail-asset-mini small { color:#665f6a; font-size:10px; }
.detail-asset-mini > span { font-size:10px; }
.detail-advanced-settings { margin-top:14px; border:1px solid #e2dcd4; border-radius:13px; background:#faf8f5; }
.detail-advanced-settings summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 14px; cursor:pointer; list-style:none; }
.detail-advanced-settings summary::-webkit-details-marker { display:none; }
.detail-advanced-settings summary strong,.detail-advanced-settings summary small { display:block; }
.detail-advanced-settings summary strong { color:#39323d; font-size:12px; }
.detail-advanced-settings summary small { margin-top:3px; color:#6d6571; font-size:10px; }
.detail-advanced-settings summary b { color:#5d47b7; font-size:10px; white-space:nowrap; }
.detail-advanced-body { display:grid; grid-template-columns:1.15fr .85fr; gap:16px; padding:0 14px 14px; border-top:1px solid #e7e1da; }
.detail-advanced-body > div { padding-top:13px; }
.creative-locks button { min-height:36px; padding:8px 9px; color:#4f4065; font-size:10px; }
.brand-clean-grid span { padding:6px 8px; color:#7d4444; background:#fbeeee; font-size:9px; }
.detail-run { min-height:46px; margin-top:14px; font-size:13px; }

@media (max-width: 1100px) {
  .detail-case-compare { grid-template-columns:minmax(230px,1fr) 105px minmax(230px,1fr); gap:14px; }
  .detail-case-page-frame { height:540px; }
  .detail-settings-main { grid-template-columns:1fr; }
}
@media (max-width: 900px) {
  .detail-case-head { flex-direction:column; }
  .detail-case-compare { grid-template-columns:1fr; max-width:460px; }
  .detail-case-flow { grid-template-columns:auto 1fr auto; justify-items:start; text-align:left; }
  .detail-case-flow small { display:none; }
  .detail-case-flow i { transform:rotate(90deg); }
  .detail-import-layout,.detail-workspace { grid-template-columns:1fr; }
  .detail-module-panel,.detail-settings-panel { grid-column:1; }
}
@media (max-width: 640px) {
  #page-detail .page-heading > div > p { font-size:13px; }
  .detail-workflow-switch { display:flex; overflow-x:auto; padding:1px 1px 9px; scroll-snap-type:x mandatory; scrollbar-width:none; }
  .detail-workflow-switch::-webkit-scrollbar { display:none; }
  .detail-workflow-switch button { min-width:268px; scroll-snap-align:start; }
  .detail-case-hero { padding:22px 18px; }
  .detail-case-head h2 { font-size:24px; }
  .detail-case-page-frame { height:520px; padding:8px; }
  .detail-case-page figcaption { grid-template-columns:34px minmax(0,1fr); }
  .detail-case-page figcaption b { grid-column:2; width:fit-content; }
  .detail-module-list,.product-preparation-choice,.detail-advanced-body { grid-template-columns:1fr; }
  .product-preparation-choice > strong { grid-column:1; }
  .detail-workspace > .panel { padding:18px; }
  .detail-import-panel .panel-header { align-items:flex-start; flex-direction:column; gap:8px; }
  .detail-upload-inline { align-items:stretch; }
  .detail-upload-inline strong,.detail-upload-inline span { width:100%; }
}

/* Unified creation workbench: controls stay left and real output stays right. */
.workbench-mobile-tabs { display:none; }
.studio-layout { display:grid; grid-template-columns:minmax(380px,420px) minmax(0,1fr); gap:18px; align-items:start; min-height:calc(100vh - 150px); }
.workbench-control-column { min-width:0; }
.tool-panel { margin-bottom:12px; padding:10px; }
.studio-module-tabs { display:flex; gap:6px; overflow-x:auto; padding:1px 1px 9px; scrollbar-width:thin; }
.studio-module-tabs button { flex:0 0 auto; min-height:36px; padding:0 10px; color:#625a68; background:#faf8fc; border:1px solid #e6e0ea; border-radius:10px; font-size:10px; font-weight:700; }
.studio-module-tabs button.is-active { color:#fff; background:var(--purple); border-color:var(--purple); }
.workbench-tool-picker { border:1px solid #e7e1eb; border-radius:13px; background:#fff; }
.workbench-tool-picker > summary { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; list-style:none; }
.workbench-tool-picker > summary::-webkit-details-marker { display:none; }
.workbench-tool-picker > summary > span { display:grid; width:34px; height:34px; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:10px; font-weight:800; }
.workbench-tool-picker > summary small,.workbench-tool-picker > summary strong { display:block; }
.workbench-tool-picker > summary small { color:var(--ink-3); font-size:9px; }
.workbench-tool-picker > summary strong { margin-top:2px; font-size:13px; }
.workbench-tool-picker > summary b { color:var(--purple-dark); font-size:10px; }
.workbench-tool-picker[open] > summary { border-bottom:1px solid #ebe5ee; }
.workbench-tool-picker .tool-search { margin:10px; }
.workbench-tool-picker .tool-list { max-height:330px; overflow:auto; padding:0 8px 10px; }
.tool-item:disabled { cursor:not-allowed; opacity:.58; }
.config-panel { overflow:visible; }
.config-title { border-radius:18px 18px 0 0; }
.model-mode.is-unavailable { color:#9a5a24; background:#fff4e7; border-color:#efd7b9; }
.workbench-unavailable { display:grid; grid-template-columns:34px minmax(0,1fr); gap:11px; margin:16px 20px 0; padding:14px; color:#684525; background:#fff8ed; border:1px solid #ead2b3; border-radius:13px; }
.workbench-unavailable > span { display:grid; width:34px; height:34px; place-items:center; color:#fff; background:#bd7836; border-radius:10px; font-weight:900; }
.workbench-unavailable strong,.workbench-unavailable p { display:block; margin:0; }
.workbench-unavailable p { margin-top:4px; font-size:10px; line-height:1.6; }
.workbench-submit-bar { position:sticky; z-index:8; bottom:0; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:14px; padding:14px 18px; background:rgba(255,255,255,.97); border-top:1px solid #e9e3ed; border-radius:0 0 18px 18px; box-shadow:0 -12px 30px rgba(29,22,38,.07); backdrop-filter:blur(12px); }
.workbench-submit-bar .primary-button { min-width:150px; }
.commerce-target-fields { margin-top:2px; }
.output-spec-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(120px,.75fr) minmax(96px,.55fr); gap:10px; align-items:end; }
.output-spec-grid > div,.output-spec-grid > label { display:grid; gap:7px; min-width:0; color:var(--ink-2); font-size:10px; font-weight:750; }
.output-spec-grid select { width:100%; min-height:40px; padding:0 10px; color:var(--ink-1); background:#fff; border:1px solid var(--line); border-radius:10px; }
.output-spec-grid option[disabled] { color:var(--ink-3); }
.studio-layout > .preview-panel { grid-column:auto; }
.preview-panel { position:sticky; top:86px; display:flex; min-width:0; min-height:calc(100vh - 120px); max-height:calc(100vh - 104px); overflow:hidden; flex-direction:column; background:#f5f2f8; }
.workbench-output-head { padding:19px 20px 13px; background:#fff; border-bottom:1px solid #ebe5ef; }
.workbench-output-head span,.workbench-output-head strong,.workbench-output-head small { display:block; }
.workbench-output-head span { color:var(--purple); font-size:9px; font-weight:850; letter-spacing:.13em; }
.workbench-output-head strong { margin-top:4px; font-size:18px; }
.workbench-output-head small { margin-top:4px; color:var(--ink-3); font-size:10px; line-height:1.5; }
.workbench-output-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; padding:10px; background:#fff; border-bottom:1px solid #ebe5ef; }
.workbench-output-tabs button { position:relative; min-height:38px; color:#655d6b; background:#f6f3f8; border:1px solid transparent; border-radius:10px; font-size:11px; font-weight:750; }
.workbench-output-tabs button.is-active { color:#fff; background:var(--purple); }
.workbench-output-tabs button i,.workbench-mobile-tabs button i { position:absolute; top:7px; right:8px; width:6px; height:6px; background:#3acb8a; border-radius:50%; box-shadow:0 0 0 3px rgba(58,203,138,.15); }
.workbench-output-body { min-height:0; flex:1; overflow:auto; padding:16px; }
.workbench-result-placeholder { display:grid; min-height:420px; align-content:center; justify-items:center; padding:24px; color:var(--ink-2); text-align:center; background:#fff; border:1px dashed #d8cfdf; border-radius:16px; }
.workbench-result-placeholder > span { display:grid; width:48px; height:48px; place-items:center; color:#fff; background:var(--purple); border-radius:16px; font-size:20px; }
.workbench-result-placeholder > strong { margin-top:15px; font-size:16px; }
.workbench-result-placeholder > p { max-width:420px; margin:7px 0 0; color:var(--ink-3); font-size:11px; line-height:1.65; }
.workbench-source-preview { position:relative; overflow:hidden; background:#eae5ed; border-radius:15px; }
.workbench-source-preview img { display:block; width:100%; max-height:58vh; object-fit:contain; }
.workbench-source-preview span { position:absolute; left:10px; bottom:10px; padding:6px 9px; color:#fff; background:rgba(25,20,30,.7); border-radius:8px; font-size:9px; }
.workbench-source-preview.compact { width:min(100%,380px); margin-top:18px; }
.workbench-source-preview.compact img { max-height:250px; }
.workbench-result-media { overflow:hidden; min-height:300px; background:#ebe6ef; border-radius:15px; }
.workbench-result-media > img,.workbench-result-media > video { display:block; width:100%; max-height:62vh; object-fit:contain; }
.workbench-task-status { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 12px; margin-top:12px; padding:14px; background:#fff; border:1px solid #e8e1ec; border-radius:14px; }
.workbench-task-status > div:first-child strong,.workbench-task-status > div:first-child small { display:block; }
.workbench-task-status > div:first-child strong { margin-top:7px; font-size:12px; }
.workbench-task-status > div:first-child small { margin-top:3px; color:var(--ink-3); font-size:9px; }
.workbench-task-status > b { align-self:center; color:var(--purple-dark); font-size:11px; }
.workbench-task-status > p,.workbench-result-actions,.workbench-progress { grid-column:1 / -1; }
.workbench-task-status > p { margin:0; color:#8b4850; font-size:10px; line-height:1.55; }
.workbench-progress { overflow:hidden; height:6px; background:#e7e0ec; border-radius:999px; }
.workbench-progress i { display:block; height:100%; background:linear-gradient(90deg,var(--purple),#aa7ae4); border-radius:inherit; }
.workbench-result-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.workbench-history-list { display:grid; gap:9px; }
.workbench-history-list > button { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:12px; background:#fff; border:1px solid #e7e1ea; border-radius:13px; text-align:left; }
.workbench-history-list > button:disabled { opacity:.72; }
.workbench-history-list strong,.workbench-history-list small { display:block; }
.workbench-history-list strong { font-size:11px; }
.workbench-history-list small { margin-top:3px; color:var(--ink-3); font-size:9px; }
.workbench-history-list i { color:var(--purple-dark); font-size:9px; font-style:normal; }
.workbench-example-card { overflow:hidden; background:#fff; border:1px solid #e7e0eb; border-radius:16px; }
.workbench-example-media { position:relative; min-height:320px; overflow:hidden; background:#eae5ed; }
.workbench-example-media img { width:100%; height:100%; min-height:320px; max-height:58vh; object-fit:cover; }
.workbench-example-media > span { position:absolute; top:12px; left:12px; padding:7px 10px; color:#fff; background:rgba(25,20,30,.75); border-radius:9px; font-size:9px; font-weight:750; }
.workbench-example-card > div:last-child { padding:18px; }
.workbench-example-card small { color:var(--purple); font-size:9px; font-weight:800; }
.workbench-example-card h3 { margin:6px 0; font-size:18px; }
.workbench-example-card p { margin:0; color:var(--ink-3); font-size:11px; line-height:1.65; }
.workbench-example-card b { display:block; margin-top:12px; color:#26765b; font-size:10px; }
.workbench-result-and-example { display:grid; gap:16px; }
.workbench-customer-result,.workbench-default-example { display:grid; gap:9px; }
.workbench-content-label { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 2px; }
.workbench-content-label strong { font-size:13px; }
.workbench-content-label small { color:var(--ink-3); font-size:10px; }
.admin-safe-banner { display:grid; gap:5px; margin:0 0 16px; padding:14px 16px; color:#3f3850; background:#f5f1fa; border:1px solid #dfd5eb; border-radius:14px; }
.admin-safe-banner strong { font-size:12px; }
.admin-safe-banner p { margin:0; color:#6a6173; font-size:10px; line-height:1.65; }
.asset-cover-empty,.asset-detail-empty { display:grid; min-height:100%; place-content:center; justify-items:center; gap:8px; padding:18px; color:#756d7b; background:linear-gradient(145deg,#f6f2f8,#ece7f0); text-align:center; }
.asset-cover-empty > span,.asset-detail-empty > span { display:grid; width:38px; height:38px; place-items:center; color:#fff; background:var(--purple); border-radius:12px; font-size:20px; }
.asset-cover-empty > strong,.asset-detail-empty > strong { color:#554d5b; font-size:10px; }
.asset-detail-empty { width:190px; height:190px; border:1px dashed #d5cbdc; border-radius:14px; }

@media (max-width: 1180px) and (min-width: 761px) {
  .studio-layout { grid-template-columns:minmax(340px,390px) minmax(0,1fr); }
  .page-container { padding-inline:22px; }
}

@media (max-width: 760px) {
  .page-container { padding:10px 12px 30px; }
  .nav-utility-group { display:block; }
  .nav-utility-group[open] > .nav-item { display:flex; }
  .creation-access-banner { align-items:flex-start; flex-wrap:wrap; }
  .creation-access-banner .secondary-button { width:100%; margin-left:0; }
  .workbench-mobile-tabs { position:sticky; z-index:20; top:68px; display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:10px; padding:6px; background:rgba(247,246,244,.96); border:1px solid #e5dfe8; border-radius:13px; backdrop-filter:blur(12px); }
  .workbench-mobile-tabs button { position:relative; min-height:42px; color:#5f5764; background:#fff; border:1px solid #e5dfe8; border-radius:10px; font-weight:750; }
  .workbench-mobile-tabs button.is-active { color:#fff; background:var(--purple); border-color:var(--purple); }
  .studio-layout { display:block; min-height:0; }
  .studio-layout[data-mobile-pane="controls"] .preview-panel { display:none; }
  .studio-layout[data-mobile-pane="results"] .workbench-control-column { display:none; }
  .tool-panel { margin-bottom:10px; }
  .studio-module-tabs { padding-bottom:7px; }
  .workbench-tool-picker .tool-search { display:block; }
  .workbench-tool-picker .tool-list { display:grid; max-height:42vh; overflow:auto; gap:3px; padding-bottom:10px; }
  .workbench-tool-picker .tool-group-label { display:block; }
  .workbench-tool-picker .tool-item { width:100%; min-width:0; }
  .workbench-tool-picker .tool-item em { display:inline-flex; }
  .preview-panel { position:static; display:flex; min-height:calc(100vh - 190px); max-height:none; margin:0; }
  .workbench-output-body { overflow:visible; }
  .workbench-result-placeholder { min-height:360px; }
  .workbench-submit-bar { bottom:env(safe-area-inset-bottom,0); grid-template-columns:minmax(0,1fr) auto; padding:12px 14px calc(12px + env(safe-area-inset-bottom,0)); }
  .workbench-submit-bar .generation-cost-summary small { display:none; }
  .workbench-submit-bar .primary-button { min-width:132px; }
}

@media (max-width: 390px) {
  .studio-module-tabs button { min-height:34px; padding-inline:9px; }
  .config-title { align-items:flex-start; flex-direction:column; gap:8px; padding:17px; }
  .config-scroll { padding:0; }
  .input-section { padding:17px; }
  .workbench-output-head { padding:16px; }
  .workbench-output-body { padding:12px; }
  .workbench-result-placeholder { min-height:330px; padding:18px; }
  .workbench-submit-bar { grid-template-columns:1fr; }
  .workbench-submit-bar .primary-button { width:100%; }
  .output-spec-grid { grid-template-columns:1fr 1fr; }
  .output-spec-grid > div { grid-column:1 / -1; }
}

/* detail-v14 final layout overrides stay last so legacy responsive rules cannot reintroduce narrow rails. */
@media (min-width:901px) {
  .modeling-layout { grid-template-columns:minmax(400px,440px) minmax(0,1fr); align-items:start; }
  .modeling-preview-column { position:sticky; top:86px; align-self:start; }
}
@media (min-width:761px) {
  .studio-layout { grid-template-columns:minmax(400px,440px) minmax(0,1fr); min-height:calc(100vh - 170px); }
  .studio-layout .workbench-control-column { position:sticky; top:86px; align-self:start; }
  .studio-layout .config-panel { display:flex; height:calc(100vh - 184px); min-height:620px; max-height:calc(100vh - 104px); overflow:hidden; flex-direction:column; }
  .studio-layout .config-scroll { min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; }
  .studio-layout .workbench-submit-bar { position:static; flex:0 0 auto; }
}
@media (max-width:760px) {
  .page-container { padding:18px 14px 36px; }
  .studio-layout .workbench-control-column { position:static; }
  .studio-layout .config-panel { display:block; height:auto; min-height:0; max-height:none; overflow:visible; }
  .studio-layout .config-scroll { overflow:visible; }
}
@media (max-width:390px) {
  .page-container { padding:14px 12px 32px; }
}

/* detail-v18: one predictable creation pattern — menu, operation, cases/results. */
.creation-triad {
  display:grid;
  grid-template-columns:minmax(236px,272px) minmax(500px,1.08fr) minmax(380px,.92fr);
  gap:16px;
  align-items:start;
  min-width:0;
  min-height:calc(100vh - 170px);
}
.creation-menu-rail {
  position:sticky;
  top:86px;
  min-width:0;
  max-height:calc(100vh - 108px);
  overflow:auto;
  padding:14px;
  background:#fff;
  border:1px solid #e4dde8;
  border-radius:18px;
  box-shadow:0 12px 30px rgba(41,31,54,.06);
  scrollbar-gutter:stable;
}
.creation-rail-head { padding:5px 5px 13px; border-bottom:1px solid #eee8f1; }
.creation-rail-head span,.operation-pane-head > span { color:var(--purple); font-size:9px; font-weight:850; letter-spacing:.12em; }
.creation-rail-head h2,.operation-pane-head h2 { margin:5px 0 0; color:var(--ink-1); font-size:19px; line-height:1.25; }
.creation-rail-head p,.operation-pane-head p { margin:6px 0 0; color:var(--ink-3); font-size:10px; line-height:1.65; }
.creation-rail-tools,.shooting-choice-list { display:grid; gap:7px; margin-top:10px; }
.creation-rail-tool,.shooting-choice {
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  width:100%;
  min-width:0;
  min-height:60px;
  padding:9px 10px;
  color:#554d5a;
  background:#faf8fb;
  border:1px solid transparent;
  border-radius:13px;
  text-align:left;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.creation-rail-tool:hover,.shooting-choice:hover { background:#f4effa; border-color:#d8ccec; transform:translateY(-1px); }
.creation-rail-tool.is-active,.shooting-choice.is-active { color:#49368f; background:#f1ebfb; border-color:#bba7e6; box-shadow:inset 3px 0 0 var(--purple); }
.creation-rail-tool > span {
  display:grid;
  width:38px;
  height:38px;
  place-items:center;
  color:#654cb6;
  background:#eee7f8;
  border-radius:11px;
  font-size:10px;
  font-weight:900;
}
.creation-rail-tool strong,.creation-rail-tool small,.shooting-choice strong,.shooting-choice small { display:block; min-width:0; }
.creation-rail-tool strong,.shooting-choice strong { color:inherit; font-size:12px; }
.creation-rail-tool small,.shooting-choice small { margin-top:3px; overflow:hidden; color:#756d79; font-size:9px; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }
.creation-rail-tool b,.shooting-choice b { color:#6c55bd; font-size:9px; white-space:nowrap; }
.creation-rail-tool:disabled { transform:none; }
.shooting-choice { grid-template-columns:54px minmax(0,1fr) auto; min-height:72px; }
.shooting-choice > span { position:relative; overflow:hidden; width:54px; height:48px; background:#eee9f2; border-radius:10px; }
.shooting-choice img { width:100%; height:100%; object-fit:cover; }
.shooting-choice i { position:absolute; right:3px; bottom:3px; padding:2px 4px; color:#fff; background:rgba(28,22,34,.72); border-radius:4px; font-size:6px; font-style:normal; }
.creation-operation-pane {
  min-width:0;
  padding:20px;
  background:#fff;
  border:1px solid #e4dde8;
  border-radius:18px;
  box-shadow:0 12px 30px rgba(41,31,54,.06);
}
.operation-pane-head { padding-bottom:16px; border-bottom:1px solid #eee8f1; }
.operation-step-list { display:grid; gap:10px; margin:17px 0; }
.operation-step-list > div { display:grid; grid-template-columns:34px minmax(0,1fr); align-items:center; gap:11px; padding:12px; background:#f8f5fa; border:1px solid #ebe4ef; border-radius:13px; }
.operation-step-list b { display:grid; width:34px; height:34px; place-items:center; color:#fff; background:var(--purple); border-radius:10px; font-size:11px; }
.operation-step-list strong,.operation-step-list small { display:block; }
.operation-step-list strong { font-size:12px; }
.operation-step-list small { margin-top:3px; color:var(--ink-3); font-size:9px; line-height:1.5; }
.shooting-operation-pane .feature-guard-list { display:flex; gap:7px; flex-wrap:wrap; margin:14px 0 18px; }
.shooting-operation-pane .feature-guard-list span { padding:6px 8px; color:#286a53; background:#edf7f2; border-radius:999px; font-size:9px; }
.shooting-product-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:14px 0; }
.shooting-product-fields .field label,.shooting-request-field label { display:block; margin-bottom:6px; color:var(--ink-2); font-size:10px; font-weight:750; }
.shooting-product-fields input,.shooting-product-fields select,.shooting-request-field textarea { width:100%; min-height:38px; padding:9px 10px; color:var(--ink); background:#fbfafc; border:1px solid #e4dce8; border-radius:10px; font:inherit; font-size:11px; outline:none; }
.shooting-product-fields input:focus,.shooting-product-fields select:focus,.shooting-request-field textarea:focus { border-color:#9c83d0; box-shadow:0 0 0 3px rgba(127,91,184,.12); }
.shooting-upload-card { margin:12px 0; padding:13px; background:#fbfafc; border:1px dashed #cfc2df; border-radius:14px; transition:.2s ease; }
.shooting-upload-card.is-dragover { border-color:var(--purple); background:#f7f2ff; }
.shooting-upload-card.has-evidence { border-style:solid; border-color:#cfc2df; }
.shooting-upload-head,.shooting-lock-summary-head,.shooting-output-header { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.shooting-upload-head strong,.shooting-upload-head small { display:block; }
.shooting-upload-head strong { font-size:12px; }
.shooting-upload-head small { margin-top:3px; color:var(--ink-3); font-size:9px; }
.shooting-upload-head > span,.shooting-lock-summary-head > span { padding:5px 8px; color:#286a53; background:#edf7f2; border-radius:999px; font-size:9px; font-weight:750; white-space:nowrap; }
.shooting-upload-empty { display:grid; place-items:center; gap:3px; min-height:104px; margin:10px 0; color:var(--ink-3); text-align:center; background:#fff; border:1px solid #eee8f1; border-radius:11px; }
.shooting-upload-empty span { color:var(--purple); font-size:24px; line-height:1; }
.shooting-upload-empty strong { color:var(--ink-2); font-size:12px; }
.shooting-upload-empty small { font-size:9px; }
.shooting-upload-previews { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:10px 0; }
.shooting-upload-thumb { position:relative; overflow:hidden; min-width:0; background:#fff; border:1px solid #e8e1ed; border-radius:10px; }
.shooting-upload-thumb img { display:block; width:100%; aspect-ratio:1; object-fit:cover; }
.shooting-upload-thumb button { position:absolute; top:4px; right:4px; display:grid; width:21px; height:21px; place-items:center; color:#fff; background:rgba(24,19,31,.74); border:0; border-radius:50%; font-size:15px; line-height:1; cursor:pointer; }
.shooting-upload-thumb small { display:block; padding:5px 6px; color:var(--ink-3); font-size:8px; }
.shooting-upload-actions { display:flex; gap:7px; flex-wrap:wrap; }
.shooting-upload-actions .secondary-button { min-height:32px; padding:7px 10px; font-size:10px; }
.shooting-lock-summary { margin:12px 0; padding:12px; background:#f7f4fb; border:1px solid #e7dff0; border-radius:13px; }
.shooting-lock-summary-head strong { font-size:12px; }
.shooting-lock-summary p { margin:7px 0 9px; color:var(--ink-3); font-size:9px; line-height:1.55; }
.shooting-lock-chips { display:flex; gap:6px; flex-wrap:wrap; }
.shooting-lock-chips span { padding:5px 7px; color:#5d4d7d; background:#fff; border:1px solid #e5dcef; border-radius:999px; font-size:8px; font-weight:700; }
.shooting-request-field { margin:12px 0 0; }
.shooting-request-field .instruction-editor { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:stretch; gap:7px; }
.shooting-request-field textarea { min-height:64px; resize:vertical; }
.shooting-request-field .instruction-optimize-button { align-self:start; }
.shooting-output-header { padding:16px 18px 12px; border-bottom:1px solid #eee7f0; }
.shooting-output-header > span { color:var(--purple); font-size:9px; font-weight:850; letter-spacing:.11em; }
.shooting-output-header strong { margin-left:auto; font-size:12px; }
.shooting-output-header small { color:var(--ink-3); font-size:9px; }
.shooting-default-case .feature-output-hero { min-height:310px; height:42vh; }
.shooting-default-case .feature-output-copy { padding:16px 18px 20px; }
.operation-primary-action { width:100%; min-height:48px; }
.creation-case-pane { position:sticky; top:86px; min-width:0; min-height:calc(100vh - 108px); max-height:calc(100vh - 108px); overflow:auto; }

.studio-layout.studio-creation-triad {
  grid-template-columns:minmax(236px,272px) minmax(500px,1.08fr) minmax(380px,.92fr);
  gap:16px;
  min-height:calc(100vh - 170px);
}
.studio-creation-triad > .studio-tool-rail { grid-column:1; }
.studio-creation-triad > .workbench-control-column { grid-column:2; position:sticky; top:86px; align-self:start; }
.studio-creation-triad > .preview-panel { grid-column:3; }
.studio-creation-triad .config-panel { height:calc(100vh - 108px); min-height:620px; max-height:calc(100vh - 108px); }

.detail-three-pane {
  grid-template-columns:minmax(236px,272px) minmax(500px,1.08fr) minmax(380px,.92fr);
  gap:16px;
  margin-top:16px;
}
.detail-three-pane > .detail-workflow-switch {
  position:sticky;
  top:86px;
  grid-column:1;
  grid-row:1 / span 3;
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
  max-height:calc(100vh - 108px);
  overflow:auto;
  padding:14px;
  background:#fff;
  border:1px solid #e4dde8;
  border-radius:18px;
  box-shadow:0 12px 30px rgba(41,31,54,.06);
}
.detail-three-pane > .detail-workflow-switch::before { content:'复刻方式'; padding:4px 4px 9px; color:#332b39; border-bottom:1px solid #eee8f1; font-size:16px; font-weight:850; }
.detail-three-pane > .detail-workflow-switch button { width:100%; min-width:0; min-height:76px; padding:12px; }
.detail-three-pane > .detail-workflow-context { grid-column:2; grid-row:1; margin:0; }
.detail-three-pane > .detail-policy { grid-column:2; grid-row:2; margin:0; }
.detail-three-pane > .detail-workspace { grid-column:2; grid-row:3; grid-template-columns:1fr; gap:14px; margin:0; }
.detail-three-pane > .detail-workspace > .panel,.detail-three-pane .detail-import-panel,.detail-three-pane .detail-module-panel,.detail-three-pane .detail-settings-panel { grid-column:1; }
.detail-three-pane > .detail-case-hero { position:sticky; top:86px; grid-column:3; grid-row:1 / span 3; min-width:0; min-height:calc(100vh - 108px); max-height:calc(100vh - 108px); overflow:auto; margin:0; }
.detail-three-pane .detail-import-layout,.detail-three-pane .detail-settings-main { grid-template-columns:1fr; }

.admin-control-layout { display:grid; grid-template-columns:minmax(250px,286px) minmax(0,1fr); gap:18px; align-items:start; margin-top:18px; }
.admin-control-layout > .admin-section-nav {
  position:sticky;
  top:86px;
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
  margin:0;
  padding:14px;
  background:#211b2b;
  border:1px solid #3a3048;
  border-radius:18px;
  box-shadow:0 16px 34px rgba(31,23,42,.14);
}
.admin-nav-head { padding:5px 5px 12px; border-bottom:1px solid rgba(255,255,255,.1); }
.admin-nav-head span,.admin-nav-head strong,.admin-nav-head small { display:block; }
.admin-nav-head span { color:#bba7ff; font-size:9px; font-weight:850; letter-spacing:.14em; }
.admin-nav-head strong { margin-top:5px; color:#fff; font-size:18px; }
.admin-nav-head small { margin-top:5px; color:#afa7ba; font-size:9px; line-height:1.55; }
.admin-control-layout > .admin-section-nav button {
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:62px;
  padding:9px 10px;
  color:#dcd6e4;
  background:transparent;
  border:1px solid transparent;
  border-radius:13px;
  text-align:left;
}
.admin-control-layout > .admin-section-nav button:hover { color:#fff; background:#30283c; }
.admin-control-layout > .admin-section-nav button.is-active { color:#fff; background:#4c3977; border-color:#765db0; box-shadow:inset 3px 0 0 #b49bff; }
.admin-control-layout > .admin-section-nav button > span { display:grid; width:38px; height:38px; place-items:center; color:#d3c5ff; background:rgba(255,255,255,.08); border-radius:11px; font-size:11px; font-weight:850; }
.admin-control-layout > .admin-section-nav button strong,.admin-control-layout > .admin-section-nav button small { display:block; }
.admin-control-layout > .admin-section-nav button strong { color:inherit; font-size:12px; }
.admin-control-layout > .admin-section-nav button small { margin-top:3px; color:#afa7ba; font-size:9px; line-height:1.4; }
.admin-control-layout > .admin-section-nav button b { color:#c7b6f8; font-size:10px; }
.admin-control-layout > .admin-page-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; margin:0; min-width:0; }
.admin-control-layout .admin-card,.admin-control-layout .admin-card-pricing,.admin-control-layout .admin-card-security { grid-column:1; min-width:0; }

@media (max-width:1500px) and (min-width:761px) {
  .creation-triad,.studio-layout.studio-creation-triad,.detail-three-pane { grid-template-columns:minmax(210px,238px) minmax(350px,400px) minmax(370px,1fr); gap:12px; }
  .creation-menu-rail,.detail-three-pane > .detail-workflow-switch { padding:11px; }
  .creation-operation-pane { padding:16px; }
  /* The right case pane can be narrower than the desktop comparison minimum.
     Stack the two examples at this breakpoint so captions never collapse into
     one-character columns or create a horizontal scrollbar. */
  #page-detail .detail-case-compare { grid-template-columns:minmax(0,1fr); max-width:320px; gap:14px; }
  #page-detail .detail-case-flow { grid-template-columns:auto minmax(0,1fr) auto; justify-items:start; text-align:left; }
  #page-detail .detail-case-flow > span { width:44px; height:44px; border-radius:13px; font-size:14px; }
  #page-detail .detail-case-flow small { display:none; }
  #page-detail .detail-case-flow i { transform:rotate(90deg); font-size:24px; }
  #page-detail .detail-case-page-frame { height:420px; }
  #page-detail .detail-case-page figcaption { grid-template-columns:30px minmax(0,1fr); gap:8px; }
  #page-detail .detail-case-page figcaption > span { width:30px; height:30px; }
  #page-detail .detail-case-page figcaption b { grid-column:2; width:fit-content; }
}

@media (max-width:1100px) and (min-width:761px) {
  .creation-triad,.studio-layout.studio-creation-triad,.detail-three-pane { grid-template-columns:minmax(194px,220px) minmax(330px,380px) minmax(340px,1fr); }
  .creation-rail-tool { grid-template-columns:34px minmax(0,1fr); }
  .creation-rail-tool b { display:none; }
}

@media (max-width:900px) {
  .admin-control-layout { grid-template-columns:1fr; }
  .admin-control-layout > .admin-section-nav { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-control-layout > .admin-section-nav .admin-nav-head { grid-column:1 / -1; }
}

@media (max-width:760px) {
  .creation-triad,.studio-layout.studio-creation-triad,.detail-three-pane { display:block; min-height:0; }
  .creation-menu-rail,.creation-case-pane,.detail-three-pane > .detail-workflow-switch,.detail-three-pane > .detail-case-hero { position:static; max-height:none; min-height:0; }
  .creation-menu-rail { margin-bottom:10px; }
  .shooting-operation-pane { margin-bottom:10px; }
  .studio-creation-triad[data-mobile-pane="controls"] > .preview-panel { display:none; }
  .studio-creation-triad[data-mobile-pane="results"] > .studio-tool-rail,.studio-creation-triad[data-mobile-pane="results"] > .workbench-control-column { display:none; }
  .studio-creation-triad > .workbench-control-column { position:static; }
  .studio-creation-triad .config-panel { height:auto; min-height:0; max-height:none; }
  .detail-three-pane[data-mobile-pane="results"] > :not(.detail-case-hero) { display:none; }
  .detail-three-pane[data-mobile-pane="controls"] > .detail-case-hero { display:none; }
  .detail-three-pane > .detail-workflow-switch { display:grid; grid-template-columns:1fr; overflow:visible; margin-bottom:10px; }
  .detail-three-pane > .detail-workflow-switch button { min-width:0; }
  .detail-three-pane > .detail-workflow-context,.detail-three-pane > .detail-policy,.detail-three-pane > .detail-workspace { margin-bottom:10px; }
  .shooting-product-fields { grid-template-columns:1fr 1fr; }
  .shooting-product-fields .field:first-child { grid-column:1 / -1; }
  .shooting-upload-previews { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* 中等宽度窗口（含高 DPI 浏览器的 760–900 CSS px 视口）也必须收口为
   单列工作台。否则三栏的最小宽度会把右侧案例推出视口，底部出现横向
   滚动条，裂变卡片和说明文字会被压成窄列。保留 760px 以下的原规则，
   这里专门覆盖 761–900px 的平板/窄窗口。 */
@media (max-width:900px) and (min-width:761px) {
  .feature-mobile-tabs { position:sticky; z-index:20; top:68px; display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:10px; padding:6px; background:rgba(247,246,244,.96); border:1px solid #e5dfe8; border-radius:13px; }
  .feature-mobile-tabs button { min-height:42px; color:#5f5764; background:#fff; border:1px solid #e5dfe8; border-radius:10px; font-weight:750; }
  .feature-mobile-tabs button.is-active { color:#fff; background:var(--purple); border-color:var(--purple); }
  .feature-workbench[data-mobile-pane="controls"] [data-feature-pane="results"] { display:none; }
  .feature-workbench[data-mobile-pane="results"] [data-feature-pane="controls"] { display:none; }
  .creation-triad,.studio-layout.studio-creation-triad,.detail-three-pane { display:block; min-height:0; }
  .creation-menu-rail,.creation-case-pane,.detail-three-pane > .detail-workflow-switch,.detail-three-pane > .detail-case-hero { position:static; max-height:none; min-height:0; }
  .creation-menu-rail,.shooting-operation-pane { margin-bottom:10px; }
  .studio-creation-triad[data-mobile-pane="controls"] > .preview-panel { display:none; }
  .studio-creation-triad[data-mobile-pane="results"] > .studio-tool-rail,
  .studio-creation-triad[data-mobile-pane="results"] > .workbench-control-column { display:none; }
  .studio-creation-triad > .workbench-control-column { position:static; }
  .studio-creation-triad .config-panel { height:auto; min-height:0; max-height:none; }
  .detail-three-pane[data-mobile-pane="results"] > :not(.detail-case-hero) { display:none; }
  .detail-three-pane[data-mobile-pane="controls"] > .detail-case-hero { display:none; }
  .detail-three-pane > .detail-workflow-switch { display:grid; grid-template-columns:1fr; overflow:visible; margin-bottom:10px; }
  .detail-three-pane > .detail-workflow-switch button { min-width:0; }
  .detail-three-pane > .detail-workflow-context,
  .detail-three-pane > .detail-policy,
  .detail-three-pane > .detail-workspace { margin-bottom:10px; }
}

@media (max-width:520px) {
  .admin-control-layout > .admin-section-nav { grid-template-columns:1fr; }
  .admin-control-layout > .admin-section-nav .admin-nav-head { grid-column:1; }
  .admin-control-layout > .admin-section-nav button { min-height:58px; }
}

/* 学尚造物品牌主张：在首页与核心创作页保持醒目、简洁和纯中文。 */
.v4-launch-copy h1 > span,
.v4-launch-copy h1 > strong { display:block; }
.v4-launch-copy h1 > span { color:#fff; font-weight:650; }
.v4-launch-copy h1 > strong {
  margin-top:6px;
  color:#d8ccff;
  font-size:1.1em;
  font-weight:800;
  letter-spacing:-.045em;
  text-shadow:0 8px 26px rgba(111,76,222,.28);
}
.v4-launch-start {
  margin-top:18px;
  color:#fff;
  font-size:17px;
  font-weight:800;
  letter-spacing:.01em;
}
.brand-promise {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  min-height:62px;
  margin:0 0 10px;
  padding:10px 22px;
  overflow:hidden;
  color:#fff;
  background:linear-gradient(112deg,#20172f 0%,#4c2d91 52%,#2d1d51 100%);
  border:1px solid rgba(255,255,255,.13);
  border-radius:16px;
  box-shadow:0 12px 30px rgba(53,32,91,.18);
}
.brand-promise > div { display:flex; align-items:center; gap:10px; font-size:18px; font-weight:750; }
.brand-promise > div span { white-space:nowrap; }
.brand-promise > div i { color:#cdbfff; font-size:18px; font-style:normal; }
.brand-promise > strong {
  color:#e3d9ff;
  font-family:"Noto Serif SC","Songti SC","STSong",serif;
  font-size:25px;
  font-weight:800;
  letter-spacing:-.02em;
  white-space:nowrap;
}
@media (max-width:760px) {
  .brand-promise { justify-content:flex-start; gap:12px; min-height:56px; padding:9px 14px; }
  .brand-promise > div { gap:7px; font-size:15px; }
  .brand-promise > strong { font-size:20px; }
}
@media (max-width:420px) {
  .v4-launch-copy h1 > strong { font-size:1.03em; }
  .brand-promise { align-items:flex-start; flex-direction:column; gap:2px; }
  .brand-promise > strong { font-size:21px; }
}

.admin-customer-head { align-items:center; }
.admin-customer-head p { margin:6px 0 0; color:var(--ink-3); font-size:10px; }
.admin-card-head-actions { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.admin-customer-capabilities { display:flex; gap:7px; flex-wrap:wrap; margin:14px 0; }
.admin-customer-capabilities span { padding:7px 9px; color:#59467c; background:#f1ebf8; border-radius:999px; font-size:9px; font-weight:750; }
.admin-customer-row { padding:14px; background:#fbfafc; border:1px solid #e9e3ed; border-radius:13px; }
.admin-customer-row + .admin-customer-row { margin-top:8px; }
.admin-customer-row > div:first-child small { display:block; margin-top:3px; }
.admin-customer-actions { display:flex; gap:6px; flex-wrap:wrap; }
.admin-customer-actions .text-button { min-height:34px; padding:6px 9px; background:#f1ecf7; border-radius:9px; }
.admin-customer-create-form { align-items:end; }

/* detail-v19: readable administrator control plane and two-row customer cards */
#page-admin { font-size:14px; }
#page-admin > .page-heading h1 { font-size:32px; }
#page-admin > .page-heading p { max-width:900px; font-size:14px; line-height:1.7; }
.admin-nav-head span { font-size:11px; }
.admin-nav-head strong { font-size:21px; line-height:1.3; }
.admin-nav-head small { font-size:12px; line-height:1.6; }
.admin-control-layout > .admin-section-nav button { min-height:66px; }
.admin-control-layout > .admin-section-nav button strong { font-size:15px; line-height:1.35; }
.admin-control-layout > .admin-section-nav button small { font-size:12px; line-height:1.45; }
.admin-control-layout > .admin-section-nav button > span { font-size:14px; }
#page-admin .admin-card-head h2 { font-size:24px; line-height:1.3; }
#page-admin .admin-card-head .eyebrow { font-size:11px; }
#page-admin .admin-card-head p,#page-admin .admin-safe-note,#page-admin .admin-policy-summary { font-size:13px; line-height:1.65; }
#page-admin .admin-status-row { min-height:52px; }
#page-admin .admin-status-row span,#page-admin .admin-status-row strong { font-size:14px; line-height:1.5; }
#page-admin .admin-provider-row > span small,#page-admin .admin-ledger-list .admin-status-row span small { font-size:12px; line-height:1.45; }
#page-admin .admin-row-actions .text-button,#page-admin .admin-customer-actions .text-button { min-height:40px; padding:8px 12px; font-size:13px; }
#page-admin .admin-badge { min-height:28px; padding:5px 10px; font-size:12px; }
#page-admin input,#page-admin select,#page-admin textarea,#page-admin output,#page-admin button { font-size:14px; }
.admin-customer-head p { font-size:13px; }
.admin-customer-capabilities span { padding:8px 11px; font-size:12px; }
.admin-customer-row { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(220px,.75fr); align-items:start; gap:12px 18px; padding:18px; }
.admin-customer-primary,.admin-customer-summary { min-width:0; }
.admin-customer-row .admin-customer-primary strong { font-size:16px; line-height:1.45; }
.admin-customer-row .admin-customer-primary small { font-size:13px; line-height:1.55; overflow-wrap:anywhere; }
.admin-customer-row .admin-customer-registration { color:#6e5b8e; font-weight:750; }
.admin-customer-summary { padding:3px 0; text-align:left; }
.admin-customer-summary strong,.admin-customer-summary small { display:block; font-size:13px; line-height:1.55; text-align:left; white-space:normal; }
.admin-customer-summary small { margin-top:4px; color:var(--ink-3); }
.admin-customer-actions { grid-column:1 / -1; justify-content:flex-start; padding-top:11px; border-top:1px solid #ebe4f0; }

@media (max-width:760px) {
  #page-admin > .page-heading h1 { font-size:26px; }
  .admin-customer-row { grid-template-columns:1fr; }
  .admin-customer-actions { grid-column:1; }
}

@media (max-width:400px) {
  #page-admin { font-size:14px; }
  .admin-control-layout > .admin-section-nav button strong { font-size:15px; }
  .admin-control-layout > .admin-section-nav button small { font-size:12px; }
  .admin-customer-row { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; padding:14px; }
  .admin-customer-row .admin-customer-primary strong { font-size:16px; }
  .admin-customer-row .admin-customer-primary small,.admin-customer-summary strong,.admin-customer-summary small { font-size:13px; }
  .admin-customer-actions .text-button { flex:1 1 calc(50% - 6px); }
}

/* detail-v20: keep the first viewport operational. Page identity stays visible,
   while explanatory copy moves into the controls that need it. */
#page-shooting > .page-heading,#page-studio > .page-heading,#page-detail > .page-heading,#page-modeling > .page-heading,#page-tasks > .page-heading {
  min-height:0;
  margin-bottom:8px;
  padding:9px 14px;
}
#page-studio > .page-heading .eyebrow,#page-detail > .page-heading .eyebrow,#page-modeling > .page-heading .eyebrow { display:none; }
#page-shooting > .page-heading h1,#page-studio > .page-heading h1,#page-detail > .page-heading h1,#page-modeling > .page-heading h1,#page-tasks > .page-heading h1 { margin-top:0; font-size:22px; line-height:1.15; }
#page-shooting > .page-heading p,#page-studio > .page-heading p,#page-detail > .page-heading p,#page-modeling > .page-heading p,#page-tasks > .page-heading p { display:none; }
#page-shooting > .page-heading .heading-actions,#page-studio > .page-heading .heading-actions,#page-detail > .page-heading .heading-actions,#page-modeling > .page-heading .heading-actions,#page-tasks > .page-heading .heading-actions { align-items:center; }
#page-shooting > .page-heading .heading-actions button,#page-studio > .page-heading .heading-actions button,#page-detail > .page-heading .heading-actions button,#page-modeling > .page-heading .heading-actions button,#page-tasks > .page-heading .heading-actions button { min-height:38px; padding-block:8px; }
#page-detail .detail-three-pane,#page-studio .studio-creation-triad,#page-shooting .shooting-workbench { margin-top:8px; }
#page-studio > .creation-access-banner { margin-bottom:8px; padding:7px 11px; border-radius:12px; }
#page-studio > .creation-access-banner.is-ready small { display:none; }
#page-studio .studio-creation-triad { margin-top:0; }
#page-studio .creation-rail-head > span { display:block; }
#page-studio .creation-rail-head > p { display:block; }
#page-studio .creation-rail-head > small { display:block; margin-top:8px; color:var(--purple); font-size:10px; font-weight:750; }
#page-studio .creation-rail-tool small,#page-studio .creation-rail-tool b { display:block; }
#page-studio .studio-context-bar small,#page-studio .config-title p,#page-studio .model-mode,#page-studio .section-label > span { display:block; }
#page-studio .creation-rail-tool { min-height:58px; padding:10px 11px; }
#page-studio .creation-rail-tool > span { width:40px; height:40px; font-size:13px; }
#page-studio .creation-rail-tool strong { font-size:14px; line-height:1.35; }
#page-studio .creation-rail-head { padding:4px 5px 11px; }
#page-studio .creation-rail-head h2 { margin:0; font-size:21px; }

.style-dock-head { align-items:center; }
.style-dock-head h3 { margin:0; font-size:20px; }
.style-dock-head p { margin:5px 0 0; color:var(--ink-3); font-size:11px; }
.style-dock-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.style-dock-card.is-pack-selected { box-shadow:inset 0 0 0 2px #39a979; }
.style-dock-card.is-pack-selected::after { content:'✓'; position:absolute; top:8px; right:8px; display:grid; width:24px; height:24px; place-items:center; color:#fff; background:#279b69; border-radius:50%; font-weight:900; }
.style-pack-choice { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:14px; padding:14px; background:#f7f3fb; border:1px solid #dfd4ee; border-radius:14px; }
.style-pack-choice small,.style-pack-choice strong,.style-pack-choice span { display:block; }
.style-pack-choice small { color:var(--purple); font-size:9px; font-weight:800; }
.style-pack-choice strong { margin-top:3px; font-size:17px; }
.style-pack-choice span { margin-top:3px; color:var(--ink-3); font-size:10px; }
.style-pack-choice-actions { display:flex; gap:8px; flex-wrap:wrap; }
.style-pack-details { margin-top:10px; padding:14px; background:#fff; border:1px solid #e3dcea; border-radius:14px; }
.style-pack-details-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.style-pack-shot-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.style-pack-shot { display:flex; align-items:center; gap:8px; min-width:0; min-height:58px; padding:9px; background:#faf8fc; border:1px solid #e7e0ec; border-radius:11px; cursor:pointer; }
.style-pack-shot:has(input:checked) { color:#4d358f; background:#f0eafa; border-color:#bba7e6; }
.style-pack-shot input { flex:0 0 auto; width:17px; height:17px; accent-color:var(--purple); }
.style-pack-shot span { min-width:0; }
.style-pack-shot b,.style-pack-shot strong { display:block; }
.style-pack-shot b { color:var(--purple); font-size:8px; }
.style-pack-shot strong { margin-top:2px; overflow:hidden; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.style-pack-reference { display:flex; align-items:center; gap:9px; margin-top:10px; color:var(--ink-3); font-size:9px; }
.style-pack-reference img { width:36px; height:36px; object-fit:cover; border-radius:8px; }
.style-pack-batch { position:sticky; z-index:5; bottom:0; display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:12px; padding:13px 14px; background:rgba(255,255,255,.96); border:1px solid #ded4e6; border-radius:14px; box-shadow:0 12px 30px rgba(40,31,52,.09); backdrop-filter:blur(12px); }
.style-pack-batch strong,.style-pack-batch small { display:block; }
.style-pack-batch small { margin-top:3px; color:var(--ink-3); font-size:9px; }

#page-modeling .stepper { margin:10px 0; }
#page-modeling .modeling-assurance { min-height:58px; padding:12px 16px; }
#page-modeling .modeling-assurance > span { display:none; }
#page-modeling .modeling-assurance p { margin:3px 0 0; font-size:10px; }
#page-modeling .capture-guide-simplified > h2 { margin-top:0; }
#page-modeling .capture-guide-simplified > p { margin:5px 0 12px; }
#page-modeling .fidelity-panel,#page-modeling .model-case-section { margin-top:18px; }

#page-detail .detail-workflow-switch button small,#page-detail .detail-workflow-context p,#page-detail .detail-policy strong,#page-detail .detail-policy span,#page-detail .detail-case-head .eyebrow,#page-detail .detail-case-head p,#page-detail .detail-import-panel .panel-header p,#page-detail .detail-module-panel .panel-header p,#page-detail .detail-settings-panel .panel-header p,#page-detail .detail-import-actions span,#page-detail .field-help { display:none; }
#page-detail .detail-workflow-switch button { min-height:58px; }
#page-detail .detail-workflow-context { padding:12px 14px; }
#page-detail .detail-policy { min-height:42px; padding:9px 12px; }
#page-detail .detail-case-head h2 { margin-top:0; font-size:22px; }
#page-detail .detail-workspace .panel { padding:16px; }
#page-detail .detail-workspace .panel-header { margin-bottom:10px; }
#page-detail .detail-asset-mini.is-empty { grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; min-width:0; }
#page-detail .detail-asset-mini.is-empty > div { min-width:0; }
#page-detail .detail-asset-mini.is-empty > strong { min-width:0; overflow-wrap:normal; word-break:normal; white-space:normal; }
#page-detail .detail-asset-mini.is-empty .text-button { justify-self:end; white-space:nowrap; }

@media (max-width:900px) {
  .style-dock-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .style-pack-shot-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:520px) {
  #page-shooting > .page-heading,#page-studio > .page-heading,#page-detail > .page-heading,#page-modeling > .page-heading,#page-tasks > .page-heading { align-items:flex-start; padding:9px 11px; }
  #page-shooting > .page-heading h1,#page-studio > .page-heading h1,#page-detail > .page-heading h1,#page-modeling > .page-heading h1,#page-tasks > .page-heading h1 { font-size:20px; }
  #page-shooting > .page-heading .heading-actions,#page-studio > .page-heading .heading-actions,#page-detail > .page-heading .heading-actions,#page-modeling > .page-heading .heading-actions,#page-tasks > .page-heading .heading-actions { gap:6px; }
  #page-shooting > .page-heading .heading-actions button,#page-studio > .page-heading .heading-actions button,#page-detail > .page-heading .heading-actions button,#page-modeling > .page-heading .heading-actions button,#page-tasks > .page-heading .heading-actions button { min-height:36px; padding:7px 10px; }
  #page-detail .detail-asset-mini.is-empty { grid-template-columns:1fr; }
  #page-detail .detail-asset-mini.is-empty .text-button { justify-self:start; }
  .style-pack-choice,.style-pack-batch { align-items:stretch; flex-direction:column; }
  .style-pack-choice-actions { display:grid; grid-template-columns:1fr; }
  .style-pack-choice-actions button,.style-pack-batch button { width:100%; }
  .style-pack-shot-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:520px) {
  .admin-customer-head { align-items:flex-start; flex-direction:column; gap:10px; }
  .admin-card-head-actions,.admin-card-head-actions .primary-button { width:100%; }
  .admin-customer-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .admin-customer-actions .text-button { width:100%; justify-content:center; }
}

/* v0.19.6: consolidate every AI creation tool into one readable decision flow. */
.v4-launch-copy { padding:36px; }
.v4-launch-copy h1 { max-width:100%; font-size:clamp(32px,2.45vw,42px); letter-spacing:-.035em; overflow-wrap:anywhere; }
.v4-launch-copy > p { font-size:15px; line-height:1.65; }
.discovery-source-picker { grid-template-columns:1fr; gap:9px; margin-top:18px; }
.discovery-source-picker label,.discovery-source-picker .primary-button,.discovery-source-picker .secondary-button { width:100%; }
.discovery-source-picker .secondary-button { color:#332b39; }
.discovery-source-picker .primary-button,.discovery-source-picker .secondary-button { min-height:46px; }
.discovery-source-picker .text-button { grid-column:auto; justify-self:start; min-height:36px; padding-inline:2px; color:#ddd3ee; }
.v4-launch-chips { margin:16px 0 0; }
.v4-launch-chips span { font-size:12px; }

#page-studio .studio-context-bar { grid-template-columns:42px minmax(120px,.7fr) minmax(190px,1fr); gap:12px; min-height:66px; padding:11px 13px; }
#page-studio .studio-context-bar > span { width:42px; height:42px; font-size:15px; }
#page-studio .studio-context-bar > div > strong { margin:0; font-size:15px; }
.studio-tool-current { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:9px; min-width:0; padding:6px 8px; background:#f8f5fb; border:1px solid #e3d9ee; border-radius:11px; }
.studio-tool-current > span { display:grid; width:34px; height:34px; place-items:center; color:var(--purple); background:var(--purple-soft); border-radius:9px; font-size:13px; font-weight:850; }
.studio-tool-current > div { min-width:0; }
.studio-tool-current small,.studio-tool-current strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.studio-tool-current small { color:var(--ink-3); font-size:9px; }
.studio-tool-current strong { margin-top:2px; color:var(--ink); font-size:13px; }
.studio-tool-current em { padding:4px 7px; color:#5f459c; background:#eee7fa; border-radius:999px; font-size:9px; font-style:normal; font-weight:800; white-space:nowrap; }

#page-studio .config-scroll { padding:18px 20px 20px; }
#page-studio .input-section { margin-bottom:18px; }
#page-studio .section-label { margin-bottom:12px; }
#page-studio .section-label strong { font-size:20px; }
.consolidated-requirements { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.consolidated-requirements .field { min-width:0; }
.consolidated-requirements .field > label,.primary-instruction-head label { display:block; margin-bottom:7px; color:var(--ink-2); font-size:13px; font-weight:800; }
.consolidated-requirements input,.consolidated-requirements select,.consolidated-requirements textarea { width:100%; min-width:0; color:var(--ink); background:#fff; border:1px solid #ddd5e2; border-radius:11px; font-size:14px; }
.consolidated-requirements select { min-height:44px; padding:0 38px 0 12px; }
.consolidated-requirements textarea { min-height:88px; padding:12px; line-height:1.55; resize:vertical; }
.tool-model-field { display:grid; align-content:end; margin:0; padding:0; background:none; border:0; border-radius:0; }
.tool-model-field.is-unavailable select { color:#8c6770; background:#fff7f8; }
.primary-instruction-field,.negative-instruction-field { grid-column:1 / -1; }
.primary-instruction-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.primary-instruction-head > span { color:#288264; font-size:12px; font-weight:800; white-space:nowrap; }
.primary-instruction-field .instruction-editor,.negative-instruction-field .instruction-editor { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:10px; }
.primary-instruction-field .instruction-optimize-button,.negative-instruction-field .instruction-optimize-button { min-height:44px; }
.instruction-suggestions { display:flex; gap:7px; flex-wrap:wrap; margin-top:9px; }
.instruction-suggestions button { min-height:32px; padding:6px 9px; color:#5c4b72; background:#f3eff8; border:1px solid #e1d8ec; border-radius:9px; font-size:12px; cursor:pointer; }
.instruction-suggestions button:hover { color:#fff; background:var(--purple); border-color:var(--purple); }
.tool-parameter-section > .form-grid { gap:10px; }
.tool-parameter-section > .form-grid .field label { font-size:13px; }

.workbench-submit-bar .generation-cost-summary { display:grid; grid-template-columns:auto auto; align-items:center; justify-content:start; gap:3px 10px; min-width:0; margin:0; padding:10px 12px; }
.workbench-submit-bar .generation-cost-summary span,.workbench-submit-bar .generation-cost-summary strong { white-space:nowrap; }
.workbench-submit-bar .generation-cost-summary span { color:var(--ink-2); font-size:13px; }
.workbench-submit-bar .generation-cost-summary strong { font-size:18px; }
.workbench-submit-bar .generation-cost-summary small { grid-column:1 / -1; font-size:12px; white-space:nowrap; }

@media (max-width:1240px) {
  #page-studio .studio-context-bar { grid-template-columns:40px minmax(96px,.7fr) minmax(150px,1fr); }
  #page-studio .studio-context-bar > div { display:block; }
}

@media (max-width:1100px) {
  #page-studio .studio-context-bar { grid-template-columns:40px minmax(0,1fr); }
  #page-studio .studio-context-bar > div { display:none; }
}

@media (max-width:560px) {
  .v4-launch-copy { padding:25px 20px; }
  .v4-launch-copy h1 { font-size:31px; }
  .v4-launch-chips span { font-size:11px; }
  #page-studio .config-scroll { padding:14px; }
  .consolidated-requirements { grid-template-columns:1fr; }
  .primary-instruction-field .instruction-editor,.negative-instruction-field .instruction-editor { grid-template-columns:1fr; }
  .primary-instruction-field .instruction-optimize-button,.negative-instruction-field .instruction-optimize-button { width:100%; }
  .studio-tool-current { grid-template-columns:32px minmax(0,1fr); }
  .studio-tool-current > span { width:32px; height:32px; }
  .studio-tool-current em { display:none; }
}
#page-detail .detail-source-import,#page-detail .detail-settings-panel { padding:18px; }
#page-detail .detail-source-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; }
#page-detail .detail-source-row input,#page-detail .detail-output-plan input,#page-detail .detail-output-plan select,#page-detail .detail-output-counts input { min-width:0; min-height:42px; padding:9px 11px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:11px; font:inherit; }
#page-detail .detail-process-import { width:100%; margin-top:10px; }
#page-detail .detail-source-import .detail-upload-inline { margin-top:10px; }
#page-detail .detail-source-import .rights-check { margin-top:10px; padding:10px 12px; }
#page-detail .extension-install-steps { display:grid; gap:10px; }
#page-detail .extension-install-steps article { display:grid; grid-template-columns:32px minmax(0,1fr); gap:12px; align-items:start; padding:13px 14px; background:linear-gradient(145deg,#fbf9ff,#fff); border:1px solid #e7def4; border-radius:14px; }
#page-detail .extension-install-steps article > b { display:grid; width:32px; height:32px; place-items:center; color:#fff; background:linear-gradient(145deg,#7655e8,#4f36af); border-radius:10px; font-size:15px; }
#page-detail .extension-install-steps strong,#page-detail .extension-install-steps span { display:block; }
#page-detail .extension-install-steps strong { color:var(--ink); font-size:13px; }
#page-detail .extension-install-steps span { margin-top:4px; color:var(--ink-3); font-size:11px; line-height:1.55; }
#page-detail .extension-download-button { display:inline-flex; width:max-content; margin-top:9px; min-height:36px; padding:0 13px; text-decoration:none; }
#page-detail .extension-download-button.is-download-started { opacity:.65; pointer-events:none; }
#page-detail .collector-assistant-download.is-download-started { opacity:.65; pointer-events:none; }
#page-detail .extension-download-hint { margin-top:12px; padding:10px 12px; background:#fff8ec; border:1px solid #f0d9ad; border-radius:11px; line-height:1.6; }
#page-detail .extension-safety-note { margin-top:12px; padding:11px 12px; background:#f5f8ff; border:1px solid #dce5fa; border-radius:11px; line-height:1.6; }
#page-detail .plugin-install-inline { display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin:9px 0 2px; padding:9px 11px; border:1px solid #e7e1ef; border-radius:11px; background:#fbfaff; min-width:0; }
#page-detail .plugin-install-inline > div { min-width:0; flex:1; }
#page-detail .plugin-install-inline strong,#page-detail .plugin-install-inline small { display:block; }
#page-detail .plugin-install-inline strong { color:var(--ink); font-size:11px; font-weight:800; }
#page-detail .plugin-install-inline small { margin-top:3px; color:var(--ink-3); font-size:10px; line-height:1.45; }
#page-detail .plugin-install-dot { color:#8060d7; font-size:10px; }
#page-detail .plugin-install-installed .plugin-install-dot,#page-detail .plugin-install-captured .plugin-install-dot { color:#16805c; }
#page-detail .plugin-install-waiting-assistant .plugin-install-dot,#page-detail .plugin-install-checking .plugin-install-dot,#page-detail .plugin-install-capturing .plugin-install-dot { color:#8060d7; animation:nifeng-plugin-pulse 1.6s ease-in-out infinite; }
#page-detail .plugin-install-timeout .plugin-install-dot,#page-detail .plugin-install-cancelled .plugin-install-dot,#page-detail .plugin-install-failed .plugin-install-dot { color:#b42318; }
#page-detail .plugin-install-inline .text-button { flex:0 0 auto; white-space:nowrap; }
@keyframes nifeng-plugin-pulse { 0%,100% { opacity:.45; } 50% { opacity:1; } }
#page-detail .product-import-summary { display:grid; gap:12px; margin-top:12px; padding:14px; background:linear-gradient(145deg,#f6fbf8,#fff); border:1px solid #cfe8da; border-radius:14px; min-width:0; }
#page-detail .product-import-summary.is-candidate { background:linear-gradient(145deg,#f8f5ff,#fff); border-color:#ded3f5; }
#page-detail .product-import-summary.has-failures { background:linear-gradient(145deg,#fff8f5,#fff); border-color:#f0cfc5; }
#page-detail .product-import-summary-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; min-width:0; }
#page-detail .product-import-summary-head > div { display:grid; gap:4px; min-width:0; }
#page-detail .product-import-summary-head .eyebrow { color:#4f8d70; font-size:10px; letter-spacing:.08em; }
#page-detail .product-import-summary.is-candidate .product-import-summary-head .eyebrow { color:#6b55b8; }
#page-detail .product-import-summary-head strong { color:var(--ink); font-size:14px; line-height:1.35; }
#page-detail .product-import-summary-head > b { flex:0 0 auto; padding:5px 9px; color:#26734f; background:#e4f4eb; border-radius:999px; font-size:11px; white-space:nowrap; }
#page-detail .product-import-summary.is-candidate .product-import-summary-head > b { color:#5d47b7; background:#eee8fc; }
#page-detail .product-import-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; min-width:0; }
#page-detail .product-import-summary-item { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:baseline; gap:2px 6px; padding:9px 10px; background:rgba(255,255,255,.82); border:1px solid rgba(204,225,213,.9); border-radius:10px; min-width:0; }
#page-detail .product-import-summary.is-candidate .product-import-summary-item { border-color:#e5ddf5; }
#page-detail .product-import-summary-item span { min-width:0; overflow:hidden; color:var(--ink-2); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
#page-detail .product-import-summary-item strong { color:var(--ink); font-size:18px; line-height:1; }
#page-detail .product-import-summary-item small { grid-column:1 / -1; color:var(--ink-3); font-size:9px; }
#page-detail .product-import-summary-item.is-video strong { color:#5d47b7; }
#page-detail .product-import-summary-item.is-failure strong { color:#b42318; }
#page-detail .product-import-summary-note { color:var(--ink-3); font-size:10px; line-height:1.5; }
.plugin-consent-card { padding:14px; border:1px solid #e4d8fb; border-radius:13px; background:linear-gradient(145deg,#faf7ff,#f6f9ff); }
.plugin-consent-card strong { display:block; color:var(--ink); font-size:13px; }
.plugin-consent-card p { margin:6px 0 0; color:var(--ink-2); font-size:12px; line-height:1.6; }
#page-detail .collector-install-flow,#modalLayer .collector-install-flow { display:grid; gap:8px; margin:14px 0 0; padding:0; list-style:none; }
#page-detail .collector-install-step,#modalLayer .collector-install-step { display:grid; grid-template-columns:30px minmax(0,1fr); gap:10px; align-items:start; padding:10px 11px; border:1px solid #ebe6f3; border-radius:11px; background:#fff; }
#page-detail .collector-install-step > b,#modalLayer .collector-install-step > b { display:grid; width:30px; height:30px; place-items:center; color:#6d5a91; background:#f2edf9; border-radius:9px; font-size:12px; }
#page-detail .collector-install-step > div,#modalLayer .collector-install-step > div { min-width:0; }
#page-detail .collector-install-step strong,#page-detail .collector-install-step span,#modalLayer .collector-install-step strong,#modalLayer .collector-install-step span { display:block; }
#page-detail .collector-install-step strong,#modalLayer .collector-install-step strong { color:var(--ink); font-size:12px; line-height:1.35; }
#page-detail .collector-install-step span,#modalLayer .collector-install-step span { margin-top:3px; color:var(--ink-3); font-size:11px; line-height:1.5; }
#page-detail .collector-install-step.is-active,#modalLayer .collector-install-step.is-active { border-color:#cfc0ef; background:#faf8ff; box-shadow:0 0 0 2px rgba(117,86,211,.06); }
#page-detail .collector-install-step.is-active > b,#modalLayer .collector-install-step.is-active > b { color:#fff; background:linear-gradient(145deg,#7655e8,#4f36af); }
#page-detail .collector-install-step.is-done > b,#modalLayer .collector-install-step.is-done > b { color:#fff; background:#238261; }
#page-detail .collector-install-actions,#modalLayer .collector-install-actions { display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin-top:14px; }
#page-detail .collector-install-actions .primary-button,#modalLayer .collector-install-actions .primary-button { min-height:42px; }
#page-detail .collector-install-actions .collector-assistant-download,#modalLayer .collector-install-actions .collector-assistant-download { min-height:36px; display:inline-flex; align-items:center; }
#page-detail .collector-install-hint,#modalLayer .collector-install-hint { margin:11px 0 0; padding:10px 11px; color:var(--ink-3); background:#fffaf0; border:1px solid #f0dfb8; border-radius:10px; font-size:11px; line-height:1.65; }
#page-detail .collector-install-hint kbd,#modalLayer .collector-install-hint kbd { padding:1px 5px; color:var(--ink-2); background:#fff; border:1px solid #dfd4bf; border-radius:5px; font:inherit; font-size:10px; }
#page-detail .collector-install-hint strong,#modalLayer .collector-install-hint strong { color:var(--ink-2); overflow-wrap:anywhere; }
.plugin-redownload-link { display:inline-flex; margin-top:10px; }
#page-detail .plugin-fallback-download,#modalLayer .plugin-fallback-download { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; padding:8px 10px; border:1px dashed #d9d0ec; border-radius:10px; background:#fcfbff; color:var(--ink-3); font-size:10px; line-height:1.4; }
#page-detail .plugin-fallback-download .text-button,#modalLayer .plugin-fallback-download .text-button { flex:0 0 auto; white-space:nowrap; }
#page-detail .detail-output-plan { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:12px 0; }
#page-detail .detail-output-plan label,#page-detail .detail-output-counts label { display:grid; gap:6px; color:var(--ink-2); font-size:12px; font-weight:750; }
#page-detail .detail-output-counts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
#page-detail .detail-output-counts label { grid-template-columns:minmax(0,1fr) 66px; align-items:center; padding:10px 11px; background:#faf8fc; border:1px solid #ebe5f0; border-radius:12px; }
#page-detail .detail-output-counts span { display:grid; gap:2px; color:var(--ink); font-size:13px; }
#page-detail .detail-output-counts small { display:none; }
#page-detail .detail-output-counts input { width:66px; text-align:center; }
#page-detail .detail-fission-plan { display:grid; grid-template-columns:minmax(0,1fr); gap:6px; align-items:center; margin:14px 0; padding:12px 14px; background:linear-gradient(135deg,#f5f1ff,#fbfaff); border:1px solid #e3d9fa; border-radius:14px; }
#page-detail .detail-fission-head { display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0; }
#page-detail .detail-fission-head strong { min-width:0; color:var(--ink); font-size:16px; line-height:1.2; white-space:nowrap; }
#page-detail .detail-fission-head select { flex:0 0 132px; width:132px; min-width:0; min-height:40px; padding:8px 10px; border:1px solid #d9cdf3; border-radius:10px; background:#fff; color:var(--ink); font:inherit; font-weight:750; }
#page-detail .detail-fission-plan > small { display:block; min-width:0; overflow:hidden; color:var(--ink-3); font-size:11px; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }
#page-detail .detail-competitor-panel { padding:18px; border-color:#e4d9f6; background:linear-gradient(145deg,#fff,#fbf9ff); }
#page-detail .detail-competitor-panel .panel-header { align-items:flex-start; }
#page-detail .detail-competitor-panel .panel-header p { max-width:560px; margin-top:4px; overflow:hidden; color:var(--ink-3); font-size:11px; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }
#page-detail .detail-competitor-panel .panel-header > span { flex:none; padding:5px 9px; color:#5d47b7; background:#eee8fc; border-radius:999px; font-size:11px; font-weight:800; }
#page-detail .detail-competitor-list { display:grid; gap:8px; margin-top:12px; }
#page-detail .detail-competitor-row { display:grid; grid-template-columns:28px minmax(0,1fr) 36px; gap:8px; align-items:center; }
#page-detail .detail-competitor-row > span { display:grid; width:28px; height:28px; place-items:center; color:#5d47b7; background:#f0ebfb; border-radius:9px; font-size:12px; font-weight:800; }
#page-detail .detail-competitor-row input { min-width:0; min-height:40px; padding:8px 11px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:10px; font:inherit; }
#page-detail .detail-competitor-row input:focus { border-color:#9d89dc; box-shadow:0 0 0 3px rgba(117,85,232,.12); outline:0; }
#page-detail .detail-competitor-row .icon-button { width:36px; height:36px; color:var(--ink-3); }
#page-detail .detail-competitor-row .icon-button:disabled { opacity:.35; cursor:not-allowed; }
#page-detail .detail-competitor-actions { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:10px; margin-top:11px; }
#page-detail .detail-competitor-actions small { min-width:0; overflow:hidden; color:var(--ink-3); font-size:10px; line-height:1.45; text-overflow:ellipsis; white-space:nowrap; }
.evidence-gap-list { display:grid; gap:9px; }
.evidence-gap-list article { display:grid; gap:4px; padding:12px; background:#fff8ec; border:1px solid #f0d9ad; border-radius:12px; }
.evidence-gap-list span { color:var(--ink-2); line-height:1.55; }
@media (max-width:720px) {
  #page-detail .detail-source-row { grid-template-columns:1fr 1fr; }
  #page-detail .detail-source-row input { grid-column:1 / -1; }
  #page-detail .detail-output-plan,#page-detail .detail-output-counts { grid-template-columns:1fr; }
  #page-detail .product-import-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #page-detail .product-import-summary-head { flex-direction:column; }
  #page-detail .detail-fission-plan { grid-template-columns:1fr; }
  #page-detail .detail-fission-head select { flex-basis:124px; width:124px; }
  #page-detail .detail-competitor-panel { padding:14px; }
  #page-detail .detail-competitor-actions { grid-template-columns:1fr; }
  #page-detail .collector-install-actions,#modalLayer .collector-install-actions { display:grid; grid-template-columns:1fr; }
  #page-detail .collector-install-actions > *,#modalLayer .collector-install-actions > * { width:100%; justify-content:center; }
}
@media (max-width:390px) {
  #page-detail .product-import-summary { padding:11px; }
  #page-detail .product-import-summary-head strong { font-size:12px; }
  #page-detail .product-import-summary-grid { gap:5px; }
  #page-detail .product-import-summary-item { padding:8px; }
  #page-detail .product-import-summary-item strong { font-size:16px; }
}

/* v0.19.4: operational screens lead with actions, not explanatory microcopy. */
#page-shooting .creation-rail-head > span,
#page-shooting .operation-pane-head > span,
#page-shooting .shooting-choice small,
#page-shooting .shooting-product-fields .field > small,
#page-shooting .shooting-lock-summary p,
#page-shooting .feature-guard-list,
#page-shooting .shooting-output-header > span,
#page-shooting .shooting-output-header small { display:none; }
#page-shooting .creation-menu-rail { padding:18px; }
#page-shooting .creation-rail-head { padding:5px 5px 15px; }
#page-shooting .creation-rail-head h2 { font-size:25px; line-height:1.25; }
#page-shooting .shooting-choice-list { gap:10px; margin-top:14px; }
#page-shooting .shooting-choice { grid-template-columns:76px minmax(0,1fr) auto; min-height:88px; gap:13px; padding:9px; border-radius:14px; }
#page-shooting .shooting-choice > span { width:76px; height:66px; }
#page-shooting .shooting-choice i { font-size:8px; }
#page-shooting .shooting-choice strong { font-size:17px; line-height:1.25; }
#page-shooting .shooting-choice > b { font-size:16px; }
#page-shooting .operation-pane-head h2 { margin:0; font-size:28px; line-height:1.3; }
#page-shooting .operation-pane-head p { display:none; }
#page-shooting .shooting-product-fields { gap:10px; }
#page-shooting .shooting-upload-card { margin-top:16px; padding:17px; }
#page-shooting .shooting-upload-head strong { font-size:18px; }
#page-shooting .shooting-upload-head small { display:none; }
#page-shooting .shooting-lock-summary { margin-top:12px; padding:13px 14px; }
#page-shooting .shooting-lock-summary-head strong { font-size:16px; }
#page-shooting .shooting-lock-chips span { padding:7px 9px; font-size:11px; }
#page-shooting .shooting-style-picker-head small,
#page-shooting .shooting-reference-head small,
#page-shooting .shooting-style-shots > p { display:none; }
#page-shooting .shooting-style-picker-head strong,
#page-shooting .shooting-reference-head strong { font-size:17px; }
#page-shooting .operation-primary-action { min-height:54px; margin-top:16px; font-size:16px; }

/* Upload first, requirements second, then compact optional evidence. */
#page-modeling .stepper { margin:6px 0; }
#page-modeling .stepper .step-line,#page-modeling .modeling-assurance p { display:none; }
#page-modeling .modeling-assurance { min-height:46px; padding:10px 14px; }
#page-modeling .modeling-assurance strong { font-size:16px; }
#page-modeling .capture-guide-simplified { display:flex; flex-direction:column; gap:14px; padding:22px; }
#page-modeling .capture-guide-simplified > h2 { order:1; margin:0; font-size:28px; }
#page-modeling .capture-guide-simplified > p { display:none; }
#page-modeling .modeling-quick-start { display:contents; }
#page-modeling .quick-upload-card { order:2; grid-template-columns:76px minmax(0,1fr) auto; min-height:128px; margin:0; }
#page-modeling .quick-upload-copy strong { font-size:18px; }
#page-modeling .quick-upload-copy small { display:none; }
#page-modeling .modeling-essential-fields { order:3; margin-top:0; padding-top:14px; border-top:1px solid var(--line); }
#page-modeling .modeling-essential-fields .field-help { display:none; }
#page-modeling .quick-lock-card { order:4; margin-top:0; padding:16px; }
#page-modeling .quick-lock-card > span,#page-modeling .quick-lock-card > p { display:none; }
#page-modeling .quick-lock-card strong { font-size:18px; }
#page-modeling .modeling-submit-button { min-height:52px; margin-top:12px; font-size:16px; }
#page-modeling .optional-capture-details { margin-top:0; order:5; }
#page-modeling .fidelity-panel .panel-header p,#page-modeling .fidelity-panel .fidelity-status,
#page-modeling .model-case-section .panel-header p,#page-modeling .model-case-card small,
#page-modeling .category-concept-grid { display:none; }
#page-modeling .fidelity-panel .panel-header h2,#page-modeling .model-case-section .panel-header h2 { font-size:22px; }
#page-modeling .fidelity-group-overview { gap:8px; padding-bottom:10px; }
#page-modeling .fidelity-group-overview span { padding:8px 11px; font-size:13px; }

/* AI creation menus stay legible and only show the decision-relevant label. */
#page-studio .creation-rail-tool { grid-template-columns:48px minmax(0,1fr) auto; min-height:72px; padding:12px; }
#page-studio .creation-rail-tool > span { width:48px; height:48px; font-size:16px; }
#page-studio .creation-rail-tool strong { overflow:visible; font-size:16px; line-height:1.3; white-space:normal; }
#page-studio .creation-rail-tool small { margin-top:4px; color:#756d79; font-size:10px; line-height:1.45; white-space:normal; }
#page-studio .creation-rail-tool b { color:#6c55bd; font-size:10px; white-space:nowrap; }
#page-studio .config-title h2 { font-size:27px; }
#page-studio .config-title p,#page-studio .section-label > span,#page-studio .input-section .field-help { display:none; }
#page-studio .section-label strong { font-size:18px; }

/* A single, high-contrast control replaces every tiny text-only AI optimization button. */
.instruction-optimize-button { display:inline-flex; min-height:40px; align-items:center; justify-content:center; gap:8px; padding:7px 11px; color:#fff; background:#5d47b7; border:1px solid #503aa5; border-radius:9px; box-shadow:0 6px 16px rgba(93,71,183,.18); font-size:13px; font-weight:800; white-space:nowrap; }
.instruction-optimize-button:hover { background:#503aa5; }
.instruction-optimize-button:disabled { cursor:wait; opacity:.72; }
.instruction-optimize-button em { padding-left:8px; border-left:1px solid rgba(255,255,255,.34); font-size:11px; font-style:normal; font-weight:700; }
.instruction-editor { gap:10px; }

/* Model interface pool: every provider becomes a compact, scan-friendly route card. */
.admin-model-modal-card { width:min(1040px,100%); width:min(1120px,calc(100vw - 32px)); }
.admin-model-provider-pool { margin-top:18px; padding:16px; background:#f8f7fa; border:1px solid #e5e0e9; border-radius:14px; }
.admin-provider-pool-title { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.admin-provider-pool-title label { display:block; color:var(--ink); font-size:20px; font-weight:800; }
.admin-provider-pool-title p { max-width:720px; margin:5px 0 0; color:var(--ink-2); font-size:13px; line-height:1.55; }
.admin-field-error { display:block; margin-top:6px; color:#b02f3f; font-size:11px; line-height:1.45; font-weight:700; }
.field.has-error > input,
.field.has-error > select,
.field.has-error > textarea { border-color:#d56a78; box-shadow:0 0 0 3px rgba(196,61,82,.08); }
.admin-route-status-line { margin-top:6px; color:var(--ink-3); font-size:11px; line-height:1.45; }
.admin-route-status-line strong { color:var(--ink); }
.admin-provider-pool-legend { display:flex; gap:12px; flex-wrap:wrap; margin:13px 0; color:var(--ink-3); font-size:12px; font-weight:650; }
.admin-provider-pool-legend span { display:inline-flex; align-items:center; gap:6px; }
.admin-provider-pool-legend i { width:8px; height:8px; background:#a69cac; border-radius:50%; }
.admin-provider-pool-legend i.is-healthy { background:#1b9a70; box-shadow:0 0 0 3px #e0f4ea; }
.admin-provider-pool-list { display:grid; gap:10px; }
.admin-provider-pool-row { display:grid; grid-template-columns:minmax(250px,1.16fr) minmax(310px,1.22fr) minmax(210px,.78fr); gap:14px; align-items:center; padding:14px; background:#fff; border:1px solid #e4dfe8; border-radius:12px; }
.admin-provider-pool-row.is-enabled { border-color:#b9e2cf; box-shadow:inset 3px 0 #259b72; }
.admin-pool-provider-cell { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:10px; align-items:center; min-width:0; }
.admin-provider-toggle { display:inline-flex; align-items:center; gap:7px; margin:0; cursor:pointer; white-space:nowrap; }
.admin-provider-toggle input { position:absolute; width:1px; height:1px; opacity:0; }
.admin-provider-toggle > span { width:34px; height:20px; padding:2px; background:#c9c1cc; border-radius:999px; transition:.16s ease; }
.admin-provider-toggle > span::after { display:block; width:16px; height:16px; background:#fff; border-radius:50%; box-shadow:0 1px 3px rgba(32,20,38,.24); content:''; transition:.16s ease; }
.admin-provider-toggle input:checked + span { background:#24956d; }
.admin-provider-toggle input:checked + span::after { transform:translateX(14px); }
.admin-provider-toggle b { color:var(--ink-2); font-size:12px; }
.admin-pool-provider-name { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:3px 7px; min-width:0; }
.admin-pool-provider-name strong { overflow:hidden; color:var(--ink); font-size:16px; text-overflow:ellipsis; white-space:nowrap; }
.admin-pool-provider-name small { grid-column:1/-1; overflow:hidden; color:var(--ink-3); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.admin-provider-health { padding:3px 7px; color:#776e7d; background:#efedf1; border-radius:999px; font-size:11px; font-weight:800; }
.admin-provider-health.is-healthy { color:#127151; background:#e5f6ed; }
.admin-provider-health.is-unhealthy { color:#a33c4a; background:#fff0f2; }
.admin-provider-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; }
.admin-provider-metrics > span { display:grid; min-width:0; gap:3px; padding:7px 8px; background:#faf9fb; border:1px solid #eee9f1; border-radius:8px; }
.admin-provider-metrics b,.admin-provider-metrics small { color:var(--ink-3); font-size:10px; font-weight:700; }
.admin-provider-metrics strong { overflow:hidden; color:var(--ink); font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.admin-provider-metrics input,.admin-provider-routing input { width:100%; min-width:0; height:30px; padding:4px 6px; color:var(--ink); background:#fff; border:1px solid #dcd6e2; border-radius:7px; font-size:13px; font-weight:750; }
.admin-provider-routing { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.admin-provider-routing label { display:grid; gap:4px; color:var(--ink-3); font-size:11px; font-weight:750; }
@media (max-width:980px) { .admin-provider-pool-row { grid-template-columns:1fr; gap:10px; } .admin-provider-routing { max-width:360px; } }
@media (max-width:760px) { #page-studio .studio-creation-triad .preview-panel { margin-top:10px; } .admin-model-provider-pool { padding:12px; } .admin-provider-pool-title { align-items:stretch; flex-direction:column; } .admin-provider-pool-title .primary-button { width:100%; } .admin-pool-provider-cell { grid-template-columns:auto minmax(0,1fr); } .admin-provider-config-button { grid-column:1/-1; width:100%; } .admin-provider-metrics { grid-template-columns:1fr 1fr; } }
@media (max-width:390px) { #page-shooting .shooting-choice { grid-template-columns:62px minmax(0,1fr); min-height:78px; } #page-shooting .shooting-choice > span { width:62px; height:56px; } #page-shooting .shooting-choice > b { display:none; } #page-shooting .shooting-choice strong { font-size:15px; } #page-modeling .quick-upload-card { grid-template-columns:62px minmax(0,1fr); } #page-modeling .quick-upload-actions { grid-column:1/-1; display:grid; grid-template-columns:1fr; } #page-studio .creation-rail-tool { min-height:66px; } #page-studio .creation-rail-tool strong { font-size:15px; } .instruction-editor { grid-template-columns:1fr; } .instruction-optimize-button { width:100%; } .admin-provider-pool-row { padding:11px; } .admin-provider-metrics { grid-template-columns:1fr 1fr; } .admin-provider-routing { max-width:none; } }
/* Multi-upstream model pool controls */
.admin-provider-pool-head,.admin-provider-pool-row{display:grid;grid-template-columns:minmax(260px,1fr) 68px 68px 68px 68px 92px;gap:8px;align-items:center}
.admin-provider-pool-head{margin-top:10px;color:var(--muted,#777);font-size:12px}
.admin-provider-pool-row{margin-top:6px}
.admin-provider-pool-row input[type=number]{width:100%;min-width:0}
.admin-model-modal-card{width:min(1040px,100%)}
.admin-provider-pool-title{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.admin-provider-pool-title small{display:block;margin-top:5px}
.admin-pool-provider-cell{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.admin-pool-provider-cell label{min-width:0}
.admin-pool-provider-cell .text-button{flex:0 0 auto;font-size:10px}
.admin-pool-metrics{display:block;margin-top:4px;color:var(--ink-3);font-size:10px;line-height:1.4}
@media (max-width: 900px) { .admin-provider-pool-head,.admin-provider-pool-row{grid-template-columns:minmax(210px,1fr) repeat(5,68px);overflow-x:auto;min-width:650px} #adminModelProviderPool{overflow-x:auto} .admin-provider-pool-title{position:sticky;left:0;min-width:min(650px,100%)} }

/* 接口池可读性收口：单卡分区、字段有标签，窄屏不再把内容压成横向滚动表。 */
#adminModelProviderPool { overflow:visible; }
#adminModelProviderPool .admin-provider-pool-row { grid-template-columns:minmax(280px,1fr) minmax(360px,1.35fr) minmax(260px,.9fr) !important; }
#adminModelProviderPool .admin-provider-metrics { display:grid !important; grid-template-columns:repeat(4,minmax(84px,1fr)) !important; }
#adminModelProviderPool .admin-provider-routing { display:grid !important; grid-template-columns:repeat(3,minmax(76px,1fr)) !important; }
#adminModelProviderPool .admin-provider-metrics b,#adminModelProviderPool .admin-provider-metrics strong,#adminModelProviderPool .admin-provider-routing label { white-space:nowrap; }
#adminModelProviderPool .admin-provider-pool-list { display:grid; gap:12px; }
#adminModelProviderPool .admin-provider-pool-row { display:grid; grid-template-columns:minmax(220px,1fr) minmax(260px,1.2fr) minmax(190px,.8fr); gap:12px; align-items:start; min-width:0; overflow:visible; }
#adminModelProviderPool .admin-provider-routing { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
#adminModelProviderPool .admin-provider-routing label { white-space:nowrap; }
@media (max-width:980px) { #adminModelProviderPool .admin-provider-pool-row { grid-template-columns:1fr !important; } #adminModelProviderPool .admin-provider-routing { max-width:none; } }
@media (max-width:560px) { #adminModelProviderPool .admin-provider-metrics { grid-template-columns:1fr 1fr; } #adminModelProviderPool .admin-provider-routing { grid-template-columns:1fr 1fr 1fr; } }

/* 详情复刻插件采集：把安装流程收成更直白的一步到位提示。 */
.extension-flow { display:grid; gap:12px; }
.extension-flow-hero { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px; background:linear-gradient(135deg,#f7f1ff,#f3f7ff); border:1px solid #e4d8fb; border-radius:16px; }
.extension-flow-hero strong { display:block; color:var(--ink); font-size:16px; font-weight:850; }
.extension-flow-hero span { display:block; margin-top:4px; color:var(--ink-2); font-size:12px; line-height:1.55; }
.extension-flow-hero .extension-download-button { flex:0 0 auto; min-width:168px; justify-content:center; }
.extension-flow-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.extension-flow-grid article { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; padding:14px; background:#fff; border:1px solid #ebe4f2; border-radius:14px; }
.extension-flow-grid article b { display:grid; place-items:center; width:30px; height:30px; color:#6e55ae; background:#efe8fb; border-radius:10px; font-size:13px; font-weight:850; }
.extension-flow-grid article strong { display:block; color:var(--ink); font-size:14px; font-weight:850; }
.extension-flow-grid article span { display:block; margin-top:4px; color:var(--ink-2); font-size:12px; line-height:1.5; }
.extension-next-step { padding:14px 16px; background:#f8fafc; border:1px solid #e4e9f1; border-radius:14px; }
.extension-next-step strong { display:block; color:var(--ink); font-size:13px; font-weight:850; }
.extension-next-step p { margin:5px 0 0; color:var(--ink-2); font-size:12px; line-height:1.55; }
.extension-download-hint,.extension-safety-note { margin-top:10px; }
@media (max-width:900px) {
  .extension-flow-hero { align-items:stretch; flex-direction:column; }
  .extension-flow-hero .extension-download-button { width:100%; }
  .extension-flow-grid { grid-template-columns:1fr; }
}

/* 模型接口池卡片：把状态、健康和数值块拆开，避免挤成一坨。 */
.admin-pool-provider-head { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:10px; align-items:center; }
.admin-pool-provider-badges { display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.admin-provider-small-badge { display:inline-flex; align-items:center; min-height:24px; padding:3px 8px; color:#6e5f7a; background:#f4f1f8; border-radius:999px; font-size:11px; font-weight:800; }
.admin-pool-provider-name span { display:block; color:var(--ink-3); font-size:11px; }
.admin-provider-metrics { grid-template-columns:repeat(5,minmax(0,1fr)); }
.admin-provider-metrics > label { display:grid; gap:4px; padding:8px 10px; background:#faf9fb; border:1px solid #eee9f1; border-radius:10px; }
.admin-provider-metrics > label span { color:var(--ink-3); font-size:10px; font-weight:800; }
.admin-provider-price-field small,.admin-provider-routing small { display:block; color:var(--ink-3); font-size:10px; line-height:1.4; }
.admin-provider-routing { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.admin-provider-routing > span { display:grid; gap:3px; padding:10px 11px; background:#f8f7fb; border:1px solid #ebe4f2; border-radius:10px; }
.admin-provider-routing b { color:var(--ink-3); font-size:10px; font-weight:800; }
.admin-provider-routing small { color:var(--ink); font-size:12px; font-weight:800; }
@media (max-width:980px) {
  .admin-pool-provider-head { grid-template-columns:auto minmax(0,1fr); }
  .admin-pool-provider-badges { grid-column:1 / -1; justify-content:flex-start; }
  .admin-provider-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-provider-routing { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px) {
  .admin-provider-metrics { grid-template-columns:1fr; }
  .admin-provider-routing { grid-template-columns:1fr; }
}

/* The model-pool modal is narrower than the page at phone widths.  Override
   the desktop minimums here so every value remains inside the card instead of
   forcing a hidden horizontal strip that makes labels unreadable. */
@media (max-width:560px) {
  #adminModelProviderPool { width:100%; min-width:0; overflow:hidden; }
  #adminModelProviderPool .admin-pool-provider-head { grid-template-columns:auto minmax(0,1fr); }
  #adminModelProviderPool .admin-pool-provider-name { display:block; }
  #adminModelProviderPool .admin-pool-provider-name strong,
  #adminModelProviderPool .admin-pool-provider-name span { white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere; }
  #adminModelProviderPool .admin-pool-provider-name strong { line-height:1.3; }
  #adminModelProviderPool .admin-pool-provider-badges { grid-column:1/-1; justify-content:flex-start; }
  #adminModelProviderPool .admin-provider-pool-row,
  #adminModelProviderPool .admin-pool-provider-cell,
  #adminModelProviderPool .admin-provider-metrics,
  #adminModelProviderPool .admin-provider-routing { width:100%; min-width:0; }
  #adminModelProviderPool .admin-provider-pool-row { grid-template-columns:1fr !important; }
  #adminModelProviderPool .admin-provider-metrics { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  #adminModelProviderPool .admin-provider-metrics > label { min-width:0; }
  #adminModelProviderPool .admin-provider-routing { grid-template-columns:1fr !important; }
}

/* 商品拍摄：8 种真实风格 + 固定六图组 */
.shooting-product-fields .field > small { display:block; margin-top:5px; color:var(--ink-3); font-size:8px; line-height:1.45; }
.shooting-style-picker,.shooting-reference-config { margin:14px 0; padding:13px; background:#fbfafc; border:1px solid #e5ddea; border-radius:15px; }
.shooting-style-picker-head,.shooting-reference-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.shooting-style-picker-head strong,.shooting-style-picker-head small,.shooting-reference-head strong,.shooting-reference-head small { display:block; }
.shooting-style-picker-head strong,.shooting-reference-head strong { font-size:12px; }
.shooting-style-picker-head small,.shooting-reference-head small { max-width:540px; margin-top:4px; color:var(--ink-3); font-size:9px; line-height:1.55; }
.shooting-style-picker-head > span,.shooting-reference-head > span { flex:0 0 auto; padding:5px 8px; color:#2b6b55; background:#edf7f2; border-radius:999px; font-size:8px; font-weight:800; }
.shooting-style-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-top:12px; }
.shooting-style-card { min-width:0; overflow:hidden; background:#fff; border:1px solid #e7e0eb; border-radius:13px; transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease; }
.shooting-style-card:hover { transform:translateY(-1px); border-color:#cdbde4; box-shadow:0 10px 24px rgba(49,35,68,.08); }
.shooting-style-card.is-active { border-color:#8f73ca; box-shadow:0 0 0 2px rgba(118,83,184,.13); }
.shooting-style-card.is-unavailable { opacity:.62; }
.shooting-style-select { display:block; width:100%; padding:0; color:inherit; background:transparent; border:0; text-align:left; cursor:pointer; }
.shooting-style-select:disabled { cursor:not-allowed; }
.shooting-style-select > .derived-style-media { display:block; width:100%; height:132px; border-radius:0; }
.shooting-style-select > .derived-style-media img { width:100%; height:100%; object-fit:cover; }
.shooting-style-select > span:last-child { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:3px 8px; padding:9px 10px 8px; }
.shooting-style-select > span:last-child small { grid-row:1 / span 2; color:#775cb1; font-size:9px; font-weight:850; }
.shooting-style-select > span:last-child strong { min-width:0; overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.shooting-style-select > span:last-child em { color:var(--ink-3); font-size:8px; font-style:normal; }
.shooting-style-card.is-active .shooting-style-select > span:last-child em { color:#6248a1; font-weight:800; }
.shooting-style-expand { display:flex; width:100%; align-items:center; justify-content:space-between; min-height:32px; padding:7px 10px; color:#6248a1; background:#f7f3fb; border:0; border-top:1px solid #eee7f2; font-size:9px; font-weight:750; cursor:pointer; }
.shooting-style-shots { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:9px; background:#faf8fc; border-top:1px solid #eee7f2; }
.shooting-style-shots[hidden] { display:none; }
.shooting-style-shots > span { display:grid; grid-template-columns:auto minmax(0,1fr); gap:1px 6px; align-items:center; min-width:0; padding:7px; background:#fff; border:1px solid #e9e2ed; border-radius:9px; }
.shooting-style-shots > span b { grid-row:1 / span 2; color:#765ab1; font-size:9px; }
.shooting-style-shots > span strong { min-width:0; overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.shooting-style-shots > span small { color:var(--ink-3); font-size:7px; }
.shooting-style-shots > p { grid-column:1 / -1; margin:2px 1px 0; color:#725f81; font-size:8px; line-height:1.5; }
.shooting-style-summary { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; padding:10px 11px; color:#4e3f5e; background:#f2edf8; border-radius:11px; }
.shooting-style-summary div { min-width:0; }
.shooting-style-summary small,.shooting-style-summary strong,.shooting-style-summary span { display:block; }
.shooting-style-summary small { color:#7a678a; font-size:8px; }
.shooting-style-summary strong { margin-top:2px; font-size:11px; }
.shooting-style-summary span { margin-top:4px; overflow:hidden; color:#74667e; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.shooting-style-summary > b { flex:0 0 auto; color:#6348a1; font-size:10px; }
.shooting-reference-upload { display:grid; min-height:132px; width:100%; place-items:center; gap:4px; margin:11px 0; padding:10px; color:#665373; background:#fff; border:1px dashed #bfaed4; border-radius:12px; cursor:pointer; }
.shooting-reference-upload b { color:#7555b6; font-size:22px; }
.shooting-reference-upload strong { font-size:11px; }
.shooting-reference-upload small { color:var(--ink-3); font-size:8px; }
.shooting-reference-upload.has-image { position:relative; overflow:hidden; display:block; padding:0; border-style:solid; }
.shooting-reference-upload.has-image img { display:block; width:100%; height:180px; object-fit:cover; }
.shooting-reference-upload.has-image span { position:absolute; right:8px; bottom:8px; padding:6px 9px; color:#fff; background:rgba(32,24,40,.78); border-radius:999px; font-size:8px; font-weight:800; }
.shooting-batch-result { padding:14px; }
.shooting-batch-result-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.shooting-batch-result-head span,.shooting-batch-result-head strong,.shooting-batch-result-head small { display:block; }
.shooting-batch-result-head span { color:#7357ad; font-size:8px; font-weight:850; letter-spacing:.08em; }
.shooting-batch-result-head strong { margin-top:3px; font-size:12px; }
.shooting-batch-result-head small { margin-top:3px; color:var(--ink-3); font-size:8px; }
.shooting-batch-result-head > b { display:grid; width:42px; height:42px; place-items:center; color:#5f459c; background:#f0ebf7; border-radius:50%; font-size:10px; }
.shooting-batch-result-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.shooting-batch-result-card { display:grid; grid-template-columns:72px minmax(0,1fr); gap:9px; align-items:center; min-width:0; padding:8px; background:#fff; border:1px solid #e8e1ec; border-radius:11px; }
.shooting-batch-result-card.is-failed { border-color:#e5b9b9; background:#fff8f8; }
.shooting-batch-result-media { overflow:hidden; width:72px; height:72px; background:#f1edf5; border-radius:8px; }
.shooting-batch-result-media img { width:100%; height:100%; object-fit:cover; }
.shooting-batch-result-media > span { display:grid; height:100%; place-items:center; align-content:center; color:#6c52a7; }
.shooting-batch-result-media b,.shooting-batch-result-media small { display:block; }
.shooting-batch-result-media b { font-size:15px; }
.shooting-batch-result-media small { margin-top:2px; font-size:7px; }
.shooting-batch-result-card > div:last-child { min-width:0; }
.shooting-batch-result-card strong,.shooting-batch-result-card small { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shooting-batch-result-card strong { font-size:10px; }
.shooting-batch-result-card small { margin-top:4px; color:var(--ink-3); font-size:8px; }
.shooting-batch-result-card .text-button { margin-top:5px; padding:0; font-size:8px; }
.shooting-batch-result-actions { margin-top:10px; text-align:right; }

@media (max-width:900px) {
  .shooting-style-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:600px) {
  .shooting-style-grid,.shooting-batch-result-grid { grid-template-columns:1fr; }
  .shooting-style-select > .derived-style-media { height:168px; }
  .shooting-style-picker-head,.shooting-reference-head,.shooting-style-summary { align-items:flex-start; flex-direction:column; }
  .shooting-style-summary > b { align-self:flex-start; }
}

/* Keep the compact creation action visible in the first desktop viewport. */
#page-studio .studio-creation-triad .config-panel {
  height:calc(100vh - 220px);
  min-height:520px;
  max-height:calc(100vh - 220px);
}
@media (max-width:1100px) {
  #page-studio .studio-creation-triad .config-panel { height:auto; min-height:0; max-height:none; }
}

/* Keep the model-pool card readable on phone-width modal surfaces.  The
   legacy pool rules use a flex provider cell; without an explicit one-column
   mobile layout its fixed-width action button becomes the row's min-content
   width and creates an invisible horizontal strip. */
@media (max-width:560px) {
  #adminModelProviderPool,
  #adminModelProviderPool .admin-provider-pool-list,
  #adminModelProviderPool .admin-provider-pool-row,
  #adminModelProviderPool .admin-pool-provider-cell,
  #adminModelProviderPool .admin-provider-metrics,
  #adminModelProviderPool .admin-provider-routing { box-sizing:border-box; width:100%; min-width:0; }
  #adminModelProviderPool .admin-pool-provider-cell { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; align-items:start; }
  #adminModelProviderPool .admin-pool-provider-head,
  #adminModelProviderPool .admin-provider-config-button { width:100%; min-width:0; grid-column:1 / -1; }
  #adminModelProviderPool .admin-provider-config-button { display:flex; justify-content:center; }
  #adminModelProviderPool .admin-pool-provider-name,
  #adminModelProviderPool .admin-pool-provider-name strong,
  #adminModelProviderPool .admin-pool-provider-name span { min-width:0; max-width:100%; overflow-wrap:anywhere; white-space:normal; }
  #adminModelProviderPool .admin-provider-metrics { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  #adminModelProviderPool .admin-provider-routing { grid-template-columns:1fr !important; }
  #adminModelProviderPool .admin-provider-metrics > label,
  #adminModelProviderPool .admin-provider-routing > span { min-width:0; }
}

/* 统一管理中心的模型接口池：按“身份 / 参数 / 路由”三段展示。
   这是最终覆盖规则，避免历史样式把名称、徽章和开关挤进同一窄列。 */
#adminModelProviderPool { box-sizing:border-box; width:100%; min-width:0; overflow:visible; }
#adminModelProviderPool .admin-provider-pool-list { display:grid; gap:14px; min-width:0; }
#adminModelProviderPool .admin-provider-pool-row {
  display:grid;
  grid-template-columns:minmax(300px,1.12fr) minmax(430px,1.52fr) minmax(250px,.88fr);
  gap:16px;
  align-items:stretch;
  min-width:0;
  padding:16px;
  overflow:visible;
  background:linear-gradient(180deg,#fff,#fcfbfd);
  border:1px solid #e5deea;
  border-radius:14px;
  box-shadow:0 4px 14px rgba(49,35,68,.045);
}
#adminModelProviderPool .admin-provider-pool-row.is-enabled { border-color:#b9e2cf; box-shadow:inset 3px 0 #259b72,0 4px 14px rgba(49,35,68,.045); }
#adminModelProviderPool .admin-pool-provider-cell { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; align-content:start; min-width:0; }
#adminModelProviderPool .admin-pool-provider-head { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px 12px; align-items:start; min-width:0; }
#adminModelProviderPool .admin-provider-toggle { grid-row:1; align-self:start; }
#adminModelProviderPool .admin-pool-provider-name { min-width:0; display:grid; gap:3px; }
#adminModelProviderPool .admin-pool-provider-name strong,
#adminModelProviderPool .admin-pool-provider-name span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#adminModelProviderPool .admin-pool-provider-badges { grid-column:2; display:flex; align-items:center; justify-content:flex-start; gap:6px; flex-wrap:wrap; min-width:0; }
#adminModelProviderPool .admin-provider-health,
#adminModelProviderPool .admin-provider-small-badge { white-space:nowrap; }
#adminModelProviderPool .admin-provider-config-button { width:100%; min-height:38px; justify-content:center; }
#adminModelProviderPool .admin-provider-metrics { display:grid !important; grid-template-columns:repeat(5,minmax(72px,1fr)) !important; gap:8px; align-content:start; min-width:0; }
#adminModelProviderPool .admin-provider-metrics > label { min-width:0; }
#adminModelProviderPool .admin-provider-routing { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:8px; align-content:start; min-width:0; }
#adminModelProviderPool .admin-provider-routing > span { min-width:0; }
#adminModelProviderPool .admin-provider-routing small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:1220px) {
  #adminModelProviderPool .admin-provider-pool-row { grid-template-columns:minmax(260px,1fr) minmax(360px,1.25fr); }
  #adminModelProviderPool .admin-provider-routing { grid-column:1/-1; grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width:820px) {
  #adminModelProviderPool .admin-provider-pool-row { grid-template-columns:1fr; gap:12px; }
  #adminModelProviderPool .admin-provider-routing { grid-column:auto; }
}
@media (max-width:560px) {
  .modal-open .toast-region { top:10px; right:12px; width:calc(100vw - 24px); }
  #adminModelProviderPool .admin-provider-pool-row { padding:12px; }
  #adminModelProviderPool .admin-provider-metrics { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  #adminModelProviderPool .admin-provider-routing { grid-template-columns:1fr !important; }
  #adminModelProviderPool .admin-pool-provider-name strong,
  #adminModelProviderPool .admin-pool-provider-name span { overflow-wrap:anywhere; white-space:normal; }
}

/* 最终收口：接口池按“供应商身份 → 参数 → 路由状态”纵向分区。
   旧版把三段塞在同一行，供应商名称和健康徽章会被压缩/遮挡；这里
   明确让每张卡占满一行，并为每个断点设置可读的最小列宽。 */
#adminModelProviderPool .admin-provider-pool-row {
  grid-template-columns:1fr !important;
  gap:14px;
  align-items:stretch;
  padding:16px 18px;
}
#adminModelProviderPool .admin-pool-provider-cell {
  display:grid;
  grid-template-columns:minmax(0,1fr) 156px;
  gap:14px;
  align-items:start;
  min-width:0;
}
#adminModelProviderPool .admin-pool-provider-head {
  display:grid;
  grid-template-columns:auto minmax(180px,1fr) minmax(220px,auto);
  gap:10px 14px;
  align-items:center;
  min-width:0;
}
#adminModelProviderPool .admin-provider-toggle { min-width:max-content; }
#adminModelProviderPool .admin-pool-provider-name {
  display:grid;
  gap:4px;
  min-width:0;
}
#adminModelProviderPool .admin-pool-provider-name strong,
#adminModelProviderPool .admin-pool-provider-name span {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#adminModelProviderPool .admin-pool-provider-badges {
  grid-column:3;
  grid-row:1;
  justify-content:flex-end;
  min-width:0;
}
#adminModelProviderPool .admin-provider-config-button {
  grid-column:2;
  grid-row:1;
  width:100%;
  min-height:42px;
  align-self:stretch;
  white-space:normal;
  line-height:1.25;
}
#adminModelProviderPool .admin-provider-metrics,
#adminModelProviderPool .admin-provider-routing {
  width:100%;
  min-width:0;
}
#adminModelProviderPool .admin-provider-metrics {
  grid-template-columns:repeat(5,minmax(96px,1fr)) !important;
  gap:10px;
}
#adminModelProviderPool .admin-provider-metrics > label {
  min-width:0;
  overflow:hidden;
  padding:10px 11px;
}
#adminModelProviderPool .admin-provider-metrics input {
  min-width:0;
  max-width:100%;
}
#adminModelProviderPool .admin-provider-price-field small,
#adminModelProviderPool .admin-provider-routing small {
  overflow-wrap:anywhere;
  white-space:normal;
}
#adminModelProviderPool .admin-provider-routing {
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px;
}
#adminModelProviderPool .admin-provider-routing > span {
  min-width:0;
  padding:11px 12px;
}
@media (max-width:1220px) {
  #adminModelProviderPool .admin-provider-pool-title .primary-button {
    min-width:170px;
    white-space:nowrap;
  }
  #adminModelProviderPool .admin-pool-provider-head {
    grid-template-columns:auto minmax(160px,1fr);
  }
  #adminModelProviderPool .admin-pool-provider-badges {
    grid-column:1/-1;
    grid-row:2;
    justify-content:flex-start;
  }
  #adminModelProviderPool .admin-provider-metrics {
    grid-template-columns:repeat(3,minmax(96px,1fr)) !important;
  }
}
@media (max-width:820px) {
  #adminModelProviderPool .admin-pool-provider-cell {
    grid-template-columns:1fr;
    gap:10px;
  }
  #adminModelProviderPool .admin-provider-config-button {
    grid-column:1;
    grid-row:auto;
  }
  #adminModelProviderPool .admin-provider-metrics {
    grid-template-columns:repeat(2,minmax(96px,1fr)) !important;
  }
  #adminModelProviderPool .admin-provider-routing {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:480px) {
  #adminModelProviderPool .admin-provider-pool-row { padding:12px; }
  #adminModelProviderPool .admin-pool-provider-head {
    grid-template-columns:auto minmax(0,1fr);
  }
  #adminModelProviderPool .admin-pool-provider-name strong,
  #adminModelProviderPool .admin-pool-provider-name span {
    overflow-wrap:anywhere;
    white-space:normal;
  }
  #adminModelProviderPool .admin-provider-metrics,
  #adminModelProviderPool .admin-provider-routing {
    grid-template-columns:1fr !important;
  }
}

/* 独立模型接口池页面：供应商列表只做接口维护，绑定与优选集中在这里。 */
.admin-model-pool-page { padding:24px; }
.admin-model-pool-page > .admin-card-head { align-items:flex-start; margin-bottom:18px; }
.admin-model-pool-page > .admin-card-head p { max-width:720px; margin:6px 0 0; color:var(--ink-3); font-size:13px; line-height:1.6; }
.admin-pool-principles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:18px; }
.admin-pool-principles > div { display:grid; grid-template-columns:auto minmax(0,1fr); gap:3px 9px; align-items:center; padding:13px; background:linear-gradient(135deg,#faf8ff,#f5f8ff); border:1px solid #e7def5; border-radius:13px; }
.admin-pool-principles b { grid-row:1 / span 2; display:grid; width:30px; height:30px; place-items:center; color:#fff; background:#6e52b8; border-radius:10px; font-size:13px; }
.admin-pool-principles strong { color:var(--ink); font-size:13px; }
.admin-pool-principles span { color:var(--ink-3); font-size:10px; line-height:1.45; }
.admin-model-pool-list { display:grid; gap:10px; }
.admin-model-pool-card { display:grid; gap:13px; padding:16px; background:#fff; border:1px solid #e7e0ee; border-radius:14px; box-shadow:0 4px 14px rgba(49,35,68,.04); }
.admin-model-pool-card-main { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center; }
.admin-model-pool-card-icon { display:grid; width:42px; height:42px; place-items:center; color:#fff; background:linear-gradient(145deg,#7655c6,#4b3a84); border-radius:12px; font-size:15px; font-weight:900; }
.admin-model-pool-card-title { display:grid; gap:3px; min-width:0; }
.admin-model-pool-card-title strong { color:var(--ink); font-size:16px; }
.admin-model-pool-card-title span { color:#6952a0; font-size:11px; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }
.admin-model-pool-card-title small { overflow:hidden; color:var(--ink-3); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.admin-model-pool-card-meta { display:flex; align-items:center; gap:9px; flex-wrap:wrap; padding-top:12px; border-top:1px solid #eee8f3; }
.admin-model-pool-card-meta > span { padding:6px 9px; color:var(--ink-3); background:#f8f6fa; border-radius:8px; font-size:11px; }
.admin-model-pool-card-meta > span b { margin-left:3px; color:var(--ink); font-size:12px; }
.admin-model-pool-card-meta .secondary-button { margin-left:auto; }
.admin-pool-footer-note { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; margin-top:15px; padding:12px 14px; color:var(--ink-3); background:#faf9fc; border:1px solid #eee8f3; border-radius:11px; font-size:11px; line-height:1.6; }
.admin-pool-footer-note strong { color:var(--ink-2); }
.admin-model-modal-card { width:min(920px,calc(100vw - 32px)); max-height:min(88vh,900px); }
.admin-model-modal-card .modal-header { position:sticky; z-index:2; top:0; background:rgba(255,255,255,.96); backdrop-filter:blur(12px); }
.admin-model-modal-card .modal-body { padding:20px 24px; background:linear-gradient(180deg,#fff,#fbfaff); }
.admin-model-modal-card .form-grid { gap:14px; }
.admin-model-modal-card .field { gap:6px; }
.admin-model-modal-card .field > label { font-size:13px; }
.admin-model-modal-card .field input,
.admin-model-modal-card .field select,
.admin-model-modal-card .field output { min-height:40px; height:40px; border-radius:10px; }
.admin-model-modal-card .field[data-model-capability-field] { padding:12px 13px; background:#faf8fd; border:1px solid #e8e0f1; border-radius:11px; }
.admin-model-modal-card .field[data-model-capability-field] > label:not(:first-child) { display:flex; min-height:34px; align-items:center; gap:9px; margin-top:4px; padding:6px 8px; color:var(--ink-2); background:#fff; border:1px solid #eee8f3; border-radius:8px; font-size:12px; font-weight:650; }
.admin-model-modal-card .field[data-model-capability-field] input[type=checkbox] { width:17px; height:17px; margin:0; accent-color:#6e52b8; }
.admin-model-modal-card .modal-footer { position:sticky; z-index:2; bottom:0; background:rgba(255,255,255,.96); backdrop-filter:blur(12px); }
@media (max-width:760px) {
  .admin-model-pool-page { padding:16px; }
  .admin-pool-principles { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-model-pool-card-main { grid-template-columns:auto minmax(0,1fr); }
  .admin-model-pool-card-main > .admin-badge { grid-column:2; justify-self:start; }
  .admin-model-pool-card-meta .secondary-button { width:100%; margin-left:0; }
}
@media (max-width:420px) {
  .admin-pool-principles { grid-template-columns:1fr; }
  .admin-model-modal-card { width:calc(100vw - 20px); }
  .admin-model-modal-card .modal-body { padding:16px 14px; }
}
.commerce-target-receipt{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;padding:10px 12px;border:1px solid #d9cfee;border-radius:12px;background:linear-gradient(135deg,#faf8ff,#f3f0fb);color:#3f315f;font-size:12px}
.commerce-target-receipt strong{font-size:12px;color:#5c3fb7}
.commerce-target-receipt span{font-weight:600}
.commerce-target-receipt small{width:100%;color:#777080}