/* The same workspace surfaces and spacing as MainPage, SidebarMainScreen,
   TabContainer, GridView, ChatHeader and ChatInput. No invented dashboard. */
#workspace-startup {
  position: fixed; inset: 0; z-index: 2147481000; overflow: hidden;
  padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) 0 env(safe-area-inset-left, 0px);
  box-sizing: border-box; background: #141e2b; color: #a6b4c6; font: 12px/1.5 system-ui, sans-serif;
}
/* Project the recessed plane into 2D: scale = perspective/(perspective+depth).
   This has the same depth/position as translateZ(-76px) at 1200px perspective,
   without a full-window 3D raster surface that can lose background tiles on
   high-resolution displays while the app mounts. */
#workspace-startup, .nv-workspace-arriving { --nv-start-scale: .9404388715; --nv-start-drop: 12px; }
#workspace-startup *, #workspace-startup *::before, #workspace-startup *::after { box-sizing: border-box; }
html.nv-start-active #boot-splash { display: none; }
/* Keep mounting content out of the paint until the measured handoff. Visibility
   preserves layout/ResizeObserver measurements; display:none would break them. */
html.nv-start-active [data-startup-workspace]:not(.nv-workspace-arriving) { visibility: hidden; }
.nv-start-scene { position: relative; display: flex; width: 100%; height: 100%; transform: scale(var(--nv-start-scale)) translateY(var(--nv-start-drop)); transform-origin: 50% 50%; background: #1f2937; border-radius: 5px; box-shadow: 0 0 0 1px rgba(128, 150, 180, .09), 0 12px 28px rgba(0, 0, 0, .45); }
.nv-start-scene::before { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; box-shadow: inset 0 10px 22px rgba(7, 13, 22, .3), inset 0 1px 3px rgba(7, 13, 22, .8); border-radius: inherit; }
.nv-start-scene[hidden] { display: none; }
.nv-start-sidebar { position: relative; flex: 0 0 var(--nv-start-sidebar, 15%); min-width: 0; overflow: hidden; padding-right: 24px; background: #1f2937; }
.nv-start-main { display: flex; flex: 1; min-width: 0; overflow: hidden; }
.nv-start-documents { flex: 0 1 var(--nv-start-documents, 50%); min-width: 0; min-height: 0; padding: 4px; background: hsl(215, 28%, 14%); box-shadow: inset 2px 0 4px rgba(0,0,0,.18), inset 4px 0 8px rgba(0,0,0,.12), inset -2px 0 4px rgba(0,0,0,.15), inset -4px 0 8px rgba(0,0,0,.08), 0 0 5px rgba(0,0,0,.303); display: flex; flex-direction: column; }
.nv-start-chat { flex: 0 1 calc(100% - var(--nv-start-documents, 50%)); min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; background: #1f2937; container-type: inline-size; }
.nv-start-divider { flex: 0 0 24px; display: grid; place-items: center; background: #1f2937; }
.nv-start-divider i, .nv-start-grip { display: block; width: 6px; height: 56px; }
/* Shared recessed grip: preserve the full divider's pointer/touch target. */
.nv-start-divider i, .nv-start-grip, .nv-workspace-divider > .touch-area {
  border-radius: 999px;
  background: linear-gradient(135deg, #18222e, #202b3a);
  opacity: 1;
  box-shadow: inset 1.5px 1.5px 2.5px rgba(5, 10, 18, .58),
    inset -1px -1px 2px rgba(98, 119, 145, .115),
    1px 1px 1px rgba(132, 155, 184, .135);
}
.nv-workspace-divider > .touch-area { transition: box-shadow 160ms ease; }
@media (hover: hover) and (pointer: fine) {
  .nv-workspace-divider:hover > .touch-area {
    box-shadow: inset 1.5px 1.5px 2.5px rgba(5, 10, 18, .65),
      inset -1px -1px 2px rgba(111, 140, 174, .175),
      1px 1px 1.5px rgba(132, 170, 211, .21);
  }
}
.nv-workspace-divider.nv-divider-dragging > .touch-area {
  box-shadow: inset 1.5px 1.5px 3px rgba(5, 10, 18, .71),
    inset -1px -1px 2px rgba(108, 150, 191, .21),
    1px 1px 1.5px rgba(132, 183, 225, .27);
}
@media (prefers-reduced-motion: reduce) {
  .nv-workspace-divider > .touch-area { transition: none; }
}
.nv-start-grip { position: absolute; right: 9px; top: calc(50% - 28px); }
.nv-start-brand { position: relative; z-index: 3; width: calc(100% + 24px); height: 134.1875px; padding: 18px 16px 10px; display: flex; flex-direction: column; align-items: center; gap: 16px; background: linear-gradient(145deg, rgba(35,45,59,.5), rgba(28,36,48,.45)); box-shadow: 2px 2px 6px rgba(0,0,0,.25), 4px 4px 12px rgba(0,0,0,.15), -1px -1px 4px rgba(255,255,255,.03), inset 1px 1px 2px rgba(255,255,255,.06); }
.nv-start-brand::before { content: ''; position: absolute; inset: 0 0 50%; background: linear-gradient(180deg, rgba(255,255,255,.06), transparent); }
.nv-start-brand::after { content: ''; position: absolute; inset: 50% 0 1px; background: linear-gradient(0deg, rgba(0,0,0,.08), transparent); }
.nv-start-sidebar::after { content: ''; position: absolute; z-index: 2; top: 0; right: 0; width: 4px; height: 100%; background: linear-gradient(to left, rgba(255,255,255,.025), rgba(255,255,255,.042), rgba(255,255,255,.028), rgba(255,255,255,.01), transparent); }
.nv-start-brand i { width: 88px; height: 78px; border-radius: 4px; background: #344153; clip-path: polygon(0 12%, 30% 0, 66% 52%, 66% 4%, 100% 4%, 100% 91%, 72% 100%, 32% 46%, 32% 96%, 0 96%); }
.nv-start-brand span { width: 110px; height: 9px; border-radius: 4px; background: #475364; }
.nv-start-tree { padding: 26px 14px 0; }
.nv-start-row { display: flex; align-items: center; gap: 14px; }
.nv-start-tree .nv-start-row { height: 38px; margin-bottom: 5px; border-radius: 11px; padding: 0 26px; background: linear-gradient(145deg, #293342, #222c39); box-shadow: inset 2px 2px 4px #17212e, inset -1px -1px 2px #394454; }
.nv-start-row i { width: 14px; height: 15px; background: #465364; border-radius: 3px; flex-shrink: 0; }
.nv-start-row span { display: block; height: 8px; background: #465364; border-radius: 4px; }
.nv-start-footer { position: absolute; bottom: 8px; left: 16px; right: 40px; }
.nv-start-trash { height: 34px; border-top: 1px solid #303a47; border-bottom: 1px solid #303a47; }
.nv-start-trash::after { content: ''; display: block; margin: 13px 8px; width: 42px; height: 6px; border-radius: 3px; background: #404d5e; }
.nv-start-credit { height: 44px; margin: 10px 8px; border-bottom: 5px solid #151e2b; border-radius: 2px; }
.nv-start-credit::before { content: ''; display: block; width: 98px; height: 7px; border-radius: 3px; background: #445062; transform: translateY(10px); }
.nv-start-profile { display: flex; align-items: center; gap: 18px; height: 40px; padding: 0 24px; border-radius: 9px; background: #303b4a; box-shadow: inset 2px 2px 5px #1d2735, inset -1px -1px 2px #465264; }
.nv-start-profile i { width: 12px; height: 12px; border-radius: 50%; background: #596575; }
.nv-start-profile span { width: 110px; height: 8px; border-radius: 4px; background: #596575; }
.nv-start-version { margin: 12px 8px 0; width: 48px; height: 5px; border-radius: 2px; background: #424e5e; }
.nv-start-tabs { height: 26px; flex-shrink: 0; display: flex; align-items: end; gap: 4px; padding: 0 30px; }
.nv-start-tabs span { width: 134px; height: 26px; border-radius: 10px 10px 0 0; background: #26313f; border: 1px solid #35404e; border-bottom: 0; }
.nv-start-tabs span::after { content: ''; display: block; margin: 10px 22px; width: 76px; height: 6px; background: #4d5969; border-radius: 3px; }
.nv-start-tabs i { width: 28px; height: 20px; border-radius: 9px 9px 0 0; background: #26313f; }
.nv-start-document-card { flex: 1; min-height: 0; margin: 0 10px 10px; border-radius: 8px; overflow: hidden; background: #1f2937; box-shadow: -1px 0 0 rgba(226,232,240,.07), 1px 0 0 rgba(226,232,240,.07), 0 3px 6px rgba(0,0,0,.55), 0 8px 16px -6px rgba(0,0,0,.6); }
.nv-start-toolbar { height: 58px; display: flex; align-items: center; gap: 10px; padding: 0 16px; background: linear-gradient(145deg, #283341, #222d3b); border-bottom: 1px solid #192432; }
.nv-start-toolbar span { margin-right: auto; width: 158px; height: 34px; border-radius: 10px; background: #263240; box-shadow: inset 2px 2px 4px #17212e, inset -1px -1px 2px #3d495a; }
.nv-start-toolbar span::after { content: ''; display: block; width: 95px; height: 8px; margin: 13px 32px; border-radius: 3px; background: #536071; }
.nv-start-toolbar > i { width: 88px; height: 28px; border-radius: 5px; background: #35404f; box-shadow: inset 1px 1px 4px #222c3a; }
.nv-start-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); grid-auto-rows: 240px; gap: 26px; padding: 17px 13px; }
.nv-start-gallery.nv-start-size-small { grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); grid-auto-rows: 180px; gap: 24px; padding: 16px 12px; }
.nv-start-gallery.nv-start-size-large { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); grid-auto-rows: 320px; gap: 28px; padding: 19px 14px; }
.nv-start-gallery.nv-document-skeleton-details { grid-template-columns: 1fr; grid-auto-rows: 48px; gap: 0; padding: 0; }
.nv-start-gallery.nv-document-skeleton-tiles { grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); grid-auto-rows: 72px; gap: 8px; padding: 4px; }
.nv-start-gallery.nv-document-skeleton-tiles.nv-start-size-small { grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); grid-auto-rows: 56px; gap: 6px; padding: 3px; }
.nv-start-gallery.nv-document-skeleton-tiles.nv-start-size-large { grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr)); grid-auto-rows: 88px; gap: 10px; padding: 5px; }
.nv-start-gallery.nv-document-skeleton-details.nv-start-size-small { grid-auto-rows: 40px; }
.nv-start-gallery.nv-document-skeleton-details.nv-start-size-large { grid-auto-rows: 56px; }
.nv-start-gallery.nv-document-skeleton-tiles .nv-start-gallery-card { position: relative; }
.nv-start-tabs { overflow: hidden; }
.nv-start-tabs span, .nv-start-tabs i { flex-shrink: 0; }
.nv-start-preview { margin: 24px auto; padding: 36px; width: 86%; min-height: 100%; background: #303b48; border-radius: 3px; }
.nv-start-preview .nv-start-row { height: 32px; }
.nv-start-preview .nv-start-row i { display: none; }
.nv-start-gallery-card { overflow: hidden; border-radius: 12px; background: #263140; box-shadow: inset 2px 2px 5px #182330, inset -1px -1px 3px #3b485a; }
.nv-start-card-title { height: 30px; padding: 10px 12px; background: #2b3544; border-bottom: 1px solid #182230; }
.nv-start-card-title::after { content: ''; display: block; height: 8px; width: 70%; border-radius: 4px; background: #536071; }
.nv-start-card-date { height: 26px; padding: 9px 12px; }
.nv-start-card-date::after { content: ''; display: block; height: 6px; width: 30%; border-radius: 3px; background: #465363; }
.nv-start-card-page { height: calc(100% - 61px); margin: 0 4px 5px; padding: 18px 10px; border-radius: 3px; background: #303b48; overflow: hidden; }
.nv-start-card-page .nv-start-row { height: 30px; }
.nv-start-card-page .nv-start-row i { display: none; }
.nv-start-card-page > span { display: block; height: 7px; margin: 8px 0 22px; border-radius: 3px; background: #465364; }
.nv-start-card-page .nv-start-row:first-child span, .nv-start-card-page > span:first-child { height: 12px; }
.nv-start-chat-header { flex: 0 0 64px; display: flex; align-items: center; gap: 8px; padding: 12px 16px; }
.nv-start-agent { flex: 1; min-width: 0; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.nv-start-agent i { width: 28px; height: 26px; border-radius: 3px; background: #495b71; }
.nv-start-agent span { width: 118px; height: 17px; border-radius: 4px; background: #536071; }
.nv-start-agent b { width: 98px; height: 28px; border-radius: 18px; background: #263241; box-shadow: inset 2px 2px 4px #192330; }
.nv-start-chat-header > i { width: 36px; height: 36px; border-radius: 8px; background: #35404e; box-shadow: inset 2px 2px 4px #1a2432; flex-shrink: 0; }
.nv-start-chat-body { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 24px; overflow: hidden; padding: 20px; }
.nv-start-greeting { width: min(480px, 95%); height: 16px; border-radius: 3px; background: #394452; transform: translateY(-50px); }
.nv-start-subtitle { display: none; width: 35%; height: 16px; border-radius: 3px; background: #394452; transform: translateY(-50px); }
.nv-start-composer { flex: 0 0 62px; display: flex; align-items: center; gap: 8px; margin: 0 16px 12px; padding: 8px; border-radius: 8px; background: linear-gradient(145deg, rgba(55,65,81,.98), rgba(45,55,72,.95)); border: 1px solid rgba(75,85,99,.5); box-shadow: 4px 4px 12px rgba(0,0,0,.45), -2px -2px 8px rgba(255,255,255,.06), inset 1px 1px 2px rgba(255,255,255,.08); }
.nv-start-composer > i { width: 34px; height: 34px; border-radius: 50%; background: #445163; flex-shrink: 0; box-shadow: inset 2px 2px 5px #243042; }
.nv-start-composer > i:first-child, .nv-start-composer > i:last-child { width: 30px; height: 22px; border-radius: 4px; background: #3d495a; box-shadow: none; }
.nv-start-composer span { height: 42px; flex: 1; min-width: 0; border-radius: 7px; background: #293443; box-shadow: inset 3px 3px 5px #1d2633, inset -1px -1px 2px #4b5665; }
.nv-start-status { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; align-items: center; gap: 10px; padding: 10px 16px; max-width: calc(100% - 24px); border-radius: 9px; background: #222d3b; border: 1px solid #3a4656; box-shadow: 0 3px 12px #17202d; white-space: nowrap; }
.nv-start-light { width: 5px; height: 5px; flex-shrink: 0; border-radius: 50%; background: #a4bcd9; animation: nv-start-breathe 2.6s ease-in-out infinite; }
.nv-start-steps { display: flex; gap: 3px; }
.nv-start-steps i { width: 8px; height: 2px; border-radius: 2px; background: #566577; }
.nv-start-steps i:first-child, [data-stage="session"] .nv-start-steps i:nth-child(2), [data-stage="workspace"] .nv-start-steps i, [data-stage="ready"] .nv-start-steps i { background: #9bacbf; }
.nv-start-slow { position: absolute; top: calc(50% + 35px); left: 12px; right: 12px; text-align: center; }
.nv-start-slow span { padding: 6px; border-radius: 6px; background: #1f2937; }
.nv-start-slow button { margin-left: 8px; border: 1px solid #5b7899; border-radius: 8px; padding: 6px 12px; background: #27374d; color: #d5e4f7; cursor: pointer; }
.nv-start-slow button:focus-visible { outline: 2px solid #9fc8ff; outline-offset: 3px; }
.nv-start-recorded { display: block; overflow: hidden; }
.nv-start-shape { position: absolute; display: block; margin: 0; padding: 0; border: 0; background: transparent; }
.nv-start-scene::after, .nv-document-loading::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(110deg, transparent 30%, rgba(190, 208, 233, .04) 48%, transparent 65%); transform: translateX(-100%); animation: nv-start-sweep 3.8s ease-in-out infinite; }
#workspace-startup.nv-start-leaving { z-index: 0; }
.nv-start-leaving .nv-start-scene, .nv-workspace-arriving { animation: nv-workspace-rise var(--nv-start-duration) cubic-bezier(.22, .61, .36, 1) both; will-change: transform; }
/* Reveal the real surface ABOVE an opaque skeleton. Fading the entire dark
   loader above the app tinted already-visible backgrounds until cleanup. Keep
   this below app portals (menus/dialogs), and never fade both surfaces away. */
.nv-workspace-arriving { z-index: 1; animation: nv-workspace-rise var(--nv-start-duration) cubic-bezier(.22, .61, .36, 1) both, nv-workspace-appear var(--nv-start-duration) ease-out both; will-change: transform, opacity; }
.nv-start-leaving .nv-start-status, .nv-start-leaving .nv-start-slow { animation: nv-start-dissolve var(--nv-start-duration) ease-out both; }
.nv-document-loading { position: relative; width: 100%; height: 100%; overflow: hidden; }
.nv-document-skeleton-cells { position: relative; width: 100%; height: 100%; }
.nv-document-skeleton-details .nv-start-gallery-card { border-radius: 0; box-shadow: none; border-bottom: 1px solid #35404d; display: flex; align-items: center; padding: 10px; gap: 24px; background: transparent; }
.nv-document-skeleton-details .nv-start-card-title { width: 45%; background: transparent; border: 0; }
.nv-document-skeleton-details .nv-start-card-date { width: 30%; }
.nv-document-skeleton-details .nv-start-card-page { display: none; }
.nv-document-skeleton-tiles .nv-start-card-page { position: absolute; left: 5px; top: 5px; width: 62px; height: calc(100% - 10px); margin: 0; }
.nv-document-skeleton-tiles .nv-start-card-title, .nv-document-skeleton-tiles .nv-start-card-date { margin-left: 74px; background: transparent; border: 0; }
@keyframes nv-start-sweep { 0%, 15% { transform: translateX(-100%); } 85%, 100% { transform: translateX(100%); } }
@keyframes nv-start-breathe { 50% { opacity: .4; } }
@keyframes nv-start-dissolve { 0% { opacity: 1; } 40%, 100% { opacity: 0; } }
/* Content is opaque early, while the shared animation lifetime lets the rise
   finish smoothly before controller cleanup removes the arriving class. */
@keyframes nv-workspace-appear { 0% { opacity: 0; } 50%, 100% { opacity: 1; } }
@keyframes nv-workspace-rise { from { transform: scale(var(--nv-start-scale)) translateY(var(--nv-start-drop)); } to { transform: scale(1) translateY(0); } }
@container (max-width: 420px) {
  .nv-start-subtitle { display: block; }
  .nv-start-chat-header { height: 84px; flex-basis: 84px; justify-content: center; }
  .nv-start-agent { flex: 0 1 180px; justify-content: center; }
  .nv-start-agent b { margin: 4px 20px 0; }
  .nv-start-chat-header > i:first-of-type { display: none; }
  .nv-start-composer { margin-left: 0; margin-right: 0; }
}
@media (max-width: 1023px) {
  /* Same projection as 28px depth with 1000px perspective. */
  #workspace-startup, .nv-workspace-arriving { --nv-start-scale: .9727626459; --nv-start-drop: 6px; }
  .nv-start-sidebar { display: none; }
  .nv-start-main { flex-direction: column; }
  .nv-start-documents { flex: 0 0 calc(var(--nv-start-top, 50%) - 20px); padding: 4px 4px 8px; }
  .nv-start-chat { flex: 0 0 calc(100% - var(--nv-start-top, 50%) - 20px); }
  .nv-start-divider { flex-basis: 40px; }
  .nv-start-divider i { width: 64px; height: 6px; }
  .nv-start-document-card { margin: 0; box-shadow: none; }
  .nv-start-tabs { padding-left: 20px; }
  .nv-start-composer { margin-bottom: 0; }
  .nv-start-composer span { height: 42px; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .nv-start-divider i { width: 80px; }
}
@media (max-width: 639px) {
  .nv-start-documents { padding: 2px 2px 4px; }
  .nv-start-toolbar { padding: 0 12px; }
  .nv-start-toolbar > i { width: 44px; }
  .nv-start-status { font-size: 11px; gap: 8px; }
}
@media (max-height: 520px) { .nv-start-chat-body { padding: 4px; gap: 8px; } .nv-start-greeting, .nv-start-subtitle { height: 10px; } }
@media (prefers-reduced-motion: reduce) {
  #workspace-startup *, #workspace-startup, .nv-workspace-arriving, .nv-document-loading::after { animation: none !important; transition: none !important; }
  .nv-start-scene { transform: none; box-shadow: none; }
  .nv-start-scene::before { box-shadow: none; }
}
