/* Shared Palinoia theme. Printed chart colors and source images are not themed. */
:root {
  color-scheme: light;
  --font-body: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --text-label: .75rem;
  --text-small: .875rem;
  --text-body: 1rem;
  --text-lead: 1.125rem;
  --text-heading: 1.25rem;
  --text-display-sm: 1.5rem;
  --text-display: 1.75rem;
  --text-title-sm: 2rem;
  --text-title: 2.25rem;
  --text-timer-sm: 2.5rem;
  --text-timer: 3rem;
  --space-half: 0.125rem;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-7: 1.75rem;
  --space-8: 2rem;
  --space-9: 2.25rem;
  --space-10: 2.5rem;
  --space-11: 2.75rem;
  --space-12: 3rem;
  --space-13: 3.25rem;
  --space-18: 4.5rem;
  --space-25: 6.25rem;
  --target-min: 2.75rem;
  --mobile-nav-height: 5rem;
  --motion-fast: 150ms;
  --motion-normal: 220ms;
  --motion-slow: 320ms;
  --ease-standard: cubic-bezier(.2, 0, .2, 1);
  --amber: var(--attention-bg);
  --lav: var(--waiting-bg);
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--bg);
  font-synthesis: none;
}

:root[data-theme="dark"] { color-scheme: dark; }

