/* The first paint follows the workspace layout; it never contains cached user data. */
:root {
  --boot-primary: #6ca9ea;
  --boot-accent: #c9a46a;
  --boot-background: #09152a;
  --boot-secondary: #10223b;
}
#workspace-startup {
  --startup-surface: color-mix(in srgb, var(--boot-background) 92%, white);
  --startup-line: color-mix(in srgb, var(--boot-primary) 17%, transparent);
  --startup-fill: color-mix(in srgb, var(--boot-primary) 10%, transparent);
  --startup-text: #b9c7db;
  display: none;
  position: relative;
  z-index: 1;
  grid-template-columns: 260px minmax(0, 1fr);
  grid-template-rows: 76px 1fr;
  min-height: 100dvh;
  background: radial-gradient(ellipse at 0 0, color-mix(in srgb, var(--boot-primary) 8%, transparent), transparent 60%), var(--boot-background);
  color: var(--startup-text);
}
html.boot-workspace body:not(.auth-resolved) #workspace-startup,
body.startup-error #workspace-startup { display: grid; }
body.auth-resolved #workspace-startup { display: none; }
html.boot-light #workspace-startup {
  --startup-surface: #fff;
  --startup-line: color-mix(in srgb, var(--boot-primary) 14%, #e5e9ef);
  --startup-fill: color-mix(in srgb, var(--boot-primary) 7%, #e9edf2);
  --startup-text: #526174;
  background: color-mix(in srgb, var(--boot-primary) 2%, #f8fafc);
}
html.boot-light body:not(.auth-resolved) { background: #f8fafc; }
body:not(.auth-resolved)::before, body:not(.auth-resolved)::after { display: none; }
.startup-sidebar { grid-row: 1 / 3; padding: 24px 18px; border-right: 1px solid var(--startup-line); background: color-mix(in srgb, var(--boot-primary) 3%, var(--startup-surface)); }
.startup-brand { height: 104px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; margin-bottom: 28px; border: 1px solid var(--startup-line); border-radius: 18px; background: linear-gradient(145deg, var(--boot-secondary), var(--boot-background)); }
.startup-brand img { width: 58px; height: 58px; }
.startup-brand span { color: #dbe4ef; font-size: 10px; font-weight: 600; letter-spacing: .2em; }
.startup-placeholder, .startup-card i { display: block; height: 12px; border-radius: 6px; background: var(--startup-fill); position: relative; overflow: hidden; }
.startup-placeholder::after, .startup-card::after { content: ''; position: absolute; inset: 0; transform: translateX(-110%); background: linear-gradient(100deg, transparent 15%, color-mix(in srgb, var(--boot-primary) 10%, transparent) 50%, transparent 85%); animation: startup-sweep 2.4s .4s ease-in-out infinite; }
.startup-project { height: 64px; border-radius: 12px; margin-bottom: 36px; }
.startup-nav { display: grid; gap: 23px; margin: 0 14px 42px; }
.startup-nav i { width: 75%; }.startup-nav i:nth-child(2) { width: 58%; }
.startup-topbar { display: flex; align-items: center; justify-content: space-between; padding: 0 32px; border-bottom: 1px solid var(--startup-line); background: var(--startup-surface); }
.startup-topbar > i:first-child { width: 180px; height: 34px; border-radius: 9px; }
.startup-topbar .startup-avatar { width: 36px; height: 36px; border-radius: 50%; }
.startup-content { min-width: 0; padding: 32px 40px; }
.startup-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 32px; }
.startup-heading > div { display: grid; gap: 12px; }.startup-heading > div i:first-child { width: 160px; height: 30px; }.startup-heading > div i:last-child { width: 112px; height: 10px; }.startup-heading > i { width: 128px; height: 40px; }
.startup-filters { display: flex; gap: 16px; padding: 18px; border: 1px solid var(--startup-line); border-radius: 14px; margin-bottom: 28px; background: var(--startup-surface); }
.startup-filters i { width: 21%; height: 34px; }.startup-filters i:last-child { margin-left: auto; width: 30%; }
.startup-board { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.startup-column { min-height: 370px; padding: 18px 14px; border: 1px solid var(--startup-line); border-radius: 16px; background: color-mix(in srgb, var(--startup-surface) 65%, transparent); }
.startup-column > i { width: 52%; margin: 2px 0 26px; }
.startup-card { position: relative; overflow: hidden; display: grid; gap: 15px; padding: 22px 18px; border: 1px solid var(--startup-line); border-radius: 12px; margin-bottom: 14px; background: var(--startup-surface); }
.startup-card i:nth-child(2) { width: 74%; }.startup-card i:last-child { width: 35%; height: 8px; margin-top: 17px; }
.startup-progress { position: absolute; top: 0; left: 0; right: 0; height: 2px; overflow: hidden; opacity: 0; animation: startup-reveal .2s .4s forwards; }
.startup-progress::after { content: ''; display: block; width: 30%; height: 100%; background: linear-gradient(90deg, transparent, var(--boot-primary), var(--boot-accent)); animation: startup-progress 1.8s ease-in-out infinite; }
.startup-status { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 26px; font-size: 12px; opacity: 0; animation: startup-reveal .3s 2.5s forwards; }
.startup-status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--boot-primary); box-shadow: 0 0 12px var(--boot-primary); }
#startup-retry { padding: 9px 14px; border: 1px solid var(--startup-line); border-radius: 9px; color: var(--startup-text); background: var(--startup-surface); cursor: pointer; font: inherit; font-weight: 600; }
#startup-retry:focus-visible { outline: 2px solid var(--boot-primary); outline-offset: 3px; }
body.startup-error .startup-status { opacity: 1; animation: none; }
body.startup-error .startup-progress, body.startup-error .startup-placeholder::after, body.startup-error .startup-card::after { display: none; }
body.startup-error .startup-status-dot { background: #cf9049; box-shadow: none; }
@keyframes startup-sweep { to { transform: translateX(110%); } }
@keyframes startup-progress { from { transform: translateX(-100%); } to { transform: translateX(435%); } }
@keyframes startup-reveal { to { opacity: 1; } }
@media (min-width: 769px) { html.boot-compact #workspace-startup { grid-template-columns: 80px minmax(0, 1fr); } html.boot-compact .startup-sidebar { padding: 18px 10px; } html.boot-compact .startup-brand { height: 64px; } html.boot-compact .startup-brand img { width: 40px; height: 40px; } html.boot-compact .startup-brand span, html.boot-compact .startup-project { display: none; } html.boot-compact .startup-nav { margin: 28px 8px; } html.boot-compact .startup-nav i { width: 24px; height: 24px; } }
@media (max-width: 1100px) { .startup-board { grid-template-columns: repeat(3, minmax(0, 1fr)); }.startup-column:last-child { display: none; } }
@media (max-width: 768px) { #workspace-startup { grid-template-columns: minmax(0, 1fr); grid-template-rows: 64px 1fr; }.startup-sidebar { display: none; }.startup-topbar { padding: 0 20px; }.startup-content { padding: 28px 20px; }.startup-board { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.startup-column:nth-child(3) { display: none; }.startup-card { padding: 18px 12px; }.startup-heading > i { width: 82px; }.startup-status { flex-wrap: wrap; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .startup-placeholder::after, .startup-card::after, .startup-progress::after { animation: none; }.startup-status, .startup-progress { animation: none; opacity: 1; } }