.usage-guide-backdrop{z-index:1500}
.usage-guide{width:600px;max-width:100%;max-height:calc(100dvh - 48px);display:flex;flex-direction:column;background:white;border-radius:18px;overflow:hidden;box-shadow:0 25px 80px #18352e2b}
.usage-guide-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:24px 28px;border-bottom:1px solid var(--line);flex-shrink:0;background:white}
.usage-guide-header h2{display:flex;align-items:center;gap:9px;font-size:21px;margin:7px 0 0;color:var(--ink)}
.usage-guide-header h2 svg{color:var(--teal)}
.usage-guide-header .icon-btn{flex-shrink:0;background:var(--accent-soft);color:var(--teal);border-radius:50%;width:34px;height:34px}
.usage-guide-body{min-height:0;overflow:auto;overscroll-behavior:contain;padding:24px 28px;color:var(--text);font-size:12px;line-height:1.95}
.usage-guide-body h3{font-size:14px;color:var(--ink);font-weight:600;margin:0 0 12px}
.usage-guide-intro{display:flex;align-items:flex-start;gap:13px;margin-bottom:25px;background:var(--accent-soft);padding:19px;border-radius:11px}
.usage-guide-intro .mini-icon{color:var(--teal);flex-shrink:0;margin-top:2px}
.usage-guide-intro h3{margin-bottom:7px;font-size:15px;line-height:1.8}
.usage-guide-intro p{font-size:12px;line-height:1.95}
.usage-guide-body>section{margin-top:24px}
.usage-guide-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.usage-guide-benefits span{display:flex;align-items:center;justify-content:center;gap:6px;background:#fafbfa;border:1px solid var(--line);border-radius:7px;padding:12px 5px;font-size:11px;white-space:nowrap}
.usage-guide-benefits svg{color:var(--teal)}
.usage-guide-steps{padding:0;margin:0;list-style:none;display:flex;flex-direction:column;gap:20px}
.usage-guide-steps li{display:flex;gap:13px;align-items:flex-start}
.usage-guide-steps b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--accent-soft);color:var(--teal);font-size:11px;flex-shrink:0;margin-top:2px}
.usage-guide-steps strong{font-weight:500;color:var(--ink);font-size:13px;display:block;margin-bottom:5px}
.usage-guide-save{display:flex;gap:13px;border-top:1px solid var(--line);padding-top:22px}
.usage-guide-save>svg{color:var(--teal);margin-top:4px;flex-shrink:0}
.usage-guide-save h3{margin-bottom:5px}
.usage-guide-note{font-size:10px;color:var(--muted);margin-top:22px;padding-top:18px;border-top:1px solid var(--line);line-height:1.9}
.usage-guide-footer{border-top:1px solid var(--line);padding:16px 28px;display:flex;justify-content:flex-end;flex-shrink:0;background:white}
.usage-guide-footer .btn{min-width:120px;min-height:42px;font-size:12px}
@media(max-width:780px){.usage-guide-backdrop{padding:16px}.usage-guide{max-height:calc(100dvh - 32px);border-radius:15px}.usage-guide-header{padding:20px}.usage-guide-header h2{font-size:19px}.usage-guide-body{padding:20px;font-size:11px}.usage-guide-intro{padding:15px;gap:9px}.usage-guide-intro h3{font-size:14px}.usage-guide-intro p{font-size:11px}.usage-guide-benefits{grid-template-columns:1fr;gap:7px}.usage-guide-benefits span{justify-content:flex-start;gap:10px;padding:9px 12px;font-size:11px}.usage-guide-body h3{font-size:13px}.usage-guide-steps strong{font-size:12px}.usage-guide-steps{gap:18px}.usage-guide-footer{padding:14px 20px calc(14px + env(safe-area-inset-bottom))}.usage-guide-footer .btn{width:100%}}