/* Styles for the Bot introduction; styles.css is also shared by the plan pages. */
:root {
  color-scheme: dark;
  --surface: #0e141e;
  --surface-hover: #141d29;
  --field: #0c121a;
  --tag: #192330;
  --soft-text: #a8b3c3;
  --subtle-text: #93a1b4;
  --accent-bg: rgba(184, 243, 107, .07);
  --accent-border: rgba(184, 243, 107, .25);
  --strong-line: #35404f;
  --blue-icon: #9ec7fb;
  --gold-icon: #ebc77f;
  --purple-icon: #bcb0ef;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f7f9f6;
  --panel: #eef2ed;
  --panel-2: #ffffff;
  --line: rgba(34, 55, 38, .14);
  --text: #1b2920;
  --muted: #58695d;
  --lime: #38621f;
  --lime-dark: #294c14;
  --surface: #ffffff;
  --surface-hover: #f0f5eb;
  --field: #ffffff;
  --tag: #edf2e9;
  --soft-text: #53665a;
  --subtle-text: #607064;
  --accent-bg: #ecf3e5;
  --accent-border: #c0d2b2;
  --strong-line: #b6c5b5;
  --blue-icon: #2b60a4;
  --gold-icon: #8b5f13;
  --purple-icon: #72529f;
}
.bot-homepage { --page: 1320px; overflow-wrap: break-word; }
.bot-homepage [hidden] { display: none !important; }
.bot-homepage :focus-visible { outline: 2px solid var(--lime); outline-offset: 5px; }
.bot-homepage section[id], .bot-homepage details[id] { scroll-margin-top: 25px; }
.bot-homepage .noise { display: none; }
.bot-homepage h2 { font-size: clamp(30px, 3.3vw, 46px); line-height: 1.45; }
.bot-homepage .button-ghost { background: var(--surface); color: var(--text); }
.bot-homepage .button-primary { box-shadow: none; }
:root[data-theme="light"] .bot-homepage .button-primary { color: #fff; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: absolute; top: -100px; left: 20px; z-index: 60; padding: 12px 20px; border-radius: 8px; background: var(--text); color: var(--bg); }
.skip-link:focus { top: 12px; }

.bot-homepage .site-header { width: min(100%, var(--page)); padding-inline: var(--pad); gap: 20px; }
.bot-homepage .desktop-nav { gap: clamp(16px, 2vw, 30px); }
.bot-homepage .desktop-nav a { color: var(--soft-text); white-space: nowrap; }
.bot-homepage .desktop-nav a:hover { color: var(--text); }
.bot-homepage .header-cta { background: var(--surface); }
.bot-homepage .header-dashboard { color: var(--text); border-color: var(--accent-border); background: var(--accent-bg); font-size: 12px; white-space: nowrap; }
.bot-homepage .header-dashboard:hover { border-color: var(--lime); }
.setup-dashboard-link { color: var(--lime); text-decoration: underline; text-underline-offset: 3px; }
.site-theme-toggle { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--text); cursor: pointer; }
.site-theme-toggle:hover { border-color: var(--strong-line); }
.site-theme-toggle svg { width: 20px; height: 20px; }
[data-theme="dark"] .theme-moon, [data-theme="light"] .theme-sun { display: none; }
.bot-homepage .hero { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(36px, 4vw, 64px); min-height: 640px; padding-top: 65px; padding-bottom: 70px; }
.bot-homepage .hero::before { opacity: .3; }
.bot-homepage h1 { font-size: clamp(39px, 4.1vw, 62px); line-height: 1.35; }
.bot-homepage .hero-actions { flex-wrap: wrap; }
.bot-homepage .hero-copy { max-width: 540px; color: var(--soft-text); font-size: 15px; }
.bot-homepage .hero-notes { color: var(--subtle-text); }
.bot-homepage .hero-product { height: auto; display: block; place-items: normal; overflow: visible; }
.protection-preview { border: 1px solid var(--strong-line); border-radius: 16px; background: var(--surface); box-shadow: 0 20px 55px rgba(0, 0, 0, .13); overflow: hidden; }
.preview-toolbar { display: flex; align-items: center; gap: 11px; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.preview-brand-mark { display: grid; place-items: center; flex: none; width: 35px; height: 35px; color: var(--lime); border: 1px solid var(--accent-border); border-radius: 9px; background: var(--accent-bg); font-size: 18px; font-weight: 700; }
.preview-toolbar > div { display: grid; gap: 3px; }
.preview-toolbar strong { font-size: 14px; }
.preview-toolbar > div > span { color: var(--subtle-text); font-size: 10px; }
.preview-example { margin-left: auto; color: var(--subtle-text); font-size: 10px; }
.preview-flow { padding: 27px 24px; }
.preview-event { display: flex; gap: 13px; align-items: flex-start; padding: 18px 16px; border: 1px solid var(--line); border-radius: 9px; }
.preview-event > svg { width: 23px; height: 23px; flex: none; color: var(--subtle-text); margin-top: 2px; }
.preview-event-label { display: block; color: var(--subtle-text); font-size: 10px; margin-bottom: 9px; }
.preview-event strong { display: block; font-size: 14px; font-weight: 600; line-height: 1.8; }
.preview-event p { color: var(--soft-text); font-size: 11px; line-height: 1.9; margin: 5px 0 0; }
.preview-event-restored { background: var(--accent-bg); border-color: var(--accent-border); }
.preview-event-restored > svg, .preview-event-restored .preview-event-label { color: var(--lime); }
.preview-connection { display: flex; align-items: center; gap: 17px; padding: 13px 18px; }
.preview-connection > span { color: var(--lime); font-size: 20px; }
.preview-connection > p { color: var(--subtle-text); font-size: 10px; margin: 0; line-height: 1.7; }
.preview-footer { display: flex; justify-content: space-between; align-items: center; padding: 17px 24px; border-top: 1px solid var(--line); font-size: 12px; color: var(--soft-text); }
.preview-footer:hover { color: var(--lime); background: var(--accent-bg); }
.preview-footer > span { color: var(--lime); }
.bot-homepage .quick-bar { min-height: 70px; }
.bot-homepage .quick-bar span { font-size: 12px; color: var(--soft-text); }
:root[data-theme="light"] .protection-preview { box-shadow: 0 18px 40px rgba(26, 42, 30, .06); }

.protection-section, .catalog-section, .updates-section { width: min(100%, var(--page)); margin: auto; padding: 75px var(--pad); }
.protection-heading, .catalog-heading { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin-bottom: 32px; }
.protection-heading h2, .catalog-heading h2 { letter-spacing: -.04em; }
.protection-heading .kicker, .catalog-heading .kicker { margin-bottom: 14px; }
.protection-intro p, .catalog-heading > p { color: var(--soft-text); font-size: 14px; line-height: 1.95; margin: 0; }
.protection-intro strong { color: var(--text); font-weight: 600; }
.protection-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; padding: 0; margin: 0; border: 1px solid var(--accent-border); border-radius: 12px; background: var(--accent-bg); }
.protection-flow li { padding: 24px; }
.protection-flow li + li { border-left: 1px solid var(--line); }
.protection-step { display: flex; justify-content: space-between; color: var(--lime); font-size: 13px; font-weight: 700; }
.protection-step > span { color: var(--subtle-text); }
.protection-flow h3 { font-size: 17px; font-weight: 600; line-height: 1.7; margin: 18px 0 6px; }
.protection-flow p { color: var(--soft-text); font-size: 12px; line-height: 1.85; margin: 0; }
.protection-conditions { margin-top: 16px; border-bottom: 1px solid var(--line); }
.protection-conditions summary { padding: 17px 2px; font-size: 12px; }
.protection-conditions > div { max-width: 960px; padding-bottom: 14px; }
.protection-conditions p { color: var(--soft-text); font-size: 13px; line-height: 1.9; padding: 0 0 12px; }

