/* State variants share the real cards' layout. No private data or image reads. */
.home-workspace :is(.home-project-spotlight, .home-niche-spotlight) { display: flex; }
.home-workspace :is(.latest-project-featured, .niche-spotlight-featured) { flex: 1; min-width: 0; width: 100%; }
.home-workspace .latest-project-featured { display: flex; flex-direction: column; }
.home-workspace .latest-project-featured .home-card-heading p { min-height: 3em; }
.home-workspace .latest-project-featured h2 { min-height: 2.7em; }
.home-workspace .latest-project-featured .latest-project-copy { min-height: 3.2em; }
.home-workspace .niche-spotlight-featured .niche-spotlight-title { min-height: 2.6em; }
.home-workspace .niche-spotlight-featured .niche-spotlight-footer { margin-top: auto; padding-top: 18px; }
.home-workspace .latest-project-featured.is-empty .latest-project-status::before { display: none; }
.home-workspace .latest-project-featured.is-empty .latest-project-action.primary { max-width: none; width: 100%; }
.home-workspace .home-onboarding-card { padding: 24px; }
.home-onboarding-card :is(.home-workflow-art, .home-niche-preview) { pointer-events: none; user-select: none; }
.home-onboarding-card svg { fill: none; stroke: currentColor; stroke-width: 1.7; }
.home-workspace .home-onboarding-card .niche-spotlight-head { min-height: 70px; }
.home-workspace .home-onboarding-card .niche-spotlight-visual { margin-top: 24px; }
.home-workspace .home-onboarding-card :is(.latest-project-empty-media, .niche-locked-cover) { aspect-ratio: 16 / 9; background: radial-gradient(ellipse at 55% 55%, color-mix(in srgb, var(--sia-teal) 10%, transparent), transparent 75%), var(--sia-sidebar-bg); border: 1px solid var(--home-control-edge); border-radius: 20px; overflow: hidden; position: relative; }
.home-workspace .latest-project-empty-media::after { display: none; }
.home-workspace .home-onboarding-card .home-state-title { color: var(--sia-heading); font-size: clamp(26px, 2.2vw, 32px); font-weight: 800; letter-spacing: -.03em; line-height: 1.2; margin: 20px 0 12px; min-height: 0; text-align: left; }
.home-state-accent { color: var(--sia-sidebar-accent); }
.home-workspace .home-onboarding-card :is(.latest-project-copy, .home-state-description) { color: var(--sia-muted); font-size: 15px; line-height: 1.6; margin: 0; min-height: 0; padding: 0; text-align: left; }
.home-workspace .home-onboarding-card .niche-spotlight-identity { margin-top: 0; text-align: left; }
.home-onboarding-benefits { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; margin: 24px 0; padding: 0; }
.home-onboarding-benefits li { align-items: center; background: var(--sia-sidebar-bg); border: 1px solid var(--home-panel-edge); border-radius: 16px; display: flex; gap: 10px; min-width: 0; padding: 12px 10px; }
.home-onboarding-benefits svg { color: var(--sia-sidebar-accent); flex: 0 0 30px; height: 30px; width: 30px; }
.home-onboarding-benefits strong { color: var(--sia-heading); display: block; font-size: 14px; font-weight: 700; line-height: 1.4; }
.home-onboarding-benefits small { color: var(--sia-muted); display: block; font-size: 12px; line-height: 1.4; margin-top: 3px; }
.home-workspace .home-onboarding-card .latest-project-footer { padding-top: 24px; }

