:root {
  --syc-bg: #eef2f7;
  --syc-surface: #ffffff;
  --syc-ink: #172033;
  --syc-muted: #6c7890;
  --syc-line: #dbe2ec;
  --syc-brand: #1478ff;
  --syc-brand-dark: #0b4fbd;
  --syc-success: #0c8b62;
  --syc-error: #c73545;
  --syc-radius: 18px;
  --syc-shadow: 0 18px 55px rgba(31, 46, 78, 0.09);
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body.syc-app-body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: var(--syc-bg); color: var(--syc-ink); }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.syc-login-page { min-height: 100vh; display: grid; place-items: center; padding: 32px 18px; background: radial-gradient(circle at 15% 20%, rgba(20, 120, 255, .24), transparent 32%), radial-gradient(circle at 90% 0%, rgba(23, 196, 180, .16), transparent 27%), #0b1220; }
.syc-login-card { width: min(460px, 100%); background: rgba(255,255,255,.98); border-radius: 28px; padding: 38px; box-shadow: 0 34px 90px rgba(0,0,0,.28); }
.syc-brand-mark { width: 62px; height: 62px; border-radius: 20px; display: grid; place-items: center; font-weight: 800; color: #fff; background: linear-gradient(145deg, var(--syc-brand), #16b7c8); box-shadow: 0 12px 30px rgba(20,120,255,.34); }
.syc-brand-mark-small { width: 38px; height: 38px; border-radius: 12px; font-size: 13px; }
.syc-eyebrow { margin: 20px 0 6px; color: var(--syc-brand); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.syc-login-card h1 { margin: 0; font-size: clamp(30px, 6vw, 44px); }
.syc-login-copy { color: var(--syc-muted); line-height: 1.65; }
.syc-login-form, .syc-form { display: grid; gap: 16px; }
.syc-login-form { margin-top: 26px; }
.syc-form label, .syc-login-form label { display: grid; gap: 8px; }
.syc-form label > span, .syc-login-form label > span { color: #45516a; font-size: 13px; font-weight: 700; }
.syc-form input, .syc-form select, .syc-login-form input, .syc-inline-select select { width: 100%; min-height: 46px; border: 1px solid var(--syc-line); border-radius: 12px; padding: 0 13px; color: var(--syc-ink); background: #fff; outline: none; }
.syc-form input:focus, .syc-form select:focus, .syc-login-form input:focus, .syc-inline-select select:focus { border-color: var(--syc-brand); box-shadow: 0 0 0 4px rgba(20,120,255,.12); }
.syc-check-row { display: flex !important; align-items: center; gap: 10px !important; color: var(--syc-muted); font-size: 13px; }
.syc-check-row input { width: 17px; min-height: auto; }
.syc-primary-button, .syc-secondary-button, .syc-ghost-button { border: 0; border-radius: 12px; min-height: 44px; padding: 0 17px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-weight: 800; cursor: pointer; text-decoration: none; }
.syc-primary-button { color: #fff; background: linear-gradient(135deg, var(--syc-brand), var(--syc-brand-dark)); }
.syc-secondary-button { color: var(--syc-brand-dark); background: #e8f1ff; }
.syc-ghost-button { color: #dfe8f6; background: rgba(255,255,255,.08); }
.syc-domain-note { margin: 22px 0 0; padding-top: 18px; border-top: 1px solid var(--syc-line); color: var(--syc-muted); font-size: 12px; line-height: 1.6; }
.syc-alert { border-radius: 12px; padding: 13px 15px; margin: 16px 0; }
.syc-alert-error { color: #8f1e2c; background: #fff0f2; border: 1px solid #ffd1d7; }

.syc-app { min-height: 100vh; }
.syc-topbar { height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; color: #fff; background: #0b1220; border-bottom: 1px solid rgba(255,255,255,.08); }
.syc-brand { display: flex; align-items: center; gap: 12px; color: #fff; font-weight: 900; text-decoration: none; }
.syc-topbar-actions { display: flex; align-items: center; gap: 14px; }
.syc-user-name { color: #d6deeb; font-size: 14px; }
.syc-layout { min-height: calc(100vh - 72px); display: grid; grid-template-columns: 240px minmax(0, 1fr); }
.syc-sidebar { padding: 22px 14px; background: #101a2c; display: flex; flex-direction: column; gap: 7px; }
.syc-nav-item { width: 100%; border: 0; border-radius: 12px; padding: 13px 14px; display: flex; justify-content: space-between; color: #b9c4d7; background: transparent; text-align: left; cursor: pointer; }
.syc-nav-item:hover, .syc-nav-item.is-active { color: #fff; background: rgba(20,120,255,.18); }
.syc-nav-item[disabled] { opacity: .48; cursor: not-allowed; }
.syc-nav-item small { font-size: 10px; }
.syc-main { min-width: 0; padding: 32px; }
.syc-view { max-width: 1320px; margin: 0 auto; }
.syc-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.syc-page-head h1 { margin: 0 0 8px; font-size: clamp(28px, 4vw, 42px); }
.syc-page-head p:not(.syc-eyebrow) { margin: 0; color: var(--syc-muted); }
.syc-page-head .syc-eyebrow { margin-top: 0; }
.syc-inline-select { min-width: 250px; display: grid; gap: 7px; }
.syc-inline-select span { color: var(--syc-muted); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.syc-metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.syc-metric, .syc-panel, .syc-empty-state { background: var(--syc-surface); border: 1px solid rgba(213,222,235,.9); border-radius: var(--syc-radius); box-shadow: var(--syc-shadow); }
.syc-metric { padding: 22px; }
.syc-metric span, .syc-metric small { display: block; color: var(--syc-muted); }
.syc-metric strong { display: block; margin: 12px 0 4px; font-size: clamp(25px, 3vw, 34px); overflow-wrap: anywhere; }
.syc-panel-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 18px; }
.syc-panel { min-width: 0; padding: 24px; }
.syc-panel h2 { margin: 0 0 18px; }
.syc-panel p { color: var(--syc-muted); line-height: 1.65; }
.syc-panel-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.syc-panel-head span { color: var(--syc-muted); font-size: 13px; }
.syc-check-list { margin: 0; padding: 0; display: grid; gap: 12px; list-style: none; }
.syc-check-list li { position: relative; padding-left: 28px; }
.syc-check-list li::before { content: '✓'; position: absolute; left: 0; color: var(--syc-success); font-weight: 900; }
.syc-empty-state { padding: 42px; text-align: center; }
.syc-empty-icon { width: 68px; height: 68px; margin: 0 auto 18px; display: grid; place-items: center; border-radius: 22px; color: #fff; font-weight: 900; background: linear-gradient(135deg, var(--syc-brand), #15b9b1); }
.syc-empty-state h2 { margin: 0 0 10px; }
.syc-empty-state p { color: var(--syc-muted); }
.syc-form-inline { max-width: 760px; margin: 25px auto 0; grid-template-columns: 1.6fr 1fr auto; align-items: end; text-align: left; }
.syc-form-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 22px; }
.syc-form-compact button { align-self: end; }
.syc-list { display: grid; gap: 9px; }
.syc-list-row { width: 100%; min-height: 62px; border: 1px solid var(--syc-line); border-radius: 13px; padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; color: var(--syc-ink); background: #fff; text-align: left; }
button.syc-list-row { cursor: pointer; }
button.syc-list-row:hover, .syc-list-row.is-selected { border-color: var(--syc-brand); background: #f1f7ff; }
.syc-list-row span:first-child { display: grid; gap: 4px; }
.syc-list-row small { color: var(--syc-muted); }
.syc-list-static { margin-top: 18px; }
.syc-table-wrap { overflow-x: auto; border: 1px solid var(--syc-line); border-radius: 13px; }
.syc-table { width: 100%; border-collapse: collapse; }
.syc-table th, .syc-table td { padding: 13px 14px; border-bottom: 1px solid var(--syc-line); text-align: left; white-space: nowrap; }
.syc-table th { color: var(--syc-muted); background: #f7f9fc; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; }
.syc-table tr:last-child td { border-bottom: 0; }
.syc-muted { color: var(--syc-muted); }
.syc-loading { padding: 60px; text-align: center; color: var(--syc-muted); }
.syc-status { position: fixed; top: 88px; right: 24px; z-index: 30; max-width: 420px; padding: 14px 17px; border-radius: 13px; color: #fff; box-shadow: 0 18px 46px rgba(0,0,0,.18); }
.syc-status.is-success { background: var(--syc-success); }
.syc-status.is-error { background: var(--syc-error); }

@media (max-width: 980px) {
  .syc-layout { grid-template-columns: 1fr; }
  .syc-sidebar { position: sticky; top: 0; z-index: 10; padding: 9px 12px; flex-direction: row; overflow-x: auto; }
  .syc-nav-item { width: auto; flex: 0 0 auto; white-space: nowrap; }
  .syc-metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 680px) {
  .syc-topbar { height: auto; min-height: 68px; padding: 12px 16px; }
  .syc-user-name { display: none; }
  .syc-main { padding: 22px 14px 40px; }
  .syc-page-head { align-items: stretch; flex-direction: column; }
  .syc-inline-select { min-width: 0; }
  .syc-metric-grid, .syc-panel-grid { grid-template-columns: 1fr; }
  .syc-form-inline, .syc-form-compact { grid-template-columns: 1fr; }
  .syc-empty-state, .syc-login-card { padding: 26px 20px; }
  .syc-status { left: 14px; right: 14px; top: 78px; }
}

/* V0.2 structure actions and modal */
.syc-row-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.syc-icon-button { min-height: 34px; border: 1px solid #cdd8e8; border-radius: 9px; padding: 0 11px; color: #174d91; background: #f5f9ff; font-weight: 800; cursor: pointer; }
.syc-icon-button:hover { border-color: var(--syc-brand); background: #eaf3ff; }
.syc-icon-button.is-danger { color: #a82638; border-color: #f0cbd1; background: #fff4f5; }
.syc-icon-button.is-danger:hover { border-color: #d84c60; background: #ffe8eb; }
.syc-modal-overlay { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 20px; background: rgba(7, 15, 29, .66); backdrop-filter: blur(5px); }
.syc-modal { width: min(520px, 100%); max-height: min(760px, calc(100vh - 40px)); overflow: auto; border-radius: 20px; padding: 24px; background: #fff; box-shadow: 0 34px 100px rgba(0,0,0,.3); }
.syc-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.syc-modal-head h2 { margin: 0; }
.syc-modal-close { width: 38px; height: 38px; border: 0; border-radius: 50%; color: #526078; background: #edf2f8; font-size: 25px; line-height: 1; cursor: pointer; }
.syc-modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 8px; }
.syc-ghost-light-button { min-height: 44px; border: 1px solid var(--syc-line); border-radius: 12px; padding: 0 17px; color: #3d4a63; background: #fff; font-weight: 800; cursor: pointer; }
.syc-primary-button:disabled, .syc-secondary-button:disabled, .syc-icon-button:disabled { opacity: .55; cursor: wait; }

@media (max-width: 680px) {
  .syc-row-actions { justify-content: flex-start; }
  .syc-table th, .syc-table td { padding: 11px 10px; }
  .syc-modal { padding: 20px; }
  .syc-modal-actions { flex-direction: column-reverse; }
  .syc-modal-actions button { width: 100%; }
}

/* Dashboard actions */
.syc-quick-actions { display: grid; gap: 12px; }
.syc-quick-action { width: 100%; border: 1px solid var(--syc-line); border-radius: 14px; padding: 16px; display: grid; gap: 6px; color: var(--syc-ink); background: #fff; text-align: left; cursor: pointer; }
.syc-quick-action:hover { border-color: var(--syc-brand); background: #f3f8ff; }
.syc-quick-action strong { font-size: 15px; }
.syc-quick-action span { color: var(--syc-muted); line-height: 1.55; }
.syc-setup-list { margin: 0 0 18px; padding: 0; display: grid; gap: 10px; list-style: none; }
.syc-setup-list li { min-height: 50px; border: 1px solid var(--syc-line); border-radius: 12px; padding: 12px 14px 12px 44px; position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.syc-setup-list li::before { position: absolute; left: 14px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); display: grid; place-items: center; border-radius: 50%; font-size: 11px; font-weight: 900; }
.syc-setup-list li.is-complete::before { content: '✓'; color: #fff; background: var(--syc-success); }
.syc-setup-list li.is-optional::before { content: '–'; color: #5d677a; background: #e9edf3; }
.syc-setup-list li.is-pending::before { content: '!'; color: #7b5d00; background: #fff0b8; }
.syc-setup-list span { color: var(--syc-muted); }
.syc-setup-list strong { font-size: 13px; text-align: right; }

@media (max-width: 680px) {
  .syc-setup-list li { align-items: flex-start; flex-direction: column; gap: 4px; }
  .syc-setup-list strong { text-align: left; }
}

/* V0.3 people, unit details and import */
.syc-metric-grid-five { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.syc-form-grid-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.syc-form-details { border: 1px solid var(--syc-line); border-radius: 13px; padding: 13px 15px; background: #f8faff; }
.syc-form-details summary { color: #234b82; font-weight: 800; cursor: pointer; }
.syc-form-details[open] summary { margin-bottom: 14px; }
.syc-split-input { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.syc-cell-sub { display: block; margin-top: 4px; color: var(--syc-muted); font-size: 11px; }
.syc-panel-grid-people { grid-template-columns: minmax(280px, .7fr) minmax(0, 1.6fr); align-items: start; }
.syc-panel-wide { min-width: 0; }
.syc-list-search { display: grid; gap: 7px; margin-bottom: 16px; }
.syc-list-search span { color: #45516a; font-size: 13px; font-weight: 700; }
.syc-list-search input { min-height: 46px; border: 1px solid var(--syc-line); border-radius: 12px; padding: 0 13px; outline: none; }
.syc-list-search input:focus { border-color: var(--syc-brand); box-shadow: 0 0 0 4px rgba(20,120,255,.12); }
.syc-people-list { display: grid; gap: 12px; }
.syc-person-card { border: 1px solid var(--syc-line); border-radius: 16px; padding: 16px; background: #fff; }
.syc-person-main { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 13px; align-items: start; }
.syc-person-avatar { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: #fff; background: linear-gradient(135deg, var(--syc-brand), #15b9b1); font-weight: 900; text-transform: uppercase; }
.syc-person-card h3 { margin: 1px 0 4px; }
.syc-person-card p { margin: 0; font-size: 13px; }
.syc-person-actions, .syc-relation-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.syc-relation-actions { padding-top: 12px; border-top: 1px dashed var(--syc-line); }
.syc-relation-list { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 11px; }
.syc-relation-chip { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; border: 1px solid #cfe0f7; border-radius: 999px; padding: 6px 9px; color: #34506f; background: #f2f7ff; font-size: 11px; }
.syc-relation-chip.is-ended { opacity: .65; background: #f3f4f6; border-color: #d9dee7; }
.syc-relation-chip strong { color: #164b8f; }
.syc-relation-chip em { border-radius: 999px; padding: 2px 6px; color: #0d6d51; background: #dff7ee; font-style: normal; font-weight: 800; }
.syc-mini-action { border: 0; border-radius: 8px; padding: 6px 9px; color: #1c5ba8; background: #edf5ff; font-size: 11px; font-weight: 800; cursor: pointer; }
.syc-mini-action.is-danger { color: #a82638; background: #fff0f2; }
.syc-empty-inline { border: 1px dashed var(--syc-line); border-radius: 14px; padding: 28px; color: var(--syc-muted); text-align: center; }
.syc-file-field { border: 1px dashed #b9c9df; border-radius: 14px; padding: 16px; background: #f8fbff; }
.syc-file-field input { padding: 10px; height: auto; }
.syc-import-form { margin-top: 18px; }
.syc-import-help { margin-top: 22px; border-top: 1px solid var(--syc-line); padding-top: 18px; }
.syc-import-help h3 { margin: 0 0 8px; }
.syc-import-help ul { margin: 0; padding-left: 20px; color: var(--syc-muted); line-height: 1.8; }
.syc-import-preview { margin-top: 18px; }
.syc-import-preview .syc-panel-head p { margin: 3px 0 0; }
.syc-import-table td { vertical-align: top; white-space: normal; }
.syc-import-table tr.is-invalid td { background: #fff7f8; }
.syc-error-list { margin: 0; padding-left: 17px; color: #a42336; font-size: 12px; }
.syc-valid-label { color: var(--syc-success); font-weight: 800; }
.syc-alert-success { color: #086044; background: #e9faf4; border: 1px solid #bcebdc; }
.syc-panel-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.syc-status-pill { border-radius: 999px; padding: 6px 9px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.syc-status-pill.is-completed { color: #087251; background: #dff7ee; }
.syc-status-pill.is-preview_ready { color: #7a5900; background: #fff2c7; }
.syc-status-pill.is-failed { color: #a42336; background: #ffe8ec; }
.syc-status-pill.is-importing { color: #175aa6; background: #e4f0ff; }
.syc-modal { width: min(700px, 100%); }

@media (max-width: 1180px) {
  .syc-metric-grid-five { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .syc-panel-grid-people, .syc-form-grid-two { grid-template-columns: 1fr; }
  .syc-metric-grid-five { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .syc-metric-grid-five { grid-template-columns: 1fr; }
  .syc-person-main { grid-template-columns: 40px minmax(0, 1fr); }
  .syc-person-avatar { width: 40px; height: 40px; }
  .syc-panel-actions { flex-direction: column-reverse; }
  .syc-panel-actions button { width: 100%; }
}

/* V0.4 account, demo and permissions */
.syc-public-page { min-height: 100vh; background: radial-gradient(circle at 12% 12%, rgba(34,116,255,.18), transparent 34%), linear-gradient(150deg, #071326, #0d2444 58%, #123d70); color: #fff; }
.syc-public-header { min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 20px; width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.syc-public-header .syc-brand { color: #fff; }
.syc-public-header .syc-ghost-button { color: #fff; border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.08); }
.syc-public-hero { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 56px 0 80px; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .78fr); gap: 60px; align-items: center; }
.syc-public-copy h1 { margin: 10px 0 20px; max-width: 720px; font-size: clamp(40px, 5.6vw, 74px); line-height: .98; letter-spacing: -.05em; }
.syc-public-copy > p:not(.syc-eyebrow) { max-width: 680px; color: #c7d8ee; font-size: 19px; line-height: 1.7; }
.syc-public-points { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.syc-public-points span { border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: 9px 12px; color: #e8f2ff; background: rgba(255,255,255,.07); font-size: 13px; font-weight: 700; }
.syc-public-card { border: 1px solid rgba(255,255,255,.16); border-radius: 24px; padding: 22px; color: #172238; background: rgba(255,255,255,.97); box-shadow: 0 28px 80px rgba(0,0,0,.28); }
.syc-public-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 22px; padding: 5px; border-radius: 13px; background: #eef3f9; }
.syc-public-tabs button { min-height: 42px; border: 0; border-radius: 10px; color: #657086; background: transparent; font-weight: 800; cursor: pointer; }
.syc-public-tabs button.is-active { color: #0d5ec4; background: #fff; box-shadow: 0 4px 12px rgba(18,55,100,.1); }
.syc-public-card[hidden], .syc-demo-step[hidden] { display: none !important; }
.syc-demo-step { display: grid; gap: 14px; }
.syc-demo-step h2 { margin: 0 0 4px; font-size: 24px; }
.syc-step-count { margin: 0; color: #1671e8; font-size: 12px; font-weight: 900; letter-spacing: .12em; }
.syc-choice-card { min-height: 72px; display: flex !important; align-items: center; gap: 13px; border: 1px solid var(--syc-line); border-radius: 14px; padding: 13px 15px; cursor: pointer; transition: .18s ease; }
.syc-choice-card:hover { border-color: #8abaff; background: #f5f9ff; }
.syc-choice-card input { width: 18px !important; min-height: 18px !important; }
.syc-choice-card span { display: grid; gap: 4px; }
.syc-choice-card strong { color: #172238; }
.syc-choice-card small { color: var(--syc-muted); }
.syc-demo-step > label:not(.syc-choice-card), .syc-public-card .syc-login-form label { display: grid; gap: 7px; }
.syc-demo-step input, .syc-public-card .syc-login-form input { min-height: 48px; border: 1px solid var(--syc-line); border-radius: 12px; padding: 0 13px; }
.syc-step-actions { display: grid; grid-template-columns: .7fr 1.3fr; gap: 10px; }
.syc-form-note { margin: 0; color: var(--syc-muted); font-size: 12px; line-height: 1.55; }
.syc-activation-card { width: min(520px, calc(100% - 30px)); }
.syc-text-link { display: inline-block; margin-top: 16px; color: #1768cf; font-weight: 800; }
.syc-alert-info { color: #234c80; background: #eef6ff; border: 1px solid #cfe4ff; }
.syc-demo-banner { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; border: 1px solid #efd184; border-radius: 16px; padding: 15px 18px; color: #6e5200; background: #fff7d9; }
.syc-demo-banner span { color: #745f24; }
.syc-account-summary { display: grid; gap: 0; margin: 0; }
.syc-account-summary div { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--syc-line); }
.syc-account-summary div:last-child { border-bottom: 0; }
.syc-account-summary dt { color: var(--syc-muted); }
.syc-account-summary dd { margin: 0; font-weight: 800; word-break: break-word; }
.syc-user-list { display: grid; gap: 10px; }
.syc-user-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid var(--syc-line); border-radius: 15px; padding: 15px; }
.syc-user-card > div { min-width: 0; display: grid; gap: 5px; }
.syc-user-card small { color: var(--syc-muted); }
.syc-user-card a { color: #1768cf; font-size: 12px; word-break: break-all; }
.syc-package-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.syc-package-card { min-height: 180px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; border: 1px solid var(--syc-line); border-radius: 17px; padding: 18px; background: #fff; }
.syc-package-card.is-selected { border-color: #66a6ff; box-shadow: 0 0 0 3px rgba(40,125,245,.1); }
.syc-package-card div { display: grid; gap: 8px; }
.syc-package-card strong { font-size: 20px; }
.syc-package-card small { color: var(--syc-muted); line-height: 1.55; }
.syc-panel fieldset { border: 1px solid var(--syc-line); border-radius: 13px; padding: 13px; }
.syc-panel legend { padding: 0 7px; color: #42506a; font-weight: 800; }
.syc-system-badge { display: inline-flex; border-radius: 999px; padding: 6px 10px; color: #0e5c9c; background: #e3f2ff; font-size: 11px; font-weight: 900; }

@media (max-width: 960px) {
  .syc-public-hero { grid-template-columns: 1fr; gap: 32px; padding-top: 30px; }
  .syc-public-copy h1 { font-size: clamp(42px, 10vw, 68px); }
  .syc-package-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .syc-public-header, .syc-public-hero { width: min(100% - 24px, 1180px); }
  .syc-public-header { min-height: 64px; }
  .syc-public-copy h1 { font-size: 42px; }
  .syc-public-copy > p:not(.syc-eyebrow) { font-size: 16px; }
  .syc-public-card { padding: 16px; border-radius: 18px; }
  .syc-demo-banner, .syc-user-card { align-items: flex-start; flex-direction: column; }
  .syc-account-summary div { grid-template-columns: 1fr; gap: 4px; }
  .syc-step-actions { grid-template-columns: 1fr; }
}

.syc-demo-banner.is-expired { border-color: #efb5b5; color: #8a1f1f; background: #fff0f0; }
.syc-readonly-banner { margin-bottom: 18px; }

/* V0.5 finance */
.syc-panel-wide { grid-column: 1 / -1; }
.syc-finance-section { margin-top: 18px; }
.syc-finance-import-preview { margin-top: 18px; }
.syc-finance-import-preview tr.is-invalid td { background: #fff7f8; }
.syc-manual-amount-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; max-height: 420px; overflow: auto; padding: 2px; }
.syc-manual-amount-grid label { border: 1px solid var(--syc-line); border-radius: 12px; padding: 10px; background: #f8fbff; }
.syc-manual-amount-grid label span { min-height: 32px; display: block; color: #42506a; font-size: 12px; font-weight: 800; }
.syc-manual-amount-grid input { width: 100%; }
.syc-cell-sub { display: block; margin-top: 4px; color: var(--syc-muted); font-size: 11px; }
.syc-status-pill.is-draft { color: #795700; background: #fff1bd; }
.syc-status-pill.is-approved { color: #087251; background: #dff7ee; }
.syc-status-pill.is-reversed { color: #8b2635; background: #ffe8ec; }
.syc-form textarea { width: 100%; border: 1px solid var(--syc-line); border-radius: 12px; padding: 12px; resize: vertical; font: inherit; }
.syc-check-row { display: flex !important; align-items: center; gap: 10px; }
.syc-check-row input { width: 18px !important; min-height: 18px !important; }
.syc-reset-home { display: inline-block; margin-top: 16px; color: #1768cf; font-weight: 800; }
@media (max-width: 980px) { .syc-manual-amount-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .syc-manual-amount-grid { grid-template-columns: 1fr; } }

/* V0.6 resident accounts, person/unit details and communication center */
.syc-page-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 10px; }
.syc-account-state { display: inline-flex; align-items: center; gap: 7px; border-radius: 999px; padding: 7px 11px; color: #25527f; background: #edf6ff; font-size: 12px; font-weight: 900; }
.syc-account-state.is-active { color: #087251; background: #dff7ee; }
.syc-relation-list-block { display: grid; gap: 10px; }
.syc-relation-list-block .syc-list-row { align-items: flex-start; }
.syc-notification-list, .syc-thread-list { display: grid; gap: 10px; }
.syc-message-card, .syc-thread-row { width: 100%; display: grid; gap: 7px; border: 1px solid var(--syc-line); border-radius: 14px; padding: 14px; text-align: left; background: #fff; }
button.syc-thread-row { cursor: pointer; font: inherit; }
.syc-message-card.is-unread, .syc-thread-row.is-unread { border-color: #8bbcff; background: #f2f8ff; box-shadow: inset 4px 0 0 #247df0; }
.syc-message-card header, .syc-thread-row header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.syc-message-card p, .syc-thread-row p { margin: 0; color: #3d4960; line-height: 1.55; }
.syc-message-card small, .syc-thread-row small { color: var(--syc-muted); }
.syc-unread-count { display: inline-flex; min-width: 22px; min-height: 22px; align-items: center; justify-content: center; border-radius: 999px; padding: 2px 7px; color: #fff; background: #176ee5; font-size: 11px; font-weight: 900; }
.syc-conversation { max-height: 440px; display: flex; flex-direction: column; gap: 10px; overflow: auto; padding: 4px 2px 14px; }
.syc-chat-bubble { max-width: min(78%, 680px); align-self: flex-start; border: 1px solid var(--syc-line); border-radius: 16px 16px 16px 5px; padding: 11px 13px; background: #f6f8fb; }
.syc-chat-bubble.is-management { align-self: flex-end; border-color: #c9ddff; border-radius: 16px 16px 5px 16px; background: #eaf3ff; }
.syc-chat-bubble p { margin: 0 0 6px; white-space: pre-wrap; line-height: 1.55; }
.syc-chat-bubble small { color: var(--syc-muted); }
.syc-profile-select { min-width: min(360px, 100%); }
.syc-detail-list { display: grid; gap: 0; margin: 0; }
.syc-detail-list > div { display: grid; grid-template-columns: minmax(120px, .7fr) minmax(0, 1.3fr); gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--syc-line); }
.syc-detail-list > div:last-child { border-bottom: 0; }
.syc-detail-list dt { color: var(--syc-muted); }
.syc-detail-list dd { margin: 0; font-weight: 800; overflow-wrap: anywhere; }
.syc-text-button { border: 0; padding: 0; color: #1768cf; background: transparent; font: inherit; font-weight: 800; cursor: pointer; }
.syc-text-button:hover { text-decoration: underline; }
.syc-form-note.is-warning { border-radius: 10px; padding: 10px; color: #765700; background: #fff5d2; }
.syc-resident-app .syc-main { min-width: 0; }
.syc-resident-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.syc-resident-summary .syc-stat-card { min-height: 120px; }

@media (max-width: 980px) {
  .syc-page-actions { justify-content: flex-start; }
  .syc-resident-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .syc-page-actions { width: 100%; }
  .syc-page-actions > * { flex: 1 1 auto; }
  .syc-detail-list > div { grid-template-columns: 1fr; gap: 4px; }
  .syc-chat-bubble { max-width: 92%; }
  .syc-resident-summary { grid-template-columns: 1fr; }
}

/* V0.6.1 searchable person picker */
.syc-field-title{display:block;margin:0 0 8px;font-weight:800;color:#16223a}
.syc-person-picker{display:grid;gap:10px}
.syc-person-picker>label{margin:0}
.syc-person-picker-selected{padding:10px 12px;border:1px solid #d8e3f1;border-radius:12px;background:#f7faff;color:#56657c;font-size:14px}
.syc-person-picker-list{max-height:260px;overflow:auto;border:1px solid #d8e3f1;border-radius:14px;background:#fff;padding:6px;display:grid;gap:5px}
.syc-person-picker-option{width:100%;border:1px solid transparent;border-radius:10px;background:#fff;padding:10px 12px;text-align:left;cursor:pointer;display:grid;gap:3px;color:#16223a}
.syc-person-picker-option:hover{background:#f3f7ff;border-color:#c8d8ef}
.syc-person-picker-option.is-selected{background:#eaf2ff;border-color:#2674df;box-shadow:0 0 0 1px rgba(38,116,223,.08)}
.syc-person-picker-option strong{font-size:14px}
.syc-person-picker-option small{font-size:12px;color:#66758b;line-height:1.35}
.syc-person-picker-option[hidden]{display:none!important}

/* V0.7 account security, responsive navigation and resident statements */
.syc-password-wrap{position:relative;display:block;width:100%}
.syc-password-wrap input{width:100%;padding-right:48px!important}
.syc-password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;border-radius:10px;color:#53627a;background:#edf3fb;cursor:pointer;font-size:17px;font-weight:900}
.syc-password-toggle.is-visible{color:#075fcf;background:#dcecff}
.syc-forgot-form{margin-top:14px;padding-top:14px;border-top:1px solid var(--syc-line)}
.syc-text-button{display:inline-flex;margin-top:12px;cursor:pointer}
.syc-topbar-actions{display:flex;align-items:center;gap:9px}
.syc-top-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.13);border-radius:12px;color:#fff;background:rgba(255,255,255,.08);cursor:pointer;font-size:18px}
.syc-top-icon b,.syc-mobile-bottom-nav b{position:absolute;right:-4px;top:-5px;display:flex;min-width:19px;height:19px;align-items:center;justify-content:center;border:2px solid #0b1c34;border-radius:999px;padding:0 4px;color:#fff;background:#ef3f57;font-size:10px;line-height:1}
.syc-top-icon b[hidden],.syc-mobile-bottom-nav b[hidden]{display:none!important}
.syc-mobile-bottom-nav{display:none}
.syc-category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.syc-category-card{display:grid;gap:7px;border:1px solid var(--syc-line);border-radius:15px;padding:15px;background:#f9fbfe}
.syc-category-card span,.syc-category-card small{color:var(--syc-muted)}
.syc-category-card strong{font-size:23px;color:#14213a}
.syc-unit-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.syc-unit-account-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;border:1px solid var(--syc-line);border-radius:16px;padding:16px;background:#fff}
.syc-unit-account-card h3{margin:8px 0 5px;font-size:19px}
.syc-unit-account-card small{color:var(--syc-muted)}
.syc-unit-account-card dl{display:grid;gap:6px;margin:0;min-width:180px}
.syc-unit-account-card dl div{display:flex;justify-content:space-between;gap:14px}
.syc-unit-account-card dt{color:var(--syc-muted)}
.syc-unit-account-card dd{margin:0;font-weight:800}
.syc-panel-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.syc-panel-title-row h2{margin:0 0 5px}
.syc-filter-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.syc-filter-actions select{min-height:42px;border:1px solid var(--syc-line);border-radius:11px;padding:0 11px;background:#fff}
.syc-account-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);gap:22px;margin-bottom:18px;border-radius:22px;padding:26px;color:#fff;background:linear-gradient(135deg,#09244b,#155bb4)}
.syc-account-hero span,.syc-account-hero p,.syc-account-hero dt{color:#cfe2ff}
.syc-account-hero h2{margin:7px 0;font-size:32px}
.syc-account-hero dl{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0}
.syc-account-hero dl div{border:1px solid rgba(255,255,255,.14);border-radius:13px;padding:12px;background:rgba(255,255,255,.08)}
.syc-account-hero dd{margin:4px 0 0;font-weight:900}
.syc-account-site-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.syc-account-site-card{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--syc-line);border-radius:16px;padding:15px;background:#fff}
.syc-account-site-card.is-active{border-color:#4d98ff;box-shadow:0 0 0 3px rgba(50,129,240,.1)}
.syc-account-site-card h3{margin:5px 0}
.syc-account-site-card span,.syc-account-site-card small{color:var(--syc-muted)}
.syc-permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.syc-view{min-width:0;overflow-wrap:anywhere}
.syc-panel,.syc-page-head{min-width:0}

@media print{
  body.syc-app-body{background:#fff!important}
  .syc-topbar,.syc-sidebar,.syc-mobile-bottom-nav,.syc-page-head,.syc-status,.syc-filter-actions,.syc-panel:not(.syc-print-area){display:none!important}
  .syc-layout,.syc-main,.syc-view,.syc-print-area{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;box-shadow:none!important;border:0!important}
  .syc-print-area .syc-table{font-size:11px}
}

@media(max-width:980px){
  .syc-category-grid,.syc-account-site-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .syc-account-hero{grid-template-columns:1fr}
  .syc-unit-card-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .syc-app{padding-bottom:76px}
  .syc-topbar{min-height:64px;padding:0 14px}
  .syc-topbar .syc-brand span:last-child,.syc-user-name,.syc-topbar .syc-ghost-button{display:none}
  .syc-topbar-actions{margin-left:auto}
  .syc-layout{display:block!important}
  .syc-sidebar{display:none!important}
  .syc-main{width:100%!important;min-width:0!important;padding:14px!important}
  .syc-view{width:100%!important;min-width:0!important;padding:0!important}
  .syc-page-head{display:grid!important;gap:12px;margin-bottom:14px}
  .syc-page-head h1{font-size:30px}
  .syc-profile-select,.syc-inline-select{width:100%;min-width:0}
  .syc-profile-select select,.syc-inline-select select{width:100%}
  .syc-mobile-bottom-nav{position:fixed;z-index:1000;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(5,1fr);min-height:68px;padding:6px max(6px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));border-top:1px solid #d8e1ef;background:rgba(255,255,255,.98);box-shadow:0 -8px 24px rgba(13,35,66,.12)}
  .syc-mobile-bottom-nav button{position:relative;display:flex;min-width:0;align-items:center;justify-content:center;flex-direction:column;gap:3px;border:0;border-radius:11px;padding:6px 2px;color:#65738a;background:transparent;font-size:18px;cursor:pointer}
  .syc-mobile-bottom-nav button span{font-size:10px;font-weight:800;white-space:nowrap}
  .syc-mobile-bottom-nav button.is-active{color:#0867d8;background:#eaf3ff}
  .syc-mobile-bottom-nav b{right:10%;top:0;border-color:#fff}
  .syc-category-grid,.syc-account-site-grid,.syc-permission-grid{grid-template-columns:1fr}
  .syc-unit-account-card{grid-template-columns:1fr}
  .syc-unit-account-card dl{min-width:0}
  .syc-panel-title-row{display:grid}
  .syc-filter-actions{display:grid;grid-template-columns:1fr 1fr}
  .syc-account-hero{padding:19px}
  .syc-account-hero h2{font-size:26px}
  .syc-account-hero dl{grid-template-columns:1fr 1fr}
  .syc-table-wrap{max-width:100%;overflow:auto}
  .syc-table{min-width:760px}
  .syc-public-hero{padding-bottom:30px}
}
@media(max-width:460px){
  .syc-account-hero dl,.syc-filter-actions{grid-template-columns:1fr}
  .syc-top-icon{width:38px;height:38px}
  .syc-public-copy h1{font-size:37px}
}

/* V0.7.1 mobile navigation recovery */
.syc-top-icon svg,.syc-mobile-nav-icon svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.syc-mobile-logout{display:none}
.syc-mobile-nav-icon{display:grid;width:24px;height:24px;place-items:center;line-height:1}
.syc-mobile-drawer-backdrop[hidden]{display:none!important}
.syc-mobile-drawer-backdrop{position:fixed;z-index:1400;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:16px 12px calc(16px + env(safe-area-inset-bottom));background:rgba(4,15,31,.56);backdrop-filter:blur(3px)}
.syc-mobile-drawer{width:min(100%,560px);max-height:min(82vh,720px);overflow:auto;border:1px solid #d6e1ef;border-radius:24px;padding:18px;background:#fff;box-shadow:0 24px 70px rgba(4,20,44,.32)}
.syc-mobile-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.syc-mobile-drawer-head div{display:grid;gap:3px}
.syc-mobile-drawer-head strong{font-size:21px;color:#14213a}
.syc-mobile-drawer-head small{color:#68768c}
.syc-mobile-drawer-close{display:grid;width:40px;height:40px;place-items:center;border:0;border-radius:12px;color:#31425b;background:#edf3fa;font-size:25px;line-height:1;cursor:pointer}
.syc-mobile-drawer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.syc-mobile-drawer-grid button{min-height:52px;border:1px solid #d8e3f1;border-radius:14px;padding:10px 12px;color:#183252;background:#f8fbff;text-align:left;font-weight:800;cursor:pointer}
.syc-mobile-drawer-grid button.is-active{border-color:#2774df;color:#075fcf;background:#eaf3ff}
.syc-mobile-drawer-logout{display:flex;min-height:48px;align-items:center;justify-content:center;margin-top:13px;border-radius:14px;color:#9f1d2d;background:#fff0f2;font-weight:900;text-decoration:none}
body.syc-mobile-menu-open{overflow:hidden}

@media(max-width:760px){
  .syc-app{padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
  .syc-main{padding:14px 14px calc(108px + env(safe-area-inset-bottom))!important}
  .syc-view>:last-child{margin-bottom:18px}
  .syc-topbar{position:sticky;z-index:1050;top:0}
  .syc-mobile-logout{display:inline-flex!important}
  .syc-mobile-bottom-nav{min-height:76px!important;padding:7px max(7px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left))!important}
  .syc-mobile-bottom-nav button{min-height:58px!important;gap:4px!important;padding:6px 3px!important;font-size:inherit!important;line-height:1!important}
  .syc-mobile-bottom-nav button>span:last-child{font-size:10px!important;line-height:1.1!important;font-weight:850!important}
  .syc-mobile-bottom-nav .syc-mobile-nav-icon{font-size:0!important}
  .syc-mobile-bottom-nav .syc-mobile-nav-icon svg{width:23px;height:23px}
  .syc-mobile-bottom-nav b{display:none!important}
}

@media(max-width:390px){
  .syc-mobile-drawer-grid{grid-template-columns:1fr}
  .syc-mobile-bottom-nav button>span:last-child{font-size:9px!important}
}

/* V0.7.1 in-app confirmations */
.syc-confirm-modal{max-width:460px;text-align:center}
.syc-confirm-modal h2{margin:8px 0 10px}
.syc-confirm-modal p{margin:0 0 20px;color:#647188;line-height:1.55}
.syc-confirm-modal label{text-align:left}
.syc-confirm-icon{display:grid;width:54px;height:54px;place-items:center;margin:0 auto 8px;border-radius:50%;color:#0764d4;background:#e8f2ff;font-size:25px;font-weight:900}
.syc-confirm-icon.is-danger{color:#b42336;background:#ffeaed}
.syc-danger-button{min-height:44px;border:0;border-radius:12px;padding:0 18px;color:#fff;background:#cf3047;font-weight:900;cursor:pointer}
.syc-danger-button:hover{background:#b72137}

/* V0.7.2 finance clarity, resident summary and payment notices */
.syc-forgot-form[hidden]{display:none!important}
.syc-stat-card{display:grid;align-content:center;gap:10px;min-width:0;padding:20px 22px;border:1px solid rgba(213,222,235,.95);border-radius:18px;background:#fff;box-shadow:var(--syc-shadow)}
.syc-stat-card span{color:var(--syc-muted);font-weight:700}
.syc-stat-card strong{font-size:clamp(23px,2.5vw,32px);line-height:1.1;color:#14213a;white-space:nowrap}
.syc-resident-summary{grid-template-columns:repeat(5,minmax(0,1fr));margin-bottom:18px}
.syc-money,.syc-metric strong,.syc-category-card strong,.syc-unit-account-card dd,.syc-table td{font-variant-numeric:tabular-nums}
.syc-inline-charge-type{margin:0 0 16px;padding:14px;border:1px dashed #bfcde0;border-radius:14px;background:#f8fbff}
.syc-payment-notice-info{display:grid;gap:8px}
.syc-status-pill.is-pending{color:#805b00;background:#fff0bd}
.syc-status-pill.is-approved{color:#087251;background:#dff7ee}
.syc-status-pill.is-rejected{color:#a51f32;background:#ffe6ea}
@media(max-width:1200px){.syc-resident-summary{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.syc-resident-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.syc-stat-card{min-height:108px;padding:16px}.syc-stat-card strong{white-space:normal;font-size:22px}}
@media(max-width:430px){.syc-resident-summary{grid-template-columns:1fr 1fr;gap:10px}.syc-stat-card{min-height:96px;padding:13px}.syc-stat-card strong{font-size:19px}.syc-stat-card span{font-size:12px}}

/* V0.7.3 finance navigation and incoming notification center */
.syc-finance-tabs {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  margin: 18px 0 22px;
  padding: 6px;
  border: 1px solid #dbe4ef;
  border-radius: 16px;
  background: #fff;
  scrollbar-width: thin;
}
.syc-finance-tabs button {
  flex: 0 0 auto;
  min-height: 44px;
  padding: 0 18px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #526078;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.syc-finance-tabs button:hover { background: #eef5ff; color: #075fc9; }
.syc-finance-tabs button.is-active { background: #0f67dc; color: #fff; box-shadow: 0 8px 20px rgba(15,103,220,.2); }
.syc-finance-tabs button b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  margin-left: 6px;
  padding: 0 6px;
  border-radius: 999px;
  background: #e43f50;
  color: #fff;
  font-size: 12px;
}
.syc-finance-tab-content { min-width: 0; }
.syc-finance-dashboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.syc-finance-shortcut {
  min-height: 150px;
  padding: 22px;
  border: 1px solid #dbe4ef;
  border-radius: 18px;
  background: #fff;
  color: #172238;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 10px 28px rgba(29,54,90,.06);
}
.syc-finance-shortcut:hover { border-color: #91bdf4; transform: translateY(-1px); }
.syc-finance-shortcut span,.syc-finance-shortcut small { display: block; color: #64748b; }
.syc-finance-shortcut strong { display: block; margin: 16px 0 8px; font-size: 30px; line-height: 1.1; }
.syc-finance-shortcut.has-alert { border-color: #f2a4ad; background: #fff8f8; }
.syc-finance-shortcut.has-alert strong { color: #bd2034; }

@media (max-width: 1050px) {
  .syc-finance-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .syc-finance-tabs { margin-inline: -2px; border-radius: 14px; }
  .syc-finance-tabs button { padding: 0 14px; }
  .syc-finance-dashboard { grid-template-columns: 1fr; }
  .syc-finance-shortcut { min-height: 120px; }
}

/* V0.8.0 white-label public site */
.syc-tenant-site{min-height:100vh;background:linear-gradient(135deg,var(--syc-secondary,#0b1220),#173b68);color:#fff;font-family:inherit;padding:28px clamp(18px,4vw,72px)}
.syc-tenant-header{display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:1180px;margin:0 auto 72px}
.syc-tenant-brand{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none;font-size:20px}
.syc-tenant-brand img{max-height:46px;max-width:180px;object-fit:contain}.syc-tenant-nav{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.syc-tenant-nav a{color:#dbeafe;text-decoration:none;font-weight:700}.syc-tenant-login{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);padding:12px 16px;border-radius:14px}.syc-tenant-hero,.syc-tenant-page{max-width:980px;margin:0 auto 36px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:30px;padding:clamp(28px,5vw,72px);box-shadow:0 24px 70px rgba(0,0,0,.22)}
.syc-tenant-hero h1,.syc-tenant-page h1{font-size:clamp(44px,7vw,86px);line-height:.98;margin:8px 0 20px}.syc-tenant-hero p,.syc-tenant-page p{font-size:20px;max-width:760px;color:#e5eefc}.syc-tenant-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}.syc-tenant-actions .syc-ghost-button{color:#fff;border-color:rgba(255,255,255,.25)}.syc-tenant-cards{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.syc-tenant-cards article{background:#fff;color:#0f172a;border-radius:24px;padding:26px;box-shadow:0 18px 50px rgba(0,0,0,.16)}.syc-tenant-cards h2{margin:0 0 12px;font-size:23px}.syc-tenant-cards p{color:#5b6780}.syc-tenant-content{font-size:18px;color:#f8fbff}.syc-tenant-content a{color:#fff;text-decoration:underline}.syc-tenant-footer{max-width:1180px;margin:42px auto 0;color:#cbd5e1;display:flex;gap:16px;flex-wrap:wrap}
@media(max-width:760px){.syc-tenant-header{align-items:flex-start;margin-bottom:34px}.syc-tenant-nav{justify-content:flex-start}.syc-tenant-cards{grid-template-columns:1fr}.syc-tenant-site{padding:18px}.syc-tenant-hero,.syc-tenant-page{border-radius:22px;padding:26px}.syc-tenant-hero h1,.syc-tenant-page h1{font-size:42px}}