/* Public website theme. Kept separate from /app/ and the browser extension. */
.theme-toggle {
  display: inline-grid;
  place-items: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #39354f;
  border-radius: 12px;
  background: linear-gradient(145deg, #1c1b2e, #101421);
  color: #dfd9f4;
  box-shadow: inset 0 1px #ffffff08;
  transition: background .2s, border-color .2s, box-shadow .2s;
}
.theme-toggle[hidden] { display: none; }
.theme-toggle svg { grid-area: 1 / 1; transition: opacity .18s, transform .25s; }
.theme-toggle .theme-icon-moon { opacity: 0; transform: rotate(-20deg) scale(.7); }
.theme-toggle:hover { border-color: #9b82ed; background: #211c35; box-shadow: 0 0 18px #9672ff24; }
.nav-actions { gap: 10px; }

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f8faff;
  --surface: #ffffff;
  --surface2: #edf2fa;
  --line: #dbe2ee;
  --text: #17243b;
  --muted: #53627b;
  --purple: #6243d6;
  --mint: #126c58;
  --accent: #5d40cb;
  background: var(--bg);
  color: var(--text);
}
html[data-theme="light"] body {
  background: radial-gradient(ellipse 780px 560px at 84% 220px, #e8edff85, transparent 75%), var(--bg);
}
html[data-theme="light"] ::selection { background: #dcd3ff; color: #261756; }
html[data-theme="light"] :is(a, button, select, summary):focus-visible { outline-color: #6243d6; }
html[data-theme="light"] .header { background: #f8faffed; border-bottom-color: #dbe2ee; }
html[data-theme="light"] .brand-name>small { color: #596782; }
html[data-theme="light"] .brand-icon { box-shadow: inset 0 1px 1px #ede6ffa8, 0 4px 12px #604aca24; }
html[data-theme="light"] .brand-digits { color: #6243d6; }
html[data-theme="light"] .header nav a { color: #53627b; }
html[data-theme="light"] .header nav a:hover { color: #4f32b9; }
html[data-theme="light"] :is(select, .language-trigger, .theme-toggle) {
  background: #ffffff;
  border-color: #d6deec;
  color: #364661;
  box-shadow: 0 2px 5px #24345704;
}
html[data-theme="light"] .language-trigger svg { color: #6a738a; }
html[data-theme="light"] :is(.theme-toggle:hover, .language-trigger:hover, .language-trigger[aria-expanded="true"]) {
  background: #f1edff;
  border-color: #ad9ce6;
  color: #573bbd;
  box-shadow: 0 3px 10px #6550b30c;
}
html[data-theme="light"] .theme-icon-sun { opacity: 0; transform: rotate(30deg) scale(.7); }
html[data-theme="light"] .theme-icon-moon { opacity: 1; transform: rotate(0) scale(1); }
html[data-theme="light"] .nav-download { background: #eae5fa; border-color: #ded5f6; color: #4c3397; }
html[data-theme="light"] .nav-download:hover { background: #dfd6f7; }
html[data-theme="light"] .primary {
  color: #ffffff;
  background: linear-gradient(115deg, #6b49d8, #5434bb);
  border-color: #6340ce;
  box-shadow: inset 0 1px #ffffff24, 0 5px 14px #6145b524;
}
html[data-theme="light"] .primary:hover { background: linear-gradient(115deg, #6040ca, #492aab); box-shadow: inset 0 1px #ffffff24, 0 7px 20px #6145b538; }
html[data-theme="light"] .mint { color: #ffffff; background: #126c58; border-color: #126c58; box-shadow: 0 5px 14px #126c5820; }
html[data-theme="light"] .mint:hover { background: #0e5949; box-shadow: 0 7px 20px #126c5828; }
html[data-theme="light"] .outline { color: #413465; background: #ffffff; border-color: #bcb4d3; }
html[data-theme="light"] .outline:hover { background: #f3efff; border-color: #9e8bcf; }
html[data-theme="light"] :is(.primary, .mint):focus-visible { box-shadow: 0 0 0 4px #785bc422; }
html[data-theme="light"] .eyebrow { color: #64557c; }
html[data-theme="light"] .mini-key { filter: none; }
html[data-theme="light"] .hero h1 .gradient-text {
  color: #573bbd;
  background-image: linear-gradient(105deg, #4d329f, #664bd0 66%, #226e80);
  text-shadow: none;
}
html[data-theme="light"] .hero-description { color: #53627b; }
html[data-theme="light"] :is(.text-link, #dialog-content a) { color: #5938b8; }
html[data-theme="light"] .text-link:hover { color: #3d238d; }
html[data-theme="light"] .download-meta { color: #61708a; }
html[data-theme="light"] .hero-points { color: #53627b; }
html[data-theme="light"] .hero-visual::before {
  background: radial-gradient(ellipse at 49% 42%, #d5d4fc80 0%, #d8eafa70 34%, transparent 68%);
}
html[data-theme="light"] .hero-visual img,
html[data-theme="light"] .hero-visual:hover img { filter: drop-shadow(0 18px 22px #213c8a20); }
html[data-theme="light"] .visual-caption {
  background: #ffffffeb;
  border-color: #dce2f3;
  box-shadow: 0 8px 32px #20376312;
}
html[data-theme="light"] .caption-number { color: #6546c4; text-shadow: none; }
html[data-theme="light"] .visual-caption>span:last-child { color: #52607a; }
html[data-theme="light"] .trust-strip { background: #ffffffaa; }
html[data-theme="light"] .trust-inner { color: #53627b; }
html[data-theme="light"] :is(.feature-card, .guide-card, .price-card) {
  background: #ffffff;
  border-color: #dbe2ee;
  box-shadow: 0 3px 5px #21365303, 0 12px 32px #21365305;
}
html[data-theme="light"] .feature-card:hover { border-color: #b5a5df; box-shadow: 0 8px 24px #4a3b8010; }
html[data-theme="light"] .feature-card .feature-icon { background: #e9f5f0; color: #126c58; box-shadow: none; }
html[data-theme="light"] .feature-card h3 { color: #17243b; }
html[data-theme="light"] .feature-card p { color: #53627b; }
html[data-theme="light"] .biometric-card { background: linear-gradient(140deg, #f5fcf9, #ffffff); border-color: #c6e4d8; }
html[data-theme="light"] .code-demo { background: #f4f1fc; border-color: #d7cdec; box-shadow: inset 0 1px #ffffff; }
html[data-theme="light"] .demo-label { color: #686078; }
html[data-theme="light"] .code-demo strong { color: #543599; text-shadow: none; }
html[data-theme="light"] .demo-pill { background: #e9e0f7; color: #634291; border-color: #d9cbed; }
html[data-theme="light"] .small-tag { color: #52607a; }
html[data-theme="light"] .pro-section {
  background: radial-gradient(ellipse at 0% 0%, #e5ddfa80, transparent 58%), linear-gradient(120deg, #f0f3fc, #edf7f7);
  border-color: #dbe2ee;
}
html[data-theme="light"] .pro-label { color: #64557c; }
html[data-theme="light"] .pro-label b { background: #e0d7f9; color: #4b338b; box-shadow: none; }
html[data-theme="light"] .pro-copy .pro-trial-note { color: #58637d; }
html[data-theme="light"] .pro-list article { border-color: #d7deeb; }
html[data-theme="light"] .pro-list article>span { color: #675780; }
html[data-theme="light"] .pro-list p { color: #53627b; }
html[data-theme="light"] .currency-switch { background: #edf1f8; border-color: #dbe2ee; }
html[data-theme="light"] .currency-switch button { color: #58657f; }
html[data-theme="light"] .currency-switch button[aria-pressed="true"] { background: #ffffff; color: #5637a8; box-shadow: 0 1px 5px #21365312; }
html[data-theme="light"] .price-card.featured,
html[data-theme="light"] .price-card.featured:hover { background: linear-gradient(145deg, #f4efff, #ffffff 85%); border-color: #9b82d3; box-shadow: 0 8px 30px #61449b12; }
html[data-theme="light"] .lifetime-card { background: linear-gradient(145deg, #edf8f4, #ffffff 85%); border-color: #abd6c7; }
html[data-theme="light"] .plan-label { color: #675978; }
html[data-theme="light"] .lifetime-card .plan-label { color: #126c58; }
html[data-theme="light"] :is(.price small, .plan-description) { color: #59657e; }
html[data-theme="light"] .price-card ul { border-top-color: #dfe3ed; }
html[data-theme="light"] .price-card li { color: #47556e; }
html[data-theme="light"] .price-card li::before { color: #126c58; }
html[data-theme="light"] .value-tag { background: #6647be; color: #ffffff; box-shadow: 0 3px 8px #5432a81a; }
html[data-theme="light"] .pricing-notes p { color: #61708a; }
html[data-theme="light"] .pricing-notes .launch-note { color: #5e4a79; }
html[data-theme="light"] .start-steps li>span { background: #eee8fb; border-color: #d9cdef; color: #644393; }
html[data-theme="light"] .faq-list summary::after { color: #795ba3; }
html[data-theme="light"] .final-cta { background: linear-gradient(120deg, #ebe6f9, #edf4ff); border-color: #d6ccee; box-shadow: inset 0 1px #ffffff, 0 8px 32px #59409608; }
html[data-theme="light"] .footer p { color: #61708a; }
html[data-theme="light"] .footer-links :is(a, button) { color: #53627b; }
html[data-theme="light"] .footer-links :is(a, button):hover { color: #4f32b9; }

/* The same surfaces carry through language selection and documentation. */
html[data-theme="light"] dialog { background: #ffffff; color: #17243b; border-color: #d3c9e8; }
html[data-theme="light"] dialog::backdrop { background: #2333524a; }
html[data-theme="light"] .dialog-heading { background: #ffffff; }
html[data-theme="light"] .dialog-heading button { background: #f0edf8; border-color: #d9d1e9; color: #5e4a79; }
html[data-theme="light"] #dialog-content :is(p, li, .fine-print) { color: #53627b; }
html[data-theme="light"] .language-dialog { background: linear-gradient(155deg, #ffffff, #f7f9ff); border-color: #d3dced; box-shadow: 0 28px 80px #172d5326, inset 0 1px #ffffff; }
html[data-theme="light"] .language-dialog-icon { color: #6643af; background: #eee8fb; border-color: #dacdef; box-shadow: none; }
html[data-theme="light"] .language-dialog-brand { color: #6c5a81; }
html[data-theme="light"] .language-dialog-close { color: #566078; }
html[data-theme="light"] .language-dialog-close:hover { background: #ece7f6; color: #493b6d; }
html[data-theme="light"] .language-option { background: #ffffff; border-color: #dce3ef; color: #283850; }
html[data-theme="light"] .language-option-code { background: #f0f2f8; color: #56637e; }
html[data-theme="light"] .language-option-check { border-color: #bdc6d8; }
html[data-theme="light"] .language-option:hover { background: #f5f0ff; border-color: #b29ada; color: #473361; }
html[data-theme="light"] .language-option[aria-current="page"] { background: #f0eafb; color: #432d72; border-color: #a08bc8; box-shadow: inset 0 1px #ffffff; }
html[data-theme="light"] .language-option[aria-current="page"] .language-option-code { background: #e4d9f5; color: #614187; }
html[data-theme="light"] .language-option[aria-current="page"] .language-option-check { background: #126c58; border-color: #126c58; color: #ffffff; box-shadow: none; }
html[data-theme="light"] :is(.document-callout, .guide-article .document-callout) { background: #edf7f3; border-color: #c2dfd2; }
html[data-theme="light"] .guide-card-time { color: #675381; }
html[data-theme="light"] .guide-lead { color: #53627b; }
html[data-theme="light"] .guide-toc { border-color: #a8d0c0; }
html[data-theme="light"] :is(.guide-toc a, .guide-sources a) { color: #5938b8; }
html[data-theme="light"] .guide-flow span { background: #f2edfb; color: #533773; border-color: #d9cceb; }
html[data-theme="light"] .guide-comparison article { background: #ffffff; }
html[data-theme="light"] .guide-table-wrap th { background: #ede7f7; color: #543973; }
html[data-theme="light"] .guide-table-wrap td { background: #ffffff; color: #47556e; }
html[data-theme="light"] .guide-cta { background: linear-gradient(130deg, #f0eafb, #f0f7ff); border-color: #c9b8e5; }
html[data-theme="light"] .guide-language-switch a { color: #605073 !important; }
html[data-theme="light"] .guide-language-switch a[aria-current="page"] { background: #e8dff5; color: #523577 !important; }
html[data-theme="light"] .video-tutorials { background: linear-gradient(115deg, #f6f3fc, #ffffff); border-color: #d5c9e7; box-shadow: 0 4px 20px #60448a06; }
html[data-theme="light"] .video-tutorials-icon { background: #eee6f9; border-color: #d5c1ec; color: #694099; box-shadow: inset 0 1px #ffffff; }
html[data-theme="light"] .video-tutorials .video-tutorials-label { color: #71518f; }
html[data-theme="light"] .video-tutorials-label span { color: #6f758a; }
html[data-theme="light"] .video-tutorials .video-tutorials-description { color: #53627b; }
html[data-theme="light"] .video-tutorials-language { color: #126c58; }
html[data-theme="light"] .video-playlist-link { background: #eee5f9; border-color: #c7b3e2; color: #5b367e; }
html[data-theme="light"] .video-playlist-link:hover { background: #e4d7f5; border-color: #b598d6; box-shadow: 0 4px 12px #69419212; }
html[data-theme="light"] .footer-video-link svg { color: #725095; }

@media (max-width: 1050px) {
  .header .nav-wrap>nav { display: none; }
}
@media (max-width: 600px) {
  .nav-actions .nav-download { display: none; }
  .nav-wrap { gap: 12px; }
  .nav-actions { gap: 8px; flex-shrink: 0; }
  .header .brand { min-width: 0; }
  .header .brand-name { min-width: 0; }
  .header .brand-name>small { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
  .theme-toggle, .theme-toggle svg { transition: none; }
}
@media (prefers-contrast: more) {
  html[data-theme="light"] { --muted: #35435c; --line: #8b97aa; }
  html[data-theme="light"] .hero h1 .gradient-text { background: none; color: #462b8c; -webkit-text-fill-color: currentColor; }
  html[data-theme="light"] :is(.primary, .mint, .price-card.featured) { border-color: #54358c; }
  html[data-theme="light"] .brand-name>small { color: #35435c; }
}
@media (forced-colors: active) {
  .theme-toggle { border: 1px solid ButtonText; }
  html[data-theme="light"] .hero h1 .gradient-text { background: none; color: CanvasText; -webkit-text-fill-color: currentColor; }
}

html[data-theme="light"] .companion-link{background:linear-gradient(120deg,#eff6ff,#f4f0fc);border-color:#c4cde0;color:#243c61;box-shadow:0 4px 18px #485b8520}html[data-theme="light"] .companion-link svg{color:#415f91}html[data-theme="light"] .companion-link span:not(:last-child){color:#52607a}html[data-theme="light"] .header nav .pass369-link{color:#324c74}