@import url("/assets/modules/typography.css");

.skip-link{position:fixed;left:16px;top:12px;z-index:10000;transform:translateY(-180%);border-radius:8px;background:var(--ink);color:var(--white);padding:10px 14px;font-weight:800;text-decoration:none;transition:transform 160ms ease}
.skip-link:focus{transform:translateY(0);outline:3px solid var(--accent);outline-offset:3px}

.product-library-shell {
  display: grid;
  gap: .9rem;
}

.product-library-intro,
.product-library-filters {
  display: grid;
  gap: 1rem;
}

.product-library-intro {
  grid-template-columns: minmax(0, 1.5fr) minmax(18rem, .7fr);
  align-items: end;
}

.product-library-intro h2,
.product-library-intro p {
  margin-block: 0;
}

.product-library-status-overview {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .65rem;
}

.product-library-status-tile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  min-height: 4rem;
  border: 1px solid rgba(66, 101, 83, .16);
  border-radius: .9rem;
  background: rgba(255, 255, 255, .72);
  padding: .75rem .9rem;
  color: inherit;
  text-decoration: none;
}

.product-library-status-tile strong {
  font-size: 1.45rem;
}

.product-library-status-tile.is-active {
  border-color: var(--accent-dark);
  background: #e8f2ec;
  box-shadow: inset 0 0 0 1px var(--accent-dark);
}

.product-library-filters {
  grid-template-columns: minmax(14rem, 2fr) repeat(2, minmax(10rem, 1fr)) auto;
  align-items: end;
  padding-block: .8rem;
}

.product-library-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}

.product-library-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: var(--muted);
}

.product-library-result-head p {
  margin: 0;
}

.product-library-card {
  display: block;
  align-self: start;
  overflow: clip;
  padding: 0;
}

.product-library-card.is-attention {
  border-color: #d39a55;
}

.product-library-card-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: .7rem;
  min-height: 5.1rem;
  padding: .85rem 1rem;
  cursor: pointer;
  list-style: none;
}

.product-library-card-summary::-webkit-details-marker {
  display: none;
}

.product-library-card-title {
  display: grid;
  min-width: 0;
  gap: .14rem;
}

