.usage-heading{display:flex;align-items:center;gap:10px;min-width:0}.usage-heading h2{margin:0;white-space:nowrap}
.usage-guide-trigger{display:inline-flex;align-items:center;gap:5px;flex-shrink:0;min-height:32px;padding:5px 10px;border:1px solid #cbd7bf;border-radius:9px;background:#f0f3e8;color:#6a805f;font:12px/1.5 "Microsoft YaHei",system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.usage-guide-trigger:hover{background:#e3ecd8;color:#466d49}.usage-guide-trigger>span{font-size:15px;line-height:1}
.usage-guide{width:600px;max-width:calc(100% - 48px);max-height:calc(100dvh - 56px);margin:auto;padding:0;border:1px solid #d1dac6;border-radius:23px;background:#fffdf5;color:#35533c;box-shadow:0 24px 90px #203b3140;overflow:hidden;overscroll-behavior:contain}
.usage-guide[open]{display:flex;flex-direction:column}.usage-guide::backdrop{background:#283a2e70;backdrop-filter:blur(2px)}
body:has(.usage-guide[open]){overflow:hidden}
.usage-guide-header{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:20px 26px 0;flex-shrink:0}.usage-guide-header>span{font-size:12px;color:#72866a;letter-spacing:1px}
.usage-guide-close{display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:transparent;color:#71806a;font:26px/1 system-ui,sans-serif;cursor:pointer}.usage-guide-close:hover{background:#edf1e4}
.usage-guide-body{padding:10px 28px 4px;overflow-y:auto;min-height:0;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b6c7a8 #f3f4e9;outline-offset:-3px}
.usage-guide-body h2{margin:0 0 15px;font-size:27px;line-height:1.5;letter-spacing:0;color:#2e4a36}.usage-guide-intro{font-size:14px;line-height:1.9;color:#7a8571;margin:0 0 21px}.usage-guide-intro strong{font-weight:500;color:#5b7353}
.usage-guide-body h3{font-size:15px;margin:0 0 17px;color:#4a6c4b;font-weight:600}
.usage-guide-steps{list-style:none;counter-reset:usage-step;margin:0;padding:0}.usage-guide-steps li{counter-increment:usage-step;display:flex;gap:14px;margin-bottom:20px}.usage-guide-steps li:before{content:counter(usage-step);display:grid;place-items:center;width:30px;height:30px;flex-shrink:0;border-radius:50%;background:#628164;color:#fffdf3;font:600 14px/1 system-ui,sans-serif}.usage-guide-steps h4{font-size:16px;line-height:1.5;margin:1px 0 6px;color:#3d5e40}.usage-guide-steps p{margin:0;font-size:13px;line-height:1.9;color:#7b8572}
.usage-guide-summary{margin:3px 0 4px;padding:13px 16px;border-radius:12px;background:#eaf0df;color:#647c57;font-size:13px;line-height:1.9}.usage-guide-summary strong{font-weight:600;color:#506e48}
.usage-guide-footer{padding:15px 28px 23px;flex-shrink:0;background:#fffdf5}.usage-guide-footer .btn{width:100%;min-height:47px;font-size:14px;border-radius:12px;background:linear-gradient(110deg,#517653,#668761);color:#fffbed}
@media(max-width:760px){
 .usage-heading{gap:7px}.usage-guide-trigger{font-size:10px;min-height:28px;padding:4px 7px}.usage-guide-trigger>span{font-size:13px}
 .usage-guide{width:calc(100% - 16px);max-width:none;max-height:calc(100dvh - 20px);margin:auto 8px 8px;border-radius:24px;padding-top:10px}
 .usage-guide:before{content:'';position:absolute;left:calc(50% - 20px);top:8px;width:40px;height:4px;border-radius:4px;background:#cbd4c2}
 .usage-guide-header{padding:12px 19px 0}.usage-guide-header>span{font-size:11px}.usage-guide-close{width:34px;height:34px}
 .usage-guide-body{padding:10px 20px 3px}.usage-guide-body h2{font-size:21px;line-height:1.5;margin-bottom:13px}.usage-guide-intro{font-size:12px;line-height:1.9;margin-bottom:17px}.usage-guide-body h3{font-size:13px;margin-bottom:14px}
 .usage-guide-steps li{gap:11px;margin-bottom:17px}.usage-guide-steps li:before{width:26px;height:26px;font-size:12px}.usage-guide-steps h4{font-size:14px;margin-top:0;margin-bottom:5px}.usage-guide-steps p{font-size:12px;line-height:1.85}
 .usage-guide-summary{font-size:12px;line-height:1.8;padding:11px 13px}.usage-guide-footer{padding:12px 20px calc(17px + env(safe-area-inset-bottom))}.usage-guide-footer .btn{font-size:13px;min-height:45px}
}
