:root {
  color-scheme:dark;
  --paper:#071012;
  --surface:#102b25;
  --ink:#ecf8f7;
  --muted:#a7bfbd;
  --blue:#75f7e6;
  --blue-dark:#a9fff4;
  --blue-wash:#173c34;
  --clay:#ffbd61;
  --line:#31534a;
  --line-strong:#63877b;
  --shadow:0 28px 78px rgba(0,0,0,.28);
  --radius:18px;
  --sans:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --serif:Georgia,Charter,"Times New Roman",serif
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:auto
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased
}
button,input,textarea {
  font:inherit
}
button {
  cursor:pointer
}
a {
  color:var(--blue);
  text-decoration-thickness:1.4px;
  text-underline-offset:3px
}
a:hover {
  color:var(--blue-dark)
}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible {
  outline:3px solid var(--blue);
  outline-offset:3px
}
img,svg {
  max-width:100%
}
.visually-hidden {
  position:absolute!important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0
}
h1,h2,h3,p {
  margin-top:0
}
h1,h2,h3 {
  line-height:1.1
}
h1,h2,.display {
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-.04em
}
h1 {
  font-size:clamp(3.1rem,6.6vw,6.5rem)
}
h2 {
  font-size:clamp(2.25rem,4.3vw,4.3rem)
}
h3 {
  font-size:clamp(1.45rem,2.2vw,2.25rem)
}
p {
  max-width:70ch
}
.wrap {
  width:min(100% - 48px,1220px);
  margin-inline:auto
}
.skip-link {
  position:absolute;
  top:-100px;
  left:14px;
  z-index:100;
  padding:12px 16px;
  background:var(--blue);
  color:#ecf8f7
}
.skip-link:focus {
  top:12px;
  color:#ecf8f7
}
.eyebrow,.kicker {
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase
}
.eyebrow {
  color:var(--clay)
}
.prototype-bar {
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  background:#15352f;
  color:#a7bfbd;
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-align:center;
  padding:6px 15px
}
.prototype-dot {
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--clay);
  display:inline-block
}
.bar-separator {
  color:#a7bfbd
}
.site-header {
  position:sticky;
  top:0;
  z-index:30;
  background:rgba(247,244,236,.96);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(14px)
}
.header-inner {
  min-height:88px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
.brand {
  display:flex;
  gap:11px;
  align-items:center;
  text-decoration:none;
  color:var(--ink);
  flex-shrink:0
}
.brand:hover {
  color:var(--ink)
}
.brand-mark {
  width:41px;
  height:41px;
  overflow:visible
}
.brand-mark circle {
  fill:var(--clay)
}
.brand-mark path {
  fill:none;
  stroke:var(--blue);
  stroke-width:2
}
.brand strong {
  display:block;
  font-family:var(--serif);
  font-size:1.55rem;
  font-weight:700;
  letter-spacing:-.055em;
  line-height:1
}
.brand small {
  display:block;
  color:var(--muted);
  font-size:.67rem;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
  line-height:1.6
}
.primary-nav {
  display:flex;
  gap:28px;
  align-items:center
}
.primary-nav a {
  color:var(--ink);
  font-size:.88rem;
  font-weight:700;
  text-decoration:none;
  padding:10px 2px;
  border-bottom:2px solid transparent
}
.primary-nav a:hover,.primary-nav a[aria-current="page"] {
  color:var(--blue);
  border-bottom-color:var(--blue)
}
.nav-suggest {
  border:1px solid var(--ink);
  border-radius:100px;
  background:transparent;
  color:var(--ink);
  min-height:44px;
  padding:8px 18px;
  font-size:.84rem;
  font-weight:800
}
.nav-suggest:hover {
  background:var(--ink);
  color:#ecf8f7
}
.nav-suggest span {
  margin-left:12px
}
.menu-toggle {
  display:none;
  min-height:44px;
  align-items:center;
  gap:10px;
  border:1px solid var(--line-strong);
  border-radius:100px;
  background:var(--surface);
  padding:7px 14px;
  color:var(--ink);
  font-weight:750
}
.menu-icon {
  width:17px;
  height:12px;
  display:block;
  border-top:2px solid currentColor;
  border-bottom:2px solid currentColor;
  position:relative
}
.menu-icon:after {
  content:"";
  position:absolute;
  top:4px;
  left:0;
  width:17px;
  border-top:2px solid currentColor
}
main {
  min-height:72vh
}
.section {
  padding:92px 0
}
.section-tight {
  padding:62px 0
}
.section-border {
  border-top:1px solid var(--line)
}
.section-heading {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:31px
}
.section-heading h2 {
  max-width:750px;
  margin-bottom:0
}
.section-heading p {
  margin-bottom:0
}
.text-link {
  font-weight:750;
  white-space:nowrap
}
.kicker {
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--clay);
  margin-bottom:22px
}
.kicker:before {
  content:"";
  width:28px;
  border-top:1px solid currentColor
}
.lead {
  font-size:clamp(1.07rem,1.5vw,1.24rem);
  color:#a7bfbd;
  line-height:1.65
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:48px;
  padding:10px 21px;
  border-radius:100px;
  font-size:.91rem;
  font-weight:800;
  text-decoration:none;
  border:1px solid transparent;
  transition:background .2s,color .2s,border-color .2s,transform .2s
}
.button:hover {
  transform:translateY(-2px)
}
.button-primary {
  background:var(--blue);
  color:#ecf8f7
}
.button-primary:hover {
  background:var(--blue-dark);
  color:#ecf8f7
}
.button-outline {
  background:transparent;
  border-color:var(--blue);
  color:var(--blue)
}
.button-outline:hover {
  background:var(--blue-wash)
}
.button-quiet {
  background:var(--paper);
  color:var(--ink);
  border-color:var(--line)
}
.button-quiet:hover {
  border-color:var(--ink)
}
.button-arrow:after {
  content:"↗";
  font-size:1.14rem;
  font-weight:400
}
.arrow-link {
  display:inline-flex;
  gap:12px;
  align-items:center;
  font-weight:800;
  text-decoration:none
}
.arrow-link:after {
  content:"↗";
  font-size:1.25rem;
  line-height:1
}
.arrow-link:hover {
  text-decoration:underline
}
.home-hero {
  padding:73px 0 78px
}
.hero-grid {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(350px,.85fr);
  align-items:stretch;
  gap:7vw
}
.hero-copy {
  padding:48px 0 6px
}
.hero-copy h1 {
  max-width:780px;
  margin:0 0 25px
}
.hero-copy h1 em {
  color:var(--blue);
  font-style:normal
}
.hero-copy .lead {
  max-width:650px;
  margin-bottom:30px
}
.hero-search,.explore-search {
  display:flex;
  align-items:center;
  background:var(--surface);
  border:1px solid var(--line-strong);
  border-radius:100px;
  padding:5px 5px 5px 20px;
  box-shadow:var(--shadow)
}
.hero-search {
  max-width:620px
}
.hero-search:focus-within,.explore-search:focus-within {
  outline:3px solid var(--blue);
  outline-offset:3px
}
.hero-search svg,.explore-search svg {
  width:19px;
  height:19px;
  flex-shrink:0;
  fill:none;
  stroke:var(--muted);
  stroke-width:2
}
.hero-search input,.explore-search input {
  min-width:0;
  flex:1;
  border:0;
  background:transparent;
  outline:0;
  padding:10px 12px;
  color:var(--ink)
}
.hero-search input:focus,.explore-search input:focus {
  outline:none
}
.hero-search button,.explore-search button {
  border:0;
  border-radius:100px;
  background:var(--blue);
  color:#ecf8f7;
  min-height:43px;
  padding:7px 20px;
  font-weight:800
}
.hero-search button:hover,.explore-search button:hover {
  background:var(--blue-dark)
}
.micro-copy {
  font-size:.78rem;
  color:var(--muted);
  margin:11px 0 0
}
.hero-side {
  position:relative;
  min-height:535px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#15352f;
  overflow:hidden;
  padding:26px;
  display:flex;
  flex-direction:column;
  justify-content:space-between
}
.hero-side:before {
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  left:50%;
  top:47%;
  transform:translate(-50%,-50%);
  border:1px solid #42675e;
  border-radius:50%;
  box-shadow:0 0 0 70px rgba(194,202,214,.25),0 0 0 140px rgba(194,202,214,.16)
}
.hero-side:after {
  content:"";
  position:absolute;
  width:135px;
  height:135px;
  border:1px solid var(--blue);
  border-radius:50%;
  top:40%;
  left:42%;
  box-shadow:0 0 0 11px rgba(36,70,166,.07)
}
.atlas-points {
  position:absolute;
  inset:0;
  pointer-events:none
}
.atlas-points i {
  position:absolute;
  width:12px;
  height:12px;
  background:var(--clay);
  border-radius:50%;
  z-index:1;
  box-shadow:0 0 0 7px #ecede8
}
.atlas-points i:nth-child(1) {
  left:20%;
  top:25%
}
.atlas-points i:nth-child(2) {
  right:14%;
  top:31%;
  background:var(--blue)
}
.atlas-points i:nth-child(3) {
  left:27%;
  bottom:30%;
  background:var(--blue)
}
.atlas-points i:nth-child(4) {
  right:30%;
  bottom:14%
}
.hero-side .top-note,.hero-side .featured-note {
  position:relative;
  z-index:2
}
.hero-side .top-note {
  display:flex;
  justify-content:space-between;
  color:var(--ink);
  font-size:.74rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase
}
.hero-side .featured-note {
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:16px;
  padding:20px 23px;
  max-width:330px;
  margin-left:auto;
  box-shadow:var(--shadow)
}
.featured-note h2 {
  font-size:1.55rem;
  letter-spacing:-.035em;
  margin:8px 0
}
.featured-note p {
  font-size:.82rem;
  color:var(--muted);
  line-height:1.5;
  margin-bottom:10px
}
.featured-note a {
  font-size:.83rem
}
.intro-strip {
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
.intro-strip .wrap {
  display:grid;
  grid-template-columns:repeat(3,1fr)
}
.intro-cell {
  padding:25px 31px;
  border-left:1px solid var(--line);
  display:flex;
  gap:18px;
  align-items:flex-start
}
.intro-cell:first-child {
  border-left:0;
  padding-left:0
}
.intro-number {
  font-family:var(--serif);
  font-size:2rem;
  color:var(--clay);
  line-height:1
}
.intro-cell strong {
  display:block;
  font-size:.9rem
}
.intro-cell span:last-child {
  display:block;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.45
}
.card-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px
}
.card {
  min-width:0;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  transition:transform .2s,box-shadow .2s,border-color .2s
}
.card:hover {
  transform:translateY(-3px);
  box-shadow:var(--shadow);
  border-color:#42675e
}
.card-body {
  padding:25px
}
.card h3 {
  font-size:clamp(1.45rem,2vw,2.05rem);
  margin:10px 0 12px
}
.card p {
  color:var(--muted);
  font-size:.91rem;
  line-height:1.58;
  margin-bottom:20px
}
.card-link {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.88rem;
  font-weight:800
}
.card-link:after {
  content:"↗";
  font-size:1.15rem;
  font-weight:400
}
.card-art {
  height:162px;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  border-radius:var(--radius) var(--radius) 0 0;
  background:#15352f
}
.card-art:before,.card-art:after {
  content:"";
  position:absolute;
  border:1px solid #42675e;
  border-radius:50%
}
.card-art:before {
  width:200px;
  height:200px;
  left:18%;
  top:20%
}
.card-art:after {
  width:80px;
  height:80px;
  right:18%;
  top:19%;
  border-color:var(--clay)
}
.card-art i {
  position:absolute;
  width:12px;
  height:12px;
  background:var(--clay);
  border-radius:50%;
  top:54%;
  left:35%
}
.card-art.space {
  background:#15352f
}
.card-art.space:before {
  width:300px;
  height:300px;
  left:17%;
  top:23%;
  border-color:#42675e
}
.card-art.space:after {
  width:120px;
  height:120px;
  right:10%;
  top:10%;
  border-color:#42675e
}
.card-art.nature {
  background:#15352f
}
.card-art.nature:before {
  width:180px;
  height:260px;
  left:41%;
  top:-18%;
  border-radius:45%;
  transform:rotate(32deg);
  border-color:#42675e
}
.card-art.nature:after {
  width:120px;
  height:200px;
  right:26%;
  top:12%;
  border-radius:45%;
  transform:rotate(-25deg);
  border-color:#42675e
}
.card-art.history {
  background:#15352f
}
.card-art.history:before {
  width:270px;
  height:270px;
  left:8%;
  top:20%;
  border-color:#42675e
}
.card-art.history:after {
  width:130px;
  height:130px;
  right:8%;
  top:19%;
  border-color:#42675e
}
.card-art.security {
  background:#15352f
}
.card-art.security:before,.card-art.security:after {
  border-radius:12px;
  transform:rotate(45deg);
  border-color:#42675e
}
.type-label {
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--clay);
  font-size:.69rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase
}
.tag-row {
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin:0 0 13px
}
.tag {
  display:inline-flex;
  align-items:center;
  padding:4px 9px;
  border:1px solid var(--line);
  border-radius:100px;
  background:#15352f;
  color:#a7bfbd;
  font-size:.7rem;
  font-weight:700;
  line-height:1.3
}
.collection-card {
  display:flex;
  flex-direction:column;
  min-height:290px;
  padding:28px;
  background:#15352f;
  border-color:#42675e
}
.collection-card .card-link {
  margin-top:auto
}
.collection-card>.text-link {
  margin-top:10px;
  font-size:.85rem
}
.collection-card .collection-number {
  font-family:var(--serif);
  font-size:4.2rem;
  line-height:.9;
  color:#ecf8f7
}
.collection-card:nth-child(even) {
  background:#15352f;
  border-color:#42675e
}
.collection-card:nth-child(even) .collection-number {
  color:#ecf8f7
}
.route-list {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
.route-list a {
  display:block;
  padding:26px 18px 25px;
  border-right:1px solid var(--line);
  text-decoration:none;
  color:var(--ink)
}
.route-list a:first-child {
  padding-left:0
}
.route-list a:last-child {
  border-right:0
}
.route-list a:hover {
  background:#15352f
}
.route-list strong {
  display:block;
  font-family:var(--serif);
  font-size:1.85rem;
  font-weight:400;
  line-height:1.1;
  margin-bottom:7px
}
.route-list small {
  display:block;
  color:var(--muted);
  font-size:.81rem
}
.route-list .route-arrow {
  display:block;
  color:var(--blue);
  font-size:1.25rem;
  margin-top:12px
}
.page-hero {
  padding:67px 0 54px;
  border-bottom:1px solid var(--line)
}
.page-hero h1 {
  margin:0 0 20px;
  max-width:950px
}
.page-hero .lead {
  max-width:740px;
  margin:0
}
.breadcrumb {
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:.78rem;
  font-weight:700;
  margin-bottom:30px
}
.breadcrumb a {
  color:var(--muted)
}
.breadcrumb a:hover {
  color:var(--blue)
}
.breadcrumb span[aria-hidden] {
  color:#ecf8f7
}
.page-title-row {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:25px
}
.page-title-row .hero-index {
  font-family:var(--serif);
  font-size:7rem;
  line-height:1;
  color:#ecf8f7
}
.page-intro-grid {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  gap:8%;
  align-items:start
}
.page-intro-grid .visual-panel {
  min-height:350px
}
.visual-panel {
  position:relative;
  overflow:hidden;
  min-height:320px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#15352f
}
.visual-panel:before {
  content:"";
  position:absolute;
  width:330px;
  height:330px;
  border:1px solid #42675e;
  border-radius:50%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  box-shadow:0 0 0 44px rgba(153,169,195,.16),0 0 0 88px rgba(153,169,195,.1)
}
.visual-panel:after {
  content:"";
  position:absolute;
  width:82px;
  height:82px;
  border:1px solid var(--clay);
  border-radius:50%;
  left:28%;
  top:28%;
  box-shadow:0 0 0 7px rgba(156,64,43,.09)
}
.visual-panel .visual-caption {
  position:absolute;
  left:22px;
  bottom:20px;
  right:22px;
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase
}
.visual-panel.nature {
  background:#15352f
}
.visual-panel.nature:before {
  border-color:#42675e
}
.visual-panel.history {
  background:#15352f
}
.visual-panel.history:before {
  border-color:#42675e
}
.visual-panel.security {
  background:#15352f
}
.visual-panel.space {
  background:#15352f
}
.explore-tools {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  margin:32px 0 22px
}
.explore-search {
  max-width:700px;
  box-shadow:none
}
.explore-search button {
  padding-inline:17px
}
.result-total {
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--muted);
  text-align:right
}
.segmented {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:5px;
  background:#15352f;
  border-radius:100px;
  width:fit-content
}
.segmented button {
  min-height:41px;
  padding:7px 16px;
  border:0;
  border-radius:100px;
  background:transparent;
  color:#a7bfbd;
  font-size:.82rem;
  font-weight:800
}
.segmented button:hover {
  background:#15352f
}
.segmented button[aria-pressed="true"] {
  background:var(--ink);
  color:#ecf8f7
}
.explore-layout {
  display:grid;
  grid-template-columns:232px minmax(0,1fr);
  gap:42px;
  margin-top:39px
}
.filter-panel {
  align-self:start;
  position:sticky;
  top:110px;
  border-top:2px solid var(--ink);
  border-bottom:1px solid var(--line);
  padding-bottom:14px
}
.filter-panel summary {
  list-style:none;
  cursor:pointer;
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-weight:800
}
.filter-panel summary::-webkit-details-marker {
  display:none
}
.filter-panel summary:after {
  content:"−";
  font-size:1.25rem;
  font-weight:400
}
.filter-panel:not([open]) summary:after {
  content:"+"
}
.filter-body {
  padding:8px 0
}
.filter-group {
  padding:14px 0;
  border-top:1px solid var(--line)
}
.filter-group h3 {
  font-family:var(--sans);
  font-size:.71rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 10px
}
.filter-options {
  display:flex;
  flex-wrap:wrap;
  gap:7px
}
.filter-options button {
  min-height:38px;
  border:1px solid var(--line-strong);
  background:var(--surface);
  border-radius:100px;
  padding:6px 11px;
  color:var(--ink);
  font-size:.77rem;
  font-weight:700
}
.filter-options button:hover {
  border-color:var(--blue);
  color:var(--blue)
}
.filter-options button[aria-pressed="true"] {
  background:var(--blue);
  color:#ecf8f7;
  border-color:var(--blue)
}
.active-filter-row {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 25px
}
.active-filter-row .tag {
  background:#15352f;
  border-color:#42675e;
  color:var(--blue);
  font-size:.77rem;
  min-height:32px
}
.remove-filter {
  border:0;
  background:none;
  color:inherit;
  font-size:1rem;
  line-height:1;
  margin-left:4px;
  min-width:20px
}
.clear-button {
  border:0;
  background:transparent;
  color:var(--blue);
  font-weight:800;
  font-size:.8rem;
  text-decoration:underline;
  padding:8px
}
.result-section {
  margin-bottom:52px
}
.result-section-head {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid var(--line-strong);
  margin-bottom:17px;
  padding-bottom:12px
}
.result-section-head h2 {
  font-family:var(--sans);
  font-size:1.07rem;
  font-weight:850;
  letter-spacing:-.01em;
  margin:0
}
.result-section-head span {
  font-size:.74rem;
  font-weight:700;
  color:var(--muted)
}
.result-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px
}
.result-card {
  min-height:178px;
  display:flex;
  flex-direction:column;
  padding:21px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface)
}
.result-card:hover {
  border-color:#42675e;
  box-shadow:var(--shadow)
}
.result-card h3 {
  font-size:1.5rem;
  margin:8px 0
}
.result-card h3 a {
  text-decoration:none;
  color:var(--ink)
}
.result-card h3 a:hover {
  text-decoration:underline;
  color:var(--blue)
}
.result-card p {
  font-size:.83rem;
  line-height:1.45;
  color:var(--muted);
  margin-bottom:12px
}
.result-card .tag-row {
  margin:auto 0 0
}
.result-card .meta-tail {
  font-size:.76rem;
  color:var(--muted);
  margin-top:auto
}
.result-card.collection-result {
  background:#15352f;
  border-color:#42675e
}
.result-card.material-result {
  background:#15352f
}
.empty-state {
  border:1px dashed var(--line-strong);
  border-radius:16px;
  background:var(--surface);
  padding:45px
}
.empty-state h2 {
  font-size:2.1rem;
  margin-bottom:10px
}
.empty-state p {
  color:var(--muted)
}
.topic-hero {
  padding:65px 0 62px
}
.topic-hero h1 {
  max-width:850px
}
.topic-hero .lead {
  margin-bottom:27px
}
.topic-actions {
  display:flex;
  flex-wrap:wrap;
  gap:11px;
  margin-top:28px
}
.topic-meta {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:24px
}
.start-card {
  display:grid;
  grid-template-columns:130px minmax(0,1fr) auto;
  gap:25px;
  align-items:center;
  padding:26px 30px;
  border-radius:var(--radius);
  background:var(--blue);
  color:#ecf8f7
}
.start-card .start-num {
  font-family:var(--serif);
  font-size:5.5rem;
  line-height:1;
  color:#ecf8f7
}
.start-card .eyebrow {
  color:#ecf8f7
}
.start-card h3 {
  font-size:1.8rem;
  margin:6px 0
}
.start-card p {
  color:#ecf8f7;
  font-size:.9rem;
  margin:0
}
.start-card a {
  color:#ecf8f7;
  border-color:#42675e
}
.start-card a:hover {
  background:#15352f;
  color:var(--blue)
}
.material-group {
  margin-top:44px
}
.material-group-head {
  display:flex;
  align-items:baseline;
  gap:16px;
  border-bottom:1px solid var(--line-strong);
  padding-bottom:13px;
  margin-bottom:8px
}
.material-group-head h3 {
  font-family:var(--sans);
  font-size:1.12rem;
  font-weight:850;
  margin:0
}
.material-group-head span {
  color:var(--muted);
  font-size:.8rem
}
.material-row {
  display:grid;
  grid-template-columns:110px minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  padding:20px 0;
  border-bottom:1px solid var(--line)
}
.material-row .format {
  font-size:.7rem;
  font-weight:850;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--clay)
}
.material-row h4 {
  font-family:var(--serif);
  font-size:1.35rem;
  letter-spacing:-.02em;
  line-height:1.2;
  margin:0 0 3px
}
.material-row h4 a {
  color:var(--ink);
  text-decoration:none
}
.material-row h4 a:hover {
  text-decoration:underline;
  color:var(--blue)
}
.material-row p {
  font-size:.83rem;
  color:var(--muted);
  margin:0
}
.material-row .row-arrow {
  text-decoration:none;
  font-size:1.45rem;
  min-width:44px;
  min-height:44px;
  display:grid;
  place-items:center
}
.detail-aside {
  border-top:2px solid var(--ink);
  padding-top:18px
}
.detail-aside h3 {
  font-family:var(--sans);
  font-size:1rem;
  font-weight:850;
  margin:0 0 15px
}
.detail-aside .aside-link {
  display:block;
  padding:13px 0;
  border-bottom:1px solid var(--line);
  text-decoration:none;
  color:var(--ink);
  font-weight:750
}
.detail-aside .aside-link:hover {
  color:var(--blue)
}
.detail-aside .aside-link span {
  display:block;
  color:var(--muted);
  font-weight:500;
  font-size:.77rem
}
.detail-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) 280px;
  gap:8%;
  align-items:start
}
.notice-card {
  background:#15352f;
  border:1px solid #42675e;
  border-radius:14px;
  padding:18px;
  color:#a7bfbd;
  font-size:.84rem
}
.notice-card strong {
  display:block;
  color:var(--ink);
  margin-bottom:4px
}
.related-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px
}
.collection-hero {
  padding:67px 0 58px
}
.collection-hero .lead {
  max-width:750px
}
.collection-progress {
  margin-top:31px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:16px
}
.progress-track {
  height:5px;
  width:min(100%,240px);
  border-radius:10px;
  background:#15352f;
  overflow:hidden
}
.progress-fill {
  display:block;
  height:100%;
  background:var(--blue);
  transition:width .2s
}
.progress-label {
  font-size:.79rem;
  font-weight:850;
  color:var(--blue)
}
.step-controls {
  display:flex;
  flex-wrap:wrap;
  gap:8px
}
.step-controls button {
  min-height:44px;
  border:1px solid var(--line-strong);
  background:var(--surface);
  color:var(--ink);
  border-radius:100px;
  padding:8px 14px;
  font-size:.8rem;
  font-weight:800
}
.step-controls button:hover:not(:disabled) {
  border-color:var(--blue);
  color:var(--blue)
}
.step-controls button:disabled {
  opacity:.45;
  cursor:not-allowed
}
.step-list {
  display:grid;
  gap:13px;
  margin:0;
  padding:0;
  list-style:none
}
.step-card {
  display:grid;
  grid-template-columns:74px minmax(0,1fr) auto;
  gap:23px;
  align-items:start;
  padding:25px;
  border:1px solid var(--line);
  background:var(--surface);
  border-radius:14px
}
.step-card.current {
  border:2px solid var(--blue);
  padding:24px;
  background:#15352f
}
.step-card .step-number {
  font-family:var(--serif);
  font-size:3.2rem;
  line-height:1;
  color:#ecf8f7
}
.step-card h3 {
  font-size:1.65rem;
  margin:7px 0 8px
}
.step-card p {
  font-size:.85rem;
  color:var(--muted);
  margin-bottom:12px
}
.step-card .step-type {
  font-size:.67rem;
  font-weight:850;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--clay)
}
.step-card .current-label {
  display:inline-flex;
  border-radius:100px;
  background:var(--blue);
  color:#ecf8f7;
  padding:3px 9px;
  font-size:.68rem;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.05em
}
.step-card .step-open {
  align-self:center;
  white-space:nowrap
}
.material-hero {
  padding:67px 0 56px
}
.material-hero h1 {
  max-width:930px
}
.material-hero .lead {
  max-width:760px
}
.material-head-meta {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:26px 0
}
.preview-shell {
  border:1px solid #42675e;
  border-radius:18px;
  min-height:385px;
  background:#15352f;
  display:grid;
  place-items:center;
  text-align:center;
  padding:25px;
  position:relative;
  overflow:hidden
}
.preview-shell:before {
  content:"";
  position:absolute;
  width:300px;
  height:300px;
  border:1px solid #42675e;
  border-radius:50%;
  transform:translate(-50%,-50%);
  left:50%;
  top:50%;
  box-shadow:0 0 0 42px rgba(164,181,224,.24),0 0 0 85px rgba(164,181,224,.15)
}
.preview-shell .preview-inner {
  position:relative;
  z-index:1;
  max-width:420px
}
.preview-symbol {
  font-family:var(--serif);
  font-size:5.5rem;
  line-height:1;
  color:var(--blue);
  margin-bottom:12px
}
.preview-shell h2 {
  font-size:1.75rem;
  margin-bottom:8px
}
.preview-shell p {
  font-size:.88rem;
  color:#a7bfbd;
  margin-inline:auto
}
.source-note {
  padding:24px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface)
}
.source-note h3 {
  font-family:var(--sans);
  font-size:1rem;
  font-weight:850
}
.source-note p {
  color:var(--muted);
  font-size:.86rem;
  margin-bottom:0
}
.material-actions {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:24px 0 0
}
.save-button[aria-pressed="true"] {
  background:#15352f;
  border-color:var(--blue);
  color:var(--blue)
}
.about-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.6fr);
  gap:8%;
  align-items:start
}
.about-card {
  border:1px solid var(--line);
  background:var(--surface);
  border-radius:var(--radius);
  padding:30px
}
.about-card h3 {
  font-size:1.75rem
}
.about-card p {
  color:var(--muted)
}
.definition-list {
  border-top:1px solid var(--line)
}
.definition-list div {
  display:grid;
  grid-template-columns:145px 1fr;
  gap:20px;
  border-bottom:1px solid var(--line);
  padding:17px 0
}
.definition-list dt {
  font-weight:850
}
.definition-list dd {
  margin:0;
  color:var(--muted)
}
.site-footer {
  background:var(--ink);
  color:#ecf8f7;
  padding:65px 0 50px;
  margin-top:50px
}
.footer-grid {
  display:grid;
  grid-template-columns:1.3fr .55fr 1fr;
  gap:9%
}
.footer-brand {
  font-family:var(--serif);
  font-size:2.6rem;
  letter-spacing:-.05em;
  line-height:1.1
}
.footer-brand .period {
  color:#ecf8f7
}
.site-footer p {
  font-size:.86rem;
  color:#ecf8f7;
  margin-top:14px
}
.site-footer .fine-print {
  font-size:.72rem;
  color:#ecf8f7
}
.site-footer nav {
  display:flex;
  flex-direction:column;
  align-items:start;
  gap:9px
}
.site-footer a,.footer-link {
  color:#ecf8f7;
  font-size:.84rem;
  font-weight:750
}
.footer-link {
  padding:0;
  border:0;
  background:none;
  text-decoration:underline;
  text-underline-offset:3px
}
.site-footer .eyebrow {
  color:#ecf8f7
}
.footer-note {
  border-left:1px solid #42675e;
  padding-left:22px
}
.dialog-card {
  width:min(100% - 32px,530px);
  max-height:calc(100vh - 40px);
  overflow:auto;
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:0 30px 90px rgba(0,0,0,.25);
  padding:29px 32px;
  background:var(--surface);
  color:var(--ink)
}
.dialog-card::backdrop {
  background:rgba(20,31,49,.55);
  backdrop-filter:blur(3px)
}
.dialog-card h2 {
  font-size:2.35rem;
  margin:8px 0 12px
}
.dialog-card p {
  font-size:.9rem;
  color:var(--muted)
}
.dialog-top {
  display:flex;
  align-items:center;
  justify-content:space-between
}
.icon-close {
  width:44px;
  height:44px;
  border:1px solid var(--line);
  border-radius:50%;
  background:var(--surface);
  font-size:1.6rem;
  line-height:1;
  color:var(--ink)
}
.icon-close:hover {
  background:var(--paper)
}
.dialog-card label {
  display:block;
  font-weight:800;
  font-size:.82rem;
  margin:17px 0 6px
}
.dialog-card input,.dialog-card textarea {
  display:block;
  width:100%;
  border:1px solid var(--line-strong);
  border-radius:10px;
  padding:11px 12px;
  background:#15352f;
  color:var(--ink)
}
.dialog-card .optional {
  font-weight:400;
  color:var(--muted)
}
.dialog-actions {
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:22px
}
.form-status {
  min-height:1px;
  margin-top:13px;
  color:var(--blue);
  font-size:.84rem;
  font-weight:750
}
.toast {
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:60;
  max-width:min(360px,calc(100vw - 36px));
  background:var(--ink);
  color:#ecf8f7;
  padding:14px 18px;
  border-radius:10px;
  box-shadow:var(--shadow);
  font-size:.83rem;
  font-weight:700
}
.noscript {
  padding:20px;
  background:#15352f;
  text-align:center
}
@media(max-width:1000px) {
  .primary-nav {
    gap:14px
  }
  .hero-grid {
    gap:32px
  }
  .hero-side {
    min-height:470px
  }
  .card-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .explore-layout {
    gap:26px;
    grid-template-columns:210px minmax(0,1fr)
  }
  .footer-grid {
    gap:5%
  }
}
@media(max-width:760px) {
  .wrap {
    width:min(100% - 32px,1220px)
  }
  .header-inner {
    min-height:69px
  }
  .brand-mark {
    width:35px;
    height:35px
  }
  .brand strong {
    font-size:1.4rem
  }
  .menu-toggle {
    display:flex
  }
  .primary-nav {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:var(--paper);
    padding:14px 16px 20px;
    border-bottom:1px solid var(--line);
    box-shadow:0 16px 28px rgba(24,36,58,.13);
    flex-direction:column;
    align-items:stretch;
    gap:0
  }
  .primary-nav.open {
    display:flex
  }
  .primary-nav a {
    border-bottom:1px solid var(--line);
    min-height:47px;
    display:flex;
    align-items:center
  }
  .primary-nav a[aria-current="page"] {
    border-bottom:1px solid var(--line);
    box-shadow:inset 4px 0 var(--blue);
    padding-left:13px
  }
  .nav-suggest {
    margin-top:14px;
    width:100%;
    text-align:left;
    display:flex;
    justify-content:space-between;
    align-items:center
  }
  .section {
    padding:58px 0
  }
  .section-tight {
    padding:42px 0
  }
  .home-hero {
    padding:43px 0 54px
  }
  .hero-grid,.page-intro-grid,.detail-grid,.about-grid {
    grid-template-columns:1fr;
    gap:27px
  }
  .hero-copy {
    padding:0
  }
  .hero-copy h1 {
    font-size:clamp(3rem,11vw,5.4rem)
  }
  .hero-side {
    min-height:345px
  }
  .hero-side:before {
    width:360px;
    height:360px
  }
  .hero-side .featured-note {
    max-width:285px
  }
  .intro-strip .wrap {
    grid-template-columns:1fr
  }
  .intro-cell {
    padding:17px 0;
    border-left:0;
    border-bottom:1px solid var(--line)
  }
  .intro-cell:last-child {
    border-bottom:0
  }
  .section-heading {
    align-items:start;
    flex-direction:column;
    gap:8px
  }
  .card-grid,.result-grid,.related-grid {
    grid-template-columns:1fr
  }
  .route-list {
    grid-template-columns:repeat(2,1fr)
  }
  .route-list a {
    padding:20px 15px;
    border-bottom:1px solid var(--line)
  }
  .route-list a:nth-child(2) {
    border-right:0
  }
  .route-list a:nth-child(3),.route-list a:nth-child(4) {
    border-bottom:0
  }
  .route-list a:nth-child(3) {
    padding-left:0
  }
  .page-hero,.topic-hero,.collection-hero,.material-hero {
    padding:43px 0 38px
  }
  .page-title-row .hero-index {
    display:none
  }
  .page-intro-grid .visual-panel {
    min-height:230px
  }
  .explore-tools {
    grid-template-columns:1fr;
    gap:9px
  }
  .result-total {
    text-align:left
  }
  .segmented {
    width:100%;
    border-radius:15px
  }
  .segmented button {
    flex:1;
    min-width:75px
  }
  .explore-layout {
    grid-template-columns:1fr;
    gap:21px;
    margin-top:22px
  }
  .filter-panel {
    position:static;
    top:auto
  }
  .filter-panel:not([open]) {
    padding-bottom:0
  }
  .filter-options button {
    min-height:44px
  }
  .start-card {
    grid-template-columns:65px 1fr;
    gap:14px;
    padding:21px
  }
  .start-card .start-num {
    font-size:4rem
  }
  .start-card .button {
    grid-column:1/-1;
    width:100%
  }
  .material-row {
    grid-template-columns:1fr auto;
    gap:6px
  }
  .material-row .format {
    grid-column:1/-1
  }
  .material-row .row-arrow {
    grid-column:2;
    grid-row:2
  }
  .step-card {
    grid-template-columns:50px minmax(0,1fr);
    gap:10px;
    padding:20px
  }
  .step-card.current {
    padding:19px
  }
  .step-card .step-number {
    font-size:2.4rem
  }
  .step-card .step-open {
    grid-column:2;
    justify-self:start
  }
  .preview-shell {
    min-height:310px
  }
  .footer-grid {
    grid-template-columns:1fr 1fr;
    gap:32px
  }
  .footer-note {
    grid-column:1/-1
  }
  .definition-list div {
    grid-template-columns:1fr;
    gap:4px
  }
}
@media(max-width:480px) {
  .prototype-bar {
    font-size:.62rem
  }
  .bar-separator {
    display:none
  }
  .hero-search,.explore-search {
    border-radius:15px;
    padding-left:12px
  }
  .hero-search button,.explore-search button {
    min-height:43px;
    padding:7px 13px
  }
  .hero-search input,.explore-search input {
    font-size:.84rem;
    padding-inline:8px
  }
  .hero-side {
    min-height:320px;
    padding:16px
  }
  .featured-note {
    padding:15px!important
  }
  .route-list strong {
    font-size:1.55rem
  }
  .card-body {
    padding:21px
  }
  .page-hero h1,.topic-hero h1,.collection-hero h1,.material-hero h1 {
    font-size:clamp(2.75rem,11vw,4rem)
  }
  .footer-grid {
    grid-template-columns:1fr
  }
  .footer-note {
    grid-column:auto
  }
  .dialog-card {
    padding:22px
  }
  .dialog-actions .button {
    width:100%
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    animation-duration:.01ms!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important
  }
}
#materials,#related,.step-card {
  scroll-margin-top:112px
}
.current-step-text {
  display:inline-block;
  color:var(--blue);
  font-size:.78rem;
  font-weight:800
}
@media(max-width:760px) {
  .segmented {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    border-radius:15px
  }
  .segmented button {
    min-width:0
  }
}
.filter-options button,.segmented button,.clear-button {
  min-height:44px
}
.active-filter-row .tag {
  min-height:40px
}
.remove-filter {
  min-width:32px;
  min-height:32px
}
.primary-nav a,.site-footer nav a,.site-footer .footer-link {
  min-height:44px;
  display:inline-flex;
  align-items:center
}
.start-card a:focus-visible,.site-footer a:focus-visible,.site-footer button:focus-visible {
  outline-color:#fff
}
.result-card h3 a {
  text-decoration:underline;
  text-decoration-color:#9aadd7;
  text-underline-offset:4px
}
.hero-search button,.explore-search button {
  min-height:44px
}
.active-filter-row .tag {
  min-height:44px
}
.remove-filter {
  min-width:44px;
  min-height:44px
}
.type-label,.material-row .format,.step-card .step-type {
  font-size:.75rem
}

