:root {
  color-scheme: light;
  --bg: #ffffff;
  --sidebar: #ffffff;
  --panel: #ffffff;
  --panel-2: #f7f9fc;
  --panel-3: #edf2f8;
  --line: rgba(8, 23, 47, 0.10);
  --line-strong: rgba(8, 23, 47, 0.18);
  --text: #08172f;
  --muted: #64748b;
  --soft: #334155;
  --blue: #195fc4;
  --blue-2: #174ea6;
  --blue-soft: rgba(25, 95, 196, 0.09);
  --gold: #c99a43;
  --gold-soft: rgba(201, 154, 67, 0.12);
  --green: #18875d;
  --amber: #b87312;
  --red: #c4454d;
  --purple: #7656c8;
  --radius: 16px;
  --shadow: 0 16px 42px rgba(8, 23, 47, 0.07);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; min-width: 320px; min-height: 100vh; background: var(--bg); color: var(--text); font-size: 16px; line-height: 1.5; }
button, input, select { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid var(--blue-2); outline-offset: 2px; }

.app-shell { min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 20; width: 270px; display: flex; flex-direction: column; padding: 24px 18px 20px; background: linear-gradient(180deg, rgba(8, 18, 32, 0.98), rgba(4, 11, 20, 0.99)); border-right: 1px solid var(--line); }
.brand-lockup { display: flex; gap: 13px; align-items: center; padding: 0 8px 20px; }
.brand-mark { width: 44px; height: 44px; display: grid; place-items: center; }
.brand-mark img { width: 44px; height: 44px; object-fit: contain; filter: drop-shadow(0 10px 20px rgba(64,137,255,.2)); }
.brand-lockup strong { display: block; letter-spacing: 0.16em; font-size: 0.93rem; }
.brand-lockup span { display: block; color: var(--muted); font-size: 0.77rem; margin-top: 2px; }
.mode-pill { margin: 0 6px 18px; padding: 9px 11px; background: var(--gold-soft); border: 1px solid rgba(213, 174, 101, 0.2); color: #e8d2a7; border-radius: 9px; font-size: 0.76rem; }
.mode-pill span { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 4px rgba(213, 174, 101, 0.09); }
.main-nav { display: grid; gap: 3px; overflow-y: auto; padding: 2px 0; }
.nav-item { width: 100%; display: flex; align-items: center; gap: 12px; padding: 10px 12px; background: transparent; border: 1px solid transparent; border-radius: 9px; color: #9eb0c6; text-align: left; cursor: pointer; font-size: 0.88rem; transition: .18s ease; }
.nav-item:hover { color: #e8eef7; background: rgba(255,255,255,.035); }
.nav-item.active { color: #fff; background: var(--blue-soft); border-color: rgba(67,137,255,.18); }
.nav-item.locked { opacity: .34; }
.nav-item.locked::after { content: "×"; margin-left: auto; color: #68778b; font-size: .7rem; }
.nav-item.live-nav i { margin-left: auto; padding: 2px 5px; border-radius: 4px; background: rgba(80,201,144,.1); color: #8ed5b1; font-size: .58rem; font-style: normal; text-transform: uppercase; letter-spacing: .05em; }
.nav-item.live-nav .nav-icon { color: var(--green); font-size: .55rem; }
.nav-item.active .nav-icon { color: var(--blue-2); }
.nav-icon { width: 19px; text-align: center; color: #6f8198; font-size: 1rem; }
.nav-spiral { width: 19px; height: 19px; display: grid; place-items: center; }
.nav-spiral img { width: 19px; height: 19px; object-fit: contain; }
.sidebar-footer { margin-top: auto; padding: 18px 8px 0; border-top: 1px solid var(--line); }
.principle { color: var(--gold); font-family: Georgia, serif; font-size: .78rem; letter-spacing: .035em; }
.sidebar-footer p { margin: 8px 0 0; color: #718198; font-size: .72rem; line-height: 1.45; }

.main { margin-left: 270px; min-height: 100vh; }
.topbar { height: 68px; position: sticky; top: 0; z-index: 15; display: flex; align-items: center; justify-content: space-between; padding: 0 30px; background: rgba(7, 16, 29, .88); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px); }
.menu-toggle { display: none; background: transparent; border: 0; font-size: 1.4rem; cursor: pointer; }
.breadcrumb { display: flex; align-items: center; gap: 10px; font-size: .82rem; }
.breadcrumb span { color: var(--gold); }
.breadcrumb b { color: #52647b; font-weight: 400; }
.breadcrumb strong { color: #c4d0df; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.role-control { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: .75rem; }
.role-control select, .filter-bar select, .field-label select { color: var(--soft); background: #0c1828; border: 1px solid var(--line-strong); border-radius: 8px; padding: 8px 32px 8px 10px; }
.icon-button { min-width: 43px; height: 36px; display: flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--line); background: var(--panel); border-radius: 9px; cursor: pointer; color: var(--soft); font-size: .8rem; }
.alert-dot { width: 7px; height: 7px; background: var(--amber); border-radius: 50%; }
.avatar, .large-avatar { display: grid; place-items: center; border-radius: 10px; background: linear-gradient(145deg, #193760, #10223a); border: 1px solid rgba(112,166,255,.25); color: #d8e6fb; font-weight: 700; }
.avatar { width: 36px; height: 36px; font-size: .76rem; }
.scope-bar { min-height: 50px; display: flex; justify-content: space-between; align-items: center; padding: 10px 30px; border-bottom: 1px solid var(--line); background: rgba(12,24,40,.45); }
.scope-bar > div:first-child { display: flex; align-items: center; gap: 10px; }
.scope-label { color: var(--muted); font-size: .73rem; text-transform: uppercase; letter-spacing: .08em; }
.scope-bar strong { color: #d3dcea; font-size: .8rem; }
.scope-meta { display: flex; gap: 7px; }
.scope-meta span { color: #8496ad; font-size: .7rem; padding: 4px 7px; background: rgba(255,255,255,.025); border-radius: 5px; }

.view { display: none; padding: 34px 30px 54px; max-width: 1680px; margin: 0 auto; }
.view.active { display: block; animation: fadeIn .22s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
.page-heading.compact { align-items: center; }
.eyebrow { margin: 0 0 6px; color: var(--gold); text-transform: uppercase; letter-spacing: .12em; font-size: .7rem; font-weight: 700; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1 { margin: 0; max-width: 840px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2rem, 3vw, 3.55rem); font-weight: 500; line-height: 1.04; letter-spacing: -.025em; }
.compact h1 { font-size: clamp(1.8rem, 2.5vw, 2.75rem); }
.page-heading p:last-child { max-width: 780px; margin: 11px 0 0; color: var(--muted); font-size: .94rem; }
h2 { margin: 0; font-size: 1.05rem; font-weight: 650; }
.primary-button, .secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 42px; padding: 10px 15px; border-radius: 9px; cursor: pointer; font-size: .82rem; font-weight: 650; white-space: nowrap; }
.primary-button { background: linear-gradient(135deg, #397cf0, #235fc8); border: 1px solid #5c98ff; box-shadow: 0 12px 30px rgba(35,95,200,.22); }
.primary-button:hover { filter: brightness(1.08); }
.button-link { text-decoration: none; }
.secondary-button { background: var(--panel-2); border: 1px solid var(--line-strong); color: #d7e0eb; }
.text-button { padding: 4px; border: 0; background: transparent; color: var(--blue-2); cursor: pointer; font-size: .78rem; }
.demo-badge, .mini-badge, .count-badge { display: inline-flex; align-items: center; justify-content: center; padding: 5px 8px; border: 1px solid rgba(67,137,255,.23); background: var(--blue-soft); border-radius: 7px; color: #a9caff; font-size: .7rem; font-style: normal; }
.demo-badge { color: #e8d2a7; border-color: rgba(213,174,101,.22); background: var(--gold-soft); }
.count-badge { min-width: 28px; color: #ffd897; border-color: rgba(240,178,76,.22); background: rgba(240,178,76,.1); }

.notice { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 12px 15px; margin-bottom: 18px; border-radius: 10px; font-size: .8rem; }
.notice.warning { background: rgba(240,178,76,.08); border: 1px solid rgba(240,178,76,.17); }
.notice strong { color: #f3cf91; }
.notice span { color: #a7b4c4; }
.notice button { border: 0; background: transparent; color: #f3cf91; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.foodea-live-strip { width: 100%; display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 12px; margin: -2px 0 12px; padding: 12px 15px; border: 1px solid rgba(80,201,144,.2); border-radius: 11px; background: linear-gradient(110deg, rgba(80,201,144,.09), rgba(67,137,255,.055)); text-align: left; cursor: pointer; }
.foodea-live-strip:hover { border-color: rgba(80,201,144,.38); }
.foodea-live-strip div { display: grid; }.foodea-live-strip strong { font-size: .78rem; }.foodea-live-strip small { color: #8fa2b8; font-size: .67rem; }.foodea-live-strip b { color: #8ed5b1; font-size: .67rem; }.foodea-live-strip b.warning { color: #ebc47f; }.foodea-live-strip em { color: var(--blue-2); font-size: .7rem; font-style: normal; }
.live-pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(80,201,144,.08); }
.live-notice { grid-template-columns: auto 1fr auto; background: rgba(67,137,255,.07); border: 1px solid rgba(67,137,255,.16); }
.live-notice strong { color: #afd0ff; }.live-notice button { color: #afd0ff; }
.live-loading, .live-error { min-height: 150px; display: flex; align-items: center; justify-content: center; gap: 15px; margin: 12px 0; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.live-loading > span { width: 30px; height: 30px; border: 3px solid rgba(112,166,255,.18); border-top-color: var(--blue-2); border-radius: 50%; animation: spin .9s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.live-loading strong, .live-error strong { display: block; font-size: .82rem; }.live-loading p, .live-error p { margin: 3px 0 0; color: var(--muted); font-size: .7rem; }
.live-error { justify-content: flex-start; border-color: rgba(240,178,76,.2); }.live-error > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: rgba(240,178,76,.1); color: var(--amber); font-weight: 800; }.live-error button { margin-left: auto; }
.live-source-line { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 10px; color: var(--muted); font-size: .7rem; }.live-source-line > div { display: flex; align-items: center; gap: 9px; }.live-source-line strong { color: #a7dfc1; }.live-source-line small { color: #8295ad; }
.foodea-metrics .live-featured { border-color: rgba(80,201,144,.26); background: linear-gradient(145deg, rgba(28,81,65,.45), rgba(11,27,48,.98)); }
.source-badge { padding: 4px 7px; border-radius: 6px; background: rgba(80,201,144,.09); color: #8ed5b1; font-size: .64rem; }
.live-table-wrap { max-height: 440px; }.live-table { min-width: 760px; }.live-table td { vertical-align: middle; }
.coverage-state { display: inline-flex; align-items: center; gap: 6px; color: #8ed5b1; font-size: .65rem; }.coverage-state::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--green); }.coverage-state.missing { color: #e7bb70; }.coverage-state.missing::before { background: var(--amber); }
.live-health { display: grid; gap: 9px; }.live-health article { display: grid; grid-template-columns: 1fr auto; gap: 4px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.025); }.live-health article span { color: var(--muted); font-size: .66rem; }.live-health article strong { color: #d5e0ed; font-size: .78rem; }.live-health article small { grid-column: 1 / -1; color: #72859c; font-size: .62rem; }
.territory-live-grid { display: grid; gap: 8px; }.territory-live-grid article { display: grid; grid-template-columns: 1fr auto; gap: 5px; padding: 11px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.025); }.territory-live-grid span { color: #aebdce; font-size: .72rem; }.territory-live-grid strong { color: #fff; }.territory-live-grid small { grid-column: 1 / -1; color: #72859c; font-size: .63rem; }
.application-coverage { display: grid; grid-template-columns: repeat(2, 1fr); gap: 7px; }.application-coverage article { padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.025); }.application-coverage div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.application-coverage strong { font-size: .69rem; }.application-coverage b { color: #a7c9fa; font-size: .72rem; }.application-coverage small { display: block; margin-top: 4px; color: #72859c; font-size: .61rem; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 12px; }
.metric-card { min-height: 140px; padding: 18px; background: linear-gradient(145deg, rgba(16,31,50,.98), rgba(10,22,37,.98)); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.metric-card.featured { border-color: rgba(67,137,255,.28); background: linear-gradient(145deg, rgba(28,60,105,.72), rgba(11,27,48,.98)); }
.metric-label { display: block; color: #9aaac0; font-size: .76rem; }
.metric-card strong { display: block; margin: 9px 0 2px; font-family: Georgia, serif; font-size: 2.15rem; font-weight: 500; }
.metric-card small { color: #71839a; font-size: .72rem; }
.dashboard-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px; }
.span-4 { grid-column: span 4; }.span-5 { grid-column: span 5; }.span-7 { grid-column: span 7; }.span-8 { grid-column: span 8; }.span-12 { grid-column: 1 / -1; }
.panel { padding: 20px; background: linear-gradient(150deg, rgba(14,29,48,.98), rgba(9,20,34,.98)); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.branch-map { display: grid; grid-template-columns: 1.15fr 1.15fr .8fr; gap: 10px; }
.branch-card { min-width: 0; min-height: 195px; display: flex; flex-direction: column; align-items: flex-start; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.018); text-align: left; cursor: pointer; transition: .18s ease; }
.branch-card:hover { transform: translateY(-2px); border-color: rgba(112,166,255,.35); background: rgba(67,137,255,.055); }
.branch-card.branch-one { border-top: 2px solid var(--blue); }.branch-card.branch-two { border-top: 2px solid var(--purple); }.branch-card.holding { border-top: 2px solid var(--gold); }
.branch-tag { color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; }
.branch-card > strong { margin: 20px 0 2px; font-family: Georgia, serif; font-size: 1.75rem; font-weight: 500; }
.branch-card > span:nth-child(3) { color: #8fa0b6; font-size: .74rem; }
.brand-chips { margin-top: auto; display: flex; flex-wrap: wrap; gap: 5px; }
.brand-chips i { padding: 4px 6px; border-radius: 5px; background: rgba(255,255,255,.045); color: #b1bece; font-size: .63rem; font-style: normal; }
.health-gauge { --size: 138px; width: var(--size); height: var(--size); margin: 18px auto; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--blue) calc(var(--value) * 1%), rgba(255,255,255,.07) 0); position: relative; }
.health-gauge::before { content: ""; position: absolute; inset: 11px; border-radius: 50%; background: #0d1b2d; }
.health-gauge > div { z-index: 1; text-align: center; }.health-gauge strong { display: block; font-family: Georgia, serif; font-size: 1.75rem; }.health-gauge span { color: var(--muted); font-size: .68rem; }
.health-legend { display: grid; gap: 8px; }
.health-legend div { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: 8px; font-size: .72rem; }.health-legend b { font-weight: 550; color: #c7d2e0; }.health-legend em { color: var(--muted); font-style: normal; }
.dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; }.dot.good { background: var(--green); }.dot.warning { background: var(--amber); }.dot.muted { background: #65758a; }.dot.blue { background: var(--blue); }
.sequence { margin: 0; padding: 0; list-style: none; display: grid; }
.sequence li { display: grid; grid-template-columns: 34px 1fr auto; gap: 12px; padding: 12px 0; border-top: 1px solid var(--line); align-items: center; }.sequence li:first-child { border-top: 0; }.sequence li > span { color: #6d7f96; font-family: Georgia, serif; }.sequence li.active > span { color: var(--blue-2); }.sequence strong { font-size: .82rem; }.sequence p { margin: 2px 0 0; color: var(--muted); font-size: .7rem; }.sequence i { color: #8294aa; font-size: .66rem; font-style: normal; padding: 4px 7px; background: rgba(255,255,255,.035); border-radius: 5px; }
.decision-list { display: grid; gap: 7px; }
.decision-item { display: grid; grid-template-columns: 8px 1fr auto; gap: 9px; align-items: center; padding: 10px; background: rgba(255,255,255,.025); border-radius: 8px; }
.decision-item span:first-child { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); }.decision-item strong { display: block; font-size: .75rem; }.decision-item small { color: var(--muted); font-size: .65rem; }.decision-item b { color: #7d8fa6; font-size: .65rem; }

.filter-bar { display: grid; grid-template-columns: minmax(260px, 1.6fr) repeat(3, minmax(150px, .55fr)); gap: 9px; margin-bottom: 12px; }
.search-box { display: flex; gap: 9px; align-items: center; background: var(--panel); border: 1px solid var(--line-strong); border-radius: 9px; padding: 0 12px; color: var(--muted); }
.search-box input { width: 100%; padding: 9px 0; background: transparent; border: 0; color: var(--text); outline: 0; }
.filter-bar select { width: 100%; }
.table-summary { display: flex; align-items: center; justify-content: space-between; margin: 12px 2px 8px; color: var(--muted); font-size: .72rem; }.table-summary div { display: flex; gap: 7px; align-items: center; }
.data-table-wrap, .roadmap-table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 12px; background: rgba(10,22,37,.8); box-shadow: var(--shadow); }
.data-table, .roadmap-table { width: 100%; border-collapse: collapse; min-width: 1040px; }
.data-table th, .roadmap-table th { padding: 11px 13px; color: #72849b; background: rgba(255,255,255,.025); border-bottom: 1px solid var(--line); text-align: left; font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; }
.data-table td, .roadmap-table td { padding: 11px 13px; border-bottom: 1px solid rgba(148,174,208,.08); color: #b9c5d4; font-size: .76rem; }
.data-table tr:last-child td, .roadmap-table tr:last-child td { border-bottom: 0; }.data-table tbody tr:hover { background: rgba(67,137,255,.035); }
.entity-name { display: flex; align-items: center; gap: 8px; color: #dce5f0; font-weight: 600; }.entity-logo { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; background: var(--panel-3); color: var(--blue-2); font-size: .65rem; }
.status-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 7px; border-radius: 6px; font-size: .67rem; }.status-badge::before { content:""; width: 6px; height: 6px; border-radius: 50%; }.status-confirmed { color: #98dcba; background: rgba(80,201,144,.09); }.status-confirmed::before { background: var(--green); }.status-verify { color: #f0c983; background: rgba(240,178,76,.1); }.status-verify::before { background: var(--amber); }.status-project { color: #9fc4ff; background: rgba(67,137,255,.1); }.status-project::before { background: var(--blue); }.status-inventory { color: #b9a8ec; background: rgba(152,116,255,.1); }.status-inventory::before { background: var(--purple); }
.row-action { border: 0; background: transparent; color: var(--blue-2); cursor: pointer; }

.access-layout { display: grid; grid-template-columns: minmax(300px, .8fr) 2fr; gap: 12px; }.profile-panel { align-self: start; }.profile-identity { display: flex; align-items: center; gap: 13px; margin: 14px 0 20px; }.large-avatar { width: 52px; height: 52px; }.profile-identity h2 { font-size: 1rem; }.profile-identity p { margin: 3px 0 0; color: var(--muted); font-size: .75rem; }.field-label { display: grid; gap: 7px; color: var(--muted); font-size: .72rem; }.field-label select { width: 100%; }.rule-callout { margin: 16px 0; padding: 12px; border-left: 2px solid var(--gold); background: var(--gold-soft); }.rule-callout span { display: block; color: var(--gold); font-size: .63rem; text-transform: uppercase; }.rule-callout strong { display: block; margin-top: 2px; color: #e2d4b8; font-size: .75rem; }.profile-scope { display: flex; flex-wrap: wrap; gap: 6px; }.profile-scope span { padding: 5px 7px; background: rgba(255,255,255,.04); border-radius: 6px; color: #aebccd; font-size: .67rem; }
.settings-entry { margin-bottom: 12px; padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }.settings-entry h2 { margin: 4px 0; font-size: 1.05rem; }.settings-entry p:last-child { margin: 0; color: var(--muted); font-size: .74rem; }
.profile-admin-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:12px; margin-bottom:12px; }
.profile-create-panel,.profile-list-panel { min-width:0; padding:20px; }
.sync-state { padding:5px 8px; border:1px solid rgba(80,201,144,.24); border-radius:7px; background:rgba(80,201,144,.08); color:#91d9b5; font-size:.65rem; }
.sync-state.busy { border-color:rgba(213,174,101,.25); background:rgba(213,174,101,.09); color:#e2c182; }
.profile-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.profile-role-field { grid-column:1 / -1; }
.profile-form-grid input,.profile-form-grid select,.activation-result input { width:100%; min-height:40px; padding:9px 10px; border:1px solid var(--line-strong); border-radius:8px; background:#091525; color:#d6e0ed; font:inherit; }
.profile-form-grid input:focus,.profile-form-grid select:focus,.activation-result input:focus { outline:2px solid rgba(67,137,255,.32); border-color:#4389ff; }
.scope-fieldset { min-width:0; margin:14px 0; padding:12px; border:1px solid var(--line); border-radius:10px; }
.scope-fieldset legend { padding:0 5px; color:var(--muted); font-size:.68rem; }
.scope-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.scope-option { display:flex; align-items:center; gap:8px; min-width:0; padding:9px; border:1px solid rgba(148,174,208,.1); border-radius:8px; background:rgba(255,255,255,.025); color:#b9c7d7; font-size:.69rem; cursor:pointer; }
.scope-option input { accent-color:var(--gold); }
.profile-form-actions,.activation-actions { display:flex; justify-content:flex-end; align-items:center; gap:8px; flex-wrap:wrap; }
.activation-result { margin-top:14px; padding:13px; border:1px solid rgba(213,174,101,.2); border-radius:10px; background:rgba(213,174,101,.05); }
.activation-actions { justify-content:flex-start; margin-top:9px; }
.profile-message { min-height:18px; margin:10px 0 0; color:var(--muted); font-size:.7rem; }
.profile-message[data-tone="success"] { color:#91d9b5; }
.profile-message[data-tone="error"] { color:#f09aa0; }
.profile-list { display:grid; gap:8px; max-height:520px; overflow:auto; padding-right:3px; }
.profile-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 12px; align-items:start; padding:12px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.02); }
.profile-row-main { min-width:0; }
.profile-row-main strong,.profile-row-main span,.profile-row-main small { display:block; overflow:hidden; text-overflow:ellipsis; }
.profile-row-main strong { font-size:.78rem; }
.profile-row-main span { margin-top:2px; color:#9eb0c5; font-size:.68rem; }
.profile-row-main small { margin-top:6px; color:#73869e; font-size:.63rem; white-space:normal; line-height:1.45; }
.profile-status { padding:4px 6px; border-radius:6px; font-size:.59rem; white-space:nowrap; }
.profile-status.active { background:rgba(80,201,144,.09); color:#91d9b5; }
.profile-status.pending { background:rgba(213,174,101,.09); color:#e2c182; }
.profile-status.suspended { background:rgba(239,107,115,.08); color:#ef9da3; }
.profile-row-actions { grid-column:1 / -1; display:flex; gap:11px; padding-top:5px; border-top:1px solid rgba(148,174,208,.08); }
.profile-empty { margin:0; padding:20px; border:1px dashed var(--line); border-radius:10px; color:var(--muted); text-align:center; font-size:.72rem; }
@media(max-width:1050px){.profile-admin-grid{grid-template-columns:1fr}.profile-list{max-height:none}}
@media(max-width:620px){.profile-form-grid,.scope-options{grid-template-columns:1fr}.profile-role-field{grid-column:auto}.activation-actions>*{flex:1;text-align:center}.profile-row{grid-template-columns:1fr}.profile-status{justify-self:start}}
.permission-matrix { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }.permission-cell { padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.02); }.permission-cell span { display: block; color: var(--muted); font-size: .68rem; }.permission-cell strong { display: block; margin-top: 9px; font-size: .83rem; }.permission-cell small { display: block; margin-top: 4px; color: #71839a; font-size: .65rem; }.permission-cell.allow { border-color: rgba(80,201,144,.18); }.permission-cell.allow strong { color: #9be1bf; }.permission-cell.limit strong { color: #f0c983; }.permission-cell.deny { opacity: .55; }.permission-cell.deny strong { color: #9aa6b7; }.separation-rule { margin-top: 16px; padding: 14px; background: rgba(67,137,255,.07); border-radius: 10px; }.separation-rule strong { font-size: .78rem; }.separation-rule p { margin: 4px 0 0; color: var(--muted); font-size: .7rem; }

.pipeline { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin-bottom: 12px; }.pipeline-step { position: relative; min-height: 108px; padding: 13px; border: 1px solid var(--line); background: var(--panel); }.pipeline-step:first-child { border-radius: 12px 0 0 12px; }.pipeline-step:last-child { border-radius: 0 12px 12px 0; }.pipeline-step span { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.05); color: #7c8da3; font-size: .66rem; }.pipeline-step strong { display: block; margin-top: 13px; font-size: .78rem; }.pipeline-step small { color: var(--muted); font-size: .65rem; }.pipeline-step.running { border-color: rgba(67,137,255,.4); background: rgba(67,137,255,.08); }.pipeline-step.done span { background: rgba(80,201,144,.15); color: #9be1bf; }.pipeline-step.quarantine { border-color: rgba(240,178,76,.25); }.pipeline-step.quarantine span { background: rgba(240,178,76,.12); color: #f0c983; }
.log-console { min-height: 292px; max-height: 350px; overflow: auto; padding: 11px; background: #050c15; border: 1px solid rgba(148,174,208,.12); border-radius: 10px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }.log-console div { display: grid; grid-template-columns: 76px 1fr; gap: 10px; padding: 6px; border-bottom: 1px solid rgba(255,255,255,.035); color: #a9b7c8; font-size: .68rem; }.log-console time { color: #5f7692; }.log-console .ok { color: #8ed5b1; }.log-console .warn { color: #ebc47f; }
.guard-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }.guard-list li { display: flex; gap: 10px; padding: 10px; background: rgba(255,255,255,.025); border-radius: 8px; }.guard-list li > span { color: var(--green); }.guard-list strong { display: block; font-size: .75rem; }.guard-list p { margin: 2px 0 0; color: var(--muted); font-size: .68rem; }

.connector-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 12px; }.connector-card { position: relative; min-height: 335px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(150deg, var(--panel-2), var(--panel)); }.connector-card.critical { border-color: rgba(240,178,76,.22); }.connector-card.dropbox-card { grid-column:span 2; }.connector-logo { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 20px; border-radius: 10px; font-weight: 800; font-size: .78rem; }.dropbox { background:#0061ff; color:#fff; }.sage { background: #2b755d; color: #c5f5df; }.pos { background: #183d75; color: #b9d6ff; }.stock { background: #5b3f82; color: #ddcaff; }.asset { background: #76572c; color: #f2d5a3; }.connector-head { display: flex; justify-content: space-between; gap: 10px; }.connector-head h2 { font-size: .95rem; }.connector-head p { margin: 3px 0 0; color: var(--muted); font-size: .68rem; }.connector-head span { align-self: flex-start; padding: 4px 6px; background: rgba(240,178,76,.08); color: #e8c17c; border-radius: 5px; font-size: .62rem; }.connector-card > p { min-height: 64px; margin: 15px 0 12px; color: #98a8bc; font-size: .73rem; }.connector-card ul { margin: 0 0 18px; padding: 0; list-style: none; display: grid; gap: 6px; }.connector-card li { color: #bdc9d7; font-size: .68rem; }.connector-card li::before { content: "·"; color: var(--blue-2); margin-right: 6px; }.connector-contract { display: grid; grid-template-columns: .75fr 2fr; gap: 30px; align-items: center; }.contract-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }.contract-grid span { padding: 9px; background: rgba(255,255,255,.025); border-radius: 7px; color: #aebccd; font-size: .68rem; }

.finance-switch { display: inline-flex; padding: 4px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }.finance-switch button { padding: 7px 11px; border: 0; border-radius: 7px; background: transparent; color: var(--muted); cursor: pointer; font-size: .72rem; }.finance-switch button.active { background: var(--blue-soft); color: #c5dbff; }.finance-metrics { grid-template-columns: repeat(3, 1fr); }.bar-chart { height: 275px; display: flex; align-items: flex-end; gap: 12px; padding: 18px 8px 6px; border-bottom: 1px solid var(--line-strong); background: repeating-linear-gradient(to top, transparent 0, transparent 54px, rgba(148,174,208,.07) 55px); }.bar-wrap { flex: 1; height: 100%; display: flex; align-items: flex-end; justify-content: center; position: relative; }.bar { width: min(46px, 70%); height: var(--h); border-radius: 5px 5px 1px 1px; background: linear-gradient(to top, #285eb6, #5d9cff); transition: height .3s ease; }.bar-wrap span { position: absolute; bottom: -27px; color: #73869d; font-size: .63rem; }.bar-wrap strong { position: absolute; bottom: calc(var(--h) + 6px); color: #9db4cf; font-size: .61rem; }.quality-list { display: grid; gap: 15px; }.quality-list div { display: grid; grid-template-columns: 1fr auto; gap: 8px; color: var(--muted); font-size: .7rem; }.quality-list strong { color: #bac7d6; }.quality-list i { grid-column: 1 / -1; height: 5px; border-radius: 4px; background: linear-gradient(to right, var(--blue) var(--p), rgba(255,255,255,.06) var(--p)); }.empty-note { margin-top: 22px; padding: 12px; background: rgba(255,255,255,.025); border-radius: 8px; color: #778aa2; font-size: .68rem; }

.supply-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 12px; }.supply-card { padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(150deg, var(--panel-2), var(--panel)); }.supply-card header { display: flex; justify-content: space-between; gap: 10px; }.supply-card header span { color: var(--muted); font-size: .67rem; }.supply-card h2 { margin-top: 4px; }.supply-score { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--green) calc(var(--score) * 1%), rgba(255,255,255,.07) 0); position: relative; }.supply-score::before { content:""; position:absolute; inset:5px; border-radius:50%; background:var(--panel-2); }.supply-score b { z-index:1; font-size:.64rem; }.supply-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 17px 0; }.supply-metrics span { padding: 8px; background: rgba(255,255,255,.025); border-radius: 7px; color: var(--muted); font-size: .62rem; }.supply-metrics b { display: block; margin-top: 4px; color: #d4deea; font-size: .76rem; }.supply-reason { min-height: 58px; margin: 0 0 13px; color: #8fa1b7; font-size: .69rem; }.workflow-strip { display: flex; align-items: center; gap: 6px; }.workflow-strip span { flex: 1; height: 5px; border-radius: 4px; background: rgba(255,255,255,.07); }.workflow-strip span.done { background: var(--green); }.supply-card button { width: 100%; margin-top: 13px; }.reason-flow { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.reason-flow > div { flex: 1; padding: 10px; background: rgba(255,255,255,.025); border-radius: 8px; }.reason-flow span { color: var(--blue-2); font-size: .65rem; }.reason-flow strong { display: block; font-size: .75rem; }.reason-flow p { margin: 2px 0 0; color: var(--muted); font-size: .62rem; }.reason-flow > b { color: #4c6078; font-weight: 400; }
.supply-state-editor { display:grid; grid-template-columns:1fr auto; align-items:center; gap:10px; margin-top:9px; padding:9px 10px; border:1px solid var(--line); border-radius:9px; background:#f6f8fb; color:var(--muted); font-size:.72rem; font-weight:700; }
.supply-state-editor select { min-width:142px; padding:8px 28px 8px 9px; border:1px solid var(--line); border-radius:7px; background:#ffffff; color:var(--text); font:inherit; cursor:pointer; }
.pilot-heading-actions { display:flex; align-items:center; justify-content:flex-end; gap:9px; flex-wrap:wrap; }
.pilot-heading-actions .secondary-button,.pilot-heading-actions .button-link { white-space:nowrap; }

.asset-types { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 12px; }.asset-types article { min-height: 190px; padding: 18px; border: 1px solid var(--line); border-top: 2px solid var(--gold); border-radius: var(--radius); background: linear-gradient(150deg, var(--panel-2), var(--panel)); }.asset-symbol { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 22px; background: var(--gold-soft); color: var(--gold); border-radius: 9px; }.asset-types span { display: block; color: var(--muted); font-size: .7rem; }.asset-types strong { display: block; margin: 4px 0 7px; font-family: Georgia, serif; font-size: 1.25rem; }.asset-types small { color: #788ba3; font-size: .67rem; }.schema-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }.schema-grid span { padding: 10px; background: rgba(255,255,255,.025); border-radius: 8px; color: var(--muted); font-size: .66rem; }.schema-grid b { display: block; color: #a8c8fb; font-family: ui-monospace, monospace; font-size: .7rem; }.question-list { margin: 0; padding-left: 22px; display: grid; gap: 11px; color: #b8c5d4; font-size: .75rem; }.question-list li::marker { color: var(--gold); }

.workflow-board { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 12px; }.workflow-column { min-height: 340px; padding: 12px; background: rgba(10,22,37,.68); border: 1px solid var(--line); border-radius: 13px; }.workflow-column header { display: flex; justify-content: space-between; align-items: center; padding: 3px 3px 12px; }.workflow-column h2 { font-size: .78rem; }.workflow-column header span { min-width: 23px; padding: 2px 6px; text-align:center; border-radius: 5px; background: rgba(255,255,255,.05); color: var(--muted); font-size: .66rem; }.workflow-items { display: grid; gap: 8px; }.workflow-card { padding: 12px; background: var(--panel-2); border: 1px solid var(--line); border-radius: 9px; }.workflow-card .work-meta { display: flex; justify-content: space-between; color: #74869d; font-size: .61rem; }.workflow-card strong { display: block; margin: 8px 0 4px; font-size: .76rem; }.workflow-card p { margin: 0 0 11px; color: var(--muted); font-size: .65rem; }.workflow-card footer { display: flex; justify-content: space-between; align-items:center; }.workflow-card footer span { color: #8296ae; font-size: .63rem; }.workflow-card button { border: 0; background: var(--blue-soft); color: #acd0ff; border-radius: 6px; padding: 5px 7px; cursor: pointer; font-size: .63rem; }.state-model { display: grid; grid-template-columns: .7fr 2fr; gap: 24px; align-items: center; }.state-flow { display: flex; align-items:center; justify-content:space-between; gap:6px; }.state-flow span { padding: 7px 8px; background: rgba(255,255,255,.035); border-radius: 6px; color: #aebccd; font-size: .65rem; }.state-flow b { color: #4b6079; font-weight: 400; }

.priority-banner { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 12px; padding: 20px; border: 1px solid rgba(67,137,255,.25); border-radius: var(--radius); background: linear-gradient(120deg, rgba(35,95,200,.2), rgba(10,22,37,.9)); }.priority-banner span { color: #9fc4ff; font-size: .68rem; text-transform: uppercase; letter-spacing:.08em; }.priority-banner strong { display:block; margin:4px 0; font-family:Georgia,serif; font-size:1.35rem; }.priority-banner p { margin:0; color:var(--muted); font-size:.72rem; }.priority-banner > b { color:rgba(112,166,255,.28); font-family:Georgia,serif; font-size:3rem; }.score-dots { display:flex; gap:3px; }.score-dots i { width:7px; height:7px; border-radius:2px; background:rgba(255,255,255,.08); }.score-dots i.on { background:var(--blue); }.risk-low { color:#8ed5b1; }.risk-medium { color:#ebc47f; }.risk-high { color:#ef8c93; }.priority-button { padding:6px 8px; border:1px solid var(--line); border-radius:6px; background:rgba(255,255,255,.025); color:#a7b8cb; cursor:pointer; font-size:.66rem; }.priority-button.selected { border-color:rgba(67,137,255,.35); background:var(--blue-soft); color:#bcd6ff; }.meeting-output { margin-top:12px; display:grid; grid-template-columns:.7fr 2fr; gap:20px; align-items:center; }.meeting-output > div:last-child { display:grid; grid-template-columns:repeat(5,1fr); gap:7px; }.meeting-output span { display:flex; align-items:center; gap:7px; padding:8px; background:rgba(255,255,255,.025); border-radius:7px; color:#aab9ca; font-size:.66rem; }.meeting-output b { color:var(--gold); }

dialog { color: var(--text); }.detail-dialog, .integrity-dialog { width: min(620px, calc(100% - 28px)); max-height: 85vh; overflow: auto; padding: 26px; border: 1px solid var(--line-strong); border-radius: 16px; background: #0c192a; box-shadow: 0 40px 100px rgba(0,0,0,.55); }.detail-dialog::backdrop, .integrity-dialog::backdrop { background: rgba(1,6,12,.76); backdrop-filter: blur(4px); }.dialog-close { position:absolute; top:13px; right:13px; width:32px; height:32px; border:1px solid var(--line); border-radius:8px; background:var(--panel-2); cursor:pointer; color:var(--muted); }.detail-hero { padding-bottom:18px; border-bottom:1px solid var(--line); }.detail-hero h2 { margin-top:4px; font-family:Georgia,serif; font-size:1.7rem; }.detail-hero p { margin:8px 0 0; color:var(--muted); font-size:.78rem; }.detail-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-top:17px; }.detail-grid div { padding:11px; background:rgba(255,255,255,.025); border-radius:8px; }.detail-grid span { display:block; color:var(--muted); font-size:.63rem; }.detail-grid strong { display:block; margin-top:3px; font-size:.76rem; }.integrity-dialog h2 { margin:0 30px 16px 0; font-family:Georgia,serif; font-size:1.6rem; }.integrity-item { display:grid; grid-template-columns:28px 1fr; gap:10px; padding:11px 0; border-top:1px solid var(--line); }.integrity-item > span { width:25px; height:25px; display:grid; place-items:center; border-radius:7px; background:rgba(240,178,76,.1); color:var(--amber); font-size:.65rem; }.integrity-item strong { display:block; font-size:.75rem; }.integrity-item p { margin:2px 0 0; color:var(--muted); font-size:.68rem; }.dialog-done { width:100%; margin-top:16px; }
.toast { position:fixed; z-index:50; right:22px; bottom:22px; max-width:360px; padding:12px 15px; border:1px solid rgba(80,201,144,.25); border-radius:10px; background:#10253b; color:#ccebdd; box-shadow:var(--shadow); font-size:.74rem; opacity:0; transform:translateY(12px); pointer-events:none; transition:.2s ease; }.toast.show { opacity:1; transform:translateY(0); }

/* Portail applicatif WBNA */
.apps-heading { margin-bottom: 18px; }
.data-legend { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.data-legend > span { display:inline-flex; align-items:center; gap:7px; padding:6px 9px; border:1px solid var(--line); border-radius:7px; color:#9fb0c4; background:rgba(255,255,255,.025); font-size:.7rem; }
.data-legend i, .data-dot { width:7px; height:7px; display:inline-block; border-radius:50%; }
.legend-live i, .data-dot.live { background:var(--green); box-shadow:0 0 0 4px rgba(80,201,144,.08); }
.legend-demo i, .data-dot.demo { background:var(--gold); box-shadow:0 0 0 4px rgba(213,174,101,.08); }
.legend-core i { background:var(--blue); }
.brand-tabs { display:flex; gap:7px; margin:0 0 12px; padding:2px 0 8px; overflow-x:auto; scrollbar-width:thin; }
.brand-tab { flex:0 0 auto; min-height:38px; padding:8px 12px; border:1px solid var(--line); border-radius:9px; background:var(--panel); color:#9eafc3; cursor:pointer; font-size:.74rem; }
.brand-tab:hover { border-color:rgba(112,166,255,.32); color:#d7e4f4; }
.brand-tab.active { border-color:rgba(67,137,255,.45); background:var(--blue-soft); color:#dbe9ff; }
.brand-tab[data-live="true"]::after { content:" réel"; color:#8ed5b1; font-size:.58rem; text-transform:uppercase; }
.suite-banner { position:relative; overflow:hidden; min-height:145px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px; margin-bottom:12px; padding:22px 24px; border:1px solid rgba(67,137,255,.22); border-radius:var(--radius); background:radial-gradient(circle at 8% 40%,rgba(67,137,255,.18),transparent 20rem),linear-gradient(115deg,#102642,#0b192b 62%,#091522); box-shadow:var(--shadow); }
.suite-banner::after { content:""; position:absolute; width:280px; height:280px; right:-100px; top:-115px; border:1px solid rgba(213,174,101,.12); border-radius:50%; }
.suite-spiral { width:78px; height:78px; display:grid; place-items:center; border-radius:22px; background:rgba(2,10,19,.42); border:1px solid rgba(112,166,255,.18); }
.suite-spiral img { width:64px; height:64px; object-fit:contain; transition:transform .8s ease; }
.suite-banner:hover .suite-spiral img { transform:rotate(45deg); }
.suite-banner span { color:var(--gold); font-size:.67rem; text-transform:uppercase; letter-spacing:.1em; }
.suite-banner h2 { margin:4px 0 5px; font-family:Georgia,serif; font-size:1.65rem; font-weight:500; }
.suite-banner p { margin:0; color:#8fa2b8; font-size:.77rem; }
.suite-status { z-index:1; padding:7px 10px; border-radius:7px; background:rgba(213,174,101,.1); border:1px solid rgba(213,174,101,.18); color:#ebd3a4; font-size:.69rem; }
.suite-status.live { background:rgba(80,201,144,.09); border-color:rgba(80,201,144,.2); color:#9be1bf; }
.application-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.application-card { min-height:190px; display:flex; flex-direction:column; align-items:flex-start; padding:17px; border:1px solid var(--line); border-radius:13px; background:linear-gradient(150deg,rgba(16,31,50,.98),rgba(9,20,34,.98)); text-align:left; cursor:pointer; transition:.18s ease; }
.application-card:hover { transform:translateY(-3px); border-color:rgba(112,166,255,.36); box-shadow:0 20px 45px rgba(0,0,0,.2); }
.application-card.app-locked { opacity:.42; cursor:not-allowed; }.application-card.app-locked:hover { transform:none; border-color:var(--line); box-shadow:none; }
.application-card header { width:100%; display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.app-spiral { width:42px; height:42px; display:grid; place-items:center; border-radius:11px; background:rgba(67,137,255,.09); border:1px solid rgba(67,137,255,.14); }
.app-spiral img { width:31px; height:31px; object-fit:contain; transition:transform .55s ease; }
.application-card:hover .app-spiral img { transform:rotate(38deg); }
.app-state { padding:4px 6px; border-radius:5px; background:rgba(213,174,101,.09); color:#dfc28d; font-size:.58rem; text-transform:uppercase; letter-spacing:.05em; }
.app-state.live { background:rgba(80,201,144,.09); color:#8ed5b1; }
.application-card h3 { margin:17px 0 4px; font-size:.92rem; }
.application-card p { margin:0; color:#8396ad; font-size:.69rem; line-height:1.45; }
.application-card footer { width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto; padding-top:16px; color:#74889f; font-size:.62rem; }
.application-card footer b { color:#83b2ff; font-size:.68rem; }
.suite-foundation { margin-top:0; }
.mirror-flow { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.mirror-flow span { flex:1; min-height:50px; display:grid; place-items:center; padding:8px; border-radius:8px; background:rgba(255,255,255,.026); color:#b9c7d7; text-align:center; font-size:.7rem; }
.mirror-flow b { color:#4f6d91; font-weight:400; }
.panel-copy { margin:14px 0 0; color:#7f92a9; font-size:.7rem; }
.private-foundation { border-color:rgba(213,174,101,.16); }
.foundation-list { display:grid; gap:7px; }
.foundation-list span { padding:9px 10px; border-radius:8px; background:rgba(255,255,255,.025); color:#8fa2b8; font-size:.69rem; }
.foundation-list b { display:inline-block; min-width:65px; color:#dfc38e; }

/* Pilotage multi-périodes */
.pilot-toolbar { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:9px; margin-bottom:10px; padding:13px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.pilot-toolbar label { display:grid; gap:6px; color:#8295ad; font-size:.67rem; }
.pilot-toolbar select { width:100%; min-height:39px; padding:7px 30px 7px 10px; border:1px solid var(--line-strong); border-radius:8px; background:#091525; color:#d6e0ed; }
.pilot-context-line { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; padding:9px 12px; border:1px solid var(--line); border-radius:9px; background:rgba(255,255,255,.02); }
.pilot-context-line > div:first-child { display:flex; align-items:center; gap:8px; }
.pilot-context-line strong { font-size:.72rem; }.pilot-context-line small,.period-caption { color:#71849c; font-size:.65rem; }
.pilot-kpis { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.pilot-kpi { min-height:136px; padding:15px; border:1px solid var(--line); border-radius:13px; background:linear-gradient(145deg,rgba(16,31,50,.98),rgba(10,22,37,.98)); }
.pilot-kpi.primary { border-color:rgba(67,137,255,.28); background:linear-gradient(145deg,rgba(27,59,103,.7),rgba(11,27,48,.98)); }
.pilot-kpi > span { display:block; min-height:34px; color:#8fa0b7; font-size:.68rem; }
.pilot-kpi strong { display:block; margin:5px 0 4px; font-family:Georgia,serif; font-size:1.55rem; font-weight:500; }
.pilot-kpi footer { display:flex; align-items:center; justify-content:space-between; gap:5px; color:#6f829a; font-size:.61rem; }
.delta { display:inline-flex; align-items:center; gap:3px; padding:3px 5px; border-radius:5px; font-size:.6rem; }
.delta.up { background:rgba(80,201,144,.09); color:#91dab5; }.delta.down { background:rgba(239,107,115,.09); color:#f09aa0; }.delta.flat { background:rgba(255,255,255,.04); color:#a0adbd; }
.status-good strong { color:#a4e4c4; }.status-warn strong { color:#f0c983; }.status-bad strong { color:#f29aa0; }
.pilot-grid { margin-top:0; }
.chart-legend { display:flex; gap:10px; color:#7e90a7; font-size:.62rem; }.chart-legend span { display:flex; align-items:center; gap:5px; }.chart-legend i { width:10px; height:5px; border-radius:2px; }.chart-legend .current { background:var(--blue); }.chart-legend .comparison { background:#54677f; }
.pilot-chart { height:310px; display:flex; align-items:flex-end; gap:7px; padding:24px 6px 30px; border-bottom:1px solid var(--line); background:repeating-linear-gradient(to top,transparent 0,transparent 55px,rgba(148,174,208,.06) 56px); overflow-x:auto; }
.chart-group { min-width:38px; flex:1; height:100%; display:flex; align-items:flex-end; justify-content:center; gap:3px; position:relative; }
.chart-group i { width:min(16px,42%); min-height:3px; border-radius:4px 4px 1px 1px; transition:height .25s ease; }.chart-group i.current { height:var(--current); background:linear-gradient(to top,#2866cf,#65a1ff); }.chart-group i.comparison { height:var(--comparison); background:#43546a; }
.chart-group span { position:absolute; bottom:-25px; color:#6f8299; font-size:.58rem; white-space:nowrap; }.chart-group em { position:absolute; bottom:calc(var(--current) + 5px); color:#9db6d3; font-size:.54rem; font-style:normal; }
.pilot-quality { display:grid; gap:12px; }
.quality-row { display:grid; grid-template-columns:1fr auto; gap:6px; }
.quality-row span { color:#91a3b8; font-size:.68rem; }.quality-row b { color:#cbd7e5; font-size:.67rem; }.quality-row i { grid-column:1/-1; height:6px; overflow:hidden; border-radius:4px; background:rgba(255,255,255,.055); }.quality-row i::after { content:""; display:block; width:var(--value); height:100%; border-radius:inherit; background:var(--bar,var(--blue)); }
.pilot-table-wrap { max-height:430px; }.pilot-table { min-width:1060px; }.pilot-table td { vertical-align:middle; }
.source-cell { display:inline-flex; align-items:center; gap:5px; font-size:.63rem; }.source-cell::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--gold); }.source-cell.live::before { background:var(--green); }
.app-dialog { width:min(760px,calc(100% - 28px)); }
.app-dialog-hero { display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:center; padding-bottom:18px; border-bottom:1px solid var(--line); }
.app-dialog-hero .app-spiral { width:56px; height:56px; }.app-dialog-hero .app-spiral img { width:43px; height:43px; }
.app-dialog-hero h2 { font-family:Georgia,serif; font-size:1.6rem; }.app-dialog-hero p { margin:4px 0 0; color:#8498af; font-size:.72rem; }
.module-demo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:15px 0; }.module-demo-grid article { padding:12px; border:1px solid var(--line); border-radius:9px; background:rgba(255,255,255,.025); }.module-demo-grid span { display:block; color:#798ca4; font-size:.62rem; }.module-demo-grid strong { display:block; margin-top:4px; font-size:.88rem; }
.module-actions { display:grid; gap:7px; }.module-action { display:grid; grid-template-columns:1fr auto; gap:10px; padding:10px; border-radius:8px; background:rgba(255,255,255,.025); }.module-action strong { font-size:.71rem; }.module-action small { grid-column:1/-1; color:#71849b; font-size:.63rem; }.module-action button { grid-row:1/3; grid-column:2; align-self:center; padding:6px 8px; border:1px solid var(--line); border-radius:6px; background:var(--blue-soft); color:#a9caff; cursor:pointer; font-size:.62rem; }

.pulse-dialog { width:min(1480px,calc(100% - 24px)); height:min(920px,calc(100vh - 24px)); max-height:none; padding:22px; overflow:hidden; }
.pulse-dialog #appDialogContent { height:100%; display:flex; flex-direction:column; }
.pulse-integration-bar { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 0; }
.pulse-integration-bar > div { display:grid; gap:2px; }
.pulse-integration-bar strong { color:var(--text); font-size:.75rem; }
.pulse-integration-bar span { color:var(--muted); font-size:.68rem; }
.pulse-frame-wrap { min-height:0; flex:1; position:relative; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#f4f7fa; }
.pulse-frame-wrap iframe { width:100%; height:100%; min-height:560px; border:0; background:#ffffff; }
.pulse-frame-wrap > p { position:absolute; left:14px; right:14px; bottom:10px; margin:0; padding:8px 10px; border:1px solid rgba(201,154,67,.22); border-radius:8px; background:rgba(255,255,255,.94); color:var(--muted); font-size:.65rem; pointer-events:none; }

.core-federation-panel { margin-bottom:12px; }
.core-federation { display:grid; grid-template-columns:repeat(4,minmax(120px,1fr)) auto minmax(210px,1.35fr); gap:8px; align-items:stretch; }
.core-domain,.core-group { display:flex; flex-direction:column; justify-content:center; min-height:76px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--panel-2); }
.core-domain span,.core-group span { font-size:.76rem; font-weight:700; }
.core-domain small,.core-group small { margin-top:4px; color:var(--muted); font-size:.64rem; }
.core-federation > b { align-self:center; color:var(--gold); font-size:1.2rem; font-weight:500; }
.core-group { border-color:rgba(25,95,196,.25); background:var(--blue-soft); }

@media (max-width: 1180px) {
  .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .connector-grid { grid-template-columns: repeat(2, 1fr); }
  .branch-map { grid-template-columns: repeat(2, 1fr); }.branch-card.holding { grid-column: 1 / -1; min-height: 150px; }
  .permission-matrix { grid-template-columns: repeat(2, 1fr); }
  .pipeline { grid-template-columns: repeat(3, 1fr); }.pipeline-step:first-child,.pipeline-step:last-child { border-radius:8px; }
  .reason-flow { display:grid; grid-template-columns:repeat(3,1fr); }.reason-flow > b { display:none; }
  .application-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .pilot-kpis { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .core-federation { grid-template-columns:repeat(2,1fr); }
  .core-federation > b { display:none; }
  .core-group { grid-column:1/-1; }
}
@media (max-width: 900px) {
  .sidebar { transform:translateX(-100%); transition:.22s ease; box-shadow:var(--shadow); }.sidebar.open { transform:translateX(0); }
  .main { margin-left:0; }.menu-toggle { display:block; }.breadcrumb { margin-right:auto; margin-left:12px; }
  .topbar { padding:0 16px; }.scope-bar { padding:10px 16px; }.scope-meta { display:none; }
  .view { padding:26px 16px 44px; }
  .span-4,.span-5,.span-7,.span-8 { grid-column:1 / -1; }
  .filter-bar { grid-template-columns:repeat(2,1fr); }.search-box { grid-column:1 / -1; }
  .access-layout { grid-template-columns:1fr; }.profile-panel { position:static; }
  .supply-grid,.asset-types { grid-template-columns:1fr; }
  .workflow-board { grid-template-columns:1fr; }
  .connector-contract,.state-model,.meeting-output { grid-template-columns:1fr; }
  .role-control span { display:none; }
  .application-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pilot-toolbar { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .page-heading { align-items:flex-start; flex-direction:column; }.page-heading .primary-button,.page-heading .secondary-button { width:100%; }
  h1 { font-size:2rem; }
  .metric-grid,.finance-metrics { grid-template-columns:1fr; }
  .branch-map,.connector-grid { grid-template-columns:1fr; }.branch-card.holding { grid-column:auto; }
  .filter-bar { grid-template-columns:1fr; }.search-box { grid-column:auto; }
  .pipeline { grid-template-columns:repeat(2,1fr); }
  .permission-matrix,.schema-grid { grid-template-columns:1fr; }
  .contract-grid { grid-template-columns:1fr 1fr; }
  .reason-flow { grid-template-columns:1fr 1fr; }
  .meeting-output > div:last-child { grid-template-columns:1fr 1fr; }
  .notice { grid-template-columns:1fr; }
  .foodea-live-strip { grid-template-columns: auto 1fr; }.foodea-live-strip b,.foodea-live-strip em { display:none; }
  .live-source-line { align-items:flex-start; flex-direction:column; }.live-source-line > div { flex-wrap:wrap; }
  .application-coverage { grid-template-columns:1fr; }
  .topbar-actions .avatar { display:none; }
  .suite-banner { grid-template-columns:auto 1fr; padding:17px; }.suite-status { grid-column:1/-1; justify-self:start; }.suite-spiral { width:58px; height:58px; }.suite-spiral img { width:48px; height:48px; }
  .application-grid,.pilot-toolbar,.pilot-kpis { grid-template-columns:1fr; }
  .application-card { min-height:165px; }
  .pilot-context-line { align-items:flex-start; flex-direction:column; }
  .module-demo-grid { grid-template-columns:1fr; }
  .connector-card.dropbox-card { grid-column:auto; }
  .core-federation { grid-template-columns:1fr; }
  .core-group { grid-column:auto; }
  .pulse-dialog { width:calc(100% - 12px); height:calc(100vh - 12px); padding:16px 10px 10px; }
  .pulse-dialog .app-dialog-hero { padding-right:32px; }
  .pulse-integration-bar { align-items:stretch; flex-direction:column; }
  .pulse-integration-bar .primary-button { width:100%; }
  .pulse-frame-wrap iframe { min-height:520px; }
}

/* Thème officiel WBNA — surfaces blanches, bleu profond et or stratégique */
.sidebar {
  background: linear-gradient(180deg, #ffffff, #fbfcfe);
  box-shadow: 8px 0 32px rgba(8, 23, 47, .035);
  overflow: hidden;
}
.main-nav { overflow: visible; flex: 0 0 auto; }
.brand-mark img { filter: drop-shadow(0 8px 16px rgba(8, 23, 47, .10)); }
.brand-lockup strong { color: var(--text); }
.mode-pill { color: #805c1f; border-color: rgba(201, 154, 67, .28); }
.nav-item { color: #586a80; }
.nav-item:hover { color: var(--text); background: #f3f6fa; }
.nav-item.active { color: var(--blue-2); background: var(--blue-soft); border-color: rgba(25, 95, 196, .16); }
.nav-icon { color: #8392a5; }
.nav-item.live-nav i { color: #126c4a; }
.sidebar-footer p { color: var(--muted); }
.sidebar-brand-panel { flex:1; min-height:118px; margin:18px 8px 14px; border:1px solid rgba(25,95,196,.10); border-radius:16px; background:linear-gradient(145deg,#f5f8fc,#fff); display:grid; place-items:center; align-content:center; gap:7px; text-align:center; }
.sidebar-brand-panel img { width:72px; height:72px; object-fit:contain; filter:drop-shadow(0 10px 18px rgba(8,23,47,.12)); }
.sidebar-brand-panel strong { color:var(--text); font-size:.84rem; letter-spacing:.10em; }
.sidebar-brand-panel span { color:var(--muted); font-size:.65rem; }
.sidebar-brand-panel.wbna-powered-panel { min-height:118px; padding:20px 14px; }
.sidebar-brand-panel.wbna-powered-panel img {
  width:min(205px,100%);
  height:auto;
  max-height:145px;
  object-fit:contain;
  animation:none;
  transform:none;
  filter:none;
}
.sidebar-brand-panel.wbna-powered-panel iframe {
  width:min(220px,100%);
  aspect-ratio:344/296;
  border:0;
  background:#fff;
  pointer-events:none;
}
.sidebar-brand-panel.wbna-powered-panel strong { color:#0a2f63; font-size:.68rem; letter-spacing:.10em; }

.topbar { background: rgba(255, 255, 255, .94); box-shadow: 0 6px 20px rgba(8, 23, 47, .025); }
.breadcrumb b { color: #a0adbc; }
.breadcrumb strong { color: var(--soft); }
.role-control select,
.filter-bar select,
.field-label select,
.pilot-toolbar select { color: var(--soft); background: #ffffff; }
.avatar,
.large-avatar { background: linear-gradient(145deg, #123a73, #08172f); border-color: rgba(201, 154, 67, .32); color: #ffffff; }
.scope-bar { background: rgba(255, 255, 255, .72); }
.scope-bar strong { color: var(--soft); }
.scope-meta span { color: var(--muted); background: #f1f4f8; }

.primary-button { color: #ffffff; background: linear-gradient(135deg, #195fc4, #174ea6); border-color: #195fc4; box-shadow: 0 10px 26px rgba(25, 95, 196, .18); }
.secondary-button { color: var(--soft); background: #ffffff; }
.demo-badge { color: #805c1f; border-color: rgba(201, 154, 67, .28); }
.mini-badge { color: var(--blue-2); border-color: rgba(25, 95, 196, .20); }
.count-badge { color: #89540b; border-color: rgba(184, 115, 18, .22); }
.notice strong,
.notice button { color: #87550f; }
.notice span { color: var(--muted); }
.foodea-live-strip { background: linear-gradient(110deg, rgba(24, 135, 93, .07), rgba(25, 95, 196, .045)); }
.foodea-live-strip small,
.live-source-line small { color: var(--muted); }
.foodea-live-strip b,
.live-source-line strong,
.source-badge,
.coverage-state { color: #126c4a; }
.foodea-live-strip b.warning,
.coverage-state.missing { color: #925d0f; }
.live-notice strong,
.live-notice button { color: var(--blue-2); }
.foodea-metrics .live-featured { background: linear-gradient(145deg, rgba(24, 135, 93, .08), #ffffff 66%); }

.metric-card,
.panel,
.application-card,
.pilot-kpi,
.connector-card,
.supply-card,
.asset-types article,
.workflow-column,
.workflow-card,
.pipeline-step,
.branch-card,
.permission-cell,
.pilot-toolbar,
.pilot-context-line,
.live-health article,
.territory-live-grid article,
.application-coverage article,
.module-demo-grid article,
.module-action,
.detail-grid div,
.guard-list li,
.reason-flow > div,
.schema-grid span,
.mirror-flow span,
.foundation-list span,
.decision-item,
.meeting-output span {
  color: var(--text);
  background: #ffffff;
}
.metric-card.featured,
.pilot-kpi.primary { background: linear-gradient(145deg, rgba(25, 95, 196, .10), #ffffff 72%); border-color: rgba(25, 95, 196, .24); }
.metric-label,
.metric-card small,
.branch-card > span:nth-child(3),
.application-card p,
.application-card footer,
.panel-copy,
.pilot-toolbar label,
.pilot-kpi > span,
.pilot-kpi footer,
.period-caption,
.pilot-context-line small,
.app-dialog-hero p,
.module-demo-grid span,
.module-action small,
.supply-reason,
.asset-types small,
.live-health article small,
.territory-live-grid small,
.application-coverage small { color: var(--muted); }
.live-health article strong,
.territory-live-grid strong,
.supply-metrics b,
.quality-row b,
.health-legend b { color: var(--text); }
.territory-live-grid span,
.question-list,
.connector-card li,
.connector-card > p { color: var(--soft); }
.application-coverage b,
.schema-grid b,
.application-card footer b { color: var(--blue-2); }
.branch-card:hover,
.application-card:hover { background: #ffffff; border-color: rgba(25, 95, 196, .28); box-shadow: 0 18px 40px rgba(8, 23, 47, .10); }
.brand-application-card { position:relative; overflow:hidden; border-top:4px solid var(--brand-accent); background:linear-gradient(150deg,color-mix(in srgb,var(--brand-accent) 8%,#fff),#fff 58%); }
.brand-application-card::after { content:""; position:absolute; width:100px; height:100px; right:-48px; bottom:-55px; border:16px solid var(--brand-accent-2); border-radius:50%; opacity:.08; pointer-events:none; }
.brand-application-card h3 { color:var(--brand-ink); }
.brand-application-card footer b { color:var(--brand-ink); }
.brand-application-card .brand-card-logo { border-color:color-mix(in srgb,var(--brand-accent) 30%,#dce3ea); background:#fff; }
.brand-application-card .brand-card-logo img { width:32px; height:32px; border-radius:7px; }
.brand-application-card .brand-logo-fallback { color:var(--brand-ink); font-size:10px; font-weight:900; letter-spacing:-.02em; line-height:1; }
.brand-application-card:hover { border-color:color-mix(in srgb,var(--brand-accent) 55%,#dce3ea); border-top-color:var(--brand-accent); box-shadow:0 18px 40px color-mix(in srgb,var(--brand-accent) 16%,transparent); }
.brand-chips i,
.sequence i,
.profile-scope span,
.workflow-column header span,
.state-flow span,
.pilot-context-line,
.module-demo-grid article,
.module-action,
.detail-grid div,
.guard-list li,
.reason-flow > div,
.schema-grid span,
.mirror-flow span,
.foundation-list span,
.decision-item,
.meeting-output span { background: #f4f7fa; }
.brand-chips i,
.profile-scope span,
.state-flow span,
.mirror-flow span,
.question-list { color: var(--soft); }
.health-gauge { background: conic-gradient(var(--blue) calc(var(--value) * 1%), #e5eaf0 0); }
.health-gauge::before { background: #ffffff; }
.quality-list strong { color: var(--text); }
.quality-list i { background: linear-gradient(to right, var(--blue) var(--p), #e7ecf2 var(--p)); }
.quality-row i,
.workflow-strip span,
.score-dots i { background: #e7ecf2; }

.data-table-wrap,
.roadmap-table-wrap { background: #ffffff; }
.data-table th,
.roadmap-table th { color: #66788e; background: #f4f7fa; }
.data-table td,
.roadmap-table td { color: var(--soft); border-bottom-color: rgba(8, 23, 47, .07); }
.entity-name { color: var(--text); }
.data-table tbody tr:hover { background: rgba(25, 95, 196, .035); }
.status-confirmed,
.status-good strong,
.risk-low,
.delta.up { color: #126c4a; }
.status-verify,
.status-warn strong,
.risk-medium { color: #925d0f; }
.status-project,
.finance-switch button.active,
.priority-banner span,
.priority-button.selected,
.workflow-card button,
.module-action button { color: var(--blue-2); }
.status-inventory { color: #6441b3; }
.status-bad strong,
.risk-high,
.delta.down { color: #a92f38; }
.delta.flat { color: var(--muted); background: #edf1f5; }
.rule-callout strong { color: #6f5325; }
.permission-cell.allow strong { color: #126c4a; }
.permission-cell.limit strong { color: #925d0f; }
.permission-cell.deny strong { color: #68788d; }
.pipeline-step span { background: #eef2f6; color: var(--muted); }
.pipeline-step.done span { color: #126c4a; }
.pipeline-step.quarantine span { color: #925d0f; }
.log-console { background: #f6f8fb; border-color: var(--line); }
.log-console div { color: var(--soft); border-bottom-color: rgba(8, 23, 47, .06); }
.log-console time { color: #718198; }
.log-console .ok { color: #126c4a; }
.log-console .warn { color: #925d0f; }
.connector-card li,
.contract-grid span { color: var(--soft); }
.contract-grid span,
.empty-note,
.supply-metrics span { background: #f4f7fa; }
.supply-score { background: conic-gradient(var(--green) calc(var(--score) * 1%), #e5eaf0 0); }
.priority-banner { background: linear-gradient(120deg, rgba(25, 95, 196, .10), #ffffff 72%); }
.priority-banner > b { color: rgba(25, 95, 196, .22); }
.priority-button { color: var(--soft); background: #ffffff; }

.data-legend > span,
.brand-tab { color: var(--muted); background: #ffffff; }
.brand-tab:hover { color: var(--text); border-color: rgba(25, 95, 196, .28); }
.brand-tab.active { color: var(--blue-2); border-color: rgba(25, 95, 196, .36); }
.brand-tab[data-live="true"]::after { color: #126c4a; }
.suite-banner { background: radial-gradient(circle at 8% 40%, rgba(25, 95, 196, .09), transparent 20rem), linear-gradient(115deg, #ffffff, #f8fafc); border-color: rgba(25, 95, 196, .18); }
.suite-spiral { background: #ffffff; border-color: rgba(25, 95, 196, .14); box-shadow: 0 12px 30px rgba(8, 23, 47, .08); }
.suite-banner p { color: var(--muted); }
.suite-status { color: #805c1f; border-color: rgba(201, 154, 67, .24); }
.suite-status.live,
.app-state.live { color: #126c4a; }
.suite-link{display:inline-flex;align-items:center;justify-content:center;padding:10px 12px;border-radius:9px;background:#2168ce;color:#fff;font-size:11px;font-weight:850;text-decoration:none;white-space:nowrap}.suite-link[hidden]{display:none}
.application-card { background: #ffffff; }
.app-spiral { background: rgba(25, 95, 196, .055); border-color: rgba(25, 95, 196, .12); }
.app-state { color: #805c1f; }

.pilot-chart { background: repeating-linear-gradient(to top, transparent 0, transparent 55px, rgba(8, 23, 47, .055) 56px); }
.pilot-kpis { grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.chart-legend,
.chart-group span,
.chart-group em,
.quality-row span { color: var(--muted); }
.chart-group i.comparison,
.chart-legend .comparison { background: #a8b4c3; }
.detail-dialog,
.integrity-dialog { background: #ffffff; box-shadow: 0 34px 90px rgba(8, 23, 47, .22); }
.detail-dialog::backdrop,
.integrity-dialog::backdrop { background: rgba(8, 23, 47, .42); }
.toast { background: #ffffff; color: #126c4a; }

/* La spirale officielle tourne seule : aucun cadre ni fond n'est animé. */
@keyframes wbnaSpiralSpin {
  from { transform: translateZ(0) rotate(0turn); }
  to { transform: translateZ(0) rotate(1turn); }
}
.brand-mark img,
.suite-spiral img,
.nav-item.active .nav-spiral img,
.application-card.uses-wbna-spiral .app-spiral img,
.app-dialog[open] .app-spiral img {
  animation: wbnaSpiralSpin 24s linear infinite;
  transform-origin: 50% 50%;
  backface-visibility: hidden;
  will-change: transform;
}
.application-card.uses-wbna-spiral .app-spiral img {
  transition: none;
}
.application-card.has-brand-logo .app-spiral img,
.application-card.has-brand-logo:hover .app-spiral img,
.application-card.has-brand-logo:focus-visible .app-spiral img { animation:none; transform:none; }
.suite-banner:hover .suite-spiral img { transform: none; }

@media (prefers-reduced-motion: reduce) {
  .brand-mark img,
  .suite-spiral img,
  .nav-item.active .nav-spiral img,
  .application-card.uses-wbna-spiral .app-spiral img,
  .app-dialog[open] .app-spiral img { animation: none; transform: none; }
}

/* Connecteurs RH Groupe */
.connector-logo.skello { background:#111827; color:#ffffff; }
.connector-logo.quarksup { background:#6b3fd1; color:#ffffff; }
.connector-logo.silae { background:#e04578; color:#ffffff; }
.connector-card.hr-system { min-height:360px; border-top:3px solid rgba(25,95,196,.44); display:flex; flex-direction:column; }
.connector-card.hr-system > p { min-height:82px; }
.connector-card button[data-connector] { width:100%; margin-top:auto; }
.hr-architecture { margin-bottom:12px; }
.hr-layers { display:grid; grid-template-columns:1.25fr auto 1fr auto 1fr; gap:14px; align-items:center; }
.hr-layers > b { color:var(--blue-2); font-size:1.25rem; }
.hr-source-list { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.hr-source-list span,.hr-core { min-height:82px; padding:13px; border:1px solid var(--line); border-radius:10px; background:#f6f8fb; color:var(--muted); font-size:.69rem; }
.hr-source-list b,.hr-core strong { display:block; margin-bottom:5px; color:var(--text); font-size:.79rem; }
.hr-core { display:grid; align-content:center; }
.hr-core.group { border-color:rgba(25,95,196,.26); background:linear-gradient(145deg,rgba(25,95,196,.09),#ffffff); }
.hr-core small { color:var(--muted); font-size:.67rem; line-height:1.45; }
.hr-privacy,.connector-lock-note { margin:14px 0 0; padding:11px 13px; border-left:3px solid var(--gold); background:rgba(201,154,67,.08); color:var(--soft); font-size:.72rem; }
.connector-detail-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-top:17px; }
.connector-detail-grid article { padding:12px; border:1px solid var(--line); border-radius:9px; background:#f6f8fb; }
.connector-detail-grid span { display:block; color:var(--muted); font-size:.65rem; }
.connector-detail-grid strong { display:block; margin-top:4px; color:var(--text); font-size:.76rem; }
.connector-modal-columns { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:12px; }
.connector-modal-columns article { padding:14px; border:1px solid var(--line); border-radius:10px; background:#ffffff; }
.connector-modal-columns ul { margin:9px 0 0; padding-left:18px; color:var(--soft); font-size:.72rem; line-height:1.55; }
.connector-readiness { display:grid; gap:0; margin-top:12px; padding:4px 14px 8px; border:1px solid var(--line); border-radius:10px; background:#ffffff; }
.connector-readiness > p { margin:10px 0 4px; }
.connector-readiness > div { display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-top:1px solid var(--line); color:var(--soft); font-size:.72rem; }
.connector-readiness strong { font-size:.68rem; }
.readiness-confirmed { color:#126c4a; }.readiness-planned { color:#805c1f; }.readiness-waiting { color:var(--muted); }

@media (max-width:980px) {
  .hr-layers { grid-template-columns:1fr; }
  .hr-layers > b { transform:rotate(90deg); justify-self:center; }
}
@media (max-width:680px) {
  .hr-source-list,.connector-detail-grid,.connector-modal-columns { grid-template-columns:1fr; }
  .connector-card.hr-system { min-height:auto; }
  .connector-card.hr-system > p { min-height:auto; }
}

/* Brand kit WBNA — contraste institutionnel bleu profond & or */
:root {
  --bg: #ffffff;
  --panel-2: #f7f8fb;
  --panel-3: #eef1f5;
  --line: rgba(8, 23, 47, .13);
  --line-strong: rgba(10, 47, 99, .26);
  --blue: #123a73;
  --blue-2: #0a2f63;
  --blue-soft: rgba(10, 47, 99, .10);
  --gold: #c99a43;
  --gold-soft: rgba(201, 154, 67, .15);
  --shadow: 0 18px 44px rgba(8, 23, 47, .10);
}

body { background: #ffffff; }

.sidebar {
  background: linear-gradient(180deg, #ffffff 0%, #fbfaf7 100%);
  border-right-color: rgba(10, 47, 99, .18);
  box-shadow: 10px 0 34px rgba(8, 23, 47, .06);
}
.brand-lockup { border-bottom: 1px solid rgba(201, 154, 67, .30); }
.brand-lockup strong { color: #0a2f63; }
.brand-lockup span { color: #5b6a7e; }
.mode-pill {
  color: #6f4a12;
  background: linear-gradient(120deg, rgba(201, 154, 67, .18), rgba(201, 154, 67, .08));
  border-color: rgba(201, 154, 67, .42);
}
.nav-item { color: #34475f; }
.nav-item:hover { color: #0a2f63; background: rgba(10, 47, 99, .07); }
.nav-item.active {
  color: #ffffff;
  background: linear-gradient(115deg, #0a2f63, #123a73);
  border-color: #0a2f63;
  box-shadow: inset 4px 0 #c99a43, 0 8px 18px rgba(10, 47, 99, .16);
}
.nav-item.active .nav-icon { color: #e2bc73; }
.sidebar-brand-panel {
  border-color: rgba(10, 47, 99, .20);
  background: radial-gradient(circle at 50% 30%, rgba(201, 154, 67, .16), transparent 7rem), linear-gradient(145deg, #ffffff, #f4f6fa);
  box-shadow: inset 0 3px 0 rgba(201, 154, 67, .78), 0 12px 30px rgba(8, 23, 47, .07);
}
.sidebar-brand-panel strong { color: #0a2f63; }

.topbar {
  background: rgba(255, 255, 255, .97);
  border-bottom-color: rgba(10, 47, 99, .18);
  box-shadow: 0 7px 24px rgba(8, 23, 47, .06);
}
.breadcrumb span { color: #9a691d; font-weight: 700; }
.breadcrumb strong { color: #0a2f63; }
.avatar,
.large-avatar { background: linear-gradient(145deg, #123a73, #08172f); border-color: rgba(201, 154, 67, .72); }

.primary-button {
  background: linear-gradient(135deg, #123a73, #0a2f63);
  border-color: #0a2f63;
  box-shadow: 0 11px 28px rgba(10, 47, 99, .25);
}
.primary-button:hover { box-shadow: 0 14px 32px rgba(10, 47, 99, .30); }
.text-button,
.application-card footer b { color: #0a2f63; }

.suite-banner {
  background: radial-gradient(circle at 13% 35%, rgba(201, 154, 67, .22), transparent 19rem), linear-gradient(118deg, #08172f, #0a2f63 62%, #123a73);
  border-color: rgba(201, 154, 67, .55);
  box-shadow: 0 20px 46px rgba(8, 23, 47, .18);
}
.suite-banner::after { border-color: rgba(201, 154, 67, .30); }
.suite-banner h2 { color: #ffffff; }
.suite-banner p { color: #d7dfeb; }
.suite-banner span { color: #e2bc73; }
.suite-spiral { background: #ffffff; border-color: rgba(201, 154, 67, .70); }
.suite-status {
  color: #f2d59d;
  background: rgba(8, 23, 47, .34);
  border-color: rgba(201, 154, 67, .56);
}

.brand-application-card {
  border-color: color-mix(in srgb, var(--brand-accent) 32%, #d8dee8);
  border-top: 5px solid var(--brand-accent);
  background: linear-gradient(150deg, color-mix(in srgb, var(--brand-accent) 13%, #ffffff), #ffffff 58%);
  box-shadow: 0 12px 28px rgba(8, 23, 47, .07);
}
.brand-application-card::after {
  width: 112px;
  height: 112px;
  border-color: var(--brand-accent-2);
  opacity: .15;
}
.brand-application-card .brand-card-logo {
  border-color: color-mix(in srgb, var(--brand-accent) 52%, #dce3ea);
  box-shadow: 0 7px 18px color-mix(in srgb, var(--brand-accent) 15%, transparent);
}
.brand-application-card.uses-wbna-spiral {
  border-color: rgba(10, 47, 99, .30);
  border-top-color: #c99a43;
  background: linear-gradient(150deg, rgba(10, 47, 99, .15), #ffffff 62%);
}
.brand-application-card.uses-wbna-spiral h3,
.brand-application-card.uses-wbna-spiral footer b { color: #0a2f63; }
.brand-application-card:hover {
  border-color: color-mix(in srgb, var(--brand-accent) 58%, #d8dee8);
  border-top-color: var(--brand-accent);
  box-shadow: 0 20px 44px color-mix(in srgb, var(--brand-accent) 20%, transparent);
}
.brand-application-card.uses-wbna-spiral:hover { border-top-color: #c99a43; }

.pilot-kpi.primary,
.metric-card.featured {
  background: linear-gradient(145deg, rgba(10, 47, 99, .14), #ffffff 72%);
  border-color: rgba(10, 47, 99, .30);
}
.brand-tab.active {
  color: #ffffff;
  background: #0a2f63;
  border-color: #0a2f63;
  box-shadow: inset 0 -3px #c99a43;
}

/* Correction de contraste — identité WBNA visible sans assombrir l'espace de travail */
.sidebar {
  background: linear-gradient(180deg, #07172e 0%, #0a2f63 62%, #08172f 100%);
  border-right: 1px solid rgba(201, 154, 67, .62);
  box-shadow: 10px 0 34px rgba(8, 23, 47, .15);
}
.brand-lockup { border-bottom-color: rgba(201, 154, 67, .42); }
.brand-mark {
  width: 48px;
  height: 48px;
  padding: 5px;
  overflow: hidden;
  border: 1px solid rgba(201, 154, 67, .72);
  border-radius: 13px;
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .20);
}
.brand-mark img { width: 38px; height: 38px; }
.brand-lockup strong { color: #ffffff; }
.brand-lockup span { color: #c4cfdd; }
.mode-pill {
  color: #f2d59d;
  background: rgba(201, 154, 67, .13);
  border-color: rgba(201, 154, 67, .62);
}
.nav-item { color: #d4ddea; }
.nav-item:hover { color: #ffffff; background: rgba(255, 255, 255, .08); }
.nav-item.active {
  color: #ffffff;
  background: linear-gradient(105deg, rgba(201, 154, 67, .28), rgba(201, 154, 67, .10));
  border-color: rgba(201, 154, 67, .72);
  box-shadow: inset 4px 0 #e0b45f, 0 9px 22px rgba(0, 0, 0, .18);
}
.nav-icon,
.nav-item.active .nav-icon { color: #e0b45f; }
.sidebar-brand-panel {
  border-color: rgba(201, 154, 67, .68);
  background: radial-gradient(circle at 50% 28%, rgba(201, 154, 67, .18), transparent 7rem), #ffffff;
  box-shadow: inset 0 4px 0 #c99a43, 0 14px 34px rgba(0, 0, 0, .22);
}
.sidebar-brand-panel strong { color: #0a2f63; }
.sidebar-brand-panel span { color: #5f7087; }
.sidebar-footer { border-top-color: rgba(201, 154, 67, .36); }
.sidebar-footer p { color: #b8c5d5; }

.topbar {
  border-bottom-color: rgba(201, 154, 67, .46);
  box-shadow: inset 0 -2px rgba(201, 154, 67, .42), 0 8px 24px rgba(8, 23, 47, .07);
}
.scope-bar {
  background: linear-gradient(100deg, #08172f, #0a2f63 72%, #123a73);
  border-bottom-color: rgba(201, 154, 67, .70);
  box-shadow: 0 8px 22px rgba(8, 23, 47, .12);
}
.scope-label { color: #e2bc73; }
.scope-bar strong { color: #ffffff; }
.scope-meta span {
  color: #e6edf6;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(201, 154, 67, .30);
}

.eyebrow { color: #a97622; }
h1,
.compact h1 { color: #08172f; }

.brand-application-card {
  border-color: color-mix(in srgb, var(--brand-accent) 62%, #ccd4df);
  border-top-width: 7px;
  background: #ffffff;
  box-shadow: 0 14px 32px rgba(8, 23, 47, .10);
}
.brand-application-card::after {
  border-color: var(--brand-accent);
  opacity: .21;
}
.brand-application-card .brand-card-logo {
  border-width: 2px;
  border-color: var(--brand-accent);
}
.brand-application-card.has-brand-logo:hover {
  background: #ffffff;
  border-color: var(--brand-accent);
  box-shadow: 0 22px 48px color-mix(in srgb, var(--brand-accent) 24%, transparent);
}

.brand-application-card.has-brand-logo {
  border-top-color: transparent;
}
.brand-application-card.has-brand-logo::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: -7px;
  left: -1px;
  right: -1px;
  height: 7px;
  background: linear-gradient(90deg, var(--brand-accent) 0 58%, var(--brand-accent-2) 58% 80%, var(--brand-signal) 80% 100%);
  pointer-events: none;
}
.brand-application-card.has-brand-logo:hover {
  border-top-color: transparent;
}
.brand-application-card[data-brand="centrakor-platform"] .brand-card-logo {
  width: 54px;
  height: 54px;
  background: #ffffff;
}
.brand-application-card[data-brand="centrakor-platform"] .brand-card-logo img {
  width: 42px;
  height: 42px;
  object-fit: contain;
}
.brand-application-card[data-brand="bureau-platform"] .brand-card-logo {
  width: 112px;
  height: 54px;
  background: #ffffff;
}
.brand-application-card[data-brand="bureau-platform"] .brand-card-logo img {
  width: 98px;
  height: 42px;
  object-fit: contain;
}

/* Tous les logos d'enseigne doivent être aussi lisibles que Centrakor et Bureau Vallée. */
.brand-application-card[data-brand="fitea-platform"] .brand-card-logo,
.brand-application-card[data-brand="foodea-platform"] .brand-card-logo,
.brand-application-card[data-brand="bkda-platform"] .brand-card-logo,
.brand-application-card[data-brand="joueclub-platform"] .brand-card-logo {
  width: 58px;
  height: 58px;
  background: #ffffff;
}
.brand-application-card[data-brand="fitea-platform"] .brand-card-logo img,
.brand-application-card[data-brand="foodea-platform"] .brand-card-logo img,
.brand-application-card[data-brand="bkda-platform"] .brand-card-logo img,
.brand-application-card[data-brand="joueclub-platform"] .brand-card-logo img {
  width: 48px;
  height: 48px;
  object-fit: contain;
}
.brand-application-card[data-brand="bastide-platform"] .brand-card-logo {
  width: 112px;
  height: 54px;
  background: #ffffff;
}
.brand-application-card[data-brand="bastide-platform"] .brand-card-logo img {
  width: 98px;
  height: 42px;
  object-fit: contain;
}

.brand-application-card.uses-wbna-spiral,
.brand-application-card.uses-wbna-spiral:hover {
  color: #ffffff;
  background: radial-gradient(circle at 92% 88%, rgba(201, 154, 67, .22), transparent 9rem), linear-gradient(145deg, #08172f, #0a2f63 74%, #123a73);
  border-color: rgba(201, 154, 67, .72);
  border-top-color: #c99a43;
  box-shadow: 0 18px 40px rgba(8, 23, 47, .22);
}
.brand-application-card.uses-wbna-spiral h3,
.brand-application-card.uses-wbna-spiral footer b { color: #ffffff; }
.brand-application-card.uses-wbna-spiral p,
.brand-application-card.uses-wbna-spiral footer { color: #c9d5e4; }
.brand-application-card.uses-wbna-spiral footer b { color: #e4bc70; }
.brand-application-card.uses-wbna-spiral .brand-card-logo {
  background: #ffffff;
  border-color: rgba(201, 154, 67, .86);
  box-shadow: 0 9px 22px rgba(0, 0, 0, .22);
}
.brand-application-card.uses-wbna-spiral .app-state {
  color: #f2d59d;
  background: rgba(8, 23, 47, .42);
  border-color: rgba(201, 154, 67, .56);
}

/* Accueil opérationnel : accès direct aux applications, sans couche de présentation. */
#view-applications {
  padding-top: 28px;
}
#view-applications .application-grid {
  margin-top: 0;
}
.view-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 42px;
  margin: 0 0 18px;
}
.sidebar-brand-panel {
  margin-top: auto;
  flex: 0 0 auto;
  min-height: 210px;
}