/* ============================================================
   LAWO – Person (single-person.php)
   Komponentstiler for personsiden. Kun tokens, mobil-først.
   ============================================================ */

.person {
  padding-block: var(--space-7);
}

/* ---------- Hode ---------- */
.person__head {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
  align-items: start;
}
.person__portrait {
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-paper-warm);
  box-shadow: var(--shadow-sm);
  max-width: 240px;
}
.person__portrait img { width: 100%; height: auto; display: block; }

.person__name { margin-bottom: var(--space-2); }

.person__role {
  font-size: var(--fs-400);
  color: var(--color-ink-soft);
  margin: 0;
}
/* Ensembletype-linje (LWE) for grupper – nær navnet, à la demonym-linja. */
.person__ensembletype {
  font-size: var(--fs-400);
  color: var(--color-ink-soft);
  margin: var(--space-1) 0 0;
}

/* ---------- Bio ---------- */
.person__bio {
  margin-top: var(--space-6);
  font-size: var(--fs-400);
  line-height: var(--lh-base);
  max-width: none; /* full .container-bredde (1200px); intern-bio (.person__bio--intern) arver basen → følger med. Lesbredde-token (--container-text) urørt andre steder. */
}
.person__bio > :last-child { margin-bottom: 0; }

/* ---------- Eksterne lenker (UT) ---------- */
.person__links {
  margin-top: var(--space-6);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}
/* SOME (some-a): monokrome Facebook/Instagram-ikonlenker i Links-raden, samme høyde som .btn--ghost-pillene, currentColor. */
.person__some-lenke {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 999px;
  border: 1px solid var(--color-line, currentColor);
  color: inherit;
}
.person__some-lenke:hover { color: var(--color-accent, inherit); }
.person__some-ikon { display: block; width: 1.25rem; height: 1.25rem; }

/* ---------- Diskografi ---------- */
.person__section { margin-top: var(--space-8); }
.person__section-title {
  font-size: var(--fs-600);
  margin-bottom: var(--space-5);
}
.person__section-count {
  font-family: var(--font-body);
  font-size: var(--fs-300);
  font-weight: var(--fw-regular);
  color: var(--color-ink-soft);
  margin-left: var(--space-2);
}

@media (min-width: 640px) {
  .person__head { grid-template-columns: 240px 1fr; gap: var(--space-7); align-items: center; }
  /* Uten hero/portrett er .person__head-body ENESTE grid-barn → den ville auto-plassert seg i 240px-
     kolonnen og klemt h1 (navnet brytes unødvendig). Da: én kolonne, navnet bruker full bredde. */
  .person__head:not(:has(.artist-hero)):not(:has(.person__portrait)) { grid-template-columns: 1fr; }
}

/* ---------- Artistfoto: hovedportrett (4:5) ---------- */
.artist-hero {
  margin: 0;
  max-width: 320px;
}
/* GALLERI-TETRIS (2026-07-15): heroen er UBESKÅRET — hele bildet vises uansett format.
   Tidligere 4:5 + object-fit:cover beskar alt liggende hardt. max-width holder bredden. */
.artist-hero__img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--radius-md);
  background: var(--color-paper-warm);
  box-shadow: var(--shadow-sm);
}

/* ---------- Artistfoto: galleri ---------- */
/* GALLERI-TETRIS (2026-07-15): CSS-columns-masonry — bildene er UBESKÅRET (height:auto), og
   cellene pakkes tetris-aktig. Kolonnetallet + gap speiler de gamle grid-breakpointene.
   🪤 columns fyller KOLONNEVIS (topp→bunn i kol 1, så kol 2), ikke radvis — rekkefølgen leses
   vertikalt. Bevisst valgt (rekkefølge er fritt vilt); ekte radvis masonry ville krevd JS. */
.foto-galleri {
  columns: 2;
  column-gap: var(--space-4);
}
@media (min-width: 560px) {
  .foto-galleri { columns: 3; }
}
@media (min-width: 860px) {
  .foto-galleri { columns: 4; column-gap: var(--space-5); }
}
@media (min-width: 1100px) {
  .foto-galleri { columns: 5; }
}

/* break-inside: cellen (bilde + figcaption + admin-kontroller) må aldri splittes over kolonner.
   margin-bottom erstatter grid-gap-ens vertikale ledd. */
.foto-galleri__cell {
  margin: 0 0 var(--space-4);
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
}
@media (min-width: 860px) {
  .foto-galleri__cell { margin-bottom: var(--space-5); }
}

.foto-galleri__lenke {
  display: block;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-paper-warm);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--transition-fast), transform var(--transition-fast);
}
.foto-galleri__lenke:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
/* GALLERI-TETRIS: UBESKÅRET — hele bildet vises; høyden følger bildets eget format. */
.foto-galleri__img {
  width: 100%;
  height: auto;
  display: block;
}

