@import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500&display=swap");

:root{
  --ink:#202128;
  --muted:#716b77;
  --lilac:#b49ae8;
  --accent:#6c4b9e;
  --accent-dark:#523678;
  --accent-soft:#f0eafa;
  --pale:#faf8fd;
  --surface:#fff;
  --border:#e7e1ec;
  --page:#f8f6fb;
  font-family:"Work Sans",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--page);
}
*{box-sizing:border-box;font-weight:400}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at top left,rgba(180,154,232,.17),transparent 34rem),linear-gradient(180deg,#fbfafd,#f7f5fa)}
a{color:inherit}
.help-topbar{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  min-height:68px;padding:.75rem clamp(1rem,4vw,3.2rem);
  border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.9);backdrop-filter:blur(14px)
}
.help-brand{display:flex;align-items:center;gap:.55rem;text-decoration:none;min-width:0}
.help-brand img{width:34px;height:34px}
.help-brand>span{font-size:1.05rem}
.help-brand-divider{width:1px;height:22px;background:var(--border);margin:0 .1rem}
.help-brand-section{color:var(--muted)}
.help-app-link{
  padding:.55rem .75rem;border:1px solid var(--border);border-radius:9px;
  background:var(--surface);color:var(--muted);text-decoration:none;font-size:.82rem
}
.help-app-link:hover{color:var(--accent-dark);border-color:#d8cbea}

.help-shell{width:min(1180px,calc(100% - 2rem));margin:0 auto;padding:2.25rem 0 5rem}
.help-hero{
  padding:2rem clamp(1.2rem,4vw,3rem) 2.25rem;
  border:1px solid var(--border);border-radius:20px;
  background:linear-gradient(135deg,#f2edf9 0%,#fdfcff 100%);
}
.help-kicker{display:block;color:var(--accent-dark);font-size:.7rem;letter-spacing:.13em;margin-bottom:.65rem}
.help-hero h1{margin:0;font-size:clamp(2rem,5vw,3.3rem);letter-spacing:-.045em;line-height:1.05}
.help-hero>p{max-width:680px;margin:.8rem 0 1.5rem;color:var(--muted);line-height:1.65}
.help-search{
  display:flex;align-items:center;gap:.65rem;max-width:760px;
  min-height:54px;padding:0 .95rem;border:1px solid #dcd3e7;border-radius:14px;
  background:rgba(255,255,255,.95);box-shadow:0 10px 30px rgba(65,43,91,.06)
}
.help-search:focus-within{border-color:var(--lilac);box-shadow:0 0 0 3px rgba(180,154,232,.18)}
.help-search-icon{color:var(--accent);font-size:1.25rem}
.help-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font:inherit;font-size:1rem}
.help-search input::placeholder{color:#9a929e}
.help-search kbd{padding:.18rem .42rem;border:1px solid var(--border);border-radius:6px;background:var(--pale);color:var(--muted);font-family:inherit;font-size:.72rem}
.help-search-status{min-height:1.2em;margin:.55rem 0 0!important;font-size:.78rem}

.help-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:1.3rem;margin-top:1.3rem}
.help-sidebar{align-self:start;position:sticky;top:84px}
.help-sidebar nav{
  display:grid;gap:.22rem;padding:.7rem;border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.83)
}
.help-sidebar a{padding:.68rem .72rem;border-radius:9px;color:var(--muted);text-decoration:none;font-size:.82rem}
.help-sidebar a:hover,.help-sidebar a.is-active{background:var(--accent-soft);color:var(--accent-dark)}

.help-content{min-width:0;display:grid;gap:1rem}
.help-category{
  scroll-margin-top:92px;padding:1.25rem;border:1px solid var(--border);border-radius:18px;background:rgba(255,255,255,.88)
}
.help-category.is-hidden{display:none}
.help-category-heading{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:.9rem}
.help-category-icon{
  display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:9px;
  background:var(--accent-soft);color:var(--accent-dark)
}
.help-category-heading h2{margin:.1rem 0 .2rem;font-size:1.2rem;letter-spacing:-.02em}
.help-category-heading p{margin:0;color:var(--muted);font-size:.84rem;line-height:1.5}

.help-article{
  scroll-margin-top:92px;padding:1rem 0;border-top:1px solid var(--border)
}
.help-category-heading+.help-article{border-top:0;padding-top:.2rem}
.help-article.is-hidden{display:none}
.help-article.is-match{margin:.35rem -.55rem;padding:1rem .55rem;border-radius:10px;background:#faf8fd}
.help-article h3{margin:0 0 .45rem;font-size:1rem;letter-spacing:-.01em}
.help-article p,.help-article li{color:var(--muted);font-size:.88rem;line-height:1.65}
.help-article p{margin:.35rem 0}
.help-article ol{margin:.45rem 0;padding-left:1.35rem}
.help-article em{font-style:normal;color:var(--accent-dark)}
.help-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin:.8rem 0}
.help-plan-grid>span{display:grid;gap:.22rem;padding:.8rem;border:1px solid var(--border);border-radius:12px;background:var(--pale)}
.help-plan-grid small{color:var(--muted);font-size:.76rem}

.help-contact{
  padding:1.15rem 1.25rem;border:1px solid #ded3eb;border-radius:16px;background:var(--accent-soft)
}
.help-contact span{color:var(--accent-dark);font-size:.95rem}
.help-contact p{margin:.35rem 0 0;color:var(--muted);font-size:.84rem;line-height:1.55}

.help-empty{
  padding:2rem;text-align:center;border:1px dashed var(--border);border-radius:16px;background:rgba(255,255,255,.7);color:var(--muted)
}

@media(max-width:860px){
  .help-layout{grid-template-columns:1fr}
  .help-sidebar{position:static;overflow-x:auto}
  .help-sidebar nav{display:flex;min-width:max-content;padding:.5rem}
  .help-sidebar a{white-space:nowrap}
}
@media(max-width:620px){
  .help-shell{width:min(100% - 1rem,1180px);padding-top:1rem}
  .help-topbar{padding:.6rem .75rem}
  .help-brand-section,.help-brand-divider{display:none}
  .help-hero{padding:1.4rem 1rem 1.5rem}
  .help-search kbd{display:none}
  .help-category{padding:1rem}
  .help-plan-grid{grid-template-columns:1fr}
}

.help-question-form{display:grid;gap:.85rem;margin-top:1rem}
.help-question-form label{display:grid;gap:.38rem;color:var(--ink);font-size:.8rem}
.help-question-form label small{color:var(--muted);font-size:.72rem}
.help-question-form textarea,
.help-question-form input{
  width:100%;min-height:44px;padding:.72rem .78rem;border:1px solid #dcd3e7;border-radius:10px;
  background:rgba(255,255,255,.94);color:var(--ink);font:inherit;outline:0
}
.help-question-form textarea{min-height:110px;resize:vertical}
.help-question-form textarea:focus,
.help-question-form input:focus{border-color:var(--lilac);box-shadow:0 0 0 3px rgba(180,154,232,.16)}
.help-question-actions{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.help-question-actions button{
  min-height:40px;padding:.6rem .9rem;border:0;border-radius:9px;background:#6c4b9e;color:#fff;font:inherit;cursor:pointer
}
.help-question-actions button:disabled{opacity:.55;cursor:wait}
#helpQuestionStatus{color:var(--muted);font-size:.78rem;line-height:1.4}