:root{
  --navy:#101b2d;--navy2:#17263b;--teal:#0b8f8b;--teal-bright:#16aaa2;
  --orange:#f4a340;--ink:#162234;--muted:#647386;--line:#dce3ea;--page:#f4f6f9;
  --surface:#fff;--danger:#c4463a;--shadow:0 10px 30px rgba(27,42,65,.08);
}
html,body{max-width:100%;overflow-x:hidden;background:var(--page);font-family:Inter,"Segoe UI",system-ui,sans-serif;font-size:14px}
.sidebar{width:248px;padding:0 16px 18px;background:linear-gradient(180deg,#111d30 0%,#17283d 100%);border:0;box-shadow:8px 0 30px rgba(18,31,49,.08)}
.brand{margin:0 -16px 20px;padding:22px 22px 20px;background:transparent;border-bottom:1px solid rgba(255,255,255,.09);box-shadow:none}
.brand-mark.small{width:42px;height:42px;border-radius:12px;background:linear-gradient(145deg,var(--teal-bright),var(--teal));box-shadow:0 8px 20px rgba(11,143,139,.28)}
.brand strong{font-size:15px}.brand span{font-size:11px;color:#8fa5ba}
.sidebar nav{gap:6px}.sidebar nav button{min-height:44px;padding:11px 14px;border:0;border-radius:10px;color:#aebdcc;font-size:13px}
.sidebar nav button:hover{background:rgba(255,255,255,.06);border:0}.sidebar nav button.active{background:linear-gradient(90deg,rgba(22,170,162,.22),rgba(22,170,162,.07));box-shadow:inset 3px 0 0 #24c3b8;color:#fff;border:0}
.sidebar>.quiet{min-height:42px;border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.03);color:#afbecb}
main{margin-left:248px;background:var(--page)}
.topbar{min-height:78px;padding:14px 30px;background:rgba(255,255,255,.92);color:var(--ink);border:0;border-bottom:1px solid var(--line);box-shadow:0 4px 18px rgba(25,38,58,.05);backdrop-filter:blur(16px)}
.topbar .eyebrow{color:var(--teal);font-size:10px}.topbar h1{font-size:21px;font-weight:720;letter-spacing:-.02em}
.pill{padding:8px 12px;border-radius:99px;font-size:11px}.page,.page.popup-workspace{max-width:1320px;padding:26px 30px 56px}
.hero{padding:28px 30px;border:0;border-radius:18px;background:linear-gradient(120deg,#16263b,#1b344a);color:#fff;box-shadow:0 18px 44px rgba(20,36,55,.16)}
.hero h2{font-size:clamp(28px,3vw,40px);letter-spacing:-.035em}.hero p:not(.eyebrow){color:#b9cad8;font-size:14px}.hero .eyebrow{color:#63d5ce}.hero .secondary{background:#fff;color:#18384a;border:0}
.metrics{gap:14px;margin:18px 0}.metrics article,.panel,.module-card{padding:20px;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}
.metrics article{border-top:0;position:relative;overflow:hidden}.metrics article:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#b9c6d1}.metrics article:nth-child(1):before{background:var(--teal)}.metrics article:nth-child(2):before{background:#397eaf}.metrics article:nth-child(3):before{background:var(--orange)}.metrics article:nth-child(4):before{background:#c84b42}
.metrics span,.metrics small{font-size:11px}.metrics strong{font-size:28px;margin:7px 0 4px}.grid{gap:16px}.module-card{grid-template-columns:48px 1fr;gap:14px}.module-card h3,.panel h3{font-size:16px}.module-card p,.panel p{font-size:13px}.icon{width:48px;height:48px;border-radius:14px;font-size:21px}
.panel{margin-top:16px}.page-intro,.popup-workspace .page-intro{padding:20px 22px;margin-bottom:16px;border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:14px;background:#fff;color:var(--ink)}
.popup-workspace .page-intro p{color:var(--muted)}.popup-workspace .page-intro h2,.page-intro h2{color:var(--ink);font-size:25px;font-weight:740;letter-spacing:-.025em}
.platform-tabs{max-width:420px;display:flex;padding:5px;gap:5px;margin-bottom:16px;border:1px solid var(--line);border-radius:12px;background:#e8edf2}.platform-tabs button{flex:1;min-height:38px}.platform-tabs button.active{background:#fff;color:var(--ink);box-shadow:0 3px 12px rgba(25,42,62,.1)}
.popup-workspace .panel,.popup-workspace details{padding:20px;border-radius:16px;margin-bottom:16px;box-shadow:var(--shadow)}
button{min-height:40px;padding:9px 14px;border-radius:10px;font-size:13px;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}button:hover{transform:translateY(-1px)}
.primary{border-color:var(--teal);background:linear-gradient(135deg,var(--teal),var(--teal-bright));box-shadow:0 6px 14px rgba(11,143,139,.18)}
.action-row,.workflow-actions{gap:9px}.workflow-actions button{min-height:46px}.field-grid,.option-grid{gap:10px}.check-tile,.switch-row{padding:13px!important;border-radius:12px;background:#f8fafb}
.health-grid{gap:9px}.health-item{min-height:62px;padding:12px 12px 12px 32px;border-radius:12px;background:#f8fafb;font-size:12px}.health-item:before{left:13px;top:17px}.health-item strong{font-size:12px}.job-list{gap:9px}.job{padding:13px 15px;border-radius:12px}.job strong{font-size:13px}.job small{font-size:11px}
.journey{margin:0 0 16px;gap:8px}.journey li{min-height:58px;padding:12px;border-radius:12px}.execution-banner{padding:14px 16px;border-radius:12px}
.table-wrap{border-radius:12px}.toolbar{padding:10px;border-radius:12px}.empty{padding:22px;border-radius:11px}.fulfilment-metrics{gap:10px;margin-bottom:16px}.fulfilment-metrics>div{padding:15px 8px;border-radius:13px}.fulfilment-metrics strong{font-size:24px}
.job-drawer{width:min(620px,100vw);padding:20px;background:#f4f6f9}.drawer-head{padding:18px 20px;border:0;border-radius:14px;background:linear-gradient(120deg,#16263b,#1b344a)}.timeline article>div{padding:14px;border-radius:12px}.timeline p{font-size:13px}.timeline pre{font-size:11px}
.job-log-card{display:block!important;padding:0!important;border:1px solid var(--line)!important;border-radius:14px!important;overflow:hidden;background:#fff!important}.job-log-lines{padding:4px 16px}.job-log-line{display:grid;grid-template-columns:1fr auto;gap:4px 14px;padding:13px 0;border-bottom:1px solid #e7edf1}.job-log-line:last-child{border:0}.job-log-line span{font-size:11px;font-weight:750;text-transform:uppercase;color:var(--teal)}.job-log-line time{font-size:10px;color:var(--muted)}.job-log-line p{grid-column:1/-1;margin:0!important;color:#334b5b}.advanced-terminal{margin:0!important;border:0!important;border-radius:0!important;background:#0c1420!important}.advanced-terminal summary{padding:13px 16px;color:#d8e6ee;cursor:pointer;font:600 12px ui-monospace,SFMono-Regular,Consolas,monospace;list-style:none}.advanced-terminal summary::-webkit-details-marker{display:none}.advanced-terminal summary span{color:#53d8be}.advanced-terminal summary small{float:right;color:#7892a4}.advanced-terminal pre{max-height:420px!important;margin:0!important;padding:18px!important;border-radius:0!important;background:#080e17!important;color:#b7f7d8!important;font:11px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace!important;white-space:pre-wrap;overflow:auto}
.notification-panel .form-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.notification-panel .form-actions button{margin:0!important}.mail-test{border-color:#bfd0dc;background:#edf4f8;color:#24475b}.mail-test:hover{background:#dfeef5}.notification-panel .check-tile{position:relative;align-items:center!important;border-color:#d7e1e7;background:#fff}.notification-panel .check-tile input{appearance:none;width:22px!important;height:22px!important;min-height:22px!important;margin:0;border:1px solid #9db0bb;border-radius:6px;background:#fff}.notification-panel .check-tile input:checked{border-color:var(--teal);background:var(--teal)}.notification-panel .check-tile input:checked:after{content:"✓";display:grid;place-items:center;color:#fff;font-weight:800;font-size:14px}.notification-panel .switch i{width:44px;height:24px;border-radius:99px}.notification-panel .switch{flex-basis:44px;width:44px;height:24px}.notification-panel .switch i:after{width:20px;height:20px}.notification-panel .switch input:checked+i:after{transform:translateX(20px)}.email-log{display:grid;gap:8px}.email-log-row{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:12px;border:1px solid var(--line);border-radius:11px;background:#f9fbfc}.email-log-row p{margin:3px 0 5px}.email-log-row small{color:var(--muted)}.email-state{height:max-content;padding:4px 7px;border-radius:99px;background:#e8eef2;color:#41596a;font-size:9px;font-weight:800;text-transform:uppercase}.email-log-row.succeeded .email-state{background:#dcf3e8;color:#176b4b}.email-log-row.failed .email-state{background:#f9e1df;color:#9f3029}
.login-shell{background:radial-gradient(circle at 72% 22%,rgba(22,170,162,.2),transparent 28%),linear-gradient(145deg,#0e1929,#192b41)}.login-card{width:min(420px,100%);padding:34px;border:0;border-radius:20px;box-shadow:0 28px 80px rgba(4,12,24,.38)}
@media(max-width:1024px){.sidebar{width:220px}main{margin-left:220px}.page,.page.popup-workspace{padding:22px}.grid.two{grid-template-columns:1fr}}
@media(max-width:768px){main{margin-left:0}.topbar{min-height:68px;padding:10px 14px}.page,.page.popup-workspace{padding:16px 12px 36px}.hero{padding:23px 20px}.metrics{gap:9px}.popup-workspace .panel,.popup-workspace details{padding:16px}.platform-tabs{max-width:none}.sidebar{width:min(86vw,300px)}.job-drawer{padding:12px}}
@media(max-width:420px){.metrics{grid-template-columns:1fr 1fr}.metrics article{padding:14px}.metrics strong{font-size:23px}.popup-workspace .page-intro h2,.page-intro h2{font-size:21px}.fulfilment-metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:340px){#connections .panel,#connections form{min-width:0;max-width:100%}#connections input,#connections select,#connections textarea{min-width:0;max-width:100%}.topbar{max-width:100vw}.pill{white-space:nowrap}}
