/* CYAN ONE 7.6 — section colours, layered dark palette, light-sidebar option */
/* each category: --l (deep, for light surfaces) and --d (bright, for dark surfaces) */
html,[data-group=overview]{--l:#137a80;--d:#4cc3c9}
[data-section=field],[data-group=field]{--l:#2364aa;--d:#6ea8f2}
[data-section=risk],[data-group=risk]{--l:#b85a1f;--d:#f0965a}
[data-section=assets],[data-group=assets]{--l:#6650b0;--d:#a893f2}
[data-section=docs],[data-group=docs]{--l:#2b7d4e;--d:#6cc995}
[data-section=gov],[data-group=gov]{--l:#9a7419;--d:#d9b45c}
[data-section=connect],[data-group=connect]{--l:#1b7aa1;--d:#62bde3}
[data-section=workspace],[data-group=workspace]{--l:#55687a;--d:#a3b6c6}
html{--sec:var(--l)}
html[data-theme=dark]{--sec:var(--d)}
@media(prefers-color-scheme:dark){html[data-theme=system]{--sec:var(--d)}}

/* dark: neutral navy-charcoal layers instead of one teal everywhere */
html[data-theme=dark]{--canvas:#0b141b;--surface:#111e28;--subtle:#162634;--line:#233645;--ink:#dde8ed;--muted:#93a8b3;--chat-mine:#173a3a}
@media(prefers-color-scheme:dark){html[data-theme=system]{--canvas:#0b141b;--surface:#111e28;--subtle:#162634;--line:#233645;--ink:#dde8ed;--muted:#93a8b3;--chat-mine:#173a3a}}
html[data-theme=dark] .sidebar{background:linear-gradient(180deg,#071118,#0a1821)}
@media(prefers-color-scheme:dark){html[data-theme=system] .sidebar{background:linear-gradient(180deg,#071118,#0a1821)}}
html[data-theme=dark] .top{background:#111e28f0}
@media(prefers-color-scheme:dark){html[data-theme=system] .top{background:#111e28f0}}

/* navigation: coloured category markers, icons and active state */
.nav-section{--g:var(--d)}
.nav-heading:before{content:"";display:inline-block;width:7px;height:7px;margin:0 8px 1px 0;border-radius:2px;background:var(--g);vertical-align:middle}
.layout:not(.open) .nav-section+.nav-section:before{content:"";display:block;width:18px;height:2px;margin:9px auto 5px;border-radius:2px;background:var(--g);opacity:.85}
.sidebar nav .nav-section button .pilot-icon{color:var(--g)}
html .sidebar nav .nav-section button.active{background:color-mix(in srgb,var(--g) 20%,transparent);color:#fff;box-shadow:inset 3px 0 var(--g)}
html .sidebar nav .nav-section button.active .nav-dot{background:var(--g)}

/* page identity: category chip and a thin category line under the top bar */
.top{border-bottom:2px solid color-mix(in srgb,var(--sec) 70%,transparent)!important}
.sec-chip{display:inline-block;padding:0 8px;margin-right:7px;border-radius:99px;font-size:11px;font-weight:600;background:color-mix(in srgb,var(--sec) 14%,transparent);color:var(--sec)}
.content .card>h2:first-child .pilot-icon,.content h1 .pilot-icon{color:var(--sec)}
.content .card{border-top:2px solid color-mix(in srgb,var(--sec) 45%,var(--line))}

/* light sidebar (light theme only; dark theme keeps a dark sidebar) */
html[data-theme=light][data-sidebar=light] .sidebar{background:#fff;box-shadow:inset -1px 0 var(--line)}
html[data-theme=light][data-sidebar=light] .nav-section{--g:var(--l)}
html[data-theme=light][data-sidebar=light] .sidebar nav button{color:#3c5662}
html[data-theme=light][data-sidebar=light] .sidebar nav button:hover{background:#eef3f6;color:#0c2e3a}
html[data-theme=light][data-sidebar=light] .sidebar nav .nav-section button.active{color:#0c2e3a}
html[data-theme=light][data-sidebar=light] .nav-heading,html[data-theme=light][data-sidebar=light] .sidebar-end{color:#7b8f99}
html[data-theme=light][data-sidebar=light] .sidebar-close{color:#3c5662}
@media(prefers-color-scheme:light){
 html[data-theme=system][data-sidebar=light] .sidebar{background:#fff;box-shadow:inset -1px 0 var(--line)}
 html[data-theme=system][data-sidebar=light] .nav-section{--g:var(--l)}
 html[data-theme=system][data-sidebar=light] .sidebar nav button{color:#3c5662}
 html[data-theme=system][data-sidebar=light] .sidebar nav button:hover{background:#eef3f6;color:#0c2e3a}
 html[data-theme=system][data-sidebar=light] .sidebar nav .nav-section button.active{color:#0c2e3a}
 html[data-theme=system][data-sidebar=light] .nav-heading,html[data-theme=system][data-sidebar=light] .sidebar-end{color:#7b8f99}
 html[data-theme=system][data-sidebar=light] .sidebar-close{color:#3c5662}}

/* dark: neutral controls; plain action buttons carry the section colour */
html[data-theme=dark] .secondary{background:#1a2b38;color:#cddbe2;border-color:#2a3f50}
html[data-theme=dark] input,html[data-theme=dark] select,html[data-theme=dark] textarea{background:#0e1922;color:var(--ink);border-color:var(--line)}
html[data-theme=dark] .content button:not([class]){background:color-mix(in srgb,var(--sec) 30%,#111e28);border:1px solid color-mix(in srgb,var(--sec) 50%,transparent);color:#fff}
@media(prefers-color-scheme:dark){
 html[data-theme=system] .secondary{background:#1a2b38;color:#cddbe2;border-color:#2a3f50}
 html[data-theme=system] input,html[data-theme=system] select,html[data-theme=system] textarea{background:#0e1922;color:var(--ink);border-color:var(--line)}
 html[data-theme=system] .content button:not([class]){background:color-mix(in srgb,var(--sec) 30%,#111e28);border:1px solid color-mix(in srgb,var(--sec) 50%,transparent);color:#fff}}

/* wordmark sits directly on the theme surface: no box */
html .top .top-brand,html .top .top-brand:hover{background:transparent;border:0;box-shadow:none}
html .top .top-brand img{background:transparent;padding:0;border-radius:0;width:138px}
@media(max-width:800px){html .top .top-brand img{width:112px;padding:0}}
html .layout.open .sidebar .home-brand img{width:170px}
html .sidebar .home-brand.mark-only img{width:40px;border-radius:0}

/* top bar: one logo only, plus a greeting with the person and company */
.page-heading .greet{font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html .page-heading .greet b{font-size:13px;font-weight:650;max-width:none}
.page-heading small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11px}
@media(min-width:801px){
 html .top .page-heading{display:flex;flex:1;max-width:520px}
 html .layout.open .top .top-brand{display:none}
 html .layout.open .top .page-heading{border-left:0;padding-left:2px}
 html .top .account-name{display:none}}

/* phone app page */
.ph-big{font-size:20px;font-weight:650;margin:4px 0;word-break:break-all}.ph-code{font-family:Consolas,monospace;letter-spacing:.06em;color:var(--sec)}.ph-steps li{margin:6px 0}