/* Code-native illustration; no project, channel or private image is requested. */
.home-workflow-art { display: block; height: 100%; inset: 0; position: absolute; width: 100%; }
.home-workflow-wires { color: var(--sia-sidebar-accent); height: 100%; inset: 0; opacity: .65; position: absolute; width: 100%; }
.home-workflow-wires path { stroke-width: 1.5; }
.home-workflow-inputs { display: grid; gap: 9%; height: 74%; left: 6%; position: absolute; top: 12%; width: 29%; }
.home-workflow-input { align-items: center; background: var(--sia-sidebar-bg); border: 1px solid var(--home-control-edge); border-radius: 10px; box-shadow: var(--home-soft-glow); color: var(--sia-sidebar-accent); display: flex; gap: 10px; min-height: 0; padding: 8px; transform: rotate(-4deg); }
.home-workflow-input > svg { flex: 0 0 24px; height: 24px; width: 24px; }
.home-workflow-input > span { flex: 1; min-width: 0; }
.home-workflow-input b { color: var(--sia-heading); display: block; font-size: 12px; font-weight: 700; line-height: 1.3; }
.home-workflow-input i { background: color-mix(in srgb, var(--sia-sidebar-accent) 25%, transparent); border-radius: 4px; display: block; height: 4px; margin-top: 5px; width: 85%; }
.home-workflow-input i:last-child { opacity: .55; width: 60%; }
.home-workflow-editor { background: var(--sia-sidebar-bg); border: 1px solid var(--sia-sidebar-active-line); border-radius: 15px; box-shadow: 0 0 16px color-mix(in srgb, var(--sia-teal) 12%, transparent); height: 70%; left: 42%; overflow: hidden; padding: 9px; position: absolute; top: 16%; transform: rotate(-5deg); width: 48%; }
.home-workflow-screen { border-radius: 8px; display: block; height: 78%; overflow: hidden; position: relative; }
.home-state-landscape { background: radial-gradient(ellipse at 70% 10%, color-mix(in srgb, var(--sia-sidebar-accent) 28%, transparent), transparent 75%), var(--sia-surface-soft); display: block; height: 100%; width: 100%; }
.home-state-landscape :is(path, circle) { stroke: none; }
.home-state-landscape .landscape-moon { fill: var(--sia-sidebar-accent); opacity: .7; }
.home-state-landscape .landscape-far { fill: color-mix(in srgb, var(--sia-teal-dark) 40%, var(--sia-surface)); }
.home-state-landscape .landscape-snow { fill: color-mix(in srgb, var(--sia-sidebar-accent) 50%, var(--sia-surface)); }
.home-state-landscape .landscape-mid { fill: color-mix(in srgb, var(--sia-teal-dark) 60%, var(--sia-bg)); }
.home-state-landscape .landscape-near { fill: var(--sia-bg); }
.home-state-landscape .landscape-river { fill: var(--sia-sidebar-accent); opacity: .3; }
.home-workflow-play { align-items: center; background: var(--sia-sidebar-bg); border: 1px solid var(--sia-sidebar-active-line); border-radius: 50%; box-shadow: 0 0 18px color-mix(in srgb, var(--sia-teal) 25%, transparent); color: var(--sia-sidebar-accent); display: flex; height: 38%; justify-content: center; left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%); aspect-ratio: 1; }
.home-workflow-play svg { height: 70%; width: 70%; }
.home-workflow-timeline { align-items: stretch; display: flex; gap: 4px; height: 15%; margin-top: 4%; }
.home-workflow-timeline i { background: color-mix(in srgb, var(--sia-teal) 35%, var(--sia-surface-soft)); border: 1px solid var(--home-panel-edge); border-radius: 3px; flex: 1; }
.home-workflow-timeline i:nth-child(even) { background: color-mix(in srgb, var(--sia-sidebar-accent) 20%, var(--sia-surface)); }
.home-workflow-finish { align-items: center; background: var(--sia-sidebar-bg); border: 1px solid var(--sia-sidebar-active-line); border-radius: 12px; bottom: 6%; color: var(--sia-sidebar-accent); display: flex; flex-direction: column; gap: 4px; padding: 9px; position: absolute; right: 4%; transform: rotate(5deg); }
.home-workflow-finish svg { height: 25px; width: 25px; }
.home-workflow-finish b { color: var(--sia-heading); font-size: 12px; font-weight: 650; }
.home-art-star { color: var(--sia-sidebar-accent); font-size: 25px; position: absolute; }
.home-art-star.one { left: 58%; top: 4%; }
.home-art-star.two { bottom: 5%; left: 36%; }

