/* Shared XtremeStreams identity. Keep status colors separate from brand accents. */
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{
 --brand-bg:#080e1c;--brand-surface:#111c30;--brand-input:#0b1425;
 --brand-accent:#ff7945;--brand-accent-hover:#ff986f;--brand-ink:#080e1c;
 --brand-text:#f6f7fb;--brand-muted:#a6b0c3;--brand-border:#273044;
 --brand-border-strong:#52617b;--brand-soft:rgba(255,121,69,.09);
 --brand-success:#9dff3f;--brand-success-bg:rgba(157,255,63,.15);
 --brand-danger:#ff9c9c;--brand-warning:#ffd27a;--brand-info:#8ec5ff;
 --brand-font:'DM Sans',system-ui,sans-serif;
 --brand-heading:'Barlow Condensed','Arial Narrow',sans-serif;
 --brand-radius:5px;--brand-card-radius:10px;
 --bg:var(--brand-bg);--accent:var(--brand-accent);--text:var(--brand-text);
 --muted:var(--brand-muted);--border:var(--brand-border);
}
.brand-wordmark{display:inline-flex;align-items:center;gap:0;color:var(--brand-text);font:700 27px var(--brand-font);letter-spacing:-1.5px;text-decoration:none;white-space:nowrap;line-height:1.2}
.brand-wordmark .brand-symbol{color:var(--brand-accent);font-size:37px;margin-right:5px}
.brand-wordmark .brand-name{color:var(--brand-text);font-weight:700}
.brand-wordmark .brand-name span{color:inherit;font-weight:400}
.brand-context{display:block;margin-top:7px;color:var(--brand-muted);font:600 11px var(--brand-font);letter-spacing:1.4px;text-transform:uppercase}
.brand-screen{background:var(--brand-bg);color:var(--brand-text);font-family:var(--brand-font);line-height:1.5;color-scheme:dark}
.brand-screen *{box-sizing:border-box}
.brand-screen h1,.brand-screen h2,.brand-screen h3{font-family:var(--brand-heading);color:var(--brand-text);line-height:1.15}
.brand-screen h1{font-size:34px}.brand-screen h2{font-size:26px}.brand-screen h3{font-size:22px}
.brand-screen a{color:var(--brand-accent-hover)}
.brand-screen a.btn{color:var(--brand-ink)}
.brand-screen .brand-wordmark{color:var(--brand-text)}
.brand-screen button,.brand-screen input,.brand-screen select,.brand-screen textarea{font-family:var(--brand-font)}
.brand-screen button,.brand-screen .btn{min-height:44px;border-radius:var(--brand-radius)}
.brand-screen button:not(.danger):not(.tab):not(.sort-button):not(.copybtn):not(.cp):not(.logout){background:var(--brand-accent);color:var(--brand-ink);font-weight:700}
.brand-screen button:not(.danger):not(.tab):not(.sort-button):not(.copybtn):not(.cp):not(.logout):hover,.brand-screen .btn:hover{background:var(--brand-accent-hover)}
.brand-screen .copybtn,.brand-screen .cp,.brand-screen .logout{background:transparent;border:1px solid var(--brand-border-strong);color:var(--brand-text)}
.brand-screen :is(.copybtn,.cp,.logout):hover{border-color:var(--brand-accent);background:var(--brand-soft)}
.brand-screen :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background:var(--brand-input);color:var(--brand-text);border-color:var(--brand-border-strong);border-radius:var(--brand-radius);min-height:44px}
.brand-screen :is(input,select,textarea):focus{border-color:var(--brand-accent)}
.brand-screen :focus-visible{outline:3px solid var(--brand-accent-hover);outline-offset:3px}
.brand-screen :is(.card,.fcard,.cpkg,.box,.tkt,.stat){background:var(--brand-surface);border:1px solid var(--brand-border);border-radius:var(--brand-card-radius)}
.brand-screen :is(.pp.sel,.cpkg.sel){background:var(--brand-soft);border-color:var(--brand-accent)}
.brand-screen .pp:focus-within{outline:3px solid var(--brand-accent-hover);outline-offset:3px}
.brand-screen .pp input{display:inline-block;width:auto;accent-color:var(--brand-accent);margin:0 6px 0 0}
.brand-screen .status.on,.brand-screen .status.paid,.brand-screen .status.credited,.brand-screen .st.paid{background:var(--brand-success-bg);color:var(--brand-success)}
.brand-screen .stat .v.g,.brand-screen .medrel.up{color:var(--brand-success)}
.brand-screen .danger{background:#502b32;color:#ffd5d5;border:1px solid #a65d69}
.brand-screen .danger:hover{background:#693740}
.brand-screen .err{color:var(--brand-danger)}
.brand-screen .guides a{display:inline-flex;align-items:center;min-height:44px}
.brand-screen .toprow{gap:20px;flex-wrap:wrap}
.brand-admin .topbar h1{font:600 11px var(--brand-font);letter-spacing:1.4px;text-transform:uppercase;color:var(--brand-muted);margin:7px 0 0}
.brand-admin h2{font-size:22px}.brand-admin h3{font-size:20px}
.brand-admin .tab.on{background:var(--brand-surface);color:var(--brand-accent-hover)}
.brand-admin .sort-button{font-family:var(--brand-font);font-size:inherit}
.brand-admin .reminder-section>summary{color:var(--brand-accent-hover)}
.brand-admin .reminder-section>summary h2{color:inherit}
.brand-login .box{width:min(420px,100%);padding:30px}
.brand-login{padding:24px;min-height:100vh}
.brand-login h1{margin:28px 0 18px}
@media(max-width:600px){
 .brand-screen .wrap{padding:28px 16px}.brand-screen :is(.card,.fcard){padding:20px}
 .brand-wordmark{font-size:25px}.brand-wordmark .brand-symbol{font-size:34px}
 .brand-screen .toprow{gap:12px}.brand-screen .cred{flex-wrap:wrap;gap:8px}
 .brand-screen .credv{max-width:100%;flex:1;flex-wrap:wrap}
 .brand-screen .cred b{overflow-wrap:anywhere}
 .brand-screen .reseller-fields{grid-template-columns:1fr!important}
}
@media(prefers-reduced-motion:reduce){.brand-screen *{scroll-behavior:auto!important;transition:none!important}}

/* Dialog rules are scoped to avoid changing storefront checkout dialogs. */
dialog.xs-dialog{box-sizing:border-box;width:min(94vw,500px);max-height:85dvh;overflow:auto;margin:auto;padding:26px;background:var(--brand-surface);color:var(--brand-text);border:1px solid var(--brand-border-strong);border-radius:var(--brand-card-radius);font:15px/1.6 var(--brand-font);box-shadow:0 24px 80px #0009}
dialog.xs-dialog::backdrop{background:rgba(0,0,0,.72)}
dialog.xs-dialog .xs-dialog-brand{color:var(--brand-accent-hover);font-weight:700;margin:0 0 12px}
dialog.xs-dialog h2{font:700 30px/1.2 var(--brand-heading);color:var(--brand-text);margin:0 0 14px}
#xs-dialog-message{white-space:pre-wrap;overflow-wrap:anywhere}
.xs-dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px;flex-wrap:wrap}
dialog.xs-dialog .xs-dialog-actions button{width:auto;margin:0;min-height:44px;padding:10px 20px;border-radius:var(--brand-radius);font:700 14px var(--brand-font);cursor:pointer}
dialog.xs-dialog .xs-dialog-actions .xs-dialog-cancel{background:transparent;color:var(--brand-text);border:1px solid var(--brand-border-strong)}
dialog.xs-dialog .xs-dialog-actions .xs-dialog-accept{background:var(--brand-accent);color:var(--brand-ink);border:1px solid var(--brand-accent)}
dialog.xs-dialog button:focus-visible{outline:3px solid var(--brand-accent-hover);outline-offset:3px}
.brand-screen [role=alert]{overflow-wrap:anywhere}

/* Preserve the official spelling in display labels that use the eyebrow style. */
.eyebrow.brand-case{text-transform:none}

.admin-signout { margin: 0; }
.admin-signout button {
  min-height: 44px;
  padding: 0 12px;
  margin: 0;
  border-radius: 6px;
  font: 600 13px/1.4 var(--brand-font);
  white-space: nowrap;
  cursor: pointer;
}
.admin-signout button:focus-visible { outline: 2px solid var(--brand-accent); outline-offset: 3px; }