/* CULTURAL REVIEW (founder, 2026-09-29). An open file, not a notice board:
   the reviews are a typographic ledger in the Community grammar, the same
   weight as any record. Site tokens only; the open ring is the one mark.
   Violet stays for interaction (ruling 11): links and the button only. */

.cr-block { max-width: 52rem; }
.cr-prose { max-width: var(--measure); }
.cr-prose p { margin: 0 0 var(--s3); font: var(--t-base)/var(--lh-body) var(--ui); color: var(--ink-2); }
.cr-prose p:first-child { color: var(--ink); }
.cr-aside { max-width: var(--measure); margin: var(--s4) 0 0; padding-inline-start: var(--s3); border-inline-start: 1px solid var(--rule-firm); font: var(--t-sm)/var(--lh-body) var(--ui); color: var(--ink-2); }
.cr-aside b { color: var(--ink); font-weight: 600; }

/* The ledger: name, state, the standing asked for, the offer. One row each. */
.cr-ledger { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.cr-rev {
  display: grid; grid-template-columns: minmax(10rem, 14rem) 9.5rem 1fr auto;
  align-items: baseline; column-gap: var(--s4); row-gap: var(--s1);
  padding: var(--s3) 0; border-bottom: 1px solid var(--rule);
  scroll-margin-top: var(--s6);
}
.cr-rev:target { box-shadow: inset 2px 0 0 var(--brand); padding-inline-start: var(--s3); }
.cr-rev__name { font: 600 var(--t-md)/var(--lh-tight) var(--ui); color: var(--ink); text-decoration: none; }
.cr-rev__name:hover { text-decoration: underline; text-underline-offset: 3px; }
.cr-rev__state { display: inline-flex; align-items: center; gap: 6px; font: var(--t-xs)/var(--lh-meta) var(--mono); color: var(--ink-2); }
.cr-rev__who { font: var(--t-sm)/var(--lh-body) var(--ui); color: var(--ink-2); }
.cr-rev__go { font: 500 var(--t-sm)/var(--lh-tight) var(--ui); white-space: nowrap; }

/* The kinds of standing: a two-column definition list. */
.cr-kinds { display: grid; grid-template-columns: 13rem 1fr; gap: var(--s2) var(--s4); margin: 0 0 var(--s4); }
.cr-kinds dt { font: 600 var(--t-sm)/var(--lh-body) var(--ui); color: var(--ink); }
.cr-kinds dd { margin: 0; font: var(--t-sm)/var(--lh-body) var(--ui); color: var(--ink-2); }

.cr-steps { max-width: var(--measure); margin: 0; padding-inline-start: 1.4em; }
.cr-steps li { margin: 0 0 var(--s2); padding-inline-start: var(--s1); font: var(--t-base)/var(--lh-body) var(--ui); color: var(--ink-2); }
.cr-steps li::marker { font: var(--t-sm)/1 var(--mono); color: var(--ink-3); }
.cr-steps b { color: var(--ink); font-weight: 600; }

/* The offer form. */
.cr-form { display: grid; gap: var(--s4); max-width: var(--measure); margin-top: var(--s4); }
.cr-form__set { margin: 0; padding: 0; border: 0; }
.cr-form__set legend, .cr-form__f > span { display: block; margin-bottom: var(--s2); font: 600 var(--t-sm)/var(--lh-tight) var(--ui); color: var(--ink); }
.cr-form__f > span em { margin-inline-start: var(--s1); font: var(--t-xs)/1 var(--mono); font-style: normal; color: var(--ink-3); }
.cr-form__picks { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: var(--s1) var(--s3); }
.cr-form__picks label, .cr-form__set--row label { display: flex; align-items: center; gap: var(--s2); min-height: 32px; font: var(--t-sm)/1.3 var(--ui); color: var(--ink-2); cursor: pointer; }
.cr-form__set--row { display: flex; flex-wrap: wrap; column-gap: var(--s5); }
.cr-form__set--row legend { flex-basis: 100%; }
.cr-form input[type="checkbox"], .cr-form input[type="radio"] { width: 16px; height: 16px; margin: 0; accent-color: var(--brand); }
.cr-form__f { display: block; }
.cr-form__f input, .cr-form__f textarea {
  display: block; width: 100%; box-sizing: border-box; padding: var(--s2) var(--s3);
  border: 1px solid var(--rule-firm); border-radius: var(--r-soft); background: var(--paper);
  font: var(--t-base)/var(--lh-body) var(--ui); color: var(--ink);
}
.cr-form__f textarea { resize: vertical; min-height: 5.5em; }
.cr-form__f input:focus-visible, .cr-form__f textarea:focus-visible { outline: 2px solid var(--brand); outline-offset: 1px; }
.cr-form__f small { display: block; margin-top: var(--s1); font: var(--t-xs)/var(--lh-meta) var(--ui); color: var(--ink-3); }
.cr-form__f[hidden] { display: none; }
.cr-form [aria-invalid="true"] { border-color: var(--accent); }
.cr-form__terms { margin: 0; font: var(--t-sm)/var(--lh-body) var(--ui); color: var(--ink-2); }
.cr-form__go {
  justify-self: start; min-height: 44px; padding: 0 var(--s5);
  border: 0; border-radius: var(--r-soft); background: var(--brand); color: var(--paper);
  font: 600 var(--t-sm)/1 var(--ui); cursor: pointer;
}
.cr-form__go:hover { background: var(--brand-lift); }
.cr-form__go:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.cr-form__go[disabled] { opacity: .6; cursor: progress; }
.cr-form__note { margin: 0; font: var(--t-sm)/var(--lh-body) var(--ui); color: var(--ink); }
.cr-form__off, .cr-privacy { max-width: var(--measure); margin: var(--s4) 0 0; font: var(--t-xs)/var(--lh-meta) var(--ui); color: var(--ink-3); }
.cr-done { max-width: var(--measure); margin-top: var(--s4); padding: var(--s4); border: 1px solid var(--rule-firm); font: var(--t-base)/var(--lh-body) var(--ui); color: var(--ink); }
.cr-done p { margin: 0 0 var(--s2); }
.cr-done p:last-child { margin: 0; color: var(--ink-2); font-size: var(--t-sm); }

@media (max-width: 60rem) {
  .cr-rev { grid-template-columns: 1fr auto; }
  .cr-rev__state { grid-column: 2; grid-row: 1; justify-self: end; }
  .cr-rev__who { grid-column: 1 / -1; }
  .cr-rev__go { grid-column: 1 / -1; }
}
@media (max-width: 36rem) {
  .cr-kinds { grid-template-columns: 1fr; gap: 0; }
  .cr-kinds dd { margin-bottom: var(--s3); }
  .cr-rev { grid-template-columns: 1fr; }
  .cr-rev__state { grid-column: 1; grid-row: auto; justify-self: start; }
}

/* The honeypot: off-screen for people, present for bots. */
.cr-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }