:root{font:15px/1.5 system-ui,sans-serif;color:#172947;background:#f4f7fc;--nav:#122443;--blue:#255bea;--line:#e4eaf3}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select{cursor:pointer}button{border:0;border-radius:9px;background:#eaf0ff;color:#1944ae;padding:9px 14px;font-weight:650}button:hover{filter:brightness(.94)}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #5a98ff;outline-offset:2px}.primary{background:var(--blue);color:white}.layout{min-height:100vh;display:grid;grid-template-columns:238px minmax(0,1fr)}aside{background:var(--nav);color:#fff;padding:26px 18px;display:flex;flex-direction:column;gap:25px}.brand{display:flex;align-items:center;gap:11px;font-weight:750;line-height:1.25}.logo{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#3066f6;color:white;font-size:23px;flex:none}small,.muted{color:#61718a}aside small{color:#9eafc9;font-weight:500}nav{display:grid;gap:6px}nav button{text-align:left;background:transparent;color:#b9c8e0}nav button.selected{background:#233e6a;color:white}nav span{display:inline-block;width:26px}.nav-label,.eyebrow{font-size:11px;letter-spacing:.13em;font-weight:800;text-transform:uppercase}.nav-label{color:#94a9c9;padding-left:12px}aside footer{margin-top:auto;color:#a4b6d0;font-size:12px}.top{background:white;border-bottom:1px solid var(--line);padding:15px 28px;display:flex;align-items:center;justify-content:space-between;gap:12px}.tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.content{max-width:1450px;margin:auto;padding:27px}.hero{border-radius:17px;padding:29px 31px;background:radial-gradient(ellipse at 92% 25%,#245ec1,transparent 61%),linear-gradient(105deg,#13294d,#193e82);color:white;display:flex;align-items:center;justify-content:space-between;gap:15px}.hero .eyebrow{color:#b8d1ff}.hero p{color:#dae6fc;margin-bottom:0}.hero h1{margin:6px 0;font-size:clamp(24px,3vw,39px);letter-spacing:-.04em}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:20px 0}.card,.panel{background:white;border:1px solid var(--line);border-radius:14px}.card{padding:17px}.number{font-size:29px;font-weight:780;display:block}.split{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:20px}.workspace{text-align:left;background:#e4f6f2;color:#065f56;padding:19px}.workspace.blue{background:#e8efff;color:#204ba8}.workspace strong{display:block;font-size:18px}.panel{overflow:hidden;margin-top:16px}.panel-head{padding:17px 19px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.panel-head h2{margin:0;font-size:18px}.scroll{overflow:auto}table{border-collapse:collapse;width:100%;text-align:left;white-space:nowrap}th,td{padding:12px 17px;border-top:1px solid var(--line)}th{font-size:12px;color:#61718a;background:#f9fbff}.badge{display:inline-block;border-radius:20px;padding:4px 9px;background:#eaf0ff;color:#2552b5;font-size:12px;font-weight:700}.good{background:#def5eb;color:#066548}.warn{background:#fff1d9;color:#84520a}.empty{padding:20px;color:#61718a}input,select{border:1px solid #cdd8ea;border-radius:8px;padding:9px 11px;background:white;color:inherit;max-width:100%}label{display:grid;gap:5px;font-weight:600}.signin{max-width:420px;margin:9vh auto;background:white;border:1px solid var(--line);border-radius:18px;padding:27px}.signin form,dialog form{display:grid;gap:13px}dialog{border:1px solid var(--line);border-radius:16px;padding:24px;color:#172947;width:min(92vw,470px)}dialog::backdrop{background:#0b1d3a88}dialog h2{margin-top:0}#toast{position:fixed;bottom:18px;right:18px;z-index:4;background:#122443;color:white;border-radius:10px;padding:12px 18px;max-width:90vw}#toast:empty{display:none}.error{color:#a72338;margin:0}.link{background:transparent;padding:0;text-align:left}.steps{padding-left:22px}.steps li{padding:4px}.steps .current{color:#255bea;font-weight:750}@media(max-width:820px){.layout{grid-template-columns:1fr}aside{gap:12px;padding:15px}nav{display:flex;flex-wrap:wrap}aside footer,.nav-label{display:none}.content,.top{padding:16px}}@media(max-width:530px){.cards{grid-template-columns:1fr 1fr}.split{grid-template-columns:1fr}.hero,.top{align-items:flex-start;flex-direction:column}.signin{margin:20px}}
textarea{font:inherit;color:inherit;border:1px solid #cdd8ea;border-radius:8px;padding:9px 11px;min-height:95px;resize:vertical}.ticket-text{white-space:pre-wrap;overflow-wrap:anywhere}

.application-count { margin: .65rem 1rem; }
#reset-app-filters[hidden] { display: none; }

.brand-logo { max-width: 8rem; max-height: 3rem; object-fit: contain; }

.account-screen {
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  align-items: center;
  justify-items: center;
  padding: clamp(1rem, 7vw, 7rem);
  background: linear-gradient(115deg, #09182e55, #09182eaa),
    url("https://images.pexels.com/photos/37521292/pexels-photo-37521292.jpeg?auto=compress&cs=tinysrgb&w=1920") center / cover no-repeat,
    #142946;
}
.account-screen .signin {
  width: min(100%, 420px);
  margin: 0;
  background: #ffffffed;
  border-color: #fff;
  padding: clamp(1.4rem, 4vw, 2.5rem);
  box-shadow: 0 20px 60px #09182e66;
}
.account-screen .signin h1 { margin-bottom: .35rem; }
.account-screen .signin p { margin-top: 0; }
.account-screen .signin form .primary { width: 100%; }
.account-actions { display: flex; flex-wrap: wrap; gap: .65rem; }

.account-screen .account-logo { font-size: .9rem; letter-spacing: .06em; }
.password-field { position: relative; }
.password-field input { width: 100%; padding-right: 3rem; }
.password-toggle { position: absolute; inset: 2px 2px 2px auto; display: grid; place-items: center; width: 2.65rem; padding: 0; background: transparent; color: #526581; }
.password-toggle .eye-slash { display: none; }
.password-toggle.revealed .eye-slash { display: block; }

nav button[data-page] { display: flex; align-items: center; gap: .7rem; }
nav button[data-page] svg { flex: none; }
nav button[data-page] span { width: auto; }
.brand { font-weight: 700; letter-spacing: -.015em; }

.dashboard-metrics .card:nth-child(1) { background: #e3f5f1; border-color: #b9e3d9; color: #075e54; }
.dashboard-metrics .card:nth-child(2) { background: #eaf0ff; border-color: #cbd9fc; color: #1b429d; }
.dashboard-metrics .card:nth-child(3) { background: #fff3dd; border-color: #eed6a8; color: #794800; }
.dashboard-metrics .card:nth-child(4) { background: #eaf6e9; border-color: #c7e5c6; color: #225e32; }
.dashboard-metrics .card .muted { color: inherit; }

.brands-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.brands-heading h1 { margin: 0; }
.brand-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 18px; }
.brand-card { display: flex; flex-direction: column; margin: 0; padding: 20px; gap: 18px; }
.brand-card-header { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 12px; }
.brand-card-header > div:nth-child(2) { flex: 1 1 150px; }
.brand-card h2 { margin: 0 0 4px; font-size: 1.15rem; overflow-wrap: anywhere; }
.brand-mark { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 12px; background: #eaf0ff; color: #1944ae; }
.brand-mark img { width: 100%; height: 100%; padding: 5px; object-fit: contain; }
.brand-mark svg { width: 24px; height: 24px; }
.brand-code, .brand-status { font-size: .82rem; font-weight: 700; }
.brand-code { color: #52637d; }
.brand-status { border-radius: 999px; padding: 3px 9px; color: #17583c; background: #e1f4e9; }
.brand-status.inactive { color: #52637d; background: #edf0f5; }
.brand-details { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: 0; }
.brand-details div:first-child { grid-column: 1 / -1; }
.brand-details dt { color: #52637d; font-size: .85rem; }
.brand-details dd { margin: 2px 0 0; overflow-wrap: anywhere; }
.brand-actions { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 8px; }
.brand-status-button { background: #edf0f5; color: #344761; }

.team-member { padding: 16px 20px; border-top: 1px solid var(--line); }
.team-member-header { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.team-identity { flex: 1 1 12rem; overflow-wrap: anywhere; }
.team-avatar { display: grid; place-items: center; width: 44px; height: 44px; overflow: hidden; border-radius: 50%; background: #eaf0ff; color: #1944ae; font-weight: 700; }
.team-avatar img { width: 100%; height: 100%; object-fit: cover; }
.team-member details { margin: 9px 0 0 56px; }
.team-member summary { cursor: pointer; color: #1944ae; font-weight: 650; }
.team-member ul { margin: 8px 0 0; padding-left: 20px; }
