.topbar-actions { display: flex; gap: 10px; }
body.auth-locked > .app-shell { visibility: hidden; }
.auth-gate { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 24px; background: #f6f9f8; }
.auth-gate[hidden] { display: none; }
.auth-panel { width: min(100%, 430px); background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 32px; box-shadow: 0 18px 50px rgba(18,52,58,.10); }
.auth-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 34px; }
.auth-brand .brand-mark { flex: 0 0 auto; }
.auth-brand strong { display: block; color: var(--navy); font-size: 19px; line-height: 1.1; }
.auth-brand span { display: block; color: var(--muted); font-size: 10px; letter-spacing: 1px; margin-top: 4px; }
.auth-heading h1 { color: var(--navy); margin-top: 11px; }
.auth-heading p { color: var(--muted); font-size: 12px; line-height: 1.7; margin: 0; }
.auth-form { display: grid; gap: 16px; margin-top: 25px; }
.auth-options { display: flex; align-items: center; gap: 18px; margin-top: -5px; }
.auth-options[hidden] { display: none; }
.auth-options label { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 11px; cursor: pointer; }
.auth-options input { width: 14px; height: 14px; accent-color: var(--teal); }
.auth-submit { width: 100%; height: 40px; margin-top: 3px; }
.auth-error { min-height: 17px; color: var(--danger); font-size: 11px; margin: 0; }
.auth-switch { border: 0; background: transparent; color: var(--teal2); font-size: 11px; padding: 0; cursor: pointer; }
.auth-security-note { display: block; color: #a1abad; font-size: 9px; line-height: 1.6; margin-top: 23px; }
.logout-button { width: 28px; height: 28px; border: 0; border-radius: 5px; background: transparent; color: #6f908c; display: grid; place-items: center; padding: 0; }
.logout-button:hover { background: rgba(255,255,255,.1); color: #fff; }
.logout-button svg { width: 15px; }
.button-chevron { width: 12px !important; }
.export-control { position: relative; }
.export-menu { position: absolute; right: 0; top: 42px; z-index: 30; width: 205px; padding: 5px; background: #fff; border: 1px solid var(--line2); border-radius: 6px; box-shadow: 0 14px 30px rgba(18, 52, 58, .16); }
.export-menu[hidden] { display: none; }
.export-menu button { width: 100%; border: 0; border-radius: 4px; background: transparent; color: var(--ink); display: grid; grid-template-columns: 22px 1fr; gap: 8px; align-items: center; text-align: left; padding: 9px; }
.export-menu button:hover { background: var(--surface2); }
.export-menu button > svg { width: 17px; color: var(--teal2); }
.export-menu strong, .export-menu small { display: block; }
.export-menu strong { font-size: 11px; }
.export-menu small { font-size: 9px; color: var(--muted); margin-top: 3px; }
.cure-condition-grid { margin-top: 17px; }
.placement-field { border: 0; padding: 0; margin: 0; min-width: 0; }
.placement-field legend { padding: 0; color: #65777b; font-size: 10px; font-weight: 600; margin-bottom: 7px; }
.segmented-options { height: 37px; display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line2); border-radius: 5px; overflow: hidden; }
.segmented-options label { cursor: pointer; min-width: 0; }
.segmented-options input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.segmented-options span { height: 100%; display: flex; align-items: center; justify-content: center; gap: 6px; color: #738387; font-size: 10px; border-right: 1px solid var(--line2); }
.segmented-options label:last-child span { border-right: 0; }
.segmented-options input:checked + span { background: #eaf7f4; color: var(--teal2); font-weight: 700; box-shadow: inset 0 0 0 1px var(--teal); }
.segmented-options svg { width: 13px; }
.comparison-components { display: block !important; margin: 4px 0 0 !important; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; color: #89989a !important; }
.photo-item { position: relative; flex: 0 0 auto; }
.photo-view-button { display: block; padding: 0; border: 0; border-radius: 4px; background: transparent; cursor: zoom-in; }
.photo-view-button:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
.photo-item .photo-thumb { display: block; }
.remove-photo { position: absolute; top: -5px; right: -5px; width: 18px; height: 18px; display: grid; place-items: center; padding: 0; border: 1px solid #fff; border-radius: 50%; background: var(--navy); color: #fff; }
.remove-photo svg { width: 11px; }
.image-lightbox { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 28px; background: rgba(8, 26, 30, .86); }
.image-lightbox[hidden] { display: none; }
.lightbox-close { position: fixed; top: 18px; right: 18px; z-index: 2; background: rgba(255,255,255,.14); color: #fff; }
.lightbox-close:hover { background: rgba(255,255,255,.24); color: #fff; }
.lightbox-figure { max-width: min(92vw, 1100px); max-height: 90vh; margin: 0; display: grid; justify-items: center; gap: 10px; }
.lightbox-figure img { display: block; max-width: 92vw; max-height: 82vh; width: auto; height: auto; object-fit: contain; border-radius: 4px; box-shadow: 0 20px 60px rgba(0,0,0,.35); }
.lightbox-figure figcaption { max-width: 90vw; overflow-wrap: anywhere; color: #eaf7f4; font-size: 12px; text-align: center; }
body.lightbox-open { overflow: hidden; }
.admin-nav { text-decoration: none; }
.admin-nav[hidden] { display: none; }
@media (max-width: 760px) {
  .auth-gate { align-items: start; overflow-y: auto; padding: 20px 16px; }
  .auth-panel { width: 100%; margin: 22px 0; padding: 24px 20px; box-shadow: none; }
  .auth-brand { margin-bottom: 26px; }
  .auth-heading h1 { font-size: 25px; }
  .auth-options { justify-content: space-between; gap: 8px; }
  .topbar-actions .export-control { width: 100%; }
  .export-menu { width: 100%; top: 39px; }
  .cure-condition-grid { grid-template-columns: 1fr; }
  .app-shell { background: #f6f9f8; }
  .sidebar { position: sticky !important; top: 0; z-index: 20; padding: 11px 14px 9px !important; background: var(--navy); box-shadow: 0 2px 10px rgba(18,52,58,.18); }
  .brand { padding: 0 2px 10px !important; }
  .brand-mark { width: 29px; height: 29px; border-radius: 7px; }
  .brand strong { font-size: 15px; }
  .brand span { font-size: 9px; margin-top: 2px; }
  .main-nav { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: 5px; }
  .nav-item { min-width: 0; height: 36px !important; padding: 0 5px !important; gap: 4px !important; justify-content: center; font-size: 10px !important; }
  .nav-item svg { width: 14px; }
  .nav-item em { margin: 0 0 0 2px !important; position: static !important; padding: 1px 4px; font-size: 8px; }
  .admin-nav { grid-column: auto; }
  .main-content { background: #f6f9f8; }
  .topbar { position: sticky; top: 91px; z-index: 15; min-height: 50px !important; padding: 8px 14px !important; background: rgba(255,255,255,.97); }
  .breadcrumb { width: 100%; justify-content: space-between; font-size: 11px !important; }
  .breadcrumb > span, .breadcrumb svg { display: none; }
  .topbar-actions { display: grid !important; grid-template-columns: 1fr 1fr 1fr; width: 100%; }
  .topbar-actions .primary-button, .topbar-actions .secondary-button { min-width: 0; height: 34px; padding: 0 5px !important; font-size: 10px !important; }
  .page-heading { padding: 22px 0 13px !important; }
  .page-heading h1 { font-size: 22px !important; }
  .page-heading p { font-size: 11px !important; line-height: 1.6; }
  .heading-meta { display: flex; justify-content: space-between; padding-top: 10px; }
  .content-section { padding: 17px 13px !important; border-radius: 6px; box-shadow: none; }
  .section-heading { gap: 9px; }
  .section-number { min-width: 21px; }
  .section-header h2 { font-size: 15px; }
  .section-header p { font-size: 10px; }
  .data-table { min-width: 620px; }
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .color-layout { display: grid !important; gap: 12px; }
  .lab-panel, .photo-panel { padding: 14px; }
  .image-lightbox { padding: 18px 12px; }
  .lightbox-close { top: 10px; right: 10px; }
  .lightbox-figure img { max-width: 96vw; max-height: 78vh; }
  .lab-surfaces { display: grid !important; gap: 10px; }
  .lab-surface { padding: 11px; }
  .optical-result-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 7px; }
  .optical-result { min-height: 82px; padding: 10px 8px; }
  .optical-result strong { font-size: 18px; }
  .optical-result span, .optical-result small { overflow-wrap: anywhere; }
  .optical-thickness-fields { gap: 10px; margin-top: 12px; }
  .comparison-panel { padding: 14px; }
  .comparison-header { gap: 12px; }
  .comparison-result { padding: 12px; }
  .comparison-score b { font-size: 17px; }
  .settings-card { padding: 15px !important; }
  .settings-card-header { gap: 8px; }
  .add-inline { grid-template-columns: 1fr !important; }
  .bottom-actions { position: sticky; bottom: 0; z-index: 14; padding: 10px 0 18px; background: linear-gradient(to top, #f6f9f8 82%, transparent); }
}
.dashboard-main-grid{grid-template-columns:1.45fr .85fr;margin-bottom:14px}
.dashboard-vita-grid{grid-template-columns:1.35fr .85fr;margin-bottom:14px}
.dashboard-metric-field{width:212px;min-width:0}
.dashboard-metric-field select{height:34px;font-size:11px}
#dashboardChartSlot{min-height:224px}
.mechanical-chart-wrap{padding:6px 2px 0}
.mechanical-chart{display:flex;align-items:flex-end;gap:13px;min-height:196px;overflow-x:auto;padding:4px 2px 0}
.mech-chart-column{flex:1 0 74px;min-width:74px;display:grid;grid-template-rows:18px 148px 30px;gap:5px;text-align:center}
.mech-chart-value{font-size:11px;font-weight:700;color:var(--teal2);white-space:nowrap}
.mech-chart-track{position:relative;display:flex;align-items:flex-end;height:148px;border-bottom:1px solid var(--line2)}
.mech-chart-bar{width:34px;margin:0 auto;min-height:4px;border:0;border-radius:4px 4px 0 0;box-shadow:0 5px 12px rgba(18,52,58,.14);cursor:pointer;transition:filter .15s}
.mech-chart-bar:hover{filter:brightness(.92)}
.mech-chart-label{border:0;background:transparent;padding:0;font-size:9px;color:var(--muted);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mech-chart-label:hover{color:var(--teal2);text-decoration:underline}
.mechanical-chart-note{margin-top:12px;color:var(--muted);font-size:9px;line-height:1.5}
.dashboard-recent-row small.dashboard-time{color:#a4afb0;font-size:8px;margin-top:2px}
.dashboard-vita-panel .dashboard-panel-heading{margin-bottom:12px}
.vita-shade-image{display:block;width:100%;max-height:340px;object-fit:contain;border:1px solid var(--line);border-radius:6px;background:#fff;box-shadow:var(--shadow)}
.dashboard-insight-list{display:grid;gap:9px}
.dashboard-insight-list>div{padding:11px 12px;border:1px solid var(--line2);border-radius:5px;background:#fbfdfc}
.dashboard-insight-list span,.dashboard-insight-list small{display:block;color:var(--muted);font-size:9px}
.dashboard-insight-list strong{display:block;margin:5px 0;color:var(--navy);font-size:19px;overflow-wrap:anywhere}
.dashboard-insight-list strong.dashboard-time-strong{font-size:13px;line-height:1.4}
@media(max-width:980px){.dashboard-main-grid,.dashboard-vita-grid{grid-template-columns:1fr}}
@media(max-width:760px){.dashboard-metric-field{width:100%}.dashboard-metric-field select{font-size:12px}.mechanical-chart{min-height:180px}.mech-chart-column{grid-template-rows:18px 136px 34px}.mech-chart-track{height:136px}.mech-chart-label{white-space:normal;line-height:1.35}}
.dashboard-heading-actions{display:flex;gap:9px;align-items:center}
.dashboard-search-bar{max-width:1218px;margin:0 auto 14px;display:flex;align-items:center;gap:10px;padding:11px 14px;background:#fff;border:1px solid var(--line2);border-radius:8px;box-shadow:var(--shadow)}
.dashboard-search-bar>svg{width:17px;color:var(--teal2);flex:0 0 auto}
.dashboard-search-bar input{flex:1;min-width:0;border:0;background:transparent;box-shadow:none;height:34px;font-size:13px}
.dashboard-search-bar input:focus{box-shadow:none}
.dashboard-search-clear{width:26px;height:26px;display:grid;place-items:center;border:0;border-radius:5px;background:transparent;color:#9aa7a8}
.dashboard-search-clear:hover{background:var(--surface2);color:var(--teal2)}
.dashboard-search-clear svg{width:13px}
.dashboard-search-count{color:var(--muted);font-size:10px;white-space:nowrap}
.dashboard-library-panel{margin-bottom:14px}
.dashboard-recipe-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-height:430px;overflow-y:auto;padding:2px 4px 2px 0}
.dashboard-recipe-card{position:relative;border:1px solid var(--line2);border-radius:6px;background:#fbfdfc;padding:13px;cursor:pointer;transition:border-color .15s, box-shadow .15s}
.dashboard-recipe-card:hover{border-color:var(--teal);box-shadow:0 8px 20px rgba(18,52,58,.08)}
.dashboard-recipe-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:9px}
.dashboard-recipe-card-top h3{margin:0;color:var(--navy);font-size:12px;line-height:1.4;overflow-wrap:anywhere}
.dashboard-recipe-version{display:inline-block;margin-top:4px;padding:3px 7px;border-radius:4px;background:var(--surface2);color:var(--teal2);font-size:9px;font-weight:700}
.dashboard-state-tag{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:21px;padding:3px 8px;border-radius:11px;font-size:9px;font-weight:700;white-space:nowrap}
.dashboard-state-tag.draft{background:#eef2f1;color:#718083}
.dashboard-state-tag.testing{background:#e6f4f1;color:#237c76}
.dashboard-state-tag.needs-optimization{background:#fff3e5;color:#b46e30}
.dashboard-state-tag.failed{background:#fff0ef;color:#c05c56}
.dashboard-state-tag.finalized{background:#edf4ff;color:#3d6ea5}
.dashboard-recipe-card p{margin:9px 0 11px;color:var(--muted);font-size:9px;line-height:1.5}
.dashboard-recipe-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid #eef2f1;padding-top:10px}
.dashboard-recipe-actions .secondary-button{height:29px;padding:0 10px;font-size:10px}
.dashboard-recipe-actions .text-button{font-size:10px}
.dashboard-review-panel .dashboard-review-list{display:grid;gap:8px}
.dashboard-review-row{padding:11px 12px;border:1px solid var(--line2);border-radius:5px;background:#fbfdfc}
.dashboard-review-row>div{display:flex;align-items:center;justify-content:space-between;gap:8px}
.dashboard-review-row strong{color:var(--navy);font-size:10px;overflow-wrap:anywhere}
.dashboard-review-row p{margin:7px 0 0;color:var(--muted);font-size:9px;line-height:1.55}
.dashboard-reference-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dashboard-reference-item{padding:10px 11px;border:1px solid var(--line2);border-radius:5px;background:#fbfdfc;min-width:0}
.dashboard-reference-item.wide{grid-column:1/-1}
.dashboard-reference-item strong{display:block;color:var(--navy);font-size:10px;margin-bottom:5px}
.dashboard-reference-item code{display:block;color:var(--teal2);font-size:9px;line-height:1.5;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}
.version-state-grid{margin-top:17px}
.next-step-field{margin-top:14px}
.app-modal{position:fixed;inset:0;z-index:140;display:grid;place-items:center;padding:24px}
.app-modal[hidden]{display:none}
.modal-backdrop{position:absolute;inset:0;background:rgba(8,26,30,.55)}
.modal-card{position:relative;z-index:1;width:min(100%,560px);max-height:88vh;overflow-y:auto;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 24px 70px rgba(8,26,30,.28)}
.modal-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:20px 22px 14px;border-bottom:1px solid var(--line)}
.modal-heading h2{margin:0;font-size:17px;color:var(--navy)}
.modal-heading p{margin:6px 0 0;color:var(--muted);font-size:10px;line-height:1.5}
.modal-close{color:var(--muted)}
.modal-close:hover{background:var(--surface2);color:var(--navy)}
.modal-body{display:grid;gap:13px;padding:18px 22px}
.modal-actions{display:flex;justify-content:flex-end;gap:9px;padding:14px 22px 20px;border-top:1px solid var(--line)}
.version-history-list{display:grid;gap:9px;padding:16px 22px}
.version-history-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--line2);border-radius:6px;background:#fbfdfc}
.version-history-row strong{display:block;color:var(--navy);font-size:12px}
.version-history-row .dashboard-state-tag{margin-top:5px}
.version-history-row p{margin:8px 0;color:var(--muted);font-size:10px;line-height:1.55}
.version-history-row small{color:#a4afb0;font-size:9px}
.version-history-row .secondary-button{height:31px;padding:0 11px;font-size:10px}
@media(max-width:980px){.dashboard-recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.dashboard-heading-actions{width:100%}.dashboard-heading-actions .primary-button,.dashboard-heading-actions .secondary-button{flex:1}.dashboard-search-bar{flex-wrap:wrap}.dashboard-search-count{width:100%;text-align:right}.dashboard-recipe-grid{grid-template-columns:1fr;max-height:520px}.dashboard-reference-list{grid-template-columns:1fr}.app-modal{padding:14px}.modal-card{width:100%}.modal-body,.version-history-list{padding:15px 16px}.version-history-row{display:grid}}