.product-library-card-title small {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.product-library-card-title strong {
  overflow: hidden;
  font-size: 1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-library-readiness {
  display: flex;
  gap: .28rem;
}

.product-library-readiness span {
  border-radius: 999px;
  background: #eee9e2;
  padding: .25rem .42rem;
  color: #887a68;
  font-size: .67rem;
  font-weight: 850;
}

.product-library-readiness span.is-ready {
  background: #dcefdc;
  color: #245d2c;
}

.product-library-chevron {
  transition: transform .2s ease;
  color: var(--muted);
  font-size: 1.3rem;
}

.product-library-card[open] .product-library-chevron {
  transform: rotate(180deg);
}

.product-library-card-body {
  display: grid;
  gap: 1rem;
  border-top: 1px solid rgba(66, 101, 83, .12);
  padding: 1rem;
}

.product-library-detail-grid {
  display: grid;
  grid-template-columns: minmax(8rem, .45fr) minmax(0, 1.55fr);
  align-items: start;
  gap: 1rem;
}

.product-library-original {
  width: min(11rem, 100%);
  max-height: 14rem;
  object-fit: contain;
  justify-self: center;
  border-radius: .8rem;
  background: #fff;
}

.product-library-image-placeholder {
  display: grid;
  min-height: 8rem;
  place-items: center;
  border: 1px dashed rgba(66, 101, 83, .3);
  border-radius: .8rem;
  padding: 1rem;
  color: var(--muted);
  text-align: center;
}

.product-library-card code {
  overflow-wrap: anywhere;
  font-size: .72rem;
}

.product-library-fallback,
.product-library-review,
.product-library-warnings {
  display: grid;
  gap: .8rem;
  padding: 1rem;
  border-radius: 1rem;
  background: color-mix(in srgb, var(--paper, #fff) 88%, #e7c897);
}

.product-library-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .55rem;
}

.content-job-library-origin {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-color: rgba(184, 50, 98, .22);
  background: #fff8f1;
}

.content-job-library-origin h2,
.content-job-library-origin p {
  margin-block: 0;
}

.content-job-library-origin > p {
  max-width: 34rem;
  color: var(--muted);
}

.content-studio-badge.is-complete {
  background: #dcefdc;
  color: #245d2c;
}

.content-studio-badge.is-pip_missing,
.content-studio-badge.is-image_missing,
.content-studio-badge.is-review_open {
  background: #f7e5c9;
  color: #75451a;
}

.product-library-pagination {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem;
  margin-top: .4rem;
  text-align: center;
}

.product-library-pagination > :last-child {
  justify-self: end;
}

@media (max-width: 800px) {
  .product-library-intro,
  .product-library-list {
    grid-template-columns: 1fr;
  }

  .product-library-status-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-library-filters {
    grid-template-columns: 1fr;
  }

  .product-library-result-head {
    align-items: start;
    flex-direction: column;
  }

  .product-library-card-summary {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .product-library-readiness {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .product-library-card-summary > .content-studio-badge {
    grid-column: 2;
    grid-row: 1;
  }

  .product-library-chevron {
    display: none;
  }

  .product-library-detail-grid {
    grid-template-columns: 1fr;
  }

  .content-job-library-origin {
    align-items: start;
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .product-library-status-overview {
    grid-template-columns: 1fr;
  }
}

/* Premium Starter-Set Erweiterung */
.starterset-section,.starterset-update-note{padding:clamp(56px,8vw,104px) max(16px,calc((100% - 1120px)/2))}
.starterset-section header{max-width:820px}.starterset-section header>p:last-child,.starterset-section>p,.starterset-guidance p,.starterset-fit p{color:#465365;font-size:clamp(1.02rem,1.7vw,1.18rem)}
.starterset-hero-lead{font-weight:800}.starterset-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:28px}.starterset-actions .button{min-height:50px;justify-content:center;text-align:center}.starterset-actions .secondary{border:1px solid #5b7868;background:transparent;color:#3f6250}.starterset-actions-center{justify-content:center}
.starterset-contents,.starterset-accessories{background:#fbfaf7}.starterset-variants,.starterset-guidance{background:#eef6f2}
.starterset-card-grid,.starterset-variant-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr));gap:16px;margin-top:38px}
.starterset-card-grid article,.starterset-variant-grid article{overflow:hidden;border:1px solid rgba(70,83,101,.1);border-radius:18px;background:rgba(255,255,255,.76);box-shadow:0 16px 38px rgba(75,101,88,.08)}
.starterset-card-grid article{padding:24px}.starterset-card-grid article>span{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:#e4f0ea;color:#426553;font-weight:900}
.starterset-card-grid h3,.starterset-variant-grid h3{margin:18px 0 9px;font-family:Georgia,"Times New Roman",serif;font-size:1.35rem;line-height:1.2}.starterset-card-grid p,.starterset-variant-grid p{margin:0;color:#526175}
.starterset-variant-grid article{display:grid;grid-template-rows:190px 1fr}.starterset-variant-grid img{width:100%;height:100%;object-fit:cover}.starterset-variant-grid article>div{display:flex;flex-direction:column;gap:14px;padding:24px}.starterset-variant-grid .starterset-card-meta{color:#738878;font-size:.78rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.starterset-variant-grid a{min-height:44px;display:inline-flex;align-items:center;margin-top:auto;color:#426553;font-weight:900}
.starterset-availability,.starterset-gentle-note,.starterset-update-note{border-left:4px solid #d79d88;background:rgba(255,255,255,.72);color:#465365}.starterset-availability,.starterset-gentle-note{margin:28px 0 0;border-radius:0 12px 12px 0;padding:16px 18px}
.starterset-fit,.starterset-guidance{display:grid;gap:clamp(28px,5vw,56px)}.starterset-check-list{display:grid;gap:12px;margin:0;padding:0;list-style:none}.starterset-check-list li{border-radius:12px;background:rgba(255,255,255,.76);padding:14px 16px 14px 44px;position:relative;color:#465365;font-weight:700}.starterset-check-list li::before{content:"✓";position:absolute;left:17px;color:#426553;font-weight:900}
.starterset-update-note{width:min(calc(100% - 32px),1120px);margin:clamp(30px,5vw,64px) auto;border-radius:0 14px 14px 0;padding:20px 22px;font-size:.94rem;line-height:1.6}.starterset-trust{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px;margin:0 auto 46px!important;gap:10px!important}.starterset-trust span{border-radius:999px;background:#eef6f2;padding:11px 14px;color:#426553;font-weight:850}
@media(min-width:820px){.starterset-fit,.starterset-guidance{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:start}.starterset-trust{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:819px){.starterset-guide-hero{padding-top:46px}.starterset-guide-hero h1{font-size:clamp(2.45rem,12vw,3.65rem)}.starterset-jumpnav{position:static;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto}.starterset-jumpnav a{flex:0 0 auto}.starterset-actions,.starterset-actions .button{width:100%}}
@media(max-width:520px){.starterset-card-grid,.starterset-variant-grid{grid-template-columns:1fr}.starterset-trust{grid-template-columns:1fr}}

.diffusers-page { width: 100%; padding-bottom: 78px; }

.diffusers-hero,
.diffuser-finder,
.diffuser-journey,
.diffuser-next-steps,
.diffuser-source-note { width: min(100% - 32px, 1120px); margin-inline: auto; }

.diffusers-hero { display: grid; gap: clamp(26px, 5vw, 60px); align-items: center; padding: clamp(42px, 6vw, 76px) 0 clamp(48px, 7vw, 84px); }

.diffusers-hero h1,
.diffuser-finder h2,
.diffuser-journey h2,
.diffuser-next-steps h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; letter-spacing: 0; }

.diffusers-hero h1 { max-width: 760px; font-size: clamp(2.35rem, 5.6vw, 4.8rem); line-height: .96; }
.diffusers-hero > div:first-child > p:not(.section-kicker) { max-width: 720px; margin: 22px 0 0; color: #465365; font-size: clamp(1.08rem, 2vw, 1.28rem); }

.diffuser-hero-visual,
.diffuser-card-visual { position: relative; overflow: hidden; display: grid; place-items: end center; background: radial-gradient(circle at 50% 70%, rgba(240, 216, 143, .34), transparent 45%), linear-gradient(145deg, rgba(255,255,255,.8), rgba(221,180,220,.26)); }

.diffuser-hero-visual { min-height: 260px; border: 1px solid rgba(115,184,142,.18); border-radius: 48% 52% 46% 54%; padding-bottom: 42px; }

.diffuser-hero-visual img,
.diffuser-card-visual img { position: relative; z-index: 2; display: block; max-width: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 18px 24px rgba(73,56,78,.14)); }
.diffuser-hero-visual img { width: min(74%, 260px); max-height: 240px; align-self: center; }

.diffuser-shape { z-index: 2; position: relative; display: block; width: 94px; height: 112px; border-radius: 52% 52% 28% 28% / 62% 62% 22% 22%; background: linear-gradient(145deg, #fff, #d8d9d5 62%, #bbbdb9); box-shadow: inset -9px -8px 20px rgba(73,56,78,.11), 0 18px 28px rgba(73,56,78,.17); }
.diffuser-shape::after { content: ""; position: absolute; left: 18%; right: 18%; bottom: 8px; height: 3px; border-radius: 3px; background: rgba(115,184,142,.72); box-shadow: 0 0 12px rgba(115,184,142,.65); }
.diffuser-mist { z-index: 1; position: absolute; bottom: 142px; width: 32px; height: 72px; border-left: 3px solid rgba(115,184,142,.28); border-radius: 50%; transform: rotate(-8deg); }
.mist-two { margin-left: 24px; height: 58px; transform: rotate(13deg); opacity: .7; }

.diffuser-finder { padding: clamp(40px, 6vw, 70px) 0; border-top: 1px solid rgba(115,184,142,.2); }
.diffuser-section-heading { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 20px; }
.diffuser-finder h2, .diffuser-journey h2 { font-size: clamp(1.9rem, 4vw, 3.2rem); line-height: 1.03; }
.diffuser-filters { display: flex; flex-wrap: wrap; gap: 9px; }
.diffuser-filters button { min-height: 42px; border: 1px solid rgba(91,108,99,.18); border-radius: 8px; background: rgba(255,255,255,.72); padding: 0 15px; color: var(--accent-dark); font: inherit; font-weight: 850; cursor: pointer; }
.diffuser-filters button[aria-pressed="true"] { border-color: var(--accent-dark); background: var(--accent-dark); color: var(--white); }
.diffuser-filter-note { min-height: 24px; margin: 18px 0 24px; color: var(--muted); font-weight: 700; }

.diffuser-card-grid { display: grid; gap: 18px; }
.diffuser-card { display: grid; grid-template-rows: 180px auto auto 1fr auto; gap: 12px; border: 1px solid rgba(91,108,99,.14); border-radius: 8px; background: rgba(255,255,255,.74); padding: 18px; box-shadow: var(--shadow); }
.diffuser-card[hidden] { display: none; }
.diffuser-card-visual { min-height: 180px; border-radius: 6px; padding-bottom: 22px; }
.diffuser-card-visual img { width: min(88%, 280px); max-height: 170px; align-self: center; }
.diffuser-card-visual .diffuser-mist { bottom: 112px; height: 48px; }
.diffuser-card-visual .diffuser-shape { width: 70px; height: 86px; }
.diffuser-shape--lantern { width: 82px !important; border-radius: 18px 18px 30px 30px; background: linear-gradient(90deg, #4d514f, #777d79 48%, #3e4240); }
.diffuser-shape--owl { width: 78px !important; border-radius: 48% 48% 35% 35%; background: linear-gradient(145deg, #f4eee5, #c9b8a5); }
.diffuser-shape--owl::before { content: "••"; position: absolute; inset: 18px 0 auto; color: #685f55; font-size: 28px; letter-spacing: 10px; text-align: center; }
.diffuser-shape--viya { height: 58px !important; border-radius: 48% 48% 22% 22%; background: linear-gradient(145deg, #f6f0e6, #b7aa96); }
.diffuser-shape--wanderful { width: 58px !important; height: 76px !important; border-radius: 15px; background: linear-gradient(145deg, #e9dfd0, #b9a993); }
.diffuser-shape--aria { width: 92px !important; border-radius: 50% 50% 24% 24%; background: linear-gradient(145deg, #c49562, #785334); }
.diffuser-label { width: fit-content; margin: 0; border-radius: 999px; background: rgba(221,180,220,.25); padding: 6px 10px; color: var(--accent-dark); font-size: .78rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.diffuser-card h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.65rem; letter-spacing: 0; }
.diffuser-card > p:not(.diffuser-label) { margin: 0; color: var(--muted); }
.diffuser-card > a { width: fit-content; color: var(--accent-dark); font-weight: 900; text-decoration-thickness: 1px; text-underline-offset: 4px; }

.diffuser-journey { padding: clamp(46px, 7vw, 80px) 0; border-top: 1px solid rgba(115,184,142,.2); }
.diffuser-journey > div { display: grid; gap: 18px; margin-top: 28px; }
.diffuser-journey article { border-top: 2px solid rgba(115,184,142,.28); padding-top: 16px; }
.diffuser-journey article:first-child { border-color: var(--accent); }
.diffuser-journey article span { color: var(--muted); font-weight: 900; }
.diffuser-journey article h3 { margin: 8px 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.45rem; }
.diffuser-journey article p { margin: 0; color: var(--muted); }

.diffuser-next-steps { display: grid; gap: 18px; }
.diffuser-next-steps a { display: block; border: 1px solid rgba(115,184,142,.18); border-radius: 8px; background: rgba(255,255,255,.68); padding: clamp(22px,4vw,34px); color: inherit; text-decoration: none; box-shadow: var(--shadow); }
.diffuser-next-steps span { color: var(--accent-dark); font-weight: 900; }
.diffuser-next-steps h2 { margin: 8px 0; font-size: clamp(1.5rem,3vw,2.25rem); }
.diffuser-next-steps p { margin: 0; color: var(--muted); }
.diffuser-source-note { margin-top: 30px; color: var(--muted); font-size: .92rem; font-weight: 650; }

.homepage-work-admin { display: grid; gap: 22px; }
.homepage-work-overview { display: grid; gap: 16px; }
.homepage-work-overview article,
.homepage-work-preview-panel,
.homepage-work-publish-panel { border: 1px solid rgba(115,184,142,.18); border-radius: 8px; background: rgba(255,255,255,.82); padding: clamp(20px,3vw,30px); box-shadow: var(--shadow); }
.homepage-work-overview article { display: grid; align-content: start; gap: 8px; }
.homepage-work-overview article > span { color: var(--muted); font-size: .82rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.homepage-work-overview article > strong { color: var(--accent-dark); font-family: Georgia,"Times New Roman",serif; font-size: 1.65rem; }
.homepage-work-overview article > p { margin: 0; color: var(--muted); }
.homepage-work-server-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.homepage-work-preview-panel,
.homepage-work-publish-panel { display: grid; gap: 20px; }
.homepage-work-preview-panel h2,
.homepage-work-publish-panel h2 { margin: 0 0 8px; font-family: Georgia,"Times New Roman",serif; font-size: clamp(1.7rem,3vw,2.35rem); letter-spacing: 0; }
.homepage-work-preview-panel p,
.homepage-work-publish-panel p { margin: 0; color: var(--muted); }
.homepage-work-links,
.homepage-work-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.homepage-work-page-directory { display: grid; gap: 18px; min-width: 0; }
.homepage-work-page-group { display: grid; gap: 10px; }
.homepage-work-page-group h3 { display: flex; gap: 8px; align-items: center; margin: 0; color: var(--accent-dark); font-size: 1rem; }
.homepage-work-page-group h3 span { display: inline-grid; min-width: 24px; height: 24px; place-items: center; border-radius: 999px; background: rgba(91,108,99,.1); color: var(--muted); font-size: .75rem; }
.homepage-work-actions { align-items: stretch; flex-direction: column; }
.homepage-work-confirm { display: flex; gap: 10px; align-items: flex-start; border: 1px solid rgba(91,108,99,.15); border-radius: 8px; background: rgba(247,249,246,.8); padding: 14px 16px; color: #465365; font-weight: 750; }
.homepage-work-confirm input { width: 20px; height: 20px; margin: 1px 0 0; flex: 0 0 auto; }
.homepage-work-delete-confirm { border-color: rgba(154,61,74,.3); background: rgba(154,61,74,.07); color: #7d2f3a; }
.homepage-work-delete-confirm[hidden] { display: none; }
.homepage-work-publish { width: fit-content; background: #9a3d4a; }
.homepage-work-publish:hover:not(:disabled) { background: #7d2f3a; }
.homepage-work-result { min-height: 24px; border-radius: 8px; color: var(--muted); font-weight: 750; }
.homepage-work-result.is-success { color: #27704a; }
.homepage-work-result.is-warning { color: #8a5a20; }
.homepage-work-result.is-error { color: #9a3d4a; }
.homepage-work-log { border-top: 1px solid rgba(91,108,99,.14); padding-top: 16px; }
.homepage-work-log summary { cursor: pointer; color: var(--accent-dark); font-weight: 850; }
.homepage-work-log pre { max-height: 360px; overflow: auto; border-radius: 8px; background: #1f2925; padding: 16px; color: #eaf3ee; font-size: .82rem; white-space: pre-wrap; word-break: break-word; }
.homepage-work-inline-count { display: inline-grid; min-width: 28px; height: 28px; place-items: center; margin-left: 8px; border-radius: 999px; background: rgba(91,108,99,.1); color: var(--muted); font-size: .82rem; vertical-align: middle; }
.homepage-work-workstands,
.homepage-work-backups { border: 1px solid rgba(115,184,142,.18); border-radius: 8px; background: rgba(255,255,255,.82); padding: clamp(20px,3vw,30px); box-shadow: var(--shadow); display: grid; gap: 20px; }
.homepage-work-workstand-items { list-style: none; display: grid; gap: 12px; padding: 0; margin: 0; }
.homepage-work-workstand { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; align-items: center; border-radius: 8px; background: rgba(255,255,255,.64); padding: 14px; }
.homepage-work-workstand-heading { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 6px; }
.homepage-work-workstand-heading h3 { margin: 0; color: var(--ink); }
.homepage-work-workstand-heading span { color: var(--accent-dark); font-size: .82rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.homepage-work-workstand-description,
.homepage-work-workstand-git,
.homepage-work-workstand-state { margin: 0; color: var(--muted); }
.homepage-work-workstand-git { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: .9rem; }
.homepage-work-workstand-meta { display: grid; gap: 10px; justify-items: end; }
.homepage-work-workstand-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
.homepage-work-workstand-hint { color: var(--muted); font-size: .9rem; }

@media (min-width: 820px) {
  .homepage-work-overview { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .homepage-work-preview-panel,
  .homepage-work-publish-panel { grid-template-columns: minmax(250px,.75fr) minmax(0,1.25fr); align-items: start; }
  .homepage-work-publish-panel .homepage-work-result,
  .homepage-work-publish-panel .homepage-work-log { grid-column: 1 / -1; }
}

@media (min-width: 700px) {
  .diffusers-hero { grid-template-columns: minmax(0, 1.3fr) minmax(260px, .7fr); }
  .diffuser-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .diffuser-journey > div { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .diffuser-next-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1040px) {
  .diffuser-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@font-face {
  font-family: "Newscript";
  src: url("/assets/fonts/Newscript.ttf") format("truetype");
  font-display: swap;
  font-weight: 400;
  font-style: normal;
}

:root {
  color-scheme: light;
  --ink: #242936;
  --muted: #596476;
  --paper: #eaf3f0;
  --soft: #f5f8f6;
  --nav-bg: #f2f6ef;
  --cream: #fffaf0;
  --line: #dbe6df;
  --accent: #73b88e;
  --accent-dark: #4f8b68;
  --blue: #9fb7dc;
  --rose: #f3b9aa;
  --lavender: #ddb4dc;
  --sun: #f0d88f;
  --white: #ffffff;
  --shadow: 0 18px 60px rgba(59, 78, 67, 0.14);
  --brand-font: "Waveruder", Georgia, "Times New Roman", serif;
  --script-font: "Newscript", "Brush Script MT", cursive;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
}

body:not(:has(.admin-shell)):not(:has(.login)) main,
body:not(:has(.admin-shell)):not(:has(.login)) img {
  -webkit-user-select: none;
  user-select: none;
}

body:not(:has(.admin-shell)):not(:has(.login)) img {
  -webkit-user-drag: none;
}

.content-protection-toast {
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 9999;
  max-width: min(360px, calc(100vw - 32px));
  border: 1px solid rgba(115, 184, 142, 0.28);
  border-radius: 8px;
  background: rgba(36, 41, 54, 0.94);
  color: var(--white);
  padding: 12px 14px;
  font-size: 0.92rem;
  font-weight: 800;
  box-shadow: 0 18px 48px rgba(36, 41, 54, 0.24);
  opacity: 0;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity 180ms ease, transform 180ms ease;
}

.content-protection-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

a {
  color: inherit;
  text-decoration-color: rgba(79, 139, 104, 0.35);
  text-underline-offset: 0.18em;
}

button,
input,
textarea,
select {
  font: inherit;
}

button {
  min-height: 48px;
  border: 0;
  border-radius: 8px;
  background: var(--accent);
  color: var(--white);
  padding: 0 18px;
  font-weight: 700;
}

.nav-parent {
  min-height: 48px;
  border-radius: 0;
  background: transparent;
  color: #596476;
  padding: 0;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  font-weight: 500;
  cursor: pointer;
}

.site-header {
  position: relative;
  z-index: 70;
  background: var(--white);
}

.brand-hero {
  min-height: clamp(190px, 24vw, 320px);
  display: flex;
  align-items: center;
  background-image: url("/assets/brand/header-oils.png");
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.brand {
  display: inline-flex;
  align-items: center;
  width: clamp(132px, 17vw, 220px);
  margin-left: clamp(18px, 4vw, 52px);
  text-decoration: none;
}

.brand img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 8px 18px rgba(53, 56, 61, 0.12));
}

.site-search {
  display: grid;
  grid-template-columns: 0 minmax(72px, auto) 0;
  align-items: center;
  width: 106px;
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  overflow: hidden;
  transition: width 900ms cubic-bezier(0.22, 1, 0.36, 1), border-color 520ms ease, background 520ms ease;
}

.site-search input {
  width: 100%;
  min-height: 44px;
  border: 0;
  background: transparent;
  opacity: 0;
  padding: 0;
  color: #777777;
  caret-color: #9c9a96;
  font-size: 1.2rem;
  font-weight: 400;
  transition: opacity 520ms ease 180ms, padding 760ms cubic-bezier(0.22, 1, 0.36, 1);
}

.site-search input:focus {
  outline: 0;
}

.site-search input:focus::placeholder {
  color: transparent;
}

.search-trigger,
.site-search button {
  min-height: 44px;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  font-size: 1rem;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  cursor: pointer;
}

.search-submit {
  width: 0;
  overflow: hidden;
  visibility: hidden;
}

.search-icon {
  width: 18px;
  height: 18px;
  display: block;
  position: relative;
  flex: 0 0 auto;
}

.search-icon::before,
.search-icon::after {
  content: "";
  position: absolute;
  display: block;
}

.search-icon::before {
  width: 12px;
  height: 12px;
  left: 0;
  top: 0;
  border: 2px solid currentColor;
  border-radius: 50%;
}

.search-icon::after {
  width: 7px;
  height: 2px;
  left: 11px;
  top: 13px;
  border-radius: 999px;
  background: currentColor;
  transform: rotate(45deg);
}

.social-links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  transform: translateY(-2px);
  transition: opacity 420ms ease, transform 520ms cubic-bezier(0.22, 1, 0.36, 1), visibility 420ms ease;
}

.social-links a {
  width: 40px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--accent-dark);
  box-shadow: none;
  text-decoration: none;
}

.social-links svg {
  width: 25px;
  height: 25px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.85;
}

.social-links a[aria-label="Telegram"] svg path:first-child,
.social-links a[aria-label="Young Living"] svg path:first-child {
  fill: currentColor;
  stroke: none;
}

.social-links .yl-icon {
  width: 32px;
  height: 32px;
  fill: currentColor;
  stroke: none;
}

.social-links .yl-icon path:last-child {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
}

.social-links a:hover,
.social-links a:focus {
  background: rgba(115, 184, 142, 0.12);
  color: var(--accent-dark);
}

.main-nav {
  position: sticky;
  top: 0;
  z-index: 75;
  min-height: 76px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(14px, 2vw, 28px);
  padding: 0 clamp(18px, 3vw, 40px);
  border-top: 1px solid rgba(36, 41, 54, 0.06);
  border-bottom: 1px solid rgba(255, 255, 255, 0.85);
  background: var(--nav-bg);
}

body:has(.admin-dock) .main-nav {
  top: var(--admin-dock-height, 56px);
}

.nav-items {
  grid-column: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 3vw, 44px);
}

.nav-items > a,
.nav-items > .nav-dropdown {
  flex: 0 0 auto;
  white-space: nowrap;
}

.nav-utilities {
  grid-column: 2;
  justify-self: end;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.nav-utilities.search-open .social-links,
.nav-utilities:has(.site-search:focus-within) .social-links {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transform: translate(10px, -2px);
}

.nav-utilities.search-open .site-search,
.site-search:focus-within {
  grid-template-columns: minmax(0, 1fr) 0 42px;
  width: min(27vw, 300px);
  border-color: transparent;
  background: transparent;
}

.nav-utilities.search-open .site-search input,
.site-search:focus-within input {
  opacity: 1;
  padding: 0 10px 0 0;
}

.nav-utilities.search-open .site-search button,
.site-search:focus-within button {
  background: transparent;
  color: #777777;
  justify-content: center;
  padding: 0;
}

.nav-utilities.search-open .search-trigger,
.site-search:focus-within .search-trigger {
  overflow: hidden;
  visibility: hidden;
}

.nav-utilities.search-open .search-submit,
.site-search:focus-within .search-submit {
  width: auto;
  visibility: visible;
}

.main-nav a,
.nav-items a {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  color: #596476;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  font-weight: 500;
  text-decoration: none;
}

.main-nav a:hover,
.nav-parent:hover,
.nav-dropdown.open .nav-parent {
  color: var(--accent-dark);
}

.nav-dropdown {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
}

.product-nav-dropdown {
  position: relative;
}

.nav-dropdown::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 18px;
  pointer-events: none;
}

.submenu {
  width: 100%;
  max-height: min(64vh, 520px);
  overflow: auto;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 16px;
  padding: 28px max(24px, calc((100vw - 1120px) / 2 + 24px));
  border-top: 1px solid rgba(115, 184, 142, 0.2);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 28px 58px rgba(47, 73, 61, 0.18);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.submenu a {
  min-height: 48px;
  border: 1px solid rgba(115, 184, 142, 0.16);
  border-radius: 8px;
  background: rgba(245, 248, 246, 0.74);
  padding: 0 14px;
  color: #596476;
  font-size: 1rem;
  font-weight: 650;
}

.submenu a:hover,
.submenu a:focus {
  background: rgba(115, 184, 142, 0.14);
  color: var(--accent-dark);
}

.product-submenu {
  left: 0;
  right: auto;
  width: 230px;
  max-height: none;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(115, 184, 142, 0.18);
  border-radius: 8px;
  box-shadow: 0 18px 42px rgba(47, 73, 61, 0.16);
}

.product-submenu a {
  min-height: 42px;
  justify-content: flex-start;
}

.nav-dropdown:hover .submenu,
.nav-dropdown:focus-within .submenu,
.nav-dropdown.open .submenu,
.nav-dropdown.hovering .submenu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

button.secondary {
  background: #eee8dc;
  color: var(--ink);
}

.post-list,
.welcome-section,
.situation-section,
.path-grid,
.quick-win,
.topic-preview,
.home-note,
.section-heading,
.article,
.legal-page,
.contact-page,
.admin-shell,
.login,
.maintenance-page {
  width: min(100% - 32px, 1120px);
  margin: 0 auto;
}

.toolbar p,
.meta {
  margin: 0 0 8px;
  color: var(--accent-dark);
  font-size: 0.92rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
}

.article h1 {
  margin: 0;
  max-width: 800px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 5vw, 3.8rem);
  line-height: 1.06;
  letter-spacing: 0;
}

.welcome-section {
  display: grid;
  gap: 28px;
  padding: clamp(52px, 7vw, 86px) 0 30px;
}

.welcome-copy {
  max-width: 760px;
}

.section-kicker {
  margin: 0 0 10px;
  color: var(--accent-dark);
  font-size: 0.92rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0;
}

.welcome-copy h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4vw, 3.35rem);
  line-height: 1.08;
  letter-spacing: 0;
}

.welcome-copy p {
  max-width: 660px;
  margin: 22px 0 0;
  color: #465365;
  font-size: clamp(1.08rem, 2.2vw, 1.35rem);
}

.welcome-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.need-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 24px;
}

.need-cloud a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(115, 184, 142, 0.22);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.64);
  color: #536070;
  padding: 0 12px;
  font-weight: 850;
  text-decoration: none;
}

.need-cloud a:hover {
  background: rgba(115, 184, 142, 0.14);
  color: var(--accent-dark);
}

.primary-link,
.text-link {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  border-radius: 8px;
  font-weight: 800;
  text-decoration: none;
}

.primary-link {
  background: var(--accent);
  color: var(--white);
  padding: 0 18px;
  box-shadow: 0 14px 30px rgba(79, 139, 104, 0.18);
}

.text-link {
  color: var(--accent-dark);
  padding: 0 4px;
}

.welcome-note {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 12px;
  border: 1px solid rgba(115, 184, 142, 0.18);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 18%, rgba(240, 216, 143, 0.28), transparent 40%),
    rgba(255, 255, 255, 0.72);
  padding: 26px;
  box-shadow: 0 18px 42px rgba(68, 91, 82, 0.07);
}

.welcome-note img {
  width: min(58vw, 190px);
  height: auto;
}

.welcome-note p {
  max-width: 300px;
  margin: 0;
  color: var(--muted);
  text-align: center;
  font-weight: 700;
}

.situation-section {
  padding: 12px 0 44px;
}

.compact-heading {
  width: auto;
  padding: 0 0 22px;
}

.path-grid {
  display: grid;
  align-items: stretch;
  grid-auto-rows: 1fr;
  gap: 16px;
  width: 100%;
  padding: 0;
}

.path-grid a {
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  gap: 10px;
  height: 100%;
  min-height: 0;
  align-content: start;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  padding: 18px;
  border: 1px solid rgba(115, 184, 142, 0.14);
  overflow: hidden;
  text-decoration: none;
  box-shadow: 0 18px 42px rgba(68, 91, 82, 0.07);
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, border-color 180ms ease;
}

.path-grid a:hover {
  background: rgba(255, 255, 255, 0.96);
  border-color: rgba(79, 139, 104, 0.34);
  box-shadow: 0 30px 70px rgba(68, 91, 82, 0.16);
  transform: translateY(-5px);
}

.path-card-image {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  display: block;
  align-self: start;
  border-radius: 8px;
  object-fit: cover;
  box-shadow: 0 14px 34px rgba(68, 91, 82, 0.1);
  transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1), filter 180ms ease;
}

.path-grid a:hover .path-card-image {
  filter: saturate(1.06) contrast(1.03);
  transform: scale(1.035);
}

.path-grid span {
  color: var(--accent);
  font-weight: 900;
}

.path-grid h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem, 2.8vw, 2rem);
  line-height: 1.12;
  letter-spacing: 0;
}

.path-grid p {
  margin: 0;
  color: var(--muted);
  font-size: 1rem;
  align-self: start;
}

.quick-win {
  display: grid;
  gap: 22px;
  align-items: center;
  border-top: 1px solid rgba(115, 184, 142, 0.2);
  border-bottom: 1px solid rgba(115, 184, 142, 0.2);
  padding: clamp(28px, 4vw, 42px) 0;
  overflow: hidden;
}

.quick-win h2 {
  max-width: 780px;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.9rem, 4vw, 3rem);
  line-height: 1.04;
  letter-spacing: 0;
}

.quick-recipe {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.76);
  padding: clamp(20px, 3vw, 28px);
  box-shadow: 0 18px 42px rgba(68, 91, 82, 0.07);
  opacity: 0;
  transform: translateX(42px);
  animation: quickRecipeSlide 28s infinite;
}

.quick-recipe-carousel {
  display: grid;
  gap: 14px;
}

.quick-recipe-track {
  position: relative;
  min-height: 390px;
}

.quick-recipe-2 {
  animation-delay: 7s;
}

.quick-recipe-3 {
  animation-delay: 14s;
}

.quick-recipe-4 {
  animation-delay: 21s;
}

.quick-recipe p {
  margin: 0 0 12px;
  color: var(--accent-dark);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0;
}

.quick-recipe h3 {
  margin: 0 0 16px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem, 3vw, 2rem);
  line-height: 1.12;
  letter-spacing: 0;
}

.quick-recipe ul {
  display: grid;
  gap: 8px;
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
}

.quick-recipe .read-more-link {
  margin-top: auto;
}

.quick-recipe li {
  border-radius: 8px;
  background: rgba(245, 248, 246, 0.82);
  padding: 10px 12px;
  color: #465365;
  font-weight: 800;
}

.quick-recipe-dots {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  gap: 8px;
}

.quick-recipe-dot {
  width: 9px;
  height: 9px;
  display: block;
  border-radius: 999px;
  background: rgba(79, 139, 104, 0.25);
  animation: quickRecipeDot 28s infinite;
}

.quick-recipe-dot-2 {
  animation-delay: 7s;
}

.quick-recipe-dot-3 {
  animation-delay: 14s;
}

.quick-recipe-dot-4 {
  animation-delay: 21s;
}

@keyframes quickRecipeSlide {
  0% {
    opacity: 1;
    transform: translateX(0);
  }
  22% {
    opacity: 1;
    transform: translateX(0);
  }
  27%,
  100% {
    opacity: 0;
    transform: translateX(-42px);
  }
}

@keyframes quickRecipeDot {
  0%,
  22% {
    background: var(--accent-dark);
    transform: scale(1.36);
  }
  27%,
  100% {
    background: rgba(79, 139, 104, 0.25);
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .quick-recipe,
  .quick-recipe-dot {
    animation: none;
  }

  .quick-recipe {
    display: none;
  }

  .quick-recipe-1 {
    display: block;
    opacity: 1;
    transform: none;
  }

  .quick-recipe-dot-1 {
    background: var(--accent-dark);
    transform: scale(1.36);
  }
}

.topic-preview {
  display: grid;
  gap: 20px;
  align-items: start;
  border-bottom: 1px solid rgba(115, 184, 142, 0.2);
  padding: 34px 0;
}

.topic-preview h2,
.section-heading h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.8rem, 4vw, 3rem);
  line-height: 1;
  letter-spacing: 0;
}

.topic-preview h2 {
  max-width: 620px;
  font-size: clamp(1.8rem, 3.5vw, 2.7rem);
}

.topic-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.topic-links a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(115, 184, 142, 0.24);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.66);
  color: #596476;
  padding: 0 15px;
  font-weight: 800;
  text-decoration: none;
}

.topic-links a:hover {
  background: rgba(115, 184, 142, 0.15);
  color: var(--accent-dark);
}

.home-note {
  margin-top: 42px;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.78);
  padding: 20px 24px;
}

.home-note p {
  margin: 0;
  color: #596476;
  font-weight: 700;
}

.section-heading {
  padding: 58px 0 0;
}

.post-list {
  display: grid;
  gap: clamp(18px, 3vw, 38px);
  padding: 24px 0 82px;
}

.home-feature-list {
  display: grid;
  gap: clamp(18px, 3vw, 30px);
  padding: 24px 0 86px;
}

.home-feature-post {
  position: relative;
  display: grid;
  overflow: hidden;
  border: 1px solid rgba(115, 184, 142, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 20px 52px rgba(68, 91, 82, 0.08);
}

.home-feature-media {
  position: relative;
  aspect-ratio: 16 / 10;
  min-height: 260px;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 26% 26%, rgba(240, 216, 143, 0.5), transparent 34%),
    linear-gradient(135deg, rgba(115, 184, 142, 0.22), rgba(221, 180, 220, 0.18)),
    #f6faf7;
  color: var(--accent-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.5rem, 5vw, 2.4rem);
  font-weight: 900;
  text-decoration: none;
}

.home-feature-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}

.telegram-feature-post .home-feature-media {
  background: #f6faf7;
}

.telegram-feature-post .home-feature-media img {
  object-fit: cover;
  object-position: center top;
}

.home-feature-body {
  display: grid;
  align-content: center;
  gap: 14px;
  padding: clamp(24px, 4vw, 42px);
}

.home-feature-meta {
  margin: 0;
  color: var(--accent);
  font-size: 0.98rem;
  font-weight: 900;
}

.home-feature-body h3 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.75rem, 3.7vw, 3rem);
  line-height: 1.04;
  letter-spacing: 0;
  max-height: calc(1.04em * 3);
  overflow: hidden;
}

.home-feature-body h3 a {
  color: var(--ink);
  text-decoration: none;
}

.home-feature-body h3 a:hover {
  color: var(--accent-dark);
}

.home-feature-excerpt {
  display: -webkit-box;
  max-height: calc(1.65em * 4);
  margin: 0;
  color: var(--muted);
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  line-height: 1.65;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.read-more-link {
  width: fit-content;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  border-bottom: 2px solid rgba(115, 184, 142, 0.52);
  color: var(--accent-dark);
  font-weight: 900;
  text-decoration: none;
}

.read-more-link:hover {
  border-bottom-color: var(--accent-dark);
  color: var(--ink);
}

.post-card {
  position: relative;
  display: grid;
  align-content: start;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 18px 42px rgba(68, 91, 82, 0.07);
}

.admin-dock{position:sticky;top:0;z-index:80;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;border-bottom:1px solid rgba(115,184,142,.24);background:rgba(36,41,54,.94);padding:8px 16px;color:var(--white)}
.admin-dock a,.admin-dock summary,.edit-link,.card-edit-link{min-height:38px;display:inline-flex;align-items:center;border-radius:8px;background:var(--accent);color:var(--white);padding:0 12px;font-size:.9rem;font-weight:900;text-decoration:none}
.admin-dock a,.admin-dock summary{background:rgba(255,255,255,.12)}
.admin-dock .edit-link{background:var(--accent)}
.admin-dock a.is-active,.admin-dock summary.is-active,.admin-menu summary.is-active,.admin-menu a.is-active{background:var(--accent);color:var(--white);box-shadow:0 0 0 2px rgba(255,255,255,.2)}
.admin-toolbar{position:sticky;top:0;z-index:70;padding:12px 14px;border:1px solid rgba(86,112,87,.16);border-radius:12px;background:rgba(250,248,242,.96);box-shadow:0 12px 28px rgba(52,65,56,.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.admin-menu{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.admin-menu a{min-height:40px;display:inline-flex;align-items:center;border-radius:8px;background:rgba(115,184,142,.1);padding:0 13px;color:var(--ink);font-weight:850;text-decoration:none}
.admin-menu-group{position:relative}
.admin-menu-group summary{min-height:40px;display:inline-flex;align-items:center;gap:8px;border-radius:8px;background:rgba(115,184,142,.1);padding:0 13px;color:var(--ink);font-weight:850;cursor:pointer;list-style:none;user-select:none}
.admin-menu-group summary::-webkit-details-marker{display:none}
.admin-menu-group summary::after{content:"";width:7px;height:7px;margin-top:-4px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform 160ms ease,margin 160ms ease}
.admin-menu-group[open] summary::after{margin-top:4px;transform:rotate(225deg)}
.admin-menu-group summary:focus-visible{outline:3px solid rgba(115,184,142,.38);outline-offset:2px}
.admin-menu-submenu{position:absolute;top:calc(100% + 8px);left:0;z-index:90;min-width:230px;display:grid;gap:6px;padding:8px;border:1px solid rgba(86,112,87,.18);border-radius:10px;background:rgba(250,248,242,.98);box-shadow:0 16px 34px rgba(36,41,54,.16)}
.admin-menu-submenu a{width:100%;white-space:nowrap}
.admin-dock .admin-menu-submenu{border-color:rgba(255,255,255,.16);background:rgba(36,41,54,.98)}
.admin-dock .admin-menu-submenu a{color:var(--white)}

.homepage-work-preview {
  --homepage-work-frame: #d88743;
}

.homepage-work-preview::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9999;
  border: 6px solid var(--homepage-work-frame);
  pointer-events: none;
}

.homepage-work-preview-dock {
  border-bottom-color: rgba(255, 255, 255, 0.2);
  background: #5d3425;
}

.homepage-work-preview-label {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 10000;
  border-radius: 999px;
  background: var(--homepage-work-frame);
  box-shadow: 0 8px 24px rgba(70, 35, 20, 0.24);
  padding: 9px 14px;
  color: #fff;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.card-edit-link {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  min-height: 34px;
  box-shadow: 0 10px 24px rgba(36, 41, 54, 0.22);
}

.post-media {
  aspect-ratio: 16 / 9;
  min-height: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 0;
  background:
    radial-gradient(circle at 28% 24%, rgba(240, 216, 143, 0.48), transparent 34%),
    linear-gradient(135deg, rgba(115, 184, 142, 0.22), rgba(221, 180, 220, 0.2)),
    #f6faf7;
  color: var(--accent-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.45rem;
  font-weight: 900;
  text-decoration: none;
}

.post-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}

.instagram-card {
  background: rgba(255, 255, 255, 0.9);
}

.instagram-card .post-media {
  position: relative;
  aspect-ratio: 2 / 3;
  align-items: center;
  overflow: hidden;
  background: #eef6f2;
}

.instagram-card .post-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (hover: hover) and (pointer: fine) {
  .home-feature-media:hover img,
  .home-feature-post:focus-within .home-feature-media img,
  .post-media:hover img,
  .post-card:focus-within .post-media img {
    transform: scale(1.055);
  }
}

.instagram-card .post-card-body {
  display: grid;
  align-content: start;
}

.instagram-card h2 {
  padding: 18px 20px 0;
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  line-height: 1.15;
}

.instagram-card .meta {
  padding: 0 20px 22px;
  font-size: 0.92rem;
}

.post-card h2 {
  margin: 0 0 12px;
  padding: 26px 30px 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.75rem, 3vw, 2.45rem);
  line-height: 1.08;
  letter-spacing: 0;
}

.post-card .meta {
  padding: 0 30px;
  color: var(--accent);
  font-size: 1.02rem;
  font-weight: 800;
  text-transform: none;
}

.post-card p:last-child {
  margin: 0;
  padding: 12px 30px 34px;
  color: var(--muted);
  font-size: 1.08rem;
}

.instagram-card h2 {
  display: -webkit-box;
  min-height: calc(1.65rem * 1.15 * 3);
  margin: 0 0 8px;
  padding: 18px 20px 0;
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  line-height: 1.15;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.instagram-card .meta,
.instagram-card p:last-child {
  margin: 0;
  padding: 0 20px 22px;
  color: var(--accent);
  font-size: 0.92rem;
  font-weight: 800;
}

.no-cover-card {
  min-height: 0;
  align-content: start;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(245, 248, 246, 0.92)),
    #ffffff;
}

.no-cover-card .post-card-body {
  display: grid;
  gap: 10px;
  padding: 24px;
}

.no-cover-card h2,
.instagram-card.no-cover-card h2 {
  min-height: 0;
  margin: 0;
  padding: 0;
  font-size: clamp(1.35rem, 2.4vw, 1.9rem);
}

.no-cover-card .meta,
.instagram-card.no-cover-card .meta {
  padding: 0;
}

.no-cover-card p:last-child,
.instagram-card.no-cover-card p:last-child {
  margin: 0;
  padding: 0;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 500;
}

.article {
  max-width: 880px;
  padding: 36px 0 72px;
}

.category-heading {
  width: min(100% - 32px, 1120px);
  margin: 0 auto;
  padding: 48px 0 0;
}

.category-heading h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.2rem, 6vw, 4.2rem);
  line-height: 1;
  letter-spacing: 0;
}

.starterset-intro {
  width: min(100% - 32px, 1120px);
  margin: clamp(36px, 6vw, 72px) auto 0;
  display: grid;
  overflow: hidden;
  border-radius: 26px;
  background: #eef6f2;
  box-shadow: 0 24px 60px rgba(75, 101, 88, 0.12);
}

.starterset-intro-copy {
  padding: clamp(30px, 6vw, 64px);
}

.starterset-intro h2,
.starterset-post-heading h2,
.starterset-guide h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.85rem, 3.8vw, 3.2rem);
  line-height: 1.03;
  letter-spacing: 0;
}

.starterset-intro p {
  max-width: 680px;
  color: #465365;
  font-size: clamp(1.02rem, 1.7vw, 1.18rem);
}

.starterset-intro .starterset-lead {
  margin-top: 26px;
  font-size: clamp(1.12rem, 2vw, 1.32rem);
  font-weight: 700;
}

.starterset-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 26px 0;
}

.starterset-benefits a {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(74, 105, 89, 0.25);
  border-radius: 999px;
  padding: 8px 13px;
  color: #426553;
  font-size: 0.9rem;
  font-weight: 800;
  text-decoration: none;
  transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.starterset-benefits a:hover,
.starterset-benefits a:focus-visible {
  border-color: rgba(74, 105, 89, 0.5);
  background: rgba(115, 184, 142, 0.13);
  transform: translateY(-1px);
}

.starterset-button {
  display: inline-flex;
  margin-top: 4px;
}

.starterset-intro-image {
  min-height: 0;
  margin: 0;
  align-self: start;
}

.starterset-intro-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: contain;
  object-position: center;
  background: #e9c99f;
}

.starterset-post-heading {
  width: min(100% - 32px, 1120px);
  margin: clamp(66px, 9vw, 112px) auto 0;
}

.starterset-guide {
  width: 100%;
  background: #fbfaf7;
}

.starterset-guide-hero,
.starterset-story,
.starterset-methods,
.starterset-oils,
.starterset-safety,
.starterset-closing {
  padding: clamp(64px, 9vw, 118px) max(16px, calc((100% - 1120px) / 2));
}

.starterset-guide-hero {
  display: grid;
  gap: clamp(32px, 5vw, 68px);
  align-items: center;
  background: #eef6f2;
}

.starterset-guide-hero h1 {
  max-width: 760px;
  margin: 24px 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.35rem, 5.5vw, 4.5rem);
  line-height: 0.98;
  letter-spacing: -0.025em;
}

.starterset-guide-hero p,
.starterset-story p,
.starterset-methods header p,
.starterset-oils header > p:last-child,
.starterset-safety p,
.starterset-closing > p {
  max-width: 760px;
  color: #465365;
  font-size: clamp(1.06rem, 1.8vw, 1.22rem);
}

.starterset-guide-hero img {
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: 16 / 9;
  border-radius: 24px;
  object-fit: contain;
  object-position: center;
  background: #e9c99f;
  box-shadow: 0 24px 60px rgba(75, 101, 88, 0.16);
}

.starterset-jumpnav {
  position: sticky;
  top: 0;
  z-index: 6;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  border-block: 1px solid rgba(70, 83, 101, 0.12);
  background: rgba(251, 250, 247, 0.94);
  padding: 13px 16px;
  backdrop-filter: blur(12px);
}

.starterset-jumpnav a {
  border-radius: 999px;
  padding: 8px 12px;
  color: #465365;
  font-size: 0.9rem;
  font-weight: 800;
  text-decoration: none;
}

.starterset-jumpnav a:hover {
  background: #e4f0ea;
}

.starterset-story {
  display: grid;
  gap: clamp(36px, 6vw, 76px);
  align-items: center;
}

.starterset-story img,
.starterset-safety img {
  width: min(100%, 520px);
  justify-self: center;
  border-radius: 22px;
  box-shadow: 0 22px 50px rgba(75, 101, 88, 0.14);
}

.starterset-story h2,
.starterset-methods h2,
.starterset-oils h2,
.starterset-safety h2,
.starterset-closing h2 {
  margin-bottom: 24px;
}

.starterset-story blockquote {
  margin: 34px 0 0;
  border-left: 4px solid #d79d88;
  border-radius: 0 16px 16px 0;
  background: #fff;
  padding: 22px 24px;
  color: #465365;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.2rem, 2.4vw, 1.6rem);
  line-height: 1.45;
}

.starterset-methods {
  background: #b5d2c4;
}

.starterset-method-grid,
.starterset-oil-grid {
  display: grid;
  gap: 16px;
  margin-top: 40px;
}

.starterset-method-grid article,
.starterset-oil-card {
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
  padding: 26px;
}

.starterset-oil-card {
  display: block;
  width: 100%;
  border: 1px solid rgba(115, 136, 120, 0.18);
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.starterset-oil-card:hover,
.starterset-oil-card:focus-visible {
  transform: translateY(-4px);
  background: #fff;
  box-shadow: 0 16px 36px rgba(63, 78, 69, 0.14);
  outline: none;
}

.starterset-method-grid span,
.starterset-oil-card > span {
  color: #a16451;
  font-size: 0.8rem;
  font-weight: 900;
  letter-spacing: 0.12em;
}

.starterset-method-grid h3,
.starterset-oil-card h3 {
  margin: 12px 0 10px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.55rem;
}

.starterset-method-grid p,
.starterset-oil-card p {
  margin: 0;
  color: #526175;
}

.starterset-wide-figure {
  display: grid;
  justify-items: center;
  gap: 16px;
  margin: 54px 0 0;
}

.starterset-wide-figure img {
  width: min(100%, 520px);
  border-radius: 20px;
}

.starterset-wide-figure figcaption {
  max-width: 700px;
  color: #465365;
  font-size: 0.92rem;
  text-align: center;
}

.starterset-oils header {
  max-width: 850px;
}

.starterset-oil-grid .oil-mood {
  margin-top: 8px;
  color: #738878;
  font-size: 0.82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.starterset-oil-card strong {
  display: inline-block;
  margin-top: 22px;
  color: #a16451;
  font-size: 0.88rem;
}

.starterset-oil-dialog {
  width: min(1220px, calc(100% - 28px));
  max-height: calc(100dvh - 28px);
  border: 0;
  border-radius: 24px;
  padding: 0;
  background: #f8f4ec;
  color: #344258;
  box-shadow: 0 28px 90px rgba(28, 38, 33, 0.34);
}

.starterset-oil-dialog::backdrop {
  background: rgba(34, 45, 40, 0.72);
  backdrop-filter: blur(5px);
}

.starterset-dialog-shell {
  position: relative;
  display: grid;
  grid-template-columns: minmax(220px, 0.58fr) minmax(420px, 1.42fr);
  gap: clamp(24px, 4vw, 48px);
  align-items: start;
  padding: clamp(28px, 5vw, 58px);
  overflow: auto;
  max-height: calc(100dvh - 28px);
}

.starterset-dialog-close {
  position: absolute;
  z-index: 2;
  top: 14px;
  right: 16px;
  width: 44px;
  min-height: 44px;
  height: 44px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #344258;
  padding: 0;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
}

.starterset-dialog-close:hover {
  background: rgba(115, 136, 120, 0.1);
}

.starterset-dialog-close:focus-visible {
  outline: none;
  background: transparent;
  color: #a16451;
}

.starterset-dialog-copy h2 {
  margin: 8px 0 10px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4vw, 3.25rem);
}

.starterset-dialog-mood {
  margin: 0 0 20px;
  color: #738878;
  font-size: 0.85rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.starterset-dialog-text {
  color: #526175;
  line-height: 1.7;
}

.starterset-dialog-hint {
  margin-top: 22px;
  color: #7c695f;
  font-size: 0.82rem;
}

.starterset-dialog-image-link {
  display: block;
  justify-self: center;
}

.starterset-dialog-image {
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: none;
  border-radius: 16px;
  box-shadow: 0 16px 40px rgba(58, 50, 43, 0.16);
}

.starterset-dialog-nav {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 14px;
  align-items: center;
  padding-top: 12px;
}

.starterset-dialog-nav button {
  border: 0;
  background: transparent;
  color: #526175;
  font-weight: 800;
  cursor: pointer;
}

.starterset-dialog-next {
  justify-self: end;
}

.starterset-dialog-position {
  color: #7c695f;
  font-size: 0.82rem;
}

body:has(.starterset-oil-dialog[open]) {
  overflow: hidden;
}

@media (max-width: 700px) {
  .starterset-oil-dialog {
    width: 100%;
    max-width: none;
    max-height: 100dvh;
    margin: auto 0 0;
    border-radius: 22px 22px 0 0;
  }

  .starterset-dialog-shell {
    grid-template-columns: 1fr;
    gap: 22px;
    max-height: 94dvh;
    padding: 36px 12px 24px;
  }

  .starterset-dialog-copy {
    padding-left: 8px;
    padding-right: 30px;
  }

  .starterset-dialog-image {
    max-height: none;
  }

  .starterset-dialog-nav {
    grid-column: 1;
  }

  .starterset-dialog-nav button {
    font-size: 0.78rem;
  }
}

.starterset-safety {
  display: grid;
  gap: clamp(36px, 6vw, 76px);
  align-items: center;
  background: #eef6f2;
}

.starterset-safety ul {
  display: grid;
  gap: 13px;
  margin: 28px 0 0;
  padding-left: 22px;
  color: #465365;
}

.starterset-closing {
  text-align: center;
}

.starterset-closing > p {
  margin-inline: auto;
}

.starterset-closing > div {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 22px;
  margin-top: 32px;
}

.starterset-text-link {
  color: #465365;
  font-weight: 900;
}

@media (min-width: 820px) {
  .starterset-intro,
  .starterset-guide-hero,
  .starterset-story,
  .starterset-safety {
    grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.95fr);
  }

  .starterset-method-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .starterset-oil-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 1020px) {
  .starterset-intro,
  .starterset-guide-hero {
    grid-template-columns: 1fr;
  }

  .starterset-intro-image {
    min-height: 0;
  }

  .starterset-intro-image img,
  .starterset-guide-hero img {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
    object-fit: contain;
    object-position: center;
    background: #e9c99f;
  }
}

.search-heading {
  display: grid;
  gap: 18px;
}

.search-page-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  max-width: 720px;
}

.search-page-form input {
  min-height: 54px;
}

.search-page-form button {
  min-height: 54px;
}

.search-count {
  margin: 0;
  color: var(--muted);
  font-weight: 800;
}

.search-results-section {
  width: min(100% - 32px, 1120px);
  margin: clamp(34px, 5vw, 64px) auto 0;
}

.search-results-section:last-child {
  padding-bottom: clamp(52px, 7vw, 84px);
}

.search-section-heading {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: end;
  margin-bottom: 22px;
}

.search-section-heading h2,
.search-section-heading p { margin: 0; }

.search-section-heading h2 {
  margin-top: 5px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
}

.search-section-heading > span {
  color: var(--muted);
  font-weight: 800;
  white-space: nowrap;
}

.search-product-results {
  padding: clamp(24px, 4vw, 38px);
  border-radius: 24px;
  background: #eef5f0;
}

.search-product-results .product-card-grid,
.search-post-results .post-list {
  width: 100%;
  margin: 0;
}

@media (max-width: 620px) {
  .search-section-heading { display: grid; gap: 8px; align-items: start; }
}

.empty-state {
  margin: 0;
  color: var(--muted);
  font-size: 1.1rem;
}

.about-page {
  width: 100%;
  background: #b5d2c4;
  padding: clamp(34px, 5vw, 64px) 0 0;
}

.about-hero {
  width: min(100% - 32px, 1120px);
  margin: 0 auto;
  display: grid;
  gap: clamp(24px, 5vw, 56px);
  align-items: center;
  padding-bottom: clamp(48px, 7vw, 78px);
}

.about-hero h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.4rem, 6.2vw, 4.6rem);
  line-height: 0.96;
  letter-spacing: 0;
}

.about-lead {
  max-width: 720px;
  margin: 28px 0 0;
  color: #465365;
  font-size: clamp(1.12rem, 2.2vw, 1.36rem);
}

.about-card {
  display: grid;
  justify-items: center;
  gap: 18px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.18);
  padding: clamp(22px, 4vw, 34px);
  text-align: center;
}

.about-card img {
  width: min(64vw, 210px);
  height: auto;
}

.about-card ul {
  width: 100%;
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.about-card li {
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.28);
  color: #465365;
  padding: 10px 12px;
  font-weight: 800;
  text-align: center;
}

.about-section {
  width: 100%;
  margin-top: 0;
  padding: clamp(68px, 8vw, 118px) max(16px, calc((100% - 1120px) / 2));
  border-bottom: 0;
}

.about-story {
  margin-top: 0;
  background: #eef6f2;
}

.about-story > div {
  max-width: 860px;
}

.about-story h2,
.about-split h2,
.about-values h2,
.about-list-section h2,
.about-closing h2 {
  margin: 0 0 24px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.8rem, 3.2vw, 2.85rem);
  line-height: 1.05;
  letter-spacing: 0;
}

.about-story p,
.about-split p,
.about-list-section p,
.about-closing p {
  margin: 0 0 22px;
  color: #465365;
  font-size: clamp(1.06rem, 1.55vw, 1.2rem);
}

.about-story .about-highlight {
  margin-top: 28px;
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  padding: 20px 22px;
  color: #384657;
  font-weight: 800;
}

.about-split {
  display: grid;
  gap: clamp(34px, 5vw, 68px);
  background: #b5d2c4;
}

.about-split > div,
.about-list-section > div {
  max-width: 920px;
}

.about-values {
  display: grid;
  gap: clamp(28px, 5vw, 54px);
  background: #eef6f2;
}

.value-grid {
  display: grid;
  gap: 18px;
}

.value-grid article {
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.66);
  padding: 24px;
}

.value-grid h3 {
  margin: 0 0 12px;
  font-size: 1.15rem;
  letter-spacing: 0;
}

.value-grid p {
  margin: 0;
  color: var(--muted);
}

.about-list-section {
  display: grid;
  gap: clamp(28px, 4vw, 46px);
  align-items: start;
  background: #b5d2c4;
}

.about-list {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.about-list li {
  border-left: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.64);
  color: #465365;
  padding: 16px 18px;
  font-weight: 750;
}

.about-closing {
  max-width: none;
  margin-inline: 0;
  border-bottom: 0;
  border-radius: 0;
  background: #eef6f2;
  padding: clamp(68px, 8vw, 112px) max(16px, calc((100% - 900px) / 2));
}

.about-final-note {
  margin-top: clamp(34px, 5vw, 52px);
  padding-top: clamp(28px, 4vw, 42px);
  border-top: 1px solid rgba(115, 184, 142, 0.18);
}

.signature-text {
  margin: 30px 0 0;
  color: #4f4f4f;
  font-family: var(--script-font);
  font-size: clamp(2.8rem, 9vw, 5.6rem);
  line-height: 1;
}

.maintenance-page {
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: 48px 0;
}

.maintenance-card {
  width: min(100%, 780px);
  display: grid;
  justify-items: center;
  gap: 18px;
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 0%, rgba(240, 216, 143, 0.32), transparent 42%),
    rgba(255, 255, 255, 0.82);
  padding: clamp(32px, 7vw, 72px);
  text-align: center;
  box-shadow: 0 24px 62px rgba(68, 91, 82, 0.1);
}

.maintenance-card img {
  width: min(56vw, 220px);
  height: auto;
}

.maintenance-card h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.15rem, 5.5vw, 4rem);
  line-height: 1;
  letter-spacing: 0;
}

.maintenance-card p:last-child {
  max-width: 560px;
  margin: 0;
  color: var(--muted);
  font-size: clamp(1.05rem, 2vw, 1.25rem);
}

.back-link {
  display: inline-block;
  margin-bottom: 32px;
  color: var(--accent-dark);
  font-weight: 800;
}

.article-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 32px;
}

.article-actions .back-link {
  margin-bottom: 0;
}

.cover {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: min(76vh, 720px);
  margin: 28px auto;
  height: auto;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.instagram-article {
  max-width: 960px;
}

.instagram-article h1 {
  max-width: 760px;
  font-size: clamp(1.8rem, 3.6vw, 3rem);
  line-height: 1.1;
}

.instagram-cover {
  width: auto;
  max-width: min(100%, 620px);
  max-height: none;
  margin: 28px auto 38px;
}

.instagram-article .content {
  margin-inline: auto;
}

.content {
  max-width: 720px;
  color: #343b49;
  font-size: 1.12rem;
}

.article-products,
.article-related {
  max-width: 900px;
  margin: clamp(42px, 7vw, 72px) auto 0;
  border-top: 1px solid rgba(91, 108, 99, 0.16);
  padding-top: clamp(28px, 4vw, 38px);
}

.article-products h2,
.article-related h2 {
  max-width: 680px;
  margin: 0 0 18px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  line-height: 1.12;
  letter-spacing: 0;
}

.article-product-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.article-product-links a {
  min-height: 58px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(91, 108, 99, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.78);
  padding: 9px 14px;
  color: var(--ink);
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 12px 30px rgba(68, 91, 82, 0.06);
}

.article-product-links img {
  width: 30px;
  height: 42px;
  object-fit: contain;
  filter: drop-shadow(0 8px 12px rgba(62, 49, 70, 0.16));
}

.article-related-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.article-related-card {
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 12px;
  border: 1px solid rgba(91, 108, 99, 0.14);
  border-radius: 8px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.82);
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 14px 34px rgba(68, 91, 82, 0.07);
}

.article-related-card img,
.article-related-placeholder {
  width: 100%;
  aspect-ratio: 4 / 3;
  display: grid;
  place-items: center;
  background: #eef6f2;
  object-fit: cover;
  color: var(--accent-dark);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 900;
}

.article-related-card strong {
  padding: 0 16px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.18rem;
  line-height: 1.16;
}

.article-related-card small {
  padding: 0 16px 16px;
  color: var(--accent);
  font-weight: 800;
}

.content h2,
.content h3 {
  margin-top: 36px;
  line-height: 1.12;
  letter-spacing: 0;
}

.legal-page {
  padding: clamp(44px, 7vw, 76px) 0;
}

.legal-content {
  max-width: 780px;
}

.legal-content h1 {
  margin: 0 0 32px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.15rem, 5.5vw, 4rem);
  line-height: 0.98;
  letter-spacing: 0;
}

