.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}

#page {
  --grid: repeat(12, minmax(0, 1fr));
  max-width: 88rem;
  margin-inline: auto;
  padding-inline: var(--gutter);
}

/* Flyer bir belge degil, ust uste yapistirilmis parcalardan olusur. Bolumler
   ayni izgarayi paylasir ama her biri kendi kaymasini tasir. */
.section {
  display: grid;
  grid-template-columns: var(--grid);
  gap: 0 var(--gutter);
  padding-block: clamp(5rem, 12vh, 10rem);
  border-block-start: 3px solid var(--rule);
  position: relative;
}
.section > * { grid-column: 2 / -2; }

#hero {
  border-block-start: 0;
  min-block-size: 100svh;
  align-content: center;
}

h1.display { font-size: var(--step-5); margin-block: 0.1em 0.3em; }
h2.display { font-size: var(--step-3); margin-block-end: 1.5rem; }
.tagline { font-size: var(--step-1); max-inline-size: var(--measure); margin-block: 0 1.5rem; }
.marginalia { font-size: var(--step--1); color: var(--muted); }
.hero-foot {
  margin-block-start: 4rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 2rem;
  color: var(--muted);
}
a { color: inherit; text-decoration-thickness: 2px; text-underline-offset: 3px; }
a:hover { color: var(--accent); text-decoration-thickness: 3px; }

/* Kart bir kutu degil, yapistirilmis bir parca: kenari kalin, hizasi bozuk. */
.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: var(--gutter);
}
.card {
  border: 3px solid var(--ink);
  padding: 1rem;
}
.card-name {
  font-family: var(--display-face), Georgia, serif;
  font-size: var(--step-1);
  text-transform: uppercase;
  margin-block: 0 0.5rem;
  line-height: 1;
}
.card:hover { border-color: var(--accent); }
.card:nth-child(2n) { transform: rotate(-0.5deg) translateY(calc(var(--generation) * 5px)); }
.card:nth-child(3n) { transform: rotate(0.4deg); }

.steps { list-style: none; padding: 0; margin: 0; counter-reset: step; }
.steps li {
  counter-increment: step;
  font-size: var(--step-3);
  border-block-end: 3px solid var(--rule);
  padding-block: 0.15em;
  display: flex;
  gap: 0.5em;
  align-items: baseline;
}
.steps li::before {
  content: counter(step, decimal-leading-zero);
  color: var(--accent);
  font-family: 'Departure Mono', monospace;
  font-size: var(--step-0);
  text-transform: none;
}

.witness blockquote { margin: 0; font-size: var(--step-1); max-inline-size: var(--measure); }
.witness figcaption { margin-block-start: 1rem; display: grid; gap: 0.15rem; }
.witness-name {
  font-family: var(--display-face), Georgia, serif;
  text-transform: uppercase;
  font-size: var(--step-1);
}

.pact-cta {
  font-family: var(--display-face), Georgia, serif;
  font-size: var(--step-3);
  text-transform: uppercase;
  background: var(--ink);
  color: var(--ground);
  border: 0;
  padding: 0.25em 0.6em;
  cursor: pointer;
  line-height: 1;
}
.pact-cta:hover { background: var(--accent); }

.seal-body { max-inline-size: var(--measure); }
#seal { border-block-start-width: 8px; }

/* Anahtar bir tema dugmesi degil, fotokopi lambasi cubugudur. */
#register-toggle {
  position: fixed;
  inset-block-start: 1rem;
  inset-inline-end: 1rem;
  z-index: 30;
  inline-size: 3rem;
  block-size: 3rem;
  /* Lamba yanik durur: --accent iki kusakta da zeminden ayrilir. --field
     kullanilamaz, cunku on ikinci kusakta #111111 zemine yapisiyor. */
  background: var(--accent);
  color: var(--ground);
  border: 3px solid var(--ink);
  cursor: pointer;
  font-size: 1.25rem;
  line-height: 1;
  transition: background-color var(--transition-ms) steps(2, end);
}
#register-toggle:hover { background: var(--ink); color: var(--ground); }
#register-toggle:active { transform: translateY(2px); }
.lamp { inline-size: 1.5rem; block-size: 1.5rem; display: block; margin-inline: auto; }

@media (width < 48rem) {
  #page { --grid: 1fr; }
  .section > * { grid-column: 1; }
  .card { transform: none; }
}

