/* Accreditation pages. Tokens only; components come from peekwell.css and pw-graphs.css. */

.acc-eyebrow { margin: 0 0 var(--s-1); font: 600 var(--fs-xs)/1 var(--font-ui); letter-spacing: 0.1em; text-transform: uppercase; color: var(--mint-700); }
[data-theme="dark"] .acc-eyebrow { color: var(--mint-300); }
.acc-short { margin: 0; font-family: var(--font-hand); font-size: var(--fs-lg); color: var(--text-2); }

/* ---- hero ---------------------------------------------------------------- */
.acc-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--s-6) var(--s-8); padding: var(--s-8) var(--s-10) var(--s-8) var(--s-10); background: linear-gradient(135deg, var(--mint-100), var(--bg-sheet) 55%); }
.acc-hero__id { display: flex; gap: var(--s-5); align-items: flex-start; min-width: 0; }
.acc-hero__text { min-width: 0; display: grid; gap: var(--s-2); }
.acc-hero__text .pw-h1 { overflow-wrap: anywhere; }
.acc-hero__lead { margin: 0; font-size: var(--fs-md); }
.acc-hero__chips { margin: var(--s-1) 0 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.acc-hero__score { display: grid; justify-items: center; gap: var(--s-2); position: relative; z-index: 1; }
.acc-hero__art { width: 144px; height: auto; align-self: center; margin: calc(var(--s-6) * -1) 0; filter: drop-shadow(0 6px 10px rgba(31,36,48,0.18)); pointer-events: none; }
.acc-logo { flex: none; width: 72px; height: 72px; border-radius: var(--r-xl); object-fit: contain; background: var(--bg-sheet); border: 1px solid var(--line); padding: 8px; box-shadow: var(--shadow-1); }
.acc-logo--initial { display: grid; place-items: center; padding: 0; font: 600 var(--fs-2xl)/1 var(--font-display); color: var(--mint-700); background: var(--mint-200); border-color: var(--mint-300); }
.acc-basis { margin: 0; display: grid; gap: 2px; text-align: center; }
.acc-basis b { font-size: var(--fs-sm); }
.acc-basis span { font-size: var(--fs-xs); color: var(--text-3); }
.acc-ctx__score .acc-basis { text-align: left; }
/* Reading lamp: the mint wash and the initial tile take the dark mint stage colour (peekwell.css .pw-stage--mint). */
:root[data-theme="dark"] .acc-hero { background: linear-gradient(135deg, #2B3A2C, var(--bg-sheet) 55%); }
:root[data-theme="dark"] .acc-logo--initial { color: var(--mint-200); background: #2B3A2C; border-color: var(--mint-700); }
@media (max-width: 1000px) { .acc-hero { grid-template-columns: minmax(0, 1fr) auto; } .acc-hero__art { display: none; } }

/* ---- context cards ------------------------------------------------------- */
.acc-ctx__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: var(--s-3); margin-bottom: var(--s-4); }
.acc-ctx__name { margin: 0 0 var(--s-2); }
.acc-stamp { color: var(--mint-700); border-color: var(--mint-600); transform: rotate(-3deg); }
[data-theme="dark"] .acc-stamp { color: var(--mint-300); border-color: var(--mint-400); }
.acc-ctx__score { display: flex; align-items: center; gap: var(--s-4); margin-bottom: var(--s-4); }
.acc-ring { width: 72px; height: 72px; flex-shrink: 0; }
.acc-ring span { font-size: var(--fs-xl); font-family: var(--font-display); }
.acc-facts { margin: 0 0 var(--s-5); display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--s-3) var(--s-6); }
.acc-facts dt { font-size: var(--fs-2xs); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-3); }
.acc-facts dd { margin: 2px 0 0; font-weight: 500; }
.acc-history { min-width: 0; }
.acc-history .pw-history { border: 0; padding: 0; background: transparent; box-shadow: none; }
.acc-quiet { margin: 0; color: var(--text-2); }

.acc-marker__line { stroke: var(--brass-500); stroke-width: 1.5; stroke-dasharray: 4 4; }
.acc-marker__tag rect { fill: var(--brass-100); stroke: var(--brass-500); }
.acc-marker__tag text { fill: var(--brass-700); font: 600 11px/1 var(--font-ui); }
[data-theme="dark"] .acc-marker__tag rect { fill: var(--ink-700); }
[data-theme="dark"] .acc-marker__tag text { fill: var(--brass-200); }

.acc-changes { margin-top: var(--s-4); padding: var(--s-4) var(--s-5); border-radius: var(--r-lg); background: var(--brass-100); border: 1px solid color-mix(in srgb, var(--brass-500) 35%, transparent); color: var(--brass-700); }
[data-theme="dark"] .acc-changes { background: var(--bg-recessed); color: var(--text); }
.acc-changes__title { margin: 0 0 var(--s-1); font: 600 var(--fs-sm)/1.3 var(--font-ui); display: flex; align-items: center; gap: var(--s-2); }
.acc-changes p { margin: 0 0 var(--s-2); color: inherit; }
.acc-changes ul { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--s-1); font-size: var(--fs-sm); }
.acc-changes li { overflow-wrap: anywhere; }

