/* Shared marketing base for / and Trust/Privacy/Terms. Landing-only rules hang off body.market. */
:root {
  --gold: #ffd700;
  --gold-ink: #8a6900;
  --gold-edge: #c9a227;
  --ink: #153638;
  --muted: #667577;
  --green: #067b63;
  --red: #c75036;
  --line: #dbe2df;
  --ivory: #f5f8f6;
  --surface: #fff;
  --marble: url("/p/assets/marble.jpg");
}
* { box-sizing: border-box }
html { scroll-behavior: smooth }
body {
  margin: 0;
  color: var(--ink);
  font: 16px/1.55 Inter, system-ui, sans-serif;
  background-color: var(--ivory);
  background-image: linear-gradient(#f7faf8ee, #f7faf8ee), var(--marble);
  background-size: auto, 1024px;
}
a { color: inherit; text-decoration: none }
.skip {
  position: absolute;
  left: -999px;
  top: 8px;
  background: #fff;
  padding: 10px 14px;
  z-index: 20;
}
.skip:focus { left: 8px }
.sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 18px 32px;
  border-bottom: 2px solid var(--gold);
  background: linear-gradient(90deg, #ffffffee, #fffffff4), var(--marble) center / cover;
}
.brand {
  font: 700 22px Cinzel, Georgia, serif;
  letter-spacing: .04em;
  line-height: 1;
}
.brand small {
  display: block;
  margin-top: 5px;
  font: 500 8px/1 "JetBrains Mono", monospace;
  letter-spacing: .18em;
  color: var(--muted);
}
header nav { display: flex; gap: 22px; font-size: 13px; font-weight: 600; flex-wrap: wrap }
header nav a:hover, header nav a:focus-visible { color: var(--green) }
main { max-width: 920px; margin: 0 auto; padding: 48px 24px 80px }
.market main { max-width: 1080px; padding: 48px 24px 72px }
.eyebrow {
  font: 500 11px/1.4 "JetBrains Mono", monospace;
  letter-spacing: .14em;
  color: var(--gold-ink);
  margin: 0 0 10px;
}
h1 {
  font: 700 clamp(32px, 5vw, 52px)/1.15 Cinzel, Georgia, serif;
  margin: 8px 0 16px;
}
h1:after {
  content: "";
  display: block;
  width: 72px;
  height: 3px;
  margin-top: 16px;
  background: linear-gradient(90deg, var(--gold), #fff4b0);
}
.lede { font-size: 18px; color: #3d5554; max-width: 42rem }
.lede b { font-weight: 650 }
.join {
  display: flex;
  gap: 8px;
  margin: 28px 0 10px;
  flex-wrap: wrap;
  max-width: 560px;
  padding: 8px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 2px solid var(--gold);
  border-radius: 8px;
}
.join input {
  flex: 1;
  min-width: 200px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font: inherit;
  background: #fff;
}
.join input:focus { outline: 2px solid var(--green); outline-offset: 1px }
.join button, .join-again {
  background: var(--green);
  color: #fff;
  border: 1px solid var(--gold);
  border-radius: 6px;
  padding: 12px 18px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px #fff6;
}
.join button:hover, .join-again:hover { background: #066651 }
.join button:disabled { opacity: .65; cursor: wait }
.fine, .status { font-size: 12px; color: var(--muted) }
.status { margin: 8px 0 0 }
.status.error { color: var(--red) }
.status.ok { color: var(--green) }
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin: 48px 0;
}
article {
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 2px solid var(--gold);
  padding: 20px;
  border-radius: 8px;
}
h2 { font: 600 18px Cinzel, Georgia, serif; margin: 0 0 8px }
ul { padding-left: 1.2rem; color: #3d5554 }
header nav a[href="#join"] { color: var(--green) }

.market .pledges {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 48px 0 8px;
}
.market .pledges article { padding: 18px 18px 16px }
.market .pledges p, .market .sample p, .market .walls li { color: #3d5554; margin: 0 }
.market .pledges p, .market .sample aside p, .market .sample aside li { font-size: 13px; line-height: 1.55 }
.market .section-head { margin: 56px 0 18px }
.market .walls .section-head { margin: 0 0 16px }
.market .section-head h2 { font-size: 22px }
.market .section-head p { color: #3d5554; max-width: 40rem; margin: 0 }
.market .section-head a { text-decoration: underline; text-underline-offset: 3px }

.desk-shell {
  background: linear-gradient(#fffffff4, #fffffff0), var(--marble) center / cover;
  border: 1px solid var(--gold-edge);
  border-radius: 8px;
  box-shadow: 0 3px 0 #dddeda, 0 4px 0 #e0c955, 0 16px 32px #19332b0c;
  overflow: hidden;
  position: relative;
}
.desk-radio {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
.desk-chrome {
  display: flex;
  gap: 18px;
  align-items: center;
  flex-wrap: wrap;
  padding: 12px 18px;
  border-bottom: 2px solid var(--gold);
  background: #fff;
  font: 600 11px Inter, sans-serif;
  color: #4a6361;
}
.desk-mark {
  font: 700 13px Cinzel, Georgia, serif;
  letter-spacing: .08em;
  color: var(--ink);
}
.desk-stamp {
  margin-left: auto;
  font: 500 9px/1.4 "JetBrains Mono", monospace;
  letter-spacing: .06em;
  color: var(--gold-ink);
}
.desk-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--line);
  background: #fff;
  padding: 0 8px;
}
.desk-tabs label {
  padding: 12px 20px;
  font-size: 13px;
  font-weight: 650;
  cursor: pointer;
  border-bottom: 3px solid transparent;
  color: #4d6563;
}
.desk-tabs label:hover { color: var(--green) }
.desk-tabs label:focus-visible { outline: 2px solid var(--green); outline-offset: -2px }
.desk-shell:has(#tab-world:checked) label[for="tab-world"],
.desk-shell:has(#tab-energy:checked) label[for="tab-energy"],
.desk-shell:has(#tab-evaluate:checked) label[for="tab-evaluate"] {
  color: var(--green);
  border-bottom-color: var(--gold);
  background: linear-gradient(0deg, #f9fbf2, transparent);
}
.market .pane {
  display: none;
  gap: 0;
  background: #fff;
  border: 0;
  border-radius: 0;
  padding: 0;
}
.desk-shell:has(#tab-world:checked) .pane-world,
.desk-shell:has(#tab-energy:checked) .pane-energy,
.desk-shell:has(#tab-evaluate:checked) .pane-evaluate {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(240px, .9fr);
}
.atlas-stage, .energy-plate, .eval-plate {
  min-height: 280px;
  border-right: 1px solid var(--line);
  background: radial-gradient(ellipse at 50% 40%, #f3fcfd, #d6eaf0 72%, #c8e1e8);
}
.market .sample aside {
  border-radius: 0;
  border: 0;
}
.market .sample aside ul { margin: 12px 0 0; padding-left: 1.1rem }
.market .sample aside li + li { margin-top: 6px }
.market .sample h3 { font: 600 16px Cinzel, Georgia, serif; margin: 0 0 8px }

.atlas-svg { display: block; width: 100%; height: auto }
.atlas-ocean { fill: #e9f5f7; stroke: #aac9d1 }
.atlas-grat line { stroke: #a5c1c4; stroke-width: .6; stroke-opacity: .45 }
.atlas-land path { fill: #d4e3d2; stroke: #789e9b; stroke-width: 1 }
.atlas-land path.selected { fill: #74c8b5; stroke: #af8100; stroke-width: 1.6 }
.atlas-route { fill: none; stroke: #039eba; stroke-width: 1.6; stroke-dasharray: 6 4 }
.atlas-node { fill: #fff; stroke: #12879b; stroke-width: 1.5 }
.map-key {
  display: flex;
  gap: 14px;
  align-items: center;
  font: 10px/1 Inter, sans-serif;
  color: #3c6363;
  padding: 8px 14px 12px;
  margin: 0;
}
.map-key i {
  width: 8px;
  height: 8px;
  display: inline-block;
  margin-right: 5px;
  border-radius: 2px;
  border: 1px solid #8ca6a2;
}
.map-key .pos { background: #74c8b5 }
.map-key .neg { background: #e7a18b }
.map-key .miss { background: #e4e8e0 }

.energy-plate {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 28px 18px;
  background: linear-gradient(#f7fcfb, #e7f2ee);
}
.energy-plate .node {
  background: #fff;
  border: 1px solid #b7d0c8;
  border-radius: 6px;
  padding: 10px 12px;
  min-width: 108px;
  text-align: center;
}
.energy-plate .node b {
  display: block;
  font: 600 12px "JetBrains Mono", monospace;
}
.energy-plate .node span {
  display: block;
  margin-top: 4px;
  font-size: 10px;
  color: var(--muted);
}
.energy-plate .reserve { border-color: #15905c; background: #eefaf3 }
.energy-plate .run {
  width: 42px;
  height: 0;
  border-top: 3px solid #00855b;
  margin: 0 6px;
}
.energy-plate .run.marine { border-top: 3px dashed #0296bc }
.energy-plate .run.chain { border-top: 3px solid #bf9300 }

.eval-plate {
  padding: 22px 20px;
  background: linear-gradient(#fffffff6, #f4faf6);
}
.grade-card { display: flex; gap: 16px; align-items: flex-start }
.grade {
  font: 700 34px/1 Cinzel, Georgia, serif;
  color: #806500;
  border: 1px solid var(--gold);
  background: #fffef6;
  min-width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  flex: none;
}
.eval-cols {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.eval-cols li {
  font-size: 12px;
  color: #3d5554;
  border-top: 1px solid var(--line);
  padding-top: 10px;
}
.eval-cols b {
  display: block;
  font: 500 12px "JetBrains Mono", monospace;
  color: var(--gold-ink);
  margin-bottom: 4px;
}

.market .receipt table {
  width: 100%;
  border-collapse: collapse;
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 2px solid var(--gold);
  border-radius: 8px;
  overflow: hidden;
  font-size: 14px;
}
.market .receipt th, .market .receipt td {
  text-align: left;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.market .receipt th {
  font: 500 10px/1.4 "JetBrains Mono", monospace;
  letter-spacing: .08em;
  color: var(--gold-ink);
  background: #fffdf4;
}
.market .receipt td:first-child { font-weight: 650; width: 28% }
.market .receipt td:last-child {
  font: 500 12px "JetBrains Mono", monospace;
  color: var(--green);
  width: 18%;
}
.market .receipt .not-sold td { color: #5a6e6c }
.market .receipt .not-sold td:last-child { color: var(--red) }

.market .walls {
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 2px solid var(--gold);
  border-radius: 8px;
  padding: 22px 22px 20px;
}
.market .walls ul { margin: 0 }
.market .walls li + li { margin-top: 8px }
.close-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin: 22px 0 0;
}
.join-again { display: inline-block }
.quiet {
  font-size: 13px;
  font-weight: 600;
  color: var(--green);
  text-decoration: underline;
  text-underline-offset: 3px;
}

footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 20px 32px;
  border-top: 1px solid var(--line);
  background: linear-gradient(90deg, #ffffffec, #fffffff5), var(--marble) center / cover;
  font-size: 12px;
  color: var(--muted);
}
.market footer {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 16px 28px;
  align-items: center;
  padding: 22px 32px 28px;
}
.foot-brand b {
  display: block;
  font: 700 14px Cinzel, Georgia, serif;
  color: var(--ink);
}
.market footer nav { display: flex; gap: 18px; font-weight: 600 }
.market footer nav a:hover { color: var(--green) }
.market footer p { margin: 0 }

:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px }

@media (max-width: 900px) {
  .market .pledges { grid-template-columns: 1fr 1fr }
  .desk-shell:has(#tab-world:checked) .pane-world,
  .desk-shell:has(#tab-energy:checked) .pane-energy,
  .desk-shell:has(#tab-evaluate:checked) .pane-evaluate {
    grid-template-columns: 1fr;
  }
  .atlas-stage, .energy-plate, .eval-plate { border-right: 0; border-bottom: 1px solid var(--line) }
  .market footer { grid-template-columns: 1fr }
}
@media (max-width: 640px) {
  header { flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px 18px }
  main, .market main { padding: 32px 16px 56px }
  .market .pledges { grid-template-columns: 1fr }
  .desk-stamp { margin-left: 0; flex-basis: 100% }
  .desk-tabs label { padding: 10px 12px; font-size: 12px }
  .market .receipt td, .market .receipt th { padding: 10px 12px }
  .market .receipt td:first-child, .market .receipt td:last-child { width: auto }
  footer, .market footer { flex-direction: column; grid-template-columns: 1fr }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto }
  * { transition: none !important }
}
