.store-guide-shell {
  --store-purple: #70567d;
  --store-green: #3f735f;
  --store-orange: #a34f3e;
  --store-pale: color-mix(in srgb, var(--store-purple) 8%, var(--site-bg));
}

:root[data-theme="dark"] .store-guide-shell {
  --store-purple: #c2a7ce;
  --store-green: #8fc2a9;
  --store-orange: #ec9585;
  --store-pale: color-mix(in srgb, var(--store-purple) 10%, var(--site-bg));
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .store-guide-shell {
    --store-purple: #c2a7ce;
    --store-green: #8fc2a9;
    --store-orange: #ec9585;
    --store-pale: color-mix(in srgb, var(--store-purple) 10%, var(--site-bg));
  }
}

.store-guide-shell *,
.store-guide-shell *::before,
.store-guide-shell *::after { box-sizing: border-box; }

.store-guide { margin-top: 1rem; }

.store-header {
  padding: clamp(2.8rem, 9vw, 5.2rem) 0 clamp(2.5rem, 7vw, 4rem);
  border-bottom: 1px solid var(--site-border);
}

.store-backlink {
  color: var(--site-text-muted);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-decoration: none;
  text-transform: uppercase;
}

.store-backlink:hover { color: var(--store-purple); }

.store-header h1 {
  max-width: 38rem;
  margin: 1.25rem 0 0;
  font-size: clamp(3rem, 10vw, 5rem);
  letter-spacing: .02em;
  line-height: .94;
}

.store-deck {
  max-width: 37rem;
  margin: 1.6rem 0 0;
  color: var(--site-text-secondary);
  font-size: clamp(1.05rem, 2.5vw, 1.25rem);
  line-height: 1.6;
}

.store-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem 1.25rem;
  margin-top: 2rem;
  color: var(--site-text-muted);
  font-size: .7rem;
}

.store-meta span + span::before { content: "·"; margin-right: 1.25rem; }

.store-prose { font-size: 1rem; line-height: 1.75; }

.store-prose section {
  padding: clamp(3rem, 8vw, 4.8rem) 0;
  border-bottom: 1px solid var(--site-border);
}

.store-prose h2,
.store-sources h2 {
  margin: 0 0 1.2rem;
  font-family: var(--site-font-body);
  font-size: clamp(1.45rem, 4vw, 1.85rem);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.2;
}

.store-prose p { margin: 1rem 0; }
.store-prose code,
.store-sources code {
  border-radius: 3px;
  padding: .12em .34em;
  background: var(--site-code-bg);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: .86em;
}

.store-lede {
  margin-top: 0 !important;
  font-size: clamp(1.22rem, 3.5vw, 1.48rem);
  letter-spacing: -.02em;
  line-height: 1.5;
}

.store-stack-figure,
.store-race-figure,
.store-history-figure {
  margin: 2.25rem 0 0;
  border-top: 1px solid var(--site-border);
}

.store-stack-layer {
  display: grid;
  grid-template-columns: 7rem 1fr;
  gap: .25rem 1.25rem;
  border-bottom: 1px solid var(--site-border);
  padding: 1.15rem 0;
}

.store-stack-layer > strong { font-size: 1rem; }
.store-stack-layer > p { grid-column: 2; margin: 0; color: var(--site-text-muted); font-size: .82rem; line-height: 1.5; }
.store-stack-callers > div { display: flex; flex-wrap: wrap; gap: .4rem; }
.store-stack-callers > div span { border: 1px solid var(--site-border); border-radius: 999px; padding: .12rem .55rem; font-size: .75rem; }
.store-layer-label { color: var(--site-text-muted); font-size: .65rem; font-weight: 700; letter-spacing: .1em; }

.store-contract-line {
  display: grid;
  grid-template-columns: 7rem 1fr;
  gap: .2rem 1.25rem;
  margin: 0;
  border-bottom: 1px solid var(--store-purple);
  padding: 1rem 0;
  color: var(--store-purple);
}

.store-contract-line span { font-weight: 700; }
.store-contract-line small { grid-column: 2; font-size: .72rem; }
.store-stack-adapter { background: linear-gradient(90deg, var(--store-pale), transparent 70%); }

.store-stack-figure figcaption,
.store-race-figure figcaption,
.store-history-figure figcaption {
  padding: .85rem 0;
  color: var(--site-text-muted);
  font-size: .74rem;
  line-height: 1.55;
}

.store-equation {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr;
  align-items: stretch;
  margin: 2rem 0;
  border-top: 1px solid var(--site-border);
  border-bottom: 1px solid var(--site-border);
}

.store-equation span { display: grid; place-items: center; min-height: 6rem; padding: .8rem; text-align: center; font-size: .8rem; font-weight: 600; line-height: 1.35; }
.store-equation span:first-child { color: var(--store-purple); }
.store-equation b { display: grid; place-items: center; color: var(--site-text-muted); font-size: 1.1rem; font-weight: 400; }

.store-race-figure {
  display: grid;
  grid-template-columns: 1fr 2rem 1fr;
  gap: 0 1rem;
}

