/* Product shell. Loaded after the shared dark tokens and original layout CSS. */
body { background: var(--bg); font-size: 17px; }
.site-header { height: 92px; }
.brand { font-size: 1.4rem; font-weight: 500; letter-spacing: .015em; gap: 14px; }
.brand-mark { width: 27px; height: 21px; }
.brand-mark span { height: 2px; background: var(--text-1); opacity: .85; }
.nav-mono { font-size: .75rem; letter-spacing: .13em; }
.nav-text { font-size: .97rem; }
.account-email { font-size: .87rem; }
.avatar { font-size: .85rem; }
.pill { font-size: 1rem; letter-spacing: .005em; border: 1px solid var(--border); }
.pill-small { font-size: .93rem; min-height: 40px; }
.pill-primary { min-height: 54px; padding: 0 30px; }
.pill-primary.s-graphite {
  background: var(--accent); color: var(--bg); border-color: var(--accent);
  box-shadow: inset 0 1px rgba(255,255,255,.25), 0 5px 22px rgba(94,234,212,.07);
}
.pill-primary.s-graphite:hover { background: color-mix(in srgb, var(--accent) 86%, white); }
.pill::before { opacity: .15; }
.site-footer { font-size: .86rem; }
.site-footer>div { font-size: .83rem; }
.footer-separator { color: var(--text-3); }
.s-eyebrow, .mono, .input-label { letter-spacing: .12em; }
.landing-hero { padding-top: 72px; padding-bottom: 90px; min-height: calc(100vh - 166px); gap: 5%; }
.hero-copy .s-eyebrow { font-size: .79rem; margin-bottom: 30px; color: var(--accent); }
.hero-copy .s-display { font-size: clamp(4rem, 7.4vw, 7rem); line-height: 1.02; letter-spacing: -.048em; font-weight: 400; }
.hero-copy .s-display .s-line:last-child { color: var(--text-1); }
.hero-description { font-size: 1.3rem; line-height: 1.55; letter-spacing: 0; margin-top: 25px; }
.hero-actions { margin-top: 34px; }
.access-note { font-size: .89rem; color: var(--text-2); margin-top: 21px; }
.instrument-wrap { max-width: 480px; }
.instrument { padding: 2px; border-color: color-mix(in srgb, var(--text-3) 65%, var(--border)); box-shadow: var(--shadow-lg), 0 0 95px rgba(111,147,196,.07); }
.instrument-face { background: linear-gradient(135deg, #233243, #151F2B 45%, #0C131D); box-shadow: inset 0 1px 0 rgba(232,239,247,.17), inset 0 -1px 0 rgba(0,0,0,.6); }
.instrument-top .mono { font-size: .68rem; letter-spacing: .12em; }
.instrument-tag { color: var(--accent); background: var(--accent-bg); border-color: var(--accent-bd); font-size: .58rem; box-shadow: none; }
.staff-lines { opacity: 1; }
.staff-lines i { background: linear-gradient(90deg, transparent, var(--border) 12%, var(--border) 85%, transparent); }
.composition-bar { border-color: #728599; background: linear-gradient(174deg, #788FA3 1%, #AEBECD 7%, #526779 32%, #293B4E 63%, #667B90 98%); box-shadow: inset 0 1px 1px rgba(232,239,247,.6), inset 0 -2px 2px rgba(0,0,0,.5), 0 9px 20px rgba(0,0,0,.32); }
.bar-node { background: linear-gradient(135deg, #233443, #0A111A 65%); border-color: #071017; box-shadow: inset 0 1px 1px rgba(232,239,247,.25), 0 2px 4px rgba(0,0,0,.6); }
.node-three { background: linear-gradient(130deg,#B3C3D2,#6E849A 35%,#243D50); border-color: #344B60; }
.node-four::after { background: var(--accent); box-shadow: 0 0 12px rgba(94,234,212,.7); }
.bar-spine { background: #AABBCE; opacity: .35; }
.instrument-axis { background: linear-gradient(transparent,var(--border),transparent); }
.instrument-play { color: var(--accent); border-color: #334759; }
.instrument-id { font-size: .75rem; }
.instrument-caption { font-size: .87rem; }
.calibration i { background: var(--text-2); }
.object-caption { font-size: .62rem; color: var(--text-2); }
.access-layout { max-width: 550px; padding-top: 37px; }
.back-link { font-size: .96rem; margin-bottom: 24px; }
.access-heading .s-eyebrow { color: var(--accent); font-size: .74rem; }
.access-heading h1 { font-size: clamp(2.8rem, 4.7vw, 4rem); letter-spacing: -.035em; font-weight: 400; line-height: 1.02; margin-top: 20px; }
.access-heading>p:last-child { font-size: 1.07rem; margin-top: 14px; }
.access-card { background: var(--surface-sheen); border: 1px solid var(--border); padding: 29px 36px; margin-top: 29px; }
.access-icon { background: var(--surface-2); color: var(--text-2); }
.access-card h2 { font-size: 1.7rem; font-weight: 500; letter-spacing: -.025em; }
.form-intro { font-size: 1rem; margin-bottom: 22px; line-height: 1.55; }
.input-label { font-size: .73rem; }
.text-input { color: var(--text-1); background: var(--bg); border-color: var(--border); font-size: 1.05rem; min-height: 51px; box-shadow: inset 0 2px 3px rgba(0,0,0,.14); }
.text-input:focus { border-color: var(--accent); outline: 2px solid var(--accent-bg); }
.checkbox-label { font-size: .91rem; line-height: 1.5; gap: 12px; margin: 20px 0 24px; }
.checkbox-label input { accent-color: var(--accent); }
.form-fine { font-size: .86rem; line-height: 1.65; }
.form-message { font-size: .97rem; color: var(--warn); }
.code-input { font-size: 1.8rem; letter-spacing: .24em; }
.text-button { font-size: .9rem; }
.local-note { font-size: .83rem; }
.local-note .mono { font-size: .69rem; color: var(--accent); }
.local-note code { font-size: .84rem; }
.library-wrap { max-width: 1240px; padding-top: 57px; }
.library-head .s-eyebrow { color: var(--accent); font-size: .75rem; }
.library-head h1 { font-size: clamp(3.2rem, 5.8vw, 5rem); font-weight: 400; letter-spacing: -.038em; }
.library-head>p:not(.s-eyebrow) { font-size: 1.12rem; }
.status-pill { background: var(--surface-1); font-size: .68rem; }
.library-section-label .mono { font-size: .73rem; }
.run-card { background: var(--surface-sheen); border: 1px solid var(--border); }
.run-card:hover { border-color: var(--text-3); box-shadow: var(--shadow-md); }
.run-card-top .mono { font-size: .65rem; }
.run-card-body { padding-top: 22px; }
.run-card-body h2 { font-size: 2.5rem; line-height: 1.1; font-weight: 400; letter-spacing: -.025em; }
.accession { font-size: .73rem; }
.card-description { font-size: 1rem; }
.card-link { font-size: 1rem; color: var(--accent); }
.concert-art { border-color: var(--border); background: radial-gradient(ellipse at 50% 45%, rgba(111,147,196,.12), transparent 75%), var(--bg); }
.concert-art-lines { opacity: .7; }
.concert-art-lines i { background: linear-gradient(90deg,transparent,var(--neutral-bar),transparent); }
.concert-art-bars { filter: drop-shadow(0 10px 10px rgba(0,0,0,.38)); }
.concert-art-bars i { border-color: #657B8E; background: linear-gradient(164deg,#91A6B9 2%,#BAC7D3 9%,#52677A 37%,#293D50 63%,#667E94 94%); box-shadow: inset 0 1px 0 rgba(232,239,247,.5); }
.concert-art>span { color: var(--text-2); font-size: .7rem; }
.concert-movement-tags { justify-content: center; }
.concert-movement-tags span { color: var(--text-2); border-color: var(--border); background: var(--surface-2); font-size: .79rem; }
.concert-empty { border-color: var(--border); background: var(--surface-sheen); }
.concert-empty h2 { color: var(--text-1); font-size: 2.3rem; letter-spacing: -.02em; }
.owner-import-tip { background: var(--accent-bg); border: 1px solid var(--accent-bd); color: var(--text-1); font-size: 1rem; }
.cached-readouts summary { border-color: var(--border); color: var(--text-2); font-size: 1.08rem; }
.cached-readouts summary span { font-size: .74rem; }
.library-disclaimer { font-size: .9rem; }
.molecule-plate { background: radial-gradient(ellipse at center,rgba(111,147,196,.055),transparent 70%); }
/* Cached snapshots, account, privacy and owner screens share the same scheme. */
.workspace-breadcrumb { font-size: .9rem; }
.workspace-breadcrumb>.mono { font-size: .68rem; }
.workspace-heading .s-eyebrow { font-size: .7rem; }
.workspace-heading p:not(.s-eyebrow) { font-size: .94rem; }
.workspace-heading>.pill { font-size: .93rem; }
.movement { font-size: .9rem; }
.movement.active { background: var(--accent-bg); color: var(--accent); box-shadow: none; }
.movement-number { font-size: .85rem; }
.summary-metrics .mono { font-size: .69rem; }
.small-status { font-size: .82rem; }
.panel { border: 1px solid var(--border); background: var(--surface-sheen); }
.panel-heading h2 { font-size: 1.16rem; }
.panel-heading .mono { font-size: .68rem; }
.candidate-columns { font-size: .68rem; }
.candidate-row { font-size: .84rem; }
.candidate-row[aria-pressed=true] { background: var(--accent-bg); }
.search-wrap input { font-size: .95rem; }
.sort-label { font-size: .7rem; }
.sort-label select { font-size: .86rem; }
.chart-caption { font-size: .8rem; }
.chart-caption span:last-child { font-size: .72rem; }
.property-grid dt { font-size: .7rem; }
.property-grid dd { font-size: 1.2rem; }
.smiles-block { background: var(--bg); border-color: var(--border); color: var(--text-2); }
.pose-unavailable { font-size: .82rem; background: var(--surface-2); }
.text-page, .account-page, .admin-page { color: var(--text-1); }
.text-page p, .account-page p { font-size: 1.05rem; }
.text-page h1, .account-page h1, .admin-page h1 { font-weight: 400; letter-spacing: -.035em; }
.text-page h2 { font-size: 1.45rem; }
.notice { color: var(--warn); background: var(--warn-bg); border: 1px solid var(--warn-bd); }
.account-panel { background: var(--surface-sheen); border-color: var(--border); }
.account-panel .mono { font-size: .76rem; }
.danger-button { color: var(--bad); border-color: var(--bad-bd); background: var(--bad-bg); }
.admin-table th, .admin-table td { font-size: .9rem; }
.admin-table th { color: var(--text-2); background: var(--surface-2); }
.admin-table-wrap { background: var(--surface-1); border-color: var(--border); }
.admin-table tr:hover { background: var(--surface-2); }
.toast { background: var(--surface-2); border: 1px solid var(--border); color: var(--text-1); font-size: 1rem; }
@media (max-width: 1050px) {
  .hero-copy .s-display { font-size: clamp(4rem,9vw,6rem); }
  .landing-hero { padding-top: 64px; padding-bottom: 65px; }
  .instrument-wrap { width: 440px; }
}
@media (max-width: 760px) {
  .site-header { height: 78px; }
  .brand { font-size: 1.2rem; }
  .site-header .nav-text { font-size: .88rem; }
  .account-email { display: none; }
  .site-footer { font-size: .8rem; }
  .hero-copy .s-eyebrow { font-size: .68rem; }
  .hero-copy .s-display { font-size: clamp(3.7rem,12.7vw,5rem); }
  .hero-description { font-size: 1.15rem; }
  .access-note { font-size: .84rem; }
  .object-caption { font-size: .6rem; }
  .access-heading h1 { font-size: 3.2rem; }
  .access-card { padding: 27px 25px; }
  .access-card .pill { font-size: 1rem; }
  .library-head .s-eyebrow { font-size: .69rem; }
  .library-head>p:not(.s-eyebrow) { font-size: 1rem; }
  .library-section-label .mono { font-size: .65rem; }
  .run-card-body h2 { font-size: 2.2rem; }
  .cached-readouts summary span { float: none; display: block; margin-top: 6px; }
  .concert-empty { padding: 28px 24px; }
  .candidate-row { font-size: .76rem; }
  .candidate-columns { font-size: .61rem; }
  .property-grid dt { font-size: .7rem; }
  .workspace-heading>.pill { font-size: .87rem; }
  .movement { font-size: .73rem; padding: 10px 8px; }
  .movement-number { font-size: .7rem; }
  .unavailable { font-size: .59rem; }
  .summary-metrics .mono { font-size: .64rem; }
  .instrument-top .mono { font-size: .6rem; }
  .instrument-tag { font-size: .53rem; }
  .instrument-caption { font-size: .77rem; }
  .instrument-id { font-size: .65rem; }
  .form-intro { font-size: 1rem; }
  .checkbox-label { font-size: .88rem; }
  .text-page p { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
@media (max-width: 760px) {
  .instrument-wrap { width: 330px; max-width: 94%; }
}
