.office-landing .bcc-demo { --b-bg:#fff;--b-sidebar:#f7f7f7;--b-soft:#fafafa;--b-hover:#eee;--b-selected:#e7e7e7;--b-ink:#171717;--b-text:#414141;--b-muted:#737373;--b-line:#e5e5e5;--b-control:#d9d9d9;--b-primary:#262626;--b-onprimary:#fff;--b-blue:#335f8a;--b-blue-bg:#edf4fb;--b-green:#27713f;--b-green-bg:#edf7ef;--b-amber:#8a5d15;--b-amber-bg:#fff7e6;--b-red:#aa3a29;--b-red-bg:#fff0ed;--b-chart:#3c4c5e;--b-chart2:#b8c4cf;--b-shadow:#0002;color:var(--b-ink);font:400 14px/1.55 var(--bihub-font-family,"Be Vietnam Pro",sans-serif);min-width:0;width:100%;text-align:left;color-scheme:light }
.office-landing .bcc-demo[data-theme=dark] { --b-bg:#191c20;--b-sidebar:#14171a;--b-soft:#202429;--b-hover:#2c3137;--b-selected:#30363d;--b-ink:#f0f1f2;--b-text:#d0d4d8;--b-muted:#a0a8b0;--b-line:#343a41;--b-control:#49515a;--b-primary:#e4e7ea;--b-onprimary:#202429;--b-blue:#9bc4f0;--b-blue-bg:#223449;--b-green:#97d4a8;--b-green-bg:#203b2b;--b-amber:#efc27a;--b-amber-bg:#3c3020;--b-red:#f2a797;--b-red-bg:#442923;--b-chart:#9eb9d4;--b-chart2:#526375;--b-shadow:#0008;color-scheme:dark }
.office-landing .bcc-demo * { box-sizing:border-box }
.office-landing .bcc-demo h3,
.office-landing .bcc-demo h4,
.office-landing .bcc-demo h5,
.office-landing .bcc-demo p { margin:0;letter-spacing:normal;color:inherit }
.office-landing .bcc-demo h3,
.office-landing .bcc-demo h4,
.office-landing .bcc-demo h5 { font-weight:600 }
.office-landing .bcc-demo button,
.office-landing .bcc-demo input,
.office-landing .bcc-demo select,
.office-landing .bcc-demo textarea { font:inherit;letter-spacing:normal }
.office-landing .bcc-demo button { cursor:pointer }
.office-landing .bcc-demo button:disabled { opacity:.42;cursor:not-allowed }
.office-landing .bcc-demo button:focus-visible,
.office-landing .bcc-demo summary:focus-visible,
.office-landing .bcc-demo [tabindex]:focus-visible,
.office-landing .bcc-demo input:focus-visible,
.office-landing .bcc-demo select:focus-visible,
.office-landing .bcc-demo textarea:focus-visible { outline:2px solid var(--b-blue);outline-offset:3px }
.office-landing .bcc-demo strong { font-weight:600 }
.office-landing .bcc-icon { width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;display:block }
.office-landing .bcc-shell { display:grid;grid-template-columns:232px minmax(0,1fr);border:1px solid var(--b-line);border-radius:8px;background:var(--b-bg);overflow:hidden;min-height:850px }
.office-landing .bcc-sidebar { display:flex;flex-direction:column;gap:0;padding:20px 12px 16px;background:var(--b-sidebar);border-right:1px solid var(--b-line);min-width:0 }
.office-landing .bcc-sidebar-top { padding:0 12px;display:flex;align-items:center;justify-content:space-between }
.office-landing .bcc-wordmark { font-size:21px;font-weight:750;letter-spacing:-.7px;display:flex;align-items:center;gap:10px;color:var(--b-ink) }
.office-landing .bcc-wordmark span { border:1px solid var(--b-control);color:var(--b-muted);font-size:10px;letter-spacing:.5px;font-weight:600;padding:1px 4px;border-radius:4px }
.office-landing .bcc-workspace { display:flex;align-items:center;gap:10px;padding:22px 10px 28px }
.office-landing .bcc-avatar { width:34px;height:34px;border-radius:6px;background:var(--b-selected);color:var(--b-text);display:grid;place-items:center;flex-shrink:0;font-size:11px;font-weight:600 }
.office-landing .bcc-workspace strong { font-size:13px;line-height:1.5;display:block }
.office-landing .bcc-workspace small { display:block;font-size:12px;color:var(--b-muted);margin-top:3px }
.office-landing .bcc-nav-caption { padding:0 10px;font-size:10px;font-weight:600;letter-spacing:.45px;color:var(--b-muted);margin-bottom:10px }
.office-landing .bcc-nav { display:flex;flex-direction:column;gap:4px }
.office-landing .bcc-nav-button { display:flex;align-items:center;gap:9px;border:0;background:transparent;color:var(--b-text);min-height:40px;padding:9px 10px;border-radius:6px;font-size:13px!important;text-align:left;line-height:1.5 }
.office-landing .bcc-nav-button .bcc-icon { width:17px;height:17px }
.office-landing .bcc-nav-button.is-active { background:var(--b-selected);color:var(--b-ink);font-weight:600 }
.office-landing .bcc-nav-button:hover { background:var(--b-hover) }
.office-landing .bcc-sidebar-note { font-size:12px;color:var(--b-muted);line-height:1.7;padding:22px 10px;max-width:210px }
.office-landing .bcc-sidebar-bottom { display:flex;gap:9px;align-items:flex-start;padding:20px 10px 0;margin-top:auto;border-top:1px solid var(--b-line) }
.office-landing .bcc-sidebar-bottom strong { display:block;font-size:12px }
.office-landing .bcc-sidebar-bottom small { display:block;font-size:11px;color:var(--b-muted);line-height:1.6;margin-top:3px }
.office-landing .bcc-sidebar-bottom .bcc-avatar { border-radius:50% }
.office-landing .bcc-workspace-main { min-width:0;background:var(--b-bg) }
.office-landing .bcc-topbar { height:56px;padding:0 24px;border-bottom:1px solid var(--b-line);display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--b-bg) }
.office-landing .bcc-topbar-context { display:flex;align-items:center;gap:9px;min-width:0;font-size:12px;color:var(--b-muted) }
.office-landing .bcc-topbar-context strong { color:var(--b-text);white-space:nowrap }
.office-landing .bcc-topbar-divider { color:var(--b-control) }
.office-landing .bcc-demo-label { display:flex;align-items:center;gap:6px;font-size:11px;color:var(--b-muted);white-space:nowrap }
.office-landing .bcc-demo-label i { height:5px;width:5px;background:var(--b-muted);border-radius:50% }
.office-landing .bcc-page { padding:24px;min-width:0;position:relative }
.office-landing .bcc-page-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px }
.office-landing .bcc-role { font-size:12px;color:var(--b-muted);margin-bottom:6px }
.office-landing .bcc-page-heading h3 { font-size:23px;line-height:1.4;font-weight:650;color:var(--b-ink) }
.office-landing .bcc-page-heading h3:focus { outline:none }
.office-landing .bcc-page-heading p { font-size:14px;color:var(--b-muted);line-height:1.65;margin-top:7px;max-width:650px }
.office-landing .bcc-heading-actions { display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:22px;flex-shrink:0 }
.office-landing .bcc-button { display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:7px 11px;border:1px solid var(--b-control);border-radius:6px;background:var(--b-bg);color:var(--b-text);font-size:13px!important;font-weight:500;line-height:1.5;white-space:nowrap;text-decoration:none }
.office-landing .bcc-button:hover { background:var(--b-hover) }
.office-landing .bcc-button-primary { background:var(--b-primary);color:var(--b-onprimary);border-color:var(--b-primary) }
.office-landing .bcc-button-primary:hover { filter:brightness(.94);background:var(--b-primary) }
.office-landing .bcc-button-danger { color:var(--b-red);border-color:var(--b-red) }
.office-landing .bcc-button .bcc-icon { width:15px;height:15px }
.office-landing .bcc-button-icon,
.office-landing .bcc-icon-button { display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:34px;border:0;border-radius:6px;background:transparent;color:var(--b-text);padding:7px }
.office-landing .bcc-icon-button:hover,
.office-landing .bcc-button-icon:hover { background:var(--b-hover) }
.office-landing .bcc-mobile-menu { display:none }
.office-landing .bcc-inline-button { display:inline-flex;align-items:center;justify-content:flex-start;gap:6px;border:0;background:transparent;color:var(--b-blue);font-size:13px!important;font-weight:500;line-height:1.5;min-height:30px;padding:3px 0;text-align:left }
.office-landing .bcc-inline-button:hover { text-decoration:underline }
.office-landing .bcc-inline-button .bcc-icon { width:14px;height:14px }
.office-landing .bcc-text-button { border:0;background:transparent;color:var(--b-blue);padding:0;text-decoration:underline }
.office-landing .bcc-filter-row { display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:20px }
.office-landing .bcc-context-pill { display:flex;align-items:center;gap:10px;min-height:36px;border:1px solid var(--b-control);border-radius:6px;padding:6px 10px;font-size:12px;background:var(--b-bg) }
.office-landing .bcc-context-pill>span { color:var(--b-muted) }
.office-landing .bcc-context-pill>strong { color:var(--b-text);font-size:12px }
.office-landing .bcc-filter-spacer { flex:1 }
.office-landing .bcc-filter-label { display:flex;align-items:center;gap:10px;color:var(--b-muted);font-size:12px }
.office-landing .bcc-badge { display:inline-flex;align-items:center;justify-content:center;gap:4px;max-width:100%;border-radius:5px;background:var(--b-hover);color:var(--b-text);padding:3px 7px;font-size:12px;line-height:1.5;font-weight:500;white-space:nowrap }
.office-landing .bcc-badge-green { background:var(--b-green-bg);color:var(--b-green) }
.office-landing .bcc-badge-amber { background:var(--b-amber-bg);color:var(--b-amber) }
.office-landing .bcc-badge-red { background:var(--b-red-bg);color:var(--b-red) }
.office-landing .bcc-badge-blue { background:var(--b-blue-bg);color:var(--b-blue) }
.office-landing .bcc-muted { color:var(--b-muted) }
.office-landing .bcc-notice { display:flex;align-items:flex-start;gap:10px;border:1px solid var(--b-line);background:var(--b-soft);border-radius:6px;padding:14px;margin-bottom:20px;color:var(--b-text);font-size:13px;line-height:1.7 }
.office-landing .bcc-notice>.bcc-icon { width:17px;height:17px;margin-top:3px;color:var(--b-muted) }
.office-landing .bcc-notice strong { font-size:13px }
.office-landing .bcc-notice p { font-size:13px;line-height:1.7;margin-top:4px;color:var(--b-muted) }
.office-landing .bcc-notice-warning { background:var(--b-amber-bg);border-color:color-mix(in srgb,var(--b-amber) 20%,var(--b-line)) }
.office-landing .bcc-notice-warning>.bcc-icon { color:var(--b-amber) }
.office-landing .bcc-notice-success { background:var(--b-green-bg) }
.office-landing .bcc-notice-success>.bcc-icon { color:var(--b-green) }
.office-landing .bcc-kpis { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:20px }
.office-landing .bcc-kpi { border:1px solid var(--b-line);border-radius:7px;background:var(--b-bg);padding:16px;min-width:0 }
.office-landing .bcc-kpi-label { font-size:13px;color:var(--b-muted);font-weight:500 }
.office-landing .bcc-kpi-value { font-size:28px;font-weight:650;letter-spacing:-.7px;line-height:1.4;margin-top:8px;white-space:nowrap }
.office-landing .bcc-kpi-value small { font-size:12px;font-weight:400;letter-spacing:0;color:var(--b-muted) }
.office-landing .bcc-kpi-note { font-size:12px;color:var(--b-muted);margin-top:7px }
.office-landing .bcc-kpi-plan { display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:var(--b-muted);margin-top:15px }
.office-landing .bcc-attainment { height:4px;background:var(--b-line);border-radius:3px;overflow:hidden;margin-top:8px }
.office-landing .bcc-attainment>span { display:block;height:100%;background:var(--b-text);border-radius:3px }
.office-landing .bcc-kpi-source { font-size:11px;color:var(--b-muted);display:block;margin-top:9px }
.office-landing .bcc-kpi-secondary { border-top:1px solid var(--b-line);padding-top:13px;margin-top:18px;font-size:12px;color:var(--b-muted);line-height:1.7 }
.office-landing .bcc-panel { border:1px solid var(--b-line);border-radius:7px;margin-bottom:20px;background:var(--b-bg);min-width:0;overflow:hidden }
.office-landing .bcc-panel-heading { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;min-width:0 }
.office-landing .bcc-panel-heading h4 { font-size:16px;font-weight:600;line-height:1.5;color:var(--b-ink) }
.office-landing .bcc-panel-heading p { font-size:12px;color:var(--b-muted);line-height:1.65;margin-top:4px }
.office-landing .bcc-panel-body { padding:0 16px 18px;font-size:14px;line-height:1.7;color:var(--b-text);min-width:0 }
.office-landing .bcc-panel-body>p+p { margin-top:14px }
.office-landing .bcc-panel-body>p.bcc-muted { font-size:13px }
.office-landing .bcc-chart { padding:0 14px;overflow:auto;max-width:100%;scrollbar-width:thin }
.office-landing .bcc-chart svg { display:block;width:100%;height:auto;min-width:500px;font-family:var(--bihub-font-family,"Be Vietnam Pro",sans-serif) }
.office-landing .bcc-chart svg text { font-size:12px;fill:var(--b-muted) }
.office-landing .bcc-chart-grid { stroke:var(--b-line) }
.office-landing .bcc-chart-revenue { fill:var(--b-chart) }
.office-landing .bcc-chart-cost { fill:var(--b-chart2) }
.office-landing .bcc-chart-legend { display:flex;align-items:center;gap:14px;font-size:12px;color:var(--b-muted) }
.office-landing .bcc-chart-legend>span { display:flex;align-items:center;gap:5px;white-space:nowrap }
.office-landing .bcc-chart-legend i { height:9px;width:9px;background:var(--b-chart);border-radius:2px }
.office-landing .bcc-chart-legend>span:last-child i { background:var(--b-chart2) }
.office-landing .bcc-chart-footer { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:13px 16px;border-top:1px solid var(--b-line);color:var(--b-muted);font-size:12px }
.office-landing .bcc-chart-data { border-top:1px solid var(--b-line) }
.office-landing .bcc-chart-data summary { padding:12px 16px;color:var(--b-text);font-size:12px;cursor:pointer }
.office-landing .bcc-table-scroll { overflow:auto;max-width:100%;min-width:0;scrollbar-width:thin }
.office-landing .bcc-table { width:100%;min-width:650px;border-collapse:collapse;text-align:left;font-size:13px;white-space:nowrap }
.office-landing .bcc-table th,
.office-landing .bcc-table td { height:44px;padding:11px 14px;border-top:1px solid var(--b-line);vertical-align:middle;font-weight:400;color:var(--b-text);line-height:1.6 }
.office-landing .bcc-table thead th { font-size:12px;font-weight:500;color:var(--b-muted);background:var(--b-soft) }
.office-landing .bcc-table tbody th { font-weight:500;color:var(--b-text) }
.office-landing .bcc-table tbody tr:hover { background:var(--b-soft) }
.office-landing .bcc-table .bcc-button { font-size:12px!important;min-height:30px;padding:4px 8px }
.office-landing .bcc-number { text-align:right!important;font-variant-numeric:tabular-nums }
.office-landing .bcc-error-cell { display:inline-block;padding:3px 6px;background:var(--b-red-bg);color:var(--b-red);border-radius:3px }
.office-landing .bcc-split { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;min-width:0 }
.office-landing .bcc-attention-row { display:flex;align-items:flex-start;gap:9px;padding:13px 0;border-bottom:1px solid var(--b-line) }
.office-landing .bcc-attention-row:last-child { border-bottom:0;padding-bottom:0 }
.office-landing .bcc-attention-row>.bcc-icon { height:16px;width:16px;color:var(--b-amber);margin-top:3px }
.office-landing .bcc-attention-row>div { flex:1;min-width:0 }
.office-landing .bcc-attention-row strong { font-size:13px;line-height:1.7 }
.office-landing .bcc-attention-row small { display:block;font-size:12px;color:var(--b-muted);margin-top:4px }
.office-landing .bcc-attention-row .bcc-badge { font-size:11px }
.office-landing .bcc-stats { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:20px }
.office-landing .bcc-stat { border:1px solid var(--b-line);border-radius:7px;padding:15px;background:var(--b-bg);min-width:0 }
.office-landing .bcc-stat>span { font-size:12px;color:var(--b-muted);display:block;min-height:36px }
.office-landing .bcc-stat>strong { font-size:26px;font-weight:600;margin-top:4px;display:block;line-height:1.3 }
.office-landing .bcc-search { position:relative;display:flex;align-items:center;min-width:240px;flex:1;max-width:430px }
.office-landing .bcc-search>.bcc-icon { position:absolute;left:10px;width:16px;height:16px;color:var(--b-muted);pointer-events:none }
.office-landing .bcc-search>.bcc-input { padding-left:34px }
.office-landing .bcc-input,
.office-landing .bcc-select,
.office-landing .bcc-textarea { display:block;width:100%;min-width:0;border:1px solid var(--b-control);border-radius:6px;background:var(--b-bg);color:var(--b-text);font-size:13px!important;line-height:1.5;min-height:36px;padding:7px 10px;box-shadow:none }
.office-landing .bcc-input::placeholder,
.office-landing .bcc-textarea::placeholder { color:var(--b-muted);opacity:.85 }
.office-landing .bcc-select { padding-right:28px }
.office-landing .bcc-filter-label .bcc-select { width:auto;min-width:145px }
.office-landing .bcc-textarea { resize:vertical;min-height:110px }
.office-landing .bcc-input[aria-invalid=true],
.office-landing .bcc-textarea[aria-invalid=true] { border-color:var(--b-red) }
.office-landing .bcc-department-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px }
.office-landing .bcc-department-card { border:1px solid var(--b-line);border-radius:7px;background:var(--b-bg);padding:16px;min-width:0 }
.office-landing .bcc-card-heading { display:flex;align-items:center;gap:10px }
.office-landing .bcc-unit-mark { height:38px;min-width:38px;border-radius:6px;background:var(--b-soft);border:1px solid var(--b-line);display:grid;place-items:center;color:var(--b-muted);font-size:10px;letter-spacing:.3px }
.office-landing .bcc-card-heading h4 { font-size:16px;font-weight:600;line-height:1.5 }
.office-landing .bcc-card-heading p { font-size:12px;color:var(--b-muted);margin-top:3px }
.office-landing .bcc-department-scope { font-size:13px;color:var(--b-muted)!important;min-height:42px;margin-top:16px!important }
.office-landing .bcc-department-owner { font-size:12px;color:var(--b-text);margin-top:7px }
.office-landing .bcc-department-metric { margin-top:16px;padding-top:14px;border-top:1px solid var(--b-line) }
.office-landing .bcc-department-metric>span { display:block;font-size:12px;color:var(--b-muted) }
.office-landing .bcc-department-metric strong { display:block;font-size:16px;margin-top:5px;font-weight:600;overflow-wrap:anywhere }
.office-landing .bcc-card-footer { display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px }
.office-landing .bcc-card-footer .bcc-badge { font-size:11px;white-space:normal }
.office-landing .bcc-card-footer .bcc-button { min-height:32px;font-size:12px!important;padding:5px 9px }
.office-landing .bcc-empty { padding:36px 20px;text-align:center;grid-column:1/-1;color:var(--b-muted) }
.office-landing .bcc-empty>.bcc-icon { height:24px;width:24px;margin:0 auto 13px }
.office-landing .bcc-empty h4 { font-size:16px;color:var(--b-text);font-weight:600 }
.office-landing .bcc-empty p { margin-top:8px;font-size:13px }
.office-landing .bcc-file-panel { display:flex;align-items:center;gap:12px;padding:15px;border:1px solid var(--b-line);background:var(--b-soft);border-radius:6px;margin-bottom:18px;min-width:0 }
.office-landing .bcc-file-panel>.bcc-icon { width:26px;height:26px;color:var(--b-muted) }
.office-landing .bcc-file-panel>div { min-width:0 }
.office-landing .bcc-file-panel strong { font-size:13px;display:block;overflow-wrap:anywhere }
.office-landing .bcc-file-panel small { display:block;font-size:12px;color:var(--b-muted);line-height:1.7;margin-top:4px }
.office-landing .bcc-source-note { padding:15px 0;font-size:12px;color:var(--b-muted);line-height:1.8 }
.office-landing .bcc-form-actions { display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px }
.office-landing .bcc-form-actions .bcc-help { flex:1;min-width:210px }
.office-landing .bcc-demo-note { font-size:12px!important;color:var(--b-muted);line-height:1.8!important;margin-top:16px!important }
.office-landing .bcc-progressbar { height:7px;background:var(--b-line);border-radius:6px;overflow:hidden;margin:0 16px 20px }
.office-landing .bcc-progressbar>span { display:block;height:100%;background:var(--b-chart);border-radius:6px;transition:width .35s ease }
.office-landing .bcc-workflow-steps { display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding:0 16px 18px;font-size:12px;color:var(--b-muted) }
.office-landing .bcc-announcement-layout { grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);align-items:start }
.office-landing .bcc-form-field { margin-bottom:18px;min-width:0 }
.office-landing .bcc-form-field>label { display:block;font-size:13px;font-weight:500;color:var(--b-text);margin-bottom:7px }
.office-landing .bcc-form-field>label>span,
.office-landing .bcc-recipient-fieldset legend>span { color:var(--b-red) }
.office-landing .bcc-form-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px }
.office-landing .bcc-form-error { display:block;font-size:12px;color:var(--b-red);line-height:1.7;margin-top:6px }
.office-landing .bcc-help { font-size:12px!important;color:var(--b-muted);line-height:1.7 }
.office-landing .bcc-recipient-fieldset { border:0;padding:0;margin:0 0 20px;min-width:0 }
.office-landing .bcc-recipient-fieldset legend { font-size:13px;font-weight:500;color:var(--b-text);padding:0;margin-bottom:4px }
.office-landing .bcc-recipient-toolbar { display:flex;align-items:center;gap:8px;margin:12px 0;font-size:12px;color:var(--b-muted);flex-wrap:wrap }
.office-landing .bcc-recipient-toolbar .bcc-button { min-height:30px;font-size:12px!important;padding:4px 8px }
.office-landing .bcc-recipient-toolbar>span { margin-left:auto }
.office-landing .bcc-recipient-grid { display:grid;grid-template-columns:1fr 1fr;gap:8px }
.office-landing .bcc-recipient-option { border:1px solid var(--b-line);background:var(--b-bg);border-radius:6px;padding:10px;display:flex;gap:8px;align-items:flex-start;cursor:pointer;min-width:0 }
.office-landing .bcc-recipient-option:has(input:checked) { border-color:var(--b-blue);background:var(--b-blue-bg) }
.office-landing .bcc-recipient-option input,
.office-landing .bcc-checkbox input { width:16px;height:16px;accent-color:var(--b-primary);margin:3px 0 0;flex-shrink:0 }
.office-landing .bcc-recipient-option strong { font-size:12px;display:block;font-weight:500 }
.office-landing .bcc-recipient-option small { display:block;font-size:11px;color:var(--b-muted);margin-top:4px }
.office-landing .bcc-history-item { padding:14px 0;border-bottom:1px solid var(--b-line);display:flex;flex-direction:column;align-items:flex-start;gap:8px }
.office-landing .bcc-history-item:first-child { padding-top:0 }
.office-landing .bcc-history-item:last-child { padding-bottom:0;border-bottom:0 }
.office-landing .bcc-history-item strong { font-size:13px;line-height:1.7;overflow-wrap:anywhere }
.office-landing .bcc-history-item small { font-size:12px;color:var(--b-muted);line-height:1.7 }
.office-landing .bcc-history-item .bcc-button { font-size:12px!important;min-height:32px }
.office-landing .bcc-policy-grid { display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;align-items:center }
.office-landing .bcc-policy-grid>.bcc-form-field { margin:0 }
.office-landing .bcc-checkbox { display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.7;color:var(--b-text);cursor:pointer }
.office-landing .bcc-alert-list { display:flex;flex-direction:column;gap:16px }
.office-landing .bcc-alert-card { border:1px solid var(--b-line);border-radius:7px;padding:18px;background:var(--b-bg);min-width:0 }
.office-landing .bcc-alert-header { display:flex;align-items:flex-start;gap:10px }
.office-landing .bcc-alert-header>.bcc-icon { margin-top:3px;color:var(--b-amber) }
.office-landing .bcc-alert-header>div { flex:1;min-width:0 }
.office-landing .bcc-alert-header h4 { font-size:15px;font-weight:600;line-height:1.6 }
.office-landing .bcc-alert-header p { font-size:12px;color:var(--b-muted);line-height:1.8;margin-top:5px;overflow-wrap:anywhere }
.office-landing .bcc-alert-meta { display:flex;gap:9px 22px;flex-wrap:wrap;font-size:12px;color:var(--b-muted);border-top:1px solid var(--b-line);padding-top:14px;margin-top:14px }
.office-landing .bcc-alert-meta strong { color:var(--b-text);font-weight:500 }
.office-landing .bcc-alert-actions { display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px }
.office-landing .bcc-alert-actions .bcc-button { font-size:12px!important }
.office-landing .bcc-condition-note { font-size:12px;color:var(--b-blue)!important;margin-top:12px!important;line-height:1.8 }
.office-landing .bcc-alert-action-text { font-size:13px;color:var(--b-text);line-height:1.8;margin-top:12px!important;overflow-wrap:anywhere }
.office-landing .bcc-subheading { font-size:14px;font-weight:600;margin:22px 0 10px!important }
.office-landing .bcc-description-list { display:flex;flex-direction:column;gap:13px;margin:16px 0 22px;padding:0;font-size:13px;line-height:1.75 }
.office-landing .bcc-description-list>div { display:grid;grid-template-columns:120px minmax(0,1fr);gap:12px }
.office-landing .bcc-description-list dt { color:var(--b-muted) }
.office-landing .bcc-description-list dd { margin:0;color:var(--b-text);overflow-wrap:anywhere }
.office-landing .bcc-description-list dd small { display:block;font-size:12px;color:var(--b-muted);margin-top:3px }
.office-landing .bcc-message-preview { padding:16px;border:1px solid var(--b-line);background:var(--b-soft);border-radius:6px;line-height:1.8;font-size:14px;color:var(--b-text);overflow-wrap:anywhere }
.office-landing .bcc-recipient-preview { display:flex;flex-direction:column;gap:0 }
.office-landing .bcc-recipient-preview>div { display:flex;flex-direction:column;align-items:flex-start;gap:5px;border-bottom:1px solid var(--b-line);padding:12px 0 }
.office-landing .bcc-recipient-preview>div:last-child { border:0 }
.office-landing .bcc-recipient-preview strong { font-size:13px }
.office-landing .bcc-recipient-preview span:not(.bcc-badge) { font-size:12px;color:var(--b-muted) }
.office-landing .bcc-drawer,
.office-landing .bcc-dialog { font-family:var(--bihub-font-family,"Be Vietnam Pro",sans-serif);color:var(--b-ink);background:var(--b-bg);border:1px solid var(--b-line);box-shadow:0 18px 70px var(--b-shadow);padding:0;border-radius:8px }
.office-landing .bcc-drawer::backdrop,
.office-landing .bcc-dialog::backdrop { background:#10131780 }
.office-landing .bcc-dialog { width:min(640px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto }
.office-landing .bcc-dialog[data-mode=detail] { width:min(620px,calc(100vw - 24px));height:100dvh;max-height:none;margin:0 0 0 auto;border-radius:0 }
.office-landing .bcc-dialog-heading { display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:20px;border-bottom:1px solid var(--b-line) }
.office-landing .bcc-dialog-heading>div { flex:1;min-width:0 }
.office-landing .bcc-dialog-heading h4 { font-size:18px;font-weight:600;color:var(--b-ink);line-height:1.5 }
.office-landing .bcc-dialog-heading p { font-size:12px;color:var(--b-muted);line-height:1.7;margin-top:6px }
.office-landing .bcc-dialog-body { padding:20px;line-height:1.7 }
.office-landing .bcc-dialog-body>.bcc-description-list:first-child { margin-top:0 }
.office-landing .bcc-dialog-body>.bcc-checkbox { margin-top:18px }
.office-landing .bcc-dialog-footer { display:flex;justify-content:flex-end;align-items:center;gap:10px;flex-wrap:wrap;padding:16px 20px;background:var(--b-soft);border-top:1px solid var(--b-line) }
.office-landing .bcc-dialog-body .bcc-panel { margin-top:20px }
.office-landing .bcc-dialog-body .bcc-table { min-width:520px }
.office-landing .bcc-drawer { margin:0 auto 0 0;height:100dvh;max-height:none;width:290px;max-width:calc(100vw - 40px);padding:22px 12px 20px;border-radius:0;background:var(--b-sidebar) }
.office-landing .bcc-drawer[open] { display:flex;flex-direction:column }
.office-landing .bcc-drawer .bcc-nav-button { min-height:44px }
.office-landing .bcc-toast { position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:10000;border:1px solid var(--b-control);border-radius:7px;background:var(--b-primary);color:var(--b-onprimary);box-shadow:0 8px 28px var(--b-shadow);max-width:min(620px,calc(100vw - 32px));padding:13px 18px;font-size:13px;line-height:1.7;animation:bcc-toast-in .2s ease }
.office-landing .bcc-toast[hidden] { display:none }
.office-landing .bcc-sr-only { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap }
.office-landing .bcc-enter { animation:bcc-enter .25s ease }
.office-landing .bcc-enter:before { content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:var(--b-blue);transform-origin:left;animation:bcc-nav-progress .35s ease forwards;pointer-events:none }
@keyframes bcc-enter{from{opacity:.45;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@keyframes bcc-nav-progress{0%{transform:scaleX(.1)}90%{transform:scaleX(1);opacity:1}100%{opacity:0}}
@keyframes bcc-toast-in{from{opacity:0;translate:0 6px}to{opacity:1;translate:0 0}}
@media(max-width:1250px){
  .office-landing .bcc-shell { grid-template-columns:224px minmax(0,1fr) }
  .office-landing .bcc-page { padding:20px }
  .office-landing .bcc-topbar { padding:0 20px }
  .office-landing .bcc-demo-label { font-size:10px }
  .office-landing .bcc-kpi { padding:14px }
  .office-landing .bcc-kpi-value { font-size:25px }
  .office-landing .bcc-kpi-value small { font-size:11px }
  .office-landing .bcc-heading-actions { padding-top:10px }
  .office-landing .bcc-split { grid-template-columns:1fr }
  .office-landing .bcc-announcement-layout { grid-template-columns:minmax(0,1.55fr) minmax(0,1fr) }
  .office-landing .bcc-stats { gap:10px }
  .office-landing .bcc-stat { padding:13px }
  .office-landing .bcc-department-grid { gap:12px }
  .office-landing .bcc-page-heading { gap:14px }
  .office-landing .bcc-attention-row .bcc-badge { font-size:12px }
}
@media(max-width:1040px){
  .office-landing .bcc-shell { grid-template-columns:210px minmax(0,1fr) }
  .office-landing .bcc-nav-button { font-size:12px!important;padding-left:8px;padding-right:8px }
  .office-landing .bcc-nav-caption { font-size:9px }
  .office-landing .bcc-workspace { padding-left:6px;padding-right:6px }
  .office-landing .bcc-workspace strong { font-size:12px }
  .office-landing .bcc-topbar-context { font-size:11px;gap:7px }
  .office-landing .bcc-demo-label { font-size:10px }
  .office-landing .bcc-kpis { grid-template-columns:1fr }
  .office-landing .bcc-kpi { padding:16px }
  .office-landing .bcc-kpi-value { font-size:29px }
  .office-landing .bcc-kpi-value small { font-size:12px }
  .office-landing .bcc-kpi-plan { margin-top:12px }
  .office-landing .bcc-kpi-secondary { margin-top:12px }
  .office-landing .bcc-announcement-layout { grid-template-columns:1fr }
  .office-landing .bcc-department-grid { grid-template-columns:1fr }
  .office-landing .bcc-page-heading { flex-direction:column;gap:12px }
  .office-landing .bcc-heading-actions { padding:0 }
  .office-landing .bcc-panel-heading { flex-wrap:wrap }
  .office-landing .bcc-stats { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:900px){
  .office-landing .bcc-shell { display:block;min-height:700px }
  .office-landing .bcc-sidebar { display:none }
  .office-landing .bcc-mobile-menu { display:inline-flex }
  .office-landing .bcc-topbar { padding:0 16px }
  .office-landing .bcc-topbar-context { font-size:12px }
  .office-landing .bcc-demo-label { font-size:11px }
  .office-landing .bcc-page { padding:24px }
  .office-landing .bcc-kpis { grid-template-columns:repeat(3,minmax(0,1fr)) }
  .office-landing .bcc-kpi-value { font-size:27px }
  .office-landing .bcc-kpi-value small { font-size:11px }
  .office-landing .bcc-department-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .office-landing .bcc-announcement-layout { grid-template-columns:1fr }
  .office-landing .bcc-stats { grid-template-columns:repeat(4,minmax(0,1fr)) }
  .office-landing .bcc-page-heading { flex-direction:row }
  .office-landing .bcc-heading-actions { padding-top:18px }
  .office-landing .bcc-nav-button { font-size:14px!important }
  .office-landing .bcc-nav-caption { font-size:10px }
}
@media(max-width:600px){
  .office-landing .bcc-shell { border-radius:7px;min-height:650px }
  .office-landing .bcc-topbar { height:auto;min-height:56px;flex-wrap:wrap;gap:0;padding:8px 12px }
  .office-landing .bcc-topbar-context { font-size:12px;gap:7px;min-height:36px }
  .office-landing .bcc-topbar-context>span:first-of-type { max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
  .office-landing .bcc-demo-label { font-size:11px;margin-left:43px;padding:2px 0 4px }
  .office-landing .bcc-page { padding:20px 14px }
  .office-landing .bcc-page-heading { display:block;margin-bottom:20px }
  .office-landing .bcc-page-heading h3 { font-size:21px }
  .office-landing .bcc-page-heading p { font-size:13px }
  .office-landing .bcc-role { font-size:12px }
  .office-landing .bcc-heading-actions { padding-top:13px }
  .office-landing .bcc-button,
  .office-landing .bcc-icon-button,
  .office-landing .bcc-button-icon { min-height:44px }
  .office-landing .bcc-icon-button,
  .office-landing .bcc-button-icon { min-width:44px }
  .office-landing .bcc-button { font-size:13px!important;white-space:normal;text-align:center }
  .office-landing .bcc-mobile-menu { min-height:36px;min-width:36px;margin-left:-5px }
  .office-landing .bcc-inline-button { min-height:38px }
  .office-landing .bcc-context-pill { flex-wrap:wrap;gap:5px 9px;font-size:12px;min-height:36px }
  .office-landing .bcc-context-pill>strong { font-size:12px }
  .office-landing .bcc-filter-row { gap:9px }
  .office-landing .bcc-kpis { grid-template-columns:1fr;gap:10px }
  .office-landing .bcc-kpi { padding:16px }
  .office-landing .bcc-kpi-value { font-size:30px }
  .office-landing .bcc-kpi-value small { font-size:12px }
  .office-landing .bcc-kpi-note,
  .office-landing .bcc-kpi-source,
  .office-landing .bcc-kpi-secondary { font-size:12px }
  .office-landing .bcc-kpi-plan { font-size:12px }
  .office-landing .bcc-panel-heading { padding:14px;gap:12px;align-items:flex-start;flex-wrap:wrap }
  .office-landing .bcc-panel-heading h4 { font-size:16px }
  .office-landing .bcc-panel-heading p { font-size:12px }
  .office-landing .bcc-panel-body { padding:0 14px 16px;font-size:14px }
  .office-landing .bcc-chart { padding:0 4px }
  .office-landing .bcc-chart-footer { padding:13px 14px;flex-direction:column;align-items:flex-start;gap:8px }
  .office-landing .bcc-chart-legend { font-size:12px }
  .office-landing .bcc-table { font-size:13px }
  .office-landing .bcc-table th,
  .office-landing .bcc-table td { padding:11px 12px;height:44px }
  .office-landing .bcc-table .bcc-button { min-height:40px }
  .office-landing .bcc-notice { padding:12px;gap:8px }
  .office-landing .bcc-notice strong,
  .office-landing .bcc-notice p { font-size:13px }
  .office-landing .bcc-split,
  .office-landing .bcc-announcement-layout { display:block }
  .office-landing .bcc-stats { grid-template-columns:repeat(2,minmax(0,1fr));gap:10px }
  .office-landing .bcc-stat { padding:14px }
  .office-landing .bcc-stat>span { font-size:12px;min-height:36px }
  .office-landing .bcc-stat>strong { font-size:25px }
  .office-landing .bcc-search { width:100%;max-width:none;min-width:0;flex-basis:100% }
  .office-landing .bcc-input,
  .office-landing .bcc-select,
  .office-landing .bcc-textarea { min-height:44px;font-size:14px!important;padding:10px }
  .office-landing .bcc-search>.bcc-input { padding-left:34px }
  .office-landing .bcc-filter-label { flex-wrap:wrap;gap:7px;font-size:12px }
  .office-landing .bcc-filter-label .bcc-select { min-width:145px }
  .office-landing .bcc-department-grid { grid-template-columns:1fr;gap:12px }
  .office-landing .bcc-department-card { padding:16px }
  .office-landing .bcc-department-scope { min-height:0 }
  .office-landing .bcc-card-footer .bcc-button { min-height:42px }
  .office-landing .bcc-card-footer .bcc-badge { font-size:12px }
  .office-landing .bcc-card-heading h4 { font-size:16px }
  .office-landing .bcc-card-heading p { font-size:12px }
  .office-landing .bcc-department-owner { font-size:12px }
  .office-landing .bcc-department-metric strong { font-size:18px }
  .office-landing .bcc-attention-row { flex-wrap:wrap }
  .office-landing .bcc-attention-row>div { min-width:180px }
  .office-landing .bcc-attention-row>.bcc-badge { margin-left:25px }
  .office-landing .bcc-form-grid { grid-template-columns:1fr;gap:0 }
  .office-landing .bcc-recipient-grid { grid-template-columns:1fr }
  .office-landing .bcc-recipient-option { padding:12px;min-height:60px }
  .office-landing .bcc-recipient-option strong { font-size:13px }
  .office-landing .bcc-recipient-option small { font-size:12px }
  .office-landing .bcc-recipient-option input,
  .office-landing .bcc-checkbox input { height:18px;width:18px }
  .office-landing .bcc-recipient-toolbar .bcc-button { min-height:40px }
  .office-landing .bcc-form-field>label { font-size:14px }
  .office-landing .bcc-recipient-fieldset legend { font-size:14px }
  .office-landing .bcc-form-actions { gap:9px }
  .office-landing .bcc-form-actions>.bcc-button { flex:1;min-width:120px }
  .office-landing .bcc-policy-grid { grid-template-columns:1fr;gap:18px }
  .office-landing .bcc-checkbox { font-size:13px;min-height:36px }
  .office-landing .bcc-alert-card { padding:14px }
  .office-landing .bcc-alert-header { flex-wrap:wrap;gap:8px }
  .office-landing .bcc-alert-header>div { flex:1;min-width:200px }
  .office-landing .bcc-alert-header>.bcc-badge { margin-left:26px }
  .office-landing .bcc-alert-header h4 { font-size:15px }
  .office-landing .bcc-alert-header p { font-size:12px }
  .office-landing .bcc-alert-meta { gap:9px;flex-direction:column;align-items:flex-start;font-size:12px }
  .office-landing .bcc-alert-actions { gap:8px }
  .office-landing .bcc-alert-actions>.bcc-button { font-size:12px!important;min-height:44px;flex:1;min-width:115px }
  .office-landing .bcc-workflow-steps { gap:12px 20px;display:grid;grid-template-columns:1fr 1fr }
  .office-landing .bcc-file-panel { padding:12px;align-items:flex-start }
  .office-landing .bcc-file-panel strong { font-size:12px }
  .office-landing .bcc-file-panel small { font-size:12px }
  .office-landing .bcc-description-list>div { grid-template-columns:92px minmax(0,1fr);gap:10px }
  .office-landing .bcc-description-list { font-size:13px }
  .office-landing .bcc-dialog { width:calc(100vw - 24px);max-height:calc(100dvh - 24px) }
  .office-landing .bcc-dialog-heading { padding:17px 15px;gap:10px }
  .office-landing .bcc-dialog-heading h4 { font-size:17px }
  .office-landing .bcc-dialog-heading p { font-size:12px }
  .office-landing .bcc-dialog-body { padding:17px 15px }
  .office-landing .bcc-dialog-footer { padding:14px 15px;gap:8px }
  .office-landing .bcc-dialog-footer>.bcc-button-primary { flex:1 }
  .office-landing .bcc-dialog[data-mode=detail] { width:calc(100vw - 12px) }
  .office-landing .bcc-message-preview { padding:13px;font-size:14px }
  .office-landing .bcc-recipient-preview strong { font-size:13px }
  .office-landing .bcc-recipient-preview span { font-size:12px }
  .office-landing .bcc-drawer { width:290px }
  .office-landing .bcc-drawer .bcc-nav-button { font-size:14px!important;min-height:46px }
  .office-landing .bcc-drawer .bcc-workspace strong { font-size:13px }
  .office-landing .bcc-drawer .bcc-sidebar-bottom strong { font-size:13px }
  .office-landing .bcc-drawer .bcc-sidebar-bottom small { font-size:12px }
  .office-landing .bcc-toast { bottom:16px;font-size:13px;padding:12px 15px }
  .office-landing .bcc-source-note,
  .office-landing .bcc-demo-note { font-size:12px!important }
}
@media(prefers-reduced-motion:reduce){
  .office-landing .bcc-demo *,
  .office-landing .bcc-demo *:before { animation:none!important;transition:none!important;scroll-behavior:auto!important }
  .office-landing .bcc-enter:before { display:none }
}