/* Kat yeri iki baskıda da açılır; yanıt ve açılma durumu kaydedilmez. */
.pact-fold { min-inline-size: 0; }
.pact-cta { font-size: var(--step-1); }
.pact-cta::marker { color: currentColor; }
.pact-answer { padding-block: 2.5rem 1rem; }
.pact-answer .display { font-size: var(--step-3); margin-block-end: 1.5rem; }
.pact-answer .marginalia { margin-block-start: 2rem; }
.section > * { min-inline-size: 0; }
.display, .card-name { overflow-wrap: anywhere; }
.cards { grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }

/* İsim kelime ortasından bölünmez; poster ölçeği kullanılabilir alana iner. */
h1.display {
  font-size: clamp(1.75rem, 8vw, 7.5rem);
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
  text-wrap: balance;
}
.section > p { max-inline-size: var(--measure); }
#hero > p:not(.hero-foot):not(.tagline) { margin-block: 1rem 0; }
.reading-hint { color: var(--muted); font-size: var(--step--1); }
.document-fold { margin-block-start: 2.5rem; border-block: 2px solid var(--ink); }
.document-fold > summary {
  cursor: pointer; padding-block: 1rem;
  font-family: 'Archivo', sans-serif; font-weight: 650;
}
.document-fold > summary:hover { color: var(--accent); }
.document-fold[open] > summary { border-block-end: 1px solid var(--rule); }
.document-body { max-inline-size: var(--measure); padding-block: 1rem 2rem; }
.document-body h3 { font-size: var(--step-0); margin-block: 1.5rem 0.5rem; }
.document-reference { margin-block-start: 2rem; }
.room-plan { margin: 1.5rem 0; }
.room-plan > div { padding-block: 1rem; border-block-end: 1px solid var(--rule); }
.room-plan dt { font-weight: 700; }
.room-plan dd { margin: 0.5rem 0 0; }
.transcript-prompt { margin-block: 2rem 0.4rem; font-weight: 650; }
.transcript-prompt + p { margin-block-start: 0; }
.archive-entries { list-style: none; margin: 0; padding: 0; }
.archive-entries > li { padding-block: 0.5rem 1rem; border-block-end: 1px solid var(--rule); }
section[id] { scroll-margin-block-start: 5rem; }

/* Karbon masası: hareket ziyaretçinin elindedir, otomatik döngü yoktur. */
.carbon-workspace { padding-block: 1rem 2rem; }
.carbon-workspace > p, .carbon-transcript { max-inline-size: var(--measure); }
.carbon-plans { display: grid; gap: 1rem; }
.carbon-sheet { margin: 0; min-inline-size: 0; }
.carbon-sheet figcaption { font-size: var(--step--1); padding-block: 1rem; }
.carbon-home { color: var(--accent); }
.plan-drawing { display: block; inline-size: 100%; block-size: auto; }
.plan-drawing text { fill: currentColor; font-family: 'Archivo', sans-serif; font-size: 11px; }
[data-carbon-ready] .carbon-plans { position: relative; overflow: hidden; border-block: 1px solid var(--rule); }
[data-carbon-ready] .carbon-office { padding-block-start: 5rem; }
[data-carbon-ready] .carbon-home { position: absolute; inset: 0; padding-block-start: 5rem;  }
[data-carbon-ready] .carbon-sheet figcaption { position: absolute; inset-block-start: 0; padding-block: 0.5rem; }
[data-carbon-ready] .carbon-home figcaption { inset-block-start: 1.75rem; }
[data-carbon-ready] .carbon-home .plan-drawing { transform: translateX(var(--carbon-offset, 18%)); }
.carbon-controls { margin-block-start: 1.5rem; }
.carbon-controls[hidden], .carbon-imprint[hidden], .carbon-receipt[hidden] { display: none; }
.carbon-motion label { display: block; font-size: var(--step--1); }
.carbon-motion input { display: block; inline-size: 100%; min-block-size: 44px; accent-color: var(--accent); cursor: ew-resize; }
#carbon-align { background: var(--ink); color: var(--ground); border: 2px solid var(--ink); font: inherit; padding: 0.7rem 1rem; cursor: pointer; }
#carbon-align:hover { background: var(--accent); }
.carbon-status { min-block-size: 1.5em; }
.carbon-imprint { border-block: 1px dashed var(--ink); padding-block: 1rem; max-inline-size: var(--measure); }
.carbon-transcript { margin-block-start: 1.5rem; }
.carbon-transcript summary { cursor: pointer; padding-block: 0.7rem; text-decoration: underline; text-underline-offset: 3px; }
.carbon-receipt { border-block: 2px dashed var(--ink); padding-block: 0.75rem; margin-block: 1rem 2rem; max-inline-size: var(--measure); }
@media (prefers-reduced-motion: reduce) {
  [data-carbon-ready] .carbon-home { position: static; transform: none; padding: 0; }
  [data-carbon-ready] .carbon-office { padding: 0; }
  [data-carbon-ready] .carbon-sheet figcaption { position: static; }
  .carbon-motion { display: none; }
  [data-carbon-ready] .carbon-home .plan-drawing { transform: none; }
}