.catalog-section { padding-top: 25px; padding-bottom: 55px; }
.catalog-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.catalog-filters { display: flex; gap: 4px; flex-wrap: wrap; }
.catalog-filters button { min-height: 44px; border: 1px solid transparent; border-radius: 7px; background: none; color: var(--soft-text); font-size: 12px; padding: 10px 14px; cursor: pointer; }
.catalog-filters button:hover { background: var(--surface-hover); color: var(--text); }
.catalog-filters button[aria-pressed="true"] { color: var(--lime); background: var(--accent-bg); border-color: var(--accent-border); }
.catalog-search { display: flex; align-items: center; gap: 10px; border: 1px solid var(--strong-line); border-radius: 8px; padding: 0 12px; background: var(--field); }
.catalog-search:focus-within { outline: 2px solid var(--lime); outline-offset: 3px; }
.catalog-search svg { flex: none; width: 17px; height: 17px; color: var(--subtle-text); }
.catalog-search input { min-width: 0; width: 155px; min-height: 44px; padding: 8px 0; font: inherit; font-size: 13px; color: var(--text); background: none; border: none; outline: none; }
.catalog-search input::placeholder { color: var(--subtle-text); }
.catalog-search input:focus-visible { outline: none; }
.catalog-result { color: var(--subtle-text); font-size: 11px; margin: 16px 0; }
.catalog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 12px; }
.catalog-card { min-width: 0; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); transition: border-color .18s; }
.catalog-card:hover, .catalog-card[open] { border-color: var(--strong-line); }
.catalog-card > summary { display: flex; align-items: flex-start; gap: 14px; min-height: 132px; padding: 23px 20px; }
.catalog-icon { flex: none; width: 22px; height: 22px; margin-top: 2px; color: var(--lime); }
.catalog-card[data-category="manage"] .catalog-icon { color: var(--blue-icon); }
.catalog-card[data-category="enjoy"] .catalog-icon { color: var(--gold-icon); }
.catalog-card[data-category="connect"] .catalog-icon { color: var(--purple-icon); }
.bot-homepage .catalog-card > summary span { color: inherit; font-size: inherit; font-weight: inherit; transform: none; }
.catalog-summary { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 9px; }
.catalog-summary strong { font-size: 15px; font-weight: 600; line-height: 1.65; }
.bot-homepage .catalog-card > summary .catalog-teaser { font-size: 12px; line-height: 1.8; font-weight: 400; color: var(--soft-text); }
.bot-homepage .catalog-card > summary .catalog-toggle { color: var(--subtle-text); flex: none; margin-top: 1px; font-size: 20px; }
.bot-homepage .catalog-card[open] > summary .catalog-toggle { transform: rotate(45deg); }
.catalog-card-body { padding: 0 20px 23px; }
.catalog-card-body > p { color: var(--soft-text); font-size: 13px; line-height: 1.9; padding: 18px 0; border-top: 1px solid var(--line); margin: 0; }
.catalog-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.catalog-tags span { display: block; padding: 4px 7px; background: var(--tag); border-radius: 4px; color: var(--soft-text); font-size: 10px; line-height: 1.5; }
.catalog-detail-link { display: inline-flex; align-items: center; gap: 12px; padding-top: 14px; color: var(--lime); font-size: 12px; }
.catalog-detail-link:hover { text-decoration: underline; }
.catalog-footnote { color: var(--subtle-text); font-size: 11px; line-height: 1.9; margin: 20px 0 0; }
.catalog-empty { padding: 40px 20px; text-align: center; border: 1px dashed var(--strong-line); border-radius: 12px; }
.catalog-empty h3 { font-size: 17px; }
.catalog-empty p { color: var(--soft-text); font-size: 13px; line-height: 1.8; }
.catalog-empty button { cursor: pointer; margin-top: 10px; }