.legal-content section {
  padding: 24px 0;
  border-top: 1px solid rgba(115, 184, 142, 0.22);
}

.legal-content h2 {
  margin: 0 0 10px;
  font-size: 1.25rem;
  line-height: 1.2;
  letter-spacing: 0;
}

.legal-content p {
  margin: 0 0 12px;
  color: #465365;
}

.legal-note {
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.82);
  padding: 16px 18px;
  font-weight: 700;
}

.contact-page {
  padding: clamp(42px, 6vw, 76px) 0 84px;
}

.contact-hero {
  display: grid;
  gap: clamp(24px, 5vw, 54px);
  align-items: center;
  padding-bottom: clamp(38px, 6vw, 70px);
}

.contact-hero h1,
.oil-afternoon h2,
.contact-form-copy h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  letter-spacing: 0;
}

.contact-hero h1 {
  max-width: 780px;
  font-size: clamp(2.3rem, 5.5vw, 4.3rem);
  line-height: 0.98;
}

.contact-hero p {
  max-width: 680px;
  margin: 24px 0 0;
  color: #465365;
  font-size: clamp(1.08rem, 2vw, 1.3rem);
}

.contact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.contact-note {
  display: grid;
  justify-items: center;
  gap: 14px;
  border: 1px solid rgba(115, 184, 142, 0.18);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 18%, rgba(240, 216, 143, 0.28), transparent 40%),
    rgba(255, 255, 255, 0.74);
  padding: clamp(24px, 4vw, 36px);
  text-align: center;
  box-shadow: 0 18px 42px rgba(68, 91, 82, 0.07);
}