*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:4px}a{color:var(--accent)}button{border:0}button,.btn{transition:background-color var(--motion-fast) var(--ease-standard),border-color var(--motion-fast) var(--ease-standard),transform var(--motion-fast) var(--ease-standard)}button:hover:not(:disabled):not(.color-option){filter:brightness(.97)}button:active:not(:disabled){transform:translateY(1px)}.shell{display:grid;grid-template-columns:232px 1fr;min-height:100vh}.sidebar{background:var(--paper);border-right:1px solid var(--line);padding:var(--space-9) var(--space-6);position:fixed;width:232px;inset:0 auto 0 0;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:var(--space-3);font-weight:800;letter-spacing:2px;font-size:var(--text-heading);text-decoration:none;color:var(--ink)}.brand .brand-lockup{width:100%;max-width:240px}.brand-lockup{display:block;line-height:0}.brand-lockup img{display:block;width:100%;height:auto;border-radius:0}.mobile-brand{display:none;width:175px;flex:0 1 auto}.topbar .mobile-brand{min-width:0;max-width:48%}.brand-sub{font-size:var(--text-label);letter-spacing:2px;color:var(--muted);margin:var(--space-3) 0 var(--space-10) 0}.nav{display:grid;gap:var(--space-2)}.nav button{text-align:left;background:transparent;color:var(--muted);padding:var(--space-4) var(--space-4);border-radius:9px;font-size:var(--text-small);display:flex;gap:var(--space-3);align-items:center}.nav button.active{background:var(--mint);color:var(--ink);font-weight:650}.nav svg{width:19px;height:19px}.side-bottom{margin-top:auto;font-size:var(--text-small);color:var(--muted);line-height:1.7;padding:var(--space-6) var(--space-2) 0}.side-bottom .dot{display:inline-block;width:7px;height:7px;background:var(--progress-fill);border-radius:50%;margin-right:var(--space-1)}.main{grid-column:2;padding:0 var(--space-13) var(--space-13);max-width:1500px;width:100%;margin:auto;align-self:start}.topbar{height:95px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);font-size:var(--text-small);color:var(--muted)}.topbar-right{display:flex;gap:var(--space-4);align-items:center}.avatar{height:33px;width:33px;display:grid;place-items:center;border-radius:50%;background:var(--surface-subtle);color:var(--ink);font-weight:650}.demo-pill,.pill{display:inline-flex;align-items:center;border:1px solid var(--line);padding:var(--space-1) var(--space-2);border-radius:5px;font-size:var(--text-label);font-weight:700;letter-spacing:1px;text-transform:uppercase;white-space:nowrap}.demo-pill{background:var(--attention-bg);color:var(--attention-ink);border-color:var(--attention-line)}.page-head{display:flex;justify-content:space-between;gap:var(--space-6);align-items:end;margin:var(--space-10) 0 var(--space-7)}.eyebrow{font-size:var(--text-label);font-weight:650;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:var(--space-3)}h1{font-size:var(--text-title);letter-spacing:-1.2px;margin:0 0 var(--space-3);font-weight:550}h2{font-size:var(--text-heading);letter-spacing:-.4px;font-weight:600;margin:0 0 var(--space-3)}h3{font-size:var(--text-body);margin:0 0 var(--space-2)}p{line-height:1.7;margin:0 0 var(--space-3)}.muted{color:var(--muted)}.small{font-size:var(--text-small)}.primary,.secondary,.quiet{padding:var(--space-3) var(--space-5);border-radius:7px;font-size:var(--text-small);display:inline-flex;justify-content:center;align-items:center;gap:var(--space-2);font-weight:600;text-decoration:none}.primary{background:var(--action-bg);color:var(--action-ink)}.secondary{background:var(--paper);border:1px solid var(--control-line);color:var(--ink)}.quiet{background:transparent;color:var(--accent);padding:var(--space-3) var(--space-1)}.hero{border:1px solid var(--line-tint);border-radius:15px;background:var(--surface-summary);display:grid;grid-template-columns:1fr 235px;min-height:200px;overflow:hidden;margin-bottom:var(--space-7)}.hero-copy{padding:var(--space-8) var(--space-9)}.hero h2{font-size:var(--text-display);max-width:440px;line-height:1.25;font-weight:500}.hero p{font-size:var(--text-small);max-width:450px;color:var(--muted)}.hero-art{position:relative;display:grid;place-items:center;background:radial-gradient(circle at center,var(--mint) 0 41%,transparent 42%)}.strip{display:flex;gap:var(--space-2);align-items:center;background:var(--atelier-strip-paper);box-shadow:0 12px 30px var(--atelier-shadow-color);border:1px solid var(--line);height:36px;padding:var(--space-2) var(--space-13) var(--space-2) var(--space-3);width:205px;transform:rotate(-38deg);border-radius:5px}.strip i{width:18px;height:18px;flex-shrink:0;background:#dec795}.strip i:nth-child(2){background:#aabc8c}.strip i:nth-child(3){background:#92b9ad}.strip i:nth-child(4){background:#bda1bc}.strip i:nth-child(5){background:#d0a183}.hero-art small{position:absolute;bottom:24px;font-size:var(--text-label);letter-spacing:1.4px;color:var(--muted)}.section-title{display:flex;align-items:center;justify-content:space-between;margin:var(--space-7) 0 var(--space-4)}.section-title h2{font-size:var(--text-lead);margin:0}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}.test-card,.panel{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:var(--space-6)}.test-card{display:grid;grid-template-columns:1fr 64px;text-align:left;color:var(--ink);min-height:195px;position:relative}.test-card h2{font-size:var(--text-display-sm);margin:var(--space-5) 0 var(--space-2)}.test-card p{font-size:var(--text-small);color:var(--muted);max-width:280px}.test-card .card-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:13px;background:var(--mint);grid-column:2;grid-row:1/4;align-self:center}.test-card .card-icon svg{width:28px;height:28px}.test-card.urine .card-icon{background:var(--lav);color:var(--waiting-ink)}.test-card .arrow{position:absolute;right:29px;bottom:22px;font-size:var(--text-display-sm);font-weight:300}.inline{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:11px;background:var(--paper)}table{width:100%;border-collapse:collapse;font-size:var(--text-small);text-align:left}th{background:var(--surface-subtle);color:var(--muted);font-size:var(--text-label);text-transform:uppercase;letter-spacing:1px;padding:var(--space-4) var(--space-5);font-weight:600}td{padding:var(--space-5) var(--space-5);border-top:1px solid var(--line)}td .muted{font-size:var(--text-label);margin-top:var(--space-1)}.record-link{padding:0;background:transparent;color:var(--ink);font-weight:650;text-align:left}.note{margin:var(--space-6) 0;padding:var(--space-4) var(--space-5);border-radius:8px;background:var(--note-bg);color:var(--note-ink);font-size:var(--text-small);line-height:1.7}.empty{padding:var(--space-9);text-align:center;color:var(--muted)}.empty h3{color:var(--ink);margin:var(--space-3) 0}.filters{display:flex;gap:var(--space-3);margin-bottom:var(--space-5);flex-wrap:wrap}.filters label{min-width:150px;flex:1}.field{display:block;font-size:var(--text-small);font-weight:600;margin:0 0 var(--space-5)}.field input,.field select,.field textarea,.filters select,.filters input{display:block;margin-top:var(--space-2);width:100%;border:1px solid var(--control-line);background:var(--paper);padding:var(--space-3);border-radius:7px;color:var(--ink);min-height:45px}.field textarea{resize:vertical;min-height:90px}.steps{display:flex;gap:var(--space-2);margin:var(--space-7) 0;align-items:center;flex-wrap:wrap}.steps span{font-size:var(--text-label);color:var(--muted)}.steps b{padding:var(--space-2) var(--space-3);background:var(--mint);border-radius:5px;font-weight:600;color:var(--ink)}.form-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:var(--space-6);align-items:start}.product-choice{padding:var(--space-5);border:2px solid var(--ink);border-radius:9px;background:var(--surface-subtle);margin-bottom:var(--space-5)}.product-choice p{margin:var(--space-2) 0;font-size:var(--text-small)}.spec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin:var(--space-5) 0}.spec{font-size:var(--text-label);color:var(--muted);padding:var(--space-4) var(--space-3);background:var(--surface-subtle);border-radius:6px}.spec strong{display:block;color:var(--ink);font-size:var(--text-body);margin:var(--space-2) 0 0}.instructions{padding-left:var(--space-5);font-size:var(--text-small);color:var(--muted);line-height:1.8}.instructions li{margin-bottom:var(--space-3)}.check{display:flex;gap:var(--space-3);align-items:flex-start;font-size:var(--text-small);line-height:1.6;margin:var(--space-6) 0}.check input{accent-color:var(--ink);margin-top:var(--space-1)}.timer-panel{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);padding:var(--space-6);background:var(--timer-bg);color:var(--timer-ink);border-radius:12px;margin:var(--space-6) 0}.timer-panel p{color:var(--timer-muted);font-size:var(--text-small);margin:0}.timer-digits{font-size:var(--text-timer);font-variant-numeric:tabular-nums;letter-spacing:-2px}.timer-panel .secondary{background:var(--timer-button);color:var(--timer-button-ink);border-color:transparent}.pad{margin-bottom:var(--space-4);background:var(--paper);border:1px solid var(--line);border-radius:11px;padding:var(--space-5)}.pad-head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-4)}.pad-heading{display:flex;align-items:center;gap:var(--space-3)}.pad-number{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--surface-subtle);color:var(--muted);font-size:var(--text-small)}.pad-heading h3{margin:0 0 var(--space-1)}.pad-status{font-size:var(--text-label);background:var(--status-bg);border-radius:4px;padding:var(--space-2) var(--space-2)}.pad-status.ready{background:var(--ready-bg);color:var(--ready-ink)}.pad-status.missed{background:var(--missed-bg);color:var(--missed-ink)}.colors{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3)}.color-option{border:1px solid var(--control-line);background:var(--paper);border-radius:8px;padding:var(--space-3);display:grid;gap:var(--space-3);justify-items:center;color:var(--ink);font-size:var(--text-label)}.color-option[aria-pressed=true]{border:2px solid var(--ink);padding:var(--space-3);background:var(--surface-selected)}.swatch{height:35px;width:100%;border-radius:4px}.pad-foot{font-size:var(--text-label);color:var(--muted);margin-top:var(--space-3);display:flex;justify-content:space-between;gap:var(--space-3);align-items:center}.pad-foot button{color:var(--muted);font-size:var(--text-label);background:transparent;text-decoration:underline}.sticky-bottom{position:sticky;bottom:0;background:var(--sticky-bg);backdrop-filter:blur(8px);padding:var(--space-4) 0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);z-index:5}.photo-list{display:flex;gap:var(--space-3);flex-wrap:wrap;margin:var(--space-5) 0}.photo{position:relative}.photo img{width:110px;height:95px;object-fit:cover;border-radius:7px;border:1px solid var(--line)}.photo button{position:absolute;right:3px;top:3px;border-radius:50%;background:var(--paper);color:var(--ink);width:var(--target-min);height:var(--target-min);border:1px solid var(--control-line)}.upload{border:1px dashed var(--control-line);display:block;padding:var(--space-6);text-align:center;border-radius:8px;cursor:pointer;font-size:var(--text-small);background:var(--surface-upload)}.upload input{display:block;margin:var(--space-4) auto 0;max-width:100%;font-size:var(--text-label)}.meta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);padding:var(--space-5) 0}.meta-grid small{display:block;color:var(--muted);margin-bottom:var(--space-2)}.result-row{display:flex;justify-content:space-between;gap:var(--space-5);padding:var(--space-5) 0;border-top:1px solid var(--line)}.color-dot{display:inline-block;width:13px;height:13px;border-radius:3px;margin-right:var(--space-2);vertical-align:middle}.chart{width:100%;height:auto;display:block}.chart text{font:var(--text-lead) var(--font-body);fill:var(--muted)}.chart path,.chart polyline{vector-effect:non-scaling-stroke}.error{padding:var(--space-3);background:var(--error-bg);border-radius:6px;color:var(--error-ink);font-size:var(--text-small);margin:var(--space-4) 0}.catalog-table{font-size:var(--text-small)}.onboard{position:fixed;inset:0;background:var(--overlay);backdrop-filter:blur(6px);display:grid;place-items:center;z-index:30;padding:var(--space-6)}.onboard article{background:var(--bg);border-radius:20px;width:min(520px,100%);padding:var(--space-10)}.onboard h1{font-size:var(--text-title-sm);margin-top:var(--space-6)}.onboard p{font-size:var(--text-small);color:var(--muted)}.onboard .primary{width:100%;margin-top:var(--space-4)}.onboard ul{padding-left:var(--space-5);font-size:var(--text-small);color:var(--muted);line-height:1.8}#toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);border-radius:8px;background:var(--toast-bg);color:var(--toast-ink);font-size:var(--text-small);box-shadow:0 8px 30px var(--atelier-shadow-color);z-index:50;padding:var(--space-4) var(--space-6);display:none}#toast.show{display:block}.loading{margin:var(--space-13)}.footer{font-size:var(--text-label);color:var(--muted);display:flex;justify-content:space-between;margin-top:var(--space-9);padding-top:var(--space-5);border-top:1px solid var(--line)}.file-note{white-space:pre-wrap;overflow-wrap:anywhere}.stack{display:grid;gap:var(--space-4)}
@media(min-width:1500px){.main{padding:0 var(--space-18) var(--space-13)}.hero{min-height:220px}.hero-art{margin-right:var(--space-8)}}
@media(max-width:1000px){.sidebar{width:195px;padding:var(--space-8) var(--space-5)}.shell{grid-template-columns:195px 1fr}.main{padding:0 var(--space-7) var(--space-9)}.hero{grid-template-columns:1fr 180px}.hero-copy{padding:var(--space-7)}.strip{width:170px;gap:var(--space-1)}.form-grid{grid-template-columns:1fr}.topbar-right>span:first-child{display:none}}
@media(max-width:700px){.shell{display:block}.sidebar{position:fixed;inset:auto 0 0;width:100%;height:70px;padding:var(--space-2) var(--space-2);border-right:0;border-top:1px solid var(--line);background:var(--sidebar-bg);backdrop-filter:blur(10px)}.sidebar .brand,.brand-sub,.side-bottom{display:none}.nav{display:flex;justify-content:space-around;gap:0}.nav button{padding:var(--space-2) var(--space-2);font-size:var(--text-label);display:flex;flex-direction:column;gap:var(--space-1);min-width:54px}.nav svg{width:18px;height:18px}.main{padding:0 var(--space-5) var(--space-25)}.topbar{height:65px}.journal-heading{display:none}.topbar .mobile-brand{display:block;font-size:var(--text-body);font-weight:750;letter-spacing:1.5px;color:var(--ink)}.topbar-right{gap:var(--space-2)}.avatar{display:none}.page-head{margin:var(--space-7) 0 var(--space-6);align-items:start;flex-direction:column;gap:var(--space-4)}h1{font-size:var(--text-title-sm)}.page-head p{font-size:var(--text-small)}.hero{grid-template-columns:1fr 105px;min-height:200px}.hero-copy{padding:var(--space-6)}.hero h2{font-size:var(--text-display-sm)}.hero p{font-size:var(--text-small)}.hero-art{overflow:hidden}.strip{width:153px;height:29px;transform:rotate(-65deg)}.strip i{width:14px;height:14px}.hero-art small{display:none}.grid2{gap:var(--space-3)}.test-card{padding:var(--space-5);display:block;min-height:220px}.test-card h2{font-size:var(--text-heading);margin-top:var(--space-4)}.test-card p{font-size:var(--text-label)}.test-card .card-icon{height:38px;width:38px;margin-top:var(--space-3)}.test-card .card-icon svg{height:22px;width:22px}.test-card .arrow{right:17px;bottom:19px}.test-card .eyebrow{font-size:var(--text-label);letter-spacing:1px}.table-wrap td,.table-wrap th{padding:var(--space-4)}.hide-mobile{display:none}.panel{padding:var(--space-5)}.timer-panel{padding:var(--space-5);gap:var(--space-3);flex-wrap:wrap}.timer-digits{font-size:var(--text-timer-sm)}.timer-panel h3{font-size:var(--text-small)}.pad{padding:var(--space-4)}.pad-head{align-items:start}.pad-heading{gap:var(--space-2)}.pad-heading h3{font-size:var(--text-small)}.pad-status{font-size:var(--text-label)}.colors{gap:var(--space-2)}.color-option{padding:var(--space-2);font-size:var(--text-label)}.color-option[aria-pressed=true]{padding:var(--space-2)}.pad-foot{flex-direction:column;align-items:start;gap:var(--space-2)}.sticky-bottom{bottom:70px}.meta-grid{grid-template-columns:1fr 1fr;font-size:var(--text-small)}.filters{gap:var(--space-3)}.filters label{min-width:130px}.onboard article{padding:var(--space-7)}.footer{gap:var(--space-5);line-height:1.6}.photo img{width:90px;height:80px}.product-choice{padding:var(--space-4)}}

@media(max-width:700px){.chart text{font-size:var(--text-display)}}

.kit-hero{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}.kit-hero p{max-width:620px;font-size:var(--text-small);color:var(--muted)}@media(max-width:700px){.kit-hero{display:block}.kit-hero button{margin-top:var(--space-5)}}
.component-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-5)}.component-card{display:flex;flex-direction:column;align-items:flex-start}.component-card h2{line-height:1.3}.component-card>p{flex:1}.component-card>.inline{margin-top:var(--space-3)}.component-card .quiet{font-size:var(--text-label)}.draft-list{display:grid;gap:var(--space-3);margin-bottom:var(--space-6)}.draft-card{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5)}.draft-card h3{margin-top:var(--space-3)}.draft-card p{margin-bottom:0}.pad-nav{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-4)}.pad-nav button{min-width:var(--target-min);min-height:var(--target-min);height:auto;background:var(--paper);border:1px solid var(--line);border-radius:6px;color:var(--ink);font-size:var(--text-small)}.pad-nav button.done{background:var(--mint)}.pad-nav button.current{border:2px solid var(--ink);font-weight:700}.real-colors .swatch{display:block;height:46px;overflow:hidden;border:1px solid var(--atelier-shadow-color)}.real-colors .swatch img{display:block;width:100%;height:100%;object-fit:fill}.real-colors{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:var(--space-4)}.color-option small{font-size:var(--text-label);text-align:center}.instruction-notes{margin:var(--space-5) 0;font-size:var(--text-small);line-height:1.7}.instruction-notes summary,details.panel>summary{cursor:pointer;font-weight:600;margin-bottom:var(--space-3)}.chart-overlay{overflow:auto;align-items:start}.chart-overlay article{width:min(950px,100%);max-height:calc(100vh - 48px);overflow:auto;padding:var(--space-6)}.source-chart{display:block;max-width:100%;height:auto;margin:var(--space-5) auto;background:var(--chart-paper)}.chart-overlay .section-title{margin:0 0 var(--space-4);gap:var(--space-4)}.chart-overlay p{overflow-wrap:anywhere}.onboard article{max-height:calc(100vh - 48px);overflow:auto}.result-row>div:last-child{text-align:right}.result-row strong{overflow-wrap:anywhere}.component-card .eyebrow{margin-bottom:var(--space-3)}
@media(max-width:1100px){.real-colors{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:700px){.component-grid{grid-template-columns:1fr}.component-card{padding:var(--space-6)}.draft-card{align-items:flex-start;flex-direction:column}.pad-nav button{min-width:var(--target-min)}.real-colors .swatch{height:40px}.chart-overlay{padding:var(--space-3)}.chart-overlay article{max-height:calc(100vh - 24px);padding:var(--space-5)}.chart-overlay h2{font-size:var(--text-body)}.result-row{gap:var(--space-3)}.result-row h3{font-size:var(--text-small)}.result-row .small{font-size:var(--text-label)}.onboard .note{margin:var(--space-4) 0}}

.jar-colors{grid-template-columns:repeat(2,minmax(0,1fr))}.jar-colors .swatch{height:70px}.jar-colors .color-option{font-size:var(--text-small);align-content:start}.jar-colors .color-option small{font-size:var(--text-small);line-height:1.5}.jar-timer>div:first-child{max-width:520px}.jar-timer .timer-digits{font-size:var(--text-title);white-space:nowrap}@media(max-width:700px){.jar-timer .timer-digits{font-size:var(--text-title-sm)}.jar-colors .color-option small{font-size:var(--text-label)}}

/* Dashboard and component selection, continuing the original journal palette. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.main,.component-card,.draft-main{min-width:0}
.section-title{gap:var(--space-5)}
.section-title p{margin:var(--space-2) 0 0}
.active-tests{margin-bottom:var(--space-7)}
.active-tests>.section-title{margin-top:0}
.draft-list{gap:var(--space-3);margin:0}
.draft-card{padding:var(--space-6) var(--space-6);align-items:center}
.draft-card h3{font-size:var(--text-lead);line-height:1.4;overflow-wrap:anywhere;margin:var(--space-3) 0 var(--space-1)}
.draft-labels{gap:var(--space-2)}
.draft-status{font-size:var(--text-label);line-height:1.4;font-weight:650;padding:var(--space-1) var(--space-2);border-radius:5px;background:var(--status-bg);color:var(--status-ink)}
.draft-status.waiting{background:var(--waiting-bg);color:var(--waiting-ink)}
.draft-status.ready{background:var(--ready-bg);color:var(--ready-ink)}
.draft-status.attention{background:var(--attention-bg);color:var(--attention-ink)}
.draft-detail{margin-top:var(--space-2)!important;color:var(--muted);max-width:600px}
.draft-action{flex:0 0 200px;display:grid;gap:var(--space-3);justify-items:stretch}
.draft-action>span{font-size:var(--text-label);text-align:right}
.draft-action button{min-height:44px}
.result-progress{appearance:none;display:block;width:100%;height:4px;border:0;border-radius:4px;overflow:hidden;background:var(--progress-track);color:var(--progress-fill)}
.result-progress::-webkit-progress-bar{background:var(--progress-track);border-radius:4px}
.result-progress::-webkit-progress-value{background:var(--progress-fill);border-radius:4px}
.result-progress::-moz-progress-bar{background:var(--progress-fill);border-radius:4px}
.journal-summary{padding:var(--space-7) var(--space-7);border:1px solid var(--line-tint);border-radius:12px;background:var(--surface-summary);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(230px,1fr);gap:var(--space-5) var(--space-9);margin:var(--space-7) 0}
.journal-summary h2{font-size:var(--text-display-sm);line-height:1.3;font-weight:550;margin-bottom:var(--space-2)}
.journal-summary .eyebrow{font-size:var(--text-label);margin-bottom:var(--space-3)}
.journal-summary p{margin:0}
.journal-stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);margin:0;align-self:center}
.journal-stats>div{display:flex;flex-direction:column-reverse;border-left:1px solid var(--line-tint);padding-left:var(--space-6)}
.journal-stats dt{font-size:var(--text-label);color:var(--muted);margin-top:var(--space-2)}
.journal-stats dd{margin:0;font-size:var(--text-title);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-1px}
.summary-footnote{grid-column:1/-1;padding-top:var(--space-4);border-top:1px solid var(--line-tint);font-size:var(--text-label);color:var(--muted);line-height:1.6}
.kit-heading{margin-top:var(--space-9)}
.component-grid{gap:var(--space-4)}
.component-card{padding:var(--space-6);min-width:0}
.component-main{border-color:var(--line-main);background:var(--surface-main)}
.component-jar{background:var(--surface-jar);border-color:var(--line-jar)}
.component-top{display:flex;gap:var(--space-3);align-items:center;width:100%;margin-bottom:var(--space-5)}
.component-top .eyebrow{font-size:var(--text-label);letter-spacing:1.4px;margin:0}
.component-top>.pill{margin-left:auto;letter-spacing:.6px;font-size:var(--text-label);padding:var(--space-1) var(--space-2)}
.component-number{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:7px;background:var(--surface-subtle);color:var(--muted);font-size:var(--text-label);font-variant-numeric:tabular-nums}
.component-main .component-number{background:var(--mint);color:var(--accent)}
.component-jar .component-number{background:var(--waiting-bg);color:var(--waiting-ink)}
.component-card h2{font-size:var(--text-heading);line-height:1.4;margin:0 0 var(--space-5)}
.component-timing{width:100%;display:grid;grid-template-columns:1fr 1.6fr;gap:var(--space-4);margin:0 0 var(--space-4);padding:var(--space-4) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.component-timing dt{font-size:var(--text-label);color:var(--muted);margin-bottom:var(--space-2)}
.component-timing dd{font-size:var(--text-small);line-height:1.6;margin:0;font-weight:550}
.component-parameters{width:100%;font-size:var(--text-label);margin-bottom:var(--space-5);color:var(--accent)}
.component-parameters summary{cursor:pointer;padding:var(--space-1) 0;min-height:28px}
.component-parameters ul{margin:var(--space-3) 0 var(--space-half);padding-left:var(--space-5);display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2) var(--space-5);color:var(--muted);font-size:var(--text-label);line-height:1.5}
.component-actions{margin-top:auto;width:100%}
.component-actions>.inline{margin-top:var(--space-2);gap:var(--space-2) var(--space-4)}
.component-actions .quiet{font-size:var(--text-label)}
.component-actions>.primary,.component-actions>.secondary{min-height:44px}
.practice-panel>summary{margin:0}
.practice-panel[open]>summary{margin-bottom:var(--space-4)}
.record-link{overflow-wrap:anywhere}
.sticky-bottom>span{max-width:50%;line-height:1.6}
@media(max-width:1100px){
 .component-top{flex-wrap:wrap;gap:var(--space-2)}.component-top>.pill{margin-left:0}
 .draft-action{flex-basis:175px}.journal-summary{grid-template-columns:1fr}.journal-stats>div{padding-left:0;border-left:0}.journal-stats{max-width:340px}
}
@media(max-width:700px){
 .page-head{gap:var(--space-4)}.page-head>.primary{width:100%;min-height:46px}
 .section-title{align-items:flex-start;gap:var(--space-3)}.section-title h2{font-size:var(--text-body);line-height:1.4}.section-title .pill{font-size:var(--text-label);letter-spacing:.5px}
 .section-title .quiet{white-space:nowrap;padding-top:var(--space-1)}.section-title p{font-size:var(--text-label)}
 .draft-card{padding:var(--space-5);gap:var(--space-4);align-items:stretch}.draft-main{width:100%}
 .draft-action{flex-basis:auto;width:100%;grid-template-columns:1fr;gap:var(--space-2)}.draft-action>span{text-align:left}.draft-action button{width:100%}
 .draft-card h3{font-size:var(--text-lead)}.draft-card .draft-detail{font-size:var(--text-small)}
 .journal-summary{padding:var(--space-6);gap:var(--space-5);margin:var(--space-6) 0}.journal-summary h2{font-size:var(--text-display-sm)}.journal-stats dd{font-size:var(--text-title-sm)}.journal-stats{gap:var(--space-5);max-width:none}
 .summary-footnote{font-size:var(--text-label)}
 .component-card{padding:var(--space-6)}.component-top{flex-wrap:nowrap;margin-bottom:var(--space-4)}.component-top>.pill{margin-left:auto}.component-top .eyebrow{font-size:var(--text-label);letter-spacing:1px}
 .component-card h2{font-size:var(--text-heading)}.component-actions>.primary,.component-actions>.secondary{width:100%}
 .component-parameters summary{padding:var(--space-3) 0;min-height:40px}.component-parameters{margin-bottom:var(--space-3)}
 .component-actions .quiet{min-height:40px;align-items:center}
 .table-wrap{border:0;background:transparent;overflow:visible}
 .table-wrap table,.table-wrap tbody{display:block;width:100%}
 .table-wrap thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
 .table-wrap tbody{display:grid;gap:var(--space-3)}
 .table-wrap tr{display:grid;grid-template-columns:minmax(0,1fr) auto;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:var(--space-5);gap:var(--space-3) var(--space-4)}
 .table-wrap td{display:block;border:0;padding:0;min-width:0}
 .table-wrap td:first-child{grid-column:1/-1;grid-row:1}.table-wrap .record-link{font-size:var(--text-body);line-height:1.4}
 .table-wrap td.record-product{grid-column:1/-1;grid-row:2;font-size:var(--text-small);line-height:1.6;color:var(--muted)}
 .table-wrap td.record-date{grid-column:1;grid-row:3;display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-label);color:var(--muted)}
 .table-wrap td.record-date .muted{margin:0;font-size:var(--text-label)}
 .table-wrap td.record-action{grid-column:2;grid-row:3;align-self:end}.table-wrap .record-action .quiet{font-size:var(--text-small);min-height:44px}
 .table-wrap td.hide-mobile{display:none}
 .table-wrap td:first-child .muted{font-size:var(--text-label);margin-top:var(--space-1)}
 .sticky-bottom{padding:var(--space-3) 0;gap:var(--space-3)}.sticky-bottom .primary{padding:var(--space-3) var(--space-3);font-size:var(--text-small)}
 .sidebar{height:calc(70px + env(safe-area-inset-bottom));padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom))}.sticky-bottom{bottom:calc(70px + env(safe-area-inset-bottom))}.main{padding-bottom:calc(var(--space-25) + env(safe-area-inset-bottom))}
}

/* Comfortable controls and readable copy apply in both themes. */
body { font-size: var(--text-body); }
button, .btn, .primary, .secondary, .quiet, .record-link,
.component-actions .quiet, .table-wrap .record-action .quiet {
  min-height: var(--target-min);
}
button { min-width: var(--target-min); }
button, input, select, textarea, summary { scroll-margin-block: var(--space-6); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
summary { min-height: var(--target-min); padding-block: var(--space-3); }
.component-parameters summary { min-height: var(--target-min); padding-block: var(--space-3); }
.field input, .field select, .field textarea, .filters select, .filters input {
  font-size: var(--text-body);
  line-height: 1.5;
  min-height: 3rem;
}
.instructions { font-size: var(--text-body); }
.instruction-notes, .check { font-size: var(--text-small); }
.check { min-height: var(--target-min); align-items: flex-start; }
.check input { flex: 0 0 1.25rem; width: 1.25rem; height: 1.25rem; }
.primary, .secondary, .quiet { line-height: 1.4; text-align: center; }
.nav button { line-height: 1.35; }
.pad-nav button { padding: var(--space-2); }
.color-option { min-width: 0; }
.color-option:disabled { opacity: 1; color: var(--muted); background: var(--surface-subtle); }
.color-option .swatch, .source-chart { filter: none; }
.color-option small { overflow-wrap: anywhere; }
.photo button { font-size: var(--text-heading); }
.brand[href], .side-bottom a { min-height: var(--target-min); }
.side-bottom a { display: inline-flex; align-items: center; }
.page-head > div, .pad-head > div { min-width: 0; max-width: 100%; }
.page-head h1, .pad-head h2, .component-card h2 { overflow-wrap: anywhere; }
.timer-digits { max-width: 100%; overflow-wrap: anywhere; }
.jar-timer .timer-digits { white-space: normal; }
.chart path { stroke: var(--line); }
.chart polyline { stroke: var(--accent); }
.chart circle { fill: var(--paper); stroke: var(--accent); }
#toast { max-width: min(36rem, calc(100vw - 2 * var(--space-4))); line-height: 1.5; }
.footer { flex-wrap: wrap; gap: var(--space-3) var(--space-6); line-height: 1.6; }

@media (max-width: 700px) {
  :root { scroll-padding-bottom: calc(var(--mobile-nav-height) + var(--space-6) + env(safe-area-inset-bottom)); }
  .nav button { flex: 1; min-width: 0; padding: var(--space-2) var(--space-1); }
  .sidebar {
    height: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
    padding-bottom: calc(var(--space-2) + env(safe-area-inset-bottom));
  }
  .sticky-bottom { bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom)); }
  .main { padding-bottom: calc(var(--mobile-nav-height) + var(--space-8) + env(safe-area-inset-bottom)); }
  .component-top { flex-wrap: wrap; }
  .component-top .eyebrow { flex: 1; min-width: 6rem; }
  .component-top > .pill { margin-left: auto; }
  .section-title { flex-wrap: wrap; }
  .section-title .quiet { padding-block: var(--space-2); }
  .component-parameters ul { grid-template-columns: 1fr; }
  .table-wrap .record-link { font-size: var(--text-body); }
  .sticky-bottom { flex-wrap: wrap; }
  .sticky-bottom > span { max-width: 100%; flex: 1 1 9rem; }
  #toast { bottom: calc(var(--mobile-nav-height) + var(--space-4) + env(safe-area-inset-bottom)); }
}

@media (prefers-contrast: more) {
  :root { }
  button:disabled { opacity: .7; }
}
@media (forced-colors: active) {
  .source-chart, .swatch, .color-dot { forced-color-adjust: none; }
  .color-option, .pad-nav button, .secondary { border: 1px solid ButtonText; }
  .color-option[aria-pressed=true], .pad-nav button.current { outline: 2px solid Highlight; }
  .result-progress { forced-color-adjust: auto; }
}
@media (prefers-reduced-motion: reduce) {
  :root { --motion-fast: 0ms; --motion-normal: 0ms; --motion-slow: 0ms; }
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  button:active:not(:disabled) { transform: none; }
}