/* Idea submission and the illustrative production journey. */
.suggestion-layout,.handoff-grid,.studio-grid {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
  gap:clamp(24px,4vw,56px);
  align-items:start
}
.idea-form,.process-aside,.receipt-card,.handoff-card,.studio-context,.studio-stage,.studio-steps {
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow)
}
.idea-form,.process-aside,.receipt-card,.handoff-card,.studio-stage,.studio-context {
  padding:clamp(24px,3vw,42px)
}
.idea-form h2,.receipt-card h2,.handoff-grid h2 {
  font-size:clamp(2.2rem,4vw,3.6rem)
}
.idea-form label {
  display:block;
  margin:22px 0 7px;
  font-weight:750;
  color:var(--ink)
}
.idea-form input,.idea-form textarea {
  display:block;
  width:100%;
  border:1.5px solid var(--line-strong);
  border-radius:10px;
  padding:12px 14px;
  background:#15352f;
  color:var(--ink)
}
.idea-form textarea {
  resize:vertical
}
.idea-form .micro-copy {
  margin:20px 0
}
.receipt-card {
  border-left:5px solid var(--blue);
  margin-bottom:24px
}
.receipt-card h2 {
  margin:9px 0 15px
}
.receipt-card strong {
  overflow-wrap:anywhere
}
.process-aside h3 {
  margin:12px 0 22px
}
.mini-timeline {
  list-style:none;
  margin:0 0 25px;
  padding:0;
  border-left:1px solid var(--line-strong)
}
.mini-timeline li {
  display:grid;
  gap:2px;
  margin:0 0 20px;
  padding-left:20px;
  position:relative
}
.mini-timeline li:before {
  content:"";
  position:absolute;
  left:-5px;
  top:8px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--blue)
}
.mini-timeline span {
  color:var(--muted);
  font-size:.92rem
}
.flow-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px
}
.flow-card {
  min-height:245px;
  padding:24px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface)
}
.flow-number {
  display:inline-block;
  color:var(--clay);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase
}
.flow-card h2 {
  font-size:1.75rem;
  margin:25px 0 12px
}
.flow-card p {
  color:var(--muted);
  font-size:.95rem;
  line-height:1.55;
  margin:0
}
.handoff-grid {
  grid-template-columns:minmax(0,1fr) minmax(310px,.8fr)
}
.handoff-card dl {
  margin:15px 0 0
}
.handoff-card dl div {
  display:grid;
  grid-template-columns:135px minmax(0,1fr);
  gap:14px;
  padding:14px 0;
  border-top:1px solid var(--line)
}
.handoff-card dt {
  font-size:.8rem;
  font-weight:800;
  color:var(--muted)
}
.handoff-card dd {
  margin:0;
  font-weight:650;
  overflow-wrap:anywhere
}
.studio-hero {
  background:#15352f
}
.studio-grid {
  grid-template-columns:255px minmax(0,1fr)
}
.studio-steps {
  padding:22px;
  position:sticky;
  top:125px;
  box-shadow:none
}
.studio-steps ol {
  list-style:none;
  margin:17px 0 0;
  padding:0
}
.studio-steps li {
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 4px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:.9rem;
  font-weight:650
}
.studio-steps li span {
  color:var(--clay);
  font-size:.75rem;
  font-weight:800
}
.studio-steps li.is-current {
  color:var(--blue);
  font-weight:800
}
.studio-steps li.is-complete span {
  color:var(--blue)
}
.studio-main {
  min-width:0
}
.studio-context {
  margin-bottom:18px;
  box-shadow:none
}
.studio-context h2 {
  font-size:clamp(1.8rem,3vw,2.8rem);
  margin:7px 0 9px;
  overflow-wrap:anywhere
}
.studio-context p {
  color:var(--muted);
  margin:0
}
.stage-top {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px
}
.stage-status {
  display:inline-flex;
  align-items:center;
  min-height:29px;
  border-radius:999px;
  padding:3px 11px;
  background:var(--blue-wash);
  color:var(--blue-dark);
  font-size:.76rem;
  font-weight:800
}
.studio-stage h2 {
  font-size:clamp(2.5rem,5vw,4.4rem);
  margin:23px 0 14px
}
.studio-stage>p:not(.lead) {
  color:var(--muted)
}
.studio-handoff {
  box-shadow:none;
  margin:27px 0
}
.studio-handoff .button {
  margin-top:15px
}
.review-check {
  background:#15352f;
  border:1px solid #42675e;
  border-radius:14px;
  padding:23px;
  margin:27px 0
}
.review-check h3 {
  font-size:1.55rem;
  margin:10px 0
}
.stage-actions {
  display:flex;
  flex-wrap:wrap;
  gap:11px;
  border-top:1px solid var(--line);
  padding-top:23px;
  margin-top:27px
}
.stage-actions .button:disabled {
  opacity:.58;
  cursor:not-allowed
}
@media(max-width:1000px) {
  .flow-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:760px) {
  .suggestion-layout,.handoff-grid,.studio-grid {
    grid-template-columns:1fr
  }
  .studio-steps {
    position:static
  }
  .studio-steps ol {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 18px
  }
}
@media(max-width:520px) {
  .flow-grid,.studio-steps ol {
    grid-template-columns:1fr
  }
  .flow-card {
    min-height:0
  }
  .handoff-card dl div {
    grid-template-columns:1fr;
    gap:3px
  }
  .stage-actions .button {
    width:100%
  }
}