.home-niche-preview { background: var(--sia-sidebar-bg); border: 1px solid var(--home-control-edge); border-radius: 14px; filter: blur(4px); height: 76%; left: 12%; opacity: .75; padding: 12px; position: absolute; top: 17%; transform: rotate(-4deg); width: 76%; }
.home-niche-preview-main { display: flex; gap: 12px; height: 62%; }
.home-niche-preview-main > svg { border-radius: 8px; width: 52%; }
.home-niche-preview-main > span { display: grid; flex: 1; gap: 8px; padding: 10px 0; }
.home-niche-preview-main i { background: color-mix(in srgb, var(--sia-sidebar-accent) 25%, var(--sia-surface-soft)); border-radius: 5px; height: 10px; }
.home-niche-preview-main b { background: var(--sia-teal); border-radius: 9px; height: 22px; width: 80%; }
.home-niche-preview-stats { display: flex; gap: 8px; height: 28%; margin-top: 6%; }
.home-niche-preview-stats i { background: var(--home-control-fill); border: 1px solid var(--home-control-edge); border-radius: 8px; flex: 1; }
.home-niche-badge { align-items: center; background: var(--sia-sidebar-bg); border: 1px solid var(--sia-sidebar-active-line); border-radius: 999px; color: var(--sia-heading); display: inline-flex; font-size: 12px; font-weight: 700; gap: 8px; left: 5%; padding: 8px 12px; position: absolute; top: 7%; }
.home-niche-badge svg { color: var(--sia-sidebar-accent); height: 22px; width: 22px; }
.home-niche-exclusive { bottom: 7%; color: var(--sia-muted); font-size: 12px; position: absolute; right: 5%; }
.niche-cover-lock { align-items: center; aspect-ratio: 1; background: var(--sia-sidebar-bg); border: 1px solid var(--sia-sidebar-active-line); border-radius: 50%; box-shadow: 0 0 24px color-mix(in srgb, var(--sia-teal) 18%, transparent); color: var(--sia-sidebar-accent); display: flex; justify-content: center; left: 50%; position: absolute; top: 52%; transform: translate(-50%, -50%); width: 19%; }
.niche-cover-lock svg { height: 48%; width: 48%; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-metrics { margin: 20px 0 24px; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-metric { overflow: hidden; position: relative; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-metric strong { align-items: center; display: flex; min-height: 1.3em; }
.home-private-placeholder { background: color-mix(in srgb, var(--sia-sidebar-accent) 24%, var(--sia-surface-soft)); border-radius: 999px; display: block; height: 14px; min-height: 0 !important; width: 70%; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-metric .home-metric-lock { background: var(--sia-sidebar-bg); border: 1px solid var(--home-control-edge); border-radius: 8px; color: var(--sia-sidebar-accent); display: flex; grid-area: auto; height: 26px; min-height: 0; padding: 5px; position: absolute; right: 10px; top: 10px; width: 26px; }
.home-metric-lock svg { height: 100%; width: 100%; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-metric .home-metric-sparkline { border: 0; bottom: 8px; color: var(--sia-sidebar-accent); grid-area: auto; height: 38px; opacity: .12; padding: 0; position: absolute; right: 0; stroke-width: 5; width: 64px; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-note { align-items: center; background: var(--sia-sidebar-bg); border: 1px solid var(--home-panel-edge); border-radius: 16px; color: var(--sia-muted); display: flex; font-size: 12px; gap: 10px; line-height: 1.5; margin: 0; max-width: none; min-height: 52px; padding: 10px 12px; }
.niche-spotlight-note > svg { color: var(--sia-sidebar-accent); flex: 0 0 24px; height: 24px; width: 24px; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-actions { align-items: center; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-footer { align-items: stretch; display: flex; flex-direction: column; }
.home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-action { background: linear-gradient(110deg, var(--sia-teal-dark), #0c666f) !important; color: white !important; }
html[data-theme="dark"] .home-workspace .niche-spotlight-featured.is-locked .niche-spotlight-action { background: linear-gradient(110deg, var(--sia-teal), var(--sia-teal-dark)) !important; color: #09262e !important; }
@container latest-video (max-width: 440px) {
  .home-onboarding-benefits li { flex-direction: column; text-align: center; }
  .home-workflow-input { gap: 5px; padding: 5px; }
  .home-workflow-input > svg { flex-basis: 19px; height: 19px; width: 19px; }
}
@media (max-width: 600px) {
  .home-workspace .home-onboarding-card { padding: 16px; }
}
@container latest-video (max-width: 280px) {
  .home-onboarding-benefits { grid-template-columns: 1fr; }
  .home-onboarding-benefits li { flex-direction: row; text-align: left; }
  .home-workflow-inputs { left: 4%; width: 33%; }
  .home-workflow-input i { display: none; }
}
