/* HYD Core · Sky Blue. Shared tokens for every business surface. */
:root {
  --ui-bg:#eaf5ff; --ui-surface:#fff; --ui-ink:#153552;
  --ui-secondary:#526c82; --ui-line:#d3e4f2; --ui-accent:#1769d2;
  --ui-accent-hover:#1058b8; --ui-accent-soft:#dfedff; --ui-soft:#f3f9ff;
  --ui-focus:#1769d24d; --ui-shadow:0 4px 18px #174b7d08;
  --blue:var(--ui-accent); --ink:var(--ui-ink); --text:var(--ui-ink);
  --muted:var(--ui-secondary); --line:var(--ui-line); --border:var(--ui-line); --bg:var(--ui-bg);
}
body { background:var(--ui-bg)!important; }
button,.button { border-radius:10px; font-weight:500; cursor:pointer; transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .12s ease; }
button:not(:disabled):hover,.button:hover { background:var(--ui-soft); border-color:#afcbea; }
button:not(:disabled):active,.button:active { transform:scale(.98); }
.primary,button.primary,.button.primary { box-shadow:inset 0 1px 0 #ffffff24,0 2px 5px #1769d219; }
.primary:not(:disabled):hover { background:var(--ui-accent-hover)!important; box-shadow:0 4px 10px #1769d22b; }
:is(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline:3px solid var(--ui-focus)!important; outline-offset:3px!important; }
input,select,textarea { border-color:#b7cfe2; background:#fff; transition:border-color .16s,box-shadow .16s; }
input::placeholder,textarea::placeholder { color:#667f95; }
input:focus,select:focus,textarea:focus { border-color:var(--ui-accent)!important; }
input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true] { border-color:#ba352b!important; }
::selection { background:#c9e2ff; color:#123c69; }
.company-bar { background:#dceeff; border-color:#c9def1; }
.company-bar select { border-color:#c4dcee; }
#stage>.topbar,body>header { background:rgba(246,251,255,.94); }
#stage .search-global { background:#edf6ff; border-color:#d2e5f5; }
/* The search field has one focus ring around its complete click target. */
#stage .search-global { cursor:text; transition:border-color .16s,box-shadow .16s; }
#stage .search-global:focus-within { border-color:var(--ui-accent); box-shadow:0 0 0 3px var(--ui-focus); }
#stage .search-global input:is(:focus,:focus-visible) { outline:none!important; box-shadow:none!important; background:transparent!important; }
#stage>.sidebar,.layout>aside { background:#e0effc!important; }
#stage .nav-item,.layout aside nav button { color:#49677f!important; }
#stage .nav-item.active,.layout aside nav button.active { background:var(--ui-accent)!important; color:#fff!important; box-shadow:0 3px 8px #1769d21c; }
#stage .nav-item:not(.active):hover,.layout aside nav button:not(.active):hover { background:#d0e6fa!important; }
.avatar { background:#d6e9ff!important; color:#1257aa!important; }
.lang-switch { background:#e1eefb!important; }
.lang-switch button.active { color:var(--ui-accent)!important; }
.panel,.card,#stage .metric { box-shadow:var(--ui-shadow); border-color:var(--ui-line)!important; }
#stage .metric-symbol .filled-icon { filter:none; color:var(--ui-accent); opacity:1; }
#stage .metric:hover,.summary-grid .card:hover { border-color:#a4c8ed!important; box-shadow:0 5px 18px #1769d210; }
th,.data-table th { background:#f0f7fe!important; color:#4f6e86!important; }
td,.data-table td { border-color:#e5eff7!important; }
.data-table tbody tr[data-record]:hover,tbody tr:has(.link):hover,#hub tbody tr:hover { background:#f0f7ff; }
.table-wrap thead th { position:sticky; top:0; z-index:1; }
.data-table tr:focus-visible { outline-offset:-3px!important; background:#e9f3ff; }
.badge.blue,.tag:not(.green):not(.red):not(.amber):not(.warn):not(.good),.badge.gray { color:#315f8d; background:#e9f3ff; }
.badge.green,.tag.green,.tag.good { color:#176448; background:#e6f5ed; }
.badge.orange,.tag.amber,.tag.warn { color:#86570c; background:#fff3d9; }
.badge.red,.tag.red { color:#a52826; background:#ffebe9; }
.ui-nav-links a { text-decoration:none; }
.ui-nav-links a:hover { background:#e9f3ff; }
.ui-nav-links a[aria-current=page] { background:#dcecff; color:#135aaf; font-weight:600; }
.note,.notice,.ui-form-summary { background:#eff7ff; color:#42637f; border-color:#c5def5; }
#mode-banner { background:#f5faff; color:#5c7285; }
.ui-empty-symbol { background:#e2efff; }
.ui-quick-links a { background:#fbfdff; }
.ui-quick-links a:hover { background:#eef7ff; border-color:#a4c8ed; }
.dialog-head button[data-close],.dialog-head button[data-act=close] { background:#edf5fd; color:#49677f; }
.dialog-foot,.dialog-actions { background:#f6faff!important; }
.dialog-body input,.dialog-body select,.dialog-body textarea { border-color:#b7cfe2!important; }
.dialog-body :is(input,select,textarea):focus { border-color:var(--ui-accent)!important; }
dialog::backdrop,#overlay.open { background:#173b5b38; backdrop-filter:blur(5px); }
.dialog-head>div>small { display:none; }
.dialog-tabs,.segment,.message-tabs { gap:4px; }
.dialog-tabs button,.segment button,.message-tabs button { color:var(--ui-secondary); border-radius:8px; }
.dialog-tabs button.active,.segment button.active,.message-tabs button.active,.page-button.active { background:var(--ui-accent-soft)!important; color:#1459b0!important; border-color:#b9d7f8!important; }
.dialog-tabs { display:flex; overflow-x:auto; padding:10px 0; flex-wrap:nowrap; }
.dialog-tabs button { white-space:nowrap; flex:none; }
.dialog-body .detail-grid { display:grid; grid-template-columns:minmax(110px,1fr) minmax(0,2fr); gap:12px 20px; background:#f5faff; border:1px solid var(--ui-line); border-radius:12px; padding:18px; }
.detail-grid dt { color:var(--ui-secondary); font-size:12px; }
.detail-grid dd { margin:0; overflow-wrap:anywhere; }
.history { border-left:2px solid #c8ddf3; padding-left:18px; }
.history p { padding-bottom:12px; }
/* Keep the list visible behind a detail sheet; editors retain their centred form. */
#dialog.ui-detail,#flow-dialog.ui-detail { margin:0 0 0 auto!important; position:fixed; inset:0 0 0 auto; width:min(820px,92vw)!important; max-width:none; height:100dvh; max-height:100dvh!important; border-radius:18px 0 0 18px!important; }
dialog.ui-detail[open]>form { height:100%; max-height:100dvh; }
dialog.ui-detail[open] { animation:ui-sheet-in .2s cubic-bezier(.2,.8,.2,1); }
dialog[open]:not(.ui-detail) { animation:ui-dialog-in .16s ease-out; }
dialog.ui-detail::backdrop { background:#173b5b21; backdrop-filter:blur(1px); }
/* A stable order: page title → sections → filters → saved views → records. */
#hub { display:flex; flex-direction:column; padding:0 28px; gap:18px; }
#hub>.intro { order:0; margin:0; align-items:center; }
#hub>.intro h1 { margin:0 0 6px; }
#hub>.intro p { margin:0; color:var(--ui-secondary); }
#hub>nav { order:1; margin:0; background:#dcecfb; padding:4px; gap:3px; border-radius:11px; }
#hub>nav button { background:transparent; }
#hub>nav button.active { background:#fff; color:#1359af; font-weight:600; }
#hub>.filters { order:2; margin:0; padding:14px 16px; background:#f8fcff; border:1px solid var(--ui-line); }
#hub>.filters label { color:var(--ui-secondary); font-size:12px; }
#hub>.filters input { min-width:240px; }
#hub>.cards { order:3; display:flex; flex-wrap:wrap; gap:8px; margin:0; }
#hub>.cards .card { display:flex; align-items:center; gap:12px; flex:0 0 auto; width:auto; padding:9px 14px; border-radius:10px; margin:0; min-height:42px; box-shadow:none; }
#hub>.cards .card small { color:inherit; font-size:13px; }
#hub>.cards .card b { display:inline-grid; place-items:center; min-width:24px; height:23px; font-size:12px; background:#e7f0fa; color:#466881!important; border-radius:6px; }
#hub>.cards .card.active { outline:0; background:var(--ui-accent)!important; color:white; border-color:var(--ui-accent)!important; }
#hub>.cards .card.active b { background:#ffffff2b; color:white!important; }
#hub>.panel,#hub>.toolbar { order:4; margin:0; }
#hub>.muted { order:5; margin:0; }
#hub table { width:100%; }
#hub th,#hub td { padding:13px 16px; }
#hub td strong { font-size:13px; font-weight:600; }
#hub td small { display:block; margin-top:5px; }
#hub td .toolbar button { padding:5px 10px; min-height:32px; }
body>header span#identity { padding:0; margin:0; }
.ui-list-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:15px 16px; border-bottom:1px solid var(--ui-line); }
.ui-list-heading strong { font-size:14px!important; }
.ui-list-heading span { color:var(--ui-secondary); font-size:12px; }
.ui-empty { padding:34px 20px; text-align:center; }
.ui-empty strong { display:block; font-size:15px; margin-bottom:7px; }
.ui-empty p { margin:0 0 14px; font-size:13px; color:var(--ui-secondary); }
.ui-empty button { margin-top:8px; }
.layout>main { min-width:0; }
.page-head h1 { margin:4px 0 20px; }
#scope { font-size:12px; color:var(--ui-secondary); }
.toolbar-row { padding:14px; border:1px solid var(--ui-line); border-radius:12px; background:#f8fcff; gap:10px; }
.toolbar-row input[type=search] { flex:1; min-width:180px; }
.toolbar-row .primary { margin-left:auto; }
.layout #content>.panel { padding:0; overflow:hidden; }
.layout #content>.panel>h2 { padding:16px 18px 0; }
.layout #content>.panel>p { margin:16px 18px; }
.layout .pager { padding:12px 16px; border-top:1px solid var(--ui-line); }
.layout table td { padding:14px 16px; }
.layout table th { padding:12px 16px; }
.layout .link { min-height:0; padding:0; text-align:left; border:0; background:none; color:#145daf; }
.layout .link:hover { text-decoration:underline; }
.ui-filter-clear { white-space:nowrap; color:var(--ui-accent); }
/* Sonner-inspired notification stack: explicit type, dismiss, pause and action. */
.ui-toasts { position:fixed; right:22px; bottom:22px; z-index:2147483000; width:min(380px,calc(100vw - 32px)); display:flex; flex-direction:column; gap:9px; pointer-events:none; }
.ui-toast { display:flex; gap:11px; align-items:flex-start; padding:15px 13px 15px 16px; background:#fff; border:1px solid #c9dff4; border-radius:14px; box-shadow:0 8px 32px #1535521c,0 1px 3px #1535520a; pointer-events:auto; color:var(--ui-ink); animation:ui-toast-in .2s ease-out; }
.ui-toast-icon { display:grid; place-items:center; flex:none; width:24px; height:24px; border-radius:50%; background:#e5f0ff; color:var(--ui-accent); }
.ui-toast-icon svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ui-toast[data-tone=success] .ui-toast-icon { color:#137044; background:#e4f5eb; }
.ui-toast[data-tone=error] .ui-toast-icon { color:#b32f28; background:#ffebe9; }
.ui-toast[data-tone=warning] .ui-toast-icon { color:#8a610b; background:#fff2d4; }
.ui-toast-content { flex:1; min-width:0; padding-top:2px; }
.ui-toast-title { font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.ui-toast-description { font-size:12px; color:var(--ui-secondary); margin-top:4px; line-height:1.6; }
.ui-toast button { min-height:28px; padding:3px 8px; font-size:12px; border-radius:7px; }
.ui-toast-close { border:0; background:none; color:var(--ui-secondary); line-height:1; font-size:18px!important; }
.ui-toast-action { margin-top:9px; background:#edf5ff; }
.ui-pending { cursor:progress!important; }
.ui-pending::before { content:''; display:inline-block; width:13px; height:13px; margin-right:7px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; vertical-align:-2px; animation:ui-spin .7s linear infinite; }
@keyframes ui-spin { to{transform:rotate(360deg)} }
@keyframes ui-toast-in { from{opacity:0;transform:translateY(8px) scale(.98)} to{opacity:1;transform:none} }
@keyframes ui-sheet-in { from{opacity:.5;transform:translateX(24px)} to{opacity:1;transform:none} }
@keyframes ui-dialog-in { from{opacity:0;transform:translateY(6px) scale(.985)} to{opacity:1;transform:none} }
@media(max-width:700px) {
  #hub { padding:0 16px; gap:14px; margin:20px auto; }
  #hub>.intro { flex-wrap:wrap; gap:14px; }
  #hub>.intro>.toolbar { width:100%; flex-wrap:wrap; }
  #hub>.intro>.grow { display:none; }
  #hub>nav { width:100%; overflow:auto; flex-wrap:nowrap; }
  #hub>nav button { white-space:nowrap; padding:7px 11px; flex:1; }
  #hub>.filters { gap:10px; flex-wrap:wrap; }
  #hub>.filters label:has(input) { width:100%; display:flex; gap:10px; align-items:center; white-space:nowrap; }
  #hub>.filters input { flex:1; width:0; min-width:0; }
  #hub .panel:has(.ui-empty) table { min-width:0; }
  #hub .panel:has(.ui-empty) thead,.layout .panel:has(.ui-empty) thead { display:none; }
  .ui-empty { padding:24px 10px; }
  .layout .page-head { flex-wrap:wrap; gap:10px; }
  .layout .page-head>div:first-child { flex:1 0 100%; }
  .layout .page-head h1 { margin-bottom:0; }
  #hub>.cards { display:grid; grid-template-columns:1fr 1fr; }
  #hub>.cards .card { justify-content:space-between; padding:9px 12px; }
  .toolbar-row .primary { margin-left:0; }
  #dialog.ui-detail,#flow-dialog.ui-detail { width:100%!important; border-radius:0!important; }
  .ui-toasts { right:16px; bottom:16px; }
  .dialog-body .detail-grid { grid-template-columns:1fr; gap:5px; }
  .detail-grid dd { margin-bottom:10px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; } }
@media(prefers-reduced-transparency:reduce) { #stage>.topbar,body>header { background:#f6fbff; backdrop-filter:none; } }
@media print { .ui-toasts { display:none; } }

/* Transparent wordmark; crop only transparent padding through layout. */
#loading .brand,#stage .brand { background-image:url('/assets/hyd-logo-clear.png')!important; background-position:center!important; background-size:cover!important; }
body>header img[src$="hyd-logo-clear.png"] { width:166px; height:34px; max-height:36px; object-fit:cover; }
#loading { background:radial-gradient(ellipse at center,#f8fcff,#eaf5ff)!important; }
#loading p { color:#526f89; font-size:13px; }
@media(max-width:600px) { .login-top img[src$="hyd-logo-clear.png"] { width:146px; height:30px; } }

#stage .metric-symbol .filled-icon.red { color:#b32f28; }
#stage .metric-symbol .filled-icon.orange { color:#986910; }
#stage .metric-symbol .filled-icon.green { color:#137044; }

#stage .nav-item.active .ico,#stage .nav-item.active .filled-icon { color:inherit!important; }