/* Figma 83:98. External, RSS-scoped styles keep the shared stylesheet intact. */
.rss-page-body { background: #f8f5fc; }
.rss-page { width: min(946px, calc(100% - 80px)); margin: 0 auto; padding-top: 72px; color: #241f35; }
.rss-intro { margin-bottom: 38px; text-align: center; }
.rss-title { margin: 0 0 16px; font-size: 46px; font-weight: 700; line-height: 1.35; letter-spacing: 0; }
.rss-description { max-width: 640px; margin: 0 auto; color: #80748d; font-size: 16px; line-height: 1.9; text-wrap: balance; }
.rss-mobile-badge { display: none; }
.rss-tool { padding: 30px 32px 20px; border: 1px solid #dfd4ee; border-radius: 26px; background: #fff; box-shadow: 0 8px 28px #654f9608; }
.rss-tool-heading { display: flex; align-items: center; gap: 20px; margin-bottom: 26px; }
.rss-badge { display: grid; flex: 0 0 66px; width: 66px; height: 66px; place-items: center; border-radius: 20px; background: #fff2e6; }
.rss-tool-copy { min-width: 0; }
.rss-tool-title { margin: 0 0 6px; font-size: 24px; font-weight: 600; line-height: 1.5; }
.rss-tool-description { margin: 0; color: #80748d; font-size: 14px; line-height: 1.8; }
.rss-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.rss-address { flex: 1 1 300px; min-width: 0; width: 100%; height: 54px; padding: 0 18px; border: 1px solid #dfd4ee; border-radius: 16px; background: #fbf9fe; color: #654f96; font: 400 16px/1.5 var(--font-sans, sans-serif); }
.rss-copy-button { display: inline-flex; flex: 0 0 242px; align-items: center; justify-content: center; gap: 10px; width: 242px; min-height: 54px; padding: 10px 16px; border: 1px solid #654f96; border-radius: 16px; background: #654f96; color: #fff; font: 600 16px/1.5 var(--font-sans, sans-serif); cursor: pointer; transition: background-color 160ms ease, border-color 160ms ease, transform 160ms ease; }
.rss-copy-button[hidden] { display: none; }
.rss-copy-button img, .rss-nav-link img, .rss-mobile-link img, .rss-footer-link img { flex: none; }
.rss-copy-button:active { transform: translateY(1px); }
.rss-copy-button:focus-visible, .rss-address:focus-visible, .rss-nav-link:focus-visible, .rss-mobile-link:focus-visible, .rss-footer-link:focus-visible { outline: 2px solid #654f96; outline-offset: 4px; border-radius: 16px; }
.rss-copy-status { min-height: 22px; margin: 10px 0 0; color: #654f96; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.rss-manual-hint { margin: 8px 0 0; color: #80748d; font-size: 13px; }
.rss-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 21.5px; margin: 24px 0; padding: 0; list-style: none; }
.rss-step { display: grid; grid-template-columns: 42px minmax(0, 1fr); column-gap: 12px; align-content: start; min-height: 168px; min-width: 0; padding: 24px; border: 1px solid #dfd4ee; border-radius: 22px; background: #fff; }
.rss-step-copy { display: contents; }
.rss-step-number { display: block; color: #e58c43; font: 700 19px/1.6 var(--font-sans, sans-serif); }
.rss-step-title { margin: 0 0 18px; font-size: 21px; font-weight: 600; line-height: 1.5; }
.rss-step-description { grid-column: 1 / -1; }
.rss-step-description { margin: 0; color: #80748d; font-size: 14px; line-height: 1.8; }
.rss-faq { padding: 22px 26px; border: 1px solid #dfd4ee; border-radius: 22px; background: #f0eaf8; }
.rss-faq-title { margin: 0 0 8px; color: #654f96; font-size: 17px; font-weight: 600; line-height: 1.6; }
.rss-faq-description { margin: 0; color: #80748d; font-size: 14px; line-height: 1.9; }
.rss-notes { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 28px; margin: 24px 0 0; padding: 0; color: #80748d; font-size: 13px; list-style: none; }
.rss-notes li { display: inline-flex; align-items: center; gap: 8px; }
.rss-notes li::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #e58c43; }
.rss-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.rss-desktop-nav .rss-nav-link { flex: none; gap: 7px; margin-left: 10px; padding: 0 16px; border: 1px solid #dfd4ee; border-radius: 999px; background: #fff2e6; color: #654f96; font: 600 14px/1 var(--font-sans, sans-serif); letter-spacing: 0; white-space: nowrap; transition: background-color 160ms ease, color 160ms ease, transform 160ms ease; }
.rss-desktop-nav .rss-nav-link::before, .rss-desktop-nav .rss-nav-link::after { display: none; }
.rss-desktop-nav .rss-nav-link[aria-current="page"] { border-color: #e58c43; }
.rss-mobile-sheet .rss-mobile-link { align-items: center; color: #e58c43; overflow-wrap: anywhere; }
.rss-mobile-sheet .rss-mobile-link[aria-current="page"] { color: #654f96; }
.rss-footer-link { gap: 6px; white-space: nowrap; }

@media (hover: hover) {
  .rss-copy-button:hover { border-color: #7962ab; background: #7962ab; transform: translateY(-1px); }
  .rss-desktop-nav .rss-nav-link:hover { background: #ffebda; color: #7962ab; transform: translateY(-1px); }
  .rss-copy-button:active, .rss-desktop-nav .rss-nav-link:active { transform: translateY(1px); }
}

/* Keep the existing menu design when the extra navigation item needs more room. */
@media (min-width: 761px) and (max-width: 1040px) {
  .rss-nav-shell .rss-desktop-nav { display: none; }
  .rss-nav-shell .rss-mobile-nav { display: block; }
  .rss-mobile-nav summary { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 2px 0 12px; list-style: none; color: var(--ink); font: 600 15px/1 var(--font-serif); letter-spacing: .2em; cursor: pointer; }
  .rss-mobile-nav summary::-webkit-details-marker { display: none; }
  .rss-menu-icon { position: relative; display: grid; gap: 6px; width: 22px; }
  .rss-menu-icon i { display: block; height: 1.5px; background: currentColor; transition: transform 160ms ease; }
  .rss-mobile-nav[open] summary { color: var(--violet); }
  .rss-mobile-nav[open] .rss-menu-icon i:first-child { transform: translateY(3.75px) rotate(45deg); }
  .rss-mobile-nav[open] .rss-menu-icon i:last-child { transform: translateY(-3.75px) rotate(-45deg); }
  .rss-mobile-sheet { position: absolute; z-index: 50; top: 100%; left: calc(var(--gutter) * -1); right: calc(var(--gutter) * -1); max-width: 100vw; height: calc(100dvh - var(--header-h)); overflow-y: auto; padding: 28px var(--gutter) 40px; border-top: 1px solid var(--line); background: var(--ground); }
  .rss-mobile-sheet > p:first-child { margin: 0 0 12px; color: var(--violet); font-size: 12px; letter-spacing: .3em; }
  .rss-mobile-sheet > a { display: flex; align-items: baseline; gap: 18px; min-height: 60px; padding: 14px 0; border-bottom: 1px solid var(--line); color: var(--ink); font: 700 23px/1.4 var(--font-serif); letter-spacing: .12em; text-decoration: none; }
  .rss-mobile-sheet > a[aria-current="page"] { color: var(--violet); }
  .rss-mobile-sheet > a > span { width: 1.6em; color: var(--violet-soft); font: 400 15px/1 var(--font-kai); letter-spacing: 0; }
  .rss-mobile-sheet > p:last-child { margin: 28px 0 0; color: var(--ink-soft); font: 18px/1.8 var(--font-kai); }
  .rss-mobile-sheet > .rss-mobile-link { align-items: center; color: #e58c43; }
}

@media (max-width: 1040px) {
  .rss-nav-shell { min-width: 0; }
  .rss-mobile-sheet { overflow-x: hidden; overscroll-behavior: contain; }
}

@media (max-width: 760px) {
  .rss-mobile-nav summary { white-space: nowrap; }
  .rss-mobile-nav .mobile-nav-label { display: none; }
  .rss-page { width: calc(100% - 40px); padding-top: 34px; }
  .rss-intro { margin-bottom: 26px; }
  .rss-mobile-badge { display: grid; width: 76px; height: 76px; margin: 0 auto 20px; place-items: center; border-radius: 24px; background: #fff2e6; }
  .rss-title { margin-bottom: 12px; font-size: 29px; line-height: 1.4; letter-spacing: 0; }
  .rss-description { max-width: 350px; font-size: 14px; line-height: 1.9; }
  .rss-tool { padding: 22px 20px 16px; border-radius: 24px; }
  .rss-tool-heading { margin-bottom: 18px; }
  .rss-badge { display: none; }
  .rss-tool-title { margin-bottom: 8px; font-size: 20px; }
  .rss-tool-description { font-size: 13px; line-height: 1.85; }
  .rss-controls { flex-direction: column; align-items: stretch; gap: 12px; }
  .rss-address { flex: none; height: 52px; padding-inline: 12px; font-size: 14px; }
  .rss-copy-button { flex: none; width: 100%; min-height: 56px; }
  .rss-copy-status { margin-top: 8px; font-size: 12px; }
  .rss-steps { grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 20px 0; }
  .rss-step { display: flex; align-items: center; gap: 18px; min-height: 90px; padding: 16px 20px; border-radius: 22px; }
  .rss-step-number { display: grid; place-items: center; flex: 0 0 41px; height: 41px; margin: 0; border-radius: 14px; background: #fff2e6; font-size: 18px; }
  .rss-step-copy { display: block; min-width: 0; }
  .rss-step-title { margin-bottom: 4px; font-size: 16px; }
  .rss-step-description { font-size: 12px; line-height: 1.7; }
  .rss-faq { padding: 18px 20px; }
  .rss-faq-title { font-size: 15px; }
  .rss-faq-description { font-size: 13px; line-height: 1.85; }
  .rss-notes { gap: 8px 16px; margin-top: 20px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .rss-copy-button, .rss-desktop-nav .rss-nav-link, .rss-mobile-nav .rss-menu-icon i, .rss-mobile-sheet { transition: none; animation: none; }
  .rss-copy-button:hover, .rss-copy-button:active, .rss-desktop-nav .rss-nav-link:hover, .rss-desktop-nav .rss-nav-link:active { transform: none; }
}