/* ---------- Fotograf-kreditt ---------- */
.foto-kreditt {
  font-size: var(--fs-300);
  color: var(--color-ink-soft);
  margin: var(--space-1) 0 0;
}
/* Del 4b: klikkbar fotograf-kreditt (lenke til person-siden). Arver dempet farge, underline-affordans. */
.foto-kreditt__lenke {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.foto-kreditt__lenke:hover {
  color: var(--color-ink);
}
/* Foto-bildetekst: valgfri linje (hvem/hvor/bygg) under kreditt/subjekt i figcaption. */
.foto-tekst {
  display: block;
  font-style: italic;
}
.foto-tekst__lenke {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.foto-tekst__lenke:hover {
  color: var(--color-ink);
}
/* Bildetekst-redigeringspanel (gjenbruker .foto-flytt-posisjonering) + «har tekst»-markør. */
.foto-tekst-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.foto-tekst-panel__felt {
  width: 100%;
  font-family: var(--font-body);
  font-size: var(--fs-300);
  resize: vertical;
}
.foto-tekst-panel__vis {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--fs-300);
  color: var(--color-ink-soft);
}
.foto-tekst-panel__label {
  font-size: var(--fs-200);
  font-weight: 600;
  color: var(--color-ink-soft);
  margin-top: var(--space-1);
}
.foto-tekst-panel__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}
.foto-tekst-panel__chip {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 1px var(--space-1);
  border-radius: 999px;
  background: var(--color-paper-shade, #eee);
  font-size: var(--fs-200);
}
.foto-tekst-panel__chip-flytt {
  border: 0;
  background: none;
  cursor: pointer;
  font-size: var(--fs-200);
  line-height: 1;
  padding: 0 1px;
  color: var(--color-ink-soft, #666);
}
.foto-tekst-panel__chip-flytt:disabled { opacity: 0.3; cursor: default; }
.foto-tekst-panel__chip-x {
  border: 0;
  background: none;
  cursor: pointer;
  font-size: var(--fs-300);
  line-height: 1;
  padding: 0 2px;
  color: var(--color-ink-soft);
}
.foto-admin__knapp--satt {
  font-weight: 600;
}
/* HOTFIKS press kit (H144): «Photographer missing – …» ved sperret press kit-knapp */
.foto-admin__uten-fotograf {
  color: var(--color-danger);
  font-size: var(--fs-300);
}


/* ---------- Admin-kontroller (rendres kun for redaktører) ---------- */
.foto-admin {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-2);
}
.foto-admin__badge {
  font-size: var(--fs-300);
  color: var(--color-on-accent);
  background: var(--color-accent);
  border-radius: var(--radius-sm);
  padding: 0 var(--space-2);
}
/* Del 2: skjult foto (KUN intern) - rod ramme + INTERNAL-badge synlig KUN naar figuren har --skjult. */
.foto-admin__badge--internal { display: none; }
.foto-galleri__cell--skjult { position: relative; outline: 2px solid var(--color-accent); outline-offset: -2px; }
/* ETIKETT-POST: foto-galleriets INTERNAL/UNPUBLISHED bruker nå .lawo-etikett-stylingen (én variant);
   --internal beholdes KUN som display/posisjon-modifier (top-right PÅ bildet, vist kun på skjult celle). */
.foto-galleri__cell--skjult .foto-admin__badge--internal { display: inline-block; position: absolute; top: 6px; right: 6px; z-index: 2; }
.foto-admin__knapp {
  font-size: var(--fs-300);
  font-family: var(--font-body);
  color: var(--color-ink-soft);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  padding: 0 var(--space-2);
  cursor: pointer;
}
.foto-admin__knapp:hover {
  color: var(--color-ink);
  border-color: var(--color-ink-soft);
}
/* NIVÅ 3 — destruktiv (Fjern tilgang / Fjern kontakt / Slett foto): RØD FLATE, alltid — samme tokens som
   .btn--danger (base.css Nivå 3, husregel 2026-09-10). */
.foto-admin__knapp--fare,
.foto-admin__knapp--slett {
  background: var(--color-danger);
  color: var(--color-on-accent);
  border-color: var(--color-danger);
}
.foto-admin__knapp--fare:hover,
.foto-admin__knapp--slett:hover {
  background: var(--color-danger-hover);
  color: var(--color-on-accent);
  border-color: var(--color-danger-hover);
}
.foto-admin__knapp:disabled {
  opacity: 0.5;
  cursor: default;
}

/* FOTOKORT-RYDD: «⋯»-meny (native <details>, null JS). Toggle ser ut som en foto-admin__knapp;
   listen er en absolutt dropdown så den ikke dytter kort-layouten. Knapp-handlerne er delegert
   (closest('[data-lawo-foto-act]')) → virker uendret inne i menyen. */
.foto-admin__mer { position: relative; display: inline-block; }
.foto-admin__mer-toggle {
  list-style: none; cursor: pointer;
  font-size: var(--fs-300); color: var(--color-ink-soft);
  background: var(--color-paper); border: 1px solid var(--color-line);
  border-radius: var(--radius-sm); padding: 0 var(--space-2);
}
.foto-admin__mer-toggle::-webkit-details-marker { display: none; }
.foto-admin__mer-toggle::marker { content: ''; }
.foto-admin__mer-toggle:hover,
.foto-admin__mer[open] > .foto-admin__mer-toggle { color: var(--color-ink); border-color: var(--color-ink-soft); }
.foto-admin__mer-liste {
  position: absolute; z-index: 5; top: calc(100% + 2px); left: 0;
  display: flex; flex-direction: column; gap: 1px; padding: 4px;
  /* FOTO-KREDITT-BREDDE (skive 2): var min-width:max-content (arvet knapp-bredde → smal). Nå
     FORHÅNDSBRED (~40 tegn) så kreditt/caption-inputen (flex-basis:100%, width:100%) viser den
     fulle kreditten. Menyen er bred ALLEREDE ved åpning → foto-meny.js måler den og klamper left
     innenfor viewporten (ingen høyre-overflyt). Klippet til viewport på smale skjermer. */
  min-width: min(40ch, calc(100vw - 16px));
  max-width: calc(100vw - 16px);
  background: var(--color-paper); border: 1px solid var(--color-line);
  border-radius: var(--radius-sm); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.14);
}
/* Eksplisitt skjuling når lukket: absolutt-posisjonert innhold slipper unna native details-skjuling
   i enkelte motorer → uten denne ville menyen alltid vist. */
