html { scroll-behavior: smooth; } body { margin: 0; } [hidden] { display: none !important; }
.showcase { min-height: 100vh; padding: 0 clamp(1.25rem, 5vw, 5rem); } .showcase ::selection { background: var(--lamp-accent); color: var(--lamp-text-on-fill); }
.masthead, footer { max-width: 76rem; margin: auto; display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--lamp-glass-hairline); }
.masthead:has(#appearance-switcher) { flex-wrap: wrap; }
.brand { font-weight: 600; text-decoration: none; } .brand span { margin-left: .5rem; color: var(--lamp-text-secondary); font-size: .8rem; font-weight: 400; } nav { display: flex; flex-wrap: wrap; gap: 1.4rem; } a { text-underline-offset: .25em; }
main { max-width: 76rem; margin: auto; } section { padding: clamp(3rem, 7vw, 6rem) 0; border-bottom: 1px solid var(--lamp-glass-hairline); } h1, h2, h3, h4, p { margin-top: 0; } h1, h2, h3 { text-wrap: balance; } h1 { max-width: 14ch; font-family: var(--lamp-font-serif); font-size: clamp(2.7rem, 6vw, 5rem); font-weight: 400; line-height: 1.05; letter-spacing: -.025em; } h2 { font-family: var(--lamp-font-serif); font-size: clamp(2rem, 4vw, 3rem); font-weight: 400; } h3 { font-size: 1.12rem; } p { max-width: 68ch; line-height: 1.65; } .intro > p { font-size: 1.15rem; } .note { color: var(--lamp-text-secondary); font-size: .9rem !important; }
.controls { display: flex; flex-wrap: wrap; gap: 1rem 3rem; margin: 2rem 0; } fieldset { border: 0; padding: 0; margin: 0; } legend { font-weight: 600; margin-bottom: .5rem; } fieldset label { display: inline-flex; align-items: center; gap: .35rem; margin: 0 1rem .5rem 0; } input[type=radio] { accent-color: var(--lamp-accent); } .controls p { flex-basis: 100%; margin: 0; }
.example-heading { margin: clamp(4rem, 7vw, 6rem) 0 1.5rem; } .example-heading h3 { margin-bottom: .35rem; } .example-heading p { color: var(--lamp-text-secondary); } .reading-example { padding: clamp(1.5rem, 5vw, 4rem); } .reading-example h3 { max-width: 16ch; font-family: var(--lamp-font-serif); font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1.05; font-weight: 400; } .site-name { font-weight: 600; margin-bottom: 3rem; } .reading-example .l-reading { max-width: 58ch; font-size: 1.12rem; }
.report-head { display: flex; justify-content: space-between; gap: 2rem; padding-top: 1.5rem; } .report-head h3 { margin-bottom: .3rem; } .report-head p { color: var(--lamp-text-secondary); } caption { text-align: left; margin-bottom: .8rem; font-weight: 600; } .l-table { font-variant-numeric: tabular-nums; } .l-table .group th { padding-top: 1.5rem; text-align: left; } .l-table th[scope=row] { text-align: left; }
.dashboard, .start-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; } .dashboard-filter { max-width: 18rem; margin-bottom: 1.5rem; } .place-list { list-style: none; padding: 0; margin: 0; } .place-list li { border-top: 1px solid var(--lamp-glass-hairline); } .place-button { color: inherit; background: transparent; border: 0; padding: .75rem .25rem; width: 100%; display: flex; justify-content: space-between; gap: 1rem; text-align: left; font: inherit; } .place-button:enabled { cursor: pointer; } .place-button[aria-pressed=true] { font-weight: 600; } .place-button span { color: var(--lamp-text-secondary); font-weight: 400; } .dashboard-detail { padding: 1.5rem 0; } .dashboard-detail h4 { font-family: var(--lamp-font-serif); font-size: 2rem; font-weight: 400; margin-bottom: .25rem; } dl { margin: 2rem 0; font-variant-numeric: tabular-nums; } dl div { display: flex; justify-content: space-between; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid var(--lamp-glass-hairline); } dd { margin: 0; }
.reference-example { padding: 2rem 0; } .reference-example .l-field { max-width: 25rem; margin-top: 1.5rem; } .reference-example .l-thread { margin-top: 2rem; } .principle-list article { max-width: 72ch; padding: 1rem 0; } .principle-list h3 { margin-bottom: .4rem; } code { font-family: var(--lamp-font-mono); font-size: .86em; overflow-wrap: anywhere; } pre { white-space: pre-wrap; overflow-wrap: anywhere; padding: 1rem; background: var(--lamp-surface-reading); color: var(--lamp-text-secondary); } footer { border: 0; color: var(--lamp-text-secondary); font-size: .9rem; } .print-value { display: none; }
@media (max-width: 700px) { .masthead, footer { align-items: flex-start; flex-direction: column; } .dashboard, .start-grid { grid-template-columns: 1fr; } .report-head { flex-direction: column; gap: 0; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media print { .showcase { padding: 0; } nav, #appearance-switcher, .controls, .dashboard-filter select, .dashboard-filter label, .place-list { display: none !important; } .print-value { display: block; } section { padding: 1rem 0; } .dashboard, .start-grid { display: block; } .dashboard-detail { break-inside: avoid; } .l-table-wrap { overflow: visible; } .l-table { width: 100%; font-size: 9pt; } }

.reference-panel { padding: clamp(1.5rem, 3vw, 2rem); } .reference-toggle { margin-top: 1.5rem; } .reference-table { margin-top: 2rem; } .reference-disclosure { padding: 1rem 0; } .reference-disclosure summary { cursor: pointer; font-weight: 600; } .reference-disclosure nav { margin-top: 1rem; } .instrument-example { display: flex; align-items: center; flex-wrap: wrap; gap: 2rem; margin-top: 2rem; } .instrument-example p { margin-bottom: 0; }

/* Keep comparison headings readable on narrow screens. */
.l-table thead th { white-space: normal; }

@media (max-width: 700px) { .l-table :is(th, td) { padding-inline: .5rem; } }

.sample-grid, .recipe-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 5vw, 5rem); }
.sample-panel { padding: clamp(1.5rem, 3vw, 2rem); } .sample-panel .l-field { margin: 1.5rem 0; } .sample-aside { color: var(--lamp-text-secondary); } .recipe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.example-toolbar { position: static; top: 0; z-index: 5; background: var(--lamp-surface-reading); color: var(--lamp-text); padding: .75rem 1rem; border: 1px solid var(--lamp-glass-hairline); } .example-toolbar > p { margin: 0; } #active-settings { margin-left: .5rem; } .example-toolbar .controls { margin: .5rem 0 0; gap: .5rem 2rem; } .example-toolbar legend { margin-bottom: .15rem; } .example-toolbar fieldset label { margin-bottom: 0; } .example-section { scroll-margin-top: calc(var(--example-toolbar-height, 0px) + 16px); } .example-section .example-heading { margin: 0 0 1.5rem; } .example-section .example-heading h2 { margin-bottom: .35rem; } .example-section .example-heading p { margin-bottom: .4rem; } .example-room { padding: clamp(1.25rem, 4vw, 3rem); } .example-room > :last-child { margin-bottom: 0; }
@media (max-width: 700px) { .sample-grid, .recipe-grid { grid-template-columns: 1fr; } .example-toolbar { font-size: .875rem; padding: .5rem .75rem; } .example-toolbar .controls { gap: .25rem 1rem; } .example-toolbar fieldset label { margin-right: .5rem; }  }
@media print { .example-toolbar { display:none !important; } .example-room { padding: 0; } .sample-panel input, #sample-action { display:none; } }
/* Print the concise snapshot, whose values follow the dashboard selection. */
@media print { body:has(.example-section) .masthead, body:has(.example-section) .intro, body:has(.example-section) .example-section:not(#print), body:has(.example-section) footer { display: none !important; } }

.example-toolbar .active-summary { display: none; }
[data-enhanced="true"] .example-toolbar { position: sticky; }
[data-enhanced="true"] .example-toolbar .active-summary { display: block; }
.example-room[data-surface="ledger"] .l-table thead th { top: var(--example-toolbar-height, 0px); }
@media (max-width: 700px) {
  .example-room { padding-inline: .5rem; }
  .example-room .l-table :is(th, td) { padding-inline: .25rem; }
}

/* Page-scrolling reports keep headings below the display strip. Narrow tables
   retain a keyboard-scrollable region with headings in normal flow. */
.example-room .l-table-wrap { overflow: visible; }
.table-hint { display: none; }
@media (max-width: 700px) {
  .example-room .l-table-wrap { overflow-x: auto; }
  .example-room .l-table thead th { position: static; top: auto; }
}
@media (max-width: 389px) { .table-hint { display: block; } }
@media print { .table-hint { display: none; } }

@media print { .sample-panel .l-actions { display: none; } }

.ai-starters { max-width: 52rem; margin-top: 2.5rem; }
.ai-starters details { border-top: 1px solid var(--lamp-glass-hairline); padding: .75rem 0; }
.ai-starters summary { cursor: pointer; font-weight: 600; }
.ai-prompt { margin: 1.5rem 0; }
.ai-prompt pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.copy-status { margin-left: .75rem; }

@media print { .copy-prompt, .copy-status { display: none; } }

.chapter-demo .masthead { max-inline-size: var(--lamp-chapter-layout-width); padding-block-start: calc(var(--lamp-space-6) + env(safe-area-inset-top, 0px)); background: var(--lamp-surface-page); }
.chapter-demo:has(.l-chapter-rail[data-enhanced]) .masthead { position: sticky; top: 0; z-index: 2; }
.chapter-demo main { max-inline-size: var(--lamp-chapter-layout-width); }
.chapter-demo .chapter-body > section { padding-block: var(--lamp-space-12); }
.chapter-demo .chapter-body > .l-reading { max-inline-size: var(--lamp-chapter-measure); }
@media print { .chapter-demo .masthead, .chapter-demo footer { display: none; } }

.reference-overview { margin-block: var(--lamp-space-6); }