:root{
  --cm-bg-light:#f9f9f9;
  --cm-text-light:#1d1d1f;
  --cm-text-secondary-light:#58585f;
  --cm-border-light:#e5e5e7;
  --cm-primary-light:#0071e3;
  --cm-primary-hover-light:#0077ed;
  --cm-card-bg-light:#ffffff;
  --cm-card-bg-blur-light:rgba(255,255,255,.55);

  --cm-bg-dark:#050505;
  --cm-text-dark:#f5f5f7;
  --cm-text-secondary-dark:#a1a1a6;
  --cm-border-dark:#2a2a2c;
  --cm-primary-dark:#0a84ff;
  --cm-primary-hover-dark:#2091ff;
  --cm-card-bg-dark:#121212;
  --cm-card-bg-blur-dark:rgba(25,25,25,.55);

  --cm-font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --cm-radius:16px;
  --cm-radius-sm:12px;
  --cm-max:1100px;
  --cm-shadow:0 10px 30px rgba(0,0,0,.08);
  --cm-shadow-dark:0 20px 50px rgba(0,0,0,.35);
}

body{font-family:var(--cm-font);margin:0;background:var(--bg-color);color:var(--text-color);transition:background-color .35s ease,color .35s ease;padding-bottom:90px}
body.light-mode{
  --bg-color:var(--cm-bg-light);
  --text-color:var(--cm-text-light);
  --text-secondary-color:var(--cm-text-secondary-light);
  --border-color:var(--cm-border-light);
  --primary-color:var(--cm-primary-light);
  --primary-hover:var(--cm-primary-hover-light);
  --card-bg-color:var(--cm-card-bg-light);
  --card-bg-color-blurry:var(--cm-card-bg-blur-light);
  --aurora-opacity:.28;
}
body.dark-mode{
  --bg-color:var(--cm-bg-dark);
  --text-color:var(--cm-text-dark);
  --text-secondary-color:var(--cm-text-secondary-dark);
  --border-color:var(--cm-border-dark);
  --primary-color:var(--cm-primary-dark);
  --primary-hover:var(--cm-primary-hover-dark);
  --card-bg-color:var(--cm-card-bg-dark);
  --card-bg-color-blurry:var(--cm-card-bg-blur-dark);
  --aurora-opacity:.58;
}

.aurora-bg{position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 20% 25%,hsla(215,80%,60%,.15) 0,transparent 50%),radial-gradient(ellipse at 80% 30%,hsla(280,70%,60%,.15) 0,transparent 50%),radial-gradient(ellipse at 50% 85%,hsla(320,70%,60%,.15) 0,transparent 50%);animation:cm-aurora 35s ease-in-out infinite;opacity:var(--aurora-opacity);transition:opacity 1s ease}
@keyframes cm-aurora{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.5) rotate(10deg)}}

/* Header */
.main-header{position:fixed;top:1rem;left:50%;transform:translateX(-50%);width:100%;max-width:calc(var(--cm-max) + 2.5rem);padding:0 1.25rem;z-index:100}
.main-header .header-container{display:flex;justify-content:space-between;align-items:center;padding:.55rem .7rem;border:1px solid var(--border-color);border-radius:999px;background:var(--card-bg-color-blurry);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 10px 30px rgba(0,0,0,.08)}
body.dark-mode .main-header .header-container{box-shadow:0 20px 50px rgba(0,0,0,.35)}
.header-logo{display:flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--text-color);font-weight:800}
.header-logo img{height:28px;width:auto}
.header-nav{display:flex;align-items:center;gap:.45rem}
.btn-icon{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:1px solid transparent;color:var(--text-color);padding:8px;border-radius:999px;cursor:pointer}
.btn-icon:hover{background:rgba(255,255,255,.04);border-color:var(--border-color)}
.btn-google{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .8rem;border:1px solid var(--border-color);border-radius:999px;text-decoration:none;color:var(--text-color);font-weight:700}
.btn-google:hover{border-color:rgba(10,132,255,.55)}
.nav-dropdown{position:relative}
.nav-menu{display:none;position:absolute;top:120%;right:0;background:var(--card-bg-color);border:1px solid var(--border-color);border-radius:var(--cm-radius);padding:.8rem;min-width:260px;box-shadow:0 20px 60px rgba(0,0,0,.15)}
.nav-menu a{display:block;padding:.55rem .6rem;border-radius:12px;color:var(--text-color);text-decoration:none}
.nav-menu a:hover{background:rgba(10,132,255,.10)}

main{overflow-x:hidden}
.cm-section{padding:92px 1.25rem 70px;max-width:var(--cm-max);margin:0 auto}
.cm-hero{padding:110px 1.25rem 34px;max-width:var(--cm-max);margin:0 auto}
.cm-hero h1{font-size:clamp(2.1rem,4vw,3rem);line-height:1.1;margin:0 0 .75rem;font-weight:800;letter-spacing:-.02em}
.cm-hero p{max-width:70ch;margin:0;color:var(--text-secondary-color);font-size:1.1rem;line-height:1.65}

.cm-breadcrumbs{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;color:var(--text-secondary-color);font-size:.92rem;margin:18px 0 0}
.cm-breadcrumbs a{color:inherit;text-decoration:none}
.cm-breadcrumbs a:hover{color:var(--text-color);text-decoration:underline}
.cm-breadcrumbs .sep{opacity:.7}

.cm-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:1.25rem;align-items:start}
@media (max-width: 980px){.cm-grid{grid-template-columns:1fr}}

