.pantry-page{
  --pantry-paper:#171612;
  --pantry-wood:#241a13;
  --pantry-sage:#91a886;
  --pantry-chili:#d3654d;
  --pantry-turmeric:#d8ad43;
  background:#0b0b0d;
}

.pantry-page *{
  letter-spacing:0;
}

.pantry-page .container{
  max-width:1100px;
}

.pantry-shell{
  max-width:940px;
  margin:0 auto;
}

.pantry-breadcrumbs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 30px;
  color:var(--muted);
  font-size:.9rem;
}

.pantry-breadcrumbs a{
  border-bottom:0;
  color:var(--muted);
}

.pantry-hero{
  padding:38px 0 30px;
  border-bottom:1px solid var(--line);
}

.pantry-kicker,
.pantry-chapter{
  margin:0 0 14px;
  color:var(--gold);
  font-size:.79rem;
  font-weight:700;
  text-transform:uppercase;
}

.pantry-hero h1{
  max-width:900px;
  margin:0 0 18px;
  font-size:4.4rem;
  font-weight:500;
  line-height:1.02;
  text-shadow:none;
}

.pantry-article .pantry-hero h1{
  max-width:820px;
  font-size:3.55rem;
}

.pantry-deck{
  max-width:760px;
  margin:0;
  color:rgba(233,226,214,.78);
  font-size:1.16rem;
  line-height:1.65;
}

.pantry-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  margin-top:22px;
  color:var(--muted);
  font-size:.9rem;
}

.pantry-hero-figure{
  margin:28px 0 42px;
}

.pantry-hero-figure img{
  display:block;
  width:100%;
  aspect-ratio:3 / 2;
  height:auto;
  object-fit:cover;
  border:1px solid rgba(200,168,106,.22);
  border-radius:6px;
}

.pantry-hero-figure figcaption{
  margin-top:10px;
  color:var(--muted);
  font-size:.84rem;
  line-height:1.5;
}

.pantry-infographic{
  width:100%;
  max-width:680px;
  margin:42px auto;
}

.pantry-infographic a{
  display:block;
  position:relative;
  border-bottom:0;
}

.pantry-infographic a::after{
  content:"↗";
  position:absolute;
  top:10px;
  right:10px;
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border:1px solid rgba(200,168,106,.45);
  border-radius:50%;
  background:rgba(11,11,13,.86);
  color:var(--gold);
  font-size:1.05rem;
}

.pantry-infographic a:focus-visible{
  outline:2px solid rgba(200,168,106,.72);
  outline-offset:4px;
}

.pantry-infographic img{
  display:block;
  width:100%;
  height:auto;
  border:1px solid rgba(200,168,106,.22);
  border-radius:6px;
}

.pantry-infographic figcaption{
  margin-top:10px;
  color:var(--muted);
  font-size:.84rem;
  line-height:1.5;
}

.pantry-observation{
  margin:48px 0;
  padding:30px 0;
  border-top:1px solid rgba(145,168,134,.42);
  border-bottom:1px solid rgba(145,168,134,.42);
}

.pantry-observation .pantry-chapter{
  margin-bottom:12px;
  color:var(--pantry-sage);
}

.pantry-copy .pantry-observation h2{
  margin-top:0;
}

.pantry-manchette{
  display:grid;
  grid-template-columns:minmax(0, 1.35fr) minmax(220px, .65fr);
  gap:28px;
  align-items:start;
  margin:0 0 54px;
  padding:28px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.pantry-manchette p{
  margin:0;
}

.pantry-route{
  color:var(--pantry-sage);
  font-size:.95rem;
  line-height:1.75;
}

.pantry-section{
  margin:48px 0;
}

.pantry-section > h2{
  max-width:760px;
  margin:0 0 14px;
  font-size:2rem;
  font-weight:500;
  line-height:1.16;
}

.pantry-section-intro{
  max-width:760px;
  margin:0 0 28px;
}

.pantry-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
}

.pantry-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  overflow:hidden;
  border:1px solid rgba(200,168,106,.18);
  border-radius:6px;
  background:#111114;
  color:var(--text);
  text-decoration:none;
}