.bot-homepage .plan-teaser { padding-top: 35px; padding-bottom: 35px; gap: 30px; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) auto; border-top: 1px solid var(--line); }
.bot-homepage .plan-teaser h2 { font-size: 23px; }
.bot-homepage .plan-teaser-summary { color: var(--soft-text); font-size: 12px; }
.bot-homepage .plan-teaser-summary b { color: var(--text); font-size: 14px; }
.bot-homepage .dashboard-section { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 65px; padding-top: 75px; padding-bottom: 75px; background: none; }
.bot-homepage .dashboard-copy > p:not(.kicker) { font-size: 14px; color: var(--soft-text); }
.settings-map { min-width: 0; }
.settings-map-label { color: var(--subtle-text); font-size: 11px; margin-bottom: 15px; }
.settings-map > div { display: grid; grid-template-columns: 30px 1fr; column-gap: 15px; align-items: baseline; padding: 18px 0; border-top: 1px solid var(--line); }
.settings-map > div > span { grid-row: span 2; color: var(--lime); font-size: 11px; }
.settings-map h3 { font-size: 16px; font-weight: 600; margin: 0 0 6px; }
.settings-map > div > p { color: var(--soft-text); font-size: 12px; line-height: 1.8; margin: 0; }

.updates-section { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding-top: 55px; padding-bottom: 50px; }
.updates-section .catalog-heading { margin-bottom: 25px; }
.updates-section h2 { font-size: 30px; }
.updates-grid { display: grid; grid-template-columns: 1fr; }
.update-card { border-top: 1px solid var(--line); border-bottom: 0; }
.update-card:last-child { border-bottom: 1px solid var(--line); }
.update-card > summary { display: grid; grid-template-columns: 85px minmax(0, 1fr) auto 20px; gap: 18px; padding: 21px 0; }
.bot-homepage .update-card > summary span { color: inherit; font-size: inherit; font-weight: inherit; transform: none; }
.bot-homepage .update-card > summary .update-version { color: var(--lime); font-size: 12px; }
.update-card > summary > strong { font-size: 15px; font-weight: 500; line-height: 1.8; }
.update-card time { color: var(--subtle-text); font-size: 11px; }
.bot-homepage .update-card > summary .update-toggle { color: var(--subtle-text); font-size: 20px; }
.bot-homepage .update-card[open] > summary .update-toggle { transform: rotate(45deg); }
.update-body { padding: 0 40px 22px 103px; }
.update-body p { color: var(--soft-text); font-size: 13px; line-height: 1.9; margin: 0 0 12px; padding: 0; }
.update-category { color: var(--subtle-text); font-size: 11px; }
.updates-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 15px; margin-top: 22px; }
.updates-footer p { color: var(--subtle-text); font-size: 11px; line-height: 1.9; margin: 0; }
.updates-footer code, .updates-footer a { color: var(--lime); font-size: 11px; }
.updates-footer a:hover { text-decoration: underline; }