.contact-note img {
  width: min(58vw, 190px);
  height: auto;
}

.contact-note p {
  max-width: 320px;
  margin: 0;
  color: var(--muted);
  font-weight: 800;
}

.contact-options {
  display: grid;
  gap: 16px;
  padding: 0 0 clamp(34px, 6vw, 66px);
}

.contact-options article {
  display: grid;
  gap: 10px;
  border: 1px solid rgba(115, 184, 142, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  padding: clamp(20px, 3vw, 28px);
  box-shadow: 0 18px 42px rgba(68, 91, 82, 0.07);
}

.contact-options span {
  color: var(--accent);
  font-weight: 900;
}

.contact-options h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.5rem, 3vw, 2.15rem);
  line-height: 1.1;
  letter-spacing: 0;
}

.contact-options p {
  margin: 0;
  color: var(--muted);
}

.oil-afternoon {
  display: grid;
  gap: 22px;
  border-top: 1px solid rgba(115, 184, 142, 0.2);
  border-bottom: 1px solid rgba(115, 184, 142, 0.2);
  padding: clamp(34px, 5vw, 54px) 0;
}

.oil-afternoon h2 {
  max-width: 760px;
  font-size: clamp(1.8rem, 3.8vw, 3rem);
  line-height: 1.04;
}

.oil-afternoon > p {
  max-width: 760px;
  margin: 0;
  color: #465365;
  font-size: clamp(1.05rem, 1.6vw, 1.18rem);
}

.contact-form-section {
  display: grid;
  gap: clamp(24px, 5vw, 54px);
  align-items: start;
  padding-top: clamp(42px, 6vw, 74px);
}

.contact-form-copy h2 {
  max-width: 620px;
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  line-height: 1.05;
}

.contact-form-copy p:last-child {
  max-width: 560px;
  margin: 18px 0 0;
  color: var(--muted);
  font-size: 1.06rem;
}

.contact-form {
  display: grid;
  gap: 14px;
  border: 1px solid rgba(115, 184, 142, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.84);
  padding: clamp(18px, 3vw, 28px);
  box-shadow: 0 18px 42px rgba(68, 91, 82, 0.08);
}

.contact-form button {
  width: fit-content;
}

.contact-success,
.contact-error {
  margin: 0;
  border-radius: 8px;
  padding: 14px 16px;
  font-weight: 850;
}

.contact-success {
  background: rgba(115, 184, 142, 0.16);
  color: var(--accent-dark);
}

.contact-error {
  background: rgba(213, 87, 87, 0.12);
  color: #9d3e3e;
}

.contact-privacy {
  margin: 0;
  color: rgba(89, 100, 118, 0.86);
  font-size: 0.88rem;
}

.contact-honeypot {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.cf-turnstile { min-height: 65px; }
.trash-toolbar { display: flex; justify-content: flex-end; margin: 0 0 14px; }

.contact-inbox-shell {
  display: grid;
  gap: 16px;
  min-height: min(760px, calc(100svh - 168px));
}

.contact-inbox-list,
.contact-message-reader {
  min-width: 0;
  border: 1px solid rgba(115, 184, 142, 0.2);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 18px 42px rgba(68, 91, 82, 0.07);
}

.contact-inbox-list {
  overflow: hidden;
}

.contact-inbox-summary {
  display: grid;
  gap: 6px;
  border-bottom: 1px solid rgba(115, 184, 142, 0.18);
  padding: 16px;
}

.contact-inbox-summary h2,
.contact-inbox-summary p {
  margin: 0;
}

.contact-inbox-summary h2 {
  color: var(--ink);
  font-size: 1.2rem;
}

.contact-inbox-summary span {
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 850;
}

.contact-message-list {
  display: grid;
  max-height: 620px;
  overflow: auto;
}

.contact-message-item {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  border-bottom: 1px solid rgba(115, 184, 142, 0.14);
  background: rgba(255, 255, 255, 0.58);
  color: var(--ink);
  padding: 14px 16px;
  text-decoration: none;
}

.contact-message-item:hover,
.contact-message-item.is-selected {
  background: rgba(115, 184, 142, 0.12);
}

.contact-message-item.is-unread {
  background: rgba(255, 255, 255, 0.92);
}

.contact-message-state {
  width: 9px;
  height: 9px;
  margin-top: 7px;
  border-radius: 999px;
  background: rgba(89, 100, 118, 0.22);
}

.contact-message-item.is-unread .contact-message-state {
  background: var(--accent-dark);
  box-shadow: 0 0 0 4px rgba(115, 184, 142, 0.16);
}

.contact-message-main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.contact-message-main strong,
.contact-message-main small,
.contact-message-main span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contact-message-main strong {
  font-size: 0.98rem;
}

.contact-message-item.is-unread .contact-message-main strong {
  font-weight: 950;
}

.contact-message-main small {
  color: var(--accent-dark);
  font-size: 0.78rem;
  font-weight: 900;
}

.contact-message-main span,
.contact-message-item time {
  color: var(--muted);
  font-size: 0.84rem;
}

.contact-message-item time {
  margin-top: 2px;
  white-space: nowrap;
}

.contact-message-reader {
  min-height: 420px;
  padding: clamp(18px, 3vw, 28px);
}

.contact-reader-card,
.contact-message-empty {
  display: grid;
  gap: 18px;
}

.contact-reader-header {
  display: grid;
  gap: 16px;
  align-items: start;
  border-bottom: 1px solid rgba(115, 184, 142, 0.18);
  padding-bottom: 18px;
}

.contact-reader-header h2,
.contact-reader-header p,
.contact-message-empty h2,
.contact-message-empty p {
  margin: 0;
}

.contact-reader-header h2,
.contact-message-empty h2 {
  color: var(--ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  line-height: 1.05;
  letter-spacing: 0;
}

.contact-reader-header p,
.contact-message-empty p {
  color: var(--muted);
  font-weight: 750;
}

.contact-reader-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.contact-reader-actions form {
  margin: 0;
}

.contact-reader-actions button {
  min-height: 42px;
}

.danger-button {
  border: 1px solid rgba(213, 87, 87, 0.22);
  background: rgba(213, 87, 87, 0.12);
  color: #9d3e3e;
}

.contact-reader-meta {
  display: grid;
  gap: 10px;
  margin: 0;
}

.contact-reader-meta div {
  border-radius: 8px;
  background: rgba(245, 248, 246, 0.86);
  padding: 12px 14px;
}

.contact-reader-meta dt {
  color: var(--accent-dark);
  font-size: 0.76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.contact-reader-meta dd {
  margin: 3px 0 0;
  color: var(--ink);
  font-weight: 850;
  overflow-wrap: anywhere;
}

.contact-reader-message {
  min-height: 180px;
  border-radius: 8px;
  background: rgba(245, 248, 246, 0.72);
  padding: clamp(16px, 3vw, 24px);
}

.contact-reader-message p {
  margin: 0;
  color: #465365;
  font-size: 1.06rem;
  white-space: pre-wrap;
}

.contact-reader-message .muted {
  color: rgba(89, 100, 118, 0.72);
}

.site-footer {
  margin-top: 36px;
  border-top: 1px solid rgba(115, 184, 142, 0.2);
  background: rgba(255, 255, 255, 0.72);
}

.footer-inner {
  width: min(100% - 32px, 1120px);
  min-height: 96px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 auto;
  padding: 24px 0 14px;
}

.footer-logo {
  width: clamp(150px, 18vw, 210px);
  height: auto;
  display: block;
  opacity: 0.82;
}

.footer-inner nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
}

.footer-inner a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  color: var(--accent-dark);
  font-weight: 800;
  text-decoration: none;
}
.footer-link-button { min-height: 44px; padding: 0; border: 0; background: none; color: var(--accent-dark); font: inherit; font-weight: 800; cursor: pointer; }
.analytics-consent { position: fixed; z-index: 1000; left: max(16px, env(safe-area-inset-left)); right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); width: min(calc(100% - 32px), 760px); margin: 0 auto; padding: 1.1rem; display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: end; border: 1px solid rgba(35, 61, 48, .18); border-radius: 20px; background: #fffdf8; box-shadow: 0 16px 48px rgba(35, 61, 48, .2); }
.analytics-consent[hidden] { display: none; }
.analytics-consent h2 { margin: 0 0 .4rem; font-size: 1.15rem; }
.analytics-consent p { margin: 0; color: #5f665f; line-height: 1.55; }
.analytics-consent-actions { display: flex; gap: .65rem; flex-wrap: wrap; justify-content: end; }
@media (max-width: 720px) { .analytics-consent { grid-template-columns: 1fr; } .analytics-consent-actions { justify-content: stretch; } .analytics-consent-actions button { flex: 1; } }

.footer-disclaimer {
  width: min(100% - 32px, 1120px);
  margin: 0 auto;
  border-top: 1px solid rgba(115, 184, 142, 0.16);
  color: rgba(89, 100, 118, 0.78);
  padding: 0 0 24px;
  font-size: 0.82rem;
  line-height: 1.45;
  text-align: center;
}

.admin-shell {
  padding: 18px 0 32px;
}

.toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}

.toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.admin-home-link {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  border-radius: 8px;
  background: rgba(115, 184, 142, 0.14);
  color: var(--accent-dark);
  padding: 0 16px;
  font-weight: 900;
  text-decoration: none;
}

.toolbar h1 {
  margin: 0;
  font-size: 2rem;
  letter-spacing: 0;
}

.version-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  margin-top: 8px;
  border: 1px solid rgba(115, 184, 142, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--accent-dark);
  padding: 0 10px;
  font-size: 0.82rem;
  font-weight: 900;
}

.admin-grid {
  display: grid;
  gap: 18px;
}

.admin-status-grid {
  display: grid;
  gap: 18px;
  margin-bottom: 20px;
}

.settings-panel,
.listener-panel,
.backup-panel,
.server-status-panel,
.analytics-panel,
.analytics-page-panel {
  display: grid;
  gap: 16px;
  align-content: start;
  align-items: center;
  border: 1px solid rgba(115, 184, 142, 0.22);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  padding: 18px;
}