.pantry-card:first-child{
  grid-column:1 / -1;
}

.pantry-card:last-child{
  grid-column:1 / -1;
}

.pantry-card img{
  display:block;
  width:100%;
  aspect-ratio:3 / 2;
  height:auto;
  object-fit:cover;
}

.pantry-card-body{
  display:grid;
  grid-template-columns:54px minmax(0, 1fr);
  gap:14px;
  padding:20px;
}

.pantry-card-number{
  color:var(--gold);
  font-size:1.45rem;
  line-height:1;
}

.pantry-card:nth-child(3n+2) .pantry-card-number{color:var(--pantry-sage)}
.pantry-card:nth-child(3n) .pantry-card-number{color:var(--pantry-chili)}
.pantry-card:nth-child(4n) .pantry-card-number{color:var(--pantry-turmeric)}

.pantry-card h2,
.pantry-card h3{
  margin:0 0 9px;
  color:var(--text);
  font-size:1.5rem;
  font-weight:500;
  line-height:1.15;
}

.pantry-card p{
  margin:0;
  color:var(--muted);
  font-size:.98rem;
  line-height:1.6;
}

.pantry-card:hover{
  border-color:rgba(200,168,106,.42);
  opacity:1;
}

.pantry-copy{
  max-width:780px;
  margin:0 auto;
}

.pantry-copy h2{
  margin:46px 0 14px;
  font-size:1.9rem;
  font-weight:500;
  line-height:1.18;
}

.pantry-copy h3{
  margin:28px 0 10px;
  color:var(--text);
  font-size:1.24rem;
  line-height:1.25;
}

.pantry-copy p,
.pantry-copy li{
  color:rgba(233,226,214,.8);
  font-size:1.04rem;
  line-height:1.78;
}

.pantry-copy ul,
.pantry-copy ol{
  padding-left:1.25rem;
}

.pantry-copy li{
  margin-bottom:8px;
}

.pantry-copy a{
  color:#ead197;
}

.pantry-summary,
.pantry-callout{
  margin:28px 0;
  padding:22px 24px;
  border:1px solid rgba(200,168,106,.2);
  border-left:4px solid var(--gold);
  border-radius:0 6px 6px 0;
  background:#121214;
}

.pantry-callout.is-sage{border-left-color:var(--pantry-sage)}
.pantry-callout.is-chili{border-left-color:var(--pantry-chili)}
.pantry-callout.is-turmeric{border-left-color:var(--pantry-turmeric)}

.pantry-summary strong:first-child,
.pantry-callout strong:first-child{
  color:var(--text);
}

.pantry-quote{
  margin:36px 0;
  padding:8px 0 8px 24px;
  border-left:2px solid var(--gold);
  color:var(--text);
  font-size:1.42rem;
  line-height:1.5;
}

.pantry-flow,
.pantry-facts{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:1px;
  margin:28px 0;
  border:1px solid rgba(200,168,106,.18);
  background:rgba(200,168,106,.18);
}

.pantry-flow span,
.pantry-facts div{
  min-width:0;
  padding:16px;
  background:#121214;
}

.pantry-flow.is-six{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}

.pantry-flow span{
  color:var(--text);
  font-weight:700;
  text-align:center;
}

.pantry-facts strong{
  display:block;
  margin-bottom:6px;
  color:var(--text);
}

.pantry-facts span{
  color:var(--muted);
  font-size:.92rem;
  line-height:1.5;
}

.pantry-table-wrap{
  margin:28px 0;
  overflow-x:auto;
  border:1px solid rgba(200,168,106,.18);
  border-radius:6px;
}

.pantry-table{
  width:100%;
  min-width:620px;
  border-collapse:collapse;
  background:#111114;
}

.pantry-table caption{
  padding:13px 16px;
  border-bottom:1px solid rgba(200,168,106,.14);
  background:var(--pantry-paper);
  color:var(--muted);
  font-size:.9rem;
  line-height:1.5;
  text-align:left;
}

.pantry-table-wrap:focus-visible{
  outline:2px solid rgba(200,168,106,.62);
  outline-offset:3px;
}