.foto-admin__mer:not([open]) .foto-admin__mer-liste { display: none; }
.foto-admin__mer-liste .foto-admin__knapp { display: block; width: 100%; text-align: left; border: 0; background: transparent; padding: 3px var(--space-2); }
.foto-admin__mer-liste .foto-admin__knapp:hover { background: #f3efe8; }

/* ---------- Interne markører (kun redaktør-visning) ---------- */
.person__role-intern {
  color: var(--color-ink-soft);
  opacity: 0.65;
}

/* Synlighets-segment + tilstands-badge i person-headeren (kun redaktører) */
.person-synlighet {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: var(--space-2) 0 0;
}
/* LWA-VIS: diskret LWA-kode først i intern-raden (raden er alt intern-gated) */
.person-lwa {
  font-size: var(--fs-300);
  color: var(--color-ink-soft, #666);
  letter-spacing: 0.03em;
}
.person-badge {
  font-size: var(--fs-300);
  border-radius: var(--radius-sm);
  padding: 0 var(--space-2);
}
.person-badge--hard {
  color: var(--color-on-accent);
  background: var(--color-accent);
}
.person-badge--soft {
  /* Gul-aktig tilstandsfarge – ingen amber-token finnes i tokens.css. */
  color: #5f4c0e;
  background: #ecdfae;
}
/* .person-segment-stilene bor i base.css – brukes også i A–Å-arkivet. */

/* ---------- Redigeringspanel for artistdetaljer (kun redaktorer) ---------- */
.person-rediger {
  margin-top: var(--space-6);
  padding: var(--space-5);
  background: var(--color-paper-warm);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
}

/* SAVEFIX: sticky Save+Cancel-stripa (body-nivå) er fjernet — dockens Save/Cancel +
   in-panel-knappene (samme data-attributter/handlers) er lagre-veiene. */
.person-rediger__tittel { font-size: var(--fs-500); margin: 0 0 var(--space-4); }
.person-rediger__felter {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-4);
}
@media (max-width: 860px) { .person-rediger__felter { grid-template-columns: 1fr; } }
.person-rediger__felt { display: flex; flex-direction: column; gap: var(--space-1); }
.person-rediger__felt--bred { grid-column: 1 / -1; }
.person-rediger__etikett {
  font-size: var(--fs-300);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-ink-soft);
}
.person-rediger__felt input,
.person-rediger__felt textarea {
  font-size: var(--fs-400);
  font-family: var(--font-body);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  background: var(--color-paper);
}
.person-rediger__tom-merke {
  display: none;
  font-size: var(--fs-300);
  text-transform: none;
  letter-spacing: 0;
  font-style: italic;
  margin-left: var(--space-1);
}
.person-rediger__felt--tom .person-rediger__tom-merke { display: inline; }
.person-rediger__felt--tom input { opacity: 0.6; }

