#help-btn { width:36px; height:36px; color:var(--green); font-size:16px; }
#help-btn:focus-visible, #help-popup button:focus-visible, #help-popup summary:focus-visible { outline:2px solid var(--amber); outline-offset:3px; }
#help-popup { width:min(380px,calc(100vw - 28px)); right:14px; bottom:64px; max-height:calc(100dvh - 84px); overflow-y:auto; clip-path:none; }
#help-popup[hidden] { display:none; }
#help-popup.is-open { opacity:1; pointer-events:auto; transform:none; }
#help-popup .help-header { display:flex; justify-content:space-between; align-items:center; font-size:12px; letter-spacing:2px; }
#help-close { border:0; background:none; color:var(--bg); font:24px/1 monospace; padding:2px 4px; cursor:pointer; }
#help-popup .help-list li { font-size:12px; }
#help-popup summary { cursor:pointer; padding:14px; font-size:13px; color:var(--green); }
.traffic { padding:20px 18px 14px; border-bottom:1px solid var(--border); }
.traffic-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
.traffic-heading h2 { font:700 13px 'Orbitron',sans-serif; color:var(--amber); letter-spacing:1px; }
.traffic-ranges { display:flex; gap:4px; }
.traffic-ranges button { border:1px solid var(--border); color:#a1c395; background:var(--bg); font:13px 'Share Tech Mono',monospace; min-height:32px; min-width:38px; padding:4px 7px; cursor:pointer; }
.traffic-ranges button[aria-pressed="true"] { background:var(--green); color:var(--bg); border-color:var(--green); }
.traffic-ranges button:disabled { opacity:.45; cursor:default; }
.traffic-total { margin-top:18px; font-size:14px; color:#aac89c; }
.traffic-total strong { font:700 30px 'Orbitron',sans-serif; color:var(--green); margin-right:8px; }
#traffic-period { color:#9bb88d; font-size:12px; margin:8px 0; }
#traffic-chart { margin-top:16px; }
#traffic-chart svg { width:100%; height:auto; overflow:visible; }
#traffic-chart .traffic-bar { fill:var(--green); opacity:.75; }
#traffic-chart .traffic-bar:hover { fill:var(--amber); opacity:1; }
#traffic-status { color:#b5c9aa; font-size:14px; line-height:1.6; margin:14px 0; }
.traffic-note { color:#91a984; font-size:12px; line-height:1.6; margin-top:12px; }
.traffic-note a { color:inherit; }
#traffic-retry { border:1px solid var(--green-dim); color:var(--green); background:transparent; padding:8px 12px; font:14px 'Share Tech Mono',monospace; cursor:pointer; }
#traffic-data summary { padding:10px 0; font-size:12px; }
#traffic-data table { width:100%; border-collapse:collapse; font-size:12px; color:#b5c9aa; }
#traffic-data th, #traffic-data td { text-align:left; padding:6px 0; border-bottom:1px solid var(--border); }
#traffic-data td:last-child, #traffic-data th:last-child { text-align:right; }
.traffic [hidden] { display:none !important; }