.help-inline { display: inline-flex; vertical-align: middle; margin-left: 7px; }
.help-button { display: inline-grid; place-items: center; width: 21px; height: 21px; padding: 0; border: 1px solid #c4d2e4; border-radius: 50%; background: transparent; color: #8293ac; font: 500 12px/1 system-ui, sans-serif; cursor: help; flex-shrink: 0; }
.help-button:hover, .help-button[aria-expanded="true"] { background: #edf4ff; color: #146fe8; border-color: #9bbdeb; }
.help-button:focus-visible { outline: 2px solid #146fe8; outline-offset: 3px; }
.help-popover { position: fixed; z-index: 1600; display: block; width: 320px; max-width: calc(100vw - 32px); max-height: calc(100vh - 32px); overflow-y: auto; box-sizing: border-box; padding: 16px 18px; border: 1px solid #d9e3ef; border-radius: 10px; background: #fff; box-shadow: 0 12px 38px #173a6826; color: #536985; font: 400 13px/1.85 system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; text-align: left; letter-spacing: normal; }
.help-popover[hidden] { display: none; }
.platform .help-button { color: #c0d4f0; border-color: #6985aa; }
.platform .help-button:hover, .platform .help-button[aria-expanded="true"] { color: #146fe8; background: #fff; }
.demo-info { margin-top: 20px; font-size: 11px; color: #718399; }
@media (max-width: 760px) { .help-button { width: 24px; height: 24px; } .help-inline { margin-left: 5px; } }
@media print { .help-inline, .help-popover { display: none; } }