/* Orchard-URL lengde-varsel: rent klient-side flagg. Save går uansett. */
.person-rediger__lengde-teller {
  font-size: var(--fs-300, 0.9rem);
  color: var(--color-ink-soft);
  font-weight: normal;
  margin-left: var(--space-1);
  letter-spacing: 0;
}
.person-rediger__felt--lang .person-rediger__lengde-teller {
  color: #8a5a00;
  font-weight: 600;
}
.person-rediger__felt--lang input { border-color: #ba7517; background: #fdf0d5; }

/* LISTEN-1: per-felt grå-toggle («ikke relevant»). Nøytral/dempet — mettet farge er reservert verif-prikkene. */
.utg-listen__graa {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  margin-top: var(--space-1);
  font-size: var(--fs-300);
}
.utg-listen__graa-merke {
  color: var(--color-ink-soft);
  font-style: italic;
  text-transform: none;
  letter-spacing: 0;
}
.utg-listen__graa-knapp {
  font: inherit;
  font-size: var(--fs-300);
  color: var(--color-ink-soft);
  background: transparent;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  padding: 2px var(--space-2);
  cursor: pointer;
  line-height: 1.4;
  text-transform: none;
  letter-spacing: 0;
}
.utg-listen__graa-knapp:hover { background: var(--color-line); }
.utg-listen__graa[data-lawo-graa-satt] { opacity: 0.85; }
.person-rediger__gruppe {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-3);
}
@media (max-width: 860px) { .person-rediger__gruppe { grid-template-columns: 1fr; } }
.person-rediger__gruppetittel {
  grid-column: 1 / -1;
  font-size: var(--fs-300);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-ink-soft);
  margin: var(--space-3) 0 0;
}
.person-rediger__teller { margin-left: var(--space-2); text-transform: none; letter-spacing: 0; }
.person-rediger__teller--over { color: var(--color-accent); font-weight: var(--fw-medium); }
.person-rediger__veiledning {
  font-size: var(--fs-300);
  color: var(--color-accent);
  font-style: italic;
  margin-top: var(--space-1);
}
.person-rediger__feil { color: var(--color-accent); font-size: var(--fs-400); }
/* INTAKE-AUTOSAVE: boksen «Du har et ulagret utkast …» øverst i Project intake-panelet (intake-utkast.js) */
.lawo-intake-utkast { border: 2px solid var(--color-accent); border-radius: 6px; padding: var(--space-2); margin: 0 0 var(--space-2); background: var(--color-bg-soft, #fff7f3); }
.lawo-intake-utkast p { margin: 0 0 var(--space-1); }
.person-rediger__status { color: var(--color-ink-soft); font-size: var(--fs-300); margin-left: var(--space-2); }
.person-rediger__hint { font-size: var(--fs-300); color: var(--color-ink-soft); text-transform: none; letter-spacing: 0; }

/* FASE5: verksliste på komponist-sider */
.person-verk { list-style: none; margin: 0; padding: 0; max-width: 70ch; }
.person-verk__rad { padding: var(--space-2) 0; border-bottom: 1px solid var(--color-line); }
.person-verk__tittel { font-weight: 600; }
.person-verk__satser { color: var(--color-ink-soft); font-size: var(--fs-300); margin-left: var(--space-2); }
.person-verk__innspilt { display: block; color: var(--color-ink-soft); font-size: var(--fs-300); margin-top: 2px; }
.person-verk__upub { opacity: 0.6; }

/* Foto-opplasting (kun redaktoerer) */
.foto-opplast { margin-top: var(--space-4); }
.foto-opplast__form {
  margin-top: var(--space-3);
  padding: var(--space-4);
  background: var(--color-paper-warm);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  display: grid;
  gap: var(--space-3);
  max-width: 480px;
}
.foto-opplast__felt { display: flex; flex-direction: column; gap: var(--space-1); font-size: var(--fs-300); color: var(--color-ink-soft); }
.foto-opplast__hint { margin: 0; font-size: var(--fs-300); color: var(--color-ink-soft); font-style: italic; }
.foto-opplast__handlinger { margin: 0; display: flex; align-items: center; gap: var(--space-3); }
.foto-opplast__status { font-size: var(--fs-300); color: var(--color-ink-soft); }

/* Oransje Action needed-badge (lokal oransje - ingen token, som amber) */
.person-badge--oransje {
  background: #c77700;
  color: #fff;
}
.foto-admin__knapp--action-aktiv {
  background: #c77700;
  color: #fff;
  border-color: #c77700;
}

/* Diskografi-rekkefolge-liste i panelet */
.person-rediger__disko {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-1);
}
.person-rediger__disko li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-1) var(--space-3);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
}

