:root {
  color-scheme: light;
  --ink: #101010;
  --navy: #172433;
  --blue: #25364a;
  --steel: #aeb8c4;
  --paper: #f3f3f1;
  --white: #fff;
  --muted: #515b66;
  --line: #d4d8dd;
  --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --serif: Georgia, "Times New Roman", serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 1rem/1.55 var(--sans); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 2px solid #526981; outline-offset: 4px; }
img, svg { display: block; }
img { max-width: 100%; }
svg { flex: none; }
figure, h1, h2, h3, p { margin: 0; }
em { font-family: var(--serif); font-weight: 400; letter-spacing: -.07em; }
::selection { color: var(--white); background: var(--blue); }

.skip-link { position: fixed; top: .75rem; left: .75rem; z-index: 2; transform: translateY(-200%); padding: .65rem 1rem; color: var(--white); background: var(--navy); }
.skip-link:focus { transform: none; }

.wrap { width: min(100% - 5rem, 76rem); margin-inline: auto; }
.site-header, .site-footer { background: var(--white); }
.site-header { border-bottom: 1px solid var(--line); }
.header-inner, .footer-inner { display: flex; justify-content: space-between; align-items: center; min-height: 4.7rem; gap: 1.5rem; }
.brand { display: inline-flex; align-items: center; flex: none; font-size: 1.35rem; font-weight: 900; letter-spacing: -.075em; line-height: 1; }
.brand .accent { color: #778795; }
.site-nav { display: flex; align-items: center; gap: clamp(.9rem, 3vw, 2.25rem); color: var(--muted); font-size: .88rem; font-weight: 600; }
.site-nav a { padding-block: .65rem; border-bottom: 1px solid transparent; }
.site-nav a:hover, .site-nav [aria-current="page"] { color: var(--ink); border-color: currentColor; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.1rem;
  padding: .7rem 1rem;
  gap: .7rem;
  border: 1px solid currentColor;
  font-size: .85rem;
  font-weight: 700;
  text-align: center;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.button-compact { min-height: 2.45rem; padding: .45rem .8rem; }
.button svg, .directory-link svg, .access-index svg, .card-link svg, .footer-inner svg { width: 1rem; height: 1rem; }
.button-compact:hover, .button.secondary:hover { color: var(--white); border-color: var(--navy); background: var(--navy); }

.eyebrow, .card-index, .directory-link, figcaption, .catalog-table thead, .overview-table thead {
  font-size: .69rem;
  font-weight: 750;
  letter-spacing: .145em;
  text-transform: uppercase;
}
.eyebrow { display: flex; align-items: center; gap: .6rem; color: var(--muted); }
.signal { width: .4rem; height: .4rem; border-radius: 50%; background: currentColor; }

.hero, .subpage-hero {
  color: var(--white);
  background: linear-gradient(115deg, #101010 4%, #141c26 66%, var(--navy) 100%);
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.13fr 1fr;
  align-items: center;
  gap: clamp(1rem, 5vw, 5.4rem);
  padding-block: clamp(2.75rem, 5.7vw, 5.3rem);
}
.hero-copy { min-width: 0; }
.hero .eyebrow, .subpage-hero .eyebrow, .community-intro .eyebrow { color: #c7d0da; }
h1 {
  margin-block: 1.15rem 1.45rem;
  font-size: clamp(2.75rem, 6.25vw, 6.75rem);
  font-weight: 850;
  line-height: .94;
  letter-spacing: -.078em;
}
h1 em { color: #cbd5df; }
.lead { max-width: 37ch; color: #d2d9e1; font-size: clamp(.98rem, 1.6vw, 1.17rem); line-height: 1.64; text-wrap: pretty; }
.actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.75rem; }
.hero .primary { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.hero .primary:hover { background: #ced8e3; border-color: #ced8e3; }
.hero .secondary { border-color: #7d8996; }
.hero .secondary:hover { background: var(--blue); border-color: #aeb8c4; }
.hero-art {
  position: relative;
  display: grid;
  grid-template-rows: 1fr auto;
  aspect-ratio: 1.07;
  min-width: 0;
  border: 1px solid #697789;
  background: #161d25;
}
.hero-art img { width: 100%; height: 100%; min-height: 0; object-fit: cover; object-position: center 51%; }
.hero-art figcaption {
  display: flex;
  justify-content: space-between;
  gap: .65rem;
  padding: .65rem .8rem;
  color: #d7e0eb;
  background: #182432;
  border-top: 1px solid #697789;
}

.section { padding-block: clamp(3.5rem, 6.8vw, 6.6rem); scroll-margin-top: 1rem; }
.section-head { max-width: 44rem; margin-bottom: 1.65rem; }
.section-head h2 { margin: .55rem 0 .75rem; font-size: clamp(2.45rem, 5.2vw, 5rem); font-weight: 850; line-height: .94; letter-spacing: -.073em; }
.section-head p:not(.eyebrow) { max-width: 43ch; color: var(--muted); text-wrap: pretty; }
.section-head .accent { color: #617388; }
.section-head .button { margin-top: 1.3rem; }

.directory { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; }
.directory-card {
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
  border: 1px solid var(--line);
  background: var(--white);
  transition: border-color .18s ease;
}
.directory-card:hover { border-color: #647a90; }
.directory-art { position: relative; display: grid; place-items: center; height: clamp(7.5rem, 15vw, 13rem); overflow: hidden; }
.art-bulk { background: #111923; }
.art-bulk img { height: 100%; width: 100%; object-fit: cover; object-position: center 46%; }
.art-community {
  isolation: isolate;
  background: linear-gradient(140deg, #516478, #1e2e42 72%);
  color: #f3f3f1;
}
.art-community > span { z-index: 1; font-size: clamp(1.6rem, 3.6vw, 4rem); line-height: .77; font-weight: 900; letter-spacing: -.08em; transform: rotate(-8deg); }
.art-community > span > span { color: #aeb8c4; }
.art-community i { position: absolute; width: 64%; height: 70%; border: 1px solid #9aaabd; transform: skew(-12deg) rotate(-8deg); }
.art-snipe { background: radial-gradient(ellipse at 50% 50%, #3d5066, #192534 76%); color: #d3dce6; }
.art-snipe svg { width: 90%; height: 90%; max-height: 10rem; }
.directory-copy { display: flex; flex-direction: column; align-items: flex-start; padding: clamp(.95rem, 2.2vw, 1.8rem); }
.directory-copy h3 { margin: .45rem 0 .3rem; font-size: clamp(1.25rem, 2.5vw, 2.2rem); letter-spacing: -.045em; line-height: 1.05; }
.directory-copy p { margin-bottom: 1rem; color: var(--muted); font-size: .9rem; }
.directory-link { display: inline-flex; align-items: center; gap: .4rem; margin-top: auto; color: var(--blue); letter-spacing: .07em; }
.directory-card:hover .directory-link { text-decoration: underline; text-underline-offset: 3px; }

.home-bulk { border-block: 1px solid var(--line); background: #e9ebed; }
.bulk-overview, .community-overview { display: grid; grid-template-columns: .9fr 1.2fr; align-items: start; gap: clamp(1.5rem, 6vw, 6rem); }
.bulk-overview .section-head, .community-overview .section-head { margin-bottom: 0; }
.overview-table, .catalog-table { width: 100%; border-collapse: collapse; }
.overview-table :is(th, td), .catalog-table :is(th, td) { text-align: left; }
.overview-table :is(th, td) { padding: .84rem .65rem; border-bottom: 1px solid #c8cdd3; }
.overview-table :is(th, td):first-child { padding-left: 0; }
.overview-table :is(th, td):last-child { padding-right: 0; text-align: right; white-space: nowrap; }
.overview-table thead { color: var(--muted); }
.overview-table td { font-variant-numeric: tabular-nums; }
.overview-table td:last-child { font-weight: 800; }
.section-note { margin-top: .9rem; color: var(--muted); font-size: .8rem; }

.community-intro { color: var(--white); background: var(--navy); }
.community-intro .section-head p:not(.eyebrow), .community-intro .section-note { color: #c7d0da; }
.community-intro em { color: #cbd5df; }
.access-index a { display: flex; align-items: center; min-height: 3.7rem; gap: .9rem; padding: .6rem 0; border-bottom: 1px solid #657385; }
.access-index a:first-child { border-top: 1px solid #657385; }
.access-index a:hover { color: #cbd5df; }
.access-index span { color: #c7d0da; font-size: .72rem; font-weight: 700; }
.access-index strong { font-size: clamp(1.13rem, 2vw, 1.65rem); }
.access-index svg { margin-left: auto; }

.subpage-hero .wrap { padding-block: clamp(2.8rem, 6vw, 5rem); }
.subpage-hero h1 { font-size: clamp(2.75rem, 7vw, 6.3rem); }
.subpage-hero .lead { max-width: 54ch; }
.subpage .section { padding-block: clamp(2.5rem, 5.3vw, 5rem); }
.catalog-layout { display: grid; grid-template-columns: minmax(0, 2.5fr) minmax(0, 1.35fr); gap: .9rem; align-items: center; }
.catalog { border: 1px solid var(--line); background: var(--white); }
.catalog-table :is(th, td) { padding: .75rem 1rem; border-bottom: 1px solid var(--line); }
.catalog-table thead { color: var(--muted); background: #e9ebed; }
.catalog-table :is(th, td):not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.catalog-table td:last-child { color: var(--navy); white-space: nowrap; }
.product { display: flex; align-items: center; gap: .7rem; }
.art-thumb { display: grid; place-items: center; flex: 0 0 2.45rem; height: 2.45rem; background: #e9ebed; color: #43566a; font-size: .72rem; }
.product-copy small { display: block; color: var(--muted); font-size: .75rem; font-weight: 500; }
.denim {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: end;
  width: 100%;
  aspect-ratio: 16 / 10;
  border: 1px solid var(--line);
  background: var(--navy);
}
.denim img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 43%; }
.denim::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: #334d68;
  mix-blend-mode: color;
  opacity: .35;
}
.denim figcaption {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 1.6rem .85rem .7rem;
  color: var(--white);
  background: linear-gradient(transparent, var(--navy));
}
.catalog-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .8rem; padding: .9rem 1rem; }
.catalog-footer .section-note { max-width: 45ch; margin: 0; }
.catalog-footer .button { min-height: 2.55rem; }

.access-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; }
.access-card { display: flex; flex-direction: column; align-items: flex-start; gap: .8rem; min-height: 16rem; padding: clamp(1rem, 2.3vw, 1.7rem); border: 1px solid var(--line); background: var(--white); scroll-margin-top: 1.5rem; }
.access-card:target { border-color: #526981; }
.card-index { color: var(--muted); }
.service-icon { display: grid; place-items: center; width: 2.65rem; height: 2.65rem; color: var(--white); background: var(--navy); }
.service-icon svg { width: 1.45rem; height: 1.45rem; }
.access-card h3 { font-size: 1.7rem; line-height: 1; letter-spacing: -.045em; }
.access-card p { color: var(--muted); font-size: .91rem; }
.plan-list { display: grid; width: 100%; gap: .4rem; margin: 0; color: var(--navy); font-size: .86rem; }
.plan-list div { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .15rem .6rem; padding-top: .4rem; border-top: 1px solid var(--line); }
.plan-list dt { font-weight: 750; }
.plan-list dd { margin: 0; }
.card-link { display: inline-flex; align-items: center; gap: .35rem; margin-top: auto; padding-top: .35rem; color: var(--navy); font-size: .87rem; font-weight: 750; }
.card-link:hover { text-decoration: underline; text-underline-offset: 3px; }

.site-footer { border-top: 1px solid var(--line); }
.footer-inner { min-height: 6rem; color: var(--muted); font-size: .9rem; }
.footer-inner .brand { color: var(--ink); }
.footer-inner nav { display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
.footer-inner nav a { display: inline-flex; align-items: center; gap: .2rem; }
.footer-inner nav a:hover { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 850px) {
  .wrap { width: min(100% - 3rem, 76rem); }
  .catalog-layout { grid-template-columns: 1fr; }
  .denim { max-width: 30rem; justify-self: center; }
}

@media (max-width: 630px) {
  .wrap { width: min(100% - 2rem, 76rem); }
  .header-inner { flex-wrap: wrap; gap: .35rem .75rem; padding-block: .65rem .45rem; }
  .site-nav { order: 3; flex-basis: 100%; }
  .site-nav a { padding-block: .45rem; }
  .hero-grid { grid-template-columns: 1fr; gap: 1.7rem; }
  h1 { font-size: clamp(2.9rem, 10.4vw, 4.4rem); }
  .hero-art { aspect-ratio: 1.36; }
  .hero-art img { object-position: center 43%; }
  .directory, .access-grid { grid-template-columns: 1fr; }
  .directory-card { grid-template: 1fr / minmax(6rem, .75fr) minmax(0, 1.3fr); }
  .directory-art { height: auto; min-height: 8rem; }
  .directory-copy { padding: .85rem; }
  .directory-copy p { margin-bottom: .6rem; }
  .bulk-overview, .community-overview { grid-template-columns: 1fr; }
  .catalog-table :is(th, td) { padding: .63rem .47rem; }
  .catalog-table thead { font-size: .59rem; letter-spacing: .05em; }
  .catalog-table td { font-size: .84rem; }
  .product { gap: .35rem; font-size: .87rem; }
  .art-thumb { display: none; }
  .access-card { min-height: auto; }
  .footer-inner { flex-wrap: wrap; min-height: auto; padding-block: 1.35rem; gap: .9rem 1.2rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}

/* Snipebot simulation */
.snipe-demo { background: #e9ebed; border-bottom: 1px solid var(--line); }
.snipe-demo-grid, .studio-overview {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  align-items: center;
  gap: clamp(1.6rem, 6vw, 6rem);
}
.snipe-demo .section-head, .studio-overview .section-head { margin-bottom: 0; }

.snipe-console {
  --feed-line: #435469;
  --feed-muted: #b9c8d9;
  min-width: 0;
  padding: clamp(.75rem, 2.4vw, 1.4rem);
  border: 1px solid #526478;
  border-radius: .5rem;
  background: linear-gradient(155deg, #25364a, #111a25 78%);
  box-shadow: 0 12px 30px #1724331a;
  color: var(--white);
}
.snipe-console-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .6rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid var(--feed-line);
}
.snipe-heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: baseline;
  column-gap: .45rem;
  line-height: 1.2;
}
.snipe-heading strong { font-size: 1.02rem; overflow-wrap: anywhere; }
.snipe-heading small { grid-column: 2; margin-top: .15rem; color: var(--feed-muted); font-size: .68rem; }
.snipe-hash { color: #a0b9d9; font-size: 1.15rem; font-weight: 750; }
.snipe-demo-badge {
  padding: .22rem .45rem;
  border: 1px solid #687a91;
  border-radius: .24rem;
  color: #dbe6f3;
  font-size: .63rem;
  font-weight: 750;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.snipe-channels {
  display: flex;
  flex-wrap: wrap;
  gap: .36rem;
  margin-top: .7rem;
}
.snipe-channels button {
  padding: .28rem .5rem;
  border: 1px solid var(--feed-line);
  border-radius: .26rem;
  background: #172433;
  color: #d5e0ee;
  font: 650 .69rem/1.4 var(--sans);
  cursor: pointer;
}
.snipe-channels button:hover { border-color: #8099b8; }
.snipe-channels button[aria-pressed="true"] {
  border-color: #7798c6;
  background: #344c6d;
  color: #fff;
}
.snipe-channels button:disabled { cursor: default; }

.snipe-feed {
  display: flex;
  flex-direction: column;
  gap: .65rem;
  block-size: 22.25rem;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  overflow-anchor: none;
  scrollbar-color: #62778e #142131;
  scrollbar-width: thin;
  margin: .7rem 0 .85rem;
  padding: .6rem;
  border: 1px solid var(--feed-line);
  border-radius: .35rem;
  background: #131f2e;
  list-style: none;
}
.snipe-placeholder {
  display: grid;
  flex: 1;
  place-items: center;
  padding: 1rem;
  border: 1px dashed #526780;
  border-radius: .2rem;
  background: repeating-radial-gradient(circle at center, transparent 0 24px, #8090a32b 25px 26px), #172433;
  color: #cbd5df;
  font-size: .83rem;
  font-weight: 650;
  text-align: center;
}
.snipe-piece {
  flex: none;
  min-width: 0;
  animation: piece-in .38s cubic-bezier(.16, 1, .3, 1) both;
}
.snipe-embed {
  display: grid;
  gap: .54rem;
  padding: .7rem;
  border: 1px solid var(--feed-line);
  border-inline-start: 3px solid #718dc2;
  border-radius: .35rem;
  background: #202e40;
}
.snipe-piece-heading {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .22rem .45rem;
  color: #a6c7ff;
}
.snipe-market { font-size: .77rem; }
.snipe-piece-title { flex: 1; min-width: 0; font-size: .96rem; line-height: 1.3; overflow-wrap: anywhere; }
.snipe-piece-price { font-size: .91rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.snipe-description { color: #dbe5f2; font-size: .75rem; line-height: 1.4; }
.snipe-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .52rem .55rem;
  margin: 0;
  line-height: 1.32;
}
.snipe-meta dt { color: var(--feed-muted); font-size: .67rem; font-weight: 700; overflow-wrap: anywhere; }
.snipe-meta dd { margin: .12rem 0 0; color: #f0f4fa; font-size: .73rem; overflow-wrap: anywhere; }
.snipe-piece-art {
  display: block;
  width: 100%;
  height: 6.7rem;
  border: 1px solid #5c6e83;
  border-radius: .24rem;
  background: #192638;
  object-fit: contain;
}
.snipe-embed-foot {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .48rem;
  color: var(--feed-muted);
  font-size: .67rem;
  line-height: 1.35;
}
.snipe-card-actions { display: flex; flex-wrap: wrap; gap: .24rem; margin-top: .36rem; }
.snipe-card-actions > span {
  display: inline-flex;
  align-items: center;
  gap: .24rem;
  padding: .18rem .38rem;
  border: 1px solid #626da3;
  border-radius: .23rem;
  background: #383f79;
  color: #f1f3ff;
  font-size: .64rem;
  font-weight: 650;
  line-height: 1.4;
}
.snipe-card-actions .snipe-action-buy { border-color: #497d68; background: #285846; color: #edfff7; }
.snipe-card-actions .snipe-action-view { border-color: #56697d; background: #243447; color: #e1ebf6; }

@keyframes piece-in {
  from { opacity: 0; transform: translateY(.65rem) scale(.98); }
  to { opacity: 1; transform: none; }
}
.snipe-actions, .catalog-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.snipe-actions .button, .tool-actions .button { font-family: inherit; cursor: pointer; }
.snipe-actions .button { min-height: 2.55rem; }
.snipe-actions .primary { border-color: var(--paper); background: var(--paper); color: var(--navy); }
.snipe-actions .primary:hover { background: #d1dce8; border-color: #d1dce8; }
.snipe-actions .secondary { background: transparent; color: #e2e9f1; border-color: #8b99a8; }
.snipe-actions .secondary:hover { background: var(--blue); border-color: #d1dce8; }
.snipe-actions .button:disabled { opacity: .48; cursor: default; }
.snipe-status { min-height: 1.25rem; margin-top: .65rem; color: #c7d0da; font-size: .77rem; }
.snipe-console :focus-visible, .tool-jump a:focus-visible { outline-color: #d1dce8; }
.demo-inline-link { color: var(--navy); font-size: .84rem; font-weight: 650; text-decoration: underline; text-underline-offset: .2em; }
.snipe-console [hidden], .tool-stack [hidden] { display: none; }

@media (max-width: 435px) {
  .snipe-feed { block-size: 23rem; padding: .45rem; }
  .snipe-embed { padding: .55rem; }
  .snipe-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .snipe-piece-art { height: 5.4rem; }
}

.snipe-photo-credits { margin-top: .35rem; color: #c7d0da; font-size: .72rem; }
.snipe-photo-credits summary { width: fit-content; cursor: pointer; }
.snipe-photo-credits ul { margin: .45rem 0; padding-inline-start: 1rem; }
.snipe-photo-credits a { text-decoration: underline; text-underline-offset: .15em; }

/* Reseller tools */
.studio-intro { border-top: 1px solid var(--line); background: var(--white); }
.studio-links { display: grid; gap: .6rem; }
.studio-links a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 1rem;
  align-items: center;
  gap: .8rem;
  min-height: 4.55rem;
  padding: .75rem 1rem;
  border: 1px solid var(--line);
  background: var(--paper);
}
.studio-links a:hover { border-color: #657589; }
.studio-links a > span { color: var(--muted); font-size: .72rem; font-weight: 750; }
.studio-links strong, .studio-links small { display: block; }
.studio-links strong { font-size: 1.1rem; letter-spacing: -.02em; }
.studio-links small { color: var(--muted); }
.studio-links svg { width: 1rem; height: 1rem; }
.tool-jump { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.4rem; }
.tool-jump a { padding: .48rem .68rem; border: 1px solid #758498; color: #e2e9f1; font-size: .77rem; font-weight: 650; }
.tool-jump a:hover { background: var(--blue); }
.tool-stack { display: grid; gap: 1.15rem; padding-block: clamp(2rem, 5vw, 4.5rem); }
.tool-panel {
  display: grid;
  gap: 1.2rem;
  min-width: 0;
  padding: clamp(1rem, 3.6vw, 2.5rem);
  border: 1px solid var(--line);
  background: var(--white);
  scroll-margin-top: .9rem;
}
.tool-panel-intro h2 { margin: .35rem 0 .4rem; font-size: clamp(1.9rem, 4vw, 3.5rem); line-height: 1.03; letter-spacing: -.06em; }
.tool-panel-intro p:not(.eyebrow) { max-width: 58ch; color: var(--muted); }
.tool-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .85rem; }
.tool-field { display: grid; grid-template-rows: auto auto; align-content: start; gap: .3rem; min-width: 0; color: var(--navy); font-size: .86rem; font-weight: 700; }
.tool-field small { color: var(--muted); font-size: .73rem; font-weight: 500; }
.tool-field :is(select, input, textarea) {
  width: 100%;
  min-height: 2.75rem;
  padding: .55rem .65rem;
  border: 1px solid #aeb8c4;
  border-radius: 0;
  background: #f5f6f7;
  color: var(--ink);
  font: 400 .94rem/1.45 var(--sans);
}
.tool-field :is(select, input, textarea):focus-visible { outline: 2px solid #526981; outline-offset: 2px; }
.tool-field [aria-invalid="true"] { border-color: #9a4640; }
.tool-field textarea { min-height: 9rem; resize: vertical; }
.tool-error { margin-top: .7rem; color: #862d26; font-size: .82rem; }
.tool-results {
  min-width: 0;
  padding: clamp(.8rem, 2.7vw, 1.5rem);
  background: var(--navy);
  color: var(--white);
}
.tool-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .55rem; }
.tool-metric { display: grid; align-content: space-between; gap: .4rem; min-width: 0; padding: .7rem; border: 1px solid #56677b; background: #25364a; }
.tool-metric span { color: #d4dee8; font-size: .75rem; line-height: 1.3; }
.tool-metric strong { font-size: clamp(1rem, 2.3vw, 1.65rem); line-height: 1.12; letter-spacing: -.045em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.tool-metric[data-trend="profit"] { border-color: #9aafbf; }
.tool-metric[data-trend="loss"] strong { color: #ffc5bd; }
.tool-compare { display: grid; gap: .4rem; margin-top: .9rem; }
.tool-compare-row { display: grid; grid-template-columns: 4.3rem 1fr; align-items: center; gap: .6rem; color: #d2dce7; font-size: .74rem; }
.tool-compare-track { height: .45rem; background: #34465b; }
.tool-compare-fill { display: block; width: 0; height: 100%; background: #d9e2ec; }
#bulk-cost-bar { background: #8ca4bb; }
.tool-note, .tool-status { color: var(--muted); font-size: .79rem; }
.tool-results .tool-note { margin-top: .6rem; color: #d2dce7; }
.tool-results .tool-field { color: var(--white); }
#request-planner .tool-results { margin-top: 1rem; }
#request-planner .tool-results .section-note, .tool-status { color: #d2dce7; }
.tool-status:empty { display: none; }
.tool-actions { margin-top: .75rem; }
.tool-actions .button { min-height: 2.6rem; }
.tool-actions .primary { background: var(--paper); border-color: var(--paper); color: var(--navy); }
.tool-actions .primary:hover { background: #d1dce8; border-color: #d1dce8; }
.tool-actions .secondary { background: transparent; border-color: #8b99a8; color: var(--white); }
.tool-actions .secondary:hover { background: var(--blue); border-color: #d1dce8; }
.tool-actions :focus-visible { outline-color: #d1dce8; }

@media (max-width: 850px) {
  .tool-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tool-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-nav { gap: .85rem; }
}
@media (max-width: 630px) {
  .snipe-demo-grid, .studio-overview { grid-template-columns: 1fr; }
}
@media (max-width: 435px) {
  .tool-fields { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .snipe-piece { animation: none; }
}

/* Memberships */
.membership { border-bottom: 1px solid var(--line); background: #e9ebed; }
.membership-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem;
}
.membership-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: clamp(.95rem, 2.7vw, 1.85rem);
  border: 1px solid var(--line);
  background: var(--white);
}
.membership-card.membership-featured {
  border-color: #596c81;
  background: linear-gradient(145deg, #25364a, #172433 72%);
  color: var(--white);
}
.membership-tier {
  margin-bottom: .8rem;
  color: var(--muted);
  font-size: .67rem;
  font-weight: 750;
  letter-spacing: .105em;
  text-transform: uppercase;
}
.membership-card h3 {
  font-size: clamp(1.35rem, 2.8vw, 2.35rem);
  line-height: 1.06;
  letter-spacing: -.05em;
}
.membership-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .15rem .45rem;
  margin-top: .6rem;
}
.membership-price strong {
  font-size: clamp(2rem, 4.5vw, 3.4rem);
  line-height: 1;
  letter-spacing: -.07em;
  white-space: nowrap;
}
.membership-price small { color: var(--muted); font-size: .76rem; white-space: nowrap; }
.membership-features {
  display: grid;
  gap: .55rem;
  padding: .85rem 0 0;
  margin: .85rem 0 1.2rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  list-style: none;
}
.membership-features li {
  display: grid;
  grid-template-columns: .9rem minmax(0, 1fr);
  gap: .3rem;
  font-size: .86rem;
  line-height: 1.45;
}
.membership-features li::before { content: ""; width: .48rem; height: .29rem; margin: .35rem .12rem 0; border: solid currentColor; border-width: 0 0 1.5px 1.5px; transform: rotate(-45deg); }
.membership-card .button { margin-top: auto; padding-inline: .65rem; min-height: 2.7rem; }
.membership-featured :is(.membership-tier, .membership-price small, .membership-features) { color: #d5e0eb; }
.membership-featured .membership-features { border-color: #667a90; }
.membership-featured .button { border-color: var(--paper); background: var(--paper); color: var(--navy); }
.membership-featured .button:hover { border-color: #cad6e3; background: #cad6e3; }
.membership-featured :focus-visible { outline-color: #d7e2ed; }
.membership-compare { margin-top: clamp(1.6rem, 4vw, 3rem); }
.membership-table { width: 100%; border-collapse: collapse; border: 1px solid var(--line); background: var(--white); }
.membership-table caption { margin-bottom: .6rem; text-align: left; font-size: clamp(1.25rem, 2.5vw, 1.65rem); font-weight: 750; letter-spacing: -.045em; }
.membership-table :is(th, td) { padding: .72rem .9rem; border-bottom: 1px solid var(--line); text-align: center; }
.membership-table th:first-child { width: 52%; text-align: left; }
.membership-table thead th { color: var(--navy); background: #e1e6eb; font-size: .85rem; }
.membership-table tbody th { color: #334253; font-size: .89rem; font-weight: 600; }
.membership-table .feature-yes { color: #243c54; font-weight: 850; }
.membership-table .feature-no { color: #677587; }
.membership-table tbody tr:nth-child(even) { background: #f8f9fa; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.tool-jump .tool-jump-primary { border-color: var(--paper); background: var(--paper); color: var(--navy); }
.tool-jump .tool-jump-primary:hover { border-color: #cad6e3; background: #cad6e3; }
.community-plan-link { color: #e2e9f1; border-color: #8b99a8; }
.community-plan-link:hover { color: var(--navy); border-color: var(--paper); background: var(--paper); }
.community-plan-link:focus-visible { outline-color: #d1dce8; }
.home-plan-prices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin: .85rem 0 0; }
.home-plan-prices > div { padding: .5rem .65rem; border: 1px solid #657385; }
.home-plan-prices dt { color: #c7d0da; font-size: .72rem; font-weight: 700; }
.home-plan-prices dd { margin: 0; color: #f3f3f1; font-size: 1.16rem; font-weight: 750; white-space: nowrap; }
.home-plan-prices small { color: #c7d0da; font-size: .7rem; font-weight: 400; }

@media (max-width: 850px) {
  .header-inner { column-gap: 1rem; }
  .home-plan-prices small { display: block; }
}
@media (max-width: 630px) {
  .site-nav { flex-wrap: wrap; }
}
@media (max-width: 590px) {
  .membership-grid { grid-template-columns: 1fr; }
  .membership-table :is(th, td) { padding: .6rem .4rem; }
  .membership-table :is(thead, tbody) th { font-size: .75rem; }
}

/* Split introduction */
.split-hero { padding-block: clamp(2.4rem, 6vw, 5rem); }
.split-intro h1 { max-width: 19ch; margin-bottom: clamp(1.5rem, 4vw, 2.8rem); }
.split-entries { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.split-entry {
  display: grid;
  align-items: end;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: clamp(19rem, 36vw, 31rem);
  border: 1px solid #677689;
  background: var(--navy);
  color: var(--white);
}
.split-entry img, .split-entry::after { position: absolute; inset: 0; width: 100%; height: 100%; }
.split-entry img { z-index: -2; object-fit: cover; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.split-snipe img { object-position: center 58%; }
.split-entry::after { z-index: -1; content: ""; background: linear-gradient(180deg, #111a2508 15%, #111a25ba 56%, #101820 100%); }
.split-caption { padding: clamp(1.15rem, 3vw, 2rem); }
.split-caption h2 { margin: .3rem 0; font-size: clamp(1.9rem, 4vw, 3.9rem); line-height: .98; letter-spacing: -.065em; }
.split-caption p:not(.eyebrow) { color: #e1e8ef; }
.split-caption > span { display: inline-flex; align-items: center; gap: .6rem; margin-top: .8rem; font-weight: 700; }
.split-caption svg { width: 1rem; height: 1rem; }
.plans-compare-link { margin-top: 1rem; }
@media (max-width: 610px) {
  .split-entries { grid-template-columns: 1fr; }
  .split-entry { min-height: 19rem; }
}
/* Motion belongs to the product imagery and the example feed. */
@media (prefers-reduced-motion: no-preference) {
  @media (hover: hover) and (pointer: fine) {
    .split-entry:hover img, .denim:hover img { transform: scale(1.08); }
  }
  .split-entry:focus-visible img { transform: scale(1.08); }
  .denim img { transition: transform .55s cubic-bezier(.2,.7,.2,1); }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .split-entry img {
      animation: product-drift linear both;
      animation-timeline: view();
      animation-range: exit 0% exit 100%;
    }
  }
}
@keyframes product-drift { to { scale: 1.09; } }

/* Reseller check, newsletter and measurement controls */
.split-intro h1 { margin-bottom: .7rem; }
.split-intro .lead { max-width: 49ch; margin-bottom: 1rem; }
.check-jump { display: inline-block; margin-bottom: 1.4rem; color: #dbe5f0; text-decoration: underline; text-underline-offset: .25em; }
.reseller-check { background: #f3f6f9; }
.check-layout, .newsletter-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 1.25rem; align-items: stretch; }
.check-options { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
.check-options button {
  text-align: left;
  padding: 1rem;
  background: white;
  border: 1px solid #bdcbd8;
  color: #172839;
  font: inherit;
  cursor: pointer;
}
.check-options :is(button:hover, button[aria-pressed="true"]) { background: #dfeaf3; border-color: #496984; }
.check-options small { display: block; font-size: .65rem; font-weight: 750; margin-bottom: .3rem; letter-spacing: .08em; }
.check-options strong { font-size: .95rem; line-height: 1.25; display: block; }
.check-result { padding: clamp(1.2rem, 4vw, 2.5rem); background: #152433; color: #f7fafc; }
.check-result .eyebrow { color: #c4d6e7; }
.check-result strong { display: block; margin: .6rem 0; font-size: clamp(1.3rem, 3vw, 2.25rem); line-height: 1.1; }
.check-result .button { margin-top: 1rem; }
.check-result [hidden], .cookie-panel[hidden] { display: none; }
.newsletter-section { border-top: 1px solid #c6d0dc; background: #e8edf3; }
.newsletter-form { display: grid; align-content: start; justify-items: start; gap: .7rem; padding: 1.2rem; border: 1px solid #bdcbd8; background: #fff; }
.newsletter-form input[type="email"] { width: 100%; padding: .65rem; font: inherit; border: 1px solid #8196aa; }
.newsletter-consent { display: grid; grid-template-columns: auto 1fr; align-items: start; gap: .5rem; font-size: .9rem; }
.newsletter-consent input { margin-top: .33rem; }
.newsletter-form .section-note { margin: 0; }
.newsletter-form [role="status"] { margin: 0; font-size: .9rem; }
.cookie-panel {
  position: fixed;
  z-index: 10;
  right: 1rem;
  bottom: 1rem;
  width: min(28rem, calc(100% - 2rem));
  padding: 1.1rem;
  background: #fff;
  color: #172839;
  border: 1px solid #8298ac;
  box-shadow: 0 8px 32px #18273833;
}
.cookie-panel p { font-size: .87rem; margin: .4rem 0 .75rem; }
.cookie-actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.cookie-actions button, .newsletter-form button { font-family: inherit; cursor: pointer; }
.cookie-actions .primary, .newsletter-form .primary, .check-result .primary { background: #234663; color: white; border-color: #234663; }
.cookie-settings { padding: .2rem 0; font: inherit; background: none; color: inherit; border: 0; text-decoration: underline; cursor: pointer; }
.admin-content { display: grid; gap: 1rem; }
.dashboard .subpage-hero a { color: #e0ebf5; }
.admin-metrics, .admin-grid { display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-metrics { grid-template-columns: repeat(4, minmax(0,1fr)); }
.admin-metrics div, .admin-panel { border: 1px solid #c5d3df; background: #fff; padding: 1rem; min-width: 0; }
.admin-metrics strong { display: block; font-size: 2rem; color: #234663; }
.admin-panel h2 { font-size: 1.2rem; margin: 0 0 .5rem; }
.admin-panel > div { overflow-x: auto; }
.admin-panel table { border-collapse: collapse; width: 100%; text-align: left; }
.admin-panel :is(th, td) { padding: .45rem; border-bottom: 1px solid #d9e3ed; font-size: .82rem; }
@media (max-width: 650px) {
  .check-layout, .newsletter-grid, .admin-grid { grid-template-columns: 1fr; }
  .admin-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
.cookie-panel a, .newsletter-form .section-note a, .privacy-info a { text-decoration: underline; }
.privacy-info { max-width: 48rem; }
.privacy-info h1 { font-size: clamp(1.8rem, 5vw, 3.2rem); }
.privacy-info h2 { margin-top: 1.25rem; }

.hero-routes { display: flex; flex-wrap: wrap; column-gap: 1.2rem; }
.bulk-order-link { display: inline-block; margin-top: .22rem; text-decoration: underline; text-underline-offset: .18em; color: #254764; }
.bulk-order-link:hover { color: #111d28; }

/* JT entrance and branching navigation */
.journey-gate { background: #101b28; }
.journey-trigger {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: .8rem;
  min-height: min(72svh, 39rem);
  padding: 1.7rem 1rem;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 56%, #32475a, #111c29 62%, #0b121b);
  color: #f5f7fb;
  cursor: pointer;
  perspective: 850px;
  list-style: none;
}
.journey-trigger::-webkit-details-marker { display: none; }
.journey-trigger:focus-visible { outline-offset: -5px; }
.journey-kicker, .journey-node {
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .17em;
  color: #c2d3e3;
}
.journey-mark {
  display: flex;
  gap: .04em;
  font-size: clamp(5rem, 22vw, 15rem);
  font-weight: 900;
  line-height: .82;
  letter-spacing: -.09em;
  transform-style: preserve-3d;
}
.journey-mark > span { display: inline-block; }
.journey-mark i { font-style: normal; color: #99b7ce; }
.journey-start-label, .journey-close-label {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  padding: .65rem 1rem;
  margin-top: .8rem;
  border: 1px solid #bdcddd;
  font-weight: 750;
}
.journey-start-label svg { width: 1rem; height: 1rem; }
.journey-trigger:hover .journey-start-label { background: #f5f7fb; color: #112236; }
.journey-close-label, .journey-gate[open] .journey-start-label { display: none; }
.journey-gate[open] .journey-close-label { display: inline-flex; }
.journey-gate[open] .journey-trigger { min-height: clamp(11rem, 34vw, 23rem); }
.journey-gate[open] .journey-mark { font-size: clamp(3rem, 12vw, 7rem); }
.journey-intro { background: #edf2f7; }
.journey-intro .section-head { margin-inline: auto; text-align: center; }
.journey-intro h1 { margin: .5rem 0; font-size: clamp(2.5rem, 8vw, 5.9rem); }
.journey-intro .section-head p { margin-inline: auto; }
.journey-node {
  width: max-content;
  margin: 2rem auto 0;
  padding: .48rem .85rem;
  background: #1d3246;
  border: 1px solid #7894ad;
  color: white;
  position: relative;
}
.journey-node::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  height: 1.1rem;
  border-left: 1px solid #708ba6;
}
.journey-map {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: .8rem;
  padding-top: 2.25rem;
  perspective: 950px;
}
.journey-map::before {
  content: "";
  position: absolute;
  top: 1.1rem;
  left: 16.66%;
  right: 16.66%;
  height: 1.15rem;
  border: solid #708ba6;
  border-width: 1px 1px 0;
  pointer-events: none;
}
.journey-map a {
  position: relative;
  display: grid;
  align-content: start;
  gap: .45rem;
  min-height: 8rem;
  padding: clamp(.8rem, 2.5vw, 1.45rem);
  background: #fff;
  border: 1px solid #9eb3c7;
  color: #142a3e;
  box-shadow: 0 .4rem 0 #c6d5e1;
}
.journey-map a:nth-child(2)::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 100%;
  height: 1.15rem;
  border-left: 1px solid #708ba6;
}
.journey-map a small { font-weight: 800; color: #435f78; }
.journey-map a strong { font-size: clamp(1rem, 2.4vw, 1.65rem); line-height: 1.1; }
.journey-map a > span { color: #45596d; font-size: .86rem; }
.journey-map a[aria-current], .journey-map a:hover { border-color: #294b69; background: #e0ebf4; }
.journey-panel { scroll-margin-top: .8rem; }
.journey-community { background: #fff; }
@media (prefers-reduced-motion: no-preference) {
  .journey-gate[open] .journey-mark > span:first-child { animation: jt-left .48s cubic-bezier(.2,.75,.25,1) both; }
  .journey-gate[open] .journey-mark > span:last-child { animation: jt-right .48s cubic-bezier(.2,.75,.25,1) both; }
  .journey-gate[open] .journey-intro, .journey-panel:not([hidden]) { animation: journey-reveal .4s ease-out both; }
  .journey-map a { transform: rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)); transition: transform .18s ease-out; }
}
@keyframes jt-left { to { transform: translateX(-42%) rotateY(-42deg); opacity: .82; } }
@keyframes jt-right { to { transform: translateX(42%) rotateY(42deg); opacity: .82; } }
@keyframes journey-reveal { from { opacity: .55; translate: 0 .65rem; } }
@media (max-width: 570px) {
  .journey-map { grid-template-columns: 1fr; padding-left: 1rem; padding-top: 1.3rem; }
  .journey-map::before { inset: 1.1rem auto 0 0; width: 1px; height: auto; border-width: 0 0 0 1px; }
  .journey-map a:nth-child(2)::before, .journey-node::after { display: none; }
  .journey-node { margin-left: 0; }
  .journey-map a { min-height: auto; }
}

.journey-return { padding-block: 1rem; }
.journey-panel { background: #f3f6f9; }

/* Original PNG monogram slides outward before navigating to the map. */
.journey-trigger { cursor: default; gap: .95rem; }
.journey-trigger h1.journey-kicker { font-size: .7rem; letter-spacing: .17em; margin: 0; line-height: 1.4; text-align: center; }
.journey-mark {
  position: relative;
  width: clamp(12rem, 45vw, 24rem);
  aspect-ratio: 1.18;
  mix-blend-mode: screen;
  perspective: 680px;
}
.journey-mark > span {
  position: absolute;
  inset: -9% 0;
  width: 100%;
}
.journey-mark > span::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/jt-original-logo.png") no-repeat center / 100% 100%;
  filter: invert(1);
  mask-image: linear-gradient(#000 52.4%, transparent 52.4% 65.7%, #000 65.7%);
}
.journey-mark > span:first-child::before {
  clip-path: polygon(0 0, 48% 0, 48% 29%, 40% 29%, 40% 100%, 0 100%);
}
.journey-mark > span:last-child::before {
  clip-path: polygon(41% 29%, 100% 29%, 100% 100%, 41% 100%);
}
.journey-mark > span::after {
  content: "";
  position: absolute;
  top: 52%;
  height: 14.5%;
  background: #fff;
}
.journey-mark > span:first-child::after { left: 29.6%; width: 9.4%; }
.journey-mark > span:last-child::after { left: 57.8%; width: 9.4%; }
.journey-mark i { position: absolute; left: 80%; top: 78%; width: 6.4%; aspect-ratio: 1; background: white; }
.journey-trigger .journey-start-label:hover { background: #f5f7fb; color: #112236; }
.journey-trigger:hover .journey-start-label:not(:hover) { background: transparent; color: inherit; }
.journey-terms { display: flex; align-items: flex-start; gap: .45rem; text-align: left; max-width: 31rem; font-size: .86rem; }
.journey-terms input {
  appearance: none;
  flex: 0 0 1.35rem;
  width: 1.35rem;
  height: 1.35rem;
  margin: 0;
  display: grid;
  place-items: center;
  border: 2px solid #b8cde1;
  border-radius: .25rem;
  background: #fff;
  color: var(--navy);
  cursor: pointer;
}
.journey-terms input:checked { background: #b8cde1; }
.journey-terms input:checked::after {
  content: "";
  width: .35rem;
  height: .63rem;
  border: solid currentColor;
  border-width: 0 .14rem .14rem 0;
  transform: translateY(-.06rem) rotate(45deg);
}
.journey-terms input:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@media (forced-colors: active) {
  .journey-terms input { appearance: auto; }
  .journey-terms input:checked::after { content: none; }
}
.journey-terms a { text-decoration: underline; text-underline-offset: .15em; }
.journey-map a::after { content: "↗"; justify-self: end; margin-top: .2rem; font-weight: 750; }
@media (prefers-reduced-motion: no-preference) {
  .journey-gate.is-opening .journey-mark > span {
    animation: jt-door-open 1.25s cubic-bezier(.42,0,.36,1) both;
    backface-visibility: hidden;
  }
  .journey-gate.is-opening .journey-mark > span:first-child {
    transform-origin: 28% 50%;
    --hinge-angle: -72deg;
    --door-shift: -44vw;
  }
  .journey-gate.is-opening .journey-mark > span:last-child {
    transform-origin: 86% 50%;
    --hinge-angle: 72deg;
    --door-shift: 44vw;
  }
  .journey-intro { animation: journey-reveal .4s ease-out both; }
}
@keyframes jt-door-open {
  0% { transform: translateX(0) rotateY(0deg); opacity: 1; }
  63% { transform: translateX(0) rotateY(var(--hinge-angle)); opacity: 1; }
  100% { transform: translateX(var(--door-shift)) rotateY(var(--hinge-angle)); opacity: 0; }
}


.journey-backbar { padding-top: 1.15rem; color: #172d40; }
.journey-backbar--map { background: #edf2f7; }
.journey-backbar--community { background: #fff; }
.journey-backbar--feed { background: #e9ebed; }
.journey-backbar--dark { background: linear-gradient(115deg, #101010 4%, #141c26 66%, var(--navy) 100%); color: #f5f7fb; }
.journey-back {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 2.5rem;
  padding: .35rem .8rem;
  border: 1px solid currentColor;
  font-size: .88rem;
  font-weight: 750;
}
.journey-back:hover { text-decoration: underline; text-underline-offset: .2em; }

.newsletter-consent[hidden] { display: none; }
.admin-session-button { background: none; border: 0; color: #284e70; padding: 0; text-align: left; font: inherit; text-decoration: underline; cursor: pointer; }
.admin-dialog { width: min(44rem, calc(100% - 2rem)); max-height: 86vh; border: 1px solid #8298ac; padding: 1rem; color: #172839; background: white; }
.admin-dialog::backdrop { background: #101820b3; }
.admin-dialog header { display: flex; align-items: center; justify-content: space-between; gap: .8rem; }
.admin-dialog h2 { font-size: 1.25rem; }
.admin-dialog #admin-session-events { overflow-x: auto; }
.admin-dialog table { width: 100%; border-collapse: collapse; text-align: left; }
.admin-dialog :is(th, td) { padding: .45rem; border-bottom: 1px solid #d9e3ed; font-size: .82rem; }