:root{
  --app-bg:#07100c; --app-bg-2:#0c1712; --surface:#111b16; --surface-2:#16231c;
  --text:#f4f8f5; --muted:#9eaaa2; --border:rgba(255,255,255,.10);
  --radius:18px; --radius-sm:12px; --shadow:0 18px 45px rgba(0,0,0,.28);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;-webkit-font-smoothing:antialiased}
a,button,input,select,textarea{font:inherit}
.kssl-brandbar{width:100%;position:relative;z-index:50;border-bottom:1px solid var(--border);backdrop-filter:blur(16px)}
.kssl-brandbar-inner{max-width:1180px;margin:auto;padding:13px 18px;display:flex;align-items:center;justify-content:space-between;gap:14px}
.kssl-brandlockup{display:flex;align-items:center;gap:11px;min-width:0;text-decoration:none;color:inherit}
.kssl-brandlogo{width:42px;height:42px;border-radius:11px;object-fit:contain;background:rgba(255,255,255,.08);padding:5px;border:1px solid var(--border)}
.kssl-brandmark{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:var(--brand-accent);color:var(--brand-accent-text);font-weight:900;letter-spacing:-.04em}
.kssl-brandname{font-weight:850;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kssl-brandsub{font-size:12px;color:var(--muted);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kssl-brand-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.kssl-navbtn{display:inline-flex;align-items:center;gap:7px;text-decoration:none;border:1px solid var(--border);border-radius:10px;padding:9px 12px;font-size:13px;font-weight:750;transition:.18s ease}
.kssl-navbtn:hover{transform:translateY(-1px)}
.kssl-navbtn-primary{background:var(--brand-accent);color:var(--brand-accent-text);border-color:transparent}
.kssl-navbtn-ghost{background:rgba(255,255,255,.045);color:var(--text)}
.kssl-page-kicker{font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:var(--brand-accent)}
@media(max-width:620px){.kssl-brandsub{display:none}.kssl-brandbar-inner{padding:10px 12px}.kssl-navbtn{padding:8px 10px}.kssl-brandlogo,.kssl-brandmark{width:38px;height:38px}}


/* Mobile chrome refinement */
@media(max-width:760px){
  .kssl-brandbar-inner{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:stretch;
    gap:10px;
    padding:12px 14px;
  }
  .kssl-brandlockup{
    width:100%;
    min-width:0;
  }
  .kssl-brandlockup > div:last-child{
    min-width:0;
    flex:1;
  }
  .kssl-brandname{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:15px;
  }
  .kssl-brandsub{display:none}
  .kssl-brand-actions{
    width:100%;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
  }
  .kssl-navbtn{
    width:100%;
    min-width:0;
    min-height:42px;
    padding:9px 8px;
    justify-content:center;
    text-align:center;
    line-height:1.15;
    white-space:normal;
    overflow-wrap:anywhere;
  }
}
@media(max-width:430px){
  .kssl-brandlogo,.kssl-brandmark{width:40px;height:40px;flex:0 0 40px}
  .kssl-page-kicker{font-size:10px;letter-spacing:.10em}
  .kssl-brandname{font-size:14px}
  .kssl-brand-actions{grid-template-columns:1fr 1fr}
  .kssl-brand-actions .kssl-navbtn-primary{grid-column:1 / -1}
}

/* Final mobile admin/public chrome layout, intentionally high specificity */
@media (max-width:760px){
  header.kssl-brandbar .kssl-brandbar-inner{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:12px!important;
    width:100%!important;
    padding:14px!important;
  }
  header.kssl-brandbar .kssl-brandlockup{
    display:flex!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    align-items:center!important;
  }
  header.kssl-brandbar .kssl-brandlockup > div:last-child{
    min-width:0!important;
    max-width:calc(100% - 54px)!important;
  }
  header.kssl-brandbar .kssl-brandname{
    display:block!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:16px!important;
  }
  header.kssl-brandbar .kssl-brand-actions{
    position:static!important;
    float:none!important;
    width:100%!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    margin:0!important;
    padding:0!important;
  }
  header.kssl-brandbar .kssl-brand-actions .kssl-navbtn{
    position:static!important;
    float:none!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    min-height:44px!important;
    margin:0!important;
    padding:10px 8px!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    white-space:normal!important;
    line-height:1.15!important;
  }
  header.kssl-adminbar .kssl-brand-actions .kssl-navbtn-primary{
    grid-column:1 / -1!important;
  }
}
@media (max-width:390px){
  header.kssl-brandbar .kssl-brand-actions{grid-template-columns:1fr!important}
  header.kssl-adminbar .kssl-brand-actions .kssl-navbtn-primary{grid-column:auto!important}
}


/* KSSL mobile hamburger navigation */
.kssl-mobile-menu-toggle {
  display: none;
  appearance: none;
  border: 1px solid var(--kssl-border, rgba(255,255,255,.16));
  background: var(--kssl-surface, rgba(255,255,255,.04));
  color: var(--kssl-text, #fff);
  width: 46px;
  height: 46px;
  border-radius: 14px;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex: 0 0 auto;
}
.kssl-mobile-menu-toggle span,
.kssl-mobile-menu-toggle::before,
.kssl-mobile-menu-toggle::after {
  content: "";
  display: block;
  width: 21px;
  height: 2px;
  background: currentColor;
  border-radius: 99px;
  transition: transform .18s ease, opacity .18s ease;
}
.kssl-mobile-menu-toggle span { margin: 5px 0; }
.kssl-mobile-menu-toggle[aria-expanded="true"] span { opacity: 0; }
.kssl-mobile-menu-toggle[aria-expanded="true"]::before { transform: translateY(7px) rotate(45deg); }
.kssl-mobile-menu-toggle[aria-expanded="true"]::after { transform: translateY(-7px) rotate(-45deg); }

.kssl-mobile-drawer {
  display: none;
  width: 100%;
  padding: 12px 0 4px;
}
.kssl-mobile-drawer.is-open { display: grid; gap: 9px; }
.kssl-mobile-drawer a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  padding: 11px 14px;
  border-radius: 13px;
  border: 1px solid var(--kssl-border, rgba(255,255,255,.14));
  background: var(--kssl-surface, rgba(255,255,255,.04));
  color: var(--kssl-text, #fff) !important;
  text-decoration: none !important;
  font-weight: 700;
}
.kssl-mobile-drawer a.kssl-mobile-primary {
  background: var(--brand-accent);
  color: var(--brand-accent-text, #07110c) !important;
  border-color: transparent;
}
.kssl-mobile-drawer .kssl-menu-badge {
  display: inline-flex;
  min-width: 25px;
  height: 25px;
  padding: 0 7px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #b42318;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 760px) {
  .kssl-mobile-menu-toggle { display: inline-flex; flex-direction: column; }
  .kssl-desktop-actions,
  .kssl-brand-actions { display: none !important; }
  .kssl-brandbar,
  .kssl-public-brandbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
  }
  .kssl-brand-identity,
  .kssl-public-brand-identity {
    min-width: 0;
    flex: 1 1 auto;
  }
  .kssl-brand-name,
  .kssl-public-brand-name {
    overflow-wrap: anywhere;
  }
}