/* Survey Studio: a presentation layer over the existing survey workflow. */
:root, :root[data-theme="light"] {
  color-scheme: light; --paper: #f3f4f6; --paper-warm: #f3f4f6; --panel: #fff;
  --panel-raised: #f7f8fa; --panel-soft: #edf0f3; --panel-bar: #f7f8fa;
  --ink: #293341; --ink-strong: #16212e; --muted: #626f7d; --subtle: #6c7785;
  --line: #dfe4e9; --line-strong: #bbc5d0; --brand: #d72b35; --brand-dark: #b61e28;
  --red-soft: #fff0f0; --radius: 20px; --radius-sm: 12px; --text-page: 2rem;
  --shadow: 0 8px 24px #1c304008; --focus-ring: #4b79ac60;
}
body { -webkit-font-smoothing: antialiased; }
button, summary, input, select, textarea { touch-action: manipulation; }
.primary-button { font-weight: 650; box-shadow: 0 4px 10px #d72b351a; min-height: 48px; }
.secondary-button { min-height: 44px; }
input, select, textarea { background: var(--panel-raised); border-color: var(--line); border-radius: 11px; }
input:focus, select:focus, textarea:focus { background: var(--panel); }
h2, h3 { letter-spacing: -.035em; }
.row-kicker, .screen-meta { text-transform: uppercase; letter-spacing: .1em; font-size: 10px; font-weight: 700; }
.app-main-workspace { padding: 28px 24px 110px; max-width: 1440px; }
.screen-header { margin-bottom: 24px; }
.screen-title-block h2 { font-weight: 730; font-size: 30px; }
.screen-header .meta-line { margin-top: 5px; }
.field-welcome { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 30px 34px; margin: 0 0 24px; border-radius: 24px; background: #182b39; color: #c4d1da; overflow: hidden; }
.field-welcome-copy { max-width: 570px; min-width: 0; }
.field-overline { font-size: 10px; font-weight: 700; letter-spacing: .16em; color: #b5c9d5; }
.field-welcome h2 { margin: 12px 0; color: #fff; font-size: clamp(26px,3vw,40px); line-height: 1.12; font-weight: 650; }
.field-welcome p:not(.field-overline) { font-size: 13px; }
.field-welcome .primary-button { flex: 0 0 auto; margin: 0; padding: 12px 20px; }
.field-welcome .primary-button span { font-size: 20px; }
.dashboard-summary { gap: 12px; margin-bottom: 24px; }
.dashboard-summary .dashboard-tile { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 18px; box-shadow: var(--shadow); }
.dashboard-tile strong { font-size: 30px; font-weight: 650; letter-spacing: -.05em; }
.dashboard-tile span { font-size: 12px; color: var(--muted); }
.dashboard-tile .nav-icon { color: #6c8192; }
.dashboard-tile.has-issues { background: var(--amber-soft); }
.projects-command-row { padding: 0; margin-bottom: 28px; gap: 10px; }
.project-search-field input { background: var(--panel); min-height: 48px; }
.continue-project-grid { gap: 12px; }
.continue-project-row { border: 1px solid var(--line); border-radius: 18px; background: var(--panel); padding: 18px; box-shadow: var(--shadow); }
.continue-project-main { background: transparent; text-align: left; }
.continue-project-main strong { font-size: 18px; letter-spacing: -.02em; }
.continue-section { margin: 26px 0 32px; }
.status-section-heading { margin-bottom: 16px; }
.status-section-heading h3, .all-projects-heading h3 { font-size: 20px; }
.project-status-tabs { background: #e8ecf0; padding: 5px; border-radius: 14px; border: 0; gap: 4px; }
.project-status-tab { border: 0; border-radius: 10px; min-height: 46px; background: transparent; }
.project-status-tab.is-active { background: var(--panel); box-shadow: 0 2px 5px #172c3d12; color: var(--ink-strong); }
.project-card { border: 1px solid var(--line); border-radius: 16px; background: var(--panel); padding: 22px; margin-top: 12px; box-shadow: var(--shadow); }
.project-card h3 { font-size: 20px; }
.project-card-stats span { border-radius: 7px; background: var(--panel-raised); padding: 4px 8px; }
.durability-strip { border-radius: 14px; margin-bottom: 22px; overflow: hidden; background: var(--panel); }
.data-safety-item { min-height: 52px; }
.data-safety-item b { font-size: 9px; letter-spacing: .06em; }
.durability-detail { font-size: 11px; }
.active-project-header { background: var(--paper); border: 0; padding-bottom: 12px; }
.survey-workflow-nav { padding: 5px; border-radius: 14px; background: #e5eaf0; gap: 4px; margin-top: 18px; }
.survey-workflow-nav .app-area-tab { border: 0; border-radius: 10px; min-width: 0; min-height: 46px; color: var(--muted); background: transparent; font-weight: 600; }
.survey-workflow-nav .app-area-tab.is-active { background: var(--panel); box-shadow: 0 3px 8px #1c304012; color: var(--brand); }
.capture-workbench { border: 1px solid var(--line); border-radius: 22px; background: var(--panel); overflow: clip; box-shadow: var(--shadow); }
.capture-header { padding: 24px; background: var(--panel); border-bottom: 1px solid var(--line); }
.capture-header h2 { font-size: 25px; }
.capture-form { padding: 20px; }
.capture-block { border: 1px solid var(--line); border-radius: 16px; padding: 20px; background: var(--panel); }
.capture-primary-grid { gap: 16px; }
.block-heading { margin-bottom: 18px; }
.block-heading > span { border-radius: 8px; background: #eef2f6; color: #627d91; padding: 5px 8px; font-size: 11px; }
.block-heading strong { font-size: 17px; letter-spacing: -.02em; }
.current-area-control { border-radius: 12px; background: #f3f6f8; padding: 14px; }
.primary-measure input { min-height: 66px; font-size: 30px; font-weight: 650; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.builder-panel, .product-config-disclosure, .advanced-specification { border-radius: 16px; border-color: var(--line); }
.builder-panel-header { padding: 18px 20px; }
.segmented-control, .segmented-options { border-radius: 12px; }
.photo-upload { min-height: 52px; border: 1px dashed #b4c1ce; background: #f4f7f9; border-radius: 12px; }
.panel, .detail-card { border-radius: 18px; }
.command-more-panel, .overflow-menu-panel { border-radius: 16px; box-shadow: 0 16px 50px #14263526; padding: 8px; }
.command-more-panel button, .overflow-menu-panel button { min-height: 44px; border-radius: 8px; }
.field-brand { display: flex; align-items: center; }
.field-brand-logo { display: block; flex: none; width: 162px; height: 46px; overflow: hidden; border-radius: 7px; background: #fff; }
.field-brand-logo img { display: block; width: 152px; max-width: none; height: auto; margin: 5px; }
@media (min-width: 760px) {
  .app-layout { display: grid; grid-template-columns: 190px minmax(0,1fr); align-items: start; }
  .desktop-sidebar { display: flex; position: sticky; top: 0; height: 100dvh; min-height: 0; padding: 30px 14px 20px; flex-direction: column; background: #16232f; border: 0; gap: 22px; overflow-y: auto; }
  .sidebar-brand { padding: 0 5px 20px; }
  .sidebar-nav { display: grid; gap: 7px; }
  .sidebar-link { display: flex; width: 100%; align-items: center; justify-content: flex-start; gap: 12px; min-height: 50px; padding: 12px; border-radius: 12px; background: transparent; color: #bac8d2; font-size: 13px; }
  .sidebar-link.is-active { background: #304553; color: #fff; box-shadow: inset 3px 0 var(--brand); }
  .sidebar-link .nav-icon { width: 21px; height: 21px; }
  .sidebar-spacer { flex: 1; }
  .account-dock { display: grid; grid-template-columns: 32px minmax(0,1fr); align-items: center; gap: 8px; padding: 18px 0 0; border: 0; border-top: 1px solid #344452; border-radius: 0; background: transparent; box-shadow: none; }
  .account-avatar { background: #344b5b; color: #fff; }
  .account-copy { min-width: 0; width: 100%; padding: 0; background: transparent; text-align: left; }
  .account-copy strong, .account-copy span { display: block; line-height: 1.35; }
  .account-copy strong { color: #e4ecf1; font-size: 12px; }
  .account-copy span { color: #afbfcb; font-size: 10px; }
  .account-signout { grid-column: 1/-1; background: #213340; color: #c3d0da; border-color: #344452; font-size: 12px; }
  .touch-appbar, .mobile-bottom-nav { display: none; }
}
@media (min-width: 760px) and (max-width: 1050px) {
  .app-layout { grid-template-columns: 88px minmax(0,1fr); }
  .desktop-sidebar { padding: 24px 8px 16px; }
  .field-brand { justify-content: center; }
  .field-brand-logo { width: 38px; height: 46px; }
  .field-brand-logo img { width: 190px; margin: 0; transform: translate(8px, 1px); }
  .sidebar-brand { padding: 0 0 16px; }
  .sidebar-link { flex-direction: column; gap: 5px; padding: 10px 2px; font-size: 10px; }
  .account-dock { grid-template-columns: 1fr; justify-items: center; }
  .account-copy { text-align: center; }
  .account-copy strong { font-size: 10px; overflow-wrap: anywhere; }
  .account-signout { padding: 8px 3px; width: 100%; }
  .app-main-workspace { padding: 24px 22px 90px; }
  .capture-primary-grid { grid-template-columns: 1fr; }
  .field-welcome { padding: 26px; }
}
.login-shell.premium-login { display: grid; grid-template-columns: 1fr 1fr; width: min(1040px,calc(100% - 48px)); max-width: none; padding: 0; margin: 6vh auto; gap: 0; background: var(--panel); border-radius: 28px; overflow: hidden; border: 1px solid var(--line); box-shadow: 0 24px 80px #1b2d3d10; }
.premium-login .login-card { padding: 44px; background: var(--panel); }
.field-login-story { display: flex; flex-direction: column; padding: 44px; background: #182b39; color: #aebfcb; }
.field-login-story h2 { font-size: clamp(38px,5vw,62px); color: #fff; line-height: 1.06; margin: 58px 0 26px; font-weight: 600; }
.field-login-story p { font-size: 14px; line-height: 1.7; max-width: 280px; }
.field-login-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 60px; font-size: 12px; letter-spacing: .13em; color: #d9e4eb; }
.field-login-foot span { font-size: 9px; color: #91a5b4; }
.login-hero .brand-logo { width: 145px; margin-bottom: 40px; }
.login-hero h2 { font-size: 30px; line-height: 1.1; }
.login-hero .row-kicker { font-size: 9px; }
.login-reassurance, .login-help { font-size: 12px; line-height: 1.6; }
.login-card .primary-button { width: 100%; }
.login-no-pin-action[hidden], .login-version-notice[hidden] { display: none; }
.login-no-pin-action { margin-top: 4px; }
.login-no-pin-action .primary-button { width: 100%; }
.login-no-pin-action .meta-line { margin: 8px 0 0; }
#loginForm > .split-actions { margin-top: 16px; }
#loginForm > .split-actions button[type="submit"] { width: 100%; }
.login-version-notice { display: grid; gap: 8px; margin-top: 18px; padding: 16px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--panel-soft); }
.login-version-notice strong { color: var(--ink-strong); }
.login-version-notice span, .login-version-notice small { color: var(--muted); }
.login-version-notice .secondary-button { justify-self: start; }
@media (max-width: 759px) {
  .field-welcome { align-items: stretch; flex-direction: column; gap: 20px; padding: 24px; border-radius: 20px; }
  .field-welcome .primary-button { align-self: flex-start; }
  .app-main-workspace { padding: 18px 16px 130px; }
  .mobile-bottom-nav { background: #fffef9ed; backdrop-filter: blur(20px); border-top: 1px solid var(--line); }
  .mobile-bottom-nav .is-active { color: var(--brand); }
  .capture-form { padding: 12px; }
  .capture-block { padding: 16px; }
  .capture-header { padding: 20px; }
  .login-shell.premium-login { display: block; width: min(480px,calc(100% - 28px)); margin: 24px auto; }
  .field-login-story { padding: 28px; }
  .field-login-story h2 { font-size: 34px; margin: 18px 0 0; }
  .field-login-story p, .field-login-foot { display: none; }
  .premium-login .login-card { padding: 28px; }
  .login-hero .brand-logo { margin-bottom: 24px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }
@media print { .field-welcome { display: none; } }
/* Keep ongoing work within reach; avoid repeated dashboard actions. */
.projects-workspace { display: flex; flex-direction: column; gap: 20px; }
.projects-workspace > * { margin-top: 0; margin-bottom: 0; }
.field-welcome { padding: 24px 28px; }
.field-welcome h2 { font-size: clamp(26px,2.7vw,34px); }
.projects-command-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; }
.projects-command-row #newProjectButton { display: none; }
.projects-command-row .project-search-field { grid-column: 1; grid-row: 1; width: 100%; }
.projects-command-row .import-previous-survey { grid-column: 2; grid-row: 1; min-height: 48px; }
.project-search-field input { width: 100%; }
.continue-project-row { border-left: 3px solid var(--brand); }
@media (max-width: 600px) { .projects-command-row { grid-template-columns: 1fr; } .projects-command-row .import-previous-survey { grid-column: 1; grid-row: 2; } }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { color-scheme: dark; --paper: #101a24; --panel: #1c2935; --panel-raised: #243340; --panel-soft: #293b49; --panel-bar: #22323f; --ink: #dce5ed; --ink-strong: #f2f5f8; --muted: #adbdc9; --line: #354653; --line-strong: #627989; --brand: #ee5660; --brand-dark: #ce3442; }
}
:root[data-theme="dark"] { color-scheme: dark; --paper: #101a24; --panel: #1c2935; --panel-raised: #243340; --panel-soft: #293b49; --panel-bar: #22323f; --ink: #dce5ed; --ink-strong: #f2f5f8; --muted: #adbdc9; --line: #354653; --line-strong: #627989; --brand: #ee5660; --brand-dark: #ce3442; }
.project-status-tabs, .survey-workflow-nav, .current-area-control, .block-heading > span, .photo-upload { background: var(--panel-soft); }
.mobile-bottom-nav { background: var(--panel); }
.field-survey-nav { display: grid; gap: 5px; padding-top: 18px; border-top: 1px solid #344452; }
.field-nav-caption { font-size: 9px; letter-spacing: .13em; color: #9bafbd; padding: 0 12px; }
.field-nav-site { display: block; padding: 2px 12px 10px; font-size: 12px; color: #e0e8ee; overflow-wrap: anywhere; }
@media (min-width: 760px) and (max-width: 1050px) { .field-nav-caption, .field-nav-site { display: none; } .field-survey-nav { padding-top: 12px; } .desktop-sidebar { gap: 12px; } }
@media (max-height: 740px) and (min-width: 760px) { .desktop-sidebar { gap: 10px; padding-top: 18px; } .sidebar-brand { padding-bottom: 5px; } .sidebar-link { min-height: 44px; } .field-survey-nav { padding-top: 10px; } }
.field-appearance { display: grid; grid-template-columns: 1fr minmax(160px,240px); align-items: center; gap: 20px; padding: 22px; margin: 20px 0; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.field-appearance h3 { font-size: 20px; }
.account-avatar { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; }
@media (max-width: 600px) { .field-appearance { grid-template-columns: 1fr; } }
/* Older release surfaces used literal white; follow the selected theme. */
.settings-card, .admin-users-panel, .export-action-card, .purpose-choice, .supply-edit-label,
.supply-save-footer .supply-save-button, .review-summary-section, .export-outcome-section,
.export-download-label, .export-advanced-disclosure, .schedule-filter, .deactivation-choice span,
.queued-file-issue { background: var(--panel); }