.settings-panel h2,
.settings-panel p,
.listener-panel h2,
.listener-panel p,
.backup-panel h2,
.backup-panel p,
.server-status-panel h2,
.server-status-panel h3,
.server-status-panel p,
.analytics-panel h2,
.analytics-panel p,
.analytics-page-panel h2,
.analytics-page-panel p {
  margin: 0;
}

.settings-panel h2,
.listener-panel h2,
.backup-panel h2,
.server-status-panel h2,
.analytics-panel h2,
.analytics-page-panel h2 {
  font-size: 1.25rem;
  letter-spacing: 0;
}

.settings-panel p,
.listener-panel p,
.backup-panel p,
.server-status-panel p,
.analytics-panel p,
.analytics-page-panel p {
  color: var(--muted);
}

.backup-panel-heading {
  display: flex;
  gap: 14px;
  align-items: start;
  justify-content: space-between;
}

.backup-panel-heading button,
.server-status-heading button {
  flex: 0 0 auto;
}

.backup-summary,
.server-status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.backup-summary article,
.server-status-grid article,
.service-list article,
.disk-list article,
.process-list article {
  min-width: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.66);
  padding: 12px;
}

.backup-summary span,
.server-status-grid span,
.service-list span,
.disk-list span,
.process-list span {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.backup-summary strong,
.server-status-grid strong,
.service-list strong,
.disk-list strong,
.process-list strong {
  display: block;
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 1rem;
}

.backup-selector {
  display: grid;
  gap: 12px;
  border-radius: 8px;
  background: rgba(115, 184, 142, 0.1);
  padding: 14px;
}

.backup-selector[hidden] {
  display: none;
}

.backup-selector label {
  display: grid;
  gap: 6px;
  color: var(--accent-dark);
  font-size: 0.86rem;
  font-weight: 900;
}

.backup-selector select {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(115, 184, 142, 0.28);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink);
  padding: 0 12px;
  font: inherit;
}

.backup-selected-detail {
  min-width: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.7);
  padding: 12px;
}

.backup-selected-detail span,
.backup-selected-detail strong,
.backup-selected-detail small {
  display: block;
}

.backup-selected-detail span {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.86rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.backup-selected-detail strong {
  color: var(--ink);
}

.backup-selected-detail small {
  color: var(--accent-dark);
  font-size: 0.82rem;
  font-weight: 800;
}

.backup-list {
  display: grid;
  gap: 10px;
}

.backup-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.64);
  padding: 12px;
}

.backup-item strong,
.backup-item span,
.backup-item small {
  display: block;
}

.backup-item strong {
  color: var(--ink);
}

.backup-item span {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.88rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.backup-item small {
  color: var(--accent-dark);
  font-weight: 800;
}

.server-status-panel {
  margin-top: 18px;
}

.server-status-heading {
  display: flex;
  gap: 14px;
  align-items: start;
  justify-content: space-between;
}

.server-status-panel h3 {
  color: var(--accent-dark);
  font-size: 0.95rem;
  text-transform: uppercase;
}

.server-status-columns {
  display: grid;
  gap: 16px;
}

.service-list,
.disk-list,
.process-list {
  display: grid;
  gap: 10px;
}

.service-list article {
  border-left: 4px solid rgba(115, 184, 142, 0.7);
}

.service-list article.is-stopped {
  border-left-color: rgba(151, 77, 62, 0.55);
}

.service-list small,
.disk-list small,
.process-list small {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
}

.disk-list meter {
  width: 100%;
  height: 10px;
  margin-top: 8px;
}

.process-list article span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.process-list strong span {
  display: inline;
  color: var(--muted);
  font-size: 0.82rem;
}

.analytics-page-panel {
  max-width: 980px;
  margin: 0 auto;
}

.analytics-page-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.analytics-page-heading h2 {
  font-size: 1.55rem;
}

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

.analytics-metrics-large {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.analytics-metrics div {
  min-width: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  padding: 12px;
}

.analytics-metrics span {
  display: block;
  color: var(--ink);
  font-size: 1.45rem;
  font-weight: 900;
  line-height: 1.1;
}

.analytics-metrics-large span {
  font-size: 1.9rem;
}

.analytics-metrics small {
  display: block;
  margin-top: 4px;
  color: var(--accent-dark);
  font-size: 0.76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.analytics-list {
  display: grid;
  gap: 8px;
}

.analytics-list-large {
  margin-top: 4px;
}

.analytics-list strong {
  color: var(--ink);
  font-size: 0.95rem;
}

.analytics-list ol {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.analytics-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  padding: 9px 10px;
  color: var(--ink);
  font-weight: 800;
}

.analytics-list li span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analytics-list li small {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.analytics-live-panel { margin-top: 1.25rem; }
.analytics-live-tools { display: flex; align-items: end; gap: 1rem; justify-content: space-between; flex-wrap: wrap; }
.analytics-live-tools div { display: grid; gap: .2rem; }
.analytics-live-tools label { display: grid; gap: .3rem; font-size: .82rem; }
.analytics-live-table-wrap { overflow-x: auto; margin-top: 1rem; }
.analytics-live-table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.analytics-live-table th, .analytics-live-table td { padding: .75rem .6rem; border-bottom: 1px solid rgba(35, 61, 48, .13); text-align: left; vertical-align: top; }
.analytics-live-table tbody tr:not(.analytics-live-details) { cursor: pointer; }
.analytics-live-table td[data-status="active"] { color: #26734d; font-weight: 700; }
.analytics-live-table td[data-status="recent"] { color: #9a6a17; font-weight: 700; }
.analytics-live-details td { white-space: normal; color: #5f665f; line-height: 1.6; background: rgba(242, 237, 225, .45); }
.analytics-acquisition { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid rgba(35, 61, 48, .13); }
.analytics-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.analytics-chart-grid article { padding: 1rem; border-radius: 18px; background: rgba(242, 237, 225, .45); }
.analytics-chart-grid h3 { margin-top: 0; }
.analytics-bars { display: grid; gap: .65rem; }
.analytics-bars div { display: grid; grid-template-columns: minmax(90px, 1fr) 3fr auto; gap: .6rem; align-items: center; }
.analytics-bars i { display: block; min-width: 3px; height: .75rem; border-radius: 999px; background: #6d8b75; }
.analytics-bars small { font-variant-numeric: tabular-nums; }
.analytics-spark-bars { height: 150px; display: flex; gap: 3px; align-items: end; }
.analytics-spark-bars i { flex: 1; min-width: 2px; border-radius: 3px 3px 0 0; background: #9a7259; }
.analytics-compact-list { margin: 0; padding-left: 1.25rem; }
.analytics-instagram code { overflow-wrap: anywhere; }
@media (max-width: 720px) { .analytics-chart-grid { grid-template-columns: 1fr; } .analytics-bars div { grid-template-columns: 90px 1fr auto; } }
.footer-online { margin: 0; font-size: .78rem; opacity: .78; }

.listener-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
  justify-content: space-between;
}

.listener-heading h2 {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.listener-toggle {
  width: fit-content;
  min-height: 40px;
  flex: 0 0 auto;
  border: 1px solid rgba(115, 184, 142, 0.28);
  background: rgba(255, 255, 255, 0.76);
  color: var(--accent-dark);
  padding: 0 14px;
}

.listener-toggle.is-active {
  background: var(--accent);
  color: var(--white);
}

.listener-dot {
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #9aa3ad;
  box-shadow: 0 0 0 4px rgba(154, 163, 173, 0.16);
}

.listener-panel.is-running .listener-dot {
  background: #43a047;
  box-shadow: 0 0 0 4px rgba(67, 160, 71, 0.16);
}

.listener-panel.is-stopped .listener-dot {
  background: #d55757;
  box-shadow: 0 0 0 4px rgba(213, 87, 87, 0.16);
}

.listener-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.listener-details div {
  min-width: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  padding: 10px 12px;
}

.listener-details dt {
  color: var(--accent-dark);
  font-size: 0.76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.listener-details dd {
  margin: 3px 0 0;
  color: var(--ink);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.settings-label {
  color: var(--accent-dark);
  font-size: 0.8rem;
  font-weight: 900;
  text-transform: uppercase;
}

.switch {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  border-radius: 8px;
  background: var(--ink);
  color: var(--white);
  padding: 0 8px 0 16px;
}

.switch input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
}

.switch span {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 900;
}

.switch span::after {
  content: "OFF";
  min-width: 82px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  background: #596476;
  color: var(--white);
}

.switch input:checked + span::after {
  content: "ON";
  background: #6dbb28;
}

.post-picker {
  display: grid;
  gap: 14px;
  min-width: 0;
}

#postList {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.post-tools {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(115, 184, 142, 0.2);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.86);
  padding: 14px;
}

.post-tools h2,
.post-tools p {
  margin: 0;
}

.post-tools h2 {
  color: var(--ink);
  font-size: 1.08rem;
  letter-spacing: 0;
}

.post-tools p {
  color: var(--muted);
  font-size: 0.9rem;
}

.post-filter-grid {
  display: grid;
  gap: 10px;
}

.curation-tools {
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.curation-tools h3,
.curation-tools p {
  margin: 0;
}

.curation-tools h3 {
  color: var(--ink);
  font-size: 0.98rem;
  letter-spacing: 0;
}

.curation-actions {
  display: grid;
  gap: 8px;
}

.curation-actions button,
.curation-actions select {
  width: 100%;
  min-height: 40px;
  padding: 0 12px;
  font-size: 0.86rem;
}

.curation-list {
  max-height: 340px;
  overflow: auto;
}

.curation-table {
  width: 100%;
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.7);
}

.curation-table th,
.curation-table td {
  border-bottom: 1px solid var(--line);
  padding: 9px 10px;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.3;
  text-align: left;
  vertical-align: top;
}

.curation-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--soft);
  color: var(--ink);
  font-weight: 900;
}

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

.curation-table strong,
.curation-table small {
  display: block;
}

.curation-table strong {
  color: var(--ink);
  font-size: 0.84rem;
}

.curation-table a {
  color: var(--accent-dark);
  font-weight: 900;
}

.curation-check {
  width: 18px;
  height: 18px;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.seo-badge {
  display: inline-flex !important;
  align-items: center;
  width: fit-content;
  min-height: 24px;
  margin-top: 8px;
  border-radius: 6px;
  background: rgba(115, 184, 142, 0.16);
  color: var(--accent-dark);
  padding: 0 8px;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.seo-noindex {
  background: rgba(240, 216, 143, 0.36);
  color: #7d6730;
}

.seo-archive {
  background: rgba(213, 87, 87, 0.12);
  color: #9d3e3e;
}

#postList button {
  width: 100%;
  height: auto;
  min-height: 94px;
  background: var(--white);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  text-align: left;
  align-items: start;
  justify-content: start;
}

#postList button.active {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 2px var(--accent);
}

#postList strong,
#postList span {
  display: block;
}

#postList strong {
  display: -webkit-box;
  overflow: hidden;
  margin: 6px 0;
  font-size: 0.96rem;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.post-list-meta,
.post-list-tags {
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.3;
}

.post-list-tags {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.empty-admin-list {
  margin: 0;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--muted);
  padding: 18px;
  text-align: center;
}

.editor,
.login form {
  display: grid;
  gap: 14px;
}

label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 800;
}

input,
textarea,
select {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--white);
  color: var(--ink);
  padding: 12px;
}

textarea {
  resize: vertical;
}

.cover-preview {
  width: 100%;
  max-height: 260px;
  object-fit: cover;
  border-radius: 8px;
}

.actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.message {
  min-height: 24px;
  margin: 0;
  color: var(--accent-dark);
  font-weight: 800;
}

.login {
  min-height: 100svh;
  display: grid;
  place-items: center;
}

.login form {
  width: min(100%, 420px);
}

.login-hint {
  margin: 0;
  color: var(--muted);
}

@media (max-width: 759px) {
  .toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .toolbar-actions {
    justify-content: flex-start;
  }

  .analytics-metrics-large {
    grid-template-columns: 1fr;
  }

  .brand-hero {
    min-height: clamp(126px, 32vw, 172px);
    background-position: center top;
  }

  .brand {
    width: clamp(104px, 27vw, 124px);
    margin-left: 14px;
  }

  .main-nav {
    grid-template-columns: 1fr;
    min-height: 104px;
    gap: 8px;
    overflow: visible;
    padding: 8px 14px 10px;
  }

  .nav-items {
    grid-column: 1;
    flex-wrap: wrap;
    justify-content: center;
    gap: clamp(12px, 4vw, 18px);
    min-width: 0;
    margin: 0 auto;
  }

  .nav-utilities {
    grid-column: 1;
    justify-self: stretch;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    width: 100%;
  }

  .site-search {
    width: 94px;
    min-height: 40px;
  }

  .site-search input,
  .search-trigger,
  .site-search button {
    min-height: 38px;
  }

  .search-trigger,
  .site-search button {
    gap: 6px;
    font-size: .95rem;
  }

  .site-search input {
    font-size: 1.18rem;
  }

  .nav-utilities.search-open {
    justify-content: stretch;
  }

  .nav-utilities.search-open .site-search,
  .site-search:focus-within {
    width: 100%;
  }

  .social-links {
    justify-content: flex-end;
  }

  .social-links a {
    width: 32px;
    min-height: 32px;
    border-radius: 7px;
  }

  .social-links svg {
    width: 22px;
    height: 22px;
  }

  .social-links .yl-icon {
    width: 26px;
    height: 26px;
  }

  .main-nav a {
    flex: 0 0 auto;
    min-height: 40px;
    font-size: 0.96rem;
  }

  .nav-parent {
    min-height: 40px;
    font-size: 0.96rem;
  }

  .submenu {
    left: 0;
    right: 0;
    width: 100%;
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 16px;
    transform: translateY(8px);
  }

  .product-submenu {
    right: auto;
    width: 230px;
  }

  .nav-dropdown:hover .submenu,
  .nav-dropdown:focus-within .submenu,
  .nav-dropdown.open .submenu,
  .nav-dropdown.hovering .submenu {
    transform: translateY(0);
  }

  .welcome-actions {
    display: grid;
  }

  .contact-actions {
    display: grid;
  }

  .primary-link,
  .text-link {
    justify-content: center;
  }

  .need-cloud a {
    min-height: 36px;
    font-size: 0.95rem;
  }

  .path-grid a {
    min-height: 206px;
  }

  .home-feature-list {
    padding-bottom: 68px;
  }

  .home-feature-media {
    min-height: 210px;
    aspect-ratio: 4 / 3;
  }

  .home-feature-body {
    padding: 22px;
    gap: 12px;
  }

  .home-feature-body h3 {
    font-size: clamp(1.55rem, 9vw, 2.15rem);
    line-height: 1.08;
    max-height: calc(1.08em * 3);
  }

  .home-feature-excerpt {
    max-height: calc(1.65em * 3);
    -webkit-line-clamp: 3;
  }

  .search-page-form {
    grid-template-columns: 1fr;
  }

  .article-related-grid {
    grid-template-columns: 1fr;
  }

  .article-product-links {
    display: grid;
  }

  .article-product-links a {
    justify-content: flex-start;
  }

  .backup-panel-heading,
  .server-status-heading,
  .backup-item {
    display: grid;
    grid-template-columns: 1fr;
  }

  .backup-panel-heading button,
  .server-status-heading button,
  .backup-item button {
    width: 100%;
  }

  .product-card a {
    min-height: 260px;
    grid-template-columns: minmax(0, 1fr) 104px;
    column-gap: 14px;
    padding: 22px;
  }

  .product-card img {
    width: 96px;
    max-height: 176px;
  }

  .product-card h2 {
    font-size: clamp(1.85rem, 10vw, 2.55rem);
  }

.about-list li {
  font-size: 0.98rem;
}
}

.products-page,
.product-page {
  width: 100%;
  padding-bottom: 78px;
}

.products-hero,
.product-hero,
.product-section,
.product-source {
  width: min(100% - 32px, 1120px);
  margin: 0 auto;
}

.products-hero {
  display: grid;
  gap: clamp(24px, 5vw, 56px);
  align-items: center;
  padding: clamp(42px, 6vw, 76px) 0 34px;
}

.products-hero h1,
.product-hero h1,
.product-section h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  letter-spacing: 0;
}

.products-hero h1 {
  max-width: 820px;
  font-size: clamp(2.2rem, 5vw, 4.2rem);
  line-height: 0.98;
}

.products-hero p,
.product-lead {
  max-width: 720px;
  color: #465365;
  font-size: clamp(1.08rem, 2vw, 1.28rem);
}

.products-hero-note {
  display: grid;
  justify-items: center;
  gap: 16px;
  border: 1px solid rgba(115, 184, 142, 0.18);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.52);
  padding: clamp(22px, 4vw, 34px);
  text-align: center;
}

.products-hero-note img {
  width: min(62vw, 190px);
  height: auto;
}

.products-hero-note p {
  margin: 0;
  font-weight: 700;
}

.product-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

.product-tabs a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(91, 108, 99, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.68);
  padding: 0 16px;
  color: var(--accent-dark);
  font-weight: 900;
  text-decoration: none;
}

.product-tabs a[aria-current="page"] {
  background: var(--accent-dark);
  color: var(--white);
}

.product-card-grid {
  width: min(100% - 32px, 1180px);
  margin: 0 auto;
  display: grid;
  gap: 22px;
}

.product-card a {
  min-height: 300px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(128px, 0.45fr);
  grid-template-rows: auto auto 1fr auto;
  align-content: stretch;
  column-gap: clamp(18px, 4vw, 36px);
  row-gap: 12px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(91, 108, 99, 0.14);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.82)),
    radial-gradient(circle at 78% 18%, rgba(221, 180, 220, 0.5), transparent 32%),
    #f7f3f8;
  padding: clamp(24px, 4vw, 34px);
  text-decoration: none;
  box-shadow: var(--shadow);
}

.product-card a::before {
  content: "";
  position: absolute;
  width: 210px;
  height: 210px;
  right: -42px;
  top: -28px;
  border-radius: 50%;
  background: rgba(221, 180, 220, 0.28);
}

.product-card img {
  position: relative;
  z-index: 1;
  grid-column: 2;
  grid-row: 1 / -1;
  align-self: center;
  justify-self: center;
  width: min(100%, 150px);
  max-height: 236px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 18px 28px rgba(73, 56, 78, 0.22));
}

.product-card a::after {
  content: none;
}

.product-card h2 {
  position: relative;
  z-index: 1;
  grid-column: 1;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4vw, 3.25rem);
  line-height: 1.02;
}

.product-card p,
.product-card small,
.product-card-type {
  position: relative;
  z-index: 1;
  grid-column: 1;
}

.product-card p {
  max-width: 460px;
  margin: 0;
  color: var(--muted);
  font-weight: 700;
  font-size: 1.04rem;
  line-height: 1.38;
}

.product-card small,
.product-card-type {
  color: var(--accent-dark);
  font-weight: 800;
}

.product-card-type {
  text-transform: uppercase;
  font-size: 0.82rem;
}

.product-hero {
  display: grid;
  gap: clamp(26px, 5vw, 58px);
  align-items: center;
  padding: clamp(38px, 6vw, 76px) 0 clamp(36px, 5vw, 60px);
}

