:root{--ink:#102B48;--muted:#526981;--blue:#0C3663;--line:color-mix(in srgb, #A8BBD0 24%, white);--bg:color-mix(in srgb, #A8BBD0 8%, white);--green:#245787;--nav:#102B48;--gold:#526981;--red:#D83344;--red-dark:#D83344;--red-soft:color-mix(in srgb, #D83344 13%, white)}
body{background:var(--bg);color:var(--ink)}
h1,h2,h3,h4,.brand{font-family:Roboto,Inter,'Open Sans',sans-serif}
p,small,.form-hint,.detail-field{font-family:'Open Sans',Inter,Roboto,sans-serif}
.detail-field>div{white-space:pre-line;overflow-wrap:anywhere}
.customer-directory-table td:nth-child(5){max-width:220px;overflow:hidden;text-overflow:ellipsis}
button,a,input,select,textarea{transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s,transform .18s}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.sidebar{background:linear-gradient(180deg,#102B48 0%,#102B48 100%);box-shadow:8px 0 28px color-mix(in srgb, #102B48 5%, transparent)}
.brand{font-weight:700;letter-spacing:1.25px}.brand small{color:color-mix(in srgb, #0C3663 29%, white)}.brand-mark{border:0;border-radius:10px;background:var(--red);color:color-mix(in srgb, #A8BBD0 3%, white);width:39px;height:39px;font-size:24px;box-shadow:0 7px 19px color-mix(in srgb, color-mix(in srgb, #D83344 26%, white) 21%, transparent)}
.workspace-label,.nav-section{color:#0C3663}
nav button{border-radius:9px;color:color-mix(in srgb, #0C3663 17%, white);font-weight:500;min-height:43px}
nav button .icon{color:color-mix(in srgb, #0C3663 30%, white)}
nav button:hover{background:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 7%, transparent);color:color-mix(in srgb, #A8BBD0 3%, white);transform:translateX(2px)}
nav button.active{background:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 9%, transparent);border-color:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 6%, transparent);color:color-mix(in srgb, #A8BBD0 3%, white);box-shadow:inset 3px 0 var(--red);font-weight:700}
nav button.active .icon{color:color-mix(in srgb, #D83344 3%, white)}
nav button b{background:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 10%, transparent);border-radius:6px;color:color-mix(in srgb, #A8BBD0 3%, white)}
.sidebar-agenda{border:1px solid color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 13%, transparent);border-left:3px solid var(--red);background:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 4%, transparent);border-radius:10px;padding:17px}
.sidebar-agenda .eyebrow{color:color-mix(in srgb, #0C3663 22%, white)}.sidebar-agenda>span:not(.eyebrow){color:color-mix(in srgb, #0C3663 18%, white)}.sidebar-agenda button{color:color-mix(in srgb, #D83344 3%, white);font-weight:600}
.profile{border-color:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 13%, transparent)}.profile .avatar{background:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 10%, transparent);color:color-mix(in srgb, #A8BBD0 3%, white);border-radius:9px}.profile small,.logout,.online{color:color-mix(in srgb, #0C3663 21%, white)}.logout:hover{color:color-mix(in srgb, #A8BBD0 3%, white)}
.topbar{background:color-mix(in srgb, #A8BBD0 3%, white);border-color:var(--line);box-shadow:0 2px 12px color-mix(in srgb, #102B48 2%, transparent)}
.topbar strong,.topbar-profile{color:var(--ink)}.topbar-tools>#today-label{color:#0C3663}.topbar-profile .avatar{background:color-mix(in srgb, #A8BBD0 3%, white);color:var(--blue);border-radius:8px}
.top-icon{border-radius:8px;color:#0C3663}.top-icon:hover,.top-icon[aria-expanded=true]{background:color-mix(in srgb, #A8BBD0 3%, white);border-color:color-mix(in srgb, #A8BBD0 4%, white);color:var(--red)}
#notification-count{background:var(--red)}.notification-panel{border-color:var(--line);border-radius:12px;box-shadow:0 20px 52px color-mix(in srgb, #102B48 14%, transparent)}.notification-panel>button{border-radius:8px}.notification-panel>button:hover{background:color-mix(in srgb, #A8BBD0 3%, white)}.notification-panel>button strong{color:var(--ink)}.notification-icon{background:color-mix(in srgb, #A8BBD0 3%, white);color:var(--blue);border-radius:8px}.notification-icon.late{background:var(--red-soft);color:var(--red)}.notification-icon.done{background:color-mix(in srgb, #A8BBD0 3%, white);color:#245787}
.page-heading{border-color:var(--line)}.page-heading h1{font-size:32px;font-weight:700;letter-spacing:-1px}.page-heading p{color:var(--muted)}.eyebrow{color:#0C3663}
.primary,.secondary,.danger{border-radius:8px;font-weight:600;min-height:40px}.primary{background:var(--red);box-shadow:0 5px 12px color-mix(in srgb, color-mix(in srgb, #D83344 26%, white) 15%, transparent)}.primary:hover{background:var(--red-dark);transform:translateY(-1px);box-shadow:0 8px 17px color-mix(in srgb, color-mix(in srgb, #D83344 26%, white) 20%, transparent)}.secondary{border-color:color-mix(in srgb, #A8BBD0 12%, white);color:var(--blue);background:color-mix(in srgb, #A8BBD0 3%, white)}.secondary:hover{background:color-mix(in srgb, #A8BBD0 3%, white);border-color:color-mix(in srgb, #0C3663 18%, white)}.danger{color:var(--red-dark);border-color:color-mix(in srgb, #D83344 4%, white);background:color-mix(in srgb, #A8BBD0 3%, white)}.text-button{color:var(--red);font-weight:600}.text-button:hover{text-decoration:underline}
.dashboard-hero{position:relative;overflow:hidden;background:linear-gradient(115deg,#102B48 0%,#0C3663 77%,#0C3663 100%);border:0;border-radius:14px;padding:31px 33px;box-shadow:0 13px 30px color-mix(in srgb, #102B48 11%, transparent)}
.dashboard-hero:after{content:"";position:absolute;right:-75px;top:-100px;width:270px;height:270px;border:1px solid color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 13%, transparent);border-radius:50%;box-shadow:0 0 0 50px color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 3%, transparent),0 0 0 100px color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 2%, transparent);pointer-events:none}
.dashboard-hero>div,.dashboard-hero>button{position:relative;z-index:1}.dashboard-hero .eyebrow{color:color-mix(in srgb, #D83344 3%, white)}.dashboard-hero h2{color:color-mix(in srgb, #A8BBD0 3%, white);font-weight:700;font-size:25px}.dashboard-hero p{color:color-mix(in srgb, #A8BBD0 4%, white);font-size:12px}.hero-settings{border:1px solid color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 29%, transparent);background:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 8%, transparent);color:color-mix(in srgb, #A8BBD0 3%, white);border-radius:8px;font-weight:600}.hero-settings:hover{background:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 15%, transparent)}
.stat,.panel{border-color:var(--line);border-radius:12px;box-shadow:0 3px 15px color-mix(in srgb, #102B48 3%, transparent)}.stat{padding:21px 23px}.stat:hover{border-color:color-mix(in srgb, #0C3663 17%, white);box-shadow:0 9px 25px color-mix(in srgb, #102B48 7%, transparent);transform:translateY(-2px)}.stat:before{left:22px;width:34px;height:3px;background:var(--blue);border-radius:0 0 3px 3px}.stat:nth-child(2):before,.stat:nth-child(3):before,.stat:nth-child(4):before{background:var(--red)}.dashboard-metrics .stat.metric-overdue:before,.dashboard-metrics .stat.metric-today_due:before{background:var(--red)}.dashboard-metrics .stat.metric-new_companies:before,.dashboard-metrics .stat.metric-today_done:before{background:var(--blue)}.stat-top{color:#0C3663;font-weight:600}.stat-icon{color:var(--blue)}.metric-overdue .stat-icon,.metric-today_due .stat-icon{color:var(--red)}.stat-number{font-weight:700;color:var(--ink)}.stat-caption{color:#0C3663}
.panel-heading{border-color:var(--line)}.panel-heading h3,h3{font-weight:700}.panel-heading p{color:#0C3663}.dashboard-widget .panel-heading{min-height:78px}
th{background:color-mix(in srgb, #A8BBD0 3%, white);color:#0C3663;font-weight:700}td{border-color:color-mix(in srgb, #A8BBD0 3%, white)}tbody tr:hover{background:color-mix(in srgb, #A8BBD0 3%, white)}.company-symbol{background:color-mix(in srgb, #A8BBD0 3%, white);border-color:color-mix(in srgb, #A8BBD0 4%, white);color:#0C3663;border-radius:8px}.company-cell strong{font-weight:600}.badge{background:color-mix(in srgb, #A8BBD0 3%, white);color:#0C3663;border-radius:6px}.badge.overdue{background:var(--red-soft);color:var(--red-dark)}.row-action{border-radius:7px;color:var(--blue);border-color:color-mix(in srgb, #A8BBD0 4%, white)}.row-action:hover{background:color-mix(in srgb, #A8BBD0 3%, white);border-color:color-mix(in srgb, #0C3663 16%, white)}.avatar,.owner .avatar{background:color-mix(in srgb, #A8BBD0 3%, white);color:#0C3663;border-radius:8px}.bar{background:color-mix(in srgb, #A8BBD0 3%, white)}.bar span{background:var(--red)}
input,select,textarea{border-color:color-mix(in srgb, #A8BBD0 5%, white);border-radius:8px;color:var(--ink)}input:focus,select:focus,textarea:focus{border-color:#0C3663;outline:3px solid color-mix(in srgb, #0C3663 10%, transparent)}input[readonly],input:disabled,select:disabled,textarea:disabled{background:color-mix(in srgb, #A8BBD0 3%, white);color:#0C3663}label{color:#0C3663}.tabs{background:color-mix(in srgb, #A8BBD0 3%, white);border-radius:8px}.tabs button{border-radius:6px}.tabs button.active{color:var(--blue)}
dialog{border-color:var(--line);border-radius:14px;box-shadow:0 30px 90px color-mix(in srgb, #102B48 25%, transparent)}dialog::backdrop{background:color-mix(in srgb, #102B48 65%, transparent)}.icon-button:hover{background:color-mix(in srgb, #A8BBD0 3%, white);border-radius:7px}.company-detail-summary{background:color-mix(in srgb, #A8BBD0 3%, white);border-color:color-mix(in srgb, #A8BBD0 3%, white);border-radius:10px}.contact-card{border-radius:10px}.contact-card.inactive{background:color-mix(in srgb, #A8BBD0 3%, white)}.contact-links{color:#0C3663}.detail-empty{border-radius:10px}
.profile-large-avatar{background:color-mix(in srgb, #A8BBD0 3%, white);color:var(--blue);border-radius:14px}.preference-option{border-color:color-mix(in srgb, #A8BBD0 4%, white);border-radius:8px;background:color-mix(in srgb, #A8BBD0 3%, white);color:#0C3663}.preference-option:has(input:checked){border-color:color-mix(in srgb, #D83344 12%, white);background:color-mix(in srgb, #A8BBD0 3%, white)}.preference-option input{accent-color:var(--red)}.filter-indicator{background:color-mix(in srgb, #A8BBD0 3%, white);border-color:color-mix(in srgb, #A8BBD0 4%, white);color:var(--blue);border-radius:6px}.filter-clear:hover{background:color-mix(in srgb, #A8BBD0 3%, white)}
.login-story{background:linear-gradient(150deg,#102B48,#0C3663 75%,#0C3663)}.login-story:after{border-color:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 7%, transparent);box-shadow:-90px 0 0 color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 2%, transparent)}.login-story .eyebrow{color:color-mix(in srgb, #D83344 3%, white)}.login-story p{color:color-mix(in srgb, #0C3663 15%, white)}.story-card>.icon{color:color-mix(in srgb, #D83344 3%, white)}.story-card strong{color:color-mix(in srgb, #A8BBD0 3%, white)}.story-card span{color:color-mix(in srgb, #0C3663 19%, white)}.story-footer{color:color-mix(in srgb, #0C3663 26%, white)}.login-side h2{font-weight:700}.login-side{background:color-mix(in srgb, #A8BBD0 3%, white)}#toast{background:#102B48;border-left:3px solid var(--red);border-radius:8px}
.menu-close{border-radius:8px}.menu-backdrop:not([hidden]){background:color-mix(in srgb, #102B48 65%, transparent)}
.preloader{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,#0C3663 0%,#102B48 48%,#102B48 100%);color:color-mix(in srgb, #A8BBD0 3%, white);opacity:1;visibility:visible;transition:opacity .3s ease,visibility .3s ease}
.preloader.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
.preloader-content{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;transform:translateY(-5px)}
.preloader-mark{position:relative;width:72px;height:72px;margin-bottom:24px;display:grid;place-items:center}
.preloader-mark span{display:grid;place-items:center;width:55px;height:55px;border-radius:15px;background:var(--red);font-size:35px;font-weight:700;line-height:1;box-shadow:0 12px 28px color-mix(in srgb, color-mix(in srgb, #D83344 26%, white) 27%, transparent)}
.preloader-mark i{position:absolute;inset:0;border:2px solid color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 13%, transparent);border-top-color:color-mix(in srgb, #D83344 3%, white);border-radius:20px;animation:preloader-turn 1.5s linear infinite}
.preloader-content>strong{font-size:24px;line-height:1;letter-spacing:2.5px;font-weight:700}
.preloader-subtitle{margin-top:9px;color:color-mix(in srgb, #0C3663 21%, white);font-size:9px;letter-spacing:3px}
.preloader-progress{width:150px;height:3px;margin-top:28px;overflow:hidden;border-radius:3px;background:color-mix(in srgb, color-mix(in srgb, #A8BBD0 3%, white) 13%, transparent)}
.preloader-progress span{display:block;width:45%;height:100%;border-radius:3px;background:color-mix(in srgb, #D83344 4%, white);animation:preloader-slide 1.3s ease-in-out infinite}
.preloader-content p{margin:15px 0 0;color:color-mix(in srgb, #0C3663 18%, white);font-size:11px;letter-spacing:.25px}
.assignment-preview{margin-bottom:20px}.assignment-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-bottom:20px}.assignment-summary>div{display:flex;flex-direction:column;gap:7px;padding:20px 22px;background:color-mix(in srgb, #A8BBD0 3%, white);border:1px solid var(--line);border-radius:12px;box-shadow:0 3px 15px color-mix(in srgb, #102B48 3%, transparent)}.assignment-summary strong{font-size:29px;line-height:1;color:var(--blue)}.assignment-summary span{font-size:11px;color:var(--muted)}.assignment-summary .late strong{color:var(--red)}
.company-page{display:grid;gap:20px}.company-page-top,.company-page-actions{display:flex;align-items:center;gap:10px}.company-page-top{justify-content:space-between}.company-page-top>.text-button{padding:8px 0}.company-overview{padding:26px 28px}.company-page-identity{display:flex;align-items:center;gap:17px;margin-bottom:24px}.company-page-identity>div{min-width:0}.company-page-identity .company-symbol{width:62px;height:62px;flex-shrink:0;font-size:20px;background:color-mix(in srgb, #A8BBD0 3%, white);color:var(--blue);border-radius:14px}.company-page-identity h2{margin:5px 0 3px;font-size:24px;font-weight:700;overflow-wrap:anywhere}.company-page-identity p{margin:0;color:var(--muted);font-size:12px}.company-overview .company-detail-summary{margin:0}.company-notes{margin-top:20px;padding:16px 18px;background:color-mix(in srgb, #A8BBD0 3%, white);border:1px solid color-mix(in srgb, #A8BBD0 3%, white);border-radius:10px}.company-notes small{font-size:10px;letter-spacing:1px;color:#0C3663;font-weight:700}.company-notes p{margin:8px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;color:#0C3663;font-size:12px}.company-contacts-panel .contact-grid{padding:20px}.company-contacts-panel .empty,.company-history-panel .empty{padding:38px}.company-history-list{padding:6px 26px 22px}.history-item{display:grid;grid-template-columns:118px minmax(0,1fr);gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}.history-item:last-child{border-bottom:0}.history-date{display:flex;flex-direction:column;gap:4px}.history-date strong{color:var(--blue);font-size:12px}.history-date span{color:#0C3663;font-size:10px}.history-content{min-width:0}.history-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.history-title h4{margin:0;font-size:14px;font-weight:700;color:var(--ink)}.history-meta{margin:8px 0 0;color:#0C3663;font-size:11px}.history-note{margin:14px 0 0;padding:13px 15px;border-left:3px solid color-mix(in srgb, #A8BBD0 4%, white);background:color-mix(in srgb, #A8BBD0 3%, white);border-radius:0 7px 7px 0;color:#0C3663;font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere}.history-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;color:#0C3663;font-size:11px}.history-bottom strong{color:var(--ink)}.company-loading{padding:40px;color:var(--muted)}
.live-alerts{position:fixed;top:87px;right:24px;z-index:100;display:grid;gap:10px;width:min(390px,calc(100vw - 32px));pointer-events:none}.live-alert{display:flex;align-items:flex-start;gap:12px;padding:17px;background:color-mix(in srgb, #A8BBD0 3%, white);border:1px solid var(--line);border-left:4px solid var(--red);border-radius:11px;box-shadow:0 18px 45px color-mix(in srgb, #102B48 20%, transparent);pointer-events:auto;animation:alert-in .28s ease-out}.live-alert.assigned{border-left-color:#0C3663}.live-alert-icon{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;border-radius:9px;background:var(--red-soft);color:var(--red)}.live-alert.assigned .live-alert-icon{background:color-mix(in srgb, #A8BBD0 3%, white);color:var(--blue)}.live-alert-icon .icon{width:17px;height:17px}.live-alert-body{flex:1;min-width:0}.live-alert-body strong{display:block;font-size:13px;color:var(--ink)}.live-alert-body p{margin:5px 0 9px;color:var(--muted);font-size:11px;line-height:1.5;overflow-wrap:anywhere}.live-alert-body button{display:inline-flex;align-items:center;gap:5px;background:none;border:0;padding:0;color:var(--red);font-weight:700;font-size:11px}.live-alert.assigned .live-alert-body button{color:var(--blue)}.live-alert-body button .icon{width:12px;height:12px}.live-alert-close{display:grid;place-items:center;width:23px;height:23px;flex-shrink:0;background:none;border:0;border-radius:5px;color:#0C3663}.live-alert-close:hover{background:color-mix(in srgb, #A8BBD0 3%, white);color:var(--ink)}.live-alert-close .icon{width:14px;height:14px}@keyframes alert-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes preloader-turn{to{transform:rotate(360deg)}}
@keyframes preloader-slide{0%{transform:translateX(-110%)}100%{transform:translateX(350%)}}
@media(max-width:800px){.dashboard-hero{padding:23px}.page-heading h1{font-size:28px}.topbar-search{border-radius:8px}.sidebar{box-shadow:12px 0 35px color-mix(in srgb, #102B48 24%, transparent)}.live-alerts{top:72px;right:12px;width:calc(100vw - 24px)}}
@media(max-width:500px){.assignment-summary{gap:8px}.assignment-summary>div{padding:15px 11px}.assignment-summary strong{font-size:24px}.assignment-summary span{font-size:10px}}
@media(max-width:600px){.topbar-leading>div{min-width:0;display:flex;align-items:center}.topbar-leading .muted,.topbar-leading .crumb{display:none}#breadcrumb{display:block;max-width:138px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.company-page-top{align-items:flex-start;flex-direction:column}.company-page-actions{width:100%;flex-wrap:wrap}.company-overview{padding:20px}.company-page-identity .company-symbol{width:50px;height:50px}.company-page-identity h2{font-size:20px}.company-contacts-panel .contact-grid{padding:14px}.company-history-list{padding:0 17px 14px}.history-item{grid-template-columns:1fr;gap:6px}.history-date{flex-direction:row;align-items:center;gap:8px}.history-bottom{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){button,a,input,select,textarea,.stat,.preloader{transition:none!important}.preloader-mark i,.preloader-progress span{animation:none!important}.preloader-progress span{width:100%}}