.carbon-still { display: none; }
#carbon-receipt { scroll-margin-block-start: 5rem; }
@media (prefers-reduced-motion: reduce) {
  .carbon-animated { display: none; }
  .carbon-still { display: inline; }
  p.carbon-still { display: block; }
}

/* Dökümde atlanan süre kâğıtta yer kaplar; okur beklemeye zorlanmaz. */
.record-gap { margin: 2rem 0 0; max-inline-size: var(--measure); }
.record-gap figcaption { font-weight: 650; padding-block: 0.75rem; border-block-end: 2px solid var(--ink); }
.record-interval { list-style: none; margin: 0; padding: 0; }
.record-interval li { padding-block: 1rem; font-variant-numeric: tabular-nums; font-size: var(--step--1); }
.record-interval li + li { border-block-start: 1px solid var(--rule); margin-block-start: 4rem; }
.record-gap > p { font-size: var(--step--1); }
.case-ledger { inline-size: 100%; border-collapse: collapse; table-layout: fixed; margin-block: 2rem 0; font-size: var(--step--1); }
.case-ledger caption { text-align: start; padding-block: 0.75rem; font-weight: 650; }
.case-ledger th, .case-ledger td { text-align: start; vertical-align: top; padding: 0.85rem 0.5rem; border-block-end: 1px solid var(--rule); overflow-wrap: anywhere; }
.case-ledger thead th { border-block: 2px solid var(--ink); }
.case-ledger th:first-child { inline-size: 24%; }
.case-ledger th:nth-child(2) { inline-size: 22%; }
.case-ledger tbody th, .case-ledger td:nth-child(2) { font-variant-numeric: tabular-nums; font-weight: 400; }
.ledger-note { font-size: var(--step--1); }
#ledger-interruption { scroll-margin-block-start: 5rem; }
#ledger-interruption:target { outline: 2px solid var(--accent); outline-offset: -2px; }

/* Nüsha ve işlem eki aynı kâğıt üzerindedir. */
.interval-workspace { padding-block-end: 2rem; }
.interval-workspace > p, .interval-receipt { max-inline-size: var(--measure); }
.interval-static { margin: 1.5rem 0; padding-inline-start: 1.25rem; font-variant-numeric: tabular-nums; }
.interval-static li + li { margin-block-start: 0.5rem; }
.interval-slots { display: grid; gap: 0.75rem; margin: 1.5rem 0; padding: 0; border: 0; }
.interval-slots[hidden] { display: none; }
.interval-slots label { display: grid; grid-template-columns: minmax(4rem, 0.25fr) minmax(0, 1fr); gap: 0.75rem; align-items: center; font-variant-numeric: tabular-nums; }
.interval-slots select { min-inline-size: 0; min-block-size: 44px; inline-size: 100%; border: 0; border-block-end: 1px solid var(--ink); border-radius: 0; background: var(--ground); color: var(--ink); font: inherit; padding-inline: 0.4rem; }
.interval-controls { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-block: 1.5rem 1rem; }
.interval-controls button { border: 3px double var(--accent); background: transparent; color: var(--accent); font: inherit; font-weight: 650; padding: 0.7rem 1rem; cursor: pointer; }
.interval-controls button + button { border: 0; border-block-end: 1px solid var(--ink); color: var(--ink); font-weight: 400; }
.interval-controls button:hover { background: var(--accent); color: var(--ground); }
.interval-evidence { margin: 1.5rem 0; padding: 1rem; border-inline-start: 3px solid var(--accent); border-block: 1px solid var(--rule); }
.interval-evidence figcaption { font-size: var(--step--1); }
.interval-evidence .mono { color: var(--accent); }
.interval-evidence p { overflow-wrap: anywhere; }
.interval-feedback { min-block-size: 1.5em; font-size: var(--step--1); }
.interval-receipt { border-block: 2px dashed var(--ink); padding-block: 0.75rem; margin-block: 1.5rem 0; }
.interval-log { padding: 0; list-style: none; }
.interval-log > li { padding-block: 1rem; border-block-end: 1px solid var(--rule); overflow-wrap: anywhere; }
.interval-log-heading { font-weight: 650; }
.interval-log ul { list-style: none; padding: 0; font-variant-numeric: tabular-nums; }
.interval-log ul li { padding-block: 0.25rem; }
#interval-receipt, #missing-interval { scroll-margin-block-start: 5rem; }
#interval-receipt:focus, #interval-receipt:target { outline: 2px solid var(--accent); outline-offset: 4px; }
.interval-controls[hidden], .interval-receipt[hidden], #interval-receipt-link[hidden] { display: none; }
@media (width < 30rem) { .interval-slots label { grid-template-columns: 1fr; gap: 0.3rem; } }

