/* Actual controls stay operable inside the original Union frame spotlight. */
#usageGuide{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;overflow:clip;pointer-events:none;color:#e4ecf0}
#usageGuide:popover-open{display:block}
#usageGuideSpotlight{position:fixed;box-sizing:border-box;border:4px solid transparent;border-image:var(--site-native-boostFrame) 8 stretch;background:transparent;box-shadow:0 0 0 200vmax #06101bc9,0 0 18px #75b9d64d;pointer-events:none}
.usageGuidePanel{position:fixed;box-sizing:border-box;display:flex;flex-direction:column;width:376px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:clip;border:5px solid transparent;border-image:var(--site-native-frame) 8 stretch;background:linear-gradient(125deg,#34454eef,#243640f2),var(--site-native-texture);box-shadow:0 12px 38px #0006;pointer-events:auto}
.usageGuideHeader,#usageGuideSteps,.usageGuideFooter{flex-shrink:0}
.usageGuideHeader{display:flex;align-items:center;gap:10px;padding:17px 18px 14px;border-bottom:1px solid #9fb3be29}
.usageGuideIcon{width:29px;height:25px;background:var(--site-native-help-normal) center/contain no-repeat;flex:none}
.usageGuideHeader>div{display:flex;align-items:center;justify-content:space-between;flex:1;gap:12px;min-width:0}
.usageGuideEyebrow{font:10px/1.5 Arial;letter-spacing:1.1px;color:#ecd6b5}
#usageGuideCounter{font:11px/1.5 Arial;color:#b5cad7;white-space:nowrap;font-variant-numeric:tabular-nums}
#usageGuideClose{width:26px;min-width:26px;height:26px;min-height:26px;padding:0;margin-left:3px}
#usageGuideSteps{display:grid;grid-template-columns:repeat(var(--usage-guide-steps,7),minmax(0,1fr));gap:8px;padding:16px 18px 0}
#usageGuideSteps button{display:grid;place-items:center;box-sizing:border-box;padding:0;width:100%;height:29px;border:0;border-radius:0;background:var(--site-native-emptyTile) center/29px 29px no-repeat;color:#adc4d1;font:11px/1 Arial;text-shadow:0 1px 1px #152b35;transition:filter .18s}
#usageGuideSteps button[aria-current=step]{background-image:var(--site-native-boostTile);color:#fff;filter:drop-shadow(0 0 5px #86d8ed5e)}
#usageGuideSteps button[data-visited=true]:not([aria-current=step]){background-image:var(--site-native-tile);color:#f5e4cb}
#usageGuideSteps button:focus-visible{outline:2px solid #f2d5a6;outline-offset:2px}
.usageGuideCopy{padding:18px 18px 20px;min-height:0;overflow:auto;scrollbar-width:none}
.usageGuideCopy::-webkit-scrollbar{display:none}
.usageGuideCopy:focus-visible{outline:1px solid #accadb;outline-offset:-4px}
#usageGuideTitle{font-size:18px;font-weight:600;line-height:1.5;letter-spacing:-.35px;color:#fff0cf;text-wrap:balance;word-break:keep-all;margin:0 0 11px}
#usageGuideDescription{font-size:12px;line-height:1.9;color:#d3e2e9;word-break:keep-all;overflow-wrap:anywhere;margin:0}
#usageGuideChecklist{list-style:none;counter-reset:import-guide;margin:15px 0 0;padding:0;display:grid;gap:12px}
#usageGuideChecklist li{position:relative;counter-increment:import-guide;min-width:0;padding-left:36px}
#usageGuideChecklist li:before{content:counter(import-guide);position:absolute;left:0;top:0;width:25px;height:25px;display:grid;place-items:center;background:var(--site-native-tile) center/25px 25px no-repeat;color:#fbe8c6;font:11px/1 Arial}
#usageGuideChecklist strong{display:block;font-size:12px;line-height:1.75;color:#f5e8cf;margin-bottom:3px;font-weight:600}
#usageGuideChecklist span{display:block;color:#c0d3df;font-size:11px;line-height:1.8;word-break:keep-all;overflow-wrap:anywhere}
body #usageGuide #usageGuideAction{--action-height:36px;--action-padding:17px;display:flex;width:100%;grid-column:1/-1;margin:0;font-size:12px;justify-content:center}
#usageGuideTip{margin-top:14px;padding:10px 12px;border:3px solid transparent;border-image:var(--site-native-muted) 7 stretch;background:#1b303c7d;color:#aec8d8;font-size:10px;line-height:1.85;word-break:keep-all}
#usageGuideTip:empty{display:none}
.usageGuideFooter{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr);gap:10px;padding:14px 18px 17px;border-top:1px solid #9fb3be29;background:#1e303a66}
#usageGuide .usageGuideFooter button{--action-height:38px;--action-padding:12px;min-width:0;font-size:12px;text-align:center;justify-content:center;white-space:nowrap}
body .navLinks [data-open-guide],body .footerLinks [data-open-guide]{--action-height:26px;--action-padding:12px;font-size:11px}
body .snapshotTop [data-open-guide]{border:0;background:transparent;box-shadow:none;padding:0;min-height:24px;font-size:10px;color:#edddbe;display:flex;align-items:center;gap:5px}
@media(max-width:760px){
 body.usageGuideOpen{padding-bottom:var(--usage-guide-space,400px)}
 .usageGuidePanel{width:calc(100vw - 24px);max-height:calc(100dvh - 190px)}
 .usageGuideHeader{padding:13px 15px 10px}
 #usageGuideSteps{padding:12px 15px 0;gap:7px}
 .usageGuideCopy{padding:13px 15px 16px;min-height:0}
 #usageGuideTitle{font-size:17px;margin-bottom:8px}
 #usageGuideDescription{font-size:11px;line-height:1.85}
 #usageGuideChecklist{gap:10px;margin-top:12px}
 #usageGuideChecklist li{padding-left:33px}
 #usageGuideChecklist strong{font-size:11px}
 #usageGuideChecklist span{font-size:10px}
 body #usageGuide #usageGuideAction{--action-height:36px;font-size:11px}
 #usageGuideTip{margin-top:10px;padding:8px 10px;font-size:10px}
 .usageGuideFooter{padding:11px 15px 13px;gap:8px}
 #usageGuide .usageGuideFooter button{--action-height:38px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){#usageGuideSteps button{transition:none}}
