:root { color-scheme: light; }* { box-sizing: border-box; }html { scroll-behavior: smooth; }body { margin: 0; background: #f7f9fd; color: #18243a; font: 15px/1.65 Inter, Arial, sans-serif; }a { color: #215ce5; }.help-header { position: sticky; z-index: 10; top: 0; display: flex; align-items: center; gap: 24px; padding: 15px 24px; border-bottom: 1px solid #dce5f0; background: rgb(255 255 255 / 94%); backdrop-filter: blur(10px); }.help-brand { color: #1b3766; font-weight: 800; letter-spacing: .13em; text-decoration: none; }.help-header nav { display: flex; flex-wrap: wrap; gap: 18px; }.help-header nav a { color: #50657f; text-decoration: none; }.help-header nav a:hover { color: #215ce5; }.help-layout { display: grid; width: min(1240px, calc(100% - 32px)); grid-template-columns: 260px minmax(0, 1fr); gap: 32px; margin: 32px auto 70px; }.toc { position: sticky; top: 86px; align-self: start; padding: 18px; border: 1px solid #dce5f0; border-radius: 14px; background: #fff; box-shadow: 0 6px 18px rgb(31 60 104 / 5%); }.toc strong { display: block; margin-bottom: 10px; }.toc a { display: block; padding: 5px 0; color: #5f728a; text-decoration: none; }.toc a:hover { color: #215ce5; }.content { min-width: 0; }.hero { margin-bottom: 24px; padding: 34px; border: 1px solid #cddcf1; border-radius: 18px; background: linear-gradient(135deg, #e9f1ff, #f7fbff); }.hero h1 { margin: 0 0 8px; color: #182d52; font-size: clamp(28px, 4vw, 46px); line-height: 1.15; }.hero p { max-width: 760px; margin: 0; color: #50657f; font-size: 17px; }.status-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 22px; }.status { padding: 12px; border: 1px solid #d9e4f2; border-radius: 10px; background: #fff; }.status b { display: block; }.ok { color: #167b4c; }.wait { color: #9d6500; }section { margin-bottom: 18px; padding: 26px 30px; scroll-margin-top: 90px; border: 1px solid #dce5f0; border-radius: 14px; background: #fff; box-shadow: 0 6px 18px rgb(31 60 104 / 4%); }h2 { margin: 0 0 12px; color: #203657; font-size: 25px; }h3 { margin: 22px 0 8px; color: #294363; font-size: 18px; }p, li { color: #536780; }li + li { margin-top: 6px; }code { padding: 2px 6px; border-radius: 5px; background: #edf2f8; color: #3b5575; }.note, .warning, .success { margin: 14px 0; padding: 14px 16px; border-left: 4px solid #4f83dc; border-radius: 9px; background: #edf4ff; }.warning { border-color: #dba32b; background: #fff7df; }.success { border-color: #31a76b; background: #eaf8ef; }.steps { padding: 0; list-style: none; counter-reset: step; }.steps > li { position: relative; padding: 0 0 15px 42px; }.steps > li::before { position: absolute; top: 0; left: 0; display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: #215ce5; color: #fff; content: counter(step); counter-increment: step; font-weight: 800; }.faq details { padding: 13px 0; border-top: 1px solid #dce5f0; }.faq summary { cursor: pointer; color: #2c425f; font-weight: 700; }.faq details p { margin-bottom: 0; }@media (max-width: 900px) { .help-layout { grid-template-columns: 1fr; }.toc { position: static; }.status-grid { grid-template-columns: repeat(2, 1fr); } }@media (max-width: 560px) { .help-header { align-items: flex-start; flex-direction: column; gap: 8px; }.help-layout { width: min(100% - 20px, 1240px); margin-top: 16px; }section, .hero { padding: 20px; }.status-grid { grid-template-columns: 1fr; } }