/* Del 2: Roles & instruments-panel (instrument-chips + rekkefølge-overlegg) */
.person-rolleux__instr,
.person-rolleux__rekke {
  margin-top: var(--space-3);
}
.person-rolleux__chips,
.person-rolleux__tokens {
  margin: var(--space-1) 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-1);
}
.person-rolleux__chips li,
.person-rolleux__tokens li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-1) var(--space-3);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
}
.person-rolleux__knapper {
  display: inline-flex;
  gap: var(--space-1);
  flex-shrink: 0;
}
.person-rolleux__avledet {
  opacity: 0.6;
  font-size: 0.85em;
}
/* Rolle-/instrument-synlighet: skjult token dempes + «Hidden»-merke (editor-only markering). */
.person-rolleux__token--skjult > span:first-child {
  opacity: 0.5;
  text-decoration: line-through;
}
.person-rolleux__skjult-merke {
  font-size: 0.7em;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: #6b6b6b;
  color: #fff;
  padding: 1px 6px;
  border-radius: 999px;
  text-decoration: none;
}
.person-rolleux__token--skjult [data-lawo-skjul-toggle] { opacity: 0.5; }
.person-rolleux__add {
  margin: var(--space-2) 0 0;
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
}

/* Del 3: Revers-proveniens (editor-only kilde-navigasjon) */
.person-proveniens__rolle {
  margin-top: var(--space-3);
}
.person-proveniens__rolle-tittel {
  margin: 0 0 var(--space-1);
}
.person-proveniens__antall {
  color: #777;
  font-size: 0.85em;
  margin-left: var(--space-2);
}
.person-proveniens__liste {
  margin: 0;
  padding: 0 0 0 var(--space-4);
  list-style: disc;
  display: grid;
  gap: 2px;
}
.person-proveniens__kilde {
  display: inline-block;
  font-size: 0.7em;
  font-weight: bold;
  letter-spacing: 0.05em;
  color: #777;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  padding: 0 4px;
  margin-left: var(--space-1);
}
.person-proveniens__skjult {
  font-size: 0.75em;
  color: var(--color-accent);
  margin-left: var(--space-1);
}
.person-proveniens__fotoantall {
  font-size: 0.8em;
  color: #777;
  margin-left: var(--space-1);
}
.person-proveniens__mer {
  list-style: none;
  color: #777;
  font-size: 0.85em;
}

/* Intern bio - dempet blokk med merke */
.person__bio--intern {
  opacity: 0.85;
  border-left: 3px solid var(--color-accent);
  padding-left: var(--space-4);
}
.person__bio-intern-merke { margin: 0 0 var(--space-2); }

/* ---------- Flytt-panel (artist-søk) ---------- */
.foto-flytt {
  flex-basis: 100%;
  margin-top: var(--space-2);
  padding: var(--space-2);
  background: var(--color-paper-warm);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
}
.foto-flytt__sok {
  width: 100%;
  font-size: var(--fs-300);
  font-family: var(--font-body);
  padding: var(--space-1) var(--space-2);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  background: var(--color-paper);
}
.foto-flytt__resultater {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  margin-top: var(--space-2);
}
.foto-flytt__valg {
  font-size: var(--fs-300);
  font-family: var(--font-body);
  text-align: left;
  color: var(--color-ink);
  background: var(--color-paper);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  padding: var(--space-1) var(--space-2);
  cursor: pointer;
}
.foto-flytt__valg:hover {
  border-color: var(--color-accent);
  color: var(--color-accent);
}
.foto-flytt__tom {
  font-size: var(--fs-300);
  color: var(--color-ink-soft);
}
/* Dialogtittel («Move photo to…» / «Copy photo to…»). */
.foto-flytt__tittel {
  display: block;
  font-size: var(--fs-300);
  font-weight: var(--fw-medium);
  margin-bottom: var(--space-2);
}
/* Gruppeoverskrift i målsøket (Artists/Releases). */
.foto-flytt__gruppe {
  font-size: var(--fs-300);
  color: var(--color-ink-soft);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: var(--space-1);
}
/* Diskré «From: <hjem>»-merke på gjestefoto (kun redaktører). */
.foto-admin__badge--gjest {
  color: var(--color-ink-soft);
  background: var(--color-paper-warm);
  border: 1px solid var(--color-line);
}

/* HERO-I-GALLERI: «Hovedbilde»-merke på hero-kortet. FOTOKORT-RYDD: dempet (var mørk/versal og
   dominerte), stille etikett øverst til VENSTRE PÅ bildet — lys bg, hårfin ramme, dempet tekst.
   left:34px klarerer bulk-velg-checkboxen (top-left). .foto-galleri__cell er position:relative. */
.foto-admin__badge--hovedbilde {
  position: absolute; top: 6px; left: 34px; z-index: 2;
  background: rgba(255, 255, 255, 0.92);
  color: var(--color-ink-soft);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  font-weight: var(--fw-regular);
  text-transform: none;
  letter-spacing: 0;
  padding: 1px 6px;
  font-size: var(--fs-200, 0.8rem);
}