.acc-read { padding: var(--s-2) var(--s-1); display: grid; gap: var(--s-3); }
.acc-read__title { margin: 0; font: 600 var(--fs-md)/1.3 var(--font-ui); }
.acc-read__text { margin: 0; color: var(--text-2); font-size: var(--fs-sm); max-width: 70ch; }
.acc-read__cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); }
.acc-read__cta p { margin: 0; font-weight: 600; }

.acc-inactive { max-width: 560px; margin: var(--s-6) auto; }
.acc-inactive .pw-h2 { margin-top: var(--s-2); }

/* ---- manage page --------------------------------------------------------- */
.acc-grid { display: grid; gap: var(--s-6); grid-template-columns: minmax(0, 1fr); }
/* The company page's Badge row links to #badge: land with air above the card, clear of the phone's sticky bar. */
.acc-grid > section[id] { scroll-margin-top: var(--s-6); }
@media (max-width: 900px) { .acc-grid > section[id] { scroll-margin-top: calc(56px + var(--s-4)); } }
.acc-state { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--s-4); }
.acc-state__item { display: flex; gap: var(--s-3); align-items: flex-start; padding: var(--s-4); border-radius: var(--r-lg); background: var(--bg-recessed); min-width: 0; }
.acc-state__item .ph, .acc-state__item .ph-fill { font-size: 22px; flex-shrink: 0; color: var(--text-3); }
.acc-state__item.is-ok .ph-fill { color: var(--mint-600); }
:root[data-theme="dark"] .acc-state__item.is-ok .ph-fill { color: var(--mint-400); }
.acc-state__item b { display: block; }
.acc-state__item span { font-size: var(--fs-sm); color: var(--text-2); }
.acc-url { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; }
.acc-url input { flex: 1 1 260px; min-width: 0; height: 42px; padding: 0 12px; border-radius: var(--r-md); border: 1px solid var(--line-strong); background: var(--bg-sheet); color: var(--text); font: 400 var(--fs-sm)/1 var(--font-mono); }
.acc-actions { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; margin-top: var(--s-4); }
.acc-actions form { margin: 0; }
.acc-pick { display: grid; gap: var(--s-3); margin: var(--s-4) 0; }
.acc-pick__row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); border-radius: var(--r-lg); border: 1px solid var(--line); background: var(--bg-sheet); }
.acc-pick__row .pw-check { flex: 1 1 220px; min-width: 0; }
.acc-ctxrow { display: grid; gap: var(--s-3); padding: var(--s-4) 0; border-bottom: 1px solid var(--line-soft); }
.acc-ctxrow:last-child { border-bottom: 0; }
.acc-ctxrow__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); }
.acc-ctxrow__head b { margin-right: auto; }
.acc-events { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--s-1); font-size: var(--fs-sm); color: var(--text-2); }
.acc-events li { overflow-wrap: anywhere; }
.acc-events time { color: var(--text-3); font-variant-numeric: tabular-nums; margin-right: var(--s-2); }
.acc-snippet { display: grid; gap: var(--s-2); margin-bottom: var(--s-4); }
.acc-snippet__top { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.acc-snippet__label { font-weight: 600; font-size: var(--fs-sm); }
.acc-snippet textarea { width: 100%; min-height: 64px; resize: vertical; padding: 10px 12px; border-radius: var(--r-md); border: 1px solid var(--line-strong); background: var(--bg-recessed); color: var(--text); font: 400 var(--fs-xs)/1.5 var(--font-mono); overflow-wrap: anywhere; }
.acc-preview { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4); padding: var(--s-4); border-radius: var(--r-lg); background: var(--bg-recessed); margin-bottom: var(--s-4); }
.acc-cta { display: grid; justify-items: start; gap: var(--s-3); }
.acc-foot:has(> *) { margin-top: var(--s-4); }
.acc-intro { max-width: 68ch; margin: 0; }
.acc-note { margin: 0; }
.acc-banner { margin-bottom: var(--s-4); }
.acc-actions + .acc-note { margin-top: var(--s-3); }
.acc-note--lead { margin-bottom: var(--s-4); }
.acc-ctxlist { margin-top: var(--s-5); }

@media (max-width: 760px) {
  .acc-hero { grid-template-columns: minmax(0, 1fr); padding: var(--s-6) var(--s-5); }
  .acc-hero__id { flex-direction: column; gap: var(--s-3); }
  .acc-hero__score { justify-items: start; }
  .acc-basis { text-align: left; }
  .acc-logo { width: 60px; height: 60px; }
}