.help-page { max-width:820px; margin:0 auto; padding:30px 32px 40px; }
.help-intro { text-align:center; margin-bottom:29px; }
.help-kicker { display:inline-flex; align-items:center; gap:7px; color:var(--accent); font-size:12px; font-weight:550; }
.help-page h1 { font:650 36px/1.4 var(--font); letter-spacing:-1.2px; margin:12px 0 10px; }
.help-intro p { color:var(--muted); font-size:13px; line-height:1.8; margin:0; }
.help-shortcuts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:29px; }
.help-shortcut { display:flex; align-items:center; gap:14px; padding:21px 22px; border:1px solid var(--line); border-radius:18px; background:var(--paper); box-shadow:0 2px 8px #00000002; transition:transform 240ms var(--ease),box-shadow 240ms var(--ease),border-color 240ms ease; }
.help-shortcut-icon { display:grid; place-items:center; flex-shrink:0; width:43px; height:43px; border-radius:13px; color:var(--accent); background:var(--accent-soft); }
.help-shortcut-copy { display:grid; gap:6px; min-width:0; }
.help-shortcut-copy strong { font-size:15px; font-weight:600; }
.help-shortcut-copy small { color:var(--muted); font-size:11px; line-height:1.5; }
.help-shortcut-arrow { margin-left:auto; color:var(--muted); transition:transform 240ms var(--ease),color 240ms ease; }
.help-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 4px 13px; }
.help-section-heading h2 { font-size:17px; font-weight:600; margin:0; letter-spacing:-.3px; }
.help-section-heading>span { color:var(--muted); font-size:11px; }
.help-faq-list { border:1px solid var(--line); border-radius:20px; background:var(--paper); box-shadow:0 4px 24px #00000003; }
.help-page .help-faq { margin:0 24px; padding:0; border:0; }
.help-page .help-faq+.help-faq { border-top:1px solid var(--line); }
.help-page .help-faq summary { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:63px; padding:18px 0; list-style:none; cursor:pointer; font-size:14px; font-weight:550; line-height:1.6; border-radius:8px; }
.help-faq summary::-webkit-details-marker { display:none; }
.help-faq summary::marker { content:''; }
.help-faq summary>span:first-child { transition:color 180ms ease; }
.help-faq-toggle { display:grid; place-items:center; width:25px; height:25px; flex-shrink:0; color:var(--muted); transition:color 200ms ease; }
.help-faq-toggle svg { stroke-width:1.7; transform:rotate(0); transition:transform 220ms var(--ease); }
.help-faq[open] .help-faq-toggle { color:var(--accent); }
.help-faq[open] .help-faq-toggle svg { transform:rotate(90deg); }
.help-page .help-answer { padding:0 45px 22px 0; }
.help-page .help-answer p { font-size:12px; line-height:1.95; color:var(--muted); margin:0; }
.help-faq[open] .help-answer { animation:help-answer-in 240ms var(--ease); }
.help-flow { display:flex; flex-wrap:wrap; gap:10px 22px; list-style:none; padding:0; margin:15px 0 0; }
.help-flow li { display:flex; align-items:center; gap:7px; font-size:11px; color:var(--muted); }
.help-flow li>span { display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:var(--soft); color:var(--ink); font-size:10px; font-variant-numeric:tabular-nums; }
.help-contact { display:flex; align-items:center; justify-content:center; gap:11px; padding:24px 4px 0; color:var(--muted); }
.help-contact>svg { width:17px; height:17px; }
.help-contact p { display:flex; flex-wrap:wrap; gap:5px 8px; font-size:11px; line-height:1.8; margin:0; }
.help-contact strong { font-weight:500; color:var(--ink); }
@keyframes help-answer-in { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
@media(hover:hover) {
  .help-shortcut:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--accent) 24%,var(--line)); box-shadow:0 6px 22px #00000006; }
  .help-shortcut:hover .help-shortcut-arrow { color:var(--accent); transform:translateX(3px); }
  .help-faq summary:hover>span:first-child { color:var(--accent); }
}
@media(max-width:620px) {
  .help-page { padding:26px 20px 32px; }
  .help-page h1 { font-size:29px; letter-spacing:-.9px; margin:11px 0 10px; }
  .help-intro { margin-bottom:24px; }
  .help-intro p { max-width:265px; margin:auto; font-size:12px; line-height:1.85; }
  .help-shortcuts { gap:10px; margin-bottom:25px; }
  .help-shortcut { position:relative; display:block; padding:17px 15px; border-radius:16px; }
  .help-shortcut-icon { width:35px; height:35px; border-radius:10px; margin-bottom:13px; }
  .help-shortcut-icon svg { width:19px; height:19px; }
  .help-shortcut-copy strong { font-size:13px; }
  .help-shortcut-copy small { font-size:10px; }
  .help-shortcut-arrow { position:absolute; top:24px; right:16px; }
  .help-shortcut-arrow svg { width:15px; height:15px; }
  .help-section-heading h2 { font-size:16px; }
  .help-section-heading>span { font-size:10px; }
  .help-faq-list { border-radius:18px; }
  .help-page .help-faq { margin:0 18px; }
  .help-page .help-faq summary { gap:12px; min-height:62px; font-size:12px; padding:17px 0; }
  .help-faq-toggle { width:23px; height:23px; }
  .help-page .help-answer { padding:0 0 20px; }
  .help-page .help-answer p { font-size:11px; }
  .help-flow { gap:8px 12px; margin-top:13px; }
  .help-flow li { font-size:10px; gap:5px; }
  .help-flow li>span { width:17px; height:17px; font-size:9px; }
  .help-contact { align-items:flex-start; gap:9px; padding-top:22px; }
  .help-contact>svg { margin-top:2px; }
  .help-contact p { display:grid; gap:3px; font-size:10px; }
}
@media(prefers-reduced-motion:reduce) {
  .help-shortcut,.help-shortcut-arrow,.help-faq-toggle,.help-faq-toggle svg,.help-faq summary>span:first-child { transition:none; }
  .help-shortcut:hover,.help-shortcut:hover .help-shortcut-arrow { transform:none; }
  .help-faq[open] .help-answer { animation:none; }
}

.help-shortcut { color:var(--ink); text-decoration:none; }