.pantry-table th,
.pantry-table td{
  padding:14px 16px;
  border-bottom:1px solid rgba(200,168,106,.14);
  text-align:left;
  vertical-align:top;
  line-height:1.55;
}

.pantry-table th{
  color:var(--text);
  background:var(--pantry-paper);
}

.pantry-table td{
  color:rgba(233,226,214,.78);
}

.pantry-table tr:last-child td{
  border-bottom:0;
}

.pantry-library{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
  margin:24px 0;
}

.pantry-mixture{
  padding:18px;
  border:1px solid rgba(200,168,106,.18);
  border-radius:6px;
  background:#111114;
}

.pantry-mixture h3{
  margin:0 0 8px;
  font-size:1.12rem;
}

.pantry-mixture p{
  margin:0;
  font-size:.96rem;
}

.pantry-series-nav{
  max-width:780px;
  margin:52px auto 0;
  padding:26px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.pantry-series-nav h2{
  margin:0 0 18px;
  font-size:1.35rem;
}

.pantry-series-nav ol{
  display:grid;
  gap:8px;
  margin:0;
  padding:0;
  list-style:none;
}

.pantry-series-nav a{
  display:grid;
  grid-template-columns:34px minmax(0, 1fr);
  gap:10px;
  padding:8px 0;
  border-bottom:0;
}

.pantry-series-nav a[aria-current="page"]{
  color:var(--gold);
}

.pantry-sources{
  margin-top:48px;
  padding-top:24px;
  border-top:1px solid var(--line);
}

.pantry-sources h2{
  margin-top:0;
  font-size:1.45rem;
}

.pantry-sources li,
.pantry-sources p{
  font-size:.92rem;
  line-height:1.65;
}

.pantry-footer{
  margin-top:34px;
  padding-top:22px;
  border-top:1px solid var(--line);
  color:var(--muted);
}

@media (max-width:760px){
  .pantry-page .container{
    margin-top:26px;
    padding:0 16px 90px;
  }

  .pantry-page .nav{
    flex-direction:column;
    align-items:stretch;
  }

  .pantry-page .navlinks{
    width:100%;
    flex-wrap:nowrap;
    justify-content:flex-start;
    overflow-x:auto;
    padding:2px 0 8px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }

  .pantry-page .navlinks::-webkit-scrollbar{
    display:none;
  }

  .pantry-page .navlinks .pill{
    flex:0 0 auto;
  }

  .pantry-page .navlinks [data-genjiko-translate]{
    order:-1;
  }

  .pantry-hero{
    padding-top:22px;
  }

  .pantry-hero h1,
  .pantry-article .pantry-hero h1{
    font-size:2.2rem;
  }

  .pantry-page #genjiko-guardian-root .genjiko-guardian-button{
    right:8px;
    bottom:8px;
    width:40px;
    height:40px;
  }

  .pantry-page #genjiko-guardian-root .genjiko-guardian-panel{
    right:10px;
    bottom:58px;
    max-width:calc(100vw - 20px);
    max-height:calc(100vh - 90px);
  }

  .pantry-manchette,
  .pantry-grid,
  .pantry-library{
    grid-template-columns:1fr;
  }

  .pantry-card:first-child,
  .pantry-card:last-child{
    grid-column:auto;
  }

  .pantry-flow,
  .pantry-facts{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .pantry-flow.is-six{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .pantry-copy h2{
    font-size:1.62rem;
  }
}

@media (min-width:761px) and (max-width:1040px){
  .pantry-hero h1{
    font-size:3.4rem;
  }

  .pantry-article .pantry-hero h1{
    font-size:3rem;
  }
}

@media (max-width:440px){
  .pantry-card-body{
    grid-template-columns:42px minmax(0, 1fr);
    padding:17px;
  }

  .pantry-flow,
  .pantry-facts,
  .pantry-flow.is-six{
    grid-template-columns:1fr;
  }
}

@media (max-width:359px){
  .pantry-hero .pantry-deck{
    margin-right:44px;
  }
}

@media (prefers-reduced-motion:reduce){
  .pantry-page *{
    scroll-behavior:auto;
  }
}
