:root {
  --noyon-ink: #10223f;
  --noyon-muted: #68758b;
  --noyon-line: #e7edf5;
  --noyon-primary: #2563eb;
  --noyon-primary-deep: #1748b6;
  --noyon-cyan: #0ea5b7;
  --noyon-surface: #ffffff;
  --noyon-canvas: #f4f7fb;
  --noyon-radius: 16px;
  --noyon-shadow: 0 12px 34px rgba(24, 43, 77, .08);
}

html, body { background: var(--noyon-canvas); color: var(--noyon-ink); }
body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; letter-spacing: -.01em; }
#page-container { background: linear-gradient(180deg, #f8fbff 0, var(--noyon-canvas) 360px); }
#main-container { min-height: calc(100vh - 74px); }

#sidebar { background: linear-gradient(180deg, #10223f 0%, #0b1830 100%); box-shadow: 10px 0 32px rgba(16, 34, 63, .12); }
#sidebar .content-header { border-bottom: 1px solid rgba(255,255,255,.09); }
#sidebar .nav-main-link { margin: 4px 12px; border-radius: 11px; color: rgba(255,255,255,.68); transition: .2s ease; }
#sidebar .nav-main-link:hover, #sidebar .nav-main-link.active { color: #fff; background: rgba(37, 99, 235, .28); }
#sidebar .nav-main-link.active { box-shadow: inset 3px 0 0 #38c7d8; }

#page-header { border-bottom: 1px solid rgba(16,34,63,.06); background: rgba(255,255,255,.86); backdrop-filter: blur(18px); }
#page-header .content-header { min-height: 74px; }
#page-header .heading { color: var(--noyon-ink); font-weight: 700; }

.content { padding-top: 30px; padding-bottom: 42px; }
.block, .card { border: 1px solid var(--noyon-line); border-radius: var(--noyon-radius); box-shadow: var(--noyon-shadow); background: var(--noyon-surface); overflow: hidden; }
.block-header, .card-header { border-bottom: 1px solid var(--noyon-line); padding: 18px 22px; background: linear-gradient(180deg, #fff, #fbfdff); }
.block-title { color: var(--noyon-ink); font-size: 1rem; font-weight: 750; }
.block-content { padding: 22px; }

h1, h2, h3, h4, h5, h6 { color: var(--noyon-ink); letter-spacing: -.025em; }
.text-muted, .text-body-secondary { color: var(--noyon-muted) !important; }
.btn-primary { border: 0; background: linear-gradient(135deg, var(--noyon-primary), var(--noyon-cyan)); box-shadow: 0 8px 18px rgba(37, 99, 235, .22); }
.btn-primary:hover, .btn-primary:focus { background: linear-gradient(135deg, var(--noyon-primary-deep), #078b9d); transform: translateY(-1px); }
.btn, .form-control, .form-select { border-radius: 10px; }
.form-control, .form-select { border-color: #dce5f0; min-height: 43px; }
.form-control:focus, .form-select:focus { border-color: var(--noyon-primary); box-shadow: 0 0 0 .2rem rgba(37,99,235,.12); }

.table { --bs-table-bg: transparent; margin-bottom: 0; }
.table thead th { color: var(--noyon-muted); font-size: .71rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; border-bottom-width: 1px; }
.table tbody td { padding-top: 15px; padding-bottom: 15px; border-color: var(--noyon-line); vertical-align: middle; }
.badge { border-radius: 999px; padding: .45em .72em; font-weight: 700; }

.noyon-brand { display: inline-flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.noyon-brand-mark { display: inline-grid; width: 34px; height: 34px; place-items: center; border-radius: 11px; color: #fff; font-weight: 800; background: linear-gradient(135deg, var(--noyon-primary), var(--noyon-cyan)); box-shadow: 0 8px 18px rgba(14,165,183,.25); }
.noyon-brand-name { font-size: 1rem; font-weight: 800; letter-spacing: -.03em; }
.noyon-eyebrow { color: var(--noyon-cyan); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.noyon-stat { position: relative; min-height: 134px; padding: 22px; }
.noyon-stat::after { content: ''; position: absolute; right: -24px; bottom: -36px; width: 105px; height: 105px; border-radius: 50%; background: rgba(37,99,235,.07); }
.noyon-stat-label { color: var(--noyon-muted); font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.noyon-stat-value { margin-top: 8px; color: var(--noyon-ink); font-size: 1.8rem; font-weight: 800; letter-spacing: -.05em; }

@media (max-width: 991.98px) { .content { padding-top: 22px; } .block-content { padding: 18px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; transform: none !important; } }