/* Header treatment shared by tracker, popup and side panel. */
html:root .brand { gap:9px; letter-spacing:-.8px; font-weight:800; }
html:root .brand .brand-mark { display:grid; place-items:center; width:38px; height:38px; flex:none; font:800 30px/1 "Segoe UI",system-ui,sans-serif; border-radius:11px; }
html:root .brand-wordmark { display:flex; flex-direction:column; line-height:1.05; white-space:nowrap; }
html:root .brand-wordmark>span { font-size:24px; }
html:root .brand-wordmark .brand-by { margin-top:3px; font-size:10px; font-weight:600; letter-spacing:0; color:var(--text); }
html:root .brand-wordmark b { color:inherit; }
html:root[data-palette="coral"] .brand .brand-mark { background:linear-gradient(145deg,#ff865c,#f4623d); color:#fff; box-shadow:inset 0 1px 0 #ffffff50; }
html:root .popup-shell .top { gap:12px; padding:13px 18px 11px; }
html:root .popup-shell .brand-wordmark>span { font-size:26px; }
html:root .popup-shell .brand-wordmark .brand-by { font-size:10px; }
html:root .popup-shell .top-actions { margin-left:auto; gap:7px; }
html:root .popup-shell #open-tracker.btn { height:39px; padding:8px 14px; border-radius:13px; font-weight:650; font-size:14px; box-shadow:0 3px 8px #31465a10; }
html:root[data-palette="coral"] .popup-shell #open-tracker.btn.btn-primary { background:linear-gradient(135deg,#ff8259,#f56640); border:1px solid #fa7852; color:#fff; }
html:root .popup-shell .top-actions .icon-btn { width:30px; height:34px; border:0; background:color-mix(in srgb,var(--surface) 70%,transparent); border-radius:11px; }
html:root .tracker-shell .bar .brand { padding-right:23px; border-right:1px solid var(--line); }
html:root .tracker-shell .bar .brand-wordmark>span { font-size:22px; }
html:root[data-palette="coral"] .tracker-shell .nav a[aria-current="page"] { background:transparent; color:#e05b36; border-radius:0; box-shadow:0 3px 0 #f5744d; }
html:root[data-palette="coral"] .tracker-shell #account>.btn { background:linear-gradient(135deg,#ff8259,#f56640); color:white; border-color:#fa7852; }
@media(max-width:460px) { html:root .popup-shell .top { gap:8px; padding:10px 12px; } html:root .popup-shell .brand-wordmark>span { font-size:22px; } html:root .popup-shell #open-tracker.btn { font-size:12px; padding:7px 9px; } }
@media(min-width:1101px) { html:root .tracker-shell .bar { gap:12px; } html:root .tracker-shell .nav a { padding:9px 8px; } }
