/* Fettler workflow library. Shared tokens live in styles.css. */
.uc-card[hidden], .uc-filters[hidden], .uc-empty[hidden], #case-more[hidden] { display: none; }
.uc-eyebrow { margin-bottom: 24px; color: var(--oxide); }
.uc-hero { padding-bottom: 80px; }
.uc-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 80px; align-items: end; }
.uc-hero .page-h1 { max-width: 19ch; font-size: clamp(40px, 4.5vw, 64px); }
.uc-hero .lead { max-width: 54ch; }
.uc-ledger { border-top: 4px solid var(--oxide); background: var(--sheet); padding: 24px; }
.uc-ledger dl { margin: 24px 0; }
.uc-ledger dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--rule); }
.uc-ledger dt { font-size: 14px; color: var(--ink-2); }
.uc-ledger dd { font-family: var(--mono); font-size: 30px; line-height: 1.3; }
.uc-ledger > p:last-child { font-size: 14px; color: var(--ink-2); line-height: 1.6; }
.uc-library { padding-bottom: 80px; }
.uc-library-heading { border-top: 1px solid var(--ink); padding-top: 32px; display: grid; grid-template-columns: 1fr 360px; gap: 40px; align-items: end; }
.uc-library-heading h2 { font-size: 32px; margin-top: 12px; max-width: 22ch; }
.uc-library-heading > p { color: var(--ink-2); font-size: 16px; }
.uc-filters { display: grid; grid-template-columns: minmax(210px,1.7fr) minmax(180px,1fr) minmax(180px,1fr) auto; gap: 16px; align-items: end; margin: 32px 0; padding: 24px; border: 1px solid var(--rule); background: var(--sheet); }
.uc-filters label { display: block; font-size: 13px; margin-bottom: 8px; color: var(--ink-2); }
.uc-filters input, .uc-filters select { display: block; width: 100%; min-width: 0; min-height: 48px; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--paper); color: var(--ink); padding: 10px 12px; font: inherit; font-size: 16px; }
.uc-filters input::placeholder { color: var(--ink-2); opacity: 1; }
.uc-reset { border: 0; background: transparent; min-height: 48px; padding: 8px 4px; color: var(--oxide); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; font-size: 14px; }
.uc-library-grid { display: grid; grid-template-columns: 232px minmax(0,1fr); gap: 40px; margin-top: 32px; }
.uc-directory { border-top: 1px solid var(--rule); }
.uc-directory summary { cursor: pointer; padding: 16px 0; font-size: 15px; font-weight: 600; min-height: 48px; }
.uc-directory nav { padding-bottom: 20px; }
.uc-directory-group + .uc-directory-group { margin-top: 28px; }
.uc-directory h3 { font-size: 13px; color: var(--ink-2); margin: 12px 0; }
.uc-directory li a { display: flex; gap: 12px; justify-content: space-between; padding: 10px 0; font-size: 14px; text-decoration: none; border-bottom: 1px solid var(--rule); line-height: 1.5; min-height: 44px; }
.uc-category-count { color: var(--ink-2); font-family: var(--mono); font-size: 12px; flex-shrink: 0; }
.uc-result-count { font-family: var(--mono); font-size: 13px; color: var(--ink-2); min-height: 24px; margin: 0 0 16px; }
.uc-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.uc-card { display: flex; flex-direction: column; border: 1px solid var(--rule); background: var(--sheet); padding: 24px; position: relative; transition: border-color var(--t), background var(--t); }
.uc-kicker { font-size: 12px; color: var(--oxide); line-height: 1.5; margin-bottom: 16px; }
.uc-card h3 { font-size: 22px; line-height: 1.25; letter-spacing: -.02em; text-wrap: pretty; }
.uc-card h3 a { text-decoration: none; }
.uc-card h3 a::after { content: ''; position: absolute; inset: 0; }
.uc-description { color: var(--ink-2); font-size: 15px; line-height: 1.65; margin: 16px 0 24px; }
.uc-card-foot { font-size: 12px; color: var(--ink-2); border-top: 1px solid var(--rule); padding-top: 12px; margin-top: auto; }
.uc-card:focus-within { outline: 2px solid var(--oxide); outline-offset: 3px; }
.uc-empty { border: 1px solid var(--rule); padding: 40px; background: var(--sheet); }
.uc-empty p { margin: 16px 0 24px; }
.uc-more { text-align: center; margin-top: 32px; }
.uc-principles { border-top: 1px solid var(--rule); padding-top: 64px; padding-bottom: 80px; }
.uc-principles > h2 { max-width: 24ch; margin-top: 16px; }
.uc-principles .group p { color: var(--ink-2); }
.uc-category-hero .page-h1 { max-width: 24ch; }
.uc-category-hero .lead { max-width: 66ch; }
.uc-scope-note { color: var(--ink-2); font-size: 14px; margin-top: 24px; max-width: 75ch; }
.uc-starting-point { display: grid; grid-template-columns: 232px minmax(0,1fr); gap: 40px; border-top: 1px solid var(--rule); padding-top: 40px; padding-bottom: 56px; }
.uc-starting-point h2 { font-size: 28px; margin-bottom: 16px; }
.uc-starting-point p:not(.marker) { max-width: 68ch; }
.uc-category-layout { display: grid; grid-template-columns: 232px minmax(0,1fr); gap: 40px; padding-bottom: 80px; }
.uc-toc li a { font-size: 13px; }
.uc-workflows > h2 { font-size: 30px; padding: 16px 0 32px; border-top: 1px solid var(--rule); }
.uc-entry { border: 1px solid var(--rule); padding: 32px; margin-bottom: 24px; background: var(--sheet); scroll-margin-top: 24px; }
.uc-entry:target { border-color: var(--oxide); }
.uc-entry-top { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 20px; }
.uc-entry-number { font-family: var(--mono); font-size: 13px; color: var(--oxide); }
.uc-permalink { font-size: 12px; color: var(--ink-2); text-underline-offset: 3px; min-height: 32px; display: flex; align-items: center; }
.uc-entry h3 { font-size: 28px; max-width: 32ch; line-height: 1.22; text-wrap: pretty; }
.uc-entry dl { margin-top: 24px; }
.uc-entry dl > div { display: grid; grid-template-columns: 124px minmax(0,1fr); gap: 20px; padding: 16px 0; border-top: 1px solid var(--rule); }
.uc-entry dt { font-size: 13px; color: var(--ink-2); padding-top: 3px; }
.uc-entry dd { font-size: 17px; line-height: 1.65; }
.uc-approval dd { color: var(--moss); }
.uc-entry-cta { display: inline-flex; align-items: center; min-height: 44px; margin-top: 16px; font-size: 14px; }
.uc-related { border-top: 1px solid var(--rule); padding-top: 48px; padding-bottom: 64px; }
.uc-related h2 { margin-top: 16px; }
.uc-related .onward { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.uc-related a { width: fit-content; }
@media (hover:hover) {
  .uc-card:hover { border-color: var(--oxide); background: #f5f6ee; }
  .uc-directory a:hover { color: var(--oxide); }
}
@media (min-width: 1100px) {
  .uc-sidebar, .uc-toc { align-self: start; position: sticky; top: 96px; max-height: calc(100vh - 120px); overflow-y: auto; scrollbar-width: thin; }
}
@media (max-width: 1099px) {
  .uc-hero-grid { grid-template-columns: minmax(0,1fr) 260px; gap: 40px; }
  .uc-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .uc-library-grid, .uc-category-layout, .uc-starting-point { grid-template-columns: 200px minmax(0,1fr); gap: 24px; }
  .uc-card { padding: 20px; }
  .uc-library-heading { grid-template-columns: 1fr 280px; }
}
@media (max-width: 859px) {
  .uc-hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .uc-ledger { max-width: none; }
  .uc-ledger dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
  .uc-ledger dl > div { display: flex; flex-direction: column-reverse; align-items: start; gap: 6px; }
  .uc-library-heading, .uc-library-grid, .uc-category-layout, .uc-starting-point { grid-template-columns: 1fr; }
  .uc-library-heading { gap: 20px; }
  .uc-library-heading > p { max-width: 50ch; }
  .uc-directory nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
  .uc-directory-group + .uc-directory-group { margin-top: 0; }
  .uc-toc nav { display: block; }
  .uc-toc ol { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 24px; }
  .uc-related .onward { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .uc-starting-point { padding-top: 32px; padding-bottom: 40px; }
  .uc-category-layout { gap: 32px; }
}
@media (max-width: 559px) {
  .uc-hero { padding-bottom: 48px; }
  .uc-hero .page-h1 { font-size: 40px; }
  .uc-ledger { padding: 20px; }
  .uc-ledger dl { gap: 12px; }
  .uc-ledger dd { font-size: 28px; }
  .uc-ledger dt { font-size: 12px; }
  .uc-filters { grid-template-columns: 1fr; padding: 16px; gap: 16px; }
  .uc-reset { text-align: left; width: fit-content; }
  .uc-cards { grid-template-columns: 1fr; }
  .uc-card { padding: 24px; }
  .uc-library-heading h2, .uc-workflows > h2 { font-size: 28px; }
  .uc-directory nav, .uc-toc ol { grid-template-columns: 1fr; }
  .uc-directory-group + .uc-directory-group { margin-top: 24px; }
  .uc-entry { padding: 24px 20px; }
  .uc-entry h3 { font-size: 25px; }
  .uc-entry dl > div { grid-template-columns: 1fr; gap: 8px; }
  .uc-entry-top { gap: 12px; }
  .uc-related .onward { grid-template-columns: 1fr; }
  .uc-empty { padding: 24px; }
  .uc-library, .uc-category-layout, .uc-principles { padding-bottom: 56px; }
}
@media (prefers-reduced-motion: reduce) {
  .uc-card { transition: none; }
}