:root {
    --ink: #202538;
    --ink-soft: #596176;
    --muted: #8790a3;
    --line: #e9ebf1;
    --surface: #fff;
    --canvas: #f7f8fb;
    --purple: #800020;
    --purple-dark: #5f0018;
    --purple-pale: #f8e9ee;
    --navy: #35121f;
    --green: #218567;
    --red: #c54752;
    --amber: #a87926;
    --shadow: 0 8px 28px rgba(35, 40, 72, .045);
    --sans: "DM Sans", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --display: "Manrope", "DM Sans", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--canvas); font-family: var(--sans); font-size: 14px; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
.app-shell { min-height: 100vh; }

.heading-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.evaluation-list-panel, .evaluation-form-panel, .evaluation-workflow-panel, .report-filter-panel, .report-table-panel { margin-bottom: 16px; }
.evaluation-event-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.evaluation-event-heading h2 { margin: 5px 0; font-family: var(--display); font-size: 19px; font-weight: 750; }
.evaluation-event-heading .page-subtitle { margin: 0; }
.evaluation-rating-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.evaluation-text-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }
.evaluation-kpi-input { max-width: 260px; }
.evaluation-review-form { max-width: 560px; margin-top: 18px; }
.evaluation-meta { display: flex; flex-wrap: wrap; gap: 18px; margin-bottom: 15px; color: var(--muted); font-size: 11px; }
.evaluation-approved { margin-bottom: 16px; border-left: 3px solid var(--green); }
.evaluation-approved h2 { margin: 12px 0 5px; font: 700 16px var(--display); }
.evaluation-approved p { margin: 0; color: var(--ink-soft); }
.report-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-bottom: 16px; }
.report-kpi { display: flex; min-height: 112px; flex-direction: column; justify-content: center; gap: 5px; padding: 17px 19px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow); }
.report-kpi > span, .print-report-summary span { color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .09em; }
.report-kpi strong { color: var(--ink); font: 750 20px var(--display); }
.report-kpi small { color: var(--muted); font-size: 10px; }
.report-filter-form { display: grid; grid-template-columns: minmax(160px, 1.5fr) repeat(3, minmax(130px, 1fr)) auto auto; align-items: end; gap: 10px; }
.report-filter-form .form-label { margin-bottom: 5px; font-size: 10px; }
.report-table-wrap { overflow-x: auto; }
.report-table { min-width: 900px; }
.report-table th, .report-table td { vertical-align: middle; }
.report-table td { white-space: nowrap; }
.report-progress { width: 58px; height: 4px; margin-top: 5px; overflow: hidden; border-radius: 4px; background: #eeeff4; }
.report-progress span { display: block; height: 100%; border-radius: inherit; background: var(--purple); }
.print-report-page { min-height: 100vh; padding: 30px; background: #fff; color: #202538; }
.print-report { max-width: 1240px; margin: 0 auto; }
.print-report-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 26px; }
.print-report-toolbar a { color: var(--purple-dark); font-size: 12px; }
.print-report-heading { margin-bottom: 22px; }
.print-report-heading h1 { margin: 6px 0; font: 800 25px var(--display); }
.print-report-heading p { margin: 3px 0; color: var(--muted); font-size: 11px; }
.print-report-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 20px 0; }
.print-report-summary > div { display: flex; flex-direction: column; gap: 4px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.print-report-summary strong { font: 750 17px var(--display); }
.print-report-summary small { color: var(--muted); font-size: 10px; }
.print-report-table { width: 100%; border-collapse: collapse; font-size: 10px; }
.print-report-table th, .print-report-table td { padding: 8px 6px; border: 1px solid #dadee7; text-align: left; vertical-align: top; }
.print-report-table th { background: #f4f5f9; font-size: 8px; letter-spacing: .04em; }
.print-report-table td small { display: block; margin-top: 3px; color: #737b8e; font-size: 9px; }
.print-report-error { color: var(--red); }

.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 30; display: flex; flex-direction: column; width: 276px; padding: 24px 18px 15px; overflow: hidden; color: #e9eafb; background: var(--navy); }
.brand { display: inline-flex; align-items: center; gap: 10px; width: fit-content; color: var(--ink); }
.brand-mark { display: inline-grid; flex: 0 0 35px; width: 35px; height: 35px; place-items: center; border-radius: 11px; color: #fff; background: linear-gradient(145deg, #8273f0, #5547c6); font-family: var(--display); font-size: 19px; font-weight: 800; box-shadow: 0 5px 13px rgba(103, 87, 217, .24); }
.brand-name { display: flex; flex-direction: column; font-family: var(--display); font-size: 14px; font-weight: 800; letter-spacing: .095em; line-height: 1.2; }
.brand-name small { margin-top: 4px; color: #9298b5; font-family: var(--sans); font-size: 8px; font-weight: 600; letter-spacing: .11em; }
.sidebar .brand { color: #fff; }
.workspace-switcher { display: flex; align-items: center; gap: 10px; margin: 26px 0 24px; padding: 11px 10px; border: 1px solid rgba(255,255,255,.085); border-radius: 10px; background: rgba(255,255,255,.045); }
.workspace-switcher-link { color: inherit; text-decoration: none; transition: border-color .18s ease, background .18s ease; }
.workspace-switcher-link:hover, .workspace-switcher-link:focus-visible { border-color: rgba(255,255,255,.2); color: inherit; background: rgba(255,255,255,.08); }
.workspace-avatar, .profile-avatar, .topbar-avatar { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: #fff; background: #6e62d9; font-size: 13px; font-weight: 700; }
.workspace-copy, .profile-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 3px; }
.workspace-copy strong, .profile-copy strong { overflow: hidden; color: #f6f6ff; font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.workspace-copy small, .profile-copy small { overflow: hidden; color: #a4a9c1; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.switcher-chevron { color: #a5aac1; font-size: 15px; }
.sidebar-navigation { min-height: 0; flex: 1; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-color: rgba(255,255,255,.28) transparent; scrollbar-width: thin; padding: 4px 4px 12px; }
.sidebar-navigation::-webkit-scrollbar { width: 5px; }
.sidebar-navigation::-webkit-scrollbar-thumb { border-radius: 6px; background: rgba(255,255,255,.22); }
.sidebar-navigation::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.4); }
.side-nav { display: flex; flex-direction: column; gap: 16px; }
.nav-section { display: flex; flex-direction: column; gap: 2px; }
.nav-section-label { display: flex; align-items: center; gap: 8px; padding: 0 12px 7px; color: #7d839f; font-size: 9.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.nav-section-label::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, rgba(255,255,255,.12), transparent); }
.nav-item { display: flex; position: relative; align-items: center; gap: 11px; min-height: 44px; padding: 6px 10px; border: 0; border-radius: 10px; color: #b6bbd0; background: transparent; text-align: left; font-size: 13px; font-weight: 500; text-decoration: none; transition: background .18s ease, color .18s ease, transform .18s ease; }
a.nav-item:hover { color: #fff; background: rgba(255,255,255,.06); transform: translateX(2px); }
.nav-item.active { color: #fff; background: linear-gradient(90deg, rgba(114, 98, 225, .28), rgba(114, 98, 225, .08)); box-shadow: inset 2.5px 0 #9488ff; }
.nav-icon { display: grid; flex: 0 0 30px; width: 30px; height: 30px; place-items: center; border-radius: 8px; color: #a0a6c2; background: rgba(255,255,255,.05); transition: background .18s ease, color .18s ease; }
.nav-icon svg { width: 16px; height: 16px; }
.nav-item:hover .nav-icon { color: #dcd8ff; background: rgba(148, 136, 255, .16); }
.nav-item.active .nav-icon { color: #fff; background: linear-gradient(145deg, rgba(148, 136, 255, .55), rgba(103, 87, 217, .45)); box-shadow: 0 3px 8px rgba(103, 87, 217, .28); }
.nav-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 1px; }
.nav-label { overflow: hidden; font-size: 12.5px; font-weight: 600; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.nav-desc { overflow: hidden; color: #82889f; font-size: 9.5px; font-weight: 500; letter-spacing: .01em; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.nav-item:hover .nav-desc { color: #a7adc6; }
.nav-item.active .nav-desc { color: rgba(255,255,255,.55); }
.nav-arrow { display: grid; flex: 0 0 16px; width: 16px; height: 16px; place-items: center; color: transparent; opacity: 0; transform: translateX(-4px); transition: opacity .18s ease, transform .18s ease, color .18s ease; }
.nav-arrow svg { width: 11px; height: 11px; }
.nav-item:hover .nav-arrow { color: #a7adc6; opacity: 1; transform: translateX(0); }
.nav-item.active .nav-arrow { color: #c8c1ff; opacity: 1; transform: translateX(0); }
.nav-count { display: grid; width: 19px; height: 19px; margin-left: auto; place-items: center; border-radius: 6px; color: #ccc7ff; background: rgba(142, 129, 255, .18); font-size: 9px; }
.sidebar-bottom { margin-top: auto; }
.help-card { margin: 0 2px 14px; padding: 12px; border: 1px solid rgba(255,255,255,.07); border-radius: 10px; background: rgba(255,255,255,.045); }
.help-card-head { display: flex; align-items: center; gap: 9px; }
.help-card-icon { display: grid; flex: 0 0 28px; width: 28px; height: 28px; place-items: center; border-radius: 8px; color: #c4bcff; background: rgba(148,136,255,.14); }
.help-card-icon svg { width: 15px; height: 15px; }
.help-card-copy { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.help-card-copy strong { font-size: 11px; font-weight: 600; }
.help-card-copy small { overflow: hidden; color: #9da3bb; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.help-card-link { display: flex; align-items: center; justify-content: center; margin-top: 9px; padding: 6px 0; border-radius: 7px; color: #d7d1ff; background: rgba(148,136,255,.12); font-size: 10px; font-weight: 600; text-decoration: none; transition: background .18s ease, color .18s ease; }
.help-card-link:hover { color: #fff; background: rgba(148,136,255,.24); }
.help-icon { display: block; margin-bottom: 7px; color: #aea5ff; font-size: 15px; }
.help-card strong { font-size: 11px; font-weight: 600; }
.help-card p { margin: 5px 0 0; color: #9da3bb; font-size: 10px; line-height: 1.55; }
.profile-row { display: flex; align-items: center; gap: 9px; padding: 13px 4px 1px; border-top: 1px solid rgba(255,255,255,.09); }
.profile-avatar { width: 31px; height: 31px; flex-basis: 31px; border-radius: 50%; background: #415b77; font-size: 11px; }
.profile-copy strong { font-size: 11px; }
.profile-copy small { font-size: 9px; }
.profile-row form { margin-left: auto; }
.logout-button { width: 28px; height: 28px; border: 0; border-radius: 7px; color: #aab0c6; background: transparent; font-size: 16px; }
.logout-button:hover { color: #fff; background: rgba(255,255,255,.1); }

.main-area { min-height: 100vh; margin-left: 252px; }
.topbar { position: sticky; top: 0; z-index: 20; display: flex; height: 66px; align-items: center; justify-content: space-between; padding: 0 38px; border-bottom: 1px solid #eceef3; background: rgba(255,255,255,.94); backdrop-filter: blur(15px); }
.breadcrumb-line { display: flex; align-items: center; gap: 11px; color: #979daf; font-size: 11px; }
.breadcrumb-line b { color: #c0c4ce; font-weight: 400; }
.breadcrumb-line strong { color: #43495b; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 15px; }
.topbar-date { color: #81889a; font-size: 11px; }
.topbar-divider { width: 1px; height: 22px; background: var(--line); }
.icon-button { position: relative; width: 32px; height: 32px; border: 0; border-radius: 8px; color: #737b8e; background: transparent; font-size: 18px; }
.icon-button:hover { background: #f5f4fc; }
.icon-button i { position: absolute; top: 5px; right: 5px; width: 6px; height: 6px; border: 1px solid #fff; border-radius: 50%; background: #e2767c; }
.topbar-avatar { width: 30px; height: 30px; flex-basis: 30px; border-radius: 50%; font-size: 11px; }
.mobile-menu-button { display: none; border: 0; color: var(--ink); background: transparent; font-size: 20px; }
.page-content { max-width: 1570px; margin: 0 auto; padding: 35px 38px 20px; }
.page-footer { display: flex; justify-content: space-between; margin-top: 30px; padding: 15px 2px 0; border-top: 1px solid #e9ebf0; color: #a0a5b3; font-size: 10px; }
.footer-dot { color: #bcb4f0; }

.welcome-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 25px; }
.welcome-row h1 { margin: 6px 0 6px; color: var(--ink); font-family: var(--display); font-size: clamp(24px, 2.3vw, 30px); font-weight: 700; letter-spacing: -.045em; }
.page-subtitle { margin: 0; color: #82899b; font-size: 12px; line-height: 1.6; }
.eyebrow { color: #9398aa; font-size: 9px; font-weight: 700; letter-spacing: .115em; }
.wave { display: inline-block; color: #e7ac51; font-size: 19px; transform: rotate(15deg); }
.action-button { display: inline-flex; align-items: center; gap: 8px; padding: 10px 15px; white-space: nowrap; }
.btn { border-radius: 7px; font-size: 12px; font-weight: 600; }
.btn-primary { border-color: var(--purple); background: var(--purple); box-shadow: 0 4px 10px rgba(103,87,217,.14); }
.btn-primary:hover, .btn-primary:focus { border-color: var(--purple-dark); background: var(--purple-dark); }
.btn-outline-primary { border-color: #d7d2fa; color: var(--purple); }
.btn-outline-primary:hover { border-color: var(--purple); background: var(--purple); }
.form-control, .form-select { min-height: 40px; border-color: #e4e6ed; border-radius: 7px; color: #41475a; font-size: 12px; box-shadow: none !important; }
.form-control:focus, .form-select:focus { border-color: #a59bec; }
.form-control::placeholder { color: #adb2bf; }
.form-label { margin-bottom: 7px; color: #50566a; font-size: 11px; font-weight: 600; }
.input-group-text { border-color: #e4e6ed; color: #777e90; background: #f8f9fb; font-size: 12px; }
.required { color: #cf6572; }
.form-hint { color: #939aab; font-size: 10px; font-weight: 400; }
.invalid-feedback { font-size: 10px; }

.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.kpi-card, .panel-card, .event-card, .form-panel, .filter-toolbar { border: 1px solid #eceef3; border-radius: 10px; background: var(--surface); box-shadow: var(--shadow); }
.kpi-card { min-width: 0; padding: 16px 17px 14px; animation: rise-in .38s both; }
.kpi-card:nth-child(2) { animation-delay: .04s; }.kpi-card:nth-child(3) { animation-delay: .08s; }.kpi-card:nth-child(4) { animation-delay: .12s; }
.kpi-heading { display: flex; align-items: center; justify-content: space-between; gap: 5px; color: #7c8395; font-size: 10px; font-weight: 500; }
.kpi-icon { display: grid; width: 29px; height: 29px; flex: 0 0 29px; place-items: center; border-radius: 8px; font-size: 15px; }
.kpi-icon.lavender { color: #6e5ed0; background: #f0edff; }.kpi-icon.mint { color: #32846b; background: #e9f7f1; }.kpi-icon.peach { color: #b57943; background: #fff2e8; }.kpi-icon.sky { color: #5285af; background: #edf6fc; }
.kpi-number { display: block; overflow: hidden; margin-top: 10px; color: #272c40; font-family: var(--display); font-size: clamp(23px, 2.5vw, 29px); font-weight: 700; letter-spacing: -.045em; text-overflow: ellipsis; white-space: nowrap; }
.kpi-number small { margin-left: 2px; color: #858b9c; font-family: var(--sans); font-size: 13px; font-weight: 500; }
.currency-number { font-size: clamp(16px, 1.65vw, 21px); letter-spacing: -.025em; }
.kpi-foot { display: flex; align-items: center; gap: 6px; min-height: 17px; margin-top: 5px; overflow: hidden; color: #959bac; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.kpi-dot { width: 5px; height: 5px; border-radius: 50%; background: #62b697; }
.kpi-progress { height: 4px; margin-top: 8px; overflow: hidden; border-radius: 5px; background: #f0eff6; }
.kpi-progress span { display: block; height: 100%; border-radius: inherit; background: #8d7fe8; transition: width .5s ease; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.68fr) minmax(260px, .9fr); gap: 15px; margin-bottom: 16px; }
.panel-card { min-width: 0; padding: 19px 20px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 15px; }
.panel-heading h2, .form-section-title h2 { margin: 4px 0 0; color: #30354a; font-family: var(--display); font-size: 15px; font-weight: 700; letter-spacing: -.025em; }
.text-link { color: #7263d0; font-size: 10px; font-weight: 600; white-space: nowrap; }
.text-link:hover { color: #5142bc; }
.text-link span { margin-left: 3px; }
.event-list { display: flex; flex-direction: column; }
.event-row { display: flex; align-items: center; gap: 11px; min-width: 0; padding: 11px 0; border-top: 1px solid #f0f1f5; transition: background .15s; }
.event-row:first-child { border-top: 0; }
.event-row:hover .event-info strong { color: var(--purple); }
.event-symbol { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 10px; color: #695cc3; background: #f0edff; font-family: var(--display); font-size: 13px; font-weight: 700; }
.event-row:nth-child(3n+2) .event-symbol { color: #32846b; background: #e9f7f1; }.event-row:nth-child(3n) .event-symbol { color: #b47a42; background: #fff3e7; }
.event-info { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; }
.event-info strong { overflow: hidden; color: #393e51; font-size: 11px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.event-info small { color: #9b9fb0; font-size: 9px; }
.event-info small span { margin: 0 3px; }
.event-progress { display: flex; width: 79px; flex-direction: column; gap: 4px; }
.event-progress small { color: #999eae; font-size: 8px; text-align: right; }
.progress-line { display: block; width: 100%; height: 4px; overflow: hidden; border-radius: 8px; background: #eeeef4; }
.progress-line i { display: block; height: 100%; border-radius: inherit; background: #8071dd; }
.status-badge { display: inline-flex; align-items: center; width: fit-content; padding: 5px 8px; border-radius: 20px; font-size: 9px; font-weight: 600; white-space: nowrap; }
.status-success { color: #267b61; background: #eaf6f0; }.status-primary { color: #5a50b4; background: #efedff; }.status-warning { color: #a0782d; background: #fbf4e5; }.status-danger { color: #bb5059; background: #fff0f0; }.status-secondary { color: #747c8f; background: #f1f2f5; }
.attention-panel { background: linear-gradient(155deg, #fff 46%, #fbfaff); }
.panel-icon { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 8px; color: #7668ce; background: #f0edff; font-size: 17px; }
.attention-stat { display: flex; align-items: center; gap: 9px; padding: 9px 0; border-top: 1px solid #f0f1f5; color: #858b9d; font-size: 10px; }
.attention-stat strong { color: #41475b; font-weight: 600; }
.attention-dot { width: 7px; height: 7px; border-radius: 50%; }.attention-dot.danger { background: #e1797d; }.attention-dot.warning { background: #e7b157; }
.next-deadline { display: flex; flex-direction: column; gap: 7px; margin-top: 11px; padding: 12px; border: 1px solid #eeecf8; border-radius: 8px; background: #fbfaff; }
.next-deadline strong { overflow: hidden; color: #40455a; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.next-deadline small { color: #9298a8; font-size: 9px; }
.next-deadline .text-link { margin-top: 2px; }
.inline-empty { display: flex; align-items: center; gap: 12px; min-height: 175px; padding: 12px; }
.inline-empty strong { color: #4a5062; font-size: 11px; }
.inline-empty p { margin: 5px 0 8px; color: #969cac; font-size: 10px; line-height: 1.6; }
.empty-icon { display: inline-grid; width: 43px; height: 43px; flex: 0 0 43px; place-items: center; border-radius: 13px; color: #7162cf; background: #f1efff; font-size: 20px; }
.empty-icon.small { width: 38px; height: 38px; flex-basis: 38px; font-size: 18px; }
.task-panel { margin-bottom: 10px; }
.task-panel .panel-heading { margin-bottom: 10px; }
.task-table-wrap { width: 100%; overflow-x: auto; }
.task-table { min-width: 660px; margin: 0; color: #6c7386; font-size: 10px; vertical-align: middle; }
.task-table thead th { padding: 10px 10px; border-bottom: 1px solid #edeef3; color: #9a9eae; font-size: 8px; font-weight: 700; letter-spacing: .08em; white-space: nowrap; }
.task-table tbody td { padding: 12px 10px; border-bottom: 1px solid #f1f2f6; }
.task-table tbody tr:last-child td { border-bottom: 0; }
.task-title { display: block; max-width: 270px; overflow: hidden; color: #42485b; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.table-secondary-line { display: block; max-width: 280px; overflow: hidden; margin-top: 3px; color: #9ba1af; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.task-empty { padding: 22px 9px; color: #9298a7; font-size: 11px; text-align: center; }
.task-empty .text-link { margin-left: 5px; }

.page-heading-row { margin-bottom: 22px; }
.filter-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 17px; padding: 12px 14px; }
.filter-form { display: flex; flex: 1; align-items: center; gap: 9px; }
.search-field { display: flex; max-width: 390px; min-width: 200px; flex: 1; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid #e5e7ed; border-radius: 7px; color: #9ba1b1; }
.search-field:focus-within { border-color: #a59bec; }
.search-field span { font-size: 19px; }
.search-field input { width: 100%; height: 36px; border: 0; outline: 0; color: #40465a; background: transparent; font-size: 11px; }
.search-field input::placeholder { color: #a8adba; }
.filter-select { max-width: 175px; min-height: 38px; }
.filter-button { min-height: 38px; }
.result-count { color: #9298a8; font-size: 10px; white-space: nowrap; }
.event-overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: -5px 0 16px; }
.event-overview-card { display: flex; min-width: 0; align-items: center; gap: 11px; padding: 13px 15px; border: 1px solid #eceef3; border-radius: 10px; background: linear-gradient(120deg, #fff, #fcfbff); box-shadow: var(--shadow); }
.event-overview-icon { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border-radius: 10px; font-size: 16px; }
.event-overview-icon.lavender { color: #6e5ed0; background: #f0edff; }.event-overview-icon.mint { color: #32846b; background: #e9f7f1; }.event-overview-icon.peach { color: #b57943; background: #fff2e8; }
.event-overview-card > div { display: grid; min-width: 0; grid-template-columns: 1fr auto; align-items: baseline; gap: 2px 8px; }
.event-overview-card > div > span { color: #70778a; font-size: 10px; font-weight: 600; }
.event-overview-card strong { color: #30354a; font-family: var(--display); font-size: 21px; letter-spacing: -.04em; }
.event-overview-card small { grid-column: 1 / -1; overflow: hidden; color: #999eac; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.event-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 15px; }
.event-card { display: flex; min-width: 0; min-height: 0; flex-direction: column; overflow: hidden; padding: 0; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.event-card:hover { transform: translateY(-2px); border-color: #dcd8f4; box-shadow: 0 12px 28px rgba(40,38,77,.08); }
.event-card-main { display: flex; min-width: 0; flex: 1; flex-direction: column; padding: 17px 17px 0; color: inherit; text-decoration: none; }
.event-card-main:hover { color: inherit; }
.event-card-main:focus-visible { outline: 3px solid rgba(103,87,217,.3); outline-offset: -3px; }
.event-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 13px; }
.event-symbol.large { width: 38px; height: 38px; flex-basis: 38px; font-size: 15px; }
.event-code { color: #abaebe; font-weight: 500; letter-spacing: .04em; }
.event-card h2 { display: -webkit-box; overflow: hidden; margin: 5px 0 7px; color: #33384b; font-family: var(--display); font-size: 16px; font-weight: 700; letter-spacing: -.02em; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.event-card-description { display: -webkit-box; min-height: 34px; overflow: hidden; margin: 0 0 9px; color: #858b9b; font-size: 10px; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.event-meta { display: flex; align-items: center; gap: 7px; margin-top: 5px; color: #8b91a2; font-size: 10px; }
.event-meta span { width: 13px; color: #a19bc8; text-align: center; }
.event-card-bottom { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 15px 0 13px; }
.event-card-bottom .progress-line { flex: 1; }
.event-card-bottom > span { color: #858b9b; font-size: 9px; white-space: nowrap; }
.event-card-bottom b { margin-left: 4px; color: #7466cf; }
.event-card-actions { display: flex; justify-content: flex-end; gap: 7px; padding: 10px 14px; border-top: 1px solid #f0f1f5; background: #fcfcfe; }
.event-card-actions form { margin: 0; }
.event-card-actions .btn { padding: 5px 9px; font-size: 10px; }
.event-card-actions .btn-outline-danger { border-color: #f0d6d8; color: #b9505a; }
.event-card-actions .btn-outline-danger:hover { border-color: #b9505a; color: #fff; background: #b9505a; }
.detail-heading-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 9px; }
.detail-heading-actions .btn { white-space: nowrap; }
.empty-events, .task-prerequisite { grid-column: 1 / -1; padding: 46px 20px; text-align: center; }
.empty-events .empty-icon, .task-prerequisite .empty-icon { margin-bottom: 12px; }
.empty-events h2, .task-prerequisite h2 { margin: 0 0 8px; color: #3c4255; font-family: var(--display); font-size: 17px; }
.empty-events p, .task-prerequisite p { max-width: 400px; margin: 0 auto 16px; color: #8b92a3; font-size: 11px; line-height: 1.7; }

.team-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(290px, .82fr); align-items: start; gap: 15px; }
.team-roster, .team-create-panel { min-width: 0; }
.team-list { display: flex; flex-direction: column; }
.team-member-row { display: flex; min-height: 61px; align-items: center; gap: 11px; border-top: 1px solid #f0f1f5; }
.team-member-avatar { display: grid; width: 33px; height: 33px; flex: 0 0 33px; place-items: center; border-radius: 50%; color: #6659c3; background: #f0edff; font-size: 11px; font-weight: 700; }
.team-member-row:nth-child(3n+2) .team-member-avatar { color: #36846c; background: #eaf7f1; }
.team-member-row:nth-child(3n) .team-member-avatar { color: #b27a42; background: #fff2e6; }
.team-member-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; }
.team-member-copy strong { overflow: hidden; color: #41475a; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.team-member-copy small { overflow: hidden; color: #969cad; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.role-chip { padding: 5px 8px; border-radius: 13px; color: #6d62bd; background: #f2f0ff; font-size: 8px; font-weight: 600; white-space: nowrap; }
.team-member-row:nth-child(3n+2) .role-chip { color: #39836c; background: #edf7f2; }
.team-last-active { color: #a0a5b2; font-size: 8px; white-space: nowrap; }
.team-form-intro { margin: -5px 0 15px; color: #8b92a3; font-size: 10px; line-height: 1.7; }
.team-create-form { padding-top: 14px; border-top: 1px solid #f0f1f5; }
.team-create-form .form-label { font-size: 10px; }
.secure-note { display: flex; gap: 8px; margin: 15px 0; padding: 10px; border-radius: 7px; color: #788096; background: #f7f7fc; }
.secure-note > span { color: #766bd0; font-size: 13px; }
.secure-note p { margin: 0; font-size: 9px; line-height: 1.6; }

.module-grid { display: grid; grid-template-columns: minmax(285px, .75fr) minmax(0, 1.6fr); align-items: start; gap: 15px; }
.module-form-card, .risk-form-card { position: sticky; top: 82px; }
.module-form-card .panel-heading, .risk-form-card .panel-heading { margin-bottom: 15px; }
.module-empty-copy { margin: 14px 0; color: #8c93a3; font-size: 10px; line-height: 1.7; }
.milestone-list { display: flex; flex-direction: column; }
.milestone-row { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; gap: 12px; padding: 15px 0; border-top: 1px solid #f0f1f5; }
.milestone-timeline-mark { position: relative; display: block; width: 9px; height: 9px; margin-top: 5px; border: 2px solid #a79be9; border-radius: 50%; background: #fff; }
.milestone-row:not(:last-child) .milestone-timeline-mark::after { position: absolute; top: 7px; left: 1px; width: 2px; height: calc(100% + 27px); background: #eeecf7; content: ""; }
.milestone-timeline-mark.complete { border-color: #55a585; background: #55a585; }.milestone-timeline-mark.late { border-color: #d77c6b; background: #fff3ef; }
.milestone-copy { display: flex; min-width: 0; flex-direction: column; gap: 5px; }
.milestone-event, .risk-event-link { color: #7467c6; font-size: 9px; font-weight: 600; }
.milestone-copy > strong { color: #3f4557; font-size: 11px; font-weight: 600; line-height: 1.5; }
.milestone-copy > small { overflow: hidden; color: #9399a8; font-size: 9px; line-height: 1.55; text-overflow: ellipsis; }
.milestone-owner, .milestone-date { color: #979cac; font-size: 9px; }
.milestone-side { display: flex; min-width: 125px; flex-direction: column; align-items: flex-end; gap: 9px; }
.milestone-progress { width: min(180px, 23vw); min-width: 125px; }
.milestone-progress-track { height: 6px; overflow: hidden; border-radius: 999px; background: #eeecf2; }
.milestone-progress-track > span { display: block; height: 100%; border-radius: inherit; background: #8b2947; transition: width .25s ease; }
.milestone-progress-track[aria-valuenow="100"] > span { background: #368367; }
.milestone-progress-caption { display: flex; justify-content: space-between; gap: 8px; margin-top: 5px; color: #8b7b82; font-size: 9px; }
.milestone-progress-caption strong { color: #5b414b; font-weight: 700; }
.milestone-no-tasks { display: block; margin-top: 3px; color: #9b8a91; font-size: 9px; }
.finance-summary-strip { margin: 0 0 14px; padding: 15px 17px 13px; border: 1px solid #eceef2; border-radius: 12px; background: #fff; box-shadow: 0 3px 13px rgba(38, 42, 61, .025); }
.finance-summary-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 11px; }
.finance-summary-heading > div { display: flex; align-items: baseline; gap: 9px; }
.finance-summary-heading > div > span { color: #948ba8; font-size: 8px; font-weight: 750; letter-spacing: .1em; }
.finance-summary-heading strong { color: #3d4255; font-family: var(--display); font-size: 12px; font-weight: 700; }
.finance-summary-heading > small { color: #a0a4af; font-size: 9px; }
.finance-summary-groups { display: grid; grid-template-columns: 1fr; gap: 10px; }
.finance-summary-group { min-width: 0; padding: 11px 12px; border: 1px solid #e8eee9; border-radius: 10px; background: #fbfdfb; }
.finance-budget-group { border-color: #ece8f2; background: #fcfbfd; }
.finance-summary-group-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 9px; margin-bottom: 9px; }
.finance-summary-group-heading > strong { color: #426f5e; font-size: 10px; font-weight: 750; }
.finance-budget-group .finance-summary-group-heading > strong { color: #66568c; }
.finance-summary-group-heading > span { color: #9199a0; font-size: 8px; }
.finance-summary-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.finance-summary-metric { display: flex; min-width: 0; flex-direction: column; gap: 3px; padding: 4px 13px; border-left: 1px solid #eff0f3; }
.finance-summary-metric:first-child { padding-left: 0; border-left: 0; }
.finance-summary-metric > span { overflow: hidden; color: #858b9a; font-size: 9px; font-weight: 550; text-overflow: ellipsis; white-space: nowrap; }
.finance-summary-metric > strong { overflow: hidden; color: #41465a; font-family: var(--display); font-size: clamp(12px, 1.1vw, 15px); font-weight: 700; letter-spacing: -.025em; text-overflow: ellipsis; white-space: nowrap; }
.finance-summary-metric > small { overflow: hidden; color: #a0a4af; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.finance-summary-metric.summary-balance > strong, .finance-summary-metric.summary-income > strong { color: #36815e; }
.finance-summary-metric.summary-outflow > strong { color: #ac6169; }
.finance-summary-metric.summary-budget > strong { color: #695b91; }
.finance-summary-metric.summary-pending > strong { color: #a17d3c; }
.finance-summary-metric.summary-balance.is-negative > strong { color: #b54e58; }
.finance-summary-metric.summary-remaining.is-negative > strong { color: #b54e58; }
.finance-budget-disclaimer { margin: 9px 0 0; padding: 7px 9px; border-radius: 7px; color: #74648f; background: #f3f0f8; font-size: 8px; line-height: 1.5; }
.finance-pending-disclaimer { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin: 7px 0 0; color: #85838a; font-size: 8px; }
.finance-pending-disclaimer strong { color: #8b7041; font-weight: 700; }
.finance-subnav { display: flex; align-items: center; gap: 5px; margin: 0 0 13px; padding: 4px; overflow-x: auto; border: 1px solid #eceef2; border-radius: 11px; background: #f7f7fa; scrollbar-width: thin; }
.finance-subnav > a { display: inline-flex; min-height: 33px; flex: 0 0 auto; align-items: center; justify-content: center; padding: 0 13px; border: 1px solid transparent; border-radius: 8px; color: #85899a; font-size: 9px; font-weight: 650; text-decoration: none; transition: color .16s ease, background .16s ease, box-shadow .16s ease; }
.finance-subnav > a:hover { color: #5f5680; background: #fff; }
.finance-subnav > a.active { border-color: #e9e5f0; color: #62528b; background: #fff; box-shadow: 0 2px 5px rgba(45, 39, 60, .05); }
.finance-report-panel { border-color: #eeedf0; border-radius: 14px; background: linear-gradient(150deg, #fff 80%, #faf9fc); box-shadow: 0 7px 24px rgba(44, 39, 55, .045); }
.finance-report-panel .panel-heading .eyebrow { color: #6f628e; }
.finance-project-report { min-width: 1020px; }
.finance-project-report thead th { padding-top: 10px; padding-bottom: 10px; color: #707689; background: #f8f9fb; font-size: 9px; }
.finance-project-report thead th:nth-child(1), .finance-project-report thead th:nth-child(5) { text-align: left; }
.finance-project-report thead th:nth-child(2) { min-width: 112px; }
.finance-project-report thead th:nth-child(3) { min-width: 245px; }
.finance-project-report thead th:nth-child(4) { min-width: 150px; }
.finance-project-report thead th:nth-child(5) { min-width: 125px; color: #39755d; background: #f2f8f4; }
.finance-project-report thead th:nth-child(6) { min-width: 125px; color: #a34a57; background: #fcf2f3; }
.finance-project-report thead th:nth-child(7) { min-width: 130px; color: #625288; background: #f6f3fa; }
.finance-project-report td { vertical-align: middle; }
.finance-project-report .table-secondary-line { display: block; margin-top: 3px; }
.finance-project-report .finance-ledger-income-row .finance-income-amount { background: #f6fbf7; }
.finance-project-report .finance-ledger-expense-row .finance-outflow-amount { background: #fdf7f7; }
.finance-project-report .finance-ledger-income-row .finance-ledger-description { color: #2f765a; }
.finance-project-report .finance-ledger-expense-row .finance-ledger-description { color: #94545c; }
.finance-ledger-reference { color: #788098; font-size: 9px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.finance-ledger-description { min-width: 200px; color: #474b5d; font-size: 9px; font-weight: 600; }
.finance-ledger-source { display: inline-block; padding: 4px 8px; border-radius: 999px; color: #626b80; background: #f0f2f6; font-size: 8px; font-weight: 650; }
.finance-ledger-running-balance { color: #39405a!important; font-size: 10px; font-weight: 750!important; text-align: right; white-space: nowrap; }
.finance-ledger-empty-row td { padding: 14px; color: #999daa; background: #fcfcfd; font-size: 9px; font-style: italic; text-align: center; }
.finance-event-group > th { padding: 10px 13px; border-bottom-color: #eeebf3; color: #625288; background: #f8f6fb; font-size: 10px; font-weight: 700; letter-spacing: .015em; text-align: left; }
.finance-event-group > th > a { color: inherit; text-decoration: none; }
.finance-event-group > th > a:hover { color: #493c70; text-decoration: underline; }
.finance-event-funding-row > td { padding: 7px 13px; border-bottom-color: #f0eef4; background: #fdfcfe; }
.finance-event-funding-row > td > div { display: flex; flex-wrap: wrap; gap: 5px 22px; }
.finance-event-funding-row > td span { display: inline-flex; align-items: baseline; gap: 6px; }
.finance-event-funding-row small { color: #91909b; font-size: 8px; }
.finance-event-funding-row strong { color: #555266; font-size: 9px; font-weight: 650; font-variant-numeric: tabular-nums; }
.finance-event-funding-row .has-funding-gap strong { color: #a26c3c; }
.finance-row-number { width: 48px; color: #9694a1!important; font-size: 10px; font-variant-numeric: tabular-nums; text-align: center; }
.report-status-note, .report-status-clear { display: block; color: #977b45; font-size: 8px; line-height: 1.6; white-space: nowrap; }
.report-status-clear { color: #789080; }
.finance-entry-accordion { margin: 0 0 13px; border: 1px solid #eceef2; border-radius: 11px; background: #fff; }
.finance-entry-accordion > summary { display: flex; min-height: 48px; align-items: center; gap: 10px; padding: 8px 13px; color: #655d77; cursor: pointer; list-style: none; }
.finance-entry-accordion > summary::-webkit-details-marker { display: none; }
.finance-entry-accordion > summary:hover { background: #fbfafc; }
.finance-entry-plus { display: grid; width: 27px; height: 27px; flex: 0 0 27px; place-items: center; border: 1px solid #ebe6f3; border-radius: 8px; color: #7668a8; background: #f8f6fb; font-size: 14px; transition: transform .18s ease, background .18s ease; }
.finance-entry-accordion > summary > span:nth-child(2) { display: flex; flex: 1; flex-direction: column; gap: 2px; }
.finance-entry-accordion > summary strong { color: #4a4d5f; font-size: 10px; font-weight: 700; }
.finance-entry-accordion > summary small { color: #999daa; font-size: 8px; }
.finance-entry-chevron { color: #9990ae; font-size: 15px; transition: transform .18s ease; }
.finance-entry-accordion[open] > summary { border-bottom: 1px solid #f0eff3; }
.finance-entry-accordion[open] .finance-entry-plus { transform: rotate(45deg); background: #f1edf8; }
.finance-entry-accordion[open] .finance-entry-chevron { transform: rotate(180deg); }
.finance-entry-accordion .finance-forms { margin: 0; padding: 12px; }
.finance-forms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-bottom: 15px; }
.finance-forms .panel-card { align-self: start; }
.finance-forms > .panel-card:only-child { grid-column: 1 / -1; }
.finance-forms .panel-card, .finance-income-panel, .finance-budget-panel, .finance-expense-panel { border-color: #eeedf0; border-radius: 16px; box-shadow: 0 7px 24px rgba(44, 39, 55, .045); }
.module-table-panel { margin-bottom: 15px; }
.review-actions { display: flex; min-width: 155px; flex-wrap: wrap; align-items: center; gap: 4px; }
.review-note { min-width: 100px; min-height: 26px; flex: 1 1 100%; padding: 4px 7px; font-size: 9px; }
.review-approve, .review-reject { padding: 5px 7px; border: 1px solid #e3efe9; border-radius: 5px; color: #31785d; background: #f5fbf7; font-size: 9px; white-space: nowrap; }
.review-reject { border-color: #f4e7e7; color: #b04d54; background: #fff8f8; }
.review-approve:hover { background: #eaf6ef; }.review-reject:hover { background: #fff0f0; }
.finance-kpi-budget { border-top: 0; border-left: 3px solid #9b8bd0; }
.finance-kpi-pending { border-top: 0; border-left: 3px solid #d6b16b; }
.finance-kpi-remaining { border-top: 0; border-left: 3px solid #75ad8b; }
.finance-entry-card { border-top: 0; background: linear-gradient(150deg, #fff 65%, #faf8fc); }
.finance-expense-entry-card { background: linear-gradient(150deg, #fff 65%, #fdf7f7); }
.finance-income-entry-card { background: linear-gradient(150deg, #fff 65%, #f5faf7); }
.finance-entry-icon { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: #65558f; background: #f1edf8; font-size: 17px; font-weight: 700; }
.finance-entry-expense { color: #a83e4e; background: #fbebee; }
.finance-entry-income { color: #328065; background: #e9f7f1; }
.finance-budget-panel .panel-heading .eyebrow { color: #73619e; }
.finance-expense-panel .panel-heading .eyebrow { color: #a74351; }
.finance-budget-table .finance-planned-amount { color: #625288; font-weight: 650; white-space: nowrap; }
.finance-outflow-amount { color: #a83e4e!important; font-weight: 750!important; white-space: nowrap; }
.finance-budget-note { max-width: 650px; margin: 5px 0 0; color: #9094a2; font-size: 10px; line-height: 1.55; }
.finance-budget-jump { display: inline-flex; align-items: center; gap: 5px; margin-top: 8px; padding: 6px 9px; border: 1px solid #eee8f5; border-radius: 8px; color: #7664ad; background: #faf8fd; font-size: 9px; font-weight: 650; text-decoration: none; transition: background .18s ease, transform .18s ease; }
.finance-budget-jump:hover { transform: translateY(-1px); color: #5e4b97; background: #f3effa; }
.finance-actual-link { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 3px; color: inherit; text-decoration: none; }
.finance-actual-link > span { color: #a78689; font-size: 8px; font-weight: 550; opacity: .8; }
.finance-actual-link:hover > span { color: #872b43; text-decoration: underline; opacity: 1; }
.finance-budget-actions { min-width: 125px; }
.finance-budget-edit > summary { border-color: #e4dff0; color: #67558f; background: #faf8fd; }
.finance-budget-edit > summary:hover, .finance-budget-edit[open] > summary { border-color: #d8cfe9; background: #f2eef8; }
.finance-positive-amount { color: #328065!important; font-weight: 650; white-space: nowrap; }
.finance-expense-panel, .finance-income-panel { border-top: 0; }
.finance-income-panel { background: linear-gradient(150deg, #fff 70%, #f9fcfa); }
.finance-expense-panel { background: linear-gradient(150deg, #fff 70%, #fdfafb); }
.finance-budget-panel { background: linear-gradient(150deg, #fff 70%, #fbfaff); }
.finance-income-panel .panel-heading .eyebrow { color: #328065; }
.finance-income-panel .panel-heading { align-items: flex-start; }
.finance-ledger-note { max-width: 620px; margin: 5px 0 0; color: #879386; font-size: 10px; line-height: 1.6; }
.finance-income-table { min-width: 620px; }
.finance-income-amount { color: #328065!important; font-weight: 750!important; white-space: nowrap; }
.finance-income-edit > summary { border-color: #cde5da; color: #287258; background: #f6fcf8; }
.finance-income-edit > summary:hover { background: #eaf7ef; }
.finance-expense-actions { min-width: 145px; }
.finance-approved-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; }
.finance-pay-form { display: grid; width: 100%; max-width: 235px; gap: 4px; padding: 9px; border: 1px solid #e3eee6; border-radius: 10px; background: #f8fcf9; }
.finance-pay-form > label { color: #6f8477; font-size: 9px; font-weight: 650; }
.finance-pay-form > div { display: flex; align-items: center; gap: 5px; }
.finance-pay-form input { width: 112px; min-width: 0; min-height: 30px; padding: 4px 6px; border: 1px solid #e0e9e2; border-radius: 6px; color: #65746a; background: #fff; font-size: 9px; }
.finance-pay-form button { min-height: 30px; padding: 5px 7px; border: 1px solid #d4e8da; border-radius: 6px; color: #347454; background: #edf7f0; font-size: 9px; font-weight: 650; white-space: nowrap; }
.finance-pay-form button:hover { background: #e2f1e7; }
.finance-edit-details { position: relative; }
.finance-edit-details > summary { width: fit-content; padding: 6px 9px; border: 1px solid #ead7dd; border-radius: 7px; color: #872b43; background: #fff9fa; font-size: 9px; font-weight: 700; cursor: pointer; list-style: none; white-space: nowrap; }
.finance-edit-details > summary::-webkit-details-marker { display: none; }
.finance-edit-details > summary::before { margin-right: 5px; content: "✎"; }
.finance-edit-details[open] > summary { border-color: #dcb9c4; background: #fbf1f4; }
.finance-edit-form { display: grid; width: min(340px, 72vw); gap: 7px; margin-top: 8px; padding: 12px; border: 1px solid #eee2e6; border-radius: 10px; background: #fff; box-shadow: 0 10px 25px rgba(53,18,31,.09); }
.finance-edit-event { padding: 7px 8px; border-radius: 6px; color: #695a62; background: #f8f5f6; font-size: 10px; font-weight: 650; }
.finance-edit-form .form-label { margin: 0; color: #76666d; font-size: 9px; font-weight: 650; }
.finance-edit-form .form-control, .finance-edit-form .form-select { min-height: 34px; font-size: 10px; }
.finance-edit-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.finance-edit-row > div { display: grid; gap: 6px; }
.finance-edit-form > .btn { margin-top: 3px; font-size: 10px; }
@media (max-width: 1100px) {
    .finance-summary-groups { grid-template-columns: 1fr; }
    .finance-forms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .finance-subnav { margin-bottom: 10px; }
    .finance-summary-heading > small { display: none; }
    .finance-forms { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .finance-summary-strip { padding: 12px; }
    .finance-summary-heading > div { align-items: flex-start; flex-direction: column; gap: 2px; }
    .finance-summary-group { padding: 9px; }
    .finance-summary-group-heading { flex-direction: column; gap: 2px; }
    .finance-summary-metric { padding: 4px 7px; }
    .finance-summary-metric > strong { font-size: 12px; }
    .finance-edit-form { width: min(300px, 76vw); }
}
.procurement-forms { display: grid; grid-template-columns: minmax(265px, .76fr) minmax(265px, .76fr) minmax(300px, 1.25fr); align-items: start; gap: 14px; margin-bottom: 15px; }
.procurement-forms > .panel-card { min-width: 0; }
.procurement-forms .panel-heading h2 { font-size: 13px; }
.compact-vendor-list { display: flex; flex-direction: column; }
.vendor-row { display: flex; align-items: center; gap: 8px; padding: 10px 0; border-top: 1px solid #f1f2f5; }
.vendor-avatar { display: grid; width: 29px; height: 29px; flex: 0 0 29px; place-items: center; border-radius: 8px; color: #6c5fc1; background: #f0edff; font-size: 10px; font-weight: 700; }
.vendor-count { color: #989eac; font-size: 8px; white-space: nowrap; }
.vendor-row .status-badge { padding: 4px 6px; font-size: 8px; }
.procurement-actions { min-width: 125px; }
.risk-overview { display: grid; grid-template-columns: minmax(290px, .72fr) minmax(0, 1.6fr); align-items: start; gap: 15px; }
.risk-overview.has-crud-modal { grid-template-columns: minmax(0, 1fr); }
.risk-list { display: flex; flex-direction: column; }
.risk-row { display: grid; grid-template-columns: 43px minmax(0, 1fr) 170px; align-items: start; gap: 12px; padding: 17px 0; border-top: 1px solid #f0f1f5; }
.risk-score { display: flex; width: 38px; height: 40px; flex-direction: column; align-items: center; justify-content: center; border-radius: 9px; }
.risk-score strong { font-family: var(--display); font-size: 15px; line-height: 1; }.risk-score small { margin-top: 2px; font-size: 7px; }
.risk-score-danger { color: #ad4047; background: #fff0ef; }.risk-score-high { color: #ad6242; background: #fff2e8; }.risk-score-medium { color: #9b782d; background: #fbf5e7; }.risk-score-low { color: #39826a; background: #eaf7f1; }
.risk-content { min-width: 0; }
.risk-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.risk-level { padding: 4px 6px; border-radius: 12px; font-size: 8px; font-weight: 600; }
.risk-level-danger { color: #ad4047; background: #fff0ef; }.risk-level-high { color: #ad6242; background: #fff2e8; }.risk-level-medium { color: #9b782d; background: #fbf5e7; }.risk-level-low { color: #39826a; background: #eaf7f1; }
.risk-content h3 { margin: 7px 0; color: #343b50; font-size: 12px; font-weight: 700; line-height: 1.5; overflow-wrap: anywhere; }
.risk-content > p { margin: 0 0 8px; color: #888fa0; font-size: 9px; line-height: 1.6; }
.risk-mitigation { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 7px; color: #747c8e; font-size: 10px; line-height: 1.6; }.risk-mitigation strong { color: #515b70; white-space: nowrap; }
.risk-foot { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 5px 14px; margin-top: 10px; color: #8991a2; font-size: 9px; }
.risk-row > .risk-status { align-self: start; min-width: 0; width: 100%; }
.risk-row > .risk-status form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 7px; }
.risk-row > .risk-status .status-select { width: 100%; max-width: none; min-width: 0; min-height: 36px; padding: 6px 23px 6px 10px; border: 1px solid #ece6e8; border-radius: 9px; font-size: 10px; }
.risk-row > .risk-status .status-save { min-height: 36px; padding: 0 11px; border: 1px solid #eadde2; border-radius: 9px; color: #7a2945; background: #fff; font-size: 10px; }
.risk-row > .risk-status .status-save:hover { border-color: #cbaab6; background: #fbf4f6; }
.meeting-forms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 15px; margin-bottom: 15px; }
.meeting-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 15px; }
.meetings-calendar-card { margin-bottom: 16px; padding: 22px 24px; }
.meeting-calendar-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.meeting-calendar-toolbar h2 { margin: 4px 0 0; color: #30354a; font: 750 19px var(--display); }
.meeting-calendar-controls { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.meeting-calendar-legend { display: flex; flex-wrap: wrap; gap: 10px 18px; margin: 15px 0 12px; color: #77717a; font-size: 11px; }
.meeting-calendar-legend > span { display: inline-flex; align-items: center; gap: 7px; }
.meeting-calendar-legend-dot { width: 9px; height: 9px; border-radius: 50%; }
.meeting-calendar-legend-dot.held { background: #368367; }
.meeting-calendar-legend-dot.scheduled { background: #dc8a2c; }
.meeting-calendar-legend-dot.cancelled { background: #c84d58; }
.meeting-calendar-wrap { overflow-x: auto; border: 1px solid #eee7e9; border-radius: 11px; scrollbar-width: thin; }
.meeting-calendar-grid { display: grid; min-width: 820px; grid-template-columns: minmax(0, 1fr); background: #fff; }
.meeting-calendar-week-heading { display: grid; min-width: 820px; grid-template-columns: repeat(7, minmax(112px, 1fr)); }
.meeting-calendar-day-heading { display: grid; min-height: 38px; place-items: center; border-right: 1px solid #f0e9eb; border-bottom: 1px solid #eee7e9; color: #74636a; background: #fcfafb; font-size: 10px; font-weight: 700; text-transform: capitalize; }
.meeting-calendar-week-row { display: grid; min-width: 820px; grid-template-columns: repeat(7, minmax(112px, 1fr)); border-bottom: 1px solid #f0e9eb; }
.meeting-calendar-day { min-width: 0; min-height: 142px; padding: 7px; border-right: 1px solid #f0e9eb; background: #fff; }
.meeting-calendar-grid.is-week .meeting-calendar-day { min-height: 235px; }
.meeting-calendar-grid.is-day { min-width: 0; grid-template-columns: minmax(0, 1fr); }
.meeting-calendar-grid.is-day .meeting-calendar-day-heading { min-height: 48px; }
.meeting-calendar-grid.is-day .meeting-calendar-day { min-height: 310px; padding: 14px; }
.meeting-calendar-day.is-today { background: #fffbfc; }
.meeting-calendar-day.is-outside-month { background: #fbfafb; }
.meeting-calendar-date { display: grid; width: 24px; height: 24px; margin-bottom: 5px; place-items: center; border-radius: 50%; color: #74636a; font-size: 11px; font-weight: 650; }
.meeting-calendar-date-button { padding: 0; border: 0; background: transparent; cursor: pointer; }
.meeting-calendar-date-button:hover { color: #68122f; background: #f8e9ef; }
.meeting-calendar-date-button:focus-visible { outline: 2px solid rgba(128, 0, 32, .35); outline-offset: 2px; }
.meeting-calendar-date.is-today { color: #fff; background: var(--purple); }
.meeting-calendar-day.is-outside-month .meeting-calendar-date { color: #b9afb3; }
.meeting-calendar-day-items { display: flex; flex-direction: column; gap: 5px; }
.meeting-calendar-item { display: flex; width: 100%; min-width: 0; flex-direction: column; gap: 2px; padding: 6px 7px; border: 1px solid; border-left-width: 3px; border-radius: 7px; text-align: left; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease; }
.meeting-calendar-item:hover { z-index: 1; box-shadow: 0 3px 10px rgba(53, 18, 31, .12); transform: translateY(-1px); }
.meeting-calendar-item.is-held { border-color: #c8e1d5; border-left-color: #368367; color: #27674f; background: #edf7f1; }
.meeting-calendar-item.is-scheduled { border-color: #f0d4ad; border-left-color: #dc8a2c; color: #955816; background: #fff6e9; }
.meeting-calendar-item.is-cancelled { border-color: #efc5ca; border-left-color: #c84d58; color: #a33642; background: #fff0f1; }
.meeting-calendar-item-time { font-size: 9px; font-weight: 800; }
.meeting-calendar-item strong { overflow: hidden; font-size: 10px; line-height: 1.35; text-overflow: ellipsis; }
.meeting-calendar-item small { overflow: hidden; color: currentColor; font-size: 8px; opacity: .78; text-overflow: ellipsis; white-space: nowrap; }
.meeting-detail-modal .status-badge.status-success { color: #27674f; background: #edf7f1; }
.meeting-detail-modal .status-badge.status-warning { color: #955816; background: #fff6e9; }
.meeting-detail-modal .status-badge.status-danger { color: #a33642; background: #fff0f1; }
.meeting-calendar-empty { padding: 4px; color: #9a9196; font-size: 11px; }
.meeting-detail-modal .modal-dialog { max-width: 760px; }
.meeting-detail-modal .modal-content { overflow: hidden; border: 1px solid rgba(74, 18, 37, .12); border-radius: 19px; box-shadow: 0 25px 80px rgba(32, 10, 20, .28); }
.meeting-detail-modal .modal-header { align-items: flex-start; padding: 23px 26px 18px; border-bottom-color: #f0e6e9; background: radial-gradient(circle at 100% 0, rgba(52, 118, 154, .1), transparent 42%), linear-gradient(135deg, #fff 0%, #f5f9fb 100%); }
.meeting-detail-heading { min-width: 0; }
.meeting-detail-heading .eyebrow { margin-bottom: 6px; color: #34769a; }
.meeting-detail-modal .modal-title { color: #35121f; font: 750 22px/1.25 var(--display); overflow-wrap: anywhere; }
.meeting-detail-context { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; color: #76646d; font-size: 11px; }
.meeting-detail-modal .modal-body { padding: 22px 26px 25px; }
.meeting-detail-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 21px; }
.meeting-detail-summary > div { display: flex; min-height: 56px; flex-direction: column; justify-content: center; gap: 6px; padding: 10px 12px; border: 1px solid #f0e7ea; border-radius: 10px; background: #fdfafb; }
.meeting-detail-summary span { color: #99868e; font-size: 8px; font-weight: 800; letter-spacing: .09em; }
.meeting-detail-summary strong { color: #492936; font-size: 12px; }
.meeting-mom-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #f0e7ea; }
.meeting-mom-heading h3 { margin: 4px 0 0; color: #492936; font: 750 15px var(--display); }
.meeting-action-progress { color: #81717a; font-size: 10px; }
.meeting-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.meeting-edit-field { min-width: 0; }
.meeting-edit-field-wide { grid-column: 1 / -1; }
.meeting-detail-modal .form-label { margin-bottom: 6px; color: #5c3b47; font-size: 11px; font-weight: 650; }
.meeting-detail-modal .form-control, .meeting-detail-modal .form-select { min-height: 40px; border-color: #e8dfe2; border-radius: 9px; color: #442b35; font-size: 12px; }
.meeting-detail-modal textarea.meeting-mom-textarea { min-height: 150px; resize: vertical; line-height: 1.6; }
.meeting-detail-modal .form-control:focus, .meeting-detail-modal .form-select:focus { border-color: #ad526e; box-shadow: 0 0 0 .2rem rgba(128, 0, 32, .11); }
.meeting-edit-feedback { margin-bottom: 15px; font-size: 12px; }
.meeting-readonly-note { margin-bottom: 15px; padding: 11px 13px; border: 1px solid #e5e8ee; border-radius: 9px; color: #687184; background: #f7f8fa; font-size: 11px; }
.meeting-mom-actions { margin-top: 20px; padding-top: 17px; border-top: 1px solid #f0e7ea; }
.meeting-mom-actions-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.meeting-mom-actions-heading h3 { margin: 3px 0 0; color: #492936; font: 750 15px var(--display); }
.meeting-mom-actions-heading p { margin: 4px 0 0; color: #81717a; font-size: 10px; }
.meeting-action-add, .meeting-action-remove { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border: 1px solid #eadde2; border-radius: 9px; color: #7a2945; background: #fff; font-size: 22px; line-height: 1; }
.meeting-action-add:hover, .meeting-action-remove:hover { border-color: #cbaab6; background: #fbf4f6; }
.meeting-action-edit-list { display: flex; flex-direction: column; gap: 9px; }
.meeting-action-edit-row { display: grid; grid-template-columns: minmax(180px, 1.4fr) minmax(140px, 1fr) minmax(135px, .8fr) minmax(140px, .8fr) 34px; align-items: end; gap: 9px; padding: 11px; border: 1px solid #f0e7ea; border-radius: 10px; background: #fdfafb; }
.meeting-action-edit-row label { display: flex; min-width: 0; flex-direction: column; gap: 5px; margin: 0; color: #76616a; font-size: 9px; font-weight: 700; }
.meeting-action-edit-row .form-control, .meeting-action-edit-row .form-select { min-height: 37px; font-size: 11px; }
.meeting-action-edit-row .meeting-action-completed-at { color: #54816b; font-size: 8px; font-weight: 500; line-height: 1.35; }
.meeting-action-edit-row .meeting-action-edit-title { grid-column: auto; }
.meeting-action-edit-row .meeting-action-remove { width: 32px; height: 37px; }
.meeting-action-edit-row .meeting-action-remove[hidden] { display: none; }
.meeting-edit-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 19px; padding-top: 15px; border-top: 1px solid #f0e7ea; }
.meeting-edit-actions .btn { min-height: 40px; padding: 8px 15px; border-radius: 9px; font-size: 12px; }
.meeting-list, .action-list { display: flex; flex-direction: column; }
.meeting-row, .action-row { display: flex; align-items: flex-start; gap: 11px; padding: 13px 0; border-top: 1px solid #f0f1f5; }
.meeting-date-card { display: flex; width: 39px; height: 41px; flex: 0 0 39px; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #eeebf9; border-radius: 8px; color: #685ac6; background: #faf9ff; }
.meeting-date-card strong { font-family: var(--display); font-size: 14px; line-height: 1; }.meeting-date-card small { margin-top: 3px; font-size: 8px; }
.meeting-copy, .action-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; }
.meeting-copy > strong, .action-copy > strong { color: #343b50; font-size: 12px; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.meeting-copy > small, .action-copy > small { display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 5px; color: #768095; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.meeting-meta-label, .action-meta-label { color: #9a8290; font-size: 8px; font-weight: 800; letter-spacing: .06em; }
.meeting-meta-separator, .action-meta-separator { color: #c0b4ba; }
.meeting-row > .meeting-actions-count { align-self: center; }
.action-row > .action-check { margin-top: 3px; }
.action-row > .risk-status { align-self: center; flex: 0 0 180px; }
.action-row > .risk-status form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 7px; }
.action-row > .risk-status form[data-meeting-action-status] { grid-template-columns: minmax(0, 1fr); gap: 0; }
.action-row > .risk-status .status-select { width: 100%; max-width: none; min-width: 0; min-height: 36px; padding: 6px 22px 6px 9px; border: 1px solid #ece6e8; border-radius: 9px; font-size: 10px; }
.action-row > .risk-status .status-save { min-height: 36px; padding: 0 10px; border: 1px solid #eadde2; border-radius: 9px; color: #7a2945; background: #fff; font-size: 10px; }
.action-row > .risk-status .status-save:hover { border-color: #cbaab6; background: #fbf4f6; }
.meeting-action-status-label { display: block; margin-bottom: 4px; color: #8b8490; font-size: 8px; font-weight: 650; }
.action-row > .risk-status .meeting-action-status-saving { display: block; min-height: 12px; margin-top: 3px; color: #8b8490; font-size: 8px; }
.action-completion-date { color: #43815f!important; }
.workspace-settings-card { max-width: 760px; }
.workspace-settings-form { max-width: 560px; }
.meeting-actions-count { display: flex; flex-direction: column; color: #6e63be; text-align: right; }.meeting-actions-count strong { font-size: 10px; }.meeting-actions-count small { color: #999eac; font-size: 8px; }
.meeting-page-tabs { margin-top: 2px; }
.meeting-page-tab-panels { min-width: 0; }
.meeting-page-tab-panel[hidden] { display: none !important; }
.meeting-action-mom { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 12px; padding: 14px 15px; border: 1px solid #eee5e8; border-radius: 11px; background: #fbf8f9; }
.meeting-action-mom > div { min-width: 0; }
.meeting-action-mom .eyebrow { margin-bottom: 6px; }
.meeting-action-mom p { margin: 0; color: #68545e; font-size: 11px; line-height: 1.65; overflow-wrap: anywhere; }
.meeting-action-mom-button { flex: 0 0 auto; min-height: 36px; font-size: 11px; }
.meeting-action-group + .meeting-action-group { margin-top: 22px; padding-top: 18px; border-top: 1px solid #eee7e9; }
.action-check { display: grid; width: 17px; height: 17px; flex: 0 0 17px; place-items: center; border: 1px solid #dfe1e8; border-radius: 50%; color: #fff; font-size: 9px; }.action-check.checked { border-color: #68ae90; background: #68ae90; }
.action-copy small a { color: #7769c9; }
.action-row .status-select { max-width: 117px; }
.task-table td .progress-line { min-width: 55px; }

.form-panel { padding: 24px; }
.form-section-title { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 20px; }
.section-number { display: grid; width: 28px; height: 28px; flex: 0 0 28px; place-items: center; border-radius: 8px; color: #6c5fd0; background: #f0edff; font-size: 10px; font-weight: 700; }
.form-section-title h2 { margin-top: 1px; font-size: 14px; }
.form-section-title p { margin: 5px 0 0; color: #989dad; font-size: 10px; }
.form-section-spaced { margin-top: 28px; padding-top: 23px; border-top: 1px solid #eff0f4; }
.form-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 25px; padding-top: 17px; border-top: 1px solid #eff0f4; }
.form-actions .btn { min-height: 38px; padding: 0 15px; }
.detail-heading { align-items: flex-start; }
.breadcrumb-link { color: #7970be; font-size: inherit; }
.detail-status { margin-top: 14px; }
.event-tabs { display: none !important; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(260px, .8fr); gap: 15px; margin-bottom: 16px; }
.detail-main, .lifecycle-panel { align-self: start; }
.detail-main { position: relative; overflow: hidden; padding: 0; border-color: #ebe5e8; background: linear-gradient(145deg, #fff 48%, #fffbfc); }
.event-overview-banner { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; overflow: hidden; padding: 20px 22px; border-bottom: 1px solid rgba(128,0,32,.07); background: radial-gradient(ellipse at 88% 4%, rgba(128,0,32,.07), transparent 38%), linear-gradient(115deg, #fff 12%, #fcf7f8 100%); }
.event-overview-banner::after { position: absolute; top: -58px; right: 24px; width: 142px; height: 142px; border: 1px solid rgba(128,0,32,.07); border-radius: 50%; content: ""; pointer-events: none; }
.event-overview-heading { position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; }
.event-overview-mark { display: grid; width: 39px; height: 39px; flex: 0 0 39px; place-items: center; border: 1px solid #f0dde3; border-radius: 12px; color: #800020; background: linear-gradient(145deg, #fff, #f9edf1); box-shadow: 0 5px 14px rgba(128,0,32,.08); font-size: 17px; }
.event-overview-heading .eyebrow { color: #9a5269; }
.event-overview-heading h2 { margin: 4px 0 0; color: #30303d; font-family: var(--display); font-size: 17px; font-weight: 750; letter-spacing: -.035em; }
.event-type-chip { position: relative; z-index: 1; padding: 6px 10px; border: 1px solid #eedfe4; border-radius: 20px; color: #7c3049; background: rgba(255,255,255,.8); font-size: 9px; font-weight: 700; }
.event-description { min-height: 0; margin: 0; padding: 18px 22px 20px; color: #656b7a; font-size: 11px; line-height: 1.85; }
.detail-main .detail-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 0 22px 21px; }
.detail-fact-card { display: flex; min-width: 0; align-items: center; gap: 10px; padding: 12px; border: 1px solid #f0edf0; border-radius: 10px; background: rgba(255,255,255,.82); transition: border-color .18s ease, transform .18s ease; }
.detail-fact-card:hover { transform: translateY(-1px); border-color: #e7cbd4; }
.detail-fact-icon { display: grid; width: 31px; height: 31px; flex: 0 0 31px; place-items: center; border-radius: 9px; color: #800020; background: #f9edf1; font-size: 13px; font-weight: 700; }
.detail-fact-copy { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.detail-fact-copy small { color: #9b8790; font-size: 8px; font-weight: 700; letter-spacing: .08em; }
.detail-fact-copy strong { overflow-wrap: anywhere; color: #3e414e; font-size: 10px; font-weight: 650; line-height: 1.45; }
.lifecycle-panel { border-color: #ece4e7; background: linear-gradient(155deg, #fff 45%, #fcf7f8); }
.lifecycle-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 9px; }
.lifecycle-panel h2 { margin: 5px 0 5px; color: #33384b; font-family: var(--display); font-size: 15px; font-weight: 700; }
.lifecycle-panel > p { margin: 0; color: #9298a8; font-size: 10px; line-height: 1.6; }
.lifecycle-current { padding: 5px 8px; font-size: 8px; }
.lifecycle-steps { display: flex; flex-direction: column; margin: 16px 0; padding: 12px 13px; border: 1px solid #f0e9ec; border-radius: 11px; background: rgba(255,255,255,.8); }
.lifecycle-step { position: relative; display: flex; align-items: center; gap: 10px; min-height: 28px; color: #a0a5b2; font-size: 10px; }
.lifecycle-step:not(:last-child)::after { position: absolute; top: 22px; left: 8px; width: 1px; height: 9px; background: #ece8eb; content: ""; }
.lifecycle-step > span { display: grid; width: 18px; height: 18px; flex: 0 0 18px; place-items: center; border: 1px solid #e5e6ed; border-radius: 50%; color: #a0a5b2; background: #fff; font-size: 8px; }
.lifecycle-step.reached { color: #6a5660; }
.lifecycle-step.reached > span { border-color: #d8b2bf; color: #800020; background: #f9edf1; }
.lifecycle-step.reached:not(:last-child)::after { background: #d9b8c2; }
.lifecycle-step.current { color: #800020; font-weight: 700; }
.lifecycle-step.current > span { border-color: #800020; color: #fff; background: #800020; box-shadow: 0 0 0 3px #f8e9ee; }
.status-update-form { padding-top: 14px; border-top: 1px solid #eff0f4; }
.status-update-form .form-label { font-size: 10px; }
.breadcrumb-link:hover { color: #5142bc; }

.create-task-panel { margin-bottom: 15px; }
.create-task-panel .panel-heading { margin-bottom: 18px; }
.task-create-form { padding-top: 14px; border-top: 1px solid #f0f1f5; }
.full-task-panel { margin-top: 0; }
.table-link { color: #6258b8; font-weight: 600; }
.table-link:hover { text-decoration: underline; }
.priority-label { font-size: 9px; font-weight: 600; }
.priority-low { color: #81899a; }.priority-medium { color: #647b9c; }.priority-high { color: #b47b35; }.priority-urgent { color: #c24f59; }
.overdue-text { color: #c44f5a !important; font-weight: 600; }
.inline-status-form { display: flex; align-items: center; gap: 5px; }
.status-select { max-width: 126px; padding: 5px 23px 5px 8px; border: 1px solid transparent; border-radius: 14px; outline: none; font-size: 9px; font-weight: 600; }
.status-select.status-success { color: #267b61; background-color: #eaf6f0; }.status-select.status-primary { color: #5a50b4; background-color: #efedff; }.status-select.status-warning { color: #a0782d; background-color: #fbf4e5; }.status-select.status-danger { color: #bb5059; background-color: #fff0f0; }.status-select.status-secondary { color: #747c8f; background-color: #f1f2f5; }
.status-save { padding: 3px 7px; border: 1px solid #e6e3f8; border-radius: 5px; color: #6a5ec5; background: #fff; font-size: 9px; }
.status-save:hover { background: #f4f2ff; }

.auth-page { min-height: 100vh; background: #fff; }
.auth-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(360px, .92fr) minmax(430px, 1.08fr); }
.auth-aside { position: relative; display: flex; flex-direction: column; padding: 34px 9%; overflow: hidden; color: #fff; background: radial-gradient(ellipse at 75% 85%, rgba(129,105,245,.32), transparent 43%), radial-gradient(ellipse at 5% 10%, rgba(71,70,142,.36), transparent 42%), linear-gradient(145deg, #252943, #1e233a 72%); }
.auth-aside::before, .auth-aside::after { position: absolute; width: 340px; height: 340px; border: 1px solid rgba(206,198,255,.08); border-radius: 50%; content: ""; }
.auth-aside::before { right: -160px; bottom: 105px; }.auth-aside::after { right: -115px; bottom: 150px; width: 250px; height: 250px; }
.brand-light { position: relative; z-index: 1; color: #fff; }
.brand-light .brand-name small { color: #a3a7c0; }
.auth-message { position: relative; z-index: 1; max-width: 430px; margin: auto 0; padding: 60px 0; }
.auth-message .eyebrow { color: #aaa3f3; }
.auth-message h1 { margin: 17px 0; font-family: var(--display); font-size: clamp(34px, 4.3vw, 52px); font-weight: 700; letter-spacing: -.06em; line-height: 1.15; }
.auth-message h1 em { color: #aa9cff; font-style: normal; }
.auth-message p { max-width: 350px; color: #b6bbcd; font-size: 13px; line-height: 1.8; }
.auth-footnote { position: relative; z-index: 1; color: #969cb5; font-size: 10px; }
.auth-panel { display: grid; padding: 45px; place-items: center; }
.auth-form-wrap { width: min(100%, 370px); }
.auth-form-wrap h2 { margin: 11px 0 7px; color: #292e42; font-family: var(--display); font-size: 27px; font-weight: 700; letter-spacing: -.05em; }
.auth-subtitle { margin: 0 0 25px; color: #888fa0; font-size: 12px; }
.auth-form .form-label { margin-bottom: 7px; font-size: 11px; }
.auth-form .form-control { min-height: 45px; }
.auth-submit { display: flex; min-height: 46px; align-items: center; justify-content: space-between; margin-top: 23px; padding: 0 15px; font-size: 12px; }
.auth-submit span { font-size: 17px; font-weight: 400; }
.auth-security { margin-top: 20px; color: #a1a6b4; font-size: 10px; text-align: center; }
.auth-back-link { margin: 16px 0 0; font-size: 11px; text-align: center; }
.auth-back-link a { color: #5b50bd; font-weight: 650; text-decoration: none; }
.auth-back-link a:hover { text-decoration: underline; }
.auth-mobile-brand { display: none; margin-bottom: 34px; color: #574ac4; font-family: var(--display); font-weight: 800; letter-spacing: .12em; }
.error-page { display: grid; min-height: 100vh; padding: 24px; place-items: center; background: var(--canvas); }
.error-card { max-width: 570px; padding: 35px; border: 1px solid var(--line); border-radius: 12px; background: #fff; box-shadow: var(--shadow); }
.error-card h1 { margin: 7px 0 13px; font-family: var(--display); font-size: 25px; }
.error-card p:not(.eyebrow) { color: #737b8d; font-size: 12px; line-height: 1.8; }
.error-card code { color: #5d51be; font-size: 11px; }
.empty-state { display: grid; min-height: 55vh; align-content: center; justify-items: center; padding: 25px; text-align: center; }
.empty-state h1 { margin: 15px 0 8px; font-family: var(--display); font-size: 23px; }
.empty-state p { max-width: 400px; margin-bottom: 18px; color: #82899a; font-size: 11px; line-height: 1.7; }
.sr-submit { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.alert { border: 0; border-radius: 8px; font-size: 11px; }
.alert-success { color: #276e58; background: #eaf7f0; }.alert-danger { color: #a8414b; background: #fff0f0; }

.documents-grid { grid-template-columns: minmax(270px, .72fr) minmax(0, 1.6fr); }
.document-filter { display: flex; gap: 8px; margin: 0 0 10px; }
.document-filter .form-select { max-width: 260px; font-size: 10px; }
.document-filter .btn { font-size: 10px; }
.document-list { display: flex; flex-direction: column; }
.document-row { display: flex; align-items: center; gap: 11px; padding: 13px 0; border-top: 1px solid #f0f1f5; }
.document-icon { display: grid; width: 36px; height: 38px; flex: 0 0 36px; place-items: center; border-radius: 9px; color: #695dc2; background: #f0edff; font-size: 17px; }
.document-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; }
.document-copy strong { overflow: hidden; color: #41475a; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.document-copy span, .document-copy small { overflow: hidden; color: #9298a8; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.document-copy span a { color: #7064c3; }
.document-actions { display: flex; align-items: flex-end; flex-direction: column; gap: 7px; }
.document-actions .status-badge { font-size: 8px; white-space: nowrap; }
.document-actions .btn { white-space: nowrap; }
.form-hint { margin-top: 5px; color: #969cac; font-size: 9px; line-height: 1.5; }
.program-filter-panel { margin-bottom: 15px; padding: 13px 17px; }
.program-forms { display: grid; grid-template-columns: minmax(260px, .78fr) minmax(0, 1.35fr); align-items: start; gap: 15px; margin-bottom: 15px; }
.program-workspace { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(285px, .7fr); align-items: start; gap: 17px; }
.program-workspace > .module-list-card, .program-side > .panel-card { min-width: 0; }
.program-side { display: flex; flex-direction: column; gap: 15px; }
.program-list, .speaker-list, .version-list { display: flex; flex-direction: column; }
.program-row { position: relative; display: grid; grid-template-columns: 58px 12px minmax(0, 1fr) minmax(92px, auto); align-items: start; gap: 12px; padding: 17px 0; border-top: 1px solid #f0edf0; scroll-margin-top: 85px; }
.program-row::before { position: absolute; top: 0; bottom: -1px; left: 73px; width: 2px; background: #f0e5e9; content: ""; }
.program-time { display: flex; align-items: flex-end; flex-direction: column; gap: 3px; padding-top: 1px; color: #9a8d93; font-size: 9px; font-variant-numeric: tabular-nums; }
.program-time strong { color: #76001d; font-family: var(--display); font-size: 14px; line-height: 1.1; }
.program-time .program-date { margin-bottom: 2px; color: #94858d; font-size: 8px; font-weight: 650; letter-spacing: .02em; }
.program-marker { z-index: 1; position: relative; width: 10px; height: 10px; margin: 5px 0 0 1px; border: 2px solid #9b3454; border-radius: 50%; background: #f8e9ee; box-shadow: 0 0 0 4px #fff7f9; }
.program-marker-break { border-color: #d1a050; background: #fbf4e5; }.program-marker-rehearsal, .program-marker-setup { border-color: #4c9d83; background: #ebf7f1; }.program-marker-ceremony { border-color: #d37e83; background: #fff0f0; }
.program-copy { display: flex; min-width: 0; flex-direction: column; gap: 6px; }
.program-title-row { display: flex; min-width: 0; align-items: center; gap: 8px; }
.program-title-row > a { overflow: hidden; color: #800020; font-size: 9px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.program-title-row .status-badge { flex: 0 0 auto; font-size: 8px; }
.program-copy > strong { color: #35242b; font-size: 12px; font-weight: 750; line-height: 1.45; }
.program-meta { display: flex; flex-wrap: wrap; gap: 5px; color: #897c83; font-size: 9px; line-height: 1.4; }
.program-meta > span:not(:first-child)::before { margin-right: 5px; color: #c3b5bb; content: "·"; }
.program-meta .program-type { padding: 2px 7px; border-radius: 20px; color: #695b61; background: #f4f1f2; font-size: 8px; font-weight: 650; }
.program-speaker, .program-notes { color: #897c83; font-size: 9px; line-height: 1.5; }
.program-speaker strong { color: #55424a; font-weight: 700; }
.program-notes { padding: 7px 9px; border-left: 2px solid #e9d6dd; border-radius: 0 6px 6px 0; background: #fcf8f9; }
.program-status-form { display: flex; align-items: flex-end; flex-direction: column; gap: 6px; }
.program-status-form .status-select { width: 100%; max-width: 136px; min-height: 31px; padding: 5px 23px 5px 9px; border: 1px solid #eee5e8; border-radius: 8px; font-size: 9px; }
.program-status-form .status-save { min-height: 29px; padding: 0 9px; border-radius: 7px; font-size: 9px; }
@media (max-width: 1020px) {
    .program-workspace { grid-template-columns: minmax(0, 1.4fr) minmax(250px, .8fr); gap: 12px; }
    .program-row { grid-template-columns: 52px 10px minmax(0, 1fr); gap: 10px; }
    .program-row::before { left: 64px; }
    .program-status-form { grid-column: 3; grid-row: 2; flex-direction: row; align-items: center; justify-content: flex-start; }
}
@media (max-width: 820px) {
    .program-workspace { grid-template-columns: minmax(0, 1fr); }
    .program-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
}
@media (max-width: 600px) {
    .program-side { grid-template-columns: minmax(0, 1fr); }
    .program-row { grid-template-columns: 42px 9px minmax(0, 1fr); gap: 9px; padding: 14px 0; }
    .program-row::before { left: 53px; }
    .program-copy { grid-column: 3; grid-row: 1; }
    .program-status-form { grid-column: 3; grid-row: 2; }
    .program-status-form .status-select { max-width: 150px; }
}
.version-form { margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #f0f1f5; }
.version-item { padding: 10px 0; border-top: 1px solid #f0f1f5; }
.version-item summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; cursor: pointer; list-style: none; }
.version-item summary::-webkit-details-marker { display: none; }
.version-item summary > span:first-child { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.version-item summary strong { color: #4a5062; font-size: 9px; }
.version-item summary small { color: #999eac; font-size: 8px; }
.version-count { flex: 0 0 auto; color: #7367c1; font-size: 8px; }
.version-snapshot { margin: 10px 0 0; padding-left: 22px; }
.version-snapshot li { padding: 5px 0; color: #5a6070; font-size: 9px; }
.version-snapshot li strong, .version-snapshot li span { display: block; }
.version-snapshot li span { margin-top: 3px; color: #9298a8; font-size: 8px; }
.speaker-row { display: flex; align-items: center; gap: 9px; padding: 10px 0; border-top: 1px solid #f0f1f5; }
.speaker-row > div { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.speaker-row strong { color: #4a5062; font-size: 9px; }
.speaker-row small { overflow: hidden; color: #969cac; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.participant-kpis { margin-bottom: 15px; }
.participant-form-panel, .participant-list-panel { margin-bottom: 15px; }
.participant-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 12px; }
.participant-submit { display: flex; align-items: flex-end; min-height: 63px; }
.participant-filter { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(130px, .55fr) minmax(200px, 1.4fr) auto auto; gap: 8px; margin-bottom: 12px; }
.participant-filter-embedded { grid-template-columns: minmax(150px, .7fr) minmax(220px, 1.6fr) auto auto; }
.participant-filter .form-select, .participant-filter .form-control { min-width: 0; font-size: 10px; }
.participant-filter .btn { font-size: 10px; }
.participant-table td { vertical-align: middle; }
.participant-table-wrap { overflow: auto; border: 1px solid #eceef3; border-radius: 10px; background: #fff; }
.participant-table-wrap .participant-table { width: 100%; min-width: 940px; margin: 0; table-layout: fixed; color: #555d70; font-size: 11px; }
.participant-col-person { width: 28%; }.participant-col-event { width: 19%; }.participant-col-ticket { width: 17%; }.participant-col-rsvp { width: 19%; }.participant-col-actions { width: 17%; }
.participant-table-wrap .participant-table thead th { padding: 12px 13px; border-bottom: 1px solid #eceef3; color: #858b9b; background: #fafafd; font-size: 9px; font-weight: 750; letter-spacing: .08em; white-space: nowrap; }
.participant-table-wrap .participant-table tbody td { padding: 13px; border-color: #f0f1f5; vertical-align: middle; overflow-wrap: anywhere; }
.participant-table-wrap .participant-table tbody tr:last-child td { border-bottom: 0; }
.participant-table-wrap .participant-table tbody tr:hover { background: #fcfbfd; }
.participant-table-wrap .participant-name { margin-bottom: 4px; color: #343b50; font-size: 11px; }
.participant-table-wrap .participant-meta { overflow-wrap: anywhere; color: #858c9d; font-size: 9px; }
.participant-table-wrap .ticket-code { max-width: 100%; overflow-wrap: anywhere; font-size: 9px; }
.participant-actions { display: flex; flex-direction: column; align-items: stretch; gap: 6px; }
.participant-name { display: block; color: #41475a; font-size: 10px; font-weight: 700; }
.participant-meta { display: block; margin-top: 4px; color: #969cac; font-size: 8px; line-height: 1.5; }
.ticket-code { display: inline-block; padding: 5px 7px; border-radius: 5px; color: #5f55ad; background: #f3f1ff; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; letter-spacing: .06em; }
.participant-action-form { display: flex; align-items: center; gap: 6px; min-width: 0; }
.participant-action-form .form-select { min-width: 0; flex: 1; font-size: 9px; }
.participant-action-form .btn { flex: 0 0 auto; white-space: nowrap; font-size: 9px; }
@media (max-width: 760px) {
    .participant-table-wrap { overflow: visible; border: 0; background: transparent; }
    .participant-table-wrap .participant-table { display: block; min-width: 0; border-collapse: separate; border-spacing: 0; }
    .participant-table-wrap .participant-table thead { display: none; }
    .participant-table-wrap .participant-table tbody { display: grid; gap: 10px; }
    .participant-table-wrap .participant-table tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; overflow: hidden; border: 1px solid #eceef3; border-radius: 11px; background: #fff; box-shadow: 0 4px 14px rgba(30,34,55,.04); }
    .participant-table-wrap .participant-table tbody td { display: grid; min-width: 0; grid-template-columns: 82px minmax(0, 1fr); align-items: start; gap: 8px; padding: 10px 12px; border: 0; font-size: 11px; }
    .participant-table-wrap .participant-table tbody td::before { padding-top: 2px; color: #8c8190; content: attr(data-label); font-size: 8px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
    .participant-table-wrap .participant-table tbody td:first-child,
    .participant-table-wrap .participant-table tbody td:nth-child(4),
    .participant-table-wrap .participant-table tbody td:last-child { grid-column: 1 / -1; }
    .participant-table-wrap .participant-table tbody td:first-child { padding-top: 13px; padding-bottom: 12px; border-bottom: 1px solid #f0edf0; }
    .participant-table-wrap .participant-table tbody td:nth-child(2),
    .participant-table-wrap .participant-table tbody td:nth-child(3) { align-items: center; }
    .participant-table-wrap .participant-table tbody td:nth-child(4) { border-top: 1px solid #f3f0f2; }
    .participant-table-wrap .participant-table tbody td:last-child { border-top: 1px solid #f3f0f2; background: #fcfbfc; }
    .participant-actions { display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; gap: 7px; }
    .participant-actions .participant-action-form { flex: 1 1 210px; }
    .participant-actions > .btn { flex: 0 0 auto; }
}

    .public-registration-page {
        position: relative;
        overflow-x: hidden;
        background:
            radial-gradient(ellipse at 8% 10%, rgba(128, 0, 32, .08), transparent 32%),
            radial-gradient(ellipse at 92% 82%, rgba(177, 117, 141, .1), transparent 34%),
            linear-gradient(145deg, #f8f5f6 0%, #f2f3f8 52%, #f8f6f7 100%);
    }

    .public-registration-page::before,
    .public-registration-page::after {
        position: fixed;
        z-index: 0;
        width: 220px;
        height: 220px;
        border: 1px solid rgba(128, 0, 32, .08);
        border-radius: 50%;
        content: "";
        pointer-events: none;
        animation: public-orbit-drift 12s ease-in-out infinite alternate;
    }

    .public-registration-page::before { top: 12%; left: -145px; }
    .public-registration-page::after { right: -135px; bottom: 8%; width: 290px; height: 290px; animation-delay: -5s; }

    .public-registration-shell { position: relative; z-index: 1; width: min(100% - 36px, 940px); padding: 28px 0 20px; }
    .public-registration-brand { display: flex; align-items: center; justify-content: space-between; margin: 0 4px 16px; }
    .public-registration-shell .brand-wordmark { display: inline-flex; align-items: center; gap: 0; margin: 0; color: #491a2c; font-size: 15px; letter-spacing: .12em; }
    .public-registration-shell .brand-wordmark span { color: #b56783; }
    .public-secure-label { display: inline-flex; align-items: center; gap: 7px; color: #7c7379; font-size: 10px; font-weight: 650; }
    .public-secure-label > span { width: 7px; height: 7px; border-radius: 50%; background: #49a981; box-shadow: 0 0 0 4px rgba(73,169,129,.12); }
    .public-registration-card { overflow: hidden; border: 1px solid rgba(230,222,226,.9); border-radius: 22px; background: rgba(255,255,255,.96); box-shadow: 0 28px 80px rgba(57,35,46,.13); animation: public-card-enter .65s cubic-bezier(.2,.7,.25,1) both; }
    .public-registration-hero { position: relative; display: flex; min-height: 245px; align-items: center; justify-content: space-between; gap: 22px; overflow: hidden; padding: 34px clamp(24px, 6vw, 58px); color: #fff; background: radial-gradient(ellipse at 82% 12%, rgba(255,255,255,.16), transparent 33%), linear-gradient(118deg, #441426 0%, #741e3c 52%, #922c50 100%); }
    .public-registration-hero::before { position: absolute; inset: 0; opacity: .16; background-image: radial-gradient(rgba(255,255,255,.65) .65px, transparent .65px); background-size: 17px 17px; content: ""; mask-image: linear-gradient(90deg, transparent, #000); }
    .public-hero-copy { position: relative; z-index: 1; max-width: 540px; }
    .public-hero-kicker { display: inline-flex; align-items: center; gap: 8px; color: #f1c9d5; font-size: 9px; font-weight: 800; letter-spacing: .17em; }
    .public-hero-kicker span { width: 18px; height: 1px; background: #e7a9bd; }
    .public-hero-copy h1 { margin: 14px 0 10px; color: #fff; font: 800 clamp(27px, 4.3vw, 42px)/1.12 var(--display); letter-spacing: -.05em; }
    .public-hero-copy h1 em { color: #f0bdcd; font-style: normal; }
    .public-hero-copy p { max-width: 470px; margin: 0; color: rgba(255,255,255,.76); font-size: 12px; line-height: 1.7; }
    .public-hero-visual { position: relative; display: grid; width: 215px; height: 175px; flex: 0 0 215px; place-items: center; }
    .public-orbit { position: absolute; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; animation: public-orbit-rotate 18s linear infinite; }
    .public-orbit-one { width: 145px; height: 145px; }
    .public-orbit-two { width: 188px; height: 112px; transform: rotate(-30deg); animation-direction: reverse; animation-duration: 24s; }
    .public-avatar-stack { position: relative; display: flex; align-items: center; padding-left: 16px; animation: public-avatar-float 4s ease-in-out infinite; }
    .public-avatar { display: grid; width: 55px; height: 55px; margin-left: -15px; place-items: center; border: 3px solid rgba(255,255,255,.9); border-radius: 50%; color: #5a1b33; background: linear-gradient(145deg,#fff,#f3dce4); box-shadow: 0 9px 22px rgba(36,7,18,.25); font: 800 17px var(--display); }
    .public-avatar-two { color: #fff; background: linear-gradient(145deg,#d991a9,#a84869); animation-delay: .2s; }
    .public-avatar-three { color: #fff; background: linear-gradient(145deg,#7c9b91,#486b60); animation-delay: .4s; }
    .public-hero-spark { position: absolute; color: #f6d5df; animation: public-sparkle 2.3s ease-in-out infinite; }
    .public-hero-spark-one { top: 21px; right: 24px; font-size: 23px; }
    .public-hero-spark-two { bottom: 27px; left: 27px; color: #e9a9bd; font-size: 18px; animation-delay: .6s; }
    .public-visual-caption { position: absolute; bottom: 5px; color: rgba(255,255,255,.65); font-size: 7px; font-weight: 750; letter-spacing: .2em; }
    .public-registration-content { max-width: 740px; margin: 0 auto; padding: 30px clamp(22px, 5vw, 48px) 25px; }
    .public-form-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
    .public-form-intro .eyebrow { color: #9b6377; font-size: 8px; }
    .public-form-intro h2 { margin: 5px 0 0; color: #362c32; font: 750 19px/1.25 var(--display); letter-spacing: -.035em; }
    .public-step-indicator { display: flex; align-items: center; gap: 6px; padding-bottom: 3px; color: #b5a9af; font-size: 8px; font-weight: 700; }
    .public-step-indicator b { color: #800020; }
    .public-step-indicator i { width: 26px; height: 2px; border-radius: 2px; background: linear-gradient(90deg,#800020 50%,#ece5e8 50%); }
    .public-registration-form { grid-template-columns: 1fr; gap: 13px; margin-top: 0; }
    .public-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px 16px; }
    .public-form-field { display: flex; min-width: 0; flex-direction: column; gap: 6px; }
    .public-form-field .form-label { margin: 0; color: #55464e; font-size: 10px; font-weight: 700; }
    .public-registration-form .form-control,
    .public-registration-form .form-select { min-height: 43px; padding: 10px 12px; border-color: #e8e1e5; border-radius: 9px; color: #433840; background-color: #fff; font-size: 11px; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
    .public-registration-form .form-control:focus,
    .public-registration-form .form-select:focus { border-color: #b56d87; box-shadow: 0 0 0 .2rem rgba(128,0,32,.09)!important; transform: translateY(-1px); }
    .public-registration-form .form-control::placeholder { color: #b5abb0; }
    .public-optional { margin-left: 3px; color: #ada1a7; font-size: 7px; font-weight: 700; letter-spacing: .08em; }
    .public-event-field { margin-bottom: 2px; }
    .public-event-field .form-select { border-color: #ddc2cc; background-color: #fffafb; }
    .public-selected-event { display: flex; align-items: center; gap: 10px; padding: 11px 13px; border: 1px solid #f0e1e7; border-radius: 10px; background: #fdf8fa; animation: public-card-enter .3s ease both; }
    .public-selected-event-icon { display: grid; width: 29px; height: 29px; flex: 0 0 29px; place-items: center; border-radius: 9px; color: #800020; background: #f5e6eb; }
    .public-selected-event > span:last-child { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
    .public-selected-event strong { color: #4d2334; font-size: 10px; }
    .public-selected-event small { overflow: hidden; color: #8c7d84; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
    .public-registration-form .public-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
    .public-registration-form .public-consent { align-items: flex-start; gap: 9px; margin: 3px 0 0; color: #766a70; font-size: 9px; line-height: 1.55; }
    .public-registration-form .public-consent input { width: 15px; height: 15px; flex: 0 0 15px; margin: 1px 0 0; accent-color: #800020; }
    .public-submit-button { display: flex; min-height: 45px; align-items: center; justify-content: center; gap: 10px; margin-top: 3px!important; border: 0; border-radius: 9px; color: #fff; background: linear-gradient(100deg,#72001d,#9e3457); box-shadow: 0 8px 18px rgba(128,0,32,.19); font-size: 11px; transition: transform .2s ease, box-shadow .2s ease; }
    .public-submit-button:hover { transform: translateY(-2px); box-shadow: 0 12px 23px rgba(128,0,32,.25); }
    .public-submit-button b { display: grid; width: 23px; height: 23px; place-items: center; border-radius: 50%; background: rgba(255,255,255,.16); font-size: 14px; transition: transform .2s ease; }
    .public-submit-button:hover b { transform: translateX(3px); }
    .public-form-alert { border: 0; border-radius: 10px; font-size: 11px; }
    .public-footnote { display: flex; align-items: flex-start; gap: 7px; margin: 17px 0 0; padding-top: 13px; border-top: 1px solid #f0ecee; color: #93878d; font-size: 9px; line-height: 1.6; }
    .public-footnote > span { color: #9a5269; font-size: 14px; }
    .public-registration-footer { display: flex; justify-content: space-between; gap: 12px; padding: 15px 4px 0; color: #999097; font-size: 8px; }
    .public-registration-footer span:first-child { color: #704454; font-weight: 800; letter-spacing: .12em; }
    .public-closed-state { display: grid; justify-items: center; padding: 26px 18px; border: 1px solid #f0e8eb; border-radius: 13px; background: #fdfafb; text-align: center; }
    .public-closed-icon { display: grid; width: 43px; height: 43px; margin-bottom: 10px; place-items: center; border-radius: 14px; color: #800020; background: #f5e7ec; font-size: 18px; }
    .public-closed-state strong { color: #47353d; font: 750 15px var(--display); }
    .public-closed-state p { max-width: 360px; margin: 6px 0 10px; color: #83767d; font-size: 10px; line-height: 1.6; }
    .public-closed-state a { color: #800020; font-size: 10px; font-weight: 700; }
    .public-success .kpi-icon { width: 48px; height: 48px; margin: 0 auto 15px; border-radius: 16px; animation: public-success-pop .5s cubic-bezier(.2,.8,.3,1.3) both; }
    @keyframes public-card-enter { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
    @keyframes public-avatar-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
    @keyframes public-sparkle { 0%,100% { opacity: .55; transform: scale(.85) rotate(-8deg); } 50% { opacity: 1; transform: scale(1.12) rotate(8deg); } }
    @keyframes public-orbit-rotate { to { transform: rotate(360deg); } }
    @keyframes public-orbit-drift { to { transform: translate3d(16px,-12px,0) scale(1.05); } }
    @keyframes public-success-pop { from { opacity: 0; transform: scale(.6) rotate(-12deg); } to { opacity: 1; transform: scale(1) rotate(0); } }
    @media (max-width: 680px) {
        .public-registration-shell { width: min(100% - 24px, 560px); padding-top: 16px; }
        .public-registration-hero { min-height: 205px; padding: 26px 21px; }
        .public-hero-copy { max-width: 100%; }
        .public-hero-copy h1 { font-size: clamp(26px,8vw,35px); }
        .public-hero-visual { position: absolute; right: -52px; bottom: -28px; width: 150px; height: 130px; opacity: .42; transform: scale(.8); }
        .public-registration-content { padding: 23px 20px 20px; }
        .public-form-grid { grid-template-columns: 1fr; gap: 11px; }
        .public-registration-footer { flex-direction: column; gap: 4px; }
    }
    @media (max-width: 430px) {
        .public-registration-brand { margin-right: 1px; margin-left: 1px; }
        .public-secure-label { font-size: 8px; }
        .public-registration-hero { min-height: 195px; }
        .public-registration-content { padding-right: 16px; padding-left: 16px; }
        .public-form-intro h2 { font-size: 17px; }
    }
    @media (prefers-reduced-motion: reduce) {
        .public-registration-page::before,
        .public-registration-page::after,
        .public-registration-card,
        .public-orbit,
        .public-avatar-stack,
        .public-hero-spark,
        .public-success .kpi-icon { animation: none!important; }
        .public-registration-form .form-control,
        .public-registration-form .form-select,
        .public-submit-button,
        .public-submit-button b { transition: none!important; }
    }
.logistics-forms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 16px; margin-bottom: 17px; }
.logistics-forms > .panel-card { min-width: 0; }
.logistics-lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 16px; }
.logistics-lists > .panel-card { min-width: 0; }
.logistics-checklist-panel { grid-column: 1 / -1; }
.venue-list, .booking-list, .logistics-item-list { display: flex; flex-direction: column; }
.venue-row, .booking-row, .logistics-item-row { display: flex; align-items: center; gap: 12px; padding: 14px 0; border-top: 1px solid #f0edf0; }
.venue-icon { display: grid; width: 39px; height: 39px; flex: 0 0 39px; place-items: center; border: 1px solid #f0dfe5; border-radius: 11px; color: #800020; background: #fbf1f4; font-size: 18px; }
.venue-copy, .booking-copy, .logistics-item-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 4px; }
.venue-copy strong, .booking-copy strong, .logistics-item-copy strong { color: #38262e; font-size: 11px; font-weight: 750; line-height: 1.4; }
.venue-copy > span, .venue-copy > small, .booking-copy > span, .booking-copy > small, .logistics-item-copy > span, .logistics-item-copy > small { color: #897d83; font-size: 9px; line-height: 1.55; }
.venue-copy > span, .logistics-item-copy > a { overflow: hidden; text-overflow: ellipsis; }
.venue-copy small { display: flex; flex-wrap: wrap; gap: 5px 12px; }
.logistics-meta-chip { padding: 2px 7px; border-radius: 20px; color: #7b2945; background: #f8e9ee; font-size: 8px; font-weight: 650; }
.booking-date { display: flex; width: 43px; height: 46px; flex: 0 0 43px; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #f0dfe5; border-radius: 10px; color: #800020; background: #fdf7f9; }
.booking-date strong { font-family: var(--display); font-size: 14px; line-height: 1; }.booking-date small { margin-top: 3px; font-size: 8px; }
.booking-copy > a, .logistics-item-copy > a { color: #800020; font-size: 9px; font-weight: 650; }
.booking-copy .booking-time { color: #74676d; font-size: 9px; font-variant-numeric: tabular-nums; }
.booking-time b { color: #38262e; font-weight: 700; }
.booking-copy .booking-notes { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.booking-action, .logistics-item-action { display: flex; align-items: flex-end; flex-direction: column; gap: 6px; }
.booking-action { min-width: 103px; }
.booking-action form { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 5px; }
.booking-action .btn { padding: 5px 8px; border-radius: 7px; font-size: 9px; white-space: nowrap; }
.logistics-check { display: grid; width: 21px; height: 21px; flex: 0 0 21px; place-items: center; border: 1px solid #ded4d8; border-radius: 7px; color: #988a90; background: #fff; font-size: 12px; font-weight: 700; }
.logistics-check.checked { border-color: #378568; color: #fff; background: #378568; }
.logistics-item-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; }
.logistics-item-meta > span + span::before { margin-right: 8px; color: #c4b7bc; content: "·"; }
.logistics-checklist-heading > span { display: block; margin-top: 4px; color: #897d83; font-size: 9px; font-weight: 550; }
.logistics-event-group { margin: 14px 0 0; padding: 9px 0 7px; border-top: 1px solid #f0edf0; color: #800020; font: 700 10px var(--display); }
.logistics-event-group a { color: inherit; text-decoration: none; }
.logistics-event-group a:hover { text-decoration: underline; }
.logistics-item-action { min-width: 130px; }
.logistics-status-form { display: flex; align-items: center; gap: 5px; }
.logistics-status-form .form-select { width: 110px; min-width: 0; min-height: 31px; border-color: #eee5e8; border-radius: 7px; font-size: 9px; }
.logistics-status-form .btn { min-height: 31px; padding: 4px 8px; font-size: 9px; white-space: nowrap; }

@media (max-width: 820px) {
    .logistics-lists { grid-template-columns: minmax(0, 1fr); }
    .logistics-checklist-panel { grid-column: auto; }
}

@media (max-width: 600px) {
    .venue-row, .booking-row, .logistics-item-row { align-items: flex-start; gap: 9px; padding: 12px 0; }
    .booking-action, .logistics-item-action { min-width: 0; align-items: flex-start; flex-direction: row; flex-wrap: wrap; }
    .booking-action { flex: 0 0 auto; }
    .booking-action form { flex-basis: 100%; }
    .booking-action form .btn { padding: 4px 6px; }
    .logistics-item-action { grid-column: 2 / -1; margin-left: 30px; }
    .logistics-item-row { display: grid; grid-template-columns: 21px minmax(0, 1fr); }
    .logistics-item-action { grid-column: 2; margin-left: 0; }
    .logistics-item-meta { gap: 3px 7px; }
}

@keyframes rise-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 1120px) {
    .sidebar { width: 225px; }.main-area { margin-left: 225px; }.topbar { padding: 0 27px; }.page-content { padding-right: 27px; padding-left: 27px; }
    .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.event-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.procurement-forms { grid-template-columns: repeat(2, minmax(0, 1fr)); }.vendor-list-card { grid-column: 1 / -1; }
    .report-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.report-filter-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
    .sidebar { width: 248px; transform: translateX(-100%); transition: transform .22s ease; box-shadow: 15px 0 35px rgba(21,25,48,.12); }.sidebar.is-open { transform: translateX(0); }
    .main-area { margin-left: 0; }.topbar { height: 60px; padding: 0 20px; }.mobile-menu-button { display: inline-block; }.breadcrumb-line { margin-right: auto; margin-left: 11px; }.topbar-date, .topbar-divider { display: none; }
    .page-content { padding: 27px 20px 18px; }.dashboard-grid, .detail-grid { grid-template-columns: 1fr; }
    .auth-shell { grid-template-columns: minmax(300px, .8fr) minmax(380px, 1.2fr); }.auth-aside { padding-right: 8%; padding-left: 8%; }.auth-panel { padding: 30px; }
    .team-grid, .module-grid, .risk-overview, .meeting-grid { grid-template-columns: 1fr; }.module-form-card, .risk-form-card { position: static; }.procurement-forms { grid-template-columns: repeat(2, minmax(0, 1fr)); }.vendor-list-card { grid-column: 1 / -1; }
    .risk-row { grid-template-columns: 43px minmax(0, 1fr); }.risk-row > .risk-status { grid-column: 2; }
    .evaluation-rating-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.report-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .topbar { padding: 0 13px; }.page-content { padding: 22px 13px 15px; }.breadcrumb-line { gap: 7px; font-size: 10px; }.topbar-actions { gap: 8px; }
    .welcome-row { align-items: flex-start; }.welcome-row h1 { font-size: 23px; }.page-subtitle { max-width: 440px; font-size: 11px; }.action-button { padding: 9px 10px; font-size: 11px; }
    .kpi-grid { gap: 9px; }.kpi-card { padding: 12px; }.kpi-heading { font-size: 9px; }.kpi-icon { width: 25px; height: 25px; flex-basis: 25px; }.kpi-number { font-size: 23px; }.currency-number { font-size: 16px; }.kpi-foot { font-size: 8px; }
    .panel-card { padding: 15px; }.dashboard-grid { gap: 11px; }.event-row { gap: 8px; }.event-progress { display: none; }.event-row .status-badge { max-width: 90px; overflow: hidden; font-size: 8px; text-overflow: ellipsis; }
    .event-overview-grid { gap: 7px; margin-top: 0; }.event-overview-card { justify-content: center; gap: 0; padding: 10px 7px; }.event-overview-icon { display: none; }.event-overview-card > div { grid-template-columns: 1fr; gap: 0; text-align: center; }.event-overview-card > div > span { font-size: 9px; }.event-overview-card strong { font-size: 19px; }.event-overview-card small { font-size: 8px; white-space: normal; }.event-card-grid { grid-template-columns: 1fr; }.event-card-main { padding-right: 15px; padding-left: 15px; }.filter-toolbar { align-items: flex-start; flex-direction: column; }.filter-form { width: 100%; flex-wrap: wrap; }.search-field { max-width: none; min-width: 100%; }.filter-select { max-width: none; flex: 1; }.filter-button { flex: 0 0 auto; }.result-count { align-self: flex-end; }.detail-heading-actions { justify-content: flex-start; }
    .form-panel { padding: 17px; }.form-actions { justify-content: stretch; }.form-actions .btn { flex: 1; }.detail-facts { gap: 14px; }.detail-status { margin-top: 4px; }
    .page-footer { gap: 10px; font-size: 8px; }.page-footer span:last-child { text-align: right; }.auth-shell { display: block; }.auth-aside { display: none; }.auth-panel { min-height: 100vh; padding: 28px 23px; }.auth-mobile-brand { display: block; }.auth-form-wrap h2 { font-size: 25px; }
    .team-member-row { gap: 7px; }.team-last-active { display: none; }.role-chip { padding: 4px 6px; font-size: 7px; }
    .finance-forms, .procurement-forms, .meeting-forms { grid-template-columns: 1fr; }.vendor-list-card { grid-column: auto; }.risk-row { grid-template-columns: 38px minmax(0, 1fr); }.risk-row > .risk-status { grid-column: 2; }.risk-foot { flex-direction: column; }.action-row { flex-wrap: wrap; }.action-row > .risk-status { flex: 1 0 calc(100% - 31px); margin-left: 31px; }    .action-row > .risk-status form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }.action-row > .risk-status form[data-meeting-action-status] { grid-template-columns: minmax(0, 1fr); gap: 0; }.action-row > .risk-status .status-select { width: 100%; max-width: none; }.milestone-row { grid-template-columns: 12px minmax(0, 1fr); }.milestone-side { grid-column: 2; width: 100%; flex-direction: column; align-items: stretch; }.milestone-progress { width: 100%; min-width: 0; }
    .meetings-calendar-card { padding: 15px; }
    .meeting-calendar-toolbar { align-items: flex-start; flex-direction: column; }
    .meeting-calendar-controls { width: 100%; justify-content: space-between; gap: 6px; }
    .meeting-calendar-controls .calendar-view-switch button,
    .meeting-calendar-controls .calendar-date-controls button { min-height: 34px; padding: 0 8px; font-size: 11px; }
    .meeting-calendar-grid, .meeting-calendar-week-heading, .meeting-calendar-week-row { min-width: 760px; }
    .meeting-calendar-day { min-height: 120px; padding: 5px; }
    .meeting-calendar-item { padding: 5px; }
    .meeting-calendar-item strong { font-size: 9px; }
    .meeting-detail-modal .modal-header,
    .meeting-detail-modal .modal-body { padding-right: 18px; padding-left: 18px; }
    .meeting-edit-grid { grid-template-columns: minmax(0, 1fr); }
    .meeting-edit-field-wide { grid-column: auto; }
    .meeting-mom-heading { align-items: flex-start; flex-direction: column; }
    .meeting-action-edit-row { grid-template-columns: minmax(0, 1fr) 34px; gap: 9px; }
    .meeting-action-edit-row .meeting-action-edit-title { grid-column: 1 / -1; }
    .meeting-action-edit-row label:not(.meeting-action-edit-title) { grid-column: 1; }
    .meeting-action-edit-row .meeting-action-remove { grid-column: 2; grid-row: 2 / span 3; align-self: center; }
    .meeting-action-panel { padding: 15px; }
    .meeting-action-mom { align-items: stretch; flex-direction: column; gap: 10px; }
    .meeting-action-mom-button { align-self: flex-start; }
    .document-row { align-items: flex-start; flex-wrap: wrap; }.document-copy { flex-basis: calc(100% - 50px); }.document-actions { width: 100%; flex-direction: row; align-items: center; justify-content: flex-end; }
    .program-forms, .program-workspace { grid-template-columns: 1fr; }.program-row { grid-template-columns: 42px 9px minmax(0, 1fr); }.program-status-form { grid-column: 3; flex-direction: row; justify-content: flex-start; }
    .participant-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }.participant-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }.participant-filter input { grid-column: 1 / -1; }
    .logistics-forms, .logistics-lists { grid-template-columns: 1fr; }
    .heading-actions { width: 100%; }.heading-actions .btn { flex: 1; }.evaluation-event-heading { align-items: flex-start; flex-direction: column; }.evaluation-rating-grid, .evaluation-text-grid, .report-summary-grid, .report-filter-form { grid-template-columns: 1fr; }.report-filter-form > .btn { width: 100%; }.print-report-page { padding: 14px; }.print-report-toolbar { gap: 12px; }.print-report-table { min-width: 800px; }.print-report { overflow-x: auto; }
}
@media print {
    @page { size: landscape; margin: 12mm; }
    body.print-report-page { min-height: 0; padding: 0; background: #fff; font-size: 9pt; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .print-report { max-width: none; overflow: visible; }
    .print-report-toolbar { display: none; }
    .print-report-heading { margin-bottom: 12px; }
    .print-report-heading h1 { font-size: 19pt; }
    .print-report-summary { gap: 7px; margin: 12px 0; }
    .print-report-summary > div { padding: 8px; }
    .print-report-table { width: 100%; min-width: 0; font-size: 8pt; }
    .print-report-table th, .print-report-table td { padding: 5px 4px; }
    .print-report-table thead { display: table-header-group; }
    .print-report-table tr { break-inside: avoid; }
}
.public-page {
    min-height: 100vh;
    background: linear-gradient(145deg, #f4f6fb 0%, #eef2f8 50%, #f8f9fc 100%);
    color: #18233b;
}

.public-shell {
    width: min(100% - 32px, 760px);
    margin: 0 auto;
    padding: 40px 0;
}

.public-shell > .brand-wordmark {
    display: block;
    margin: 0 auto 24px;
    color: #273b69;
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-align: center;
    text-decoration: none;
}

.public-card {
    padding: clamp(24px, 5vw, 48px);
    border: 1px solid #e3e8f1;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 60px rgba(27, 43, 77, .09);
}

.public-card h1 {
    margin: 8px 0 12px;
    color: #18233b;
    font-size: clamp(1.7rem, 4vw, 2.35rem);
    letter-spacing: -.035em;
}

.public-form {
    display: grid;
    gap: 12px;
    margin-top: 26px;
}

.public-form .form-label {
    margin: 4px 0 -6px;
    font-weight: 650;
}

.public-form .btn {
    margin-top: 10px;
}

.public-consent {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-top: 8px;
    color: #59667d;
    font-size: .9rem;
}

.public-consent input {
    margin-top: 4px;
}

.public-footnote {
    margin: 24px 0 0;
    color: #738097;
    font-size: .82rem;
    line-height: 1.55;
}

.public-shell footer {
    padding: 24px 0;
    color: #8791a3;
    font-size: .8rem;
    text-align: center;
}

.public-success {
    text-align: center;
}

.public-honeypot {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.public-form-share {
    display: grid;
    grid-template-columns: 38px minmax(170px, .85fr) minmax(220px, 1.35fr) auto auto auto;
    align-items: center;
    gap: 10px;
    margin: 15px 0 0;
    padding: 11px 13px;
    border: 1px solid #eee1e6;
    border-radius: 12px;
    background: linear-gradient(110deg, #fffafa, #fff 72%);
}
.public-form-share.is-disabled { grid-template-columns: 38px minmax(0,1fr) auto; }

.public-form-share-icon {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid #f0dfe5;
    border-radius: 10px;
    color: #800020;
    background: #f9edf1;
    font-size: 17px;
}

.public-form-share-copy { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.public-form-share-copy strong { color: #46303a; font-size: 10px; }
.public-form-share-copy small { color: #91858b; font-size: 9px; }
.public-form-share-input { min-height: 37px; background: #fff; font-size: 10px; }
.public-form-share .btn { min-height: 37px; white-space: nowrap; }
.public-form-share .is-copied { border-color: #267b61; background: #267b61; }
.public-form-share-toggle { margin: 0; }
.public-form-share-toggle label { display: flex; align-items: center; gap: 7px; color: #55434a; font-size: 10px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.public-form-share-toggle input { width: 17px; height: 17px; margin: 0; accent-color: #800020; cursor: pointer; }

@media (max-width: 1020px) {
    .public-form-share { grid-template-columns: 38px minmax(0,1fr) auto; }
    .public-form-share-copy { grid-column: 2; }
    .public-form-share-input { grid-column: 1 / -1; }
    .public-form-share-open { grid-column: 2; grid-row: 3; }
    .public-form-share-copy-button { grid-column: 3; grid-row: 3; }
    .public-form-share-toggle { grid-column: 3; grid-row: 1; }
    .public-form-share.is-disabled .public-form-share-toggle { grid-row: 1; }
}

@media (max-width: 680px) {
    .public-form-share { grid-template-columns: 36px minmax(0,1fr) auto; gap: 8px; }
    .public-form-share-input { grid-column: 1 / -1; }
    .public-form-share-open { grid-column: 2; grid-row: auto; }
    .public-form-share-copy-button { grid-column: 3; grid-row: auto; }
    .public-form-share-toggle { grid-column: 3; grid-row: 1; }
    .public-form-share-toggle label { font-size: 9px; }
}

.sponsor-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.sponsor-contribution-edit { margin-top: 6px; }
.sponsor-contribution-edit > summary { width: fit-content; color: #66558b; font-size: 9px; font-weight: 650; cursor: pointer; }
.sponsor-contribution-edit > form { display: grid; width: min(220px, 60vw); gap: 6px; margin-top: 7px; padding: 9px; border: 1px solid #e8e4ef; border-radius: 9px; background: #fcfbfd; }
.sponsor-contribution-edit .form-label { margin: 0; color: #747887; font-size: 9px; }
.sponsor-contribution-edit .form-control { min-height: 32px; font-size: 10px; }
.sponsor-contribution-edit .btn { justify-self: start; font-size: 9px; }
.sponsor-receive-form { display: grid; gap: 4px; margin-top: 8px; }
.sponsor-receive-form > label { color: #6e8177; font-size: 8px; font-weight: 650; }
.sponsor-receive-form > div { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.sponsor-receive-form input { max-width: 145px; min-height: 30px; padding: 4px 6px; border: 1px solid #dce8df; border-radius: 6px; color: #68756d; background: #fff; font-size: 9px; }
.sponsor-receive-form .btn { font-size: 8px; white-space: nowrap; }
.sponsor-receive-form > small, .sponsor-received-note { display: block; margin-top: 4px; color: #63866e; font-size: 8px; line-height: 1.45; }
.sponsor-receive-form > small { color: #9a8b70; }
.sponsor-received-note { color: #328065; font-weight: 600; }
.sponsor-receive-hint { display: block; margin-top: 5px; color: #9a8b70; font-size: 8px; line-height: 1.45; }
.sponsor-edit-form { display: grid; width: min(390px, 72vw); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; border: 1px solid #e8e4ef; border-radius: 9px; background: #fcfbfd; }
.sponsor-edit-form .form-label { margin-bottom: 3px; color: #747887; font-size: 8px; }
.sponsor-edit-form .form-control, .sponsor-edit-form .form-select { min-height: 31px; padding: 5px 7px; font-size: 9px; }
.sponsor-edit-form [hidden] { display: none!important; }
.sponsor-edit-form .sponsor-notes, .sponsor-edit-warning, .sponsor-edit-form > .btn { grid-column: 1 / -1; }
.sponsor-edit-warning { display: block; color: #967444; font-size: 8px; line-height: 1.5; }
.sponsor-pipeline-table .sponsor-status-chip { gap: 7px; padding: 6px 10px; border: 1px solid transparent; border-radius: 999px; font-size: 9px; font-weight: 700; letter-spacing: .01em; box-shadow: 0 2px 5px rgba(50, 50, 70, .045); }
.sponsor-status-current-label { display: block; margin: 0 0 6px 2px; color: #858b9b; font-size: 8px; font-weight: 650; }
.sponsor-status-form { display: grid; justify-items: start; gap: 5px; margin-top: 10px; }
.sponsor-status-action-label { color: #858b9b; font-size: 8px; font-weight: 650; }
.sponsor-status-form .form-select { min-width: 145px; min-height: 34px; border-color: #e7e5ef; border-radius: 8px; color: #59546d; background-color: #fff; font-size: 9px; }
.sponsor-status-saving { min-height: 12px; color: #827a91; font-size: 8px; }
.sponsor-status-dot { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 3px rgba(255, 255, 255, .75); }
.sponsor-stage-prospecting { border-color: #e7eaf0!important; background: linear-gradient(135deg, #f7f8fb, #eef0f5)!important; color: #657184!important; }
.sponsor-stage-contacted { border-color: #f0dfc4!important; background: linear-gradient(135deg, #fff9ed, #fff0d8)!important; color: #9b6b2d!important; }
.sponsor-stage-negotiation { border-color: #e2d8f6!important; background: linear-gradient(135deg, #f7f2ff, #eee7fb)!important; color: #7054a3!important; }
.sponsor-stage-committed { border-color: #d7e4fb!important; background: linear-gradient(135deg, #f1f6ff, #e5efff)!important; color: #4e6fa9!important; }
.sponsor-stage-fulfilled { border-color: #d4eadf!important; background: linear-gradient(135deg, #effaf4, #e2f4eb)!important; color: #2f8061!important; }
.sponsor-stage-declined { border-color: #f0d9dc!important; background: linear-gradient(135deg, #fff5f6, #fbe9eb)!important; color: #a54f5b!important; }
.sponsor-row-actions { min-width: 130px; }
.sponsor-edit-trigger { display: inline-flex; align-items: center; gap: 5px; border-radius: 8px; font-size: 9px; font-weight: 650; white-space: nowrap; }
.sponsor-row-actions > form { margin-top: 4px; }
.sponsor-row-actions > form .btn, .sponsor-row-actions > button { font-size: 8px; }
.sponsor-deliverable-empty { color: #969cac; font-size: 9px; }
.sponsor-edit-modal .modal-content { overflow: hidden; border: 1px solid rgba(86, 64, 124, .12); border-radius: 17px; box-shadow: 0 25px 80px rgba(33, 25, 48, .24); }
.sponsor-edit-modal .modal-header { padding: 17px 20px; border-bottom-color: #f0edf4; background: linear-gradient(120deg, #fff, #faf8fd); }
.sponsor-edit-modal .modal-title { color: #39364a; font-family: var(--display); font-size: 17px; font-weight: 750; }
.sponsor-edit-modal .modal-body { padding: 17px 20px; }
.sponsor-edit-modal .sponsor-edit-form { width: 100%; padding: 0; border: 0; background: transparent; }
.sponsor-edit-modal .sponsor-edit-form .form-label { font-size: 9px; }
.sponsor-edit-modal .sponsor-edit-form .form-control, .sponsor-edit-modal .sponsor-edit-form .form-select { min-height: 37px; font-size: 11px; }
.sponsor-edit-modal .modal-footer { border-top-color: #f0edf4; background: #fcfbfd; }
.sponsor-notes {
    grid-column: 1 / -1;
}

.checkin-card {
    max-width: 720px;
}

.ticket-input {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 1.25rem;
    letter-spacing: .12em;
}

.checkin-person {
    margin-top: 28px;
    padding: 24px;
    border-radius: 16px;
    background: #f5f7fb;
}

.badge-page {
    min-height: 100vh;
    padding: 28px;
    background: #f2f4f8;
}

.badge-toolbar {
    display: flex;
    justify-content: space-between;
    max-width: 680px;
    margin: 0 auto 20px;
}

.printable-badge {
    display: flex;
    min-height: 680px;
    max-width: 680px;
    margin: auto;
    padding: 42px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    border: 1px solid #e2e7ef;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 50px rgba(27, 43, 77, .1);
    text-align: center;
}

.printable-badge h1 {
    margin: 0;
    font-size: 2.2rem;
}

.badge-qr {
    display: grid;
    min-width: 210px;
    min-height: 210px;
    margin: 8px 0;
    place-items: center;
}

.printable-badge small {
    max-width: 320px;
    color: #68758b;
}

@media (max-width: 640px) {
    .sponsor-form {
        grid-template-columns: 1fr;
    }
    .sponsor-edit-form {
        width: min(310px, 68vw);
        grid-template-columns: 1fr;
    }
    .sponsor-edit-form .sponsor-notes, .sponsor-edit-warning, .sponsor-edit-form > .btn {
        grid-column: auto;
    }

    .sponsor-notes {
        grid-column: auto;
    }

    .badge-page {
        padding: 12px;
    }

    .printable-badge {
        min-height: 80vh;
        padding: 24px;
    }
}

body {
    font-size: 16px;
}

.sidebar .brand-mark,
.auth-page .brand-mark {
    background: linear-gradient(145deg, #a1264b, #69001d);
    box-shadow: 0 5px 13px rgba(128, 0, 32, .24);
}

.workspace-avatar,
.profile-avatar,
.topbar-avatar {
    background: #800020;
}

.nav-item.active {
    background: linear-gradient(90deg, rgba(128, 0, 32, .36), rgba(128, 0, 32, .14));
    box-shadow: inset 2px 0 #ed9db5;
}

.nav-item.active .nav-icon,
.nav-count {
    color: #f6cad6;
}

.nav-count {
    background: rgba(204, 74, 112, .24);
}

.form-control:focus,
.form-select:focus {
    border-color: #ad526e;
}

.btn-primary {
    box-shadow: 0 4px 10px rgba(128, 0, 32, .16);
}

.btn-outline-primary {
    border-color: #e7c3ce;
}

.kpi-icon.lavender,
.event-symbol,
.panel-icon,
.empty-icon,
.document-icon {
    color: #800020;
    background: #f8e9ee;
}

.kpi-progress span,
.progress-line i,
.report-progress span {
    background: #800020;
}

.text-link,
.table-link,
.document-copy span a,
.program-title-row > a,
.breadcrumb-link,
.print-report-toolbar a {
    color: #800020;
}

.text-link:hover,
.breadcrumb-link:hover {
    color: #5f0018;
}

.status-primary,
.status-select.status-primary {
    color: #76001d;
    background-color: #f8e9ee;
}

.status-save {
    border-color: #e7c3ce;
    color: #800020;
}

.status-save:hover {
    background: #f8e9ee;
}

.program-time strong {
    color: #76001d;
}

.program-marker {
    border-color: #9b3454;
    background: #f8e9ee;
    box-shadow: 0 0 0 3px #fbf2f5;
}

.auth-aside {
    background:
        radial-gradient(ellipse at 75% 85%, rgba(128, 0, 32, .44), transparent 43%),
        radial-gradient(ellipse at 5% 10%, rgba(91, 22, 46, .54), transparent 42%),
        linear-gradient(145deg, #461526, #2d101c 72%);
}

.auth-message .eyebrow {
    color: #e7a5b8;
}

.auth-message h1 em {
    color: #f0b6c6;
}

.auth-mobile-brand {
    color: #800020;
}

.public-page {
    background: linear-gradient(145deg, #fbf4f6 0%, #f5e9ed 50%, #fcf9fa 100%);
}

.public-shell > .brand-wordmark {
    color: #650019;
}

.public-card {
    border-color: #ead9df;
}

.public-card h1 {
    color: #441322;
}

.printable-badge .brand-wordmark {
    color: #800020;
}

.nav-item {
    font-size: 13px;
}

.nav-label { font-size: 13px; }

.nav-desc { font-size: 10.5px; }

.nav-section-label { font-size: 10.5px; }

.workspace-copy strong,
.profile-copy strong {
    font-size: 13px;
}

.workspace-copy small,
.profile-copy small {
    font-size: 11px;
}

.page-subtitle {
    font-size: 14px;
}

.eyebrow {
    font-size: 11px;
}

.btn {
    font-size: 14px;
}

.form-control,
.form-select {
    font-size: 14px;
}

.form-label {
    font-size: 13px;
}

.form-hint {
    font-size: 12px;
}

.invalid-feedback {
    font-size: 12px;
}

.kpi-heading {
    font-size: 12px;
}

.kpi-number {
    font-size: clamp(25px, 2.6vw, 32px);
}

.kpi-foot {
    font-size: 11px;
}

.panel-heading h2,
.form-section-title h2 {
    font-size: 17px;
}

.text-link {
    font-size: 13px;
}

.event-info strong,
.document-copy strong {
    font-size: 13px;
}

.event-info small,
.document-copy span,
.document-copy small {
    font-size: 11px;
}

.status-badge {
    font-size: 11px;
}

.task-table,
.report-table {
    font-size: 13px;
}

.task-table thead th {
    font-size: 10px;
}

.auth-message p {
    font-size: 15px;
}

.auth-form-wrap h2 {
    font-size: 30px;
}

.auth-subtitle {
    font-size: 14px;
}

.auth-form .form-label {
    font-size: 14px;
}

.auth-submit {
    font-size: 15px;
}

.auth-security {
    font-size: 12px;
}

.alert {
    font-size: 14px;
}

.error-card p:not(.eyebrow),
.empty-state p {
    font-size: 14px;
}

.print-report-page {
    font-size: 13px;
}

.main-area :is(p, a, button, label, input, select, textarea, td, th, li, small) {
    font-size: max(13px, .86em) !important;
}

.main-area :is(.event-meta, .event-card-bottom, .kpi-heading, .kpi-foot, .result-count, .event-code, .milestone-copy, .team-member-copy, .module-empty-copy, .form-hint, .evaluation-meta) {
    font-size: max(12px, .86em) !important;
}

.auth-page :is(p, label, input, button, small) {
    font-size: max(13px, .9em) !important;
}

.public-page :is(p, label, input, select, button, small) {
    font-size: max(14px, .9em) !important;
}

.team-member-avatar,
.vendor-avatar {
    color: #800020;
    background: #f8e9ee;
}

.milestone-event,
.risk-event-link,
.event-card-bottom b,
.team-member-copy strong {
    color: #800020;
}

.milestone-timeline-mark {
    border-color: #ad526e;
}

.document-icon {
    color: #800020;
    background: #f8e9ee;
}

.search-field:focus-within {
    border-color: #ad526e;
}

@media (max-width: 640px) {
    .nav-item {
        font-size: 14px;
    }

    .nav-label {
        font-size: 14px;
    }

    .nav-desc {
        display: none;
    }
}

@media print {
    body.badge-page {
        min-height: 0;
        padding: 0;
        background: #fff;
    }

    .badge-toolbar {
        display: none;
    }

    .printable-badge {
        min-height: 95vh;
        max-width: none;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        break-inside: avoid;
    }
}

.crud-modal .modal-dialog {
    max-width: 760px;
}

.crud-modal .modal-content {
    overflow: hidden;
    border: 1px solid rgba(74, 18, 37, .12);
    border-radius: 18px;
    box-shadow: 0 24px 80px rgba(32, 10, 20, .25);
}

.crud-modal .modal-header {
    align-items: flex-start;
    padding: 23px 26px 18px;
    border-bottom-color: #f0e6e9;
    background: linear-gradient(135deg, #fff 0%, #fbf5f7 100%);
}

.crud-modal .modal-header .eyebrow {
    margin-bottom: 5px;
    color: var(--purple);
}

.crud-modal .modal-title {
    margin: 0;
    color: #35121f;
    font: 750 21px var(--display);
}

.crud-modal .modal-body {
    padding: 24px 26px;
}

.crud-modal .modal-body > .form-panel {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.crud-modal .modal-body > .form-panel > .form-section-title:first-child {
    display: none;
}

.crud-modal .modal-footer {
    padding: 15px 26px;
    border-top-color: #f0e6e9;
    background: #fdfbfc;
}

.crud-modal .modal-footer [data-bs-dismiss="modal"] {
    min-width: 100px;
}

.crud-modal .form-label {
    margin-bottom: 6px;
    color: #4e2735;
    font-weight: 600;
}

.crud-modal .form-control,
.crud-modal .form-select {
    min-height: 43px;
    border-color: #e7dce0;
    border-radius: 9px;
}

.crud-modal .form-control:focus,
.crud-modal .form-select:focus {
    border-color: #ad526e;
    box-shadow: 0 0 0 .2rem rgba(128, 0, 32, .12);
}

.crud-modal .form-actions {
    margin-top: 22px;
}

.task-detail-modal .modal-dialog {
    max-width: 820px;
}

.task-detail-modal .modal-content {
    overflow: hidden;
    border: 1px solid rgba(74, 18, 37, .12);
    border-radius: 20px;
    box-shadow: 0 28px 90px rgba(32, 10, 20, .3);
}

.task-detail-modal .modal-header {
    align-items: flex-start;
    padding: 25px 28px 20px;
    border-bottom: 1px solid #f0e6e9;
    background: radial-gradient(circle at 100% 0, rgba(139, 41, 71, .1), transparent 42%), linear-gradient(135deg, #fff 0%, #fbf5f7 100%);
}

.task-detail-heading {
    min-width: 0;
}

.task-detail-heading .eyebrow {
    margin-bottom: 7px;
    color: var(--purple);
    letter-spacing: .12em;
}

.task-detail-modal .modal-title {
    max-width: 680px;
    overflow-wrap: anywhere;
    color: #35121f;
    font: 750 24px/1.2 var(--display);
}

.task-detail-context {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
    color: #76646d;
    font-size: 12px;
}

.task-detail-context [hidden] {
    display: none;
}

.task-detail-modal .modal-body {
    padding: 24px 28px 27px;
}

.task-detail-overview {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 24px;
}

.task-detail-overview > div {
    display: flex;
    min-width: 0;
    min-height: 70px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 7px;
    padding: 11px 13px;
    border: 1px solid #f0e7ea;
    border-radius: 12px;
    background: #fdfafb;
}

.task-detail-overview-label {
    color: #99868e;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .09em;
}

.task-detail-overview strong {
    max-width: 100%;
    overflow: hidden;
    color: #492936;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-detail-overview strong.is-completed-late {
    color: #b42318;
}

.task-edit-section-title {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    color: #492936;
    font-size: 14px;
    font-weight: 750;
}

.task-edit-section-title small {
    color: #99868e;
    font-size: 11px;
    font-weight: 500;
}

.task-edit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px 16px;
}

.task-edit-field {
    min-width: 0;
}

.task-edit-field-wide {
    grid-column: 1 / -1;
}

.task-detail-modal .form-label {
    margin-bottom: 6px;
    color: #5c3b47;
    font-size: 12px;
    font-weight: 650;
}

.task-detail-modal .form-control,
.task-detail-modal .form-select {
    min-height: 43px;
    border-color: #e8dfe2;
    border-radius: 10px;
    color: #442b35;
    font-size: 13px;
    box-shadow: 0 1px 2px rgba(40, 12, 23, .025);
}

.task-detail-modal textarea.form-control {
    min-height: 86px;
    resize: vertical;
}

.task-completion-hint {
    display: block;
    margin-top: 5px;
    color: #8a737c;
    font-size: 10px;
    line-height: 1.4;
}

.task-detail-modal .form-control:focus,
.task-detail-modal .form-select:focus {
    border-color: #ad526e;
    box-shadow: 0 0 0 .2rem rgba(128, 0, 32, .11);
}

.task-edit-feedback {
    margin-bottom: 16px;
    border-radius: 10px;
    font-size: 13px;
}

.task-edit-readonly {
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid #ece4d4;
    border-radius: 10px;
    color: #765c2e;
    background: #fffaf0;
    font-size: 12px;
}

.task-edit-actions {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    margin-top: 23px;
    padding-top: 17px;
    border-top: 1px solid #f0e7ea;
}

.task-edit-actions .btn {
    min-height: 42px;
    padding: 9px 17px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 650;
}

.page-heading-row > .action-button[aria-busy="true"] {
    opacity: .7;
    pointer-events: none;
}

.page-heading-row {
    flex-wrap: wrap;
}

.team-grid[data-has-crud-modal="true"] {
    grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 600px) {
    .crud-modal .modal-dialog {
        margin: 10px;
    }

    .crud-modal .modal-header,
    .crud-modal .modal-body {
        padding-right: 18px;
        padding-left: 18px;
    }

    .crud-modal .modal-title {
        font-size: 19px;
    }

    .task-detail-modal .modal-header,
    .task-detail-modal .modal-body {
        padding-right: 18px;
        padding-left: 18px;
    }

    .task-detail-overview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .task-detail-modal .modal-title {
        font-size: 20px;
    }

    .task-edit-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .task-edit-field-wide {
        grid-column: auto;
    }

    .task-edit-section-title {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }
}

.planning-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 20px;
}

.planning-tab-button {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 13px 15px;
    border: 1px solid #efe3e8;
    border-radius: 13px;
    color: #6d5c64;
    background: #fff;
    text-align: left;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}

.planning-tab-button:hover {
    border-color: #ddc2cd;
    box-shadow: 0 8px 22px rgba(53, 18, 31, .08);
    transform: translateY(-1px);
}

.planning-tab-button.active {
    border-color: #d3aebc;
    background: linear-gradient(135deg, #fff 0%, #fdf5f7 100%);
    box-shadow: 0 10px 26px rgba(128, 0, 32, .12);
}

.planning-tab-button:focus-visible {
    outline: 3px solid rgba(128, 0, 32, .18);
    outline-offset: 2px;
}

.planning-tab-button .workspace-tab-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
}

.planning-tab-button .workspace-tab-icon svg {
    width: 18px;
    height: 18px;
}

.planning-tab-button.active .workspace-tab-icon {
    color: #fff;
    background: linear-gradient(140deg, #a1264b, #69001d);
    box-shadow: 0 5px 12px rgba(128, 0, 32, .28);
}

.planning-tab-count {
    display: inline-grid;
    min-width: 21px;
    height: 21px;
    flex: 0 0 auto;
    place-items: center;
    padding: 0 5px;
    border-radius: 999px;
    color: #765a66;
    background: #f1eaed;
    font-size: 10px;
    font-weight: 750;
}

.planning-tab-button.active .planning-tab-count {
    color: #68122f;
    background: #f8e9ef;
}

.planning-tab-button .workspace-tab-copy {
    flex: 1;
}

.planning-tab-button.active .workspace-tab-label {
    color: #68122f;
}

@media (max-width: 1120px) {
    .planning-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .planning-tab-button:last-child { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
    .planning-tabs { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .planning-tab-button:last-child { grid-column: auto; }
    .planning-tab-button { padding: 11px 13px; }
    .planning-tab-button .workspace-tab-summary { white-space: normal; }
}

.planning-tab-panel[hidden] {
    display: none !important;
}

.workspace-tab-panel[hidden] {
    display: none !important;
}

.workspace-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 16px;
    padding: 13px 16px;
    border: 1px solid #eee5e8;
    border-radius: 13px;
    background: linear-gradient(110deg, #fff 0%, #fbf7f8 100%);
}

.workspace-event-context {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
}

.workspace-context-icon {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border-radius: 10px;
    color: #7f2442;
    background: #f7eaf0;
}

.workspace-event-context > span:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.workspace-event-context strong {
    color: #492936;
    font-size: 12px;
}

.workspace-event-context small {
    color: #94828a;
    font-size: 10px;
}

.workspace-event-filter {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 8px;
}

.workspace-event-filter .form-select {
    width: min(310px, 34vw);
    min-width: 180px;
    min-height: 38px;
    border-color: #e7dce0;
    border-radius: 9px;
    color: #4e2735;
    font-size: 12px;
}

.workspace-event-filter .btn {
    min-height: 38px;
    border-radius: 9px;
    font-size: 12px;
}

.workspace-tab-panels {
    min-width: 0;
}

.workspace-panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 15px;
}

.workspace-panel-heading h2 {
    margin: 0;
    color: #35121f;
    font: 750 20px var(--display);
}

.workspace-panel-heading p {
    margin: 5px 0 0;
    color: #82727a;
    font-size: 11px;
}

.workspace-panel-actions {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.workspace-panel-actions:empty {
    display: none;
}

.workspace-panel-actions .action-button,
.workspace-panel-actions .btn {
    margin: 0;
    white-space: nowrap;
}

.planning-tab-section-heading,
.tasks-tab-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 3px 0 18px;
}

.planning-tab-section-heading h2,
.tasks-tab-heading h2 {
    margin: 0;
    color: #35121f;
    font: 750 21px var(--display);
}

.planning-tab-section-heading p,
.tasks-tab-heading p {
    margin: 5px 0 0;
    color: #82727a;
    font-size: 12px;
}

.tasks-tab-heading .action-button {
    flex: 0 0 auto;
}

.planning-calendar {
    margin-bottom: 20px;
    padding: 22px 24px 20px;
}

.planning-calendar-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.planning-calendar-toolbar h2 {
    margin: 5px 0 0;
    color: #35121f;
    font: 750 21px var(--display);
    text-transform: capitalize;
}

.planning-calendar-controls,
.calendar-date-controls,
.calendar-view-switch {
    display: flex;
    align-items: center;
    gap: 7px;
}

.calendar-view-switch {
    padding: 4px;
    border: 1px solid #eee2e6;
    border-radius: 9px;
    background: #fbf8f9;
}

.calendar-view-switch button,
.calendar-date-controls button {
    min-height: 36px;
    padding: 0 11px;
    border: 0;
    border-radius: 7px;
    color: #68535b;
    background: transparent;
    font: 600 13px var(--sans);
}

.calendar-view-switch button[aria-pressed="true"] {
    color: #fff;
    background: var(--purple);
    box-shadow: 0 3px 9px rgba(128, 0, 32, .2);
}

.calendar-date-controls {
    gap: 4px;
}

.calendar-date-controls .calendar-today {
    margin-right: 3px;
    border: 1px solid #e9dce1;
    color: #5c2538;
    background: #fff;
}

.calendar-date-controls .calendar-arrow {
    width: 36px;
    padding: 0;
    border: 1px solid #eee2e6;
    color: #5c2538;
    background: #fff;
    font-size: 22px;
    line-height: 1;
}

.calendar-view-switch button:hover,
.calendar-date-controls button:hover {
    border-color: #d7b8c3;
    background-color: #f8eff2;
    color: #650019;
}

.calendar-view-switch button[aria-pressed="true"]:hover {
    border-color: var(--purple-dark);
    color: #fff;
    background: var(--purple-dark);
}

.calendar-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 17px;
    margin: 18px 0 14px;
    color: #77717a;
    font-size: 12px;
}

.calendar-legend > span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.calendar-status-symbol {
    display: inline-grid;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    place-items: center;
    border-radius: 6px;
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
}

.calendar-status-symbol.status-success {
    color: #267b61;
    background: #eaf6f0;
}

.calendar-status-symbol.status-primary {
    color: #5a50b4;
    background: #efedff;
}

.calendar-status-symbol.status-danger {
    color: #bb5059;
    background: #fff0f0;
}

.calendar-status-symbol.status-secondary {
    color: #747c8f;
    background: #f1f2f5;
}

.calendar-legend-estimate {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #74636a;
}

.calendar-legend-estimate i {
    width: 18px;
    height: 10px;
    border: 1px dashed #34769a;
    border-radius: 3px;
    background: #f0f7fa;
}

.timeline-estimate-badge {
    display: block;
    margin-top: 3px;
    color: #75566b;
    font-size: 11px;
    font-style: italic;
}

.calendar-grid-wrap {
    overflow-x: auto;
    border: 1px solid #eee7e9;
    border-radius: 11px;
    scrollbar-color: #d8c2ca transparent;
    scrollbar-width: thin;
}

.planning-calendar-grid {
    display: grid;
    min-width: 780px;
    grid-template-columns: minmax(0, 1fr);
    background: #fff;
}

.planning-calendar-week-heading {
    display: grid;
    min-width: 780px;
    grid-template-columns: repeat(7, minmax(105px, 1fr));
}

.planning-calendar-week-heading .planning-calendar-day-heading {
    justify-content: center;
    border-top: 0;
}

.planning-calendar-week-row {
    position: relative;
    display: grid;
    min-width: 780px;
    grid-template-columns: repeat(7, minmax(105px, 1fr));
    align-items: stretch;
    border-bottom: 1px solid #f0e9eb;
}

.planning-calendar-week-day {
    z-index: 0;
    min-width: 0;
    padding: 6px 7px;
    border-right: 1px solid #f0e9eb;
    background: #fff;
}

.planning-calendar-week-day.is-today {
    background: #fffbfc;
}

.planning-calendar-week-day.is-outside-month {
    background: #fbfafb;
}

.planning-calendar-week-day .planning-calendar-date {
    margin: 0;
}

.calendar-range-bar {
    z-index: 1;
    display: flex;
    min-width: 0;
    height: 27px;
    align-self: center;
    align-items: center;
    gap: 5px;
    margin: 0 2px;
    padding: 0 7px;
    overflow: hidden;
    border: 1px solid #ead4dc;
    border-left: 3px solid #8b2947;
    border-radius: 6px;
    color: #67243a;
    background: #fbf1f4;
    font-size: 11px;
    line-height: 1;
    text-decoration: none;
    transition: filter .15s ease, box-shadow .15s ease;
}

.main-area .planning-calendar .calendar-range-bar {
    font-size: 11px !important;
}

.calendar-range-bar:hover {
    z-index: 2;
    color: #4c1025;
    filter: saturate(1.08);
    box-shadow: 0 3px 10px rgba(53, 18, 31, .16);
}

.calendar-range-bar.calendar-item-task {
    border-color: #d2e2ec;
    border-left-color: #34769a;
    color: #21556f;
    background: #eaf4f8;
}

.calendar-range-bar.is-estimated {
    border-style: dashed;
}

.calendar-range-bar.is-estimated.calendar-item-task {
    border-style: dashed;
}

.calendar-range-bar.calendar-status-done {
    border-color: #c8e1d5;
    border-left-color: #368367;
    color: #27674f;
    background: #e8f4ed;
}

.calendar-range-bar.calendar-status-blocked {
    border-color: #eed1cd;
    border-left-color: #c0524d;
    color: #963d39;
    background: #fff0ed;
}

.calendar-range-bar.is-overdue:not(.calendar-status-done):not(.calendar-status-blocked) {
    border-color: #efdfbd;
    border-left-color: #c18430;
    color: #855a20;
    background: #fff6e6;
}

.calendar-range-bar.continues-from-previous {
    margin-left: 0;
    padding-left: 5px;
    border-left-width: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.calendar-range-bar.continues-into-next {
    margin-right: 0;
    padding-right: 5px;
    border-right-width: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.calendar-range-bar.continues-from-previous.continues-into-next {
    border-radius: 0;
}

.calendar-range-marker {
    display: grid;
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    place-items: center;
    border-radius: 4px;
    color: #7a2945;
    background: rgba(139, 41, 71, .12);
    font-size: 8px;
    font-weight: 800;
}

.calendar-item-task .calendar-range-marker {
    color: #286381;
    background: rgba(52, 118, 154, .13);
}

.calendar-range-title {
    min-width: 0;
    overflow: hidden;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-range-duration {
    flex: 0 0 auto;
    margin-left: auto;
    font-size: 9px;
    font-weight: 600;
    white-space: nowrap;
}

.planning-calendar-grid.is-day {
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
}

.planning-calendar-day-heading {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
    padding: 9px 12px;
    border-right: 1px solid #f0e9eb;
    border-bottom: 1px solid #eee7e9;
    color: #74636a;
    background: #fcfafb;
    font-size: 12px;
    font-weight: 600;
    text-transform: capitalize;
}

.planning-calendar-day-heading strong {
    display: grid;
    width: 27px;
    height: 27px;
    flex: 0 0 27px;
    place-items: center;
    border-radius: 50%;
    color: #50333d;
    font-size: 13px;
}

.planning-calendar-day-heading strong.is-today,
.planning-calendar-date.is-today {
    color: #fff;
    background: var(--purple);
}

.planning-calendar-day {
    min-width: 0;
    min-height: 124px;
    padding: 8px;
    border-right: 1px solid #f0e9eb;
    border-bottom: 1px solid #f0e9eb;
    background: #fff;
}

.planning-calendar-grid.is-week .planning-calendar-day {
    min-height: 240px;
}

.planning-calendar-grid.is-day .planning-calendar-day {
    min-height: 260px;
    padding: 15px;
}

.planning-calendar-day.is-today {
    background: #fffbfc;
}

.planning-calendar-day.is-outside-month {
    background: #fbfafb;
}

.planning-calendar-date {
    display: grid;
    width: 26px;
    height: 26px;
    margin: 0 0 6px;
    place-items: center;
    border-radius: 50%;
    color: #74636a;
    font-size: 12px;
    font-weight: 600;
}

.planning-calendar-day.is-outside-month .planning-calendar-date {
    color: #b9afb3;
}

.planning-calendar-items {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.calendar-item {
    display: grid;
    min-width: 0;
    grid-template-columns: 19px minmax(0, 1fr);
    align-items: center;
    gap: 3px 6px;
    padding: 6px 7px;
    overflow: hidden;
    border: 1px solid #ead4dc;
    border-left: 3px solid #8b2947;
    border-radius: 7px;
    color: #67243a;
    background: #fbf1f4;
    font-size: 11px;
    line-height: 1.35;
    text-decoration: none;
    transition: transform .15s ease, box-shadow .15s ease;
}

.main-area .planning-calendar .calendar-item {
    font-size: 11px !important;
}

.main-area .planning-calendar .calendar-item.is-compact {
    font-size: 10px !important;
}

.calendar-item:hover {
    z-index: 1;
    color: #4c1025;
    box-shadow: 0 4px 12px rgba(53, 18, 31, .12);
    transform: translateY(-1px);
}

.calendar-item-task {
    border-color: #d2e2ec;
    border-left-color: #34769a;
    color: #21556f;
    background: #f0f7fa;
}

.calendar-item-task:hover {
    color: #153f55;
}

.calendar-item-type {
    display: grid;
    width: 18px;
    height: 18px;
    grid-row: span 2;
    place-items: center;
    border-radius: 5px;
    color: #7a2945;
    background: rgba(139, 41, 71, .12);
    font-size: 9px;
    font-weight: 800;
}

.calendar-item-task .calendar-item-type {
    color: #286381;
    background: rgba(52, 118, 154, .13);
}

.calendar-item-title {
    min-width: 0;
    overflow: hidden;
    font-weight: 700;
    text-overflow: ellipsis;
}

.calendar-item.is-compact {
    grid-template-columns: 16px minmax(0, 1fr);
    gap: 0 4px;
    padding: 4px 5px;
    font-size: 10px;
}

.calendar-item.is-compact .calendar-item-type {
    width: 15px;
    height: 15px;
    font-size: 8px;
}

.calendar-item-meta,
.calendar-item-duration,
.calendar-item-status {
    grid-column: 2;
    overflow: hidden;
    color: #84747b;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-item-duration {
    color: #785466;
    font-size: 10px;
    font-weight: 600;
}

.calendar-item.is-estimated {
    border-style: dashed;
}

.calendar-item-status {
    color: #687c71;
}

.calendar-status-done {
    border-color: #c8e1d5;
    border-left-color: #368367;
    color: #27674f;
    background: #edf7f1;
}

.calendar-status-blocked {
    border-color: #eed1cd;
    border-left-color: #c0524d;
    color: #963d39;
    background: #fff4f1;
}

.calendar-item.is-overdue:not(.calendar-status-done):not(.calendar-status-blocked) {
    border-left-color: #c18430;
    background: #fff8ec;
}

.calendar-item-task.has-milestone-color,
.calendar-range-bar.calendar-item-task.has-milestone-color {
    border-color: hsl(var(--milestone-hue) 42% 83%);
    border-left-color: hsl(var(--milestone-hue) 55% 42%);
    color: hsl(var(--milestone-hue) 48% 29%);
    background: hsl(var(--milestone-hue) 65% 96%);
}

.calendar-item-task.has-milestone-color:hover,
.calendar-range-bar.calendar-item-task.has-milestone-color:hover {
    color: hsl(var(--milestone-hue) 52% 23%);
}

.calendar-item-task.has-milestone-color .calendar-item-type,
.calendar-item-task.has-milestone-color .calendar-range-marker {
    color: hsl(var(--milestone-hue) 55% 35%);
    background: hsl(var(--milestone-hue) 65% 87%);
}

.calendar-item-task.calendar-status-todo .calendar-item-type,
.calendar-range-bar.calendar-item-task.calendar-status-todo .calendar-range-marker {
    color: #747c8f;
    background: #f1f2f5;
}

.calendar-item-task.calendar-status-in_progress .calendar-item-type,
.calendar-range-bar.calendar-item-task.calendar-status-in_progress .calendar-range-marker {
    color: #5a50b4;
    background: #efedff;
}

.calendar-item-task.calendar-status-done .calendar-item-type,
.calendar-range-bar.calendar-item-task.calendar-status-done .calendar-range-marker {
    color: #267b61;
    background: #eaf6f0;
}

.calendar-item-task.calendar-status-blocked .calendar-item-type,
.calendar-range-bar.calendar-item-task.calendar-status-blocked .calendar-range-marker {
    color: #bb5059;
    background: #fff0f0;
}

.calendar-item-task.is-completed-late .calendar-item-type,
.calendar-range-bar.calendar-item-task.is-completed-late .calendar-range-marker {
    color: #b42318;
    background: #fee4e2;
    box-shadow: inset 0 0 0 1px #fecdca;
}

.calendar-more,
.calendar-empty-day {
    padding: 3px 4px;
    color: #8d7880;
    font-size: 11px;
}

@media (max-width: 820px) {
    .planning-calendar {
        padding: 18px;
    }

    .planning-calendar-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .planning-calendar-controls {
        width: 100%;
        justify-content: space-between;
    }
}

@media (max-width: 600px) {
    .workspace-toolbar,
    .workspace-panel-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .workspace-event-filter .form-select {
        width: 100%;
        min-width: 0;
        flex: 1;
    }

    .workspace-panel-actions {
        justify-content: flex-start;
    }

    .planning-tab-section-heading,
    .tasks-tab-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .planning-calendar {
        padding: 15px;
    }

    .planning-calendar-toolbar h2 {
        font-size: 19px;
    }

    .calendar-view-switch button,
    .calendar-date-controls button {
        min-height: 34px;
        padding: 0 8px;
        font-size: 12px;
    }

    .calendar-legend {
        gap: 10px 14px;
        font-size: 11px;
    }
}


/* ── Event Operations: premium workspace redesign ───────────────────────── */

.ops-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 20px;
    padding: 24px 26px;
    border: 1px solid #f0e2e7;
    border-radius: 16px;
    background:
        radial-gradient(120% 180% at 100% 0%, rgba(128, 0, 32, .07) 0%, transparent 55%),
        linear-gradient(120deg, #fff 0%, #fdf8fa 100%);
    box-shadow: 0 10px 30px rgba(35, 40, 72, .05);
}

.ops-hero-copy .eyebrow {
    color: #a05a71;
}

.ops-hero-copy h1 {
    margin: 7px 0 6px;
    color: #35121f;
    font-family: var(--display);
    font-size: clamp(24px, 2.4vw, 31px);
    font-weight: 800;
    letter-spacing: -.04em;
}

.ops-hero-copy .page-subtitle {
    margin: 0;
    max-width: 640px;
    color: #8a7681;
    font-size: 13px;
    line-height: 1.65;
}

.ops-hero-badge {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 11px;
    margin-top: 4px;
    padding: 12px 16px;
    border: 1px solid #eee1e6;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(53, 18, 31, .06);
}

.ops-hero-badge-dot {
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border-radius: 50%;
    background: #218567;
    box-shadow: 0 0 0 4px rgba(33, 133, 103, .14);
}

.ops-hero-badge strong {
    display: block;
    color: #492936;
    font-size: 12px;
    font-weight: 700;
}

.ops-hero-badge small {
    display: block;
    margin-top: 2px;
    color: #94828a;
    font-size: 10px;
}

.workspace-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin: 0 0 16px;
    padding: 10px 12px;
    border: 1px solid #efe3e8;
    border-radius: 13px;
    background: linear-gradient(110deg, #fff 0%, #fbf7f8 100%);
}

.workspace-event-filter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.workspace-filter-icon {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border-radius: 9px;
    color: #7f2442;
    background: #f7eaf0;
}

.workspace-filter-icon svg {
    width: 16px;
    height: 16px;
}

.workspace-event-filter .form-select {
    width: min(310px, 40vw);
    min-height: 38px;
    border-color: #e7dce0;
    border-radius: 9px;
    color: #4e2735;
    font-size: 12.5px;
}

.workspace-event-filter .btn {
    min-height: 38px;
    border-radius: 9px;
    font-size: 12px;
}

.workspace-tabs-nav {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 20px;
}

.workspace-tab-button {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 15px;
    border: 1px solid #efe3e8;
    border-radius: 13px;
    color: #6d5c64;
    background: #fff;
    text-align: left;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}

.workspace-tab-button:hover {
    border-color: #ddc2cd;
    box-shadow: 0 8px 22px rgba(53, 18, 31, .08);
    transform: translateY(-1px);
}

.workspace-tab-button:focus-visible {
    outline: 3px solid rgba(128, 0, 32, .18);
    outline-offset: 2px;
}

.workspace-tab-button.active {
    border-color: #d3aebc;
    background: linear-gradient(135deg, #fff 0%, #fdf5f7 100%);
    box-shadow: 0 10px 26px rgba(128, 0, 32, .12);
}

.workspace-tab-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 11px;
    color: #98284e;
    background: #f7eaf0;
    transition: background .18s ease, color .18s ease;
}

.workspace-tab-icon svg {
    width: 18px;
    height: 18px;
}

.workspace-tab-button.active .workspace-tab-icon {
    color: #fff;
    background: linear-gradient(140deg, #a1264b, #69001d);
    box-shadow: 0 5px 12px rgba(128, 0, 32, .28);
}

.workspace-tab-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
}

.workspace-tab-label {
    overflow: hidden;
    color: #3c1c2a;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -.01em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workspace-tab-summary {
    overflow: hidden;
    color: #97848d;
    font-size: 10.5px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workspace-tab-button.active .workspace-tab-label {
    color: #68122f;
}

.workspace-tab-panel > .workspace-panel-heading {
    margin-bottom: 18px;
}

.workspace-panel-heading h2 {
    color: #35121f;
    font: 800 22px var(--display);
    letter-spacing: -.03em;
}

.workspace-panel-heading p {
    margin: 5px 0 0;
    color: #8a7681;
    font-size: 12.5px;
}

@media (max-width: 1120px) {
    .workspace-tabs-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .ops-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 18px;
    }

    .ops-hero-badge {
        margin-top: 0;
    }

    .workspace-toolbar {
        justify-content: stretch;
    }

    .workspace-event-filter .form-select {
        width: 100%;
        min-width: 0;
        flex: 1;
    }

    .workspace-tabs-nav {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .workspace-tab-button {
        padding: 11px 13px;
    }

    .workspace-tab-summary {
        white-space: normal;
    }
}


/* ── Dashboard executive report: charts ─────────────────────────────────── */

/* ═════════════════════════════════════════════════════════════════════
   ORCHESTRA PREMIUM DASHBOARD — visual modern & premium
   ═════════════════════════════════════════════════════════════════════ */
:root {
    --p-ink: #0b1126;
    --p-ink-soft: #47546c;
    --p-muted: #737e96;
    --p-line: #e3e7f0;
    --p-surface: #ffffff;
    --p-canvas: #f4f6fb;
    --p-primary: #800020;
    --p-primary-glow: rgba(128, 0, 32, 0.24);
    --p-secondary: #a63b55;
    --p-accent: #56818a;
    --p-success: #10b981;
    --p-warning: #f59e0b;
    --p-danger: #ef4444;
    --p-gradient: linear-gradient(135deg, #800020 0%, #a63b55 52%, #d58b9c 100%);
    --p-gradient-soft: linear-gradient(180deg, rgba(128,0,32,0.06) 0%, rgba(166,59,85,0.04) 100%);
    --p-glass: rgba(255, 255, 255, 0.72);
    --p-glass-border: rgba(255, 255, 255, 0.55);
    --p-shadow: 0 18px 44px -12px rgba(11, 17, 38, 0.07), 0 0 0 1px rgba(11,17,38,0.04);
    --p-shadow-strong: 0 28px 56px -14px rgba(11, 17, 38, 0.10), 0 0 0 1px rgba(11,17,38,0.06);
    --p-radius: 16px;
    --p-transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    --p-font: "Manrope", var(--display);
}
body.dashboard-premium, .dashboard-premium {
    background: var(--p-canvas);
    background-image:
        radial-gradient(700px 400px at 10% -10%, rgba(128,0,32,0.08), transparent 52%),
        radial-gradient(550px 340px at 110% 10%, rgba(166,59,85,0.06), transparent 48%),
        radial-gradient(460px 460px at 50% 115%, rgba(6,182,212,0.05), transparent 52%);
    background-attachment: fixed;
}
.premium-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 20px 0 12px;
    margin-bottom: 4px;
}
.hero-content .eyebrow {
    color: var(--p-primary);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 7px;
    display: block;
}
.hero-content h1 {
    margin: 0 0 8px;
    color: var(--p-ink);
    font-family: var(--p-font);
    font-size: clamp(27px, 2.8vw, 36px);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1.12;
}
.hero-content h1 span.grad {
    background: var(--p-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.page-subtitle {
    margin: 0;
    color: var(--p-muted);
    font-size: 12.5px;
    line-height: 1.75;
}
.hero-badge {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 18px;
    border-radius: 16px;
    border: 1px solid var(--p-line);
    background: var(--p-glass);
    box-shadow: var(--p-shadow);
    backdrop-filter: blur(14px);
    color: var(--p-ink-soft);
    font-size: 11.5px;
    font-weight: 600;
    min-width: 210px;
}
.hero-badge .badge-value {
    color: var(--p-ink);
    font-size: 19px;
    font-weight: 800;
    font-family: var(--p-font);
    letter-spacing: -0.02em;
}
.hero-badge span.dot {
    width: 9px; height: 9px; border-radius: 50%; background: var(--p-success);
    box-shadow: 0 0 14px var(--p-success);
    animation: pulse-glow 2s ease-in-out infinite;
}
.premium-kpi-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 8px 0 20px;
}
.premium-kpi {
    position: relative;
    overflow: hidden;
    padding: 20px 20px 18px;
    border-radius: var(--p-radius);
    border: 1px solid var(--p-line);
    background: var(--p-glass);
    box-shadow: var(--p-shadow);
    backdrop-filter: blur(14px);
    transition: var(--p-transition);
    animation: kpi-rise 0.55s cubic-bezier(0.23, 1, 0.32, 1) both;
    isolation: isolate;
}
.premium-kpi::before {
    content: "";
    position: absolute; inset: 0; z-index: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0) 50%);
    opacity: 0; transition: opacity 0.3s ease;
}
.premium-kpi:hover {
    transform: translateY(-2px);
    border-color: rgba(128,0,32,0.2);
    box-shadow: var(--p-shadow-strong);
    z-index: 2;
}
.premium-kpi:hover::before { opacity: 1; }
.premium-kpi .kpi-head {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    position: relative; z-index: 2; margin-bottom: 13px;
}
.premium-kpi .kpi-label {
    color: var(--p-muted); font-size: 8.5px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase;
}
.premium-kpi .kpi-badge {
    display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px;
    color: #fff; font-size: 15px; box-shadow: 0 4px 13px rgba(0,0,0,0.14);
}
.premium-kpi .kpi-value {
    position: relative; z-index: 2;
    margin: 5px 0 3px;
    color: var(--p-ink);
    font-family: var(--p-font);
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 800; letter-spacing: -0.03em; line-height: 1.1;
}
.premium-kpi .kpi-value small {
    font-family: var(--sans); font-size: 13px; font-weight: 600; color: var(--p-muted);
}
.premium-kpi .kpi-caption {
    position: relative; z-index: 2;
    color: var(--p-ink-soft); font-size: 9.5px; line-height: 1.6;
    margin-top: 7px; display: block;
}
.premium-kpi .kpi-bar {
    position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
    background: rgba(11,17,38,0.07); border-radius: 0 0 14px 14px; overflow: hidden;
}
.premium-kpi .kpi-bar i {
    display: block; height: 100%; border-radius: inherit;
    background: var(--p-gradient); width: 0%; transition: width 1.1s cubic-bezier(0.23,1,0.32,1);
}
.premium-kpi:nth-child(1) .kpi-badge { background: var(--p-primary); box-shadow: 0 4px 15px var(--p-primary-glow); }
.premium-kpi:nth-child(2) .kpi-badge { background: var(--p-accent); box-shadow: 0 4px 15px rgba(6,182,212,0.34); }
.premium-kpi:nth-child(3) .kpi-badge { background: var(--p-warning); box-shadow: 0 4px 15px rgba(245,158,11,0.34); }

/* ── Glass panels ── */
.glass-panel {
    position: relative;
    overflow: hidden;
    padding: 22px 22px 18px;
    border-radius: var(--p-radius);
    border: 1px solid var(--p-line);
    background: var(--p-glass);
    box-shadow: var(--p-shadow);
    backdrop-filter: blur(16px);
    transition: var(--p-transition);
    animation: panel-rise 0.6s cubic-bezier(0.23, 1, 0.32, 1) both;
}
.glass-panel::after {
    content: "";
    position: absolute; inset: 0; z-index: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0) 45%);
    opacity: 0; transition: opacity 0.3s ease;
    pointer-events: none;
}
.glass-panel:hover {
    border-color: rgba(128,0,32,0.18);
    box-shadow: var(--p-shadow-strong);
    transform: translateY(-2px);
    z-index: 2;
}
.glass-panel:hover::after { opacity: 1; }
.glass-panel .panel-head {
    position: relative; z-index: 2;
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    margin-bottom: 16px;
}
.glass-panel .panel-title-group .eyebrow {
    color: var(--p-primary); font-size: 8px; font-weight: 800; letter-spacing: 0.18em;
    text-transform: uppercase; margin: 0 0 4px; display: block;
}
.glass-panel h2 {
    position: relative; z-index: 2;
    margin: 0; color: var(--p-ink); font-family: var(--p-font);
    font-size: 15px; font-weight: 800; letter-spacing: -0.02em;
}
.panel-ctrl { position: relative; z-index: 2; }

/* ── Chart containers ── */
.chart-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin: 4px 0 18px;
}
.chart3d-wrap {
    position: relative;
    height: 250px;
    margin-top: 6px;
}
.chart3d-wrap .chart-label {
    position: absolute; top: 0; left: 0; z-index: 4;
    color: var(--p-muted); font-size: 9px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
}
.chart3d-wrap canvas { position: relative; z-index: 3; width: 100% !important; height: calc(100% - 14px) !important; margin-top: 14px; display: block; }
.chart-empty {
    height: 250px; border-radius: var(--p-radius); border: 1px dashed var(--p-line);
    background: var(--p-surface); display: flex; flex-direction: column;
    align-items: center; justify-content: center; color: var(--p-muted);
    font-size: 11px; text-align: center; gap: 8px;
}
.chart-empty span.empty-mark { font-size: 24px; opacity: 0.6; }

/* ── Section dividers ── */
.section-sep {
    height: 1px; background: linear-gradient(90deg, transparent, rgba(128,0,32,0.16), transparent);
    border: 0; margin: 20px 0 6px;
}

/* ── Animations ── */
@keyframes kpi-rise {
    from { opacity: 0; transform: translateY(22px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes panel-rise {
    from { opacity: 0; transform: translateY(26px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes chart-rise {
    from { opacity: 0; transform: translateY(18px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes pulse-glow {
    0%, 100% { opacity: 0.9; transform: scale(1); box-shadow: 0 0 12px var(--p-success); }
    50% { opacity: 1; transform: scale(1.15); box-shadow: 0 0 20px var(--p-success); }
}
@keyframes float {
    0% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
    100% { transform: translateY(0); }
}
.premium-kpi .kpi-badge, .glass-panel .panel-icon { animation: float 5s ease-in-out infinite; }

/* Responsive */
@media (max-width: 900px) {
    .premium-kpi-row { grid-template-columns: 1fr 1fr; }
    .chart-row { grid-template-columns: 1fr; }
    .premium-hero { flex-direction: column; align-items: flex-start; gap: 14px; }
    .hero-badge { min-width: auto; width: 100%; justify-content: space-between; }
    .main-area.dashboard-premium { margin-left: 0; }
}

.premium-kpi:nth-child(4) .kpi-badge { background: var(--p-success); box-shadow: 0 4px 15px rgba(16,185,129,0.34); }


.kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.kpi-progress {
    display: block;
    width: 100%;
    height: 5px;
    margin: 8px 0 2px;
    overflow: hidden;
    border-radius: 8px;
    background: #efeff5;
}

.kpi-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #7c6cf6, #a297f8);
}

.kpi-number small { font-size: 11px; font-weight: 600; }

@media (max-width: 1100px) { .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .kpi-grid { grid-template-columns: 1fr; } }

/* Donut chart */
.donut-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 22px;
    padding: 12px 4px;
}

/* v3: donut dipindah ke .donut-holder; center hanya tampil di dalam holder */
.donut-chart { position: relative; width: 150px; height: 150px; flex: 0 0 auto; }

.donut-holder .donut-chart { width: 100%; height: 100%; transform: rotate(-90deg); }

.donut-chart svg, svg.donut-chart { display: block; }

.donut-wrap { position: relative; }

.donut-center {
    display: none;
    position: absolute;
    inset: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
}

.donut-holder .donut-center { display: flex; }

.donut-center strong { color: #1c2b4a; font-family: var(--display); font-size: 26px; font-weight: 800; }
.donut-center small { margin-top: 3px; color: #8a8fa1; font-size: 10px; letter-spacing: .06em; }

.donut-legend { display: flex; flex: 1; min-width: 170px; flex-direction: column; gap: 9px; margin: 0; padding: 0; list-style: none; }

.donut-legend li { display: flex; align-items: center; gap: 9px; font-size: 11px; }

.legend-dot { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 3px; }
.legend-label { flex: 1; color: #4a5063; font-weight: 600; }
.legend-value { color: #9298a8; font-weight: 500; }

/* Grouped vertical bars */
.bar-chart-vertical {
    display: flex;
    align-items: stretch;
    justify-content: space-around;
    gap: 12px;
    min-height: 220px;
    padding: 10px 4px 0;
}

.bar-group { display: flex; min-width: 0; flex: 1; flex-direction: column; align-items: center; gap: 8px; }

.bar-pair { display: flex; align-items: flex-end; flex: 1; gap: 4px; width: 100%; }

.bar {
    display: flex;
    flex: 1;
    max-width: 34px;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    overflow: hidden;
    border-radius: 6px 6px 0 0;
    transition: height .4s ease;
}

.bar span { padding: 3px 0; color: #fff; font-size: 8px; font-weight: 700; }

.bar-planned { background: linear-gradient(180deg, #b6adf7, #8f82ee); }
.bar-actual { background: linear-gradient(180deg, #56cba2, #2f9f7a); }

.bar-label { max-width: 100%; overflow: hidden; color: #8a8fa1; font-size: 9.5px; text-align: center; text-overflow: ellipsis; white-space: nowrap; }

.panel-heading { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; }

.panel-heading .chart-legend-inline { margin-left: auto; }

.chart-legend-inline { display: inline-flex; align-items: center; gap: 7px; color: #9298a8; font-size: 10px; }
.chart-legend-inline i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; }
.leg-planned { background: #8f82ee; }
.leg-actual { background: #2f9f7a; }

/* Horizontal bars */
.hbar-list { display: flex; flex-direction: column; gap: 13px; padding: 10px 2px; }

.hbar-row { display: flex; align-items: center; gap: 12px; }

.hbar-name { width: 165px; overflow: hidden; color: #4a5063; font-size: 11px; font-weight: 600; text-align: right; text-overflow: ellipsis; white-space: nowrap; }

.hbar-track {
    display: block;
    flex: 1;
    height: 10px;
    overflow: hidden;
    border-radius: 8px;
    background: #efeff5;
}

.hbar-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #7c6cf6, #a297f8);
    transition: width .45s ease;
}

.hbar-track.risk i { background: linear-gradient(90deg, #e8856a, #d84a5b); }

.hbar-value { width: 110px; color: #4a5063; font-size: 11px; font-weight: 700; white-space: nowrap; }
.hbar-value small { color: #9298a8; font-weight: 500; }

/* Column trend chart */
.column-chart {
    display: flex;
    align-items: stretch;
    justify-content: space-around;
    gap: 12px;
    min-height: 210px;
    padding: 10px 4px 0;
}

.col-group { display: flex; min-width: 0; flex: 1; flex-direction: column; align-items: center; gap: 8px; }

.col-bar {
    display: flex;
    flex: 1;
    width: 100%;
    max-width: 44px;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    border-radius: 7px 7px 0 0;
    background: linear-gradient(180deg, #a297f8, #7c6cf6);
    transition: height .4s ease;
}

.col-bar span { padding: 4px 0; color: #fff; font-size: 10px; font-weight: 700; }

.col-label { display: flex; flex-direction: column; align-items: center; color: #8a8fa1; font-size: 9.5px; font-weight: 600; }
.col-label small { color: #b4b8c5; font-size: 8px; font-weight: 500; }

@media (max-width: 640px) {
    .hbar-name { width: 100px; }
    .hbar-value { width: 90px; }
    .donut-wrap { gap: 14px; }
    .donut-chart { width: 120px; height: 120px; }
}


/* ── Dashboard v2: interactive & premium ───────────────────────────────── */

.kpi-interactive { transition: transform .2s ease, box-shadow .2s ease; }
.kpi-interactive:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(60, 40, 120, .13); }
.kpi-link { display: block; color: inherit; text-decoration: none; }
.kpi-interactive:has(.kpi-link:hover) { transform: translateY(-3px); }
.kpi-icon.coral { color: #d84a5b; background: #fdeef0; }
.kpi-progress.mint span { background: linear-gradient(90deg, #0ea772, #56cba2); }
.kpi-dot.warn { background: #e7b157; }

/* Health panel */
.health-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 6px 2px 10px; }

.health-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 14px 10px 12px;
    border: 1px solid #eeeaf5;
    border-radius: 12px;
    background: linear-gradient(160deg, #fff 30%, #faf9fe);
    text-align: center;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    cursor: default;
}

.health-tile:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(60, 40, 120, .1); border-color: #d9d3f2; }

.health-icon { font-size: 17px; line-height: 1; }
.health-count { color: #3b3454; font-family: var(--display); font-size: 21px; font-weight: 800; }
.health-label { color: #8a8fa1; font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }

.health-bar { display: block; width: 100%; height: 4px; margin-top: 6px; overflow: hidden; border-radius: 6px; background: #f0eef8; }
.health-bar i { display: block; height: 100%; border-radius: inherit; transition: width .5s ease; }

/* Behind list */
.behind-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border: 1px solid #f4f0fb;
    border-radius: 10px;
    background: #fdfcff;
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.behind-row + .behind-row { margin-top: 7px; }
.behind-row:hover { background: #f8f6fe; border-color: #e2dbf6; transform: translateX(2px); }

.behind-dot { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; box-shadow: 0 0 0 3px rgba(216, 74, 91, .12); }
.behind-name { overflow: hidden; flex: 1; color: #41475b; font-size: 11px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.behind-metrics { color: #9298a8; font-size: 9.5px; white-space: nowrap; }
.behind-metrics b { color: #57505f; font-weight: 700; }

.health-chip { padding: 3px 8px; border-radius: 20px; font-size: 8.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }

/* Timeline */
.timeline-panel { margin: 14px 0; }

.timeline-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    gap: 6px;
    position: relative;
    overflow-x: auto;
    padding: 18px 6px 10px;
}

.timeline-line { position: absolute; top: 27px; right: 4%; left: 4%; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #0ea772 0%, #7c6cf6 45%, #b7bccb 100%); opacity: .5; }

.timeline-node {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 108px;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 0 4px;
    text-align: center;
}

.timeline-marker {
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    border: 2px solid;
    border-radius: 50%;
    background: #fff;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 1);
    transition: transform .18s ease, box-shadow .18s ease;
}

.timeline-node:hover .timeline-marker { transform: scale(1.18); box-shadow: 0 0 0 4px #fff, 0 4px 10px rgba(60, 40, 120, .18); }

.timeline-date { color: #7a7f92; font-size: 9px; font-weight: 700; }
.timeline-title { max-width: 100%; overflow: hidden; color: #41475b; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.timeline-event { max-width: 100%; overflow: hidden; color: #9ba1af; font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }

.timeline-progress { display: block; width: 56px; height: 3.5px; margin-top: 3px; overflow: hidden; border-radius: 6px; background: #f0eef8; }
.timeline-progress i { display: block; height: 100%; border-radius: inherit; }

/* Sponsor funnel */
.funnel-chart { display: flex; flex-direction: column; gap: 8px; padding: 8px 2px 4px; }

.funnel-row { display: flex; align-items: center; gap: 10px; }

.funnel-icon { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border-radius: 9px; background: #f5f3fb; font-size: 14px; }

.funnel-track { display: block; flex: 1; height: 16px; overflow: hidden; border-radius: 8px; background: #f1eef9; }

.funnel-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #7c6cf6, #a297f8);
    transition: width .5s cubic-bezier(.22, 1, .36, 1);
    animation: funnel-grow .6s ease both;
}

@keyframes funnel-grow { from { width: 0 !important; } }

.funnel-row:nth-child(1) .funnel-track i { background: linear-gradient(90deg, #7c6cf6, #948af6); }
.funnel-row:nth-child(2) .funnel-track i { background: linear-gradient(90deg, #6a8ef3, #8fb1f8); }
.funnel-row:nth-child(3) .funnel-track i { background: linear-gradient(90deg, #4aa8e0, #7cc3ec); }
.funnel-row:nth-child(4) .funnel-track i { background: linear-gradient(90deg, #2fb58a, #6cd3ad); }
.funnel-row:nth-child(5) .funnel-track i { background: linear-gradient(90deg, #0ea772, #56cba2); }
.funnel-row:nth-child(6) .funnel-track i { background: linear-gradient(90deg, #d84a5b, #e8838d); }

.funnel-count { min-width: 20px; color: #41475b; font-size: 12px; font-weight: 800; text-align: right; }
.funnel-label { width: 84px; color: #8a8fa1; font-size: 10px; font-weight: 600; }

.funnel-total {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 12px;
    padding: 11px 13px;
    border: 1px solid #e8f5ef;
    border-radius: 10px;
    background: linear-gradient(160deg, #f2fbf7, #fff);
    color: #6f7585;
    font-size: 11px;
}

.funnel-total strong { color: #22926a; font-size: 12.5px; }

/* Bar hover lift */
.bar { transition: height .4s ease, filter .18s ease, transform .18s ease; }
.bar:hover { filter: brightness(1.08); transform: scaleY(1.02); transform-origin: bottom; }

.col-bar { transition: height .4s ease, filter .18s ease; }
.col-bar:hover { filter: brightness(1.1); }

.hbar-track i { transition: width .45s ease; }
.hbar-row:hover .hbar-track i { filter: brightness(1.12); }

@media (max-width: 900px) {
    .health-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .timeline-track { grid-auto-columns: minmax(128px, 1fr); }
}


/* ── Dashboard v3: F-pattern, 3-warna, bullet chart ────────────────────── */

/* Warna: navy = data utama, hijau = sukses, merah/oranye = risiko */
.kpi-icon.navy { color: #1f4e8c; background: #e8eef8; }
.kpi-dot.navy { background: #1f4e8c; }
.kpi-progress.navy span { background: linear-gradient(90deg, #1f4e8c, #3d6db5); }
.kpi-progress.mint span { background: linear-gradient(90deg, #0e8a62, #3fae87); }
.kpi-icon.mint { color: #0e8a62; background: #e6f4ee; }
.panel-icon.navy { color: #1f4e8c; background: #e8eef8; }

.report-welcome .page-subtitle { color: #8a8fa1; }

/* KPI equal width */
.kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Hbar kontras: biru tua + angka besar */
.hbar-track i { background: linear-gradient(90deg, #1f4e8c, #3d6db5); }
.hbar-track.risk i { background: linear-gradient(90deg, #c0392b, #d9573d); }
.hbar-value.lg { font-size: 13px; font-weight: 800; color: #1c2b4a; min-width: 64px; }
.hbar-value.lg small { display: block; color: #8a8fa1; font-size: 9.5px; font-weight: 600; }

/* Bullet chart anggaran */
.bullet-list { display: flex; flex-direction: column; gap: 14px; padding: 10px 2px; }

.bullet-row { display: flex; align-items: center; gap: 12px; }

.bullet-name { width: 165px; overflow: hidden; color: #4a5063; font-size: 11px; font-weight: 600; text-align: right; text-overflow: ellipsis; white-space: nowrap; }

.bullet-track { position: relative; display: block; flex: 1; height: 14px; overflow: visible; border-radius: 8px; background: #edf0f6; }

.bullet-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #1f4e8c, #3d6db5);
    transition: width .5s ease;
}

.bullet-track.over i { background: linear-gradient(90deg, #c0392b, #d9573d); }

.bullet-target { position: absolute; top: -3px; height: 20px; width: 3px; border-radius: 2px; background: #3c4356; }

.bullet-value { min-width: 64px; color: #1c2b4a; font-size: 13px; font-weight: 800; text-align: right; }
.bullet-value.warn { color: #c0392b; }

/* Timeline warna navy */
.timeline-panel { margin: 14px 0; }
.timeline-track .timeline-marker { background: #fff; }

/* Donut: total di tengah */
.donut-holder { position: relative; width: 150px; flex: 0 0 150px; height: 150px; }
.donut-holder .donut-chart { width: 100%; height: 100%; transform: rotate(-90deg); }
.donut-holder .donut-center {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
}
.donut-center strong { color: #1c2b4a; font-family: var(--display); font-size: 26px; font-weight: 800; }
.donut-center small { margin-top: 3px; color: #8a8fa1; font-size: 10px; letter-spacing: .06em; }

/* Funnel navy gradient */
.funnel-track i { background: linear-gradient(90deg, #1f4e8c, #3d6db5); }
.funnel-row:nth-child(1) .funnel-track i { background: linear-gradient(90deg, #1f4e8c, #3d6db5); }
.funnel-row:nth-child(2) .funnel-track i { background: linear-gradient(90deg, #2a5da0, #4d7fbd); }
.funnel-row:nth-child(3) .funnel-track i { background: linear-gradient(90deg, #3d6db5, #6a93c9); }
.funnel-row:nth-child(4) .funnel-track i { background: linear-gradient(90deg, #0e8a62, #3fae87); }
.funnel-row:nth-child(5) .funnel-track i { background: linear-gradient(90deg, #0e8a62, #3fae87); }
.funnel-row:nth-child(6) .funnel-track i { background: linear-gradient(90deg, #c0392b, #d9573d); }

/* Appendix: lampiran MY WORK */
.appendix-panel {
    margin-top: 16px;
    padding-top: 4px;
    border-top: 2px dashed #e4e7ef;
    border-radius: 10px;
    background: linear-gradient(180deg, #fbfcfe, #fff);
}

@media (max-width: 1100px) {
    .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .kpi-grid { grid-template-columns: 1fr; }
    .bullet-name, .hbar-name { width: 96px; }
}

/* ── Dashboard: single-event budget summary ────────────────────────── */
.dashboard-premium .finance-panel {
    display: flex;
    flex-direction: column;
}

.dashboard-premium .budget-summary {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 12px;
}

.dashboard-premium .budget-total-card {
    position: relative;
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    justify-content: space-between;
    gap: 12px;
    overflow: hidden;
    padding: 16px 17px 14px;
    border: 1px solid rgba(128, 0, 32, .12);
    border-radius: 14px;
    background:
        radial-gradient(180px 120px at 100% 0%, rgba(128, 0, 32, .08), transparent 75%),
        linear-gradient(145deg, #fff, #fcf8fa);
}

.dashboard-premium .budget-total-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    border-radius: 14px 0 0 14px;
    background: var(--p-gradient);
    content: "";
}

.dashboard-premium .budget-total-head,
.dashboard-premium .budget-usage-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.dashboard-premium .budget-cap {
    color: var(--p-muted);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .1em;
}

.dashboard-premium .budget-status {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 800;
    white-space: nowrap;
}

.dashboard-premium .budget-status i,
.dashboard-premium .budget-stat-label i {
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    border-radius: 50%;
    background: currentColor;
}

.dashboard-premium .budget-status.state-healthy {
    border-color: rgba(33, 133, 103, .13);
    color: #218567;
    background: #edf8f3;
}

.dashboard-premium .budget-status.state-watch {
    border-color: rgba(168, 121, 38, .16);
    color: #a87926;
    background: #fff8e9;
}

.dashboard-premium .budget-status.state-over {
    border-color: rgba(197, 71, 82, .15);
    color: #c54752;
    background: #fff0f1;
}

.dashboard-premium .budget-status.state-unset {
    border-color: var(--p-line);
    color: var(--p-muted);
    background: #f3f5f8;
}

.dashboard-premium .budget-total-value {
    display: block;
    overflow-wrap: anywhere;
    color: var(--p-ink);
    font: 800 clamp(21px, 2.1vw, 29px)/1.2 var(--p-font);
    letter-spacing: -.045em;
}

.dashboard-premium .budget-usage-meta {
    margin-bottom: 7px;
    color: var(--p-ink-soft);
    font-size: 10px;
    font-weight: 600;
}

.dashboard-premium .budget-usage-meta strong {
    color: var(--p-primary);
    font: 800 13px/1 var(--p-font);
}

.dashboard-premium .budget-bar {
    display: block;
    width: 100%;
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #eceef3;
}

.dashboard-premium .budget-bar i {
    display: block;
    height: 100%;
    min-width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, #800020, #b34d67);
    transition: width .6s ease;
}

.dashboard-premium .budget-bar i.state-watch {
    background: linear-gradient(90deg, #c18a2e, #e3b04e);
}

.dashboard-premium .budget-bar i.state-over {
    background: linear-gradient(90deg, #c54752, #e17670);
}

.dashboard-premium .budget-bar i.state-unset {
    background: #aeb6c5;
}

.dashboard-premium .budget-usage > small {
    display: block;
    margin-top: 6px;
    color: var(--p-muted);
    font-size: 9px;
}

.dashboard-premium .budget-breakdown {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-premium .budget-stat {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 5px;
    padding: 12px 13px;
    border: 1px solid var(--p-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .78);
}

.dashboard-premium .budget-stat-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--p-muted);
    font-size: 9px;
    font-weight: 700;
}

.dashboard-premium .stat-spent .budget-stat-label i {
    color: #a24a62;
}

.dashboard-premium .stat-remaining .budget-stat-label i {
    color: #218567;
}

.dashboard-premium .budget-stat > strong {
    overflow-wrap: anywhere;
    color: var(--p-ink);
    font: 800 clamp(13px, 1.35vw, 16px)/1.3 var(--p-font);
    letter-spacing: -.025em;
}

.dashboard-premium .stat-spent > strong {
    color: #8d2944;
}

.dashboard-premium .stat-remaining > strong {
    color: #218567;
}

.dashboard-premium .budget-stat > small {
    color: var(--p-muted);
    font-size: 8px;
    line-height: 1.4;
}

@media (max-width: 600px) {
    .dashboard-premium .budget-total-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .dashboard-premium .budget-total-value {
        font-size: clamp(20px, 6vw, 27px);
    }
}

.dashboard-premium .status-chart-caption {
    margin: -5px 0 2px;
    color: var(--p-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.dashboard-premium .status-chart-layout {
    display: flex;
    min-height: 250px;
    align-items: center;
    justify-content: center;
    gap: clamp(12px, 2vw, 26px);
    padding: 6px 2px 2px;
}

.dashboard-premium .status-donut-visual {
    position: relative;
    width: clamp(160px, 18vw, 210px);
    height: clamp(160px, 18vw, 210px);
    flex: 0 0 auto;
}

.dashboard-premium .status-donut-visual canvas.chart3d {
    position: relative;
    z-index: 1;
    display: block;
    width: 100% !important;
    height: 100% !important;
    margin: 0;
}

.dashboard-premium .status-donut-center {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.dashboard-premium .status-donut-center strong {
    color: var(--p-ink);
    font: 800 clamp(23px, 2.4vw, 30px)/1 var(--p-font);
    letter-spacing: -.055em;
}

.dashboard-premium .status-donut-center span {
    margin-top: 5px;
    color: var(--p-muted);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .12em;
}

.dashboard-premium .status-chart-legend {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dashboard-premium .status-legend-item {
    display: grid;
    min-width: 0;
    grid-template-columns: 8px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 7px;
    padding: 9px 10px;
    border: 1px solid #edf0f5;
    border-radius: 10px;
    background: rgba(255, 255, 255, .72);
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.dashboard-premium .status-legend-item:hover {
    transform: translateX(2px);
    border-color: color-mix(in srgb, var(--status-color) 25%, #edf0f5);
    background: #fff;
}

.dashboard-premium .status-legend-dot {
    width: 8px;
    height: 8px;
    border-radius: 3px;
    background: var(--status-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--status-color) 10%, white);
}

.dashboard-premium .status-legend-label {
    overflow: hidden;
    color: var(--p-ink-soft);
    font-size: 10px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-premium .status-legend-value {
    color: var(--p-ink);
    font: 800 11px/1 var(--p-font);
    font-variant-numeric: tabular-nums;
}

.dashboard-premium .status-legend-percent {
    min-width: 37px;
    padding: 4px 6px;
    border-radius: 6px;
    color: var(--status-color);
    background: color-mix(in srgb, var(--status-color) 9%, white);
    font-size: 8px;
    font-weight: 800;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 1100px) {
    .dashboard-premium .status-chart-layout {
        gap: 12px;
    }

    .dashboard-premium .status-donut-visual {
        width: 160px;
        height: 160px;
    }

    .dashboard-premium .status-legend-item {
        grid-template-columns: 8px minmax(0, 1fr) auto;
        gap: 6px;
        padding: 8px;
    }

    .dashboard-premium .status-legend-percent {
        display: none;
    }
}

@media (max-width: 900px) {
    .dashboard-premium .status-donut-visual {
        width: clamp(170px, 30vw, 220px);
        height: clamp(170px, 30vw, 220px);
    }

    .dashboard-premium .status-legend-item {
        grid-template-columns: 8px minmax(0, 1fr) auto auto;
        padding: 9px 10px;
    }

    .dashboard-premium .status-legend-percent {
        display: inline-block;
    }
}

@media (max-width: 600px) {
    .dashboard-premium .status-chart-layout {
        min-height: 0;
        flex-direction: column;
        gap: 14px;
        padding-top: 12px;
    }

    .dashboard-premium .status-donut-visual {
        width: 172px;
        height: 172px;
    }

    .dashboard-premium .status-chart-legend {
        width: 100%;
        flex: auto;
    }

    .dashboard-premium .status-legend-item {
        grid-template-columns: 8px minmax(0, 1fr) auto auto;
    }
}

/* Full-width sponsor panel row in single mode */

.dashboard-premium {
    min-width: 0;
}

.dashboard-premium .hero-side {
    display: flex;
    width: min(100%, 310px);
    flex: 0 1 310px;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
}

.dashboard-premium .event-switcher {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 9px 11px;
    border: 1px solid var(--p-line);
    border-radius: 12px;
    background: var(--p-glass);
    box-shadow: var(--p-shadow);
}

.dashboard-premium .event-switcher .eyebrow {
    flex: 0 0 auto;
    margin: 0;
    color: var(--p-muted);
}

.dashboard-premium .event-switcher-select {
    width: 100%;
    min-width: 0;
    padding: 8px 30px 8px 10px;
    border: 1px solid var(--p-line);
    border-radius: 9px;
    color: var(--p-ink);
    background-color: var(--p-surface);
    font: 600 12px var(--sans);
}

.dashboard-premium .event-switcher-select:focus {
    border-color: var(--p-primary);
    outline: 3px solid var(--p-primary-glow);
}

.dashboard-premium .dashboard-overview-grid {
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.dashboard-premium .dashboard-detail-grid {
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    gap: 16px;
    margin-bottom: 16px;
}

.dashboard-premium .dashboard-list-panel {
    min-width: 0;
    padding: 0;
}

.dashboard-premium .panel-head-bordered {
    margin: 0;
    padding: 17px 20px 14px;
    border-bottom: 1px solid var(--p-line);
}

.dashboard-premium .event-list {
    padding: 2px 18px 8px;
}

.dashboard-premium .event-row {
    min-width: 0;
}

.dashboard-premium .task-table-wrap {
    padding: 0 14px 8px;
}

.dashboard-premium .task-table {
    min-width: 620px;
}

.dashboard-premium .task-empty,
.dashboard-premium .dashboard-empty {
    min-height: 180px;
    padding: 22px;
    color: var(--p-muted);
    font-size: 11px;
    text-align: center;
}

.dashboard-premium .dashboard-empty {
    justify-content: center;
    text-align: left;
}

.dashboard-premium .section-eyebrow {
    margin: 14px 0 8px;
}

.dashboard-premium .sponsor-total {
    margin-top: 8px;
    text-align: center;
}

.dashboard-premium .chart-row-wide {
    grid-template-columns: minmax(0, 1fr);
}

.dashboard-premium .hbar-row {
    min-width: 0;
}

@media (max-width: 1100px) {
    .dashboard-premium .hbar-name {
        width: 100px;
    }

    .dashboard-premium .hbar-value {
        width: auto;
        min-width: 76px;
    }
}

@media (max-width: 1024px) {
    .dashboard-premium .dashboard-overview-grid,
    .dashboard-premium .dashboard-detail-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 900px) {
    .dashboard-premium .hero-side {
        width: 100%;
        flex-basis: auto;
    }
}

@media (max-width: 600px) {
    .dashboard-premium .premium-hero {
        padding-top: 12px;
    }

    .dashboard-premium .premium-kpi-row {
        gap: 10px;
        margin-bottom: 16px;
    }

    .dashboard-premium .premium-kpi {
        padding: 16px;
    }

    .dashboard-premium .chart3d-wrap,
    .dashboard-premium .chart-empty {
        height: 220px;
    }

    .dashboard-premium .glass-panel {
        padding: 17px;
    }

    .dashboard-premium .dashboard-list-panel {
        padding: 0;
    }

    .dashboard-premium .panel-head-bordered {
        padding: 15px 16px 12px;
    }

    .dashboard-premium .event-list {
        padding-right: 14px;
        padding-left: 14px;
    }

    .dashboard-premium .hbar-name {
        width: 96px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dashboard-premium *,
    .dashboard-premium *::before,
    .dashboard-premium *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

.dashboard-premium .milestone-timeline-panel {
    margin: 0 0 18px;
    padding: 20px 22px 16px;
}

.dashboard-premium .milestone-timeline-heading {
    align-items: flex-start;
    margin-bottom: 4px;
}

.dashboard-premium .milestone-timeline-heading .panel-title-group > p {
    margin: 5px 0 0;
    color: var(--p-muted);
    font-size: 11px;
}

.dashboard-premium .milestone-count {
    flex: 0 0 auto;
    padding: 7px 11px;
    border: 1px solid rgba(128, 0, 32, .12);
    border-radius: 999px;
    color: var(--p-primary);
    background: rgba(128, 0, 32, .045);
    font-size: 10px;
    font-weight: 700;
}

.dashboard-premium .milestone-timeline-scroll {
    overflow-x: auto;
    padding: 12px 2px 10px;
    overscroll-behavior-x: contain;
    scrollbar-color: #d8dce7 transparent;
    scrollbar-width: thin;
}

.dashboard-premium .milestone-timeline-scroll::-webkit-scrollbar {
    height: 7px;
}

.dashboard-premium .milestone-timeline-scroll::-webkit-scrollbar-thumb {
    border-radius: 99px;
    background: #d8dce7;
}

.dashboard-premium .milestone-flow {
    position: relative;
    display: grid;
    grid-auto-columns: minmax(220px, 1fr);
    grid-auto-flow: column;
    gap: 14px;
    min-width: 100%;
}

.dashboard-premium .milestone-flow::before {
    position: absolute;
    top: 59px;
    right: calc(50% / var(--milestone-count, 1));
    left: calc(50% / var(--milestone-count, 1));
    height: 2px;
    background: linear-gradient(90deg, rgba(128, 0, 32, .2), rgba(128, 0, 32, .62), rgba(128, 0, 32, .2));
    content: "";
}

.dashboard-premium .milestone-step {
    --milestone-color: #8993a5;
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.dashboard-premium .milestone-step.state-done {
    --milestone-color: #218567;
}

.dashboard-premium .milestone-step.state-active,
.dashboard-premium .milestone-step.state-today {
    --milestone-color: var(--p-primary);
}

.dashboard-premium .milestone-step.state-overdue,
.dashboard-premium .milestone-step.state-blocked {
    --milestone-color: #c54752;
}

.dashboard-premium .milestone-date {
    display: flex;
    min-height: 32px;
    align-items: baseline;
    justify-content: center;
    gap: 5px;
    color: var(--p-muted);
    font-size: 10px;
    text-decoration: none;
}

.dashboard-premium .milestone-date strong {
    color: var(--p-ink);
    font: 800 17px/1 var(--p-font);
    letter-spacing: -.04em;
}

.dashboard-premium .milestone-date span {
    font-size: 10px;
    font-weight: 700;
}

.dashboard-premium .milestone-marker {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    margin: 10px 0 12px;
    border: 2px solid var(--milestone-color);
    border-radius: 50%;
    color: var(--milestone-color);
    background: #fff;
    box-shadow: 0 0 0 5px #fff, 0 3px 10px rgba(20, 28, 48, .08);
    font-size: 10px;
    font-weight: 800;
    transition: transform .2s ease, box-shadow .2s ease;
}

.dashboard-premium .milestone-step:hover .milestone-marker {
    transform: scale(1.08);
    box-shadow: 0 0 0 5px #fff, 0 5px 14px rgba(20, 28, 48, .14);
}

.dashboard-premium .milestone-card {
    display: flex;
    width: 100%;
    min-height: 166px;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    padding: 14px;
    border: 1px solid var(--p-line);
    border-top: 3px solid var(--milestone-color);
    border-radius: 12px;
    background: linear-gradient(155deg, #fff, #fbfcff);
    box-shadow: 0 8px 20px rgba(20, 28, 48, .045);
    text-align: left;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.dashboard-premium .milestone-step:hover .milestone-card {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(20, 28, 48, .08);
}

.dashboard-premium .milestone-state {
    display: inline-flex;
    align-items: center;
    min-height: 21px;
    padding: 3px 8px;
    border-radius: 999px;
    color: var(--milestone-color);
    background: color-mix(in srgb, var(--milestone-color) 10%, white);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .035em;
}

.dashboard-premium .milestone-card h3 {
    display: -webkit-box;
    width: 100%;
    overflow: hidden;
    margin: 9px 0 5px;
    color: var(--p-ink);
    font: 750 12px/1.5 var(--p-font);
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dashboard-premium .milestone-context {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 3px;
    overflow: hidden;
    color: var(--p-muted);
    font-size: 9px;
}

.dashboard-premium .milestone-context span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-premium .milestone-progress-copy {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: auto;
    padding-top: 11px;
    color: var(--p-muted);
    font-size: 9px;
}

.dashboard-premium .milestone-progress-copy strong {
    color: var(--p-ink);
    font-size: 10px;
}

.dashboard-premium .milestone-progress {
    display: block;
    width: 100%;
    height: 5px;
    margin-top: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf0f5;
}

.dashboard-premium .milestone-progress i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--milestone-color);
}

.dashboard-premium .milestone-task-count {
    margin-top: 5px;
    color: var(--p-muted);
    font-size: 9px;
}

.dashboard-premium .milestone-timeline-empty {
    display: flex;
    min-height: 160px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 20px;
    border: 1px dashed var(--p-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .55);
}

.dashboard-premium .milestone-timeline-empty strong {
    color: var(--p-ink);
    font-size: 12px;
}

.dashboard-premium .milestone-timeline-empty p {
    margin: 4px 0 0;
    color: var(--p-muted);
    font-size: 10px;
}

@media (max-width: 600px) {
    .dashboard-premium .milestone-timeline-panel {
        padding: 16px 14px 12px;
    }

    .dashboard-premium .milestone-count {
        padding: 6px 9px;
        font-size: 9px;
    }

    .dashboard-premium .milestone-flow {
        grid-auto-columns: minmax(210px, 78vw);
    }
}

.dashboard-premium .dashboard-detail-grid {
    align-items: start;
}

.dashboard-premium .dashboard-list-panel {
    overflow: hidden;
    border-color: #e7eaf1;
    border-radius: 15px;
    background: linear-gradient(160deg, #fff 45%, #fbfcff);
    box-shadow: 0 12px 30px rgba(20, 28, 48, .055);
}

.dashboard-premium .dashboard-list-panel::after {
    display: none;
}

.dashboard-premium .panel-head-bordered {
    display: flex;
    min-height: 84px;
    align-items: center;
    gap: 14px;
    padding: 16px 19px;
    border-bottom-color: #edf0f5;
    background: linear-gradient(110deg, rgba(128, 0, 32, .035), transparent 72%);
}

.dashboard-premium .panel-head-bordered .panel-title-group {
    min-width: 0;
}

.dashboard-premium .panel-head-bordered .panel-title-group h2 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    line-height: 1.4;
}

.dashboard-premium .panel-head-bordered .panel-heading-count {
    display: inline-grid;
    min-width: 22px;
    height: 22px;
    place-items: center;
    margin: 0;
    padding: 0 6px;
    border: 1px solid rgba(128, 0, 32, .12);
    border-radius: 7px;
    color: var(--p-primary);
    background: #fff;
    font: 800 9px/1 var(--p-font);
    letter-spacing: 0;
}

.dashboard-premium .dashboard-panel-subtitle {
    margin: 4px 0 0;
    color: var(--p-muted);
    font-size: 9px;
}

.dashboard-premium .dashboard-panel-mark {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    margin-left: auto;
    border: 1px solid rgba(128, 0, 32, .1);
    border-radius: 10px;
    color: var(--p-primary);
    background: rgba(128, 0, 32, .055);
    font-size: 15px;
    font-weight: 700;
}

.dashboard-premium .task-panel-mark {
    border-color: rgba(33, 133, 103, .14);
    color: #218567;
    background: #edf8f3;
}

.dashboard-premium .event-list {
    display: grid;
    gap: 10px;
    padding: 14px;
}

.dashboard-premium .event-showcase {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 15px;
    border: 1px solid #edf0f5;
    border-radius: 12px;
    background: linear-gradient(130deg, #fff, #fcf9fb);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.dashboard-premium .event-showcase:hover {
    transform: translateY(-2px);
    border-color: rgba(128, 0, 32, .18);
    box-shadow: 0 9px 20px rgba(20, 28, 48, .07);
}

.dashboard-premium .event-showcase .event-symbol {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border: 1px solid rgba(128, 0, 32, .08);
    border-radius: 12px;
    color: var(--p-primary);
    background: #f8e9ee;
    font-size: 16px;
}

.dashboard-premium .event-showcase .event-info {
    gap: 5px;
}

.dashboard-premium .event-showcase .event-info strong {
    color: var(--p-ink);
    font: 750 12px/1.4 var(--p-font);
}

.dashboard-premium .event-showcase .event-info small {
    overflow: hidden;
    color: var(--p-muted);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-premium .event-showcase > .status-badge {
    max-width: 125px;
    overflow: hidden;
    padding: 6px 9px;
    font-size: 8px;
    text-overflow: ellipsis;
}

.dashboard-premium .event-showcase .event-progress {
    display: flex;
    width: auto;
    grid-column: 1 / -1;
    flex-direction: column;
    gap: 7px;
    padding-top: 2px;
}

.dashboard-premium .event-progress-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.dashboard-premium .event-showcase .event-progress-meta small {
    color: var(--p-muted);
    font-size: 9px;
}

.dashboard-premium .event-showcase .event-progress-meta strong {
    color: var(--p-primary);
    font: 800 11px/1 var(--p-font);
    font-variant-numeric: tabular-nums;
}

.dashboard-premium .event-showcase .progress-line {
    height: 6px;
    border-radius: 99px;
    background: #f0e9ed;
}

.dashboard-premium .event-showcase .progress-line i {
    border-radius: inherit;
    background: linear-gradient(90deg, #800020, #c16c81);
    transition: width .5s ease;
}

.dashboard-premium .task-table-wrap {
    padding: 0 12px 12px;
    scrollbar-color: #d8dce7 transparent;
    scrollbar-width: thin;
}

.dashboard-premium .task-table {
    min-width: 650px;
    border-collapse: separate;
    border-spacing: 0 5px;
    color: var(--p-ink-soft);
    font-size: 9px;
}

.dashboard-premium .task-table thead th {
    padding: 11px 9px 8px;
    border-bottom: 1px solid #edf0f5;
    color: #929bad;
    font-size: 8px;
    letter-spacing: .1em;
}

.dashboard-premium .task-table tbody td {
    padding: 10px 9px;
    border-top: 1px solid #f0f2f6;
    border-bottom: 1px solid #f0f2f6;
    background: #fff;
    vertical-align: middle;
}

.dashboard-premium .task-table tbody td:first-child {
    border-left: 1px solid #f0f2f6;
    border-radius: 9px 0 0 9px;
}

.dashboard-premium .task-table tbody td:last-child {
    border-right: 1px solid #f0f2f6;
    border-radius: 0 9px 9px 0;
}

.dashboard-premium .task-table tbody tr {
    transition: transform .18s ease, filter .18s ease;
}

.dashboard-premium .task-table tbody tr:hover {
    transform: translateY(-1px);
    filter: drop-shadow(0 5px 8px rgba(20, 28, 48, .055));
}

.dashboard-premium .task-table .task-title {
    max-width: 270px;
    color: var(--p-ink);
    font-size: 9px;
    font-weight: 700;
    line-height: 1.5;
}

.dashboard-premium .task-milestone {
    display: block;
    max-width: 270px;
    overflow: hidden;
    margin-top: 3px;
    color: var(--p-muted);
    font-size: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-premium .task-event-name {
    display: block;
    max-width: 140px;
    overflow: hidden;
    color: var(--p-ink-soft);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-premium .task-assignee {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.dashboard-premium .task-assignee-avatar {
    display: grid;
    width: 23px;
    height: 23px;
    flex: 0 0 23px;
    place-items: center;
    border: 1px solid #e9e6f2;
    border-radius: 8px;
    color: #6656a8;
    background: #f2effb;
    font-size: 9px;
    font-weight: 800;
}

.dashboard-premium .task-due-date {
    display: inline-flex;
    align-items: center;
    padding: 5px 7px;
    border: 1px solid #edf0f5;
    border-radius: 7px;
    color: var(--p-ink-soft);
    background: #fafbfc;
    font-size: 8px;
    font-weight: 650;
    white-space: nowrap;
}

.dashboard-premium .task-due-date.is-overdue {
    border-color: #f5d8db;
    color: #bf4751;
    background: #fff2f3;
}

.dashboard-premium .task-table .status-badge {
    padding: 5px 8px;
    font-size: 8px;
}

@media (max-width: 600px) {
    .dashboard-premium .panel-head-bordered {
        min-height: 76px;
        padding: 13px 14px;
    }

    .dashboard-premium .event-list {
        padding: 11px;
    }

    .dashboard-premium .event-showcase {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
    }

    .dashboard-premium .event-showcase .event-symbol {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
    }

    .dashboard-premium .event-showcase > .status-badge {
        grid-column: 2;
        grid-row: 2;
        max-width: max-content;
    }

    .dashboard-premium .event-showcase .event-progress {
        grid-row: 3;
    }

    .dashboard-premium .task-table-wrap {
        padding: 0 8px 10px;
    }

    .dashboard-premium .task-table-wrap {
        overflow: visible;
    }

    .dashboard-premium .task-table {
        display: block;
        min-width: 0;
        border-spacing: 0;
    }

    .dashboard-premium .task-table thead {
        display: none;
    }

    .dashboard-premium .task-table tbody {
        display: grid;
        gap: 8px;
    }

    .dashboard-premium .task-table tbody tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 3px 10px;
        padding: 8px 10px;
        border: 1px solid #edf0f5;
        border-radius: 10px;
        background: #fff;
    }

    .dashboard-premium .task-table tbody tr:hover {
        transform: none;
        filter: none;
        border-color: rgba(128, 0, 32, .18);
        box-shadow: 0 6px 16px rgba(20, 28, 48, .055);
    }

    .dashboard-premium .task-table tbody td,
    .dashboard-premium .task-table tbody td:first-child,
    .dashboard-premium .task-table tbody td:last-child {
        display: flex;
        min-width: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 6px 2px;
        border: 0;
        border-radius: 0;
        background: transparent;
    }

    .dashboard-premium .task-table tbody td:first-child {
        grid-column: 1 / -1;
        padding-bottom: 8px;
        border-bottom: 1px solid #f0f2f6;
    }

    .dashboard-premium .task-table tbody td::before {
        color: var(--p-muted);
        content: attr(data-label);
        font-size: 7px;
        font-weight: 800;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .dashboard-premium .task-table .task-title,
    .dashboard-premium .task-milestone {
        max-width: 100%;
        white-space: normal;
    }

    .dashboard-premium .task-table .task-title {
        font-size: 10px;
    }

    .dashboard-premium .task-table .task-milestone {
        font-size: 8px;
    }
}

.dashboard-premium .sponsor-pipeline-panel {
    position: relative;
    margin: 0 0 18px;
    padding: 21px 22px 16px;
    overflow: hidden;
    border: 1px solid var(--p-line);
    border-radius: var(--p-radius);
    background:
        radial-gradient(260px 150px at 100% 0%, rgba(128, 0, 32, .055), transparent 75%),
        rgba(255, 255, 255, .88);
    box-shadow: var(--p-shadow);
}

.dashboard-premium .sponsor-pipeline-heading,
.dashboard-premium .sponsor-heading-copy,
.dashboard-premium .sponsor-pipeline-summary,
.dashboard-premium .sponsor-summary-total {
    display: flex;
    align-items: center;
}

.dashboard-premium .sponsor-pipeline-heading {
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 19px;
}

.dashboard-premium .sponsor-heading-copy {
    min-width: 0;
    gap: 12px;
}

.dashboard-premium .sponsor-heading-icon {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border: 1px solid rgba(128, 0, 32, .1);
    border-radius: 13px;
    color: var(--p-primary);
    background: #f8e9ee;
    font-size: 19px;
    font-weight: 800;
}

.dashboard-premium .sponsor-heading-copy .eyebrow {
    margin-bottom: 4px;
    color: var(--p-primary);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .15em;
}

.dashboard-premium .sponsor-heading-copy h2 {
    margin: 0;
    color: var(--p-ink);
    font: 800 15px/1.35 var(--p-font);
    letter-spacing: -.02em;
}

.dashboard-premium .sponsor-heading-copy p {
    margin: 4px 0 0;
    color: var(--p-muted);
    font-size: 10px;
}

.dashboard-premium .sponsor-heading-count {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    padding: 8px 11px;
    border: 1px solid #edf0f5;
    border-radius: 10px;
    background: rgba(255, 255, 255, .78);
}

.dashboard-premium .sponsor-heading-count strong {
    color: var(--p-ink);
    font: 800 17px/1 var(--p-font);
}

.dashboard-premium .sponsor-heading-count span {
    color: var(--p-muted);
    font-size: 8px;
    font-weight: 650;
}

.dashboard-premium .sponsor-pipeline-steps {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    padding: 1px 0 17px;
}

.dashboard-premium .sponsor-stage {
    --sponsor-stage-color: #800020;
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 134px;
    flex-direction: column;
    align-items: flex-start;
    padding: 12px 12px 11px;
    border: 1px solid #edf0f5;
    border-top: 2px solid var(--sponsor-stage-color);
    border-radius: 11px;
    background: linear-gradient(150deg, #fff, #fbfcfe);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.dashboard-premium .sponsor-stage:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--sponsor-stage-color) 22%, #edf0f5);
    box-shadow: 0 9px 20px rgba(20, 28, 48, .065);
}

.dashboard-premium .sponsor-stage:not(:last-child)::after {
    position: absolute;
    top: 26px;
    right: -12px;
    z-index: 2;
    width: 13px;
    height: 1px;
    background: #cfd5e0;
    content: "";
}

.dashboard-premium .sponsor-stage-top {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

.dashboard-premium .sponsor-stage-icon {
    display: grid;
    width: 27px;
    height: 27px;
    place-items: center;
    border-radius: 8px;
    color: var(--sponsor-stage-color);
    background: color-mix(in srgb, var(--sponsor-stage-color) 9%, white);
    font-size: 13px;
}

.dashboard-premium .sponsor-stage-index {
    color: #b0b7c4;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .08em;
}

.dashboard-premium .sponsor-stage-label {
    overflow: hidden;
    width: 100%;
    margin-top: 10px;
    color: var(--p-ink-soft);
    font-size: 9px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-premium .sponsor-stage-count {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin-top: 3px;
    color: var(--p-ink);
    font: 800 19px/1.15 var(--p-font);
    font-variant-numeric: tabular-nums;
}

.dashboard-premium .sponsor-stage-count small {
    color: var(--p-muted);
    font: 600 8px/1 var(--sans);
}

.dashboard-premium .sponsor-stage-track {
    display: block;
    width: 100%;
    height: 4px;
    margin-top: auto;
    overflow: hidden;
    border-radius: 999px;
    background: #edf0f5;
}

.dashboard-premium .sponsor-stage-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--sponsor-stage-color);
    transition: width .45s ease;
}

.dashboard-premium .stage-prospecting {
    --sponsor-stage-color: #5e63b6;
}

.dashboard-premium .stage-contacted {
    --sponsor-stage-color: #3979a7;
}

.dashboard-premium .stage-negotiation {
    --sponsor-stage-color: #b47a2b;
}

.dashboard-premium .stage-committed,
.dashboard-premium .stage-fulfilled {
    --sponsor-stage-color: #218567;
}

.dashboard-premium .stage-declined {
    --sponsor-stage-color: #c54752;
}

.dashboard-premium .sponsor-pipeline-empty {
    display: flex;
    min-height: 116px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 16px;
    padding: 18px;
    border: 1px dashed #dfe4ed;
    border-radius: 12px;
    background: rgba(255, 255, 255, .6);
}

.dashboard-premium .sponsor-pipeline-empty > span {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 11px;
    color: var(--p-primary);
    background: #f8e9ee;
    font-size: 20px;
}

.dashboard-premium .sponsor-pipeline-empty strong {
    color: var(--p-ink);
    font-size: 11px;
}

.dashboard-premium .sponsor-pipeline-empty p {
    margin: 4px 0 0;
    color: var(--p-muted);
    font-size: 9px;
}

.dashboard-premium .sponsor-pipeline-summary {
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid #e3f0e9;
    border-radius: 11px;
    background: linear-gradient(110deg, #f2faf6, #fff 75%);
}

.dashboard-premium .sponsor-summary-total {
    min-width: 0;
    gap: 10px;
}

.dashboard-premium .sponsor-summary-icon {
    display: grid;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    place-items: center;
    border: 1px solid #e0efe7;
    border-radius: 9px;
    color: #218567;
    background: #fff;
    font-size: 13px;
}

.dashboard-premium .sponsor-summary-total > span:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.dashboard-premium .sponsor-summary-total small,
.dashboard-premium .sponsor-summary-active span {
    color: var(--p-muted);
    font-size: 8px;
}

.dashboard-premium .sponsor-summary-total strong {
    overflow: hidden;
    color: #218567;
    font: 800 15px/1.2 var(--p-font);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-premium .sponsor-summary-active {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    padding-left: 14px;
    border-left: 1px solid #dfebe4;
}

.dashboard-premium .sponsor-summary-active strong {
    color: var(--p-ink);
    font: 800 15px/1 var(--p-font);
}

@media (max-width: 900px) {
    .dashboard-premium .sponsor-pipeline-steps {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        row-gap: 10px;
    }

    .dashboard-premium .sponsor-stage:not(:last-child)::after {
        display: none;
    }
}

@media (max-width: 600px) {
    .dashboard-premium .sponsor-pipeline-panel {
        padding: 16px 14px 13px;
    }

    .dashboard-premium .sponsor-pipeline-heading {
        align-items: flex-start;
        gap: 8px;
    }

    .dashboard-premium .sponsor-heading-copy {
        align-items: flex-start;
        gap: 9px;
    }

    .dashboard-premium .sponsor-heading-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
        font-size: 16px;
    }

    .dashboard-premium .sponsor-heading-copy h2 {
        font-size: 13px;
    }

    .dashboard-premium .sponsor-heading-copy p {
        max-width: 230px;
        font-size: 9px;
        line-height: 1.45;
    }

    .dashboard-premium .sponsor-heading-count {
        padding: 7px 8px;
    }

    .dashboard-premium .sponsor-pipeline-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding-bottom: 13px;
    }

    .dashboard-premium .sponsor-stage {
        min-height: 120px;
        padding: 10px;
    }

    .dashboard-premium .sponsor-pipeline-summary {
        padding: 10px;
    }

    .dashboard-premium .sponsor-summary-total {
        gap: 7px;
    }

    .dashboard-premium .sponsor-summary-total strong,
    .dashboard-premium .sponsor-summary-active strong {
        font-size: 12px;
    }

    .dashboard-premium .sponsor-summary-active {
        padding-left: 9px;
    }
}
