/* R13: compact, global topbar statistics. No homepage card, counters unchanged. */
.brand-shell .usage-compact{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:34px;max-width:430px;padding:6px 10px;border:1px solid #e4e9ef;
  border-radius:9px;background:#fafbfd;color:#74808d;font:inherit;font-size:11px;
  line-height:1.4;white-space:nowrap;flex:0 0 auto;cursor:pointer;
  transition:background .12s,border-color .12s;
}
.brand-shell .usage-compact:hover{background:#f2f6f9;border-color:#cbd6e0;color:#4a6174}
.brand-shell .usage-compact:focus-visible{outline:3px solid #8ab4d2;outline-offset:3px}
.usage-icon{flex:0 0 15px;color:#7b8c99}
.usage-compact-today{color:#89949e;font-size:10px}
.usage-compact-values{display:inline-flex;align-items:center;gap:9px}
.usage-compact-item{display:inline-flex;align-items:baseline;gap:4px;min-width:0}
.usage-compact-item+.usage-compact-item{border-left:1px solid #e0e6ec;padding-left:9px}
.usage-compact-item>strong{font-size:12px;font-weight:700;letter-spacing:-.1px;color:#354f62;font-variant-numeric:tabular-nums}
.usage-compact-chevron{color:#99a5af;flex:0 0 10px}
.usage-compact-mobile{display:none}
.usage-compact[data-state="unavailable"] .usage-icon{color:#9aa5ae}
/* Service status and verbose definitions live inside the opt-in detail dialog. */
.usage-eyebrow{font-size:11px;font-weight:750;color:#344d61;letter-spacing:.06em}
.usage-state{display:inline-flex;align-items:center;gap:6px;font-size:10px;color:#7c8995;line-height:1.5;margin-left:12px}
.usage-state:before{content:'';width:5px;height:5px;border-radius:50%;background:#aeb7be;flex:0 0 auto}
.usage-state.is-live:before{background:#368b6b}
.usage-link{border:0;background:none;color:#556e83;font-size:11px;line-height:1.6;cursor:pointer;padding:0;text-underline-offset:3px;text-align:left}
.usage-link:hover{text-decoration:underline;color:#293f51}
.usage-dialog{border:1px solid #e3e9ee;border-radius:18px;padding:0;width:min(760px,calc(100vw - 32px));max-height:85dvh;color:#263e51;box-shadow:0 24px 80px #142d4940}
.usage-dialog::backdrop{background:#182d4360}
.usage-dialog>header{padding:22px 26px;border-bottom:1px solid #e8edf1;display:flex;justify-content:space-between;gap:15px;align-items:center}.usage-dialog h2{font-size:22px;margin:7px 0 0}.usage-dialog h3{font-size:14px;margin:0 0 12px}.usage-dialog-body{padding:22px 26px;overflow:auto}
.usage-history-title{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.usage-history-wrap{overflow-x:auto;border:1px solid #e5ebf0;border-radius:9px}.usage-history-wrap table{width:100%;border-collapse:collapse;min-width:460px}.usage-history-wrap th{background:#f7f9fb;text-align:left;font-weight:650;font-size:10px;white-space:normal}.usage-history-wrap td{font-size:12px;font-variant-numeric:tabular-nums}.usage-history-wrap td,.usage-history-wrap th{padding:10px 12px;border-bottom:1px solid #edf0f3}
.usage-caption{font-size:11px;color:#81909a;line-height:1.5}.usage-consent{padding:18px;background:#f5f9fc;border:1px solid #e5edf3;border-radius:10px;margin:22px 0}.usage-consent label{display:flex;align-items:center;gap:8px;font-size:13px;line-height:1.6}.usage-consent input{width:16px;height:16px;accent-color:#376683}.usage-consent p,.usage-definitions p{font-size:12px;line-height:1.8;color:#64788a;margin:8px 0}.usage-consent #usagePrivacyState{font-size:11px;color:#738795}

/* Trade secondary page-title space for a one-line toolbar, never shrink upload controls. */
@media(max-width:1380px){.brand-shell .navigation-page-title{display:none}}
@media(max-width:1100px){
  .brand-shell .usage-compact{gap:5px;padding:6px 9px;max-width:130px}
  .usage-compact-values,.usage-compact-today,.usage-compact-chevron{display:none}
  .usage-compact-mobile{display:inline;font-size:11px}
}
@media(max-width:700px){
  .brand-shell .usage-compact{width:34px;height:34px;min-height:34px;padding:0;flex-basis:34px}
  .usage-compact-mobile{display:none}
}
@media(max-width:640px){
  /* Same two-row mobile brand toolbar as R12; statistics adds no row. */
  .brand-shell .top-actions{gap:6px}
  .brand-shell .lang-select{max-width:136px}
  .usage-dialog-body,.usage-dialog>header{padding:18px}
  .usage-dialog h2{font-size:19px}
  .usage-state{display:flex;margin:6px 0 0}
}
@media(max-width:370px){
  .brand-shell .top-actions{gap:5px}
  .brand-shell .lang-select{max-width:120px;font-size:11px}
  .brand-shell .top-actions #resetBtn{padding:6px 5px;font-size:10px}
  .brand-shell .version-button{font-size:10px;padding:7px 6px}
}
@media(prefers-reduced-motion:reduce){.brand-shell .usage-compact{transition:none}}
/* On phones, tuck the icon beside the brand, leaving the existing language/
   version/reset row untouched instead of adding a third toolbar row. */
@media(max-width:640px){
  .brand-shell .usage-compact{position:absolute;right:16px;top:18px}
  .brand-shell .navigation-top-title{padding-right:44px}
  .brand-shell .top-actions{flex-wrap:nowrap}
}