/* TakadoumNetwork · Phase 23 / Unified application design system
   CSS only: no framework runtime, build pipeline, or external font dependency. */
:root {
  --navy-950:#09152c;--navy-900:#142544;--navy-850:#1c3154;--navy-800:#274367;
  --blue-700:#184fa7;--blue-600:#2364c9;--blue-500:#3879dc;--cyan-500:#56addd;--cyan-400:#a5d7ed;
  --ink:#172c49;--ink-soft:#314868;--muted:#54677f;--muted-2:#7789a1;
  --bg:#f5f7fb;--surface:#fff;--surface-2:#f8fafd;--line:#e2e8f1;--line-strong:#cad4e3;
  --success:#117752;--success-bg:#eaf8f1;--warn:#995c0c;--warn-bg:#fff6e7;
  --danger:#a92943;--danger-bg:#fff0f3;--shadow-sm:0 2px 8px rgba(15,33,65,.035);
  --shadow:0 10px 32px rgba(20,42,81,.07);--shadow-lg:0 22px 70px rgba(8,29,62,.17);
  --radius-sm:10px;--radius:16px;--radius-lg:22px;--sidebar:260px;
}
html { scroll-padding-top:90px; }
body.app-body { background:var(--bg);color:var(--ink);font-size:14px;line-height:1.6; }
.skip-link { position:fixed;top:-80px;left:14px;z-index:120;padding:12px 18px;background:#fff;color:#162b48;border-radius:10px;box-shadow:var(--shadow-lg);font-weight:700; }
.skip-link:focus { top:12px; }
.sr-only { position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
:where(a,button,input,textarea,select,summary,[tabindex]):focus-visible { outline:3px solid #65b8f1!important;outline-offset:3px!important; }
a { text-underline-offset:3px; }
a:hover { text-decoration:none; }
button { touch-action:manipulation; }
[hidden] { display:none!important; }

/* Navigation chrome */
.sidebar { background:linear-gradient(180deg,#111f37 0%,#112844 100%);padding:18px 12px 18px;box-shadow:6px 0 22px rgba(12,32,55,.09); }
.sidebar-brand-wrap { padding:4px 9px 22px; }
.brand-mark { width:42px;height:42px;flex-basis:42px;border-radius:12px;box-shadow:none; }
.brand-mark img { width:40px;height:40px; }
.brand-copy strong { font-size:15px;letter-spacing:-.035em; }
.brand-copy small { font-size:10px;letter-spacing:.065em;margin-top:5px;color:#bbcbdc; }
.workspace-switcher { padding:12px;margin:0 4px 17px;background:rgba(255,255,255,.065);border-color:rgba(255,255,255,.12); }
.workspace-switcher small { font-size:10px;color:#bbcbdf;letter-spacing:.06em; }
.workspace-switcher strong { font-size:13px; }
.workspace-icon { background:#3078c7;box-shadow:none; }
.side-nav { gap:2px; }
.nav-section { padding:18px 14px 7px; }
.nav-section span { font-size:10px;color:#96b1cd;letter-spacing:.11em; }
.side-nav>a { min-height:43px;padding:9px 11px;color:#d3dfed;font-size:13px;font-weight:590;border-radius:10px;grid-template-columns:24px minmax(0,1fr) auto; }
.side-nav>a:hover { background:rgba(255,255,255,.105); }
.side-nav>a.active { background:#25466e;box-shadow:inset 3px 0 0 #76c0f0;font-weight:720; }
.side-nav>a.active:after { display:none; }
.nav-glyph { width:22px;height:22px;color:#a7bed8; }
.ui-icon { width:18px;height:18px;display:block;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round;fill:none; }
.side-nav>a.active .nav-glyph,.side-nav>a:hover .nav-glyph { color:#b9e2fa; }
.sidebar-footer { margin-top:20px; }
.sidebar-user-copy strong { font-size:13px; }
.sidebar-user-copy small { font-size:11px;color:#b4c9dc; }
.logout-button { font-size:13px;min-height:40px; }
.icon-sprite { width:0;height:0;position:absolute;overflow:hidden; }

/* Top bar, responsive shell */
.app-topbar { min-height:72px;height:auto;padding:12px clamp(18px,3vw,38px);background:rgba(255,255,255,.94);border-bottom:1px solid var(--line); }
.topbar-left,.topbar-actions { gap:12px; }
.topbar-context small { font-size:10px;letter-spacing:.09em;color:var(--muted); }
.topbar-context strong { color:var(--navy-900);font-size:14px;font-weight:750; }
.topbar-search { min-height:40px;min-width:218px;display:flex;align-items:center;gap:9px;border:1px solid var(--line-strong);background:var(--surface-2);padding:8px 11px;border-radius:11px;color:var(--muted);font-size:12px;cursor:pointer; }
.topbar-search>span:first-child { font-size:20px;line-height:1; }
.topbar-search kbd { margin-left:auto;padding:3px 6px;border:1px solid var(--line-strong);border-radius:5px;background:var(--surface);font-size:10px;color:var(--muted); }
.topbar-search:hover { border-color:#83b2e2;color:var(--ink); }
.topbar-theme,.topbar-icon { width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line-strong);border-radius:11px;background:var(--surface);color:var(--ink);cursor:pointer;box-shadow:none; }
.topbar-theme:hover,.topbar-icon:hover { background:var(--surface-2); }
.theme-icon { font-size:20px; }
.topbar-profile { max-width:220px; }
.topbar-profile strong { color:var(--ink);font-size:12px; }
.topbar-profile small { font-size:10px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:155px; }
.content { max-width:1520px;padding:clamp(18px,2.8vw,34px) clamp(16px,3vw,40px) 72px; }
.content:focus { outline:none!important; }
.page-head { align-items:center;gap:18px;margin-bottom:25px;flex-wrap:wrap; }
.page-head h1 { font-size:clamp(25px,2.25vw,34px);letter-spacing:-.043em;line-height:1.2;margin:6px 0 8px;color:var(--ink); }
.page-head p { font-size:13px;line-height:1.65;color:var(--muted);max-width:72ch; }
.page-head .btn { align-self:center; }
.eyebrow,.card-kicker { color:var(--blue-700);font-size:10px;letter-spacing:.11em; }
.eyebrow:before { background:var(--blue-600); }

/* Typography and reusable surfaces */
.card,.stat { background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm);border-radius:var(--radius); }
.card { padding:clamp(17px,2vw,25px);margin-bottom:19px; }
.card h2 { margin:0 0 14px;font-size:18px;letter-spacing:-.02em;color:var(--ink); }
.card h3 { font-size:15px;color:var(--ink); }
.card p { line-height:1.65; }
.card-head h2,.table-title h2,.phase20-panel-head h2 { font-size:18px; }
.card-head p,.table-title p { font-size:12.5px;color:var(--muted); }
.stats { gap:14px; }
.stat { padding:20px 21px;min-height:126px; }
.stat:before { width:0; }
.stat:after { width:112px;height:112px;right:-58px;top:-60px;background:radial-gradient(circle,rgba(56,121,220,.055),transparent 75%); }
.stat>span { font-size:11px;font-weight:700;color:var(--muted);letter-spacing:.045em; }
.stat strong { margin-top:8px;font-size:clamp(24px,2.15vw,30px);letter-spacing:-.045em;color:var(--ink); }
.stat small,.stat span,table small { font-size:11.5px; }
.stat small { margin-top:7px; }
.phase20-stat:hover { transform:translateY(-1px);border-color:#a4c4ea;box-shadow:var(--shadow); }
.phase20-alerts a { background:var(--surface-2);border-color:var(--line);font-size:13px; }
.phase20-alerts strong { color:var(--ink);font-size:22px; }
.phase20-note { font-size:12px; }
.phase20-currencies strong { color:var(--ink); }
.phase20-grid { gap:18px; }
.dashboard-hero { background:linear-gradient(118deg,#1b355d,#214e81)!important;color:#fff; }
.dashboard-hero h2,.dashboard-hero strong { color:#fff; }
.dashboard-hero p,.dashboard-hero .dashboard-kicker { color:#d6e6fb; }
.dashboard-hero .quick-action { background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.16);color:#fff; }
.dashboard-hero .quick-action strong { color:#fff; }
.dashboard-hero .quick-action small { color:#d0e4f7; }
.dashboard-hero .quick-action:hover { background:rgba(255,255,255,.17); }

/* Buttons, filters, input accessibility */
.btn { min-height:42px;padding:10px 16px;background:#2364c9;box-shadow:none;border-radius:10px;font-size:13px;letter-spacing:0;font-weight:730; }
.btn:hover { background:#1b54ad;box-shadow:0 6px 15px rgba(32,91,173,.14);filter:none; }
.btn.secondary { border-color:var(--line-strong);background:var(--surface);box-shadow:none;color:var(--ink); }
.btn.secondary:hover { border-color:#a4bfdc;background:var(--surface-2); }
.btn-quiet { background:transparent!important;box-shadow:none!important; }
.danger-button { min-height:39px;padding:9px 13px;font-size:12px; }
label { color:var(--ink-soft);font-size:12.5px;font-weight:660;gap:7px; }
input,select,textarea { min-height:43px;background:var(--surface);color:var(--ink);border-color:var(--line-strong);border-radius:9px;font-size:13px; }
textarea { min-height:105px; }
input::placeholder,textarea::placeholder { color:#778ba3;opacity:1; }
input[type="checkbox"],input[type="radio"] { width:16px;min-height:16px;height:16px;accent-color:var(--blue-600); }
input:disabled,select:disabled,textarea:disabled { opacity:.58;cursor:not-allowed; }
fieldset { border:1px solid var(--line-strong);border-radius:12px;padding:16px; }
legend { padding:0 8px;font-weight:750;font-size:13px; }
.form { gap:16px; }
.form.card,.card.form { max-width:none; }
.filter-panel { background:var(--surface); }
.filter-fields { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;align-items:end; }
.filter-fields.five { grid-template-columns:repeat(5,minmax(0,1fr)); }
.filter-actions { display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:10px;margin-top:14px; }
.filter-actions .btn { white-space:nowrap; }
.filter-row { grid-template-columns:repeat(4,minmax(0,1fr));gap:12px; }
.filter-row > :is(button,.btn) { align-self:end; }
.form-help { font-size:12px;color:var(--muted);margin:7px 0 0; }
.section-head { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:14px; }
.section-head h2 { margin:0; }
.section-head p { font-size:12px;color:var(--muted);margin:4px 0 0; }
.section-actions { display:flex;align-items:center;gap:9px;flex-wrap:wrap; }
.link-emphasis { font-weight:730;color:var(--blue-700); }

/* Tables */
.table-wrap { max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin; }
.card.table-wrap { padding:0; }
.card.table-wrap > .section-head { padding:20px 22px 0;margin-bottom:12px; }
.card.table-wrap > h2 { padding:20px 22px 0; }
table { min-width:620px;border-spacing:0; }
th,td { padding:15px 18px;border-color:var(--line);font-size:12.8px; }
th { font-size:10.5px;letter-spacing:.08em;color:var(--muted);background:var(--surface-2); }
td { color:var(--ink-soft); }
td strong { color:var(--ink);font-weight:720; }
td a { font-weight:680; }
td small { display:block;margin-top:3px;color:var(--muted);line-height:1.5; }
tbody tr:hover { background:rgba(65,121,192,.032); }
.table-title { padding:20px 22px; }
.table-title h2 { margin:0 0 5px; }
.table-title p { margin:0; }
.table-wrap nav[role="navigation"],.card.table-wrap > nav,.card.table-wrap > div:has(> nav[role="navigation"]) { padding:10px 18px; }
.table-wrap form { margin:0; }
.table-wrap td select { min-width:118px; }
.table-wrap td .btn,.table-wrap td button { min-height:35px; }
.badge,.status { padding:5px 10px;font-size:11px;font-weight:700; }
.badge { color:var(--blue-700);background:#edf5ff;border-color:#d6e6fc; }
.status.ok,.badge.success { color:#126948; }
.status.warn,.badge.warning { color:#81500b; }
.details dt { font-size:12px; }
.empty-state { padding:30px 18px; }
.empty-state strong { font-size:15px; }
.empty-state p { font-size:12px; }
.empty-panel { text-align:center;padding:38px 24px; }
.empty-panel .empty-symbol { display:grid;place-items:center;margin:0 auto 12px;width:44px;height:44px;border-radius:13px;background:var(--surface-2);color:var(--blue-700);font-size:21px; }
.empty-panel h3 { margin:0 0 6px;font-size:15px; }
.empty-panel p { color:var(--muted);font-size:13px;max-width:450px;margin:0 auto 14px; }

/* Application states */
.toast { padding:15px 16px;box-shadow:none;font-size:13px; }
.toast strong { font-size:13px; }
.toast p,.toast li { font-size:12.5px; }
.toast-icon { width:30px;height:30px;border-radius:9px; }
.comment-card { border-left-width:2px; }
.comment-body { font-size:14px; }
.phase20-panel .table-wrap { padding:0; }
.setup-step-copy p,.setup-lock-note,.readiness-check p,.setup-readiness>p,.phase20-panel td small { font-size:12px; }
.setup-step-copy h2,.readiness-check strong { font-size:14px; }
.readiness-row,.capability-row small { font-size:12px; }
.auth :is(label, input, button),.auth-single :is(label,input,button) { font-size:13px; }
.auth-card h1 { font-size:clamp(25px,3vw,33px); }
.auth-card p { font-size:13px; }
.auth-help { font-size:12px; }

/* Keyboard command palette */
.command-dialog { width:min(570px,calc(100vw - 24px));max-height:min(640px,80vh);padding:0;border:1px solid var(--line);border-radius:17px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow-lg);overflow:hidden; }
.command-dialog::backdrop { background:rgba(7,20,39,.54);backdrop-filter:blur(3px); }
.command-dialog-header { display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line); }
.command-dialog-header .command-search-glyph { font-size:26px;color:var(--muted); }
.command-dialog-header input { flex:1;min-height:36px;padding:4px;border:0;box-shadow:none!important;background:transparent;font-size:15px; }
.command-close { padding:6px 9px;border:1px solid var(--line-strong);background:var(--surface-2);border-radius:7px;font-size:11px;cursor:pointer; }
.command-dialog-body { overflow:auto;max-height:410px;padding:14px; }
.command-hint { color:var(--muted);margin:1px 6px 9px;font-size:11px;font-weight:750;letter-spacing:.07em;text-transform:uppercase; }
.command-results { display:grid;gap:3px; }
.command-result { display:flex;align-items:center;min-height:43px;padding:10px 12px;border-radius:8px;color:var(--ink);font-size:13px;font-weight:600; }
.command-result:hover,.command-result.is-selected { color:var(--blue-700);background:var(--surface-2); }
.command-empty { text-align:center;color:var(--muted);padding:24px; }
.command-dialog-footer { padding:11px 20px;font-size:11px;color:var(--muted);background:var(--surface-2);border-top:1px solid var(--line); }

/* Optional theme: all chrome uses local tokens, plus legacy view surface overrides. */
html[data-theme="dark"] {
  color-scheme:dark;
  --navy-900:#e2edff;--navy-850:#b8cce8;--navy-800:#a9c3ed;
  --blue-700:#93bff7;--blue-600:#82b7ff;--blue-500:#6ea9fa;--cyan-500:#82c9eb;
  --ink:#e6edf9;--ink-soft:#d1dff2;--muted:#b1bfd5;--muted-2:#8fa4bf;
  --bg:#0d1626;--surface:#162338;--surface-2:#1b2b43;--line:#344762;--line-strong:#4a5f7d;
  --success:#70d0a2;--success-bg:#163e32;--warn:#f0c279;--warn-bg:#48351a;--danger:#f5a3b0;--danger-bg:#452234;
  --shadow-sm:0 2px 9px rgba(0,0,0,.13);--shadow:0 12px 32px rgba(0,0,0,.22);
}
html[data-theme="dark"] body.app-body { background:var(--bg);color:var(--ink); }
html[data-theme="dark"] .app-topbar { background:rgba(22,35,56,.94); }
html[data-theme="dark"] :is(.card,.stat,.topbar-icon,.topbar-theme,.topbar-search,.btn.secondary,.status,.badge,.quick-action,.command-dialog) { background:var(--surface);border-color:var(--line);color:var(--ink); }
html[data-theme="dark"] :is(.page-head h1,.page-head h2,.card h2,.card h3,td strong,.stat strong,.topbar-context strong,.topbar-profile strong,.phase20-currencies strong,.phase20-alerts strong,.details dd) { color:var(--ink); }
html[data-theme="dark"] :is(th,.phase20-alerts a,.table-title,.table-wrap .pagination,.command-dialog-footer) { background:var(--surface-2); }
html[data-theme="dark"] tbody tr:hover { background:#1b2f49; }
html[data-theme="dark"] :is(input,select,textarea) { background:var(--surface-2);color:var(--ink);border-color:var(--line-strong); }
html[data-theme="dark"] :is(.flash,.toast:not(.error)) { background:#173d33;color:#b5f0d7;border-color:#356855; }
html[data-theme="dark"] .error { background:#472233;color:#ffd4dc;border-color:#7e4258; }
html[data-theme="dark"] :is(.phase20-alerts a,.setup-step,.setup-lock-note,.onboarding-banner,.readiness-hero,.readiness-check,.schedule-row,.notification-card,.integration-card,.deployment-steps span) { background:var(--surface)!important;color:var(--ink);border-color:var(--line); }
html[data-theme="dark"] .phase20-alerts a:hover { background:var(--surface-2)!important; }
html[data-theme="dark"] .dashboard-hero { background:linear-gradient(110deg,#213f69,#163656)!important; }
html[data-theme="dark"] .dashboard-hero h2 { color:#fff; }
html[data-theme="dark"] :is(.status.ok,.badge.success) { background:var(--success-bg);color:var(--success); }
html[data-theme="dark"] :is(.status.warn,.badge.warning) { background:var(--warn-bg);color:var(--warn); }
html[data-theme="dark"] :is(.status.danger,.status.error,.danger-button) { background:var(--danger-bg);color:var(--danger); }
html[data-theme="dark"] :is(.status,.badge) { border-color:var(--line); }
html[data-theme="dark"] .topbar-search kbd { background:var(--surface-2); }
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder { color:#a8b9d0; }

@media (max-width:1250px) {
  .filter-fields,.filter-fields.five { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .topbar-search { min-width:175px; }
}
@media (max-width:1024px) {
  .topbar-search { min-width:0;width:42px;justify-content:center;padding:0; }
  .topbar-search span:nth-child(2),.topbar-search kbd { display:none; }
  .sidebar-close { display:grid;place-items:center; }
  .filter-fields,.filter-fields.five { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .content { padding:20px 14px 48px; }
  .page-head { flex-direction:column;align-items:stretch;gap:15px; }
  .page-head .btn { align-self:flex-start; }
  .topbar-profile>span:last-child { display:none; }
  .topbar-theme,.topbar-icon,.topbar-search { width:36px;height:36px; }
  .app-topbar { padding:10px 15px; }
  .filter-fields,.filter-fields.five,.filter-row { grid-template-columns:1fr; }
  .grid2 { grid-template-columns:1fr; }
  .card { padding:17px; }
  .stat { padding:17px; }
  .card.table-wrap { padding:0; }
  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .stat strong { font-size:24px; }
  .topbar-context strong { font-size:12px; }
  th,td { padding:13px 12px; }
}
@media (max-width:430px) {
  .stats { grid-template-columns:1fr; }
  .filter-actions { align-items:stretch; }
  .filter-actions .btn { width:100%; }
  .topbar-context small { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important; }
}

/* Revenue and reporting details */
.report-metric-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:12px; }
.report-metric { min-width:0;padding:19px;background:var(--surface-2);border:1px solid var(--line);border-radius:12px; }
.report-metric strong { display:block;font-size:clamp(21px,2vw,26px);line-height:1.25;letter-spacing:-.035em;color:var(--ink);overflow-wrap:anywhere; }
.report-metric span { display:block;margin-top:7px;color:var(--muted);font-size:12px; }
.ledger-review-form { display:flex;align-items:center;gap:7px;margin-top:8px!important; }
.ledger-review-form select { width:132px;min-width:120px;min-height:35px;font-size:12px; }
.ledger-review-form button { min-height:35px; }
.analytics-data-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px; }
.analytics-data-grid>.card { min-width:0;margin:0; }
@media(max-width:1200px) { .analytics-data-grid { grid-template-columns:1fr; } }