.bot-homepage .setup-section { padding-top: 75px; padding-bottom: 75px; gap: 60px; }
.bot-homepage .setup-list p { color: var(--soft-text); font-size: 13px; }
.bot-homepage .setup-list li { padding-block: 24px; }
.command-disclosure { margin-top: 25px; }
.command-disclosure > summary { padding: 16px 0; font-size: 13px; }
.bot-homepage .command-row { grid-template-columns: 110px minmax(0, 1fr); padding: 12px 0; gap: 12px; }
.bot-homepage .command-row code { color: var(--lime); font-size: 12px; }
.bot-homepage .command-row span { color: var(--soft-text); font-size: 11px; line-height: 1.8; }
.bot-homepage .command-row kbd { display: none; }
.command-permission-note { color: var(--subtle-text); font-size: 11px; line-height: 1.9; margin: 16px 0; }
.support-strip { width: min(calc(100% - var(--pad) * 2), calc(var(--page) - var(--pad) * 2)); display: flex; flex-wrap: wrap; gap: 25px; align-items: center; margin: 0 auto 60px; padding: 24px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.support-strip strong { margin-right: auto; font-size: 16px; }
.support-strip a { color: var(--soft-text); font-size: 12px; }
.support-strip a:hover { color: var(--lime); }
.support-strip a span { color: var(--lime); margin-left: 6px; }
.bot-homepage .faq-section { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); padding-top: 65px; padding-bottom: 65px; gap: 55px; background: var(--panel); }
.bot-homepage .faq-title h2 { font-size: 30px; }
.bot-homepage .faq-list summary { font-size: 13px; padding-block: 22px; }
.bot-homepage .faq-list p { color: var(--soft-text); font-size: 13px; }
.bot-homepage .cta-section { min-height: 340px; padding-block: 65px; }
.bot-homepage .cta-section h2 { font-size: clamp(28px, 3vw, 40px); }
.bot-homepage .footer-brand p, .bot-homepage .footer-links b, .bot-homepage .footer-links a, .bot-homepage .footer-bottom { color: var(--subtle-text); }
.bot-homepage .footer-bottom a { color: var(--soft-text); }
.bot-homepage footer { padding-top: 50px; }