.cm-card{background:var(--card-bg-color);border:1px solid var(--border-color);border-radius:var(--cm-radius);box-shadow:var(--cm-shadow);padding:1.1rem}
body.dark-mode .cm-card{box-shadow:var(--cm-shadow-dark)}
.cm-card h2{margin:.2rem 0 .65rem;font-size:1.25rem;letter-spacing:-.01em}
.cm-card p{margin:.35rem 0;color:var(--text-secondary-color);line-height:1.65}

.cm-form{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin-top:.6rem}
@media (max-width: 780px){.cm-form{grid-template-columns:1fr}}
.cm-field label{display:block;font-weight:600;margin:0 0 .35rem;color:var(--text-color);font-size:.95rem}
.cm-field input,.cm-field select,.cm-field textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid var(--border-color);
  background:transparent;
  color:var(--text-color);
  border-radius:12px;
  padding:.75rem .8rem;
  font-size:1rem;
  outline:none;
}
.cm-field textarea{min-height:110px;resize:vertical}
.cm-field input:focus,.cm-field select:focus,.cm-field textarea:focus{border-color:rgba(10,132,255,.65);box-shadow:0 0 0 3px rgba(10,132,255,.15)}

.cm-inline{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.35rem}
.cm-chip{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.55rem .7rem;border:1px solid var(--border-color);
  border-radius:999px;background:transparent;color:var(--text-color);
  cursor:pointer;user-select:none;font-size:.95rem;
}
.cm-chip input{accent-color:var(--primary-color)}
.cm-chip:hover{border-color:rgba(10,132,255,.55)}

.cm-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1rem}
.cm-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  border-radius:999px;border:1px solid var(--border-color);
  padding:.8rem 1.05rem;text-decoration:none;font-weight:700;
  cursor:pointer;background:transparent;color:var(--text-color);
}
.cm-btn.primary{background:var(--primary-color);border-color:transparent;color:#fff}
.cm-btn.primary:hover{background:var(--primary-hover)}
.cm-btn:hover{border-color:rgba(10,132,255,.55)}

.cm-result{margin-top:1rem;padding:.9rem;border-radius:14px;border:1px solid var(--border-color);background:linear-gradient(180deg,rgba(10,132,255,.08),transparent)}
.cm-result h3{margin:0 0 .5rem;font-size:1.08rem}
.cm-kv{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
@media (max-width: 780px){.cm-kv{grid-template-columns:1fr}}
.cm-kv .item{border:1px solid var(--border-color);border-radius:12px;padding:.75rem;background:rgba(255,255,255,.02)}
.cm-kv .k{font-size:.85rem;color:var(--text-secondary-color);margin-bottom:.25rem}
.cm-kv .v{font-size:1.02rem;font-weight:700}

.cm-cta{position:sticky;top:92px}
@media (max-width: 980px){.cm-cta{position:static}}
.cm-cta .cm-card{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background:var(--card-bg-color-blurry)}
.cm-cta .cm-card h3{margin:.2rem 0 .6rem;font-size:1.1rem}
.cm-cta .cm-card .cm-btn{width:100%}
.cm-cta .cm-card .cm-btn + .cm-btn{margin-top:.6rem}
.cm-cta small{display:block;color:var(--text-secondary-color);line-height:1.45;margin-top:.7rem}

.cm-faq{margin-top:1.25rem}
.cm-faq details{border:1px solid var(--border-color);border-radius:14px;padding:.75rem .85rem;background:rgba(255,255,255,.02)}
.cm-faq details+details{margin-top:.75rem}
.cm-faq summary{cursor:pointer;font-weight:700;list-style:none}
.cm-faq summary::-webkit-details-marker{display:none}
.cm-faq details p{margin:.65rem 0 0;color:var(--text-secondary-color)}

.cm-sticky{position:fixed;left:0;right:0;bottom:0;z-index:1000;background:var(--card-bg-color);border-top:1px solid var(--border-color);padding:1rem 1.25rem;display:flex;gap:1rem;align-items:center;justify-content:space-between;box-shadow:0 -8px 30px rgba(0,0,0,.14);flex-wrap:wrap}
body.dark-mode .cm-sticky{box-shadow:0 -8px 50px rgba(0,0,0,.45)}
.cm-sticky .txt{min-width:220px}
.cm-sticky .txt .t{font-weight:800;margin:0 0 .15rem}
.cm-sticky .txt .s{margin:0;color:var(--text-secondary-color);font-size:.92rem}
.cm-sticky .cm-btn{white-space:nowrap}
@media (max-width: 780px){
  body{padding-bottom:140px}
  .cm-sticky{flex-direction:column;align-items:stretch}
  .cm-sticky .cm-btn{width:100%}
}

/* E-E-A-T SEO: lead intro and sources */
.cm-lead{max-width:68ch;margin:0 0 1.25rem;color:var(--text-secondary-color);font-size:1.05rem;line-height:1.7}
.cm-sources{margin-top:2rem;padding:1rem 1.1rem;border-radius:var(--cm-radius-sm);border:1px solid var(--border-color);background:rgba(255,255,255,.02);font-size:.9rem;color:var(--text-secondary-color)}
.cm-sources h3{margin:0 0 .6rem;font-size:1rem;color:var(--text-color)}
.cm-sources ul{margin:0;padding-left:1.2rem;line-height:1.65}
.cm-sources a{color:var(--primary-color);text-decoration:none}
.cm-sources a:hover{text-decoration:underline}
.cm-sources .disclaimer{margin-top:.75rem;font-size:.85rem;opacity:.9}