.race-column { display: grid; align-content: start; gap: .65rem; padding: 1.4rem 0; }
.race-column > span { border-left: 2px solid var(--site-border); padding-left: .7rem; color: var(--site-text-muted); font-size: .8rem; }
.race-column .race-insert { border-color: var(--store-orange); color: var(--store-orange); }
.race-time { display: flex; flex-direction: column; align-items: center; padding: 1.4rem 0; color: var(--site-text-muted); font-size: .62rem; }
.race-time i { width: 1px; min-height: 4.5rem; flex: 1; background: var(--site-border); }
.race-result,
.race-required { grid-column: 1 / -1; display: grid; grid-template-columns: 8.5rem 1fr; gap: 1rem; border-top: 1px solid var(--site-border); padding: .9rem 0; }
.race-result span,
.race-required span { color: var(--site-text-muted); font-size: .64rem; font-weight: 700; letter-spacing: .08em; }
.race-result strong { color: var(--store-orange); }
.race-required strong { color: var(--store-purple); }
.store-race-figure figcaption { grid-column: 1 / -1; border-top: 1px solid var(--site-border); }

.store-checks { margin: 2.1rem 0 0; border-top: 1px solid var(--site-text); }
.store-check-head,
.store-check-row { display: grid; grid-template-columns: 1.05fr 1.5fr .9fr .85fr; gap: 1rem; border-bottom: 1px solid var(--site-border); padding: .85rem 0; }
.store-check-head { color: var(--site-text-muted); font-size: .62rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.store-check-row { align-items: start; font-size: .76rem; line-height: 1.45; }
.store-check-row > span:not(.store-state) { color: var(--site-text-secondary); }
.store-state { font-weight: 700; }
.store-state-proven { color: var(--store-green); }
.store-state-gap { color: var(--store-orange); }

.store-note { margin-top: 2rem; border-left: 3px solid var(--store-purple); padding: .1rem 0 .1rem 1.1rem; }
.store-note > strong { color: var(--store-purple); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.store-note p { margin: .55rem 0 0; }

.store-history-figure { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; }
.history-current,
.history-contract { padding: 1.25rem 0 .5rem; }
.history-label { display: block; margin-bottom: .9rem; color: var(--site-text-muted); font-size: .64rem; font-weight: 700; letter-spacing: .09em; }
.history-row { display: grid; grid-template-columns: 3rem 1fr; gap: .1rem .65rem; border-left: 3px solid var(--store-purple); padding: .55rem 0 .55rem .75rem; }
.history-row small { grid-row: 1 / 3; color: var(--site-text-muted); }
.history-row span { color: var(--site-text-muted); font-size: .75rem; }
.history-row-old { opacity: .42; }
.history-overwrite { padding: .35rem 0 .35rem 3.7rem; color: var(--store-orange); font-size: .68rem; }
.history-current > p,
.history-contract > p { color: var(--site-text-muted); font-size: .76rem; line-height: 1.5; }
.store-history-figure figcaption { grid-column: 1 / -1; border-top: 1px solid var(--site-border); }

.store-change-list { margin: 2rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--site-border); }
.store-change-list li { display: grid; grid-template-columns: 2.5rem 1fr; gap: 1rem; border-bottom: 1px solid var(--site-border); padding: 1.15rem 0; }
.store-change-list li > span { color: var(--store-purple); font-size: .7rem; font-weight: 700; }
.store-change-list strong { display: block; line-height: 1.4; }
.store-change-list p { margin: .35rem 0 0; color: var(--site-text-secondary); font-size: .88rem; line-height: 1.6; }

.store-not-list { margin: 2rem 0; border-top: 1px solid var(--site-border); }
.store-not-list > div { display: grid; grid-template-columns: 11rem 1fr; gap: 1.2rem; border-bottom: 1px solid var(--site-border); padding: .95rem 0; }
.store-not-list dt { color: var(--store-purple); font-size: .82rem; font-weight: 700; }
.store-not-list dd { margin: 0; color: var(--site-text-secondary); font-size: .88rem; }
.store-conclusion { margin: 2.3rem 0 0 !important; font-size: clamp(1.2rem, 3vw, 1.4rem); line-height: 1.55; }

.store-sources { padding: 3.5rem 0 5rem; color: var(--site-text-muted); font-size: .78rem; line-height: 1.65; }
.store-sources h2 { color: var(--site-text); font-size: 1rem; }
.store-sources a { color: var(--store-purple); }

@media (max-width: 640px) {
  .store-meta { display: grid; gap: .25rem; }
  .store-meta span + span::before { content: none; }
  .store-stack-layer,
  .store-contract-line { grid-template-columns: 1fr; gap: .35rem; }
  .store-stack-layer > p,
  .store-contract-line small { grid-column: 1; }
  .store-equation { grid-template-columns: 1fr; }
  .store-equation span { min-height: auto; padding: .8rem .4rem; }
  .store-equation b { min-height: 1.6rem; }
  .store-check-head { display: none; }
  .store-check-row { grid-template-columns: 1fr; gap: .3rem; padding: 1rem 0; }
  .store-check-row > span:nth-child(2)::before { content: "Test: "; font-weight: 700; }
  .store-check-row > span:nth-child(3)::before { content: "Requires: "; font-weight: 700; }
  .store-history-figure { grid-template-columns: 1fr; }
  .history-current { border-bottom: 1px solid var(--site-border); }
  .store-not-list > div { grid-template-columns: 1fr; gap: .3rem; }
}

@media (max-width: 480px) {
  .store-race-figure { grid-template-columns: 1fr; }
  .race-time { display: none; }
  .race-result,
  .race-required { grid-column: 1; grid-template-columns: 1fr; gap: .25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .store-guide-shell * { scroll-behavior: auto !important; }
}
