/* Readable, skippable guidance, using the same dark workspace surfaces. */
.bg-entry{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:16px 0;border-top:1px solid var(--bw-line,var(--line));color:var(--bw-muted,var(--muted));font-size:14px;line-height:1.5}
.bg-entry button{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:44px;max-width:100%;padding:10px 14px;border:1px solid var(--bw-line,var(--line));border-radius:8px;background:transparent;color:var(--text,#F5F4F8);font:inherit;white-space:normal;text-align:left}
.bg-backdrop{padding:24px;overflow:auto;align-items:safe center}
.bg-dialog{width:min(680px,100%);max-height:calc(100dvh - 48px);display:flex;flex-direction:column;padding:0;overflow:auto;border:1px solid var(--line,#2F2B39);border-radius:16px;background:var(--panel,#17141D);color:var(--text,#F5F4F8);font-family:Arial,Helvetica,sans-serif;text-transform:none;letter-spacing:normal}
.bg-top,.bg-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 24px;flex-shrink:0}
.bg-top{border-bottom:1px solid var(--line,#2F2B39)}
.bg-top>span,.bg-footer>span{font-size:14px;line-height:1.5;color:var(--muted,#AEA8BC)}
.bg-dialog button{min-height:44px;padding:10px 14px;border:1px solid var(--line,#2F2B39);border-radius:8px;font-family:inherit;font-size:15px;font-weight:600;line-height:1.4;text-transform:none;letter-spacing:normal;white-space:normal;background:transparent;color:inherit;cursor:pointer;flex-shrink:0}
.bg-dialog button:focus-visible,.bg-entry button:focus-visible{outline:2px solid var(--accent,#956FFF);outline-offset:3px}
.bg-progress{display:flex;align-items:center;gap:7px;padding:22px 24px 0;flex-shrink:0}
.bg-progress>span{height:3px;flex:1;background:var(--line,#2F2B39);border-radius:3px}
.bg-progress>span.is-reached{background:var(--accent,#7657FF)}
.bg-progress>strong{font-size:14px;line-height:1.5;margin-left:10px;white-space:nowrap;font-variant-numeric:tabular-nums}
.bg-body{padding:24px;overflow-wrap:anywhere}
.bg-dialog h2{font-family:inherit;text-transform:none;letter-spacing:-.5px;font-size:clamp(24px,3.5vw,30px);font-weight:650;line-height:1.2;margin:0 0 14px;max-width:24ch}
.bg-dialog .bg-intro{font-size:16px;line-height:1.65;color:var(--text,#F5F4F8);margin:0 0 22px}
.bg-menu{padding:0;margin:0;list-style:none;display:grid;gap:0}
.bg-menu li{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0;border-top:1px solid var(--line,#2F2B39);min-width:0}
.bg-menu li>span{display:grid;gap:5px;min-width:0}
.bg-menu strong,.bg-example strong{font-size:16px;font-weight:600;line-height:1.4}
.bg-menu li>span>span,.bg-note,.bg-checks,.bg-example p{font-size:15px;line-height:1.65;color:var(--muted,#AEA8BC)}
.bg-menu button{font-size:14px}
.bg-dialog .bg-note{margin:18px 0 0;padding:16px;border-left:3px solid var(--accent,#7657FF);background:var(--soft,#221E2A);border-radius:0 8px 8px 0}
.bg-checks{padding-left:24px;margin:0 0 20px;display:grid;gap:8px}
.bg-example{padding:18px;margin:0 0 20px;border:1px solid var(--line,#2F2B39);border-radius:10px;background:var(--soft,#221E2A)}
.bg-example p{margin:8px 0}
.bg-example>span{font-size:14px;line-height:1.5;color:var(--muted,#AEA8BC)}
.bg-footer{margin-top:auto;border-top:1px solid var(--line,#2F2B39);position:sticky;bottom:0;background:var(--panel,#17141D)}
.bg-dialog .bg-primary{background:var(--accent,#7657FF);border-color:var(--accent,#7657FF);color:#FFFFFF}
@media(max-width:600px){.bg-backdrop{padding:12px}.bg-dialog{max-height:calc(100dvh - 24px);border-radius:12px}.bg-top,.bg-footer{padding:14px 18px;gap:10px}.bg-body{padding:20px 18px}.bg-progress{padding-inline:18px}.bg-footer{flex-wrap:wrap}.bg-footer>span{flex-basis:100%}.bg-menu li{gap:12px}.bg-menu button{padding:10px}.bg-footer .bg-primary{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.bg-dialog[data-dialog-enter]{animation:none!important}}