/* Private Control Center preview. */
.control-layout {
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  align-items:start;
  gap:clamp(22px,3vw,40px)
}
.control-nav {
  display:grid;
  gap:3px;
  position:sticky;
  top:122px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface)
}
.control-nav .type-label {
  padding:0 12px 12px
}
.control-nav a {
  display:flex;
  align-items:center;
  min-height:46px;
  padding:8px 12px;
  border-radius:9px;
  color:var(--ink);
  font-weight:700;
  text-decoration:none
}
.control-nav a:hover,.control-nav a[aria-current="page"] {
  background:var(--blue-wash);
  color:var(--blue-dark)
}
.control-panel {
  min-width:0
}
.control-heading {
  margin-bottom:25px
}
.control-heading h2 {
  font-size:clamp(2.1rem,4vw,3.6rem);
  margin:8px 0 12px
}
.control-heading p {
  color:var(--muted);
  margin:0
}
.control-summary-grid,.control-tools {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px
}
.control-summary-grid article,.control-tools article,.control-note,.control-review,.control-run {
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  box-shadow:var(--shadow)
}
.control-summary-grid article,.control-tools article {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:22px
}
.control-summary-grid article>span {
  color:var(--muted);
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase
}
.control-summary-grid article>strong {
  font-family:var(--serif);
  font-size:clamp(2.3rem,3vw,3.2rem);
  font-weight:400;
  line-height:1.1;
  margin:14px 0 8px
}
.control-summary-grid article p,.control-tools article p {
  color:var(--muted)
}
.control-summary-grid article a {
  margin-top:auto;
  font-weight:800
}
.control-tools article h3 {
  font-size:1.6rem;
  margin:0 0 9px
}
.control-tools article .button {
  margin-top:auto
}
.control-tools+.button {
  margin-top:24px
}
.control-note,.control-review,.control-run {
  padding:clamp(22px,3vw,38px)
}
.control-note {
  margin-top:18px;
  border-left:5px solid var(--clay)
}
.control-note h3 {
  margin-bottom:9px
}
.control-note p {
  margin-bottom:0
}
.control-review form {
  margin-top:22px
}
.control-review label {
  display:block;
  margin:18px 0 6px;
  font-weight:750
}
.control-review input,.control-review textarea {
  width:100%;
  display:block;
  padding:12px 14px;
  border:1.5px solid var(--line-strong);
  border-radius:10px;
  background:#15352f;
  color:var(--ink)
}
.control-review textarea {
  resize:vertical
}
.control-review form .button {
  margin-top:17px
}
.control-feedback {
  padding:13px 16px;
  border-radius:10px;
  background:var(--blue-wash);
  color:var(--blue-dark);
  font-weight:700;
  margin:20px 0 0
}
.run-list {
  list-style:none;
  margin:28px 0;
  padding:0
}
.run-list li {
  display:flex;
  gap:18px;
  padding:19px 0;
  border-top:1px solid var(--line)
}
.run-list li>span {
  color:var(--clay);
  font-size:.8rem;
  font-weight:800
}
.run-list strong {
  display:block;
  font-size:1.1rem
}
.run-list p {
  color:var(--muted);
  margin:4px 0 0
}
@media(max-width:1050px) {
  .control-summary-grid,.control-tools {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(min-width:761px) and (max-width:920px) {
  .header-inner {gap:10px}
  .primary-nav {gap:8px}
  .primary-nav a {font-size:.8rem}
  .nav-suggest {padding:8px 10px;font-size:.76rem}
}
@media(max-width:760px) {
  .control-layout {
    grid-template-columns:1fr
  }
  .control-nav {
    position:static;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:5px;
    padding:9px
  }
  .control-nav .type-label {display:none}
  .control-nav a {justify-content:center;text-align:center}
}
@media(max-width:520px) {
  .control-summary-grid,.control-tools {
    grid-template-columns:1fr
  }
  .control-review .stage-actions .button {
    width:100%
  }
}