.product-hero h1 {
  font-size: clamp(2.6rem, 7vw, 5.4rem);
  line-height: 0.9;
}

.product-latin {
  margin: 14px 0 0;
  color: var(--accent-dark);
  font-size: 1rem;
  font-weight: 800;
}

.product-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.product-bottle-card {
  display: grid;
  gap: 22px;
  border: 1px solid rgba(91, 108, 99, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.58);
  padding: clamp(24px, 4vw, 34px);
  box-shadow: var(--shadow);
}

.product-image-frame {
  min-height: 420px;
  display: grid;
  place-items: center;
}

.product-image-frame img {
  width: min(54vw, 205px);
  height: auto;
  filter: drop-shadow(0 24px 34px rgba(62, 49, 70, 0.26));
}

.product-bottle-card dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.product-bottle-card dl div {
  display: grid;
  grid-template-columns: minmax(92px, auto) 1fr;
  gap: 12px;
  border-top: 1px solid rgba(91, 108, 99, 0.14);
  padding-top: 10px;
}

.product-bottle-card dt {
  color: var(--muted);
  font-weight: 800;
}

.product-bottle-card dd {
  margin: 0;
  font-weight: 700;
}

.product-section {
  display: grid;
  gap: 22px;
  padding: clamp(34px, 6vw, 64px) 0;
  border-top: 1px solid rgba(91, 108, 99, 0.13);
}

.product-section h2 {
  max-width: 520px;
  font-size: clamp(1.8rem, 3.4vw, 3rem);
  line-height: 1;
}

.benefit-grid,
.routine-grid {
  display: grid;
  gap: 14px;
}

.benefit-grid article,
.routine-grid article {
  border: 1px solid rgba(91, 108, 99, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.58);
  padding: 22px;
}

.benefit-grid h3,
.routine-grid h3 {
  margin: 0;
  font-size: 1.14rem;
  line-height: 1.25;
}

.routine-grid span {
  display: block;
  margin-bottom: 22px;
  color: var(--accent-dark);
  font-weight: 900;
}

.routine-grid p {
  margin: 12px 0 0;
  color: var(--muted);
}

.product-check-list,
.product-chip-list,
.product-safety ul {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-check-list li,
.product-chip-list li,
.product-safety li {
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.58);
  padding: 14px 16px;
  color: #465365;
  font-weight: 700;
}

.product-check-list li::before {
  content: "✓ ";
  color: var(--accent-dark);
}

.product-chip-list {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.product-safety {
  border-radius: 0;
  background: rgba(255, 250, 240, 0.62);
  padding-left: clamp(18px, 4vw, 32px);
  padding-right: clamp(18px, 4vw, 32px);
}

.product-kids-note {
  display: grid;
  gap: 18px;
  border-radius: 8px;
  background: rgba(247, 230, 239, 0.58);
  padding-left: clamp(18px, 4vw, 32px);
  padding-right: clamp(18px, 4vw, 32px);
}

.product-kids-note p {
  max-width: 760px;
  margin: 0;
  color: #465365;
  font-size: 1.05rem;
  font-weight: 700;
}

.product-source {
  border-top: 1px solid rgba(91, 108, 99, 0.13);
  padding-top: 24px;
}

.product-source p {
  max-width: 780px;
  margin: 0;
  color: var(--muted);
  font-size: 0.95rem;
  font-weight: 650;
}

@media (min-width: 760px) {
  .products-hero,
  .product-hero {
    grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
  }

  .product-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-two-column,
  .product-fit-section,
  .product-safety {
    grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.18fr);
    align-items: start;
  }

  .benefit-grid,
  .routine-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1060px) {
  .routine-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 760px) {
  .contact-hero,
  .contact-form-section {
    grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
  }

  .contact-options {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .oil-afternoon {
    grid-template-columns: minmax(280px, 0.86fr) minmax(0, 1.14fr);
    align-items: start;
  }

  .oil-afternoon > p {
    padding-top: calc(0.92rem * 1.55 + 10px);
  }

  .welcome-section {
    grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr);
    align-items: center;
  }

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

  .quick-win {
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    align-items: stretch;
  }

  .quick-recipe-carousel,
  .quick-recipe-track {
    min-height: 100%;
  }

  .quick-recipe-track {
    min-height: 410px;
  }

  .topic-preview {
    grid-template-columns: minmax(340px, 0.95fr) minmax(0, 1.05fr);
  }

  .post-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-feature-post {
    grid-template-columns: minmax(300px, 0.95fr) minmax(0, 1.05fr);
    min-height: 318px;
  }

  .about-hero {
    grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr);
  }

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

  .admin-grid {
    grid-template-columns: minmax(340px, 420px) minmax(0, 1fr);
    align-items: start;
  }

  .admin-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .backup-summary,
  .server-status-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .server-status-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .contact-inbox-shell {
    grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
  }

  .contact-inbox-list,
  .contact-message-reader {
    max-height: calc(100svh - 160px);
  }

  .contact-message-list {
    max-height: calc(100svh - 258px);
  }

  .contact-reader-header {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .contact-reader-actions {
    justify-content: flex-end;
  }

  .contact-reader-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .post-picker {
    position: sticky;
    top: 18px;
    max-height: calc(100svh - 36px);
    overflow: auto;
  }

  .post-filter-grid {
    grid-template-columns: 1fr 1fr;
  }

  #postList {
    display: grid;
  }

  .actions {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 1180px) {
  .admin-status-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1060px) {
  .path-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1080px) {
  .post-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

}

/* Starter-Set: abschließende Komponentenregeln */
.starterset-guide .starterset-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 30px;
}

.starterset-guide .starterset-actions .button,
.starterset-guidance .button {
  width: auto;
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #4f715f;
  border-radius: 999px;
  background: #4f715f;
  color: #fff;
  padding: 12px 24px;
  font-size: .95rem;
  font-weight: 850;
  line-height: 1.2;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(67, 96, 80, .18);
  transition: transform .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.starterset-guide .starterset-actions .button:hover,
.starterset-guide .starterset-actions .button:focus-visible,
.starterset-guidance .button:hover,
.starterset-guidance .button:focus-visible {
  background: #3f6250;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(67, 96, 80, .23);
}

.starterset-guide .starterset-actions .button.secondary {
  border-color: rgba(79, 113, 95, .45);
  background: rgba(255, 255, 255, .62);
  color: #3f6250;
  box-shadow: none;
}

.starterset-guide .starterset-actions .button.secondary:hover,
.starterset-guide .starterset-actions .button.secondary:focus-visible {
  border-color: #4f715f;
  background: #fff;
  color: #3f6250;
}

.starterset-variant-grid article {
  grid-template-rows: 230px 1fr;
}

.starterset-variant-media {
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(145deg, #f4eee5, #eef6f2);
  padding: 22px;
}

.starterset-variant-grid .starterset-variant-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 16px 20px rgba(57, 70, 62, .18));
}

.starterset-variant-copy {
  min-height: 330px;
}

.starterset-variant-link {
  gap: 8px;
  width: fit-content;
  border-bottom: 1px solid rgba(63, 98, 80, .38);
  text-decoration: none;
}

.starterset-variant-link:hover,
.starterset-variant-link:focus-visible {
  border-color: #3f6250;
}

@media (max-width: 819px) {
  .starterset-guide .starterset-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .starterset-guide .starterset-actions .button,
  .starterset-guidance .button {
    width: 100%;
  }

  .product-submenu {
    left: auto;
    right: 0;
    width: min(230px, calc(100vw - 24px));
  }
}

.starterset-overview-figure {
  width: min(100%, 560px);
  justify-self: center;
  display: grid;
  gap: 14px;
  margin: 0;
}

.starterset-overview-link {
  display: block;
  border-radius: 22px;
}

.starterset-safety .starterset-overview-link > img {
  width: 100%;
  height: auto;
  max-height: none;
  display: block;
  border-radius: 22px;
  object-fit: contain;
  box-shadow: 0 22px 50px rgba(75, 101, 88, .14);
}

.starterset-overview-figure figcaption {
  color: #596476;
  font-size: .86rem;
  line-height: 1.55;
}

.admin-image-editable {
  position: relative !important;
}

.path-grid > .admin-image-card-wrap {
  min-width: 0;
  height: 100%;
}

.path-grid > .admin-image-card-wrap > a {
  height: 100%;
}

.admin-image-edit-button {
  position: absolute;
  z-index: 12;
  top: 12px;
  right: 12px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(63, 98, 80, .28);
  border-radius: 999px;
  background: rgba(255, 255, 255, .94);
  color: #3f6250;
  padding: 8px 14px;
  font-size: .82rem;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 8px 24px rgba(42, 59, 50, .16);
  backdrop-filter: blur(8px);
}

.admin-image-edit-button:hover,
.admin-image-edit-button:focus-visible {
  border-color: #4f715f;
  background: #4f715f;
  color: #fff;
}

.admin-image-edit-button[disabled] {
  cursor: wait;
  opacity: .68;
}

.admin-image-status {
  position: fixed;
  z-index: 200;
  right: 18px;
  bottom: 18px;
  max-width: min(360px, calc(100vw - 36px));
  border-radius: 14px;
  background: #263b31;
  color: #fff;
  padding: 14px 18px;
  font-size: .9rem;
  font-weight: 750;
  box-shadow: 0 16px 36px rgba(30, 45, 37, .28);
}
/* Essential oils guide */
.essential-oils-page{--eo-cream:#f6f1e8;--eo-sage:#6b806f;--eo-ink:#2f352f;color:var(--eo-ink);overflow:hidden}.eo-breadcrumb,.eo-hero,.eo-section{width:min(100% - 32px,1120px);margin-inline:auto}.eo-breadcrumb{display:flex;gap:9px;padding-top:24px;color:var(--muted);font-size:.9rem}.eo-breadcrumb a{color:inherit}.eo-hero{display:grid;gap:34px;align-items:center;padding:clamp(42px,7vw,92px) 0}.eo-hero h1,.eo-section h2,.eo-section h3{font-family:Georgia,"Times New Roman",serif;letter-spacing:0}.eo-hero h1{max-width:760px;margin:10px 0 22px;font-size:clamp(2.5rem,6.2vw,5rem);line-height:.98}.eo-hero p{max-width:720px;font-size:clamp(1.04rem,2vw,1.22rem);line-height:1.72}.eo-hero picture,.eo-split>img,.eo-pillar-grid img{overflow:hidden;border-radius:clamp(10px,2vw,22px);box-shadow:var(--shadow)}.eo-hero img,.eo-split>img,.eo-pillar-grid img{display:block;width:100%;height:100%;object-fit:cover}.eo-hero img{aspect-ratio:16/10}.eo-section{padding:clamp(58px,8vw,104px) 0}.eo-section>h2,.eo-section>div>h2{max-width:880px;margin:8px 0 24px;font-size:clamp(2rem,4.5vw,3.55rem);line-height:1.05}.eo-section>p,.eo-section>div>p{max-width:820px;font-size:1.05rem;line-height:1.75}.eo-section blockquote,.eo-hero blockquote{max-width:790px;margin:28px 0;border-left:3px solid var(--accent);padding:8px 0 8px 22px;color:var(--accent-dark);font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.18rem,2.5vw,1.55rem);line-height:1.5}.eo-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:30px}.eo-actions>a:not(.button){color:var(--accent-dark);font-weight:800}.eo-split{display:grid;gap:34px;align-items:center}.eo-split>img{max-height:620px;aspect-ratio:4/5}.eo-mini-grid,.eo-plant-grid,.eo-check-grid,.eo-pillar-grid,.eo-next>div{display:grid;gap:14px;margin-top:28px}.eo-mini-grid span,.eo-plant-grid article,.eo-check-grid article{border:1px solid rgba(107,128,111,.22);border-radius:9px;background:rgba(255,255,255,.7);padding:20px}.eo-plant-grid article{display:grid;gap:7px}.eo-plant-grid b{font-family:Georgia,"Times New Roman",serif;font-size:1.35rem}.eo-plant-grid span,.eo-check-grid p{color:var(--muted)}.eo-section details{max-width:860px;margin-top:18px;border:1px solid rgba(107,128,111,.25);border-radius:8px;background:#fff;padding:0 20px}.eo-section summary{cursor:pointer;padding:20px 36px 20px 0;font-weight:850}.eo-section details p{padding:0 0 20px;line-height:1.65}.eo-tinted{position:relative}.eo-tinted:before{content:"";position:absolute;z-index:-1;inset:0 calc(50% - 50vw);background:var(--eo-cream)}.eo-timeline{display:grid;gap:0;margin:38px 0;padding:0;list-style:none}.eo-timeline li{display:grid;grid-template-columns:48px 1fr;gap:16px;position:relative;padding-bottom:28px}.eo-timeline li:not(:last-child):before{content:"";position:absolute;left:23px;top:48px;bottom:0;border-left:1px solid var(--eo-sage)}.eo-timeline li>span{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--eo-sage);color:#fff;font-weight:900}.eo-timeline h3,.eo-beginner h3{margin:2px 0 8px;font-size:1.35rem}.eo-timeline p,.eo-beginner p{margin:0;color:var(--muted);line-height:1.62}.eo-highlight{border-left:3px solid var(--accent);padding-left:20px;font-family:Georgia,"Times New Roman",serif;font-size:1.35rem!important}.eo-compare{display:grid;gap:18px;margin-top:34px}.eo-compare article{border-radius:10px;background:var(--eo-cream);padding:clamp(22px,4vw,36px)}.eo-compare h3{font-size:1.5rem}.eo-compare li{margin:10px 0}.eo-check-grid article>span{color:var(--eo-sage);font-weight:900}.eo-check-grid h3{margin:12px 0 8px;font-size:1.25rem}.eo-young-living{position:relative}.eo-young-living:before{content:"";position:absolute;z-index:-1;inset:0 calc(50% - 50vw);background:#e8eee7}.eo-section aside{max-width:820px;margin-top:28px;border-radius:8px;background:#fff;padding:22px;line-height:1.65;box-shadow:0 8px 25px rgba(47,53,47,.06)}.eo-pillar-grid article{overflow:hidden;border:1px solid rgba(107,128,111,.18);border-radius:10px;background:#fff}.eo-pillar-grid img{height:230px;border-radius:0;box-shadow:none}.eo-pillar-grid h3,.eo-pillar-grid p{margin-inline:20px}.eo-pillar-grid h3{margin-top:20px;font-size:1.55rem}.eo-pillar-grid p{margin-bottom:24px;color:var(--muted);line-height:1.65}.eo-source{font-size:.9rem!important}.eo-safety{position:relative}.eo-safety:before{content:"";position:absolute;z-index:-1;inset:0 calc(50% - 50vw);background:#f1e9dd}.eo-beginner{display:grid;gap:18px;padding:0;counter-reset:eo-step;list-style:none}.eo-beginner li{position:relative;border-top:1px solid rgba(107,128,111,.3);padding:20px 0 20px 56px;counter-increment:eo-step}.eo-beginner li:before{content:counter(eo-step);position:absolute;left:0;top:20px;color:var(--eo-sage);font:700 2rem Georgia,serif}.eo-next>div>a{display:block;border:1px solid rgba(107,128,111,.2);border-radius:9px;background:#fff;padding:26px;color:inherit;text-decoration:none;box-shadow:var(--shadow)}.eo-next h3{margin:0;font-size:1.5rem}.eo-next p{color:var(--muted);line-height:1.6}.eo-next span{color:var(--accent-dark);font-weight:900}.eo-cta{text-align:center}.eo-cta>p,.eo-cta>blockquote{margin-inline:auto}.eo-faq details{margin-top:12px}.eo-faq details[open]{border-color:var(--eo-sage)}
@media(min-width:720px){.eo-mini-grid,.eo-plant-grid,.eo-compare,.eo-beginner{grid-template-columns:repeat(2,minmax(0,1fr))}.eo-check-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.eo-pillar-grid,.eo-next>div{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:900px){.eo-hero{grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)}.eo-split{grid-template-columns:minmax(0,1.08fr) minmax(320px,.72fr)}.eo-check-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.eo-timeline{grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}.eo-timeline li{display:block;padding:0}.eo-timeline li:not(:last-child):before{left:48px;right:-12px;top:23px;bottom:auto;border:0;border-top:1px solid var(--eo-sage)}.eo-timeline li>span{position:relative;z-index:1;margin-bottom:18px}.eo-timeline h3{font-size:1.08rem}.eo-timeline p{font-size:.9rem}}
@media(max-width:719px){.eo-actions,.eo-actions .button{width:100%}.eo-actions .button{text-align:center}.eo-hero picture{order:-1}.eo-hero img{aspect-ratio:4/3}.eo-pillar-grid img{height:210px}}
@media(prefers-reduced-motion:reduce){.essential-oils-page *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.eo-cta>h2{margin-inline:auto}
.product-posts {
  width: min(1120px, calc(100% - 32px));
  margin: 72px auto 40px;
  padding-top: 48px;
  border-top: 1px solid rgba(74, 73, 58, 0.16);
}

.product-posts-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}

.product-posts-heading h2 {
  margin: 6px 0 0;
}

.product-posts-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.product-post-card {
  display: flex;
  min-width: 0;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(74, 73, 58, 0.12);
  border-radius: 22px;
  box-shadow: 0 14px 38px rgba(54, 57, 43, 0.08);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.product-post-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 44px rgba(54, 57, 43, 0.13);
}

.product-post-card > img,
.product-post-placeholder {
  width: 38%;
  min-height: 190px;
  flex: 0 0 38%;
  object-fit: cover;
}

.product-post-placeholder {
  display: grid;
  place-items: center;
  color: rgba(74, 73, 58, 0.64);
  background: rgba(210, 210, 183, 0.38);
  font-family: var(--font-accent);
}

.product-post-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  padding: 20px;
}

.product-post-copy small {
  color: var(--muted);
}

.product-post-copy strong {
  font-size: 1.08rem;
  line-height: 1.25;
}

.product-post-copy > span {
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.5;
}

@media (max-width: 900px) {
  .product-posts-grid {
    grid-template-columns: 1fr;
  }

  .product-post-card > img,
  .product-post-placeholder {
    width: 32%;
    flex-basis: 32%;
    min-height: 160px;
  }
}