@media (max-width: 1120px) {
  .protection-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .protection-flow li:nth-child(3) { border-left: 0; }
  .protection-flow li:nth-child(n+3) { border-top: 1px solid var(--line); }
  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-card > summary { min-height: 125px; }
}
@media (max-width: 860px) {
  .bot-homepage .hero { grid-template-columns: minmax(0, 1fr); min-height: auto; padding-top: 55px; gap: 28px; }
  .bot-homepage h1 { font-size: clamp(34px, 7vw, 58px); }
  .bot-homepage .hero-product { width: min(100%, 540px); margin: 15px auto 0; }
  .bot-homepage .header-actions { display: flex; margin-left: auto; }
  .bot-homepage .header-cta { display: none; }
  .site-theme-toggle { margin-left: 0; }
  .bot-homepage .menu-button { margin-left: 0; }
  .bot-homepage .menu-button span { background: var(--text); }
  .bot-homepage .site-header.menu-open .desktop-nav { left: var(--pad); right: var(--pad); background: var(--surface); box-shadow: 0 14px 35px rgba(0, 0, 0, .12); }
  .protection-heading, .catalog-heading { grid-template-columns: 1fr; gap: 20px; margin-bottom: 28px; }
  .bot-homepage .plan-teaser { grid-template-columns: 1fr; gap: 18px; }
  .bot-homepage .dashboard-section, .bot-homepage .setup-section, .bot-homepage .faq-section { grid-template-columns: 1fr; gap: 35px; }
  .protection-section, .updates-section, .bot-homepage .dashboard-section, .bot-homepage .setup-section { padding-block: 55px; }
  .catalog-section { padding-top: 10px; padding-bottom: 45px; }
  .bot-homepage:not(.js-enabled) .desktop-nav { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 14px; padding-bottom: 14px; }
  .bot-homepage:not(.js-enabled) .site-header { height: auto; min-height: 66px; flex-wrap: wrap; padding-top: 16px; }
  .bot-homepage:not(.js-enabled) .menu-button { display: none; }
}
@media (max-width: 600px) {
  .bot-homepage .site-header { gap: 8px; }
  .bot-homepage .header-dashboard { padding-inline: 10px; }
  .site-theme-toggle { width: 38px; height: 38px; }
  .bot-homepage .hero-product { background: none; border: none; border-radius: 0; }
  .preview-toolbar { padding: 17px 18px; }
  .preview-flow { padding: 20px 16px; }
  .preview-event { padding: 15px 12px; gap: 10px; }
  .preview-event strong { font-size: 13px; }
  .preview-event > svg { width: 20px; height: 20px; }
  .preview-connection { gap: 12px; padding: 12px; }
  .preview-footer { padding: 16px 18px; }
  .bot-homepage .hero-copy { font-size: 14px; }
  .bot-homepage .quick-bar span { font-size: 10px; }
  .protection-heading h2, .catalog-heading h2 { font-size: clamp(27px, 6.3vw, 36px); }
  .protection-intro p, .catalog-heading > p { font-size: 13px; }
  .protection-flow li { padding: 18px 15px; }
  .protection-flow h3 { font-size: 16px; margin-top: 15px; }
  .protection-flow p { font-size: 11px; }
  .protection-conditions summary { font-size: 12px; }
  .catalog-toolbar { gap: 14px; }
  .catalog-filters { width: 100%; gap: 3px; }
  .catalog-filters button { padding: 10px 12px; font-size: 12px; }
  .catalog-search { width: 100%; }
  .catalog-search input { width: 100%; font-size: 16px; }
  .catalog-grid { grid-template-columns: 1fr; gap: 9px; }
  .catalog-card > summary { min-height: 105px; padding: 21px 18px; }
  .catalog-card-body { padding-inline: 18px; }
  .catalog-summary strong { font-size: 15px; }
  .bot-homepage .catalog-card > summary .catalog-teaser { font-size: 12px; }
  .update-card > summary { grid-template-columns: 65px minmax(0, 1fr) 18px; gap: 10px; padding-block: 18px; }
  .update-card > summary > time { display: none; }
  .update-card > summary > strong { font-size: 13px; }
  .update-body { padding: 0 0 20px 0; }
  .updates-section h2 { font-size: 28px; }
  .support-strip { display: grid; gap: 18px; padding: 22px; margin-bottom: 45px; }
  .bot-homepage .faq-section { padding-block: 50px; }
  .bot-homepage .cta-section { min-height: 300px; padding-block: 55px; }
}
@media (max-width: 360px) {
  .bot-homepage .site-header .brand > span:last-child { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .bot-homepage *, .bot-homepage *::before, .bot-homepage *::after { scroll-behavior: auto !important; transition: none !important; }
  .bot-homepage .reveal { animation: none; opacity: 1; transform: none; }
}