/* Auralis typography and spacing only. Layout, color, surfaces and motion
   continue to come from the video-based workbench in design.css. */
@font-face {
  font-family: 'Geist';
  src: url('fonts/geist-400.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('fonts/geist-500.ttf') format('truetype');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('fonts/geist-600.ttf') format('truetype');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('fonts/geist-700.ttf') format('truetype');
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('fonts/jetbrains-mono-600.woff2') format('woff2');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
body.design-preview {
  font-family: 'Geist', 'Helvetica Neue', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
}
.design-preview :is(button, input, select, textarea) { font-family: inherit; }
.design-preview :is(h1, h2, h3, h4) {
  font-family: 'Geist', 'Helvetica Neue', sans-serif;
  font-weight: 500;
  letter-spacing: 0;
}
.design-preview .heading h1, .design-preview h1 { font-size: 32px; line-height: 1.2; }
.design-preview :is(.sectionhead h2, .ref-dashboard-grid h2, .owner-cards h2) {
  font-size: 20px !important;
  font-weight: 500;
  line-height: 1.3;
}
.design-preview :is(.heading p, .partner-heading p) { font-size: 16px; line-height: 1.6; }
.design-preview :is(.eyebrow, .navlabel, .environment-switch label, .stockdialoghead small, .board-reference, .chart-period) {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
}
.design-preview .design-rail nav .navlabel { font-size: 12px; }
.design-preview :is(.studio-brand strong, .studio-brand small) { font-size: 13px; line-height: 1.6; }
.design-preview :is(.studio-person small, .ref-panel-note, .ref-person-info small, .metrics small, .ref-funding > small) {
  font-size: 14px;
  line-height: 1.6;
}
.design-preview :is(.metrics article > span, .ref-person-info strong, .current-stage-label, .current-stage-row > strong) {
  font-size: 16px;
  line-height: 1.6;
}
.design-preview :is(.metrics strong, .ref-funding .bigmoney, .next-step-count) {
  font-family: 'Geist', 'Helvetica Neue', sans-serif;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.design-preview :is(label, .formgrid label, .expense-grid label) {
  font-size: 16px;
  line-height: 1.6;
}
.design-preview :is(input:not([type=checkbox]):not([type=radio]), select, textarea) {
  font-size: 16px !important;
  line-height: 1.6;
}
.design-preview :is(.button, .textbutton) { font-family: inherit; font-weight: 500; line-height: 1.2; }
.design-preview .owner-cards :is(.card-caption, .owner-card-row small, .card-link) { font-size: 14px !important; line-height: 1.6; }

/* Shared 8 px rhythm: 16 px gaps and 24 px card insets. Keep the existing
   responsive grid and the reference video's compact application density. */
.design-preview .design-shell main { padding: 32px; }
.design-preview .studio-topbar { padding: 16px 32px; gap: 16px; align-items: center; }
.design-preview .heading, .design-preview .partner-heading { gap: 16px; margin-bottom: 24px; align-items: flex-start; }
.design-preview .heading h1 { margin-bottom: 8px; }
.design-preview .heading .actions { gap: 8px; align-items: center; }
.design-preview :is(.metrics, .ref-dashboard-grid, .ref-stock-stack, .ref-proc-overview-grid, .owner-cards, .stockgrid, .stockboard, .twocol, .overview-grid, .partner-grid, .formgrid, .expense-grid) { gap: 16px; }
.design-preview :is(.metrics, .ref-dashboard-grid, .ref-proc-overview-grid) { margin-bottom: 24px; }
.design-preview :is(.panel:not(.stocklist):not(.purchase-breakdown):not(.record-history-disclosure), .ref-dashboard-grid .panel, .ref-proc-overview-grid .panel) { padding: 24px; }
.design-preview .dashboard-chart { padding: 24px !important; }
.design-preview .dashboard-charts { gap: 16px !important; margin: 24px 0 !important; }
.design-preview .metrics article { padding: 24px; }
.design-preview .metrics strong { margin: 16px 0 8px; }
.design-preview .metric-action { margin-top: 4px; }
.design-preview .sectionhead { gap: 16px; margin-bottom: 16px; align-items: baseline; }
.design-preview .ref-dashboard-grid .sectionhead { gap: 16px; margin-bottom: 16px; }
.design-preview .current-stage-list { gap: 8px; margin-top: 24px; }
.design-preview .current-stage-row { padding: 16px; gap: 8px 16px; align-items: baseline; }
.design-preview .ref-person-row { padding: 16px 0; gap: 8px; align-items: center; }
.design-preview .ref-funding .funding { gap: 16px; padding-top: 16px; margin-top: 24px; }
.design-preview .ref-funding .button { margin-top: 24px; }
.design-preview .stockdialoghead { padding: 24px; gap: 16px; align-items: flex-start; }
.design-preview .stockdialoghead .actions { gap: 8px; }
.design-preview .stockdialoghead h2 { margin-top: 8px; }
.design-preview .board-item { padding: 16px; margin-bottom: 16px; }
.design-preview .filters { padding: 16px; gap: 8px; align-items: center; }
.design-preview .stockviewbar { margin: 24px 0; gap: 16px; align-items: center; }
.design-preview .stocklist :is(th, td) { padding: 16px; }
.design-preview .import-start ol { gap: 16px; margin: 24px 0; }
.design-preview .import-start li { gap: 8px; padding-top: 16px; }
.design-preview .purchase-breakdown { margin-top: 24px; }
.design-preview .purchase-breakdown summary { padding: 16px 24px; }
.design-preview .purchase-breakdown-table { padding: 16px 24px; }
.design-preview .dashboard-footnote { margin-top: 24px; }
.design-preview.design-embedded .metrics article { padding: 24px; }
.design-preview.design-embedded .design-shell main { padding: 24px !important; }

@media (max-width: 900px) {
  .design-preview .design-shell main { padding: 24px; }
  .design-preview .studio-topbar { padding: 16px 24px; }
  .design-preview .metrics article { padding: 16px; }
}
@media (max-width: 1200px) {
  /* Reserve two label lines so metric values share a baseline when labels wrap. */
  .design-preview .metrics article > span { min-height: 3.2em; }
}
@media (max-width: 700px) {
  .design-preview .design-shell main { padding: 24px 16px; }
  .design-preview .studio-topbar { padding: 8px 16px; gap: 8px; }
  .design-preview .heading h1 { font-size: 28px; }
  .design-preview .metrics strong { font-size: 24px; }
  .design-preview .metrics article > span { font-size: 14px; }
  .design-preview .metrics small { font-size: 13px; }
  .design-preview .stockdialoghead { padding: 16px; gap: 8px; }
  .design-preview .stockviewbar { align-items: flex-start; }
  .design-preview .ref-person-info strong { font-size: 16px; }
}
@media print {
  .design-preview .design-shell main { padding: 0; }
}

/* Short desktop windows: fit a laptop's usable viewport without page zoom.
   Preserve body/form typography and all existing workflow/motion behavior. */
@media screen and (min-width: 1000px) and (max-height: 900px) {
  :root { --rail: 208px; }
  .design-preview .design-rail.sidebar { padding: 16px 12px; }
  .design-preview .studio-brand { margin-bottom: 24px; gap: 8px; }
  .design-preview .studio-brand strong { font-size: 12px; }
  .design-preview .studio-brand small { font-size: 12px; }
  .design-preview .environment-switch { margin-bottom: 16px; }
  .design-preview .rail-bottom { padding-top: 8px; }
  .design-preview .studio-topbar { height: 64px; padding: 8px 24px; }
  .design-preview .design-shell main { padding: 24px; }
  .design-preview .heading, .design-preview .partner-heading { margin-bottom: 16px; }
  .design-preview .heading h1 { font-size: 28px; }
  .design-preview :is(.metrics, .ref-dashboard-grid, .ref-proc-overview-grid) { margin-bottom: 16px; }
  .design-preview .metrics article { min-height: 128px; padding: 16px; }
  .design-preview .metrics article > span { font-size: 14px; min-height: 1.6em; }
  .design-preview .metrics strong { font-size: clamp(26px, 2.1vw, 30px); margin: 8px 0; }
  .design-preview .metrics small { font-size: 13px; line-height: 1.5; }
  .design-preview .metric-action { top: 16px; right: 12px; margin-top: 0; }
  .design-preview :is(.ref-dashboard-grid .panel, .ref-proc-overview-grid .panel, .owner-cards .panel, .import-pipeline-card) { padding: 20px; }
  .design-preview .ref-analytics { min-height: 0; }
  .design-preview .ref-dashboard-grid .sectionhead { margin-bottom: 8px; }
  .design-preview .current-stage-list { margin-top: 16px; }
  .design-preview .current-stage-row { padding: 12px 16px; }
  .design-preview .ref-person-row { padding: 12px 0; }
  .design-preview .ref-funding .bigmoney { margin: 8px 0; }
  .design-preview .ref-funding .funding { margin-top: 16px; padding-top: 12px; }
  .design-preview .ref-funding .button { margin-top: 16px; }
  .design-preview .next-step-count { font-size: 32px; margin: 8px 0; }
  .design-preview .ref-next-step p { margin-bottom: 16px; }
  .design-preview .import-start ol { margin: 16px 0; }
  .design-preview .dashboard-charts { margin: 16px 0 !important; }
  .design-preview .dashboard-chart { padding: 20px !important; }
}
@media screen and (min-width: 1000px) and (max-width: 1200px) and (max-height: 900px) {
  .design-preview .metrics article > span { min-height: 3.2em; }
}
@media screen and (min-width: 1000px) and (max-width: 1100px) and (max-height: 900px) {
  .design-preview .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Keep financial figures and record labels readable at every viewport width. */
@media screen {
  .design-preview .ref-stock-stack { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .design-preview .ref-stock-stack > .panel { min-width: 0; }
  .design-preview .ref-stock-stack .ref-person-row { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 4px 12px; }
  .design-preview .ref-stock-stack .ref-person-row > .avatar { grid-column: 1; grid-row: 1 / span 2; }
  .design-preview .ref-stock-stack .ref-person-info { grid-column: 2; overflow-wrap: normal; word-break: normal; }
  .design-preview .ref-stock-stack .ref-person-info strong { white-space: nowrap; }
  .design-preview .ref-stock-stack .ref-person-row > .badge { grid-column: 2; justify-self: start; max-width: 100%; }
}
@media screen and (max-width: 1200px) {
  .design-preview .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .design-preview .ref-dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  .design-preview :is(.ref-analytics, .ref-funding, .ref-stock-stack, .ref-events) { grid-column: 1; grid-row: auto; }
}
@media screen and (max-width: 520px) {
  .design-preview .metrics { grid-template-columns: minmax(0, 1fr); }
  .design-preview .metrics article { min-height: 0; }
  .design-preview .metrics article > span { min-height: 0; }
  .design-preview .metrics strong { font-size: 30px; }
}