@media (max-width: 560px) {
  .product-posts {
    margin-top: 52px;
    padding-top: 36px;
  }

  .product-posts-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .product-post-card {
    display: block;
  }

  .product-post-card > img,
  .product-post-placeholder {
    width: 100%;
    min-height: 190px;
  }
}
.message.is-error{color:#9d3535}
.creator-studio{display:grid;gap:1.4rem}.creator-hero,.creator-results-head{display:flex;justify-content:space-between;gap:2rem;align-items:end}.creator-hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,4vw,3.5rem);margin:.25rem 0}.creator-hero p{max-width:48rem}.creator-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.65fr);gap:1.25rem}.creator-prompt{display:grid;gap:1rem}.creator-prompt label{display:grid;gap:.4rem}.creator-platforms{display:flex;flex-wrap:wrap;gap:.6rem}.creator-platforms label{display:flex;grid-template-columns:auto 1fr!important;align-items:center;border:1px solid rgba(91,108,99,.18);border-radius:999px;padding:.55rem .8rem}.creator-drafts{align-content:start}.creator-draft-item{display:grid;gap:.25rem;width:100%;text-align:left;background:transparent;color:inherit;border:0;border-bottom:1px solid rgba(91,108,99,.15);border-radius:0;padding:.8rem 0}.creator-results{display:grid;gap:1.1rem}.creator-tabs{display:flex;gap:.5rem;flex-wrap:wrap}.creator-tabs button{background:#eee7df;color:#4b514c}.creator-tabs button.is-active{background:var(--accent-dark,#465b50);color:white}.creator-variant{display:grid;gap:.45rem}.creator-variant textarea{min-height:320px}.creator-image-brief,.creator-review{display:grid;gap:.6rem}.creator-review:has(li:only-child[data-empty]){opacity:.7}@media(max-width:850px){.creator-layout{grid-template-columns:1fr}.creator-hero,.creator-results-head{display:grid;align-items:start}}
.content-studio{display:grid;gap:1.4rem}.content-studio-hero{display:flex;align-items:end;justify-content:space-between;gap:2rem;padding:1.6rem 0 .4rem}.content-studio-hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,4vw,3.6rem);line-height:1.05;margin:.3rem 0 .7rem;max-width:52rem}.content-studio-hero p{max-width:54rem}.content-studio-badge,.content-package-status{display:inline-flex;align-items:center;width:max-content;border-radius:999px;background:#f2e3d8;color:#9c3c61;font-weight:800;letter-spacing:.04em;padding:.48rem .75rem}.content-studio-layout{display:grid;grid-template-columns:minmax(250px,.33fr) minmax(0,1fr);gap:1.25rem;align-items:start}.content-package-sidebar{position:sticky;top:1rem;display:grid;gap:.7rem}.content-package-sidebar-head,.content-section-heading,.content-package-head,.content-package-footer{display:flex;align-items:start;justify-content:space-between;gap:1rem}.content-package-sidebar-head>span{display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:#b83262;color:#fff;font-weight:800}.content-package-item{display:grid;gap:.42rem;width:100%;text-align:left;background:transparent;color:inherit;border:1px solid transparent;border-top:1px solid rgba(91,108,99,.14);border-radius:18px;padding:1rem}.content-package-item:hover,.content-package-item.is-active{background:#fff8f1;border-color:rgba(184,50,98,.24);transform:none}.content-package-item strong{font-size:1rem}.content-package-item small{color:#69736d}.content-package-status{font-size:.7rem;padding:.3rem .55rem}.content-package-detail{display:grid;gap:1.2rem;min-width:0}.content-package-head{align-items:center}.content-package-head h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.7rem,3vw,2.5rem);margin:.2rem 0 .6rem}.content-package-head p{max-width:56rem}.content-package-head-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.6rem}.content-package-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.55fr);gap:1.2rem}.content-copy-panel{display:grid;gap:.9rem;align-content:start}.content-platform-tabs{display:flex;gap:.45rem;flex-wrap:wrap}.content-platform-tabs button{background:#eee7df;color:#4b514c;padding:.6rem .8rem}.content-platform-tabs button.is-active{background:#465b50;color:#fff}.content-copy-panel textarea{min-height:560px;resize:vertical;line-height:1.6;background:#fffdf9}.content-copy-panel>button{justify-self:start}.content-reel-preview{display:grid;gap:.8rem;align-content:start}.content-reel-preview img{display:block;width:100%;max-height:680px;object-fit:contain;border-radius:20px;background:#eee7df}.content-section-heading h3{font-family:Georgia,"Times New Roman",serif;font-size:1.65rem;margin:.1rem 0}.content-section-heading>span{color:#69736d}.content-carousel-section{display:grid;gap:1rem}.content-carousel-grid{display:grid;grid-template-columns:repeat(5,minmax(145px,1fr));gap:.8rem;overflow-x:auto;padding-bottom:.4rem}.content-carousel-grid a{display:grid;gap:.45rem;color:inherit;text-decoration:none}.content-carousel-grid img{display:block;width:100%;border-radius:16px;box-shadow:0 10px 25px rgba(52,45,49,.12)}.content-carousel-grid span{font-size:.8rem;font-weight:800;color:#9c3c61}.content-package-footer{align-items:end;color:#5d6862}.content-package-empty{text-align:center;padding:4rem 2rem}@media(max-width:1050px){.content-studio-layout,.content-package-grid{grid-template-columns:1fr}.content-package-sidebar{position:static}.content-package-sidebar #contentPackageList{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.5rem}.content-carousel-grid{grid-template-columns:repeat(5,210px)}}@media(max-width:700px){.content-studio-hero,.content-package-head,.content-package-footer{display:grid;align-items:start}.content-package-head-actions{justify-content:flex-start}.content-copy-panel textarea{min-height:430px}.content-carousel-grid{grid-template-columns:repeat(5,175px)}}
.creator-handoff{display:grid;gap:1rem}.creator-handoff-actions{display:flex;gap:.65rem;flex-wrap:wrap}.creator-handoff textarea{min-height:440px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.9rem;line-height:1.5}
.content-package-grid{grid-template-columns:minmax(0,1.1fr) minmax(280px,.72fr)}.content-visual-previews{display:grid;gap:.9rem;align-content:start}.content-visual-preview-grid{display:grid;grid-template-columns:repeat(3,minmax(90px,1fr));gap:.7rem}.content-visual-preview-grid a{display:grid;gap:.5rem;color:inherit;text-decoration:none}.content-visual-preview-grid img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:top;border-radius:15px;background:#eee7df;box-shadow:0 8px 20px rgba(52,45,49,.1)}.content-visual-preview-grid a:nth-child(n+2) img{aspect-ratio:9/16}.content-visual-preview-grid span{display:grid;gap:.1rem}.content-visual-preview-grid small{color:#69736d}.content-carousel-grid{grid-template-columns:repeat(6,minmax(145px,1fr))}.content-approval-section{display:grid;gap:1.15rem}.content-section-heading .is-ready{color:#427057;font-weight:800}.content-section-heading .is-open{color:#9d3535;font-weight:800}.content-dry-run{display:grid;gap:.65rem;margin:0;padding:0;list-style:none}.content-dry-run li{display:grid;grid-template-columns:minmax(180px,.35fr) minmax(220px,1fr);gap:1rem;border-top:1px solid rgba(91,108,99,.16);padding-top:.75rem}.content-dry-run .is-ok strong{color:#427057}.content-dry-run .is-error strong{color:#9d3535}.content-dry-run .is-info strong{color:#8a672e}.content-approval-choice{display:flex;justify-content:space-between;align-items:end;gap:1rem;border-radius:18px;background:#fff8f1;padding:1rem}.content-approval-choice h3{margin:.15rem 0}.content-approval-actions{display:flex;gap:.6rem}@media(max-width:1050px){.content-package-grid{grid-template-columns:1fr}.content-carousel-grid{grid-template-columns:repeat(6,210px)}}@media(max-width:700px){.content-visual-preview-grid{grid-template-columns:repeat(3,minmax(82px,1fr))}.content-carousel-grid{grid-template-columns:repeat(6,175px)}.content-dry-run li{grid-template-columns:1fr}.content-approval-choice{display:grid;align-items:start}}
.publishing-platform-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.55rem;align-items:start}.publishing-platform-option{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start;gap:.65rem;margin:0;border:1px solid rgba(91,108,99,.18);border-radius:12px;background:#fffdfa;padding:.7rem .8rem;color:var(--accent-dark)}.publishing-platform-option.is-disabled{background:#f3f3f3;color:#6f746f}.publishing-platform-checkbox{width:18px;min-width:18px;height:18px;min-height:18px;margin:.15rem 0 0;padding:0;border-radius:4px;accent-color:var(--accent);align-self:start}.publishing-platform-copy{display:grid;gap:.12rem;min-width:0}.publishing-platform-copy strong{display:block;font-size:.95rem;line-height:1.2}.publishing-platform-copy small{display:block;color:#5f6368;line-height:1.25;word-break:break-word}@media(max-width:700px){.publishing-platform-grid{grid-template-columns:1fr}}

.content-intake-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}
.content-intake-panel{display:grid;gap:.9rem;align-content:start}
.content-intake-item,.content-intake-item-head{display:grid}
.content-intake-item{gap:.42rem;border:1px solid rgba(91,108,99,.14);border-radius:18px;background:#fffdf9;padding:1rem}
.content-intake-item-head{grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:start}
.content-intake-item.is-ready{border-color:rgba(66,112,87,.22);background:#f6fbf7}
.content-intake-item.is-waiting{border-color:rgba(138,103,46,.16);background:#fffaf1}
.content-intake-item.is-rejected{border-color:rgba(157,53,53,.18);background:#fff7f7}
.content-intake-item strong{font-size:1rem}
.content-intake-item small{color:#69736d}
.content-intake-item p{margin:0;color:#5d6862}
.content-intake-issues{display:grid;gap:.45rem;margin:0;padding:0;list-style:none}
.content-intake-issues li{display:grid;gap:.15rem;padding-top:.45rem;border-top:1px solid rgba(91,108,99,.12)}
.content-intake-issues strong{font-size:.84rem;color:#9a3d4a}
.content-intake-issues span{color:#5d6862}
@media(max-width:1050px){.content-intake-grid{grid-template-columns:1fr}}
@media(max-width:700px){.content-intake-item-head{grid-template-columns:1fr}}
.content-studio-hero-actions{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;justify-content:flex-end}.content-job-shell{display:grid;gap:.55rem}.content-job-create-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.38fr);gap:.75rem;align-items:start}.content-job-form,.content-job-detail-section{display:grid;gap:.6rem}.content-job-hero h1,.content-job-detail-head h2,.content-job-overview h2{font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.28rem,2.2vw,1.8rem);line-height:1.04;margin:0 0 .18rem}.content-job-hero p{max-width:40rem;font-size:.95rem}.content-job-form>label{display:grid;gap:.22rem;font-size:.92rem}.content-job-form textarea{line-height:1.32;min-height:auto;padding:.52rem .62rem;font-size:.93rem}.content-job-grid,.content-job-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.content-job-choice-group{display:grid;gap:.12rem;border:1px solid rgba(91,108,99,.12);border-radius:10px;padding:.4rem .5rem;background:#fffdfa}.content-job-choice-group legend{padding:0 .16rem;font-size:.8rem;font-weight:700}.content-job-chip-grid{display:grid;grid-template-columns:1fr;gap:0}.content-job-tag-list,.content-job-reference-grid{display:flex;flex-wrap:wrap;gap:.45rem}.content-job-chip{display:grid;grid-template-columns:12px minmax(0,1fr);align-items:center;gap:.36rem;border:0;border-radius:0;padding:.12rem 0;background:transparent;font-size:.82rem;line-height:1.12}.content-job-chip + .content-job-chip{border-top:1px solid rgba(91,108,99,.1)}.content-job-chip input{width:12px;height:12px;margin:0;accent-color:var(--accent)}.content-job-chip span{display:block}.content-job-actions{display:flex;justify-content:flex-start}.content-job-overview{position:sticky;top:1rem;display:grid;gap:.7rem;min-width:0}.content-job-overview-list{display:grid;gap:.35rem;max-height:38rem;overflow:auto;padding-right:.18rem}.content-job-overview-item{display:grid;gap:.32rem;padding:.72rem;border:1px solid rgba(91,108,99,.14);border-radius:12px;color:inherit;text-decoration:none;background:#fffdfa;transition:border-color .15s ease,background .15s ease}.content-job-overview-item:hover{border-color:rgba(184,50,98,.35);background:#fff8f1}.content-job-overview-item strong{font-size:.9rem;line-height:1.28}.content-job-overview-item small{font-size:.76rem;line-height:1.3;color:#69736d}.content-job-status-badge{font-size:.67rem;padding:.25rem .46rem}.content-job-status-badge.is-processing,.content-job-status-badge.is-queued{background:#f6ead0;color:#805f1f}.content-job-status-badge.is-failed{background:#f7dfe2;color:#963343}.content-job-status-badge.is-ready{background:#dfeee5;color:#356a4b}.content-job-status-badge.is-draft_input{background:#e8e8e5;color:#59615d}.content-job-detail-head{display:flex;justify-content:space-between;gap:.8rem;align-items:flex-start}.content-job-detail-text{white-space:pre-wrap;line-height:1.42}.content-job-tag-list span{display:inline-flex;align-items:center;border-radius:999px;background:#f2e3d8;color:#9c3c61;font-weight:700;padding:.28rem .48rem;font-size:.8rem}.content-job-review-flags{border-top:1px solid rgba(91,108,99,.14);padding-top:.55rem}.content-job-review-flags summary{display:flex;align-items:center;justify-content:space-between;gap:.7rem;cursor:pointer;font-weight:800;color:#59615d;list-style:none}.content-job-review-flags summary::-webkit-details-marker{display:none}.content-job-review-flags summary::before{content:"›";font-size:1.25rem;line-height:1;transition:transform .15s ease}.content-job-review-flags[open] summary::before{transform:rotate(90deg)}.content-job-review-flags summary span{margin-right:auto}.content-job-review-flags summary strong{display:grid;place-items:center;min-width:1.7rem;height:1.7rem;border-radius:999px;background:#f2e3d8;color:#9c3c61;font-size:.78rem}.content-job-review-flags ul{display:grid;gap:.55rem;margin:.7rem 0 0;padding:0;list-style:none}.content-job-review-flags li{padding:.58rem .65rem;border-radius:10px;background:#fff8f1;color:#5d6862;font-size:.84rem;line-height:1.4}.content-job-reference-grid a{display:grid;gap:.32rem;width:min(170px,100%);color:inherit;text-decoration:none}.content-job-reference-grid img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;background:#eee7df;box-shadow:0 8px 18px rgba(52,45,49,.1)}.content-job-reference-grid span{display:grid;gap:.06rem}.content-job-reference-grid small{color:#69736d;word-break:break-word;font-size:.78rem}.content-job-form .field-help{font-size:.78rem}.content-job-shell .message{margin:0;font-size:.9rem}.content-job-shell .panel{padding:1rem 1.05rem}@media(max-width:1000px){.content-job-create-layout{grid-template-columns:1fr}.content-job-overview{position:static;order:-1}}@media(max-width:850px){.content-job-grid,.content-job-detail-grid{grid-template-columns:1fr}.content-job-detail-head,.content-studio-hero-actions{display:grid;justify-content:flex-start}.content-job-choice-group{padding:.38rem .46rem}.content-job-shell .panel{padding:.9rem .95rem}}
.content-job-platform-drafts{display:grid;gap:.45rem;margin-top:.25rem}.content-job-platform-drafts-head{display:grid;gap:.12rem}.content-job-platform-drafts-head h4,.content-job-platform-drafts-head p{margin:0}.content-job-platform-drafts-head p{color:#69736d;font-size:.8rem;line-height:1.4}.content-job-platform-draft{border:1px solid rgba(91,108,99,.14);border-radius:12px;background:#fffdfa;overflow:hidden}.content-job-platform-draft summary{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.65rem .72rem;cursor:pointer;list-style:none;font-weight:800}.content-job-platform-draft summary::-webkit-details-marker{display:none}.content-job-platform-draft summary::before{content:"›";font-size:1.25rem;line-height:1;transition:transform .15s ease}.content-job-platform-draft[open] summary::before{transform:rotate(90deg)}.content-job-platform-draft summary span{margin-right:auto}.content-job-platform-draft summary code{font-size:.72rem;color:#69736d}.content-job-platform-draft pre{margin:0;border-top:1px solid rgba(91,108,99,.12);padding:.8rem;max-height:34rem;overflow:auto;white-space:pre-wrap;word-break:break-word;background:#fff;font:inherit;font-size:.88rem;line-height:1.55;color:#414a45}
.content-job-image-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.7rem}.content-job-image-head h3{margin:.12rem 0 0}.content-job-image-layout{display:grid;grid-template-columns:minmax(240px,.7fr) minmax(260px,1fr);gap:.8rem;align-items:start}.content-job-image-preview{min-height:220px;border-radius:14px;overflow:hidden;background:#eee7df}.content-job-image-preview img{display:block;width:100%;max-height:520px;object-fit:contain;background:#eee7df}.content-job-image-placeholder{display:grid;place-items:center;min-height:220px;padding:1rem;color:#69736d;text-align:center}.content-job-image-meta{display:grid;gap:.65rem}.content-job-image-actions{display:flex;gap:.45rem;flex-wrap:wrap;align-items:center}.content-job-image-upload{position:relative;overflow:hidden;cursor:pointer}.content-job-image-upload input{position:absolute;inline-size:1px;block-size:1px;opacity:0;pointer-events:none}.content-job-status-badge.is-generating{background:#f6ead0;color:#805f1f}.content-job-status-badge.is-approved{background:#dfeee5;color:#356a4b}.content-job-status-badge.is-rejected{background:#f7dfe2;color:#963343}.content-job-status-badge.is-not_started{background:#e8e8e5;color:#59615d}@media(max-width:850px){.content-job-image-layout{grid-template-columns:1fr}.content-job-image-head{display:grid}.content-job-image-preview{min-height:180px}}
.content-job-progress {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.content-job-progress li {
  border: 1px solid rgba(47, 83, 67, .18);
  border-radius: 12px;
  background: rgba(255, 255, 255, .55);
  overflow: hidden;
}

.content-job-progress li > a,
.content-job-progress-disabled {
  display: flex;
  align-items: center;
  gap: .55rem;
  min-height: 3rem;
  padding: .7rem .85rem;
  color: inherit;
  text-decoration: none;
}

.content-job-progress li > a {
  transition: background .15s ease, transform .15s ease;
}

.content-job-progress li > a:hover {
  background: rgba(255, 255, 255, .72);
}

.content-job-progress li.is-done {
  color: #285a42;
  background: rgba(132, 184, 151, .18);
}

.content-job-progress li.is-current {
  border-color: #9b6c37;
  background: rgba(222, 185, 127, .2);
  font-weight: 700;
}

.content-job-progress li.is-viewing {
  outline: 3px solid rgba(155, 108, 55, .3);
  outline-offset: 2px;
}

[data-content-job-detail] [data-content-job-stage]:not([data-content-job-stage=""]) {
  display: none;
}
[data-content-job-detail][data-active-step="idea"] [data-content-job-stage="idea"],
[data-content-job-detail][data-active-step="draft"] [data-content-job-stage="draft"],
[data-content-job-detail][data-active-step="library"] [data-content-job-stage="library"],
[data-content-job-detail][data-active-step="approval"] [data-content-job-stage="approval"],
[data-content-job-detail][data-active-step="platforms"] [data-content-job-stage="platforms"],
[data-content-job-detail][data-active-step="image"] [data-content-job-stage="image"],
[data-content-job-detail][data-active-step="package"] [data-content-job-stage="package"],
[data-content-job-detail][data-active-step="review"] [data-content-job-stage="review"],
[data-content-job-detail][data-active-step="publish"] [data-content-job-stage="publish"] { display: grid; }
[data-content-job-detail] #content-step-draft,
[data-content-job-detail] #content-step-library{display:none}
[data-content-job-detail][data-active-step="draft"] #content-step-draft,
[data-content-job-detail][data-active-step="approval"] #content-step-draft,
[data-content-job-detail][data-active-step="library"] #content-step-library{display:grid}
[data-content-job-detail] [data-content-job-library-selection]{display:none}
[data-content-job-detail][data-active-step="library"] [data-content-job-library-selection]{display:grid}
[data-content-job-detail] .content-job-detail-grid:has(#content-step-platforms){display:none}
[data-content-job-detail][data-active-step="platforms"] .content-job-detail-grid:has(#content-step-platforms){display:grid}
.content-job-edit-actions{display:flex;justify-content:flex-start}.content-job-edit-actions button{max-width:100%}

.content-job-progress-panel,
.content-job-wizard-progress {
  position: sticky;
  top: .5rem;
  z-index: 12;
  box-shadow: 0 12px 30px rgba(45, 57, 50, .09);
  backdrop-filter: blur(14px);
}

.content-job-progress-panel {
  background: rgba(255, 253, 249, .94);
}

.content-job-progress-panel > .eyebrow {
  margin-bottom: .55rem;
}

.content-job-wizard-progress {
  padding: .55rem;
  border: 1px solid rgba(47, 83, 67, .14);
  border-radius: 16px;
  background: rgba(255, 253, 249, .95);
}

.content-job-wizard-progress ol {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.content-job-wizard-progress button {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: .62rem;
  align-items: center;
  width: 100%;
  min-height: 3.6rem;
  padding: .55rem .65rem;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: #5d6862;
  text-align: left;
}

.content-job-wizard-progress button > span {
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: #eee7df;
  color: #69736d;
  font-weight: 800;
}

.content-job-wizard-progress button strong {
  align-self: end;
  font-size: .84rem;
  line-height: 1.15;
}

.content-job-wizard-progress button small {
  align-self: start;
  color: #7b827e;
  font-size: .7rem;
  font-weight: 600;
}

.content-job-wizard-progress button.is-complete {
  color: #285a42;
}

.content-job-wizard-progress button.is-complete > span {
  background: #dfeee5;
  color: #285a42;
}

.content-job-wizard-progress button.is-current {
  border-color: rgba(155, 108, 55, .38);
  background: #fff6e9;
  color: #5a3d22;
}

.content-job-wizard-progress button.is-current > span {
  background: #9b6c37;
  color: #fff;
}

.content-job-wizard {
  min-height: 34rem;
  align-content: space-between;
}

.content-job-wizard-step {
  display: grid;
  gap: 1rem;
  animation: content-wizard-in .18s ease-out;
}

.content-job-wizard-step[hidden] {
  display: none;
}

@keyframes content-wizard-in {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

.content-job-wizard-step-head {
  display: flex;
  align-items: flex-start;
  gap: .8rem;
  padding-bottom: .8rem;
  border-bottom: 1px solid rgba(91, 108, 99, .14);
}

.content-job-wizard-step-head > span {
  display: grid;
  place-items: center;
  flex: 0 0 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  background: #f2e3d8;
  color: #9c3c61;
  font-weight: 800;
}

.content-job-wizard-step-head h2,
.content-job-wizard-step-head p {
  margin: 0;
}

.content-job-wizard-step-head h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.35rem;
}

.content-job-wizard-step-head p {
  margin-top: .18rem;
  color: #69736d;
  font-size: .86rem;
}

.content-job-wizard-summary {
  padding: .85rem;
  border: 1px solid rgba(91, 108, 99, .14);
  border-radius: 12px;
  background: #fff8f1;
}

.content-job-wizard-summary dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
  margin: .5rem 0 0;
}

.content-job-wizard-summary dl > div {
  min-width: 0;
}

.content-job-wizard-summary dt {
  color: #69736d;
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.content-job-wizard-summary dd {
  margin: .12rem 0 0;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.content-job-wizard-actions {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .7rem;
  align-items: center;
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid rgba(91, 108, 99, .14);
}

.content-job-wizard-actions > span {
  color: #69736d;
  font-size: .78rem;
  text-align: center;
}

.content-job-wizard-actions button:last-child {
  grid-column: 3;
}

.content-job-wizard-actions [hidden] {
  display: none;
}

.content-job-idea-form {
  align-content: start;
}

.content-job-idea-input textarea {
  min-height: 18rem;
  padding: .9rem 1rem;
  font-size: 1.08rem;
  line-height: 1.55;
  resize: vertical;
}

.content-job-advanced {
  margin-top: .45rem;
  border: 1px solid rgba(91, 108, 99, .16);
  border-radius: 14px;
  background: #fff8f1;
  overflow: hidden;
}

.content-job-advanced summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .9rem 1rem;
  cursor: pointer;
  font-weight: 800;
  list-style: none;
}

.content-job-advanced summary::-webkit-details-marker {
  display: none;
}

.content-job-advanced summary::after {
  content: "›";
  font-size: 1.35rem;
  line-height: 1;
  transition: transform .15s ease;
}

.content-job-advanced[open] summary::after {
  transform: rotate(90deg);
}

.content-job-advanced summary small {
  margin-left: auto;
  color: #69736d;
  font-size: .76rem;
  font-weight: 600;
}

.content-job-advanced-fields {
  display: grid;
  gap: .8rem;
  padding: 0 1rem 1rem;
  border-top: 1px solid rgba(91, 108, 99, .12);
}

.content-job-advanced-fields > .field-help {
  margin-top: .8rem;
}

.content-job-advanced-fields > label {
  display: grid;
  gap: .22rem;
  font-size: .92rem;
}

[id^="content-step-"] {
  scroll-margin-top: 8rem;
}

@media(max-width:850px) {
  .content-job-create-layout .content-job-overview {
    order: initial;
  }
  .content-job-wizard-progress {
    overflow-x: auto;
  }
  .content-job-wizard-progress ol {
    grid-template-columns: repeat(4, minmax(145px, 1fr));
  }
  .content-job-progress-nav {
    overflow-x: auto;
  }
  .content-job-progress {
    grid-template-columns: repeat(9, minmax(135px, 1fr));
  }
  .content-job-wizard-summary dl {
    grid-template-columns: 1fr;
  }
  .content-job-wizard-actions {
    grid-template-columns: auto 1fr auto;
  }
  .content-job-advanced summary {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .content-job-advanced summary small {
    order: 3;
    width: 100%;
    margin-left: 0;
  }
}

.content-job-draft-review {
  display: grid;
  gap: 1rem;
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(47, 83, 67, .18);
}
.content-job-library-product,.content-job-library-intake{display:grid;gap:.65rem;padding:.8rem;border:1px solid rgba(91,108,99,.14);border-radius:12px;background:#fffdfa}.content-job-library-intake label{display:grid;gap:.28rem}.content-job-library-product-image{display:block;max-width:min(320px,100%);max-height:360px;object-fit:contain;padding:.7rem;border:1px solid rgba(91,108,99,.14);border-radius:12px;background:#fff}
.content-job-variant-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.content-job-variant-card {
  display: grid;
  gap: .55rem;
  align-content: start;
  min-width: 0;
  padding: .75rem;
  border: 1px solid rgba(94, 70, 58, .16);
  border-radius: 16px;
  background: rgba(255, 255, 255, .72);
}

.content-job-variant-card a,
.content-job-variant-card img,
.content-job-variant-card .content-job-image-placeholder {
  display: block;
  width: 100%;
}

.content-job-variant-card img,
.content-job-variant-card .content-job-image-placeholder {
  aspect-ratio: 4 / 3;
  max-height: 220px;
  border-radius: 12px;
  object-fit: contain;
  background: #efe9e4;
}

.content-job-variant-card small {
  overflow-wrap: anywhere;
}

/* Content workflow: touch-friendly tablet and phone layout */
.content-job-shell,
.content-job-shell > *,
.content-studio,
.content-studio > * {
  min-width: 0;
}

.content-job-detail-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .55rem;
}

.content-job-result-list {
  display: grid;
  gap: .55rem;
  margin: 0;
}

.content-job-result-list > div {
  display: grid;
  grid-template-columns: minmax(7.5rem, .36fr) minmax(0, 1fr);
  gap: .6rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid rgba(91, 108, 99, .12);
}

.content-job-result-list > div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.content-job-result-list dt {
  color: #69736d;
  font-size: .78rem;
  font-weight: 800;
}

.content-job-result-list dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}

.content-job-log {
  max-width: 100%;
  max-height: 28rem;
  margin: 0;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font-size: .82rem;
  line-height: 1.5;
}

@media (max-width: 760px) {
  .content-studio-hero {
    gap: 1rem;
    padding-top: .65rem;
  }

  .content-studio-hero h1 {
    font-size: clamp(1.85rem, 9vw, 2.65rem);
  }

  .content-studio-hero-actions,
  .content-package-head-actions,
  .content-job-detail-actions,
  .content-job-actions,
  .content-job-image-actions,
  .creator-handoff-actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .content-studio-hero-actions > *,
  .content-package-head-actions > *,
  .content-job-detail-actions > *,
  .content-job-actions > *,
  .content-job-image-actions > *,
  .creator-handoff-actions > *,
  .content-job-edit-actions > * {
    width: 100%;
    min-height: 46px;
    justify-content: center;
    text-align: center;
  }

  .content-job-progress-panel,
  .content-job-wizard-progress {
    position: static;
  }

  .content-job-progress-panel {
    padding-right: 0;
    padding-left: 0;
    overflow: hidden;
  }

  .content-job-progress-panel > .eyebrow {
    padding-inline: .9rem;
  }

  .content-job-progress-nav,
  .content-job-wizard-progress {
    scrollbar-width: thin;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
    -webkit-overflow-scrolling: touch;
  }

  .content-job-progress {
    grid-template-columns: repeat(9, minmax(112px, 1fr));
    gap: .45rem;
    padding: .2rem .9rem .7rem;
  }

  .content-job-progress li,
  .content-job-wizard-progress li {
    scroll-snap-align: start;
  }

  .content-job-progress li > a,
  .content-job-progress-disabled {
    min-height: 3.15rem;
    padding: .65rem .7rem;
    font-size: .82rem;
  }

  .content-job-wizard-progress ol {
    grid-template-columns: repeat(4, minmax(124px, 1fr));
  }

  .content-job-wizard-progress button {
    min-height: 3.35rem;
    grid-template-columns: 1.75rem minmax(0, 1fr);
    padding: .45rem .5rem;
  }

  .content-job-wizard-progress button > span {
    width: 1.75rem;
    height: 1.75rem;
  }

  .content-job-wizard {
    min-height: 0;
  }

  .content-job-idea-input textarea {
    min-height: 12rem;
  }

  .content-job-form input:not([type="checkbox"]):not([type="file"]),
  .content-job-form textarea,
  .content-job-library-intake input,
  .content-job-library-intake textarea,
  .content-copy-panel textarea {
    font-size: 16px;
  }

  .content-job-advanced summary {
    padding: .8rem;
  }

  .content-job-advanced-fields {
    padding: 0 .8rem .8rem;
  }

  .content-job-wizard-actions {
    grid-template-columns: 1fr 1fr;
  }

  .content-job-wizard-actions > span {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .content-job-wizard-actions button {
    min-height: 46px;
  }

  .content-job-wizard-actions button:last-child {
    grid-column: 2;
  }

  .content-job-platform-draft summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
  }

  .content-job-platform-draft summary code {
    grid-column: 2;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .content-job-platform-draft pre {
    max-height: none;
    padding: .7rem;
    font-size: .82rem;
  }

  .content-package-sidebar #contentPackageList {
    display: flex;
    gap: .55rem;
    padding: .1rem 0 .6rem;
    overflow-x: auto;
    scroll-snap-type: inline proximity;
    scrollbar-width: thin;
  }

  .content-package-sidebar #contentPackageList > * {
    flex: 0 0 min(82vw, 19rem);
    scroll-snap-align: start;
  }

  .content-package-item {
    height: 100%;
    min-height: 46px;
  }

  .content-copy-panel textarea,
  .creator-variant textarea,
  .creator-handoff textarea {
    min-height: 20rem;
  }

  .content-carousel-grid {
    grid-template-columns: repeat(5, minmax(145px, 72vw));
    scroll-snap-type: inline proximity;
    scrollbar-width: thin;
  }

  .content-carousel-grid a {
    scroll-snap-align: start;
  }

  .content-job-reference-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .content-job-reference-grid a {
    width: auto;
  }

  .content-job-variant-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
  }
}

@media (max-width: 480px) {
  .content-job-shell .panel,
  .content-studio .panel {
    padding: .8rem;
  }

  .content-job-detail-head,
  .content-job-image-head,
  .content-section-heading,
  .content-package-sidebar-head {
    min-width: 0;
  }

  .content-job-result-list > div {
    grid-template-columns: 1fr;
    gap: .12rem;
  }

  .content-job-wizard-step-head {
    gap: .6rem;
  }

  .content-job-wizard-step-head > span {
    flex-basis: 2rem;
    height: 2rem;
  }

  .content-job-wizard-step-head h2 {
    font-size: 1.2rem;
  }

  .content-job-wizard-actions {
    grid-template-columns: 1fr;
  }

  .content-job-wizard-actions button,
  .content-job-wizard-actions button:last-child {
    grid-column: 1;
  }

  .content-job-reference-grid,
  .content-job-variant-grid {
    grid-template-columns: 1fr;
  }

  .content-job-image-preview,
  .content-job-image-placeholder {
    min-height: 150px;
  }

  .content-studio-badge,
  .content-package-status {
    max-width: 100%;
    white-space: normal;
  }
}
.image-style-shell{display:grid;gap:1.2rem}.image-style-intro{display:flex;align-items:end;justify-content:space-between;gap:2rem}.image-style-intro h2,.image-style-reference-section h2,.image-style-markdown-card h2{font-family:Georgia,"Times New Roman",serif;margin:.15rem 0 .45rem}.image-style-intro p{max-width:58rem}.image-style-message{font-weight:800;color:#427057;min-height:1.5rem}.image-style-message.is-error{color:#9d3535}.image-style-markdown-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.image-style-markdown-card{display:grid;gap:.8rem;align-content:start}.image-style-markdown-card textarea{width:100%;min-height:28rem;resize:vertical;line-height:1.5;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;background:#fffdf9}.image-style-markdown-card button{justify-self:start}.image-style-reference-section{display:grid;gap:1rem}.image-style-upload{display:flex;align-items:end;gap:.8rem;flex-wrap:wrap;padding:1rem;border-radius:18px;background:#fff8f1}.image-style-upload label{min-width:min(100%,28rem)}.image-style-reference-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:1rem}.image-style-reference-card{display:grid;gap:.65rem;padding:.75rem;border:1px solid rgba(91,108,99,.16);border-radius:18px;background:#fffdf9}.image-style-reference-card label{display:grid;gap:.6rem;cursor:pointer}.image-style-reference-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:#eee7df}.image-style-reference-select{display:flex;align-items:center;gap:.55rem}.image-style-reference-select input{width:1.15rem;height:1.15rem}.image-style-reference-card small{overflow-wrap:anywhere;color:#69736d}.image-style-reference-card button{justify-self:start}@media(max-width:1050px){.image-style-markdown-grid{grid-template-columns:1fr}.image-style-markdown-card textarea{min-height:20rem}}@media(max-width:700px){.image-style-intro{display:grid;align-items:start}.image-style-upload{display:grid;align-items:start}}
.image-style-reference-card h3{font-size:1rem;margin:0;line-height:1.35}.image-style-reference-card.is-unavailable{opacity:.72}.image-style-missing{display:grid;place-items:center;width:100%;min-height:9rem;aspect-ratio:4/3;border-radius:12px;background:#f2e9e2;color:#8e4b42;font-weight:800;text-align:center}.image-style-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.75rem;align-items:end;padding:1rem;border-radius:18px;background:#fff8f1}.image-style-filters label{display:grid;gap:.35rem;font-weight:750}.image-style-filters .image-style-check{display:flex;align-items:center;gap:.5rem;min-height:44px}.image-style-check input{width:1.15rem;height:1.15rem}.image-style-bulk-actions,.image-style-profile-actions{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap}.image-style-bulk-actions .field-help{margin-left:auto}.image-style-metadata{display:grid;gap:.25rem;margin:0}.image-style-metadata div{display:grid;grid-template-columns:5.7rem 1fr;gap:.4rem;font-size:.78rem}.image-style-metadata dt{font-weight:800;color:#53615a}.image-style-metadata dd{margin:0;overflow-wrap:anywhere}.image-style-curated-grid{display:grid;gap:.8rem}.image-style-curated-card{border:1px solid rgba(91,108,99,.16);border-radius:18px;background:#fffdf9;overflow:hidden}.image-style-curated-card>summary{display:grid;grid-template-columns:92px 1fr;gap:.8rem;align-items:center;padding:.7rem;cursor:pointer;list-style:none}.image-style-curated-card>summary::-webkit-details-marker{display:none}.image-style-curated-card>summary img,.image-style-curated-card>summary .image-style-missing{width:92px;height:68px;min-height:0;aspect-ratio:auto;object-fit:cover;border-radius:10px}.image-style-curated-card>summary span{display:grid;gap:.25rem;min-width:0}.image-style-curated-card>summary small{color:#69736d;overflow-wrap:anywhere}.image-style-review-form{display:grid;gap:1rem;padding:1rem;border-top:1px solid rgba(91,108,99,.14)}.image-style-review-flags{display:flex;gap:1.2rem;flex-wrap:wrap}.image-style-review-flags label{display:flex;align-items:center;gap:.45rem;font-weight:800}.image-style-review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.7rem}.image-style-review-grid label,.image-style-review-selects label,.image-style-review-form>label{display:grid;gap:.35rem;font-weight:750}.image-style-review-selects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}.image-style-review-selects select{min-height:11rem}.image-style-profile-section,.image-style-history-section{display:grid;gap:1rem}.image-style-profile-section h2,.image-style-history-section h2{font-family:Georgia,"Times New Roman",serif;margin:.15rem 0 .45rem}.image-style-profile-section textarea{width:100%;resize:vertical;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;line-height:1.5;background:#fffdf9}.image-style-history-section ul{display:grid;gap:.35rem;margin:0;padding-left:1.2rem}.image-style-history-section li span{color:#69736d}@media(max-width:800px){.image-style-shell{max-width:100%;overflow-x:clip}.image-style-review-selects{grid-template-columns:1fr}.image-style-bulk-actions .field-help{width:100%;margin-left:0}.image-style-curated-card>summary{grid-template-columns:72px 1fr}.image-style-curated-card>summary img,.image-style-curated-card>summary .image-style-missing{width:72px;height:64px}}@media(max-width:700px){.image-style-shell .admin-toolbar{position:static}}@media(max-width:520px){.image-style-reference-grid{grid-template-columns:1fr}.image-style-filters{grid-template-columns:1fr}.image-style-review-grid{grid-template-columns:1fr}.image-style-profile-actions>*{width:100%}}