/* Semantic shell tokens; existing delivery/approval status colors retain meaning. */
:root{--saj-canvas:#f4f6fa;--saj-surface:#fff;--saj-ink:#202b50;--saj-muted:#536078;--saj-line:#dce2ed;--saj-brand:#252f68;--saj-selected:#e9edfc;--saj-focus:#315bd5;--saj-radius:18px;--saj-nav-height:78px;color-scheme:light}
*{box-sizing:border-box}html{scroll-padding-block:85px 115px}body{background:var(--saj-canvas);color:var(--saj-ink)}[hidden]{display:none!important}:is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--saj-focus);outline-offset:3px}button,summary{touch-action:manipulation}button{min-height:44px}input,select{min-height:44px}textarea,input,select{max-width:100%}.saj-icon{width:22px;height:22px;flex:0 0 22px}.skip-link{position:fixed;top:8px;inset-inline-start:8px;z-index:3000;transform:translateY(-150%);background:white;color:var(--saj-brand);padding:14px}.skip-link:focus{transform:none}.sidebar{width:250px;background:var(--saj-surface);border-inline-end:1px solid var(--saj-line);padding:24px 16px;overflow-y:auto}.sidebar .brand{gap:10px;margin:0 0 24px}.brand img{width:42px;height:42px;object-fit:contain}.brand span{font-size:1rem;line-height:1.35;direction:ltr}.brand small{letter-spacing:1px;font-size:0.8125rem;color:var(--saj-muted);margin-top:5px}.sidebar nav{overflow:visible;flex:none}.nav-group{margin-bottom:20px}.nav-group h2{margin:0 12px 8px;color:var(--saj-muted);font-size:0.8125rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.sidebar .nav{display:flex;gap:12px;align-items:center;min-height:44px;padding:11px 12px;border-radius:12px;font-size:0.8125rem;text-align:start;color:var(--saj-muted)}.sidebar .nav:hover{background:#f3f5fa}.sidebar .nav.active{background:var(--saj-selected);color:var(--saj-brand);font-weight:700}.sidebar-bottom{margin-top:8px}.sidebar .logout{display:none}.main{min-width:0}.topbar{min-height:76px;padding:14px 32px;gap:12px;background:var(--saj-surface);border-bottom:1px solid var(--saj-line)}.topbar-title{display:flex;align-items:center;min-width:0;gap:10px}.topbar .account{gap:10px;display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end}.account .avatar{display:none}.topbar .breadcrumb,.topbar .slash{display:none}#page-crumb{font-size:1rem;font-weight:600}#notification-bell{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:var(--saj-canvas);border:1px solid var(--saj-line);border-radius:14px;color:var(--saj-brand)}#notification-count:not(:empty){position:absolute;top:-5px;inset-inline-end:-5px;font-size:0.8125rem;min-width:19px;line-height:19px;padding:0 4px}.account-menu{position:relative}.account-menu>summary{display:flex;align-items:center;justify-content:center;width:44px;min-height:44px;cursor:pointer;list-style:none;border-radius:50%;border:1px solid var(--saj-line);color:var(--saj-brand)}.account-menu>summary::-webkit-details-marker{display:none}.account-popover{position:absolute;inset-inline-end:0;top:54px;z-index:500;width:280px;background:var(--saj-surface);padding:18px;border:1px solid var(--saj-line);border-radius:var(--saj-radius);box-shadow:0 15px 45px #202b5024;max-height:70dvh;overflow:auto}.account-popover #staff-name{display:block;font-weight:700;margin-bottom:12px}.account-popover button{width:100%;margin-block:6px;text-align:start}.account-popover label{display:block;margin-top:12px;font-size:0.8125rem}.account-popover #ui-language{max-width:none;width:100%;margin-block:8px}.account-popover #install-app{white-space:normal}.shell-context-bar{padding:12px 32px 0}.shell-context-bar p{font-size:0.8125rem;color:var(--saj-muted);margin:0 0 12px;line-height:1.5}#shell-context{display:flex;gap:8px;flex-wrap:wrap}#shell-context:empty{display:none}#content{padding:24px 32px 50px;min-width:0;overflow-wrap:anywhere}#content>.eyebrow{font-size:0.8125rem}.page-heading{gap:14px;margin-block:0 24px}.page-heading h1{font-size:1.75rem;letter-spacing:-.6px}.page-heading p{line-height:1.6;color:var(--saj-muted)}.panel{border-radius:var(--saj-radius);box-shadow:0 3px 12px #202b5004}.destination-group{margin-block:26px}.destination-group h2{font-size:0.9375rem;margin-bottom:12px}.destination-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}.destination-tile{display:flex;justify-content:space-between;gap:16px;align-items:center;text-align:start;background:var(--saj-surface);border:1px solid var(--saj-line);border-radius:14px;padding:18px;color:var(--saj-ink);min-height:76px}.destination-tile:hover{border-color:var(--saj-brand);background:#f9faff}.destination-tile strong{font-size:0.875rem}.destination-tile small{display:block;margin-top:6px;font-size:0.8125rem;line-height:1.5;color:var(--saj-muted)}.shell-help{padding:24px;line-height:1.8}#primary-navigation{display:none}.notification-actions>summary{min-height:44px;display:flex;align-items:center;cursor:pointer}.notification-card{overflow-wrap:anywhere}.notification-card .actions button{min-height:44px}.notification-card .actions{gap:10px}dialog{max-height:85dvh;overflow:auto}footer{padding:20px 32px;color:var(--saj-muted)}
@media(min-width:1050px){.team-inbox{grid-template-columns:minmax(240px,32%) minmax(0,1fr)}}
@media(max-width:1000px){.sidebar{display:none}.main,[dir=rtl] .main{margin:0;width:100%}.topbar{padding:12px 20px;min-height:70px;flex-wrap:wrap}.topbar .account{flex-wrap:nowrap}.topbar .badge{display:none}.shell-context-bar{padding:12px 20px 0}#content{padding:20px 20px calc(110px + env(safe-area-inset-bottom))}footer{display:none}#primary-navigation{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;z-index:400;bottom:calc(12px + env(safe-area-inset-bottom));inset-inline:16px;max-width:620px;margin-inline:auto;padding:7px;background:#fff;border:1px solid var(--saj-line);border-radius:26px;box-shadow:0 8px 35px #202b502e;gap:3px}#primary-navigation button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:58px;padding:6px 2px;background:transparent;border:0;border-radius:19px;color:var(--saj-muted);font:inherit;font-size:0.8125rem;line-height:1.3}#primary-navigation button.active{background:var(--saj-selected);color:var(--saj-brand);font-weight:700}#primary-navigation button:disabled{opacity:.5}#primary-navigation span{max-width:100%;overflow-wrap:anywhere}.keyboard-open #primary-navigation{display:none}.topbar #connection-select{max-width:190px}.page-heading h1{font-size:1.5625rem}.local-test-banner{top:0;bottom:auto;position:relative}}
@media(max-width:520px){.topbar{padding:10px 16px;align-items:center;gap:8px}.topbar-title{flex:1}.topbar .account{gap:8px}#page-crumb{font-size:0.9375rem}.topbar #connection-selector{order:3;position:static}.topbar #connection-select{max-width:130px;font-size:0.8125rem}.shell-context-bar{padding:12px 16px 0}#content{padding:18px 16px calc(115px + env(safe-area-inset-bottom))}.page-heading{align-items:flex-start;flex-wrap:wrap;gap:8px;margin-bottom:16px}.page-heading h1{font-size:1.5rem}.page-heading p{font-size:0.8125rem}.destination-grid{grid-template-columns:1fr}.destination-group{margin-block:22px}#primary-navigation{inset-inline:10px;bottom:calc(10px + env(safe-area-inset-bottom));border-radius:24px}.account-popover{position:fixed;top:76px;inset-inline-end:12px;width:min(300px,calc(100vw - 24px))}.topbar #shell-back{padding:6px;min-width:44px}.topbar #shell-back span{display:none}.table-wrap{max-width:100%;overflow:auto}.notification-card .actions{flex-wrap:wrap}.inbox-filters{grid-template-columns:1fr 1fr}.inbox-filters .field:first-child{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}[dir=rtl] .destination-tile>.saj-icon,[dir=rtl] #shell-back .saj-icon{transform:rotate(180deg)}
body:has(#workspace[hidden]) #primary-navigation{display:none}
@media(max-width:700px){body[data-saj-view=daily] #shell-scope{display:none}body[data-saj-view=daily] #content>.eyebrow{display:none}body[data-saj-view=daily] .page-heading{flex-wrap:nowrap;align-items:center}body[data-saj-view=daily] .page-heading>div{min-width:0;flex:1}body[data-saj-view=daily] .page-heading p{display:none}body[data-saj-view=daily] .panel-head{padding:16px;gap:10px;flex-wrap:wrap}body[data-saj-view=daily] .panel-head h2{font-size:1rem}body[data-saj-view=daily] .panel-head .small{font-size:0.8125rem}.work-queue-control{margin-top:12px}#primary-navigation button{font-size:0.8125rem}#primary-navigation span{overflow-wrap:normal;word-break:normal;white-space:nowrap}.work-caption{line-height:1.6}}
/* Contrast corrections measured in the representative synthetic journeys. */
:root{--muted:var(--saj-muted)}.eyebrow,.panel-head .small{color:var(--saj-muted)}.notice{color:#536078}.badge{color:#536078}.badge.amber,.badge.queued,.badge.scheduled,.badge.sending{color:#7b5b16}.pilot-note{color:#765b20}
@media(min-width:1001px){body[data-saj-view=notifications] #content{max-width:860px;margin-inline-start:auto;width:100%}}

.connector-provider{display:inline-flex;align-items:center;gap:8px;font-size:0.8125rem;color:var(--saj-ink)}.connector-provider img,.connector-provider-mark{object-fit:contain;flex-shrink:0}
/* The label supplies the touch target; native checkbox glyphs stay compact. */
input[type=checkbox],input[type=radio]{width:20px;min-height:20px;height:20px;flex:0 0 20px;justify-self:start;accent-color:var(--saj-brand)}label:has(>input[type=checkbox]),label:has(>input[type=radio]){display:flex;align-items:center;gap:12px;min-height:44px;padding-block:4px}label>input[type=checkbox],label>input[type=radio]{order:-1;margin:0}#notification-preferences{display:grid;gap:14px}#notification-preferences>label{display:grid;gap:7px}#notification-preferences>label:has(>input[type=checkbox]){display:flex}#notification-preferences fieldset{border:1px solid var(--saj-line);border-radius:12px;padding:14px;margin:0}#notification-preferences legend{padding-inline:6px;font-size:0.8125rem;font-weight:600}

/* Keep the title and connection picker in separate rows on phones. */
@media(max-width:520px){
 .topbar{display:grid;grid-template-columns:minmax(0,1fr) 44px 44px;height:auto;gap:10px 8px;padding-top:calc(10px + env(safe-area-inset-top,0px))}
 .topbar-title{grid-column:1;grid-row:1;min-width:0}
 #page-crumb{min-width:0;overflow-wrap:anywhere;line-height:1.5}
 .topbar .account{display:contents}
 .topbar #notification-bell{grid-column:2;grid-row:1}
 .topbar .account-menu{grid-column:3;grid-row:1}
 .topbar #connection-selector{grid-column:1/-1;grid-row:2;width:100%;min-width:0}
 .topbar #connection-select{width:100%;max-width:100%;font-size:1rem}
 .account-popover #ui-language{font-size:1rem}
 #primary-navigation{inset-inline:6px;padding:5px;gap:0}
 #primary-navigation button{padding-inline:0}
 #primary-navigation span{white-space:normal;overflow-wrap:anywhere;line-height:1.25}
}

/* Wrapped tablet headers grow with their controls instead of covering page content. */
@media(min-width:521px) and (max-width:1000px){.topbar{height:auto}}

/* Six main sections; related screens stay in a permission-filtered section menu. */
.sidebar nav{display:grid;gap:6px;margin-top:0}.sidebar nav>.nav{margin:0;white-space:normal}.sidebar nav>.nav .nav-text{display:block;min-width:0;width:auto;font:inherit}
#shell-context{align-items:center;padding-block:4px 8px}#shell-context .section-label{font-size:0.8125rem;font-weight:700;color:var(--saj-brand);margin-inline-end:6px}#shell-context button{white-space:normal;text-align:start}#shell-context button.active{background:var(--saj-selected);border-color:var(--saj-focus);color:var(--saj-brand)}
@media(max-width:1000px){#primary-navigation{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}}


#primary-navigation:empty{display:none}

/* One permission-filtered set of destinations, with a compact native picker on phones. */
.section-tabs{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-width:0;max-width:100%}.section-picker{display:none}
@media(max-width:600px){
 #shell-context{display:block;padding-block:4px 8px}#shell-context:empty{display:none}
 #shell-context .section-tabs{display:none}
 #shell-context .section-picker{display:grid;gap:7px;margin:0;min-width:0;width:100%;font-size:0.8125rem;font-weight:600;color:var(--saj-brand)}
 #section-view-select{width:100%;max-width:100%;min-width:0;min-height:48px;padding:12px;border:1px solid var(--saj-line);border-radius:12px;background:var(--saj-surface);color:var(--saj-ink);font:inherit;font-size:1rem;font-weight:500;line-height:1.5}
}
