html,body{
  overflow:auto;height:auto;-webkit-text-size-adjust:100%;
  text-size-adjust:100%
}
.help-page{
  min-height:100%;background:linear-gradient(180deg,#06040f 0%,#0a0520 100%);
  padding:calc(12px + var(--safe-top)) 12px calc(20px + var(--safe-bottom))
}
.help-wrap{max-width:640px;margin:0 auto}
.help-top{margin-bottom:22px}
.help-top h1{font-size:22px;font-weight:800;line-height:1.2;letter-spacing:-.02em}
.help-top p{margin-top:5px;font-size:13px;color:var(--dim);line-height:1.45}
.help-section{margin-bottom:22px}
.help-section-title{
  font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;
  color:var(--neon-purple);margin-bottom:10px;text-shadow:0 0 8px rgba(191,0,255,.35)
}
.help-list{display:flex;flex-direction:column;gap:8px}
.help-item{
  display:flex;align-items:flex-start;gap:12px;padding:12px;
  border-radius:16px;background:rgba(12,8,28,.72);border:1px solid rgba(180,120,255,.12)
}
.help-demo{
  flex-shrink:0;display:flex;align-items:center;justify-content:flex-start;
  flex-wrap:wrap;gap:6px;min-width:0
}
.help-demo .chip{margin-left:0}
.help-demo--wide{width:100%}
.help-demo--grid{
  display:grid;grid-template-columns:1fr 1fr;gap:6px;width:100%
}
.help-demo--row{flex-direction:column;gap:6px;align-items:flex-start}
.help-text{min-width:0;flex:1;padding-top:1px}
.help-text h3{font-size:15px;font-weight:800;line-height:1.3;margin-bottom:5px}
.help-text p{font-size:13px;color:var(--dim2);line-height:1.5}
.help-text p + p{margin-top:10px}
.help-inline-link{color:var(--neon-cyan);text-decoration:none;font-weight:700}
.help-inline-link:hover{text-decoration:underline}
.help-item--block{flex-direction:column;gap:10px}
.help-item--block .help-demo{width:100%;justify-content:flex-start}
.help-search-demo{position:relative;width:100%;max-width:100%}
.help-search-demo input{
  width:100%;padding:12px 44px 12px 40px;border-radius:var(--radius);
  border:1px solid rgba(0,240,255,.18);background:rgba(8,4,20,.65);color:var(--text);font-size:15px
}
.help-search-demo .search-icon{left:12px}
.help-station-card{width:100%;max-width:100%;pointer-events:none}
.help-zoom-demo{
  border:1px solid rgba(0,240,255,.25);border-radius:16px;overflow:hidden;
  box-shadow:var(--glow-cyan);background:rgba(10,6,24,.92)
}
.help-zoom-demo span{
  display:block;width:42px;height:42px;line-height:42px;text-align:center;
  background:rgba(10,6,24,.92);color:var(--neon-cyan);font-weight:700;
  border-bottom:1px solid rgba(0,240,255,.15);user-select:none
}
.help-zoom-demo span:last-child{border-bottom:none}
.help-share-row{display:flex;flex-wrap:wrap;gap:8px}
.help-history-demo{
  width:100%;padding-top:4px;border-top:1px solid rgba(180,120,255,.12)
}
.help-history-demo .history-toggle{width:100%;padding:10px 0}
.help-history-demo .history-toggle[aria-expanded="true"] .history-toggle-chevron{transform:rotate(180deg)}
.help-history-demo .history-list{margin-top:2px}
.help-note{
  margin-top:18px;padding:12px 14px;border-radius:14px;
  background:rgba(0,240,255,.06);border:1px solid rgba(0,240,255,.18);
  font-size:13px;color:var(--dim2);line-height:1.5
}

body.light-theme .help-page{background:linear-gradient(180deg,#eef2f8 0%,#e6ecf5 100%)}
body.light-theme .help-item{background:#fff;border-color:var(--border)}
body.light-theme .help-note{background:rgba(14,116,144,.08);border-color:rgba(14,116,144,.2)}
body.light-theme .help-zoom-demo{border-color:var(--border);box-shadow:var(--shadow)}
body.light-theme .help-zoom-demo span{background:#fff;color:var(--accent-cyan);border-bottom-color:var(--border)}
body.light-theme .help-history-demo{border-top-color:var(--border)}

@media (max-width:519px){
  .help-item{flex-direction:column;gap:10px}
  .help-demo{width:100%}
  .help-text{padding-top:0}
  .help-item--block .help-text + .help-demo,
  .help-item--block .help-text + .help-history-demo{margin-top:2px}
  .status-btn{min-height:44px}
}

@media (min-width:520px){
  .help-page{padding-left:20px;padding-right:20px}
  .help-top h1{font-size:24px}
  .help-item{gap:14px;padding:14px;border-radius:18px}
  .help-demo{min-width:88px;max-width:140px;justify-content:center}
  .help-item--block .help-demo{max-width:none}
  .help-demo--grid{min-width:170px;max-width:170px}
  .help-search-demo{max-width:280px}
  .help-station-card{max-width:320px}
  .help-item:not(.help-item--block){flex-direction:row;align-items:flex-start}
  .help-item--block .help-demo{width:100%;justify-content:flex-start}
}
