:root {
  --ink: #0b1930;
  --ink-soft: #53647d;
  --navy: #07172d;
  --navy-2: #0c2342;
  --blue: #2f7cf6;
  --blue-2: #59b8ff;
  --cyan: #54d4e8;
  --green: #27bd83;
  --amber: #edaa42;
  --red: #ed6471;
  --paper: #f4f7fb;
  --white: #ffffff;
  --line: #dfe6f0;
  --shadow: 0 18px 48px rgba(19, 42, 75, .09);
  --radius: 16px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--paper);
}
[data-theme="dark"] {
  --ink: #e8f0fb;
  --ink-soft: #9eb0c7;
  --paper: #081525;
  --white: #102238;
  --line: #263b54;
  --shadow: 0 18px 48px rgba(0,0,0,.3);
  color-scheme: dark;
}
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--paper); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(420px, 1.15fr) minmax(430px, .85fr); background: var(--white); }
.login-visual { position: relative; overflow: hidden; min-height: 690px; color: white; background: radial-gradient(circle at 73% 32%, rgba(47,124,246,.32), transparent 32%), linear-gradient(145deg, #050f20, #0a2342 62%, #0f3157); }
.visual-grid { position: absolute; inset: 0; opacity: .2; background-image: linear-gradient(rgba(120,184,255,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(120,184,255,.15) 1px, transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom right, black, transparent 72%); }
.shield-orbit { position: absolute; width: 420px; height: 420px; right: -70px; top: 90px; border: 1px solid rgba(89,184,255,.25); border-radius: 50%; box-shadow: 0 0 0 64px rgba(89,184,255,.035), 0 0 0 128px rgba(89,184,255,.025); }
.shield-orbit::before { content: ""; position: absolute; inset: 66px; border: 1px solid rgba(89,184,255,.22); border-radius: 50%; }
.shield-mark { position: absolute; inset: 115px; display: grid; place-items: center; background: linear-gradient(145deg, #3997ff, #144eab); clip-path: polygon(50% 0, 90% 18%, 83% 72%, 50% 100%, 17% 72%, 10% 18%); filter: drop-shadow(0 18px 35px rgba(40,124,255,.4)); }
.shield-mark span { font-size: 76px; font-weight: 800; color: white; }
.orbit-dot { position: absolute; width: 9px; height: 9px; background: var(--cyan); border-radius: 50%; box-shadow: 0 0 18px var(--cyan); }
.dot-a { top: 28px; left: 100px; }.dot-b { bottom: 72px; left: 0; }.dot-c { right: 18px; bottom: 120px; }
.visual-copy { position: absolute; left: clamp(38px, 7vw, 96px); bottom: 72px; max-width: 620px; padding-right: 40px; }
.eyebrow, .kicker { color: var(--cyan); font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.visual-copy h1 { margin: 16px 0; font-size: clamp(48px, 6vw, 78px); line-height: .98; letter-spacing: -.055em; }
.visual-copy h1 em { color: var(--blue-2); font-style: normal; }
.visual-copy p { color: #aebdd2; max-width: 610px; font-size: 18px; line-height: 1.65; }
.login-panel { display: grid; place-items: center; padding: 48px; }
.login-box { width: min(100%, 430px); }
.brand { height: 64px; display: flex; align-items: center; gap: 12px; color: white; }
.brand-dark { color: var(--ink); margin-bottom: 72px; }
.brand-symbol { width: 40px; height: 46px; display: grid; place-items: center; color: white; font-size: 20px; font-weight: 900; background: linear-gradient(145deg, var(--blue-2), var(--blue)); clip-path: polygon(50% 0, 92% 18%, 83% 76%, 50% 100%, 17% 76%, 8% 18%); }
.brand strong, .brand small { display: block; }.brand strong { font-size: 20px; letter-spacing: -.03em; }.brand small { margin-top: 2px; color: #7690b1; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.login-heading h2 { margin: 0; font-size: 34px; letter-spacing: -.035em; }.login-heading p { margin: 8px 0 30px; color: var(--ink-soft); }
label { display: grid; gap: 8px; margin-bottom: 18px; color: #283c59; font-size: 14px; font-weight: 700; }
input, select, textarea { width: 100%; padding: 13px 14px; color: var(--ink); background: var(--white); border: 1px solid #ccd7e5; border-radius: 10px; outline: none; transition: border .2s, box-shadow .2s; }
input:focus, select:focus, textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(47,124,246,.12); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 0 17px; border: 0; border-radius: 10px; font-weight: 800; }
.button.primary { color: white; background: var(--blue); box-shadow: 0 8px 20px rgba(47,124,246,.22); }.button.primary:hover { background: #1768e5; }.button.secondary { color: var(--ink); background: #e9eff7; }.button.outline { color: var(--ink); background: white; border: 1px solid var(--line); }.button.danger { color: white; background: var(--red); }.full { width: 100%; }
.form-error { min-height: 20px; color: #c43d4a; font-size: 14px; }
.demo-note { margin-top: 30px; padding: 15px; display: flex; gap: 10px; color: #456078; background: #f1f7fb; border: 1px solid #d9e7f3; border-radius: 12px; font-size: 13px; line-height: 1.5; }
.status-dot { width: 9px; height: 9px; flex: 0 0 auto; margin-top: 4px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(39,189,131,.12); }
.app-shell { min-height: 100vh; display: block; }
.sidebar { position: fixed; z-index: 20; inset: 0 auto 0 0; width: 248px; display: flex; flex-direction: column; padding: 16px; color: #c6d3e5; background: linear-gradient(180deg, #07182d, #061224); }
.sidebar .brand { padding: 0 10px; margin-bottom: 24px; }
nav { display: grid; gap: 5px; }
.nav-item { width: 100%; min-height: 45px; display: flex; align-items: center; gap: 12px; padding: 0 13px; color: #a8b8ce; background: transparent; border: 0; border-radius: 10px; font-weight: 700; text-align: left; }
.nav-item:hover { color: white; background: rgba(255,255,255,.05); }.nav-item.active { color: white; background: linear-gradient(90deg, rgba(47,124,246,.24), rgba(47,124,246,.08)); box-shadow: inset 3px 0 var(--blue); }
.nav-icon { width: 22px; color: #72baff; font-size: 19px; text-align: center; }
.sidebar-bottom { margin-top: auto; display: grid; gap: 10px; }
.safe-mode { padding: 12px; display: flex; gap: 10px; color: #d2dcea; background: rgba(39,189,131,.08); border: 1px solid rgba(39,189,131,.18); border-radius: 12px; font-size: 12px; }.safe-mode strong, .safe-mode small { display: block; }.safe-mode small { margin-top: 3px; color: #7690a9; }
.account-menu-wrap{position:relative}.user-card { width: 100%; display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 10px; padding: 12px 10px; color: white; background: transparent; border: 1px solid transparent; border-top-color:rgba(255,255,255,.08); border-radius:12px; text-align: left; cursor:pointer;transition:.18s ease}.user-card:hover,.user-card[aria-expanded="true"]{background:rgba(255,255,255,.06);border-color:rgba(89,212,231,.2)}.user-card strong, .user-card small { display: block; }.user-card strong { font-size: 13px; }.user-card small { margin-top: 3px; color: #7086a3; font-size: 10px; }.account-chevron{color:#8fa3be;font-size:15px;transition:transform .18s}.user-card[aria-expanded="true"] .account-chevron{transform:rotate(180deg)}
.account-popover{position:absolute;left:0;bottom:calc(100% + 9px);z-index:30;width:285px;padding:8px;background:#10243a;border:1px solid rgba(128,164,201,.25);border-radius:16px;box-shadow:0 18px 45px rgba(0,0,0,.35)}.account-popover-header{display:grid;grid-template-columns:40px 1fr;align-items:center;gap:10px;padding:10px 10px 13px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:5px}.account-popover-header strong,.account-popover-header small{display:block}.account-popover-header strong{color:#fff;font-size:13px}.account-popover-header small{color:#8296b0;font-size:10px;margin-top:3px;overflow:hidden;text-overflow:ellipsis}.account-popover>button{display:grid;grid-template-columns:30px 1fr;align-items:center;gap:9px;width:100%;padding:10px;color:#e7eef8;background:transparent;border:0;border-radius:10px;text-align:left;cursor:pointer}.account-popover>button:hover{background:rgba(255,255,255,.07)}.account-popover>button strong,.account-popover>button small{display:block}.account-popover>button strong{font-size:12px}.account-popover>button small{margin-top:2px;color:#7f94ae;font-size:9px}.account-menu-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(47,124,246,.14);color:#74d7e6}.account-menu-divider{height:1px;margin:5px 8px;background:rgba(255,255,255,.08)}.account-popover>button.logout-menu-item strong{color:#ff9da8}.account-popover>button.logout-menu-item .account-menu-icon{background:rgba(220,82,98,.14);color:#ff8b99}
.avatar { width: 34px; height: 34px; display: grid; place-items: center; color: white; background: #224e88; border-radius: 9px; font-size: 12px; font-weight: 800; }
.main { width: calc(100% - 248px); min-width: 0; margin-left: 248px; }
.topbar { position: sticky; z-index: 10; top: 0; height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 0 30px; background: rgba(255,255,255,.94); border-bottom: 1px solid var(--line); backdrop-filter: blur(15px); }
.workspace { display: flex; align-items: center; gap: 10px; }.workspace-logo { width: 38px; height: 38px; display: grid; place-items: center; color: white; background: #183d70; border-radius: 10px; font-weight: 900; }.workspace strong, .workspace small { display: block; }.workspace strong { font-size: 14px; }.workspace small { margin-top: 3px; color: var(--ink-soft); font-size: 11px; }
.workspace-button { padding:0; color:var(--ink); background:transparent; border:0; text-align:left; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }.environment-badge { padding: 6px 9px; color: #2c765f; background: #e2f7ef; border-radius: 7px; font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.icon-button { width: 38px; height: 38px; display: grid; place-items: center; color: var(--ink); background: transparent; border: 1px solid var(--line); border-radius: 10px; font-size: 18px; }.menu-button { display: none; }
.content { max-width: 1560px; margin: auto; padding: 30px; outline: none; }
.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }.page-header h1 { margin: 0; font-size: 30px; letter-spacing: -.04em; }.page-header p { margin: 7px 0 0; color: var(--ink-soft); }.header-actions { display: flex; gap: 10px; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.metric-card, .panel { background: white; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 7px 25px rgba(26,55,89,.04); }
.metric-card { min-height: 142px; padding: 19px; position: relative; overflow: hidden; background-image:linear-gradient(135deg,transparent 72%,var(--tint,#eaf3ff)); }.metric-card::after { content: ""; position: absolute; width: 58px; height: 58px; right: 13px; bottom: 10px; border: 2px solid var(--tone,#2f7cf6); border-radius: 18px; opacity:.08; transform:rotate(12deg); }.metric-top { position:relative;z-index:1;display: flex; align-items: center; justify-content: space-between; color: var(--ink-soft); font-size: 13px; font-weight: 700; }.metric-icon { width: 32px; height: 32px; display: grid; place-items: center; color: var(--tone, var(--blue)); background: var(--tint, #eaf3ff); border-radius: 9px; }.metric-value { position:relative;z-index:1;margin-top: 15px; font-size: 34px; font-weight: 850; letter-spacing: -.05em; }.metric-trend { position:relative;z-index:1;margin-top: 6px; color: var(--ink-soft); font-size: 12px; }.metric-trend strong { color: var(--green); }
.dashboard-grid { display: grid; grid-template-columns: 1.55fr .85fr; gap: 16px; margin-top: 16px; }.panel { padding: 20px; }.panel-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }.panel-header h2 { margin: 0; font-size: 17px; letter-spacing: -.02em; }.panel-header p { margin: 5px 0 0; color: var(--ink-soft); font-size: 12px; }
.risk-chart { height: 235px; display: flex; align-items: end; gap: 16px; padding: 18px 12px 28px; border-bottom: 1px solid var(--line); }.bar-group { height: 100%; flex: 1; display: flex; flex-direction: column; justify-content: end; align-items: center; gap: 8px; }.bar-stack { width: min(34px, 75%); display: flex; flex-direction: column; justify-content: end; gap: 4px; height: 180px; }.bar { width: 100%; border-radius: 6px 6px 2px 2px; min-height: 4px; }.bar.good { background: linear-gradient(#62d9ad,#23af7b); }.bar.risk { background: linear-gradient(#ff9aa5,#e85666); }.bar-group label { margin: 0; color: var(--ink-soft); font-size: 11px; white-space: nowrap; }.chart-legend { display: flex; gap: 18px; margin-top: 14px; color: var(--ink-soft); font-size: 12px; }.legend-dot { width: 8px; height: 8px; display: inline-block; margin-right: 6px; border-radius: 50%; }
.activity-list { display: grid; }.activity { display: grid; grid-template-columns: 34px 1fr; gap: 11px; padding: 13px 0; border-bottom: 1px solid #edf1f6; }.activity:last-child { border-bottom: 0; }.activity-icon { width: 34px; height: 34px; display: grid; place-items: center; color: var(--blue); background: #edf5ff; border-radius: 9px; }.activity strong { display: block; font-size: 13px; }.activity p { margin: 4px 0; color: var(--ink-soft); font-size: 12px; line-height: 1.45; }.activity time { color: #96a2b2; font-size: 11px; }
.table-panel { overflow: hidden; padding: 0; }.table-toolbar { padding: 17px 19px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }.search { max-width: 310px; padding: 10px 12px; }.table-wrap { overflow-x: auto; }table { width: 100%; border-collapse: collapse; }th, td { padding: 14px 18px; border-bottom: 1px solid #edf1f6; text-align: left; font-size: 13px; white-space: nowrap; }th { color: #65758c; background: #f8fafc; font-size: 11px; letter-spacing: .05em; text-transform: uppercase; }tbody tr:hover { background: #fbfdff; }td strong { display: block; }.subtext { margin-top: 4px; color: #8492a6; font-size: 11px; }
.badge { display: inline-flex; align-items: center; padding: 5px 8px; border-radius: 99px; font-size: 11px; font-weight: 800; }.badge.Completed,.badge.Resilient,.badge.Ready,.badge.Authorized,.badge.Test,.badge.low { color: #167855; background: #e0f7ee; }.badge.Scheduled,.badge.Coaching,.badge.medium { color: #9a6917; background: #fff2d8; }.badge.Draft,.badge.unrated { color: #65758c; background: #edf1f6; }.badge.Running { color: #2261b8; background: #e5efff; }.badge.high,.badge.At { color: #b23b48; background: #ffe7ea; }
.progress { width: 100px; height: 7px; overflow: hidden; background: #e9eef5; border-radius: 99px; }.progress span { height: 100%; display: block; background: var(--blue); border-radius: inherit; }
.risk-progress span{background:linear-gradient(90deg,#efb44c,#e85666)}.badge.critical,.badge.High,.badge.high{color:#a62e3d;background:#ffe4e8}.badge.Medium,.badge.medium{color:#956311;background:#fff0cf}.badge.Low,.badge.low{color:#167855;background:#e0f7ee}
.card-grid { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(240px, 1fr)); gap: 16px; }.content-card { min-width: 0; padding: 19px; background: white; border: 1px solid var(--line); border-radius: var(--radius); }.card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.card-icon { width: 42px; height: 42px; display: grid; place-items: center; color: var(--blue); background: #eaf3ff; border-radius: 12px; font-size: 20px; }.content-card h3 { margin: 18px 0 6px; font-size: 16px; }.content-card p { color: var(--ink-soft); font-size: 13px; line-height: 1.55; }.card-meta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 18px; padding-top: 15px; border-top: 1px solid var(--line); color: #6c7b8f; font-size: 11px; }
.training-tabs{display:flex;gap:7px;margin:-8px 0 20px;padding:5px;width:max-content;max-width:100%;background:#eaf0f6;border-radius:12px}.training-tabs button{padding:10px 15px;color:var(--ink-soft);background:transparent;border:0;border-radius:9px;font-weight:800}.training-tabs button.active{color:var(--ink);background:var(--white);box-shadow:0 3px 12px #173f6b12}.training-tabs span{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:5px;color:#fff;background:var(--blue);border-radius:99px;font-size:10px}.training-grid{grid-template-columns:repeat(2,minmax(280px,1fr))}.training-card{padding:0;overflow:hidden}.training-card .module-visual{height:150px;display:grid;place-items:center;background:linear-gradient(140deg,#eef8ff,#f8fbff);color:#2f7cf6}.module-visual svg{width:118px;height:118px}.training-card .card-top,.training-card h3,.training-card>p,.training-card .outcome-list,.training-card .card-meta,.training-card .module-actions{margin-left:20px;margin-right:20px}.training-card .card-top{margin-top:18px;align-items:center}.module-category{color:var(--ink-soft);font-size:11px;font-weight:700}.training-card h3{font-size:20px;margin-top:14px}.outcome-list{padding-left:20px;color:var(--ink-soft);font-size:12px;line-height:1.8}.outcome-list li::marker{color:var(--green)}.module-actions{display:flex;gap:8px;margin-top:16px;margin-bottom:20px}.module-actions .button{flex:1}.training-progress{display:flex;align-items:center;gap:8px}.training-progress strong{font-size:11px}.preview-hero{display:grid;grid-template-columns:140px 1fr;gap:20px;align-items:center}.preview-hero .module-visual{display:grid;place-items:center;background:#eef7ff;border-radius:16px}.preview-hero .module-visual svg{width:110px}.curriculum{display:grid;gap:8px;margin:20px 0}.curriculum>div{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:13px;background:var(--paper);border:1px solid var(--line);border-radius:10px}.curriculum>div>span{color:var(--blue);font-weight:900}.curriculum strong,.curriculum small{display:block}.curriculum small{margin-top:5px;color:var(--ink-soft);line-height:1.45}.badge.In-progress{color:#2261b8;background:#e5efff}.badge.Assigned{color:#9a6917;background:#fff2d8}.badge.Overdue{color:#b23b48;background:#ffe7ea}.modal:has(#trainingAssignmentForm),.modal:has(.curriculum){width:min(100%,760px)}
.remediation-list{display:grid;gap:10px;margin-top:20px}.remediation-heading{padding-bottom:4px}.remediation-heading h3{margin:0}.remediation-heading p{margin:5px 0;color:var(--ink-soft);font-size:12px;line-height:1.5}.remediation-card{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px;border:1px solid #cfe0f5;border-radius:13px;background:linear-gradient(135deg,#f4f9ff,#fff)}.remediation-card h3{margin:6px 0 3px;font-size:16px}.remediation-card p{margin:0;color:var(--ink-soft);font-size:12px}.remediation-people{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.remediation-people span{padding:6px 8px;background:#e7f1ff;border-radius:7px;font-size:11px;font-weight:800}.remediation-people small{font-weight:500;color:var(--ink-soft)}.modal:has(.remediation-list){width:min(100%,900px)}[data-theme="dark"] .remediation-card{background:#10273e;border-color:#294b6c}[data-theme="dark"] .remediation-people span{background:#173a5f}@media(max-width:650px){.remediation-card{align-items:stretch;flex-direction:column}.remediation-card .button{width:100%}}
.report-hero { display: grid; grid-template-columns: 200px 1fr; gap: 28px; align-items: center; }.score-ring { --score: 78; width: 170px; height: 170px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--blue) calc(var(--score)*1%), #e7edf5 0); position: relative; }.score-ring::after { content: ""; position: absolute; inset: 13px; background: white; border-radius: 50%; }.score-ring span { position: relative; z-index: 1; font-size: 36px; font-weight: 850; }.score-ring small { display: block; color: var(--ink-soft); font-size: 11px; font-weight: 600; text-align: center; }.insight-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }.insight { padding: 15px; background: #f7f9fc; border-radius: 12px; }.insight strong { display: block; font-size: 20px; }.insight span { display: block; margin-top: 5px; color: var(--ink-soft); font-size: 12px; }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }.setting-row { display: flex; justify-content: space-between; gap: 30px; padding: 16px 0; border-bottom: 1px solid var(--line); }.setting-row:last-child { border-bottom: 0; }.setting-row strong { font-size: 14px; }.setting-row p { margin: 5px 0 0; color: var(--ink-soft); font-size: 12px; }.toggle { width: 42px; height: 24px; position: relative; flex: 0 0 auto; border-radius: 99px; background: var(--green); }.toggle::after { content: ""; position: absolute; width: 18px; height: 18px; right: 3px; top: 3px; background: white; border-radius: 50%; box-shadow: 0 2px 5px rgba(0,0,0,.2); }
.empty-state { padding: 58px 20px; text-align: center; color: var(--ink-soft); }.empty-state strong { display: block; margin-bottom: 7px; color: var(--ink); font-size: 16px; }
.empty-workspace { min-height:calc(100vh - 150px);display:grid;place-items:center;align-content:center;text-align:center;gap:12px}.empty-workspace .brand-symbol{width:64px;height:74px;font-size:28px}.empty-workspace h1{margin:10px 0 0;font-size:34px}.empty-workspace p{max-width:540px;margin:0 0 12px;color:var(--ink-soft);line-height:1.6}.organization-list{display:grid;gap:9px}.organization-choice{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:12px;text-align:left}.organization-choice span{color:var(--ink-soft);font-size:12px}.organization-choice.active{border-color:var(--blue);box-shadow:0 0 0 2px #2f7cf622}
.modal-backdrop { position: fixed; z-index: 50; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(4,14,29,.58); backdrop-filter: blur(4px); }.modal { width: min(100%, 580px); max-height: 90vh; overflow: auto; background: white; border-radius: 18px; box-shadow: 0 30px 90px rgba(0,0,0,.25); }.modal header { display: flex; align-items: flex-start; justify-content: space-between; padding: 23px 25px; border-bottom: 1px solid var(--line); }.modal h2 { margin: 4px 0 0; font-size: 22px; }.modal #modalBody { padding: 24px; }.modal .kicker { margin: 0; }.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }.form-grid .wide { grid-column: 1/-1; }.form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }.safe-callout { padding: 13px; display: flex; gap: 10px; color: #396754; background: #eaf8f2; border: 1px solid #cdeedf; border-radius: 10px; font-size: 12px; line-height: 1.5; }
.recipient-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px;padding:12px 14px;background:var(--paper);border:1px solid var(--line);border-radius:10px}.recipient-toolbar label{display:flex;align-items:center;gap:9px;margin:0}.recipient-toolbar input,.recipient-row input{width:18px;height:18px;accent-color:var(--blue)}.recipient-toolbar strong{font-size:12px;color:var(--ink-soft)}.recipient-list{display:grid;gap:8px;max-height:330px;overflow:auto;margin-bottom:14px}.recipient-row{display:grid;grid-template-columns:20px 38px minmax(0,1fr) auto;align-items:center;gap:11px;margin:0;padding:12px;border:1px solid var(--line);border-radius:11px;background:var(--white);cursor:pointer}.recipient-row:hover{border-color:#9bbff4}.recipient-row.disabled{opacity:.58;cursor:not-allowed}.recipient-copy{min-width:0}.recipient-copy strong,.recipient-copy small{display:block}.recipient-copy small{margin-top:3px;color:var(--ink-soft);font-size:11px;overflow:hidden;text-overflow:ellipsis}.recipient-row .avatar{width:36px;height:36px}
.wizard-section{display:flex;align-items:flex-start;gap:12px;margin:22px 0 14px}.wizard-section:first-child{margin-top:0}.wizard-section h3{margin:0;font-size:16px}.wizard-section p{margin:4px 0 0;color:var(--ink-soft);font-size:12px}.step-number{width:28px;height:28px;display:grid;place-items:center;flex:0 0 auto;color:white;background:var(--blue);border-radius:9px;font-weight:800}.sender-card{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid var(--line);border-radius:11px;background:var(--paper)}.sender-card div{flex:1}.sender-card strong,.sender-card small{display:block}.sender-card small{margin-top:3px;color:var(--ink-soft)}.authorization-check{display:flex;align-items:flex-start;gap:11px;padding:14px;border:1px solid #b9d5ff;border-radius:11px;background:#eef6ff}.authorization-check input{width:19px;height:19px;margin-top:1px;accent-color:var(--blue)}.authorization-check strong,.authorization-check small{display:block}.authorization-check small{margin-top:5px;color:var(--ink-soft);line-height:1.45}.modal:has(#campaignForm){width:min(100%,760px)}[data-theme="dark"] .authorization-check{background:#102a48;border-color:#315f94}
.toast-region { position: fixed; z-index: 80; right: 22px; bottom: 22px; display: grid; gap: 10px; }.toast { width: min(360px, calc(100vw - 44px)); padding: 14px 16px; color: white; background: #102a4a; border-radius: 12px; box-shadow: var(--shadow); animation: slide-in .25s ease; font-size: 13px; }.toast.error { background: #a63c49; }@keyframes slide-in { from { transform: translateY(10px); opacity: 0; } }
@media (max-width: 1100px) { .metric-grid { grid-template-columns: repeat(2,1fr); }.card-grid { grid-template-columns: repeat(2, minmax(220px,1fr)); }.dashboard-grid { grid-template-columns: 1fr; }.login-shell { grid-template-columns: 1fr; }.login-visual { display: none; }.login-panel { min-height: 100vh; }.brand-dark { margin-bottom: 50px; } }
@media (max-width: 760px) { .app-shell { display: block; }.sidebar { transform: translateX(-105%); transition: transform .2s ease; box-shadow: 20px 0 50px rgba(0,0,0,.2); }.sidebar.open { transform: translateX(0); }.main { width: 100%; margin-left: 0; }.menu-button { display: grid; }.topbar { padding: 0 16px; }.environment-badge { display: none; }.content { padding: 20px 15px; }.page-header { align-items: flex-start; flex-direction: column; }.metric-grid,.card-grid,.settings-grid,.insight-list { grid-template-columns: 1fr; }.report-hero { grid-template-columns: 1fr; justify-items: center; }.form-grid { grid-template-columns: 1fr; }.form-grid .wide { grid-column: auto; }.login-panel { padding: 28px; }.table-toolbar { align-items: stretch; flex-direction: column; }.search { max-width: none; } }
@media (max-width: 460px) { .metric-grid { grid-template-columns: 1fr; }.workspace small { display: none; }.topbar-actions .icon-button { display: none; }.content { padding: 18px 12px; }.page-header h1 { font-size: 26px; } }
@media (max-width: 460px) { .topbar-actions #themeButton { display: grid; } }

.module-picker{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:310px;overflow:auto;margin:10px 0}.module-choice{display:grid;grid-template-columns:20px 25px 1fr;align-items:center;gap:9px;margin:0;padding:12px;border:1px solid var(--line);border-radius:11px;cursor:pointer}.module-choice:has(input:checked){border-color:var(--blue);background:#eef6ff}.module-choice input{width:18px;height:18px;accent-color:var(--blue)}.module-choice strong,.module-choice small{display:block}.module-choice small{margin-top:4px;color:var(--ink-soft);font-size:11px}.module-check{display:grid;place-items:center;width:22px;height:22px;color:white;background:var(--blue);border-radius:7px;opacity:.25}.module-choice:has(input:checked) .module-check{opacity:1}.selection-summary{display:flex;justify-content:space-between;gap:12px;margin:8px 0 17px;color:var(--ink-soft);font-size:12px}.modal:has(#moduleEditorForm){width:min(100%,980px)}.modal:has(#moduleEditorForm) textarea[spellcheck="false"]{font-family:ui-monospace,monospace;font-size:12px;line-height:1.5}[data-theme="dark"] .module-choice:has(input:checked){background:#102a48}@media(max-width:650px){.module-picker{grid-template-columns:1fr}}

.organization-manage{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:10px;padding:8px;border:1px solid var(--line);border-radius:13px}.organization-manage.active{border-color:var(--blue)}.organization-manage .organization-choice{border:0;width:100%}.workspace-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.organization-manage.deleted{align-items:center;padding:15px;background:var(--paper)}.organization-manage.deleted strong,.organization-manage.deleted span{display:block}.secret-box{display:grid;gap:7px;margin:18px 0;padding:18px;background:var(--paper);border:1px solid var(--line);border-radius:12px}.secret-box small{color:var(--ink-soft)}.secret-box code{padding:12px;color:var(--blue);background:var(--white);border-radius:8px;font-size:17px;letter-spacing:.12em;word-break:break-all}#mfaLoginForm details{margin:14px 0}#mfaLoginForm .button+button{margin-top:9px}@media(max-width:760px){.organization-manage{grid-template-columns:1fr}.workspace-actions .button{flex:1}}

[data-theme="dark"] .topbar { background: rgba(12,29,48,.94); }
[data-theme="dark"] .metric-card,
[data-theme="dark"] .panel,
[data-theme="dark"] .content-card,
[data-theme="dark"] .modal { background: var(--white); }
[data-theme="dark"] .button.outline { color: var(--ink); background: #142a43; }
[data-theme="dark"] .button.secondary { color: var(--ink); background: #1b334d; }
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea { color: var(--ink); background: #0c1d31; border-color: #36506d; }
[data-theme="dark"] label { color: #c7d6e8; }
[data-theme="dark"] th { color: #9fb0c6; background: #0d1d30; }
[data-theme="dark"] th,
[data-theme="dark"] td,
[data-theme="dark"] .activity { border-color: #253a52; }
[data-theme="dark"] tbody tr:hover { background: #14283f; }
[data-theme="dark"] .insight { background: #0c1d31; }
[data-theme="dark"] .score-ring::after { background: var(--white); }
[data-theme="dark"] .activity-icon,
[data-theme="dark"] .card-icon { background: #173456; }
[data-theme="dark"] .safe-callout { color: #aee2cf; background: #10352f; border-color: #245c4c; }
[data-theme="dark"] .demo-note { color: #b8c8da; background: #10273d; border-color: #29425d; }

/* v2.9.0 — Platform-managed infrastructure, support, CSV import and visual content studio */
.sender-line{display:grid;gap:3px;margin:5px 0}.sender-line code{font-size:11px;color:var(--ink-soft);word-break:break-all}.row-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.sender-manage-list{display:grid;gap:9px;margin-top:14px}.sender-manage-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}.sender-manage-row strong,.sender-manage-row code,.sender-manage-row small{display:block}.sender-manage-row code{margin:4px 0;color:var(--blue);word-break:break-all}.sender-manage-row small{color:var(--ink-soft)}.link-button{padding:0;color:var(--blue);background:none;border:0;font:inherit;font-weight:800;cursor:pointer;text-align:left}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.info-list{display:grid;gap:0}.info-list>div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid var(--line)}.info-list>div:last-child{border-bottom:0}.info-list span{color:var(--ink-soft);font-size:12px}.info-list strong{text-align:right}.limit-grid{display:grid;grid-template-columns:repeat(5,minmax(100px,1fr));gap:12px}.limit-grid>div{padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:12px;text-align:center}.limit-grid strong,.limit-grid span{display:block}.limit-grid strong{font-size:22px}.limit-grid span{margin-top:4px;color:var(--ink-soft);font-size:11px}.workspace-domain-grid{display:grid;grid-template-columns:repeat(2,minmax(280px,1fr));gap:16px}.workspace-domain-card{display:grid;gap:12px;padding:18px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius)}.workspace-domain-card h3{margin:5px 0}.workspace-domain-card p{margin:0;color:var(--ink-soft)}
.ticket-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px;color:var(--ink-soft);font-size:12px}.ticket-thread{display:grid;gap:10px;max-height:350px;overflow:auto;padding:4px}.ticket-message{padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}.ticket-message>div{display:flex;justify-content:space-between;gap:12px}.ticket-message span{color:var(--ink-soft);font-size:11px}.ticket-message p{margin:10px 0 0;white-space:pre-wrap;line-height:1.55}.modal:has(#supportTicketReplyForm){width:min(100%,760px)}
.import-actions{margin-top:10px}.import-preview{margin-top:14px}.import-summary{display:flex;align-items:center;gap:9px;margin-bottom:10px}.error-callout{color:#9b3340;background:#ffedf0;border-color:#ffcbd2}
.studio-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:26px 0 12px}.studio-heading h2,.studio-heading h3{margin:4px 0}.studio-heading p{margin:4px 0 0;color:var(--ink-soft);font-size:12px}.builder-stack{display:grid;gap:14px}.builder-card{padding:17px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}.builder-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}.builder-head>div:first-child{flex:1}.builder-title{width:100%;margin-top:4px;padding:5px 0!important;border:0!important;background:transparent!important;font-size:18px!important;font-weight:850;color:var(--ink)!important}.editor-mode-tabs{display:flex;gap:6px;margin:13px 0 8px}.editor-mode-tabs button,.rich-toolbar button{padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--white);color:var(--ink);font-size:12px;font-weight:750;cursor:pointer}.editor-mode-tabs button.active{color:#fff;background:var(--blue);border-color:var(--blue)}.rich-toolbar{display:flex;gap:5px;flex-wrap:wrap;padding:8px;border:1px solid var(--line);border-bottom:0;border-radius:10px 10px 0 0;background:var(--white)}.rich-editor{min-height:150px;padding:14px;border:1px solid var(--line);border-radius:0 0 10px 10px;background:var(--white);line-height:1.6;outline:none}.rich-editor:focus{border-color:var(--blue);box-shadow:0 0 0 3px #2f7cf61c}.section-html-editor textarea{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;line-height:1.55}.media-drop{display:block;margin-top:12px;padding:12px;border:1px dashed #a9b9cb;border-radius:10px;background:var(--white)}.media-drop input{margin-top:8px}.existing-media{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.existing-media span{padding:6px 8px;background:var(--white);border:1px solid var(--line);border-radius:8px;color:var(--ink-soft);font-size:11px}.question-options{display:grid;gap:7px;margin:10px 0}.question-option{display:grid;grid-template-columns:20px 1fr;align-items:center;gap:8px;margin:0}.question-option>input[type="radio"]{width:17px;height:17px;accent-color:var(--blue)}.exam-settings{margin:12px 0 16px}.toggle-label{display:flex!important;align-items:center;gap:9px}.toggle-label input{width:18px;height:18px;accent-color:var(--blue)}.modal:has(#moduleEditorForm){width:min(100%,1050px)}
[data-theme="dark"] .builder-card,[data-theme="dark"] .workspace-domain-card,[data-theme="dark"] .sender-manage-row,[data-theme="dark"] .ticket-message{background:#102238}[data-theme="dark"] .rich-editor,[data-theme="dark"] .rich-toolbar,[data-theme="dark"] .media-drop,[data-theme="dark"] .existing-media span{background:#0c1d31}
@media(max-width:900px){.limit-grid{grid-template-columns:repeat(2,1fr)}.workspace-domain-grid,.info-grid{grid-template-columns:1fr}}@media(max-width:650px){.sender-manage-row{grid-template-columns:1fr}.studio-heading,.builder-head{align-items:stretch;flex-direction:column}.limit-grid{grid-template-columns:1fr 1fr}.ticket-message>div{flex-direction:column}.header-actions{flex-wrap:wrap}}

/* v2.13.0 — multi-tenant delivery + secure account recovery + self-service account profile */
.template-builder-section{margin-top:18px;padding:18px;border:1px solid var(--line);border-radius:15px;background:var(--paper)}
.template-builder-section .studio-heading{margin:0 0 12px}.composer-toolbar{align-items:center}.composer-toolbar select{width:auto;min-width:95px;padding:7px 9px;font-size:12px}.template-email-rich{min-height:240px;direction:auto}.template-email-rich[dir="rtl"]{text-align:right}.template-builder-section textarea#templateEmailSource,.template-builder-section textarea#landingPageHtml{width:100%;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;line-height:1.55;min-height:250px}.landing-preview{width:100%;height:420px;margin-top:14px;border:1px solid var(--line);border-radius:12px;background:#fff}.dns-verification-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0 16px}.dns-verification-grid article{padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}.dns-verification-grid code,.dns-details code{display:block;margin:7px 0;padding:9px;background:var(--white);border:1px solid var(--line);border-radius:8px;white-space:normal;word-break:break-all;font-size:11px}.dns-details{margin-top:8px}.dns-details summary{cursor:pointer;color:var(--blue);font-size:11px;font-weight:800}.dns-details>div{padding-top:8px}.template-builder-section .editor-mode-tabs{margin-top:0}
[data-theme="dark"] .template-builder-section,[data-theme="dark"] .dns-verification-grid article{background:#102238}[data-theme="dark"] .landing-preview{background:#fff}
@media(max-width:760px){.dns-verification-grid{grid-template-columns:1fr}.composer-toolbar select{min-width:0;max-width:130px}.template-builder-section{padding:13px}}
.login-help { display:flex; justify-content:flex-end; margin:-6px 0 16px; }
.text-button { border:0; background:transparent; color:var(--primary); font:inherit; font-weight:700; cursor:pointer; padding:2px 0; }
.text-button:hover { text-decoration:underline; }
.form-success { color:#16745b; font-size:13px; line-height:1.55; min-height:18px; margin-top:12px; }
.reset-signin-link { display:flex; align-items:center; justify-content:center; text-decoration:none; margin-top:10px; }