/* Fotoğraflar ve plan, belge akışının ana yüzeyidir. */
#hero { min-block-size: auto; padding-block: 2rem 4rem; }
#hero > h1 { grid-column: 1 / -1; font-size: clamp(2.1rem, 7.1vw, 6.8rem); line-height: 0.92; margin-block: 0.35em 0.25em; }
.hero-plate { grid-column: 1 / -1; margin: 0; position: relative; }
.photo-pair { position: relative; aspect-ratio: 2.25; overflow: hidden; background: #111; }
.photo-pair img { inline-size: 100%; block-size: 100%; object-fit: cover; object-position: center 53%; display: block; }
.photo-pair .print-copy { position: absolute; inset: 0; visibility: hidden; }
[data-theme="dark"] .photo-pair .print-copy { visibility: visible; }
[data-theme="dark"] .photo-pair .print-first { visibility: hidden; }
.plate-mark { position: absolute; inset: 1rem auto auto 1rem; background: var(--ground); color: var(--ink); padding: 0.35rem 0.65rem; border: 1px solid var(--ink); transform: rotate(-2deg); }
.hero-plate > figcaption, .evidence-photo > figcaption, .atlas-sheet > figcaption { padding-block: 0.75rem; font-size: var(--step--1); color: var(--muted); }
.photo-trace { position: absolute; inset: 39% 12% auto auto; z-index: 2; }
.photo-trace > summary { list-style: none; cursor: pointer; inline-size: 3rem; block-size: 3rem; display: grid; place-items: center; color: var(--ground); background: var(--accent); border: 3px double var(--ground); font: 650 1rem 'Archivo', sans-serif; }
.photo-trace > summary::-webkit-details-marker { display: none; }
.photo-trace[open] > summary { color: var(--accent); background: var(--ground); border-color: var(--accent); }
.photo-trace > div { position: absolute; inset: 3.6rem 0 auto auto; inline-size: min(22rem, 73vw); padding: 1rem; border: 2px solid var(--ink); background: var(--ground); color: var(--ink); box-shadow: 5px 5px 0 #111; }
.photo-trace p { margin-block: 0 1rem; }
#hero > .tagline { grid-column: 1 / 7; margin-block: 1rem 0; font-size: var(--step-1); }
#hero > .hero-foot { grid-column: 7 / -1; margin-block: 1rem 0; align-content: start; justify-content: end; font-size: var(--step--1); }
.hero-envelope { grid-column: 1 / -1; margin-block-start: 2rem; }
.evidence-exhibit { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 2.4fr) minmax(15rem, 1fr); gap: 2rem; align-items: stretch; }
.evidence-photo { margin: 0; position: relative; min-inline-size: 0; }
.evidence-photo > img { display: block; inline-size: 100%; block-size: auto; }
.evidence-markers { position: absolute; inset: 0 0 2.5rem; pointer-events: none; }
.evidence-markers button { position: absolute; pointer-events: auto; inline-size: 3rem; block-size: 3rem; border: 2px solid var(--ground); background: var(--ink); color: var(--ground); border-radius: 50%; font: 650 1rem 'Archivo', sans-serif; cursor: pointer; }
.evidence-markers button[aria-pressed="true"] { background: var(--accent); box-shadow: 0 0 0 5px var(--ground); }
.mark-measure { inset: 10% 10% auto auto; }
.mark-plan { inset: 40% 40% auto auto; }
.mark-chairs { inset: auto 10% 20% auto; }
.evidence-tray { padding: 1.5rem 0 1.5rem 1.5rem; border-inline-start: 2px solid var(--ink); min-inline-size: 0; }
.tray-label { font-size: var(--step--1); color: var(--muted); margin: 0 0 1.5rem; }
.exhibit-number { display: block; font-family: var(--display-face), Georgia, serif; font-size: clamp(5rem, 9vw, 9rem); line-height: 0.9; color: var(--accent); }
.evidence-tray h3 { font-size: var(--step-1); margin-block: 1rem; }
.evidence-tray p { max-inline-size: 30ch; }
.evidence-tray [data-panel] { padding-block-end: 1.5rem; }
.offer-records .document-body { max-inline-size: none; }
.offer-records .cards { margin-block: 2rem; }
.room-atlas { grid-column: 1 / -1; margin-block: 1rem 2rem; border: 2px solid var(--ink); background: var(--ground); }
.atlas-sheet { position: relative; margin: 0; padding: 1rem; }
.atlas-drawing { inline-size: 100%; block-size: auto; display: block; }
.atlas-room { fill: transparent; }
[data-selection="one"] .room-one, [data-selection="two"] .room-two, [data-selection="three"] .room-three { fill: var(--accent); fill-opacity: 0.16; }
.atlas-door-copy { display: none; }
[data-theme="dark"] .atlas-door-first { display: none; }
[data-theme="dark"] .atlas-door-copy { display: block; }
.atlas-fold { opacity: 0.3; }
[data-theme="dark"] .atlas-fold { opacity: 1; }
.atlas-controls { position: absolute; inset: 1rem 1rem 3.3rem; pointer-events: none; }
.atlas-controls button { position: absolute; inset-block-start: 41%; inline-size: 3.25rem; block-size: 3.25rem; transform: translate(-50%, -50%); border: 2px solid var(--ink); background: var(--ground); color: var(--ink); font: 650 1.1rem 'Archivo', sans-serif; cursor: pointer; pointer-events: auto; }
.atlas-controls button:nth-child(1) { inset-inline-start: 22%; }
.atlas-controls button:nth-child(2) { inset-inline-start: 52%; }
.atlas-controls button:nth-child(3) { inset-inline-start: 80%; }
.atlas-controls button[aria-pressed="true"] { background: var(--accent); color: var(--ground); border-color: var(--accent); }
.atlas-notes { padding: 1.5rem 2rem; border-block-start: 2px solid var(--ink); min-block-size: 10rem; }
.atlas-notes h3 { margin: 0 0 0.75rem; }
.atlas-notes p { margin: 0; max-inline-size: var(--measure); }
.atlas-notes [data-panel] + [data-panel] { margin-block-start: 1.5rem; }
[data-exhibit-ready] .atlas-notes [data-panel] { margin-block-start: 0; }
[data-panel][hidden], [data-exhibit-controls][hidden] { display: none; }
#room-atlas { scroll-margin-block-start: 5rem; }
#room-atlas:target { outline: 3px solid var(--accent); outline-offset: 5px; }
.record-gap { grid-column: 1 / -1; }
.record-interval { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 0.5rem; padding-block: 1.5rem; }
.record-interval li { min-block-size: 11rem; border: 2px solid var(--ink); display: flex; align-items: end; padding: 1rem; background: repeating-linear-gradient(90deg, transparent 0 12px, var(--rule) 12px 16px) top / 100% 8px repeat-x; }
.record-interval li + li { border-block-start: 2px solid var(--ink); margin-block-start: 0; }
.record-interval li:nth-child(2) { background-color: var(--ink); color: var(--ground); border: 4px double var(--ground); outline: 1px solid var(--ink); }
@media (width < 64rem) {
  .evidence-exhibit { grid-template-columns: 1fr; gap: 0; }
  .evidence-tray { border-inline-start: 0; border-block-start: 2px solid var(--ink); padding: 1.5rem 0; }
  .evidence-tray [data-panel] { min-block-size: 11rem; }
  .exhibit-number { float: left; margin-inline-end: 1.5rem; }
  .evidence-tray p { max-inline-size: var(--measure); }
}
@media (width < 48rem) {
  #hero > h1 { font-size: clamp(2rem, 10vw, 4rem); }
  #hero > .tagline, #hero > .hero-foot { grid-column: 1; }
  #hero > .hero-foot { justify-content: start; margin-block: 1rem; }
  .photo-pair { aspect-ratio: 1.2; }
  .photo-pair img { object-position: 57% center; }
  .hero-plate > figcaption { max-inline-size: 40ch; }
  .plate-mark { font-size: 0.7rem; inset-block-start: 0.65rem; inset-inline-start: 0.65rem; }
  .photo-trace { inset-inline-end: 9%; inset-block-start: 35%; }
  .evidence-exhibit, .room-atlas, .hero-plate, .record-gap { grid-column: 1; }
  .atlas-sheet { padding: 0.35rem; }
  .atlas-controls { inset: 0.35rem 0.35rem 4rem; }
  .atlas-controls button { inline-size: 2.75rem; block-size: 2.75rem; font-size: 0.9rem; }
  .atlas-notes { padding: 1rem; }
  .atlas-sheet > figcaption { padding-inline: 0.5rem; }
  .record-interval { grid-template-columns: 1fr; }
  .record-interval li { min-block-size: 5rem; }
  .record-interval li:nth-child(2) { min-block-size: 11rem; }
}