/* ---------- MIN-SIDE-KOLLAPS (2026-07-24): tre <details>-seksjoner med klikkbar banner-summary; native, null JS ---------- */
.min-side-seksjon { border: 1px solid var(--farge-kant, #e5e3df); border-radius: 8px; margin: var(--space-3) 0; background: #fff; }
.min-side-banner { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 8px; padding: 10px 12px; font-size: 1.05em; font-weight: 600; }
.min-side-banner::-webkit-details-marker { display: none; }
.min-side-banner::before { content: "\25B8"; font-size: 0.85em; color: var(--color-ink-soft, #8a8580); }
.min-side-seksjon[open] > .min-side-banner::before { content: "\25BE"; }
.min-side-seksjon[open] > .min-side-banner { border-bottom: 1px solid var(--farge-kant, #e5e3df); }
.min-side-seksjon > :not(summary) { margin: 10px 12px; }

/* ---------- BIO-KOPI-DIFF (2026-07-24): rødt = nytt/endret ord i redaktørens diff-visning av bio-
   forslaget (semantisk klasse, additiv). Kopi-knapp-rad under forslag-feltet. ---------- */
.bio-diff-ny { color: #b3261e; }
.person__bio-forslag-kopi { margin: var(--space-2) 0 0; }

/* «Confidential»-merket bruker nå .lawo-etikett .lawo-etikett--fare (dempet rød tekst + rød-tonet
   ramme, ingen rød flate). Den gamle #b3261e-flaten er fjernet (ETIKETT-POST). */

/* ---------- STRUKTUR-f: royalty-fordeling (KONFIDENSIELT, kun i Edit details) ---------- */
.royalty__rader { display: grid; gap: 6px; }
.royalty__rad { display: flex; align-items: center; gap: 8px; }
.royalty__navn { flex: 1; min-width: 0; }
.royalty__prosent { width: 6.5em; }
.royalty__sok { margin-top: var(--space-2); }
.royalty__sok input { width: 100%; }
.royalty__treff { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.royalty__sum { margin: var(--space-2) 0 0; font-weight: 600; }
.royalty__sum--ok { color: var(--color-ink); } /* STATUSSPRÅK: sum-ok = nøytral, ikke grønn */
.royalty__sum--over { color: #b3261e; }
.royalty__sum--under { color: #9a6a00; }
.royalty__status { color: #b3261e; font-size: var(--fs-300); }

/* ---------- Godkjenning: status-lys (presentasjon) — speiler royalty-trafikklyset ---------- */
.godkjenning-rad__status--ok { color: var(--color-ink, #1a1a1a); } /* FARGEDISIPLIN: dempet nøytral markør (✓ + ●-glyf bærer «godkjent»); grønn droppet — den kolliderte med verifisert */
.godkjenning-rad__status--venter { color: #9a6a00; }                    /* amber = venter (som royalty--under) */
.godkjenning-rad__lys { font-size: 0.85em; line-height: 1; }            /* ●-prikk arver status-fargen (currentColor) */

/* ---------- Contact (internal) – konfidensiell seksjon (kun redaktører) ---------- */
.person-kontakt__intro {
  color: var(--color-ink-soft);
  font-size: var(--fs-300);
  margin: 0 0 var(--space-4);
}
.person-kontakt__blokk { margin-bottom: var(--space-4); }
.person-kontakt__gruppetittel {
  font-size: var(--fs-300);
  color: var(--color-ink-soft);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 var(--space-2);
}
.person-kontakt__felt {
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
  padding: var(--space-1) 0;
  flex-wrap: wrap;
}
.person-kontakt__etikett {
  min-width: 9rem;
  color: var(--color-ink-soft);
  font-size: var(--fs-300);
}
.person-kontakt__verdi {
  font-family: var(--font-body);
  /* Ren tekst – aldri mailto:/tel:-lenke (referrer/historikk-hygiene). */
  user-select: all;
}
.person-kontakt__tom {
  color: var(--color-ink-soft);
  opacity: 0.65;
  font-style: italic;
  font-size: var(--fs-300);
}
.person-kontakt__kopier { margin-left: var(--space-2); }
.person-kontakt__mailto { margin-left: var(--space-2); text-decoration: none; }

/* ---------- KONTAKT-INLINE (bolk 1): view↔edit på personsiden ---------- */
.person-kontakt__rediger { margin-left: var(--space-2); }
.person-kontakt__edit { display: flex; flex-wrap: wrap; gap: var(--space-1); align-items: center; }
.person-kontakt__edit input[type="text"] { min-width: 18rem; }
.person-kontakt__edit textarea { min-width: 18rem; }
.person-kontakt__status { font-size: var(--fs-300); color: var(--color-ink-soft); }
/* Valideringsfeil (ugyldig e-post) er ikke «svak» tekst – den må leses. */
.person-kontakt__status:not(:empty) { color: var(--color-danger); }
.person-kontakt__kp-rad {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--space-1);
  margin-bottom: var(--space-1);
  align-items: center;
}
.person-kontakt__kp-lenker { display: flex; gap: var(--space-1); align-items: center; }

/* ---------- BOLK 3: Management som org-relasjon (to-lags) ---------- */
.person-kontakt__org-chip { font-weight: 600; }
.person-kontakt__org-chip a { text-decoration: none; }
.person-kontakt__org-chip small { font-weight: 400; color: var(--color-ink-soft); }
/* «Ikke migrert» skal SES — det er en arbeidsoppgave, ikke en dekorasjon. */
.person-kontakt__ikke-migrert {
  margin-left: var(--space-1);
  background: var(--farge-advarsel, #b45309);
  color: #fff;
  cursor: help;
}
.person-kontakt__legacy-note { font-size: var(--fs-300); color: var(--color-ink-soft); font-style: italic; }
/* Søketreff: relativt til edit-blokka, over resten av seksjonen. */
.person-kontakt__edit { position: relative; }
.person-kontakt__treff {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 20;
  min-width: 22rem;
  max-height: 16rem;
  overflow-y: auto;
  background: var(--color-bg, #fff);
  border: 1px solid var(--color-linje, #ddd);
  box-shadow: 0 4px 12px rgb(0 0 0 / 12%);
}
.person-kontakt__treff-rad {
  display: block;
  width: 100%;
  padding: var(--space-1) var(--space-2);
  border: 0;
  background: none;
  text-align: left;
  cursor: pointer;
  font: inherit;
}
.person-kontakt__treff-rad:hover,
.person-kontakt__treff-rad:focus-visible { background: var(--color-flate-svak, #f2f2f2); }
/* «Opprett ny» skilles visuelt fra treffene — det er en ANNEN handling. */
.person-kontakt__treff-rad--ny {
  border-top: 1px solid var(--color-linje, #ddd);
  font-style: italic;
}
.person-kontakt__kp-handlinger { display: flex; gap: var(--space-1); align-items: center; margin-top: var(--space-2); }

/* ---------- MEDLEM-EPOST: e-postverktøy på Members (intern-gated i PHP) ---------- */
.person-medlemskap__epost { margin-top: var(--space-3); }
.person-medlemskap__dekning { color: var(--farge-tekst-svak, #666); font-size: 0.875em; }
.person-medlemskap__epost a.foto-admin__knapp { text-decoration: none; }
.person-medlemskap__epost [disabled] { opacity: 0.5; cursor: not-allowed; }

/* Toggle: begge varianter bygges serverside, CSS veksler. Ingen JS.
   Checkboxen er visuelt skjult, men MÅ være fokuserbar (ikke display:none) – label-en er
   klikkflata, og tastaturbrukere trenger den i tab-rekkefølgen. */
.person-medlemskap__toggle {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.person-medlemskap__toggle-etikett {
  display: inline-block;
  margin-top: var(--space-3);
  font-size: 0.875em;
  cursor: pointer;
  user-select: none;
}
.person-medlemskap__toggle-etikett::before {
  content: "☐ ";
}
.person-medlemskap__toggle:checked ~ .person-medlemskap__toggle-etikett::before {
  content: "☑ ";
}
.person-medlemskap__toggle:focus-visible ~ .person-medlemskap__toggle-etikett {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
.person-medlemskap__toggle ~ .person-medlemskap__epost-variant--alle { display: none; }
.person-medlemskap__toggle:checked ~ .person-medlemskap__epost-variant--aktive { display: none; }
.person-medlemskap__toggle:checked ~ .person-medlemskap__epost-variant--alle { display: block; }

/* ---------- Oppgaveliste i panelet (delt Needs action-oppgaver) ---------- */
.oppgave-liste {
  list-style: none;
  margin: 0 0 var(--space-2);
  padding: 0;
}
.oppgave {
  display: flex;
  flex-wrap: wrap; /* Steg 1b: logg-meta wrapper til egen linje */
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) 0;
  font-size: var(--fs-300);
  border-top: 1px solid var(--color-line-soft, var(--color-line)); /* skillelinje mellom oppgaver (speiler .na-oppgave) */
}
.oppgave:first-child { border-top: 0; } /* ingen henge-divider over første */
.oppgave--ingen { color: var(--color-ink-soft); font-style: italic; }
.oppgave__rad {
  flex: 1 1 auto;            /* etiketten tar plassen, «Løst»-knappen til høyre */
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  cursor: pointer;
}
.oppgave__loest {
  flex: 0 0 auto;
  padding: 2px var(--space-2);
  font-size: var(--fs-200, 0.8rem);
}
.oppgave--gjort {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2);
  color: var(--color-ink-soft);
}
.oppgave--gjort .oppgave__tekst { text-decoration: line-through; }
.oppgave__meta { color: var(--color-ink-soft); font-size: var(--fs-200, 0.8rem); flex-basis: 100%; } /* Steg 1b: logg på egen linje */
.oppgave__reopen {
  font: inherit;
  font-size: var(--fs-300);
  color: var(--color-accent);
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
}
.oppgave-add {
  display: flex;
  gap: var(--space-2);
  align-items: center;
  margin: var(--space-2) 0;
}
.oppgave-add__felt {
  flex: 1 1 auto;
  min-width: 0;
  padding: var(--space-1) var(--space-2);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  font: inherit;
  font-size: var(--fs-300);
}
.oppgave-vis-utfoerte { margin-top: var(--space-1); }
.oppgave-liste--utfoert { margin-top: var(--space-2); }


/* ── Foto bulk-handlinger (BUILD 2): verktøylinje + per-bilde velg-checkbox ── */
.foto-bulk { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 14px; padding: 8px 12px; background: #f4f4f4; border-radius: 8px; font-size: .9em; }
.foto-bulk__teller { color: #666; }
.foto-bulk__handlinger { display: flex; flex-wrap: wrap; gap: 6px; }
.foto-bulk__maal { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-start; }
.foto-bulk__maal-res { display: flex; flex-wrap: wrap; gap: 4px; }
.foto-bulk__maal-valg { background: #fff; border: 1px solid #ccc; border-radius: 5px; padding: 3px 8px; cursor: pointer; font-size: .85em; }
.foto-bulk__status { flex-basis: 100%; color: #1f4f7a; min-height: 1em; }
.foto-galleri__cell { position: relative; }
.foto-bulk-velg { position: absolute; top: 6px; left: 6px; z-index: 3; background: rgba(255,255,255,.85); border-radius: 4px; padding: 2px 3px; line-height: 0; }

/* ---------- GODKJENT-PRIKK (bolk 2): redaksjonelt vedtak ----------
   Samme visuelle familie som .lawo-prikk (Public/Unlisted/Hidden). Oransje/brun = ikke
   godkjent (default), grønn = godkjent. Prikken er en KNAPP når brukeren kan godkjenne,
   ellers et span (status er informasjon, ikke bare kontroll). */
.lawo-gp-prikk { border: 0; padding: 0; background: none; }
button.lawo-gp-prikk { cursor: pointer; }
button.lawo-gp-prikk:disabled { cursor: wait; opacity: 0.5; }
.lawo-gp-prikk--venter { background: transparent; box-shadow: inset 0 0 0 1.5px var(--color-ink-soft, #555); } /* STATUSSPRÅK: hul ○ = venter (gp-godkjent søsken av ●-ok); bort fra verif-rød #b45309 */
button.lawo-gp-prikk:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Godkjenningsloggen i Edit details */
.gp-logg { list-style: none; margin: var(--space-2) 0 0; padding: 0; font-size: var(--fs-300); }
.gp-logg li { padding: var(--space-1) 0; border-bottom: 1px solid var(--color-linje-svak, #eee); }
.gp-logg__tid { color: var(--color-ink-soft); font-variant-numeric: tabular-nums; margin-right: var(--space-1); }

/* LAWO-MERKE 39: eyebrow over navnet — nøytral etikett (ALDRI mettet verif-/tilstandsfarge)
   + intern flip-knappens aktiv-markør. Offentlig-lastet fil: merket kan bli offentlig
   (LAWO_MERKE_OFFENTLIG); klassen er inert til elementet rendres. */
.person-merke { margin: 0 0 2px; font-size: .78em; letter-spacing: .08em; text-transform: uppercase; color: var(--color-ink-soft, #6b6355); }
.person-merke-flip--aktiv { outline: 2px solid var(--color-line, #c9bfaf); }

/* LWA-H2-NAVN: overskriftene baerer naa navnet (sprintf) -> lange navn (opptil 134 tegn)
   maa brytes saa de ikke gir horisontal overflow paa smale skjermer. */
.person h2, .person h3 { overflow-wrap: anywhere; }

/* VERK-LENKE: verk-tittel er klikkbar (KUN intern) til /verk-oversikt/?lww=…#lww-… —
   arver tittelens farge, underline paa hover for klikk-signal. */
.person-verk__tittel a { color: inherit; text-decoration: none; }
.person-verk__tittel a:hover, .person-verk__tittel a:focus-visible { text-decoration: underline; }
