:root,
html[data-theme="dark"] {
  color-scheme: dark;
  --hb-bg: #07111c;
  --hb-bg-soft: #091522;
  --hb-sidebar: #081827;
  --hb-surface: #0d1b2a;
  --hb-surface-2: #102238;
  --hb-surface-3: #142a41;
  --hb-border: #22384d;
  --hb-border-strong: #304b64;
  --hb-text: #f4f7fb;
  --hb-text-soft: #c8d3df;
  --hb-muted: #8fa3b8;
  --hb-primary: #d64836;
  --hb-primary-hover: #e15a47;
  --hb-primary-soft: rgba(214, 72, 54, .14);
  --hb-success: #42cf8b;
  --hb-warning: #e6aa4b;
  --hb-danger: #ef6b62;
  --hb-info: #62a7e4;
  --hb-unknown: #a8b4c2;
  --hb-shadow: 0 20px 50px rgba(0, 0, 0, .22);
  --hb-sidebar-width: 264px;
  --hb-topbar-height: 72px;
  --bs-body-bg: var(--hb-bg);
  --bs-body-color: var(--hb-text);
  --bs-border-color: var(--hb-border);
  --bs-secondary-color: var(--hb-muted);
  --bs-tertiary-bg: var(--hb-surface-2);
  --bs-emphasis-color: var(--hb-text);
  --bs-link-color: #91b9e1;
  --bs-link-hover-color: #b9d5ef;
}

html[data-theme="light"] {
  color-scheme: light;
  --hb-bg: #f4f7fa;
  --hb-bg-soft: #eef3f7;
  --hb-sidebar: #0b1a29;
  --hb-surface: #ffffff;
  --hb-surface-2: #f8fafc;
  --hb-surface-3: #edf3f7;
  --hb-border: #dbe4ec;
  --hb-border-strong: #c7d3de;
  --hb-text: #102033;
  --hb-text-soft: #31475c;
  --hb-muted: #667b8f;
  --hb-primary: #d64836;
  --hb-primary-hover: #bc3f31;
  --hb-primary-soft: rgba(214, 72, 54, .10);
  --hb-success: #1c9b63;
  --hb-warning: #b77a16;
  --hb-danger: #c94e46;
  --hb-info: #347fb8;
  --hb-unknown: #687789;
  --hb-shadow: 0 18px 45px rgba(34, 57, 78, .10);
  --bs-body-bg: var(--hb-bg);
  --bs-body-color: var(--hb-text);
  --bs-border-color: var(--hb-border);
  --bs-secondary-color: var(--hb-muted);
  --bs-tertiary-bg: var(--hb-surface-2);
  --bs-emphasis-color: var(--hb-text);
  --bs-link-color: #245f93;
  --bs-link-hover-color: #17456d;
}

html {
  position: relative;
  min-height: 100%;
  font-size: 14px;
  background: var(--hb-bg);
}

@media (min-width: 768px) {
  html { font-size: 16px; }
}

body.app-body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 85% 0%, rgba(214, 72, 54, .06), transparent 24rem),
    var(--hb-bg);
  color: var(--hb-text);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  transition: background-color .2s ease, color .2s ease;
}

a {
  color: var(--bs-link-color);
  text-underline-offset: .16em;
}

a:hover { color: var(--bs-link-hover-color); }

.app-icon-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.app-shell { min-height: 100vh; }

.app-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 1040;
  display: flex;
  flex-direction: column;
  width: var(--hb-sidebar-width);
  min-height: 100vh;
  padding: 1rem .9rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 35%),
    var(--hb-sidebar);
  border-right: 1px solid rgba(132, 164, 194, .16);
  box-shadow: 14px 0 40px rgba(0,0,0,.12);
}

.app-sidebar-brand {
  display: flex;
  align-items: center;
  min-height: 76px;
  padding: .35rem .55rem 1rem;
  border-bottom: 1px solid rgba(132, 164, 194, .14);
}

.app-sidebar-brand img {
  display: block;
  width: 196px;
  max-width: 100%;
  height: auto;
  max-height: 66px;
  object-fit: contain;
  object-position: left center;
}

.app-nav {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: .32rem;
  min-height: 0;
  padding: 1.15rem 0;
  overflow-y: auto;
  scrollbar-width: thin;
}

.app-nav-link {
  display: flex;
  align-items: center;
  gap: .82rem;
  min-height: 46px;
  padding: .68rem .8rem;
  border: 1px solid transparent;
  border-radius: .72rem;
  color: #c9d6e2;
  font-weight: 590;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.app-nav-link:hover {
  color: #fff;
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.05);
}

.app-nav-link.is-active {
  color: #fff;
  background: linear-gradient(135deg, #c73e30, var(--hb-primary));
  border-color: rgba(255,255,255,.10);
  box-shadow: 0 8px 26px rgba(214,72,54,.24);
}

.app-nav-icon,
.app-account-chevron {
  width: 1.3rem;
  height: 1.3rem;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-sidebar-footer {
  padding-top: .8rem;
  border-top: 1px solid rgba(132, 164, 194, .14);
}

.app-account-link {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
  padding: .65rem .55rem;
  color: #eef4fa;
  text-decoration: none;
  border-radius: .75rem;
}

.app-account-link:hover {
  color: #fff;
  background: rgba(255,255,255,.055);
}

.app-avatar {
  display: inline-grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, #2e7187, #4fa6a3);
  font-weight: 750;
}

.app-account-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.app-account-copy strong,
.app-account-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-account-copy strong { font-size: .88rem; }
.app-account-copy small { color: #95a9bc; font-size: .74rem; }
.app-account-chevron { width: 1rem; height: 1rem; }

.has-app-sidebar .app-stage {
  min-height: 100vh;
  margin-left: var(--hb-sidebar-width);
}

.app-stage { min-width: 0; }

.app-topbar {
  position: sticky;
  top: 0;
  z-index: 1020;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: var(--hb-topbar-height);
  padding: .75rem clamp(1rem, 2.3vw, 2rem);
  background: color-mix(in srgb, var(--hb-bg) 88%, transparent);
  border-bottom: 1px solid var(--hb-border);
  backdrop-filter: blur(16px);
}

.app-topbar-start,
.app-topbar-actions {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-width: 0;
}

.app-topbar-actions { margin-left: auto; }

.app-product-title {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.15;
}

.app-product-title span {
  color: var(--hb-text);
  font-weight: 740;
  letter-spacing: -.01em;
}

.app-product-title small {
  color: var(--hb-muted);
  font-size: .72rem;
}

.app-public-brand {
  display: flex;
  align-items: center;
  min-height: 48px;
}

.app-public-brand img {
  width: 180px;
  max-width: 45vw;
  height: auto;
  max-height: 54px;
}

.app-public-brand-dark,
.app-public-brand-light { display: none; }

html[data-theme="dark"] .app-public-brand-dark { display: block; }
html[data-theme="light"] .app-public-brand-light { display: block; }

.app-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .42rem;
  min-width: 42px;
  min-height: 42px;
  padding: .5rem .7rem;
  border: 1px solid var(--hb-border);
  border-radius: .72rem;
  color: var(--hb-text-soft);
  background: var(--hb-surface);
  text-decoration: none;
  box-shadow: 0 5px 16px rgba(0,0,0,.04);
  transition: border-color .15s ease, background-color .15s ease, color .15s ease, transform .15s ease;
}

button.app-icon-button { cursor: pointer; }

.app-icon-button:hover {
  color: var(--hb-text);
  background: var(--hb-surface-2);
  border-color: var(--hb-border-strong);
}

.app-icon-button:active { transform: translateY(1px); }

.app-icon-button svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-action-label {
  font-size: .75rem;
  font-weight: 700;
}

.app-menu-button { display: none; }

.theme-icon { display: none; }
html[data-theme="dark"] .theme-icon-sun { display: block; }
html[data-theme="light"] .theme-icon-moon { display: block; }

.app-topbar-text-link {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: .5rem .7rem;
  border-radius: .65rem;
  color: var(--hb-text-soft);
  font-size: .8rem;
  font-weight: 620;
  text-decoration: none;
}

.app-topbar-text-link:hover {
  color: var(--hb-text);
  background: var(--hb-surface-2);
}

.app-logout-form { margin: 0; }

.app-content {
  width: 100%;
  max-width: 1720px;
  margin: 0 auto;
  padding: clamp(1rem, 2.4vw, 2.25rem);
}

.public-shell .app-content {
  max-width: 900px;
  padding-top: clamp(1.2rem, 4vw, 3rem);
}

.app-main-content { min-height: calc(100vh - var(--hb-topbar-height) - 6rem); }

.app-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem 1rem;
  margin-top: 2.5rem;
  padding: 1.1rem 0 0;
  color: var(--hb-muted);
  border-top: 1px solid var(--hb-border);
  font-size: .82rem;
}

.app-footer a { color: var(--hb-muted); }

.app-sidebar-overlay {
  position: fixed;
  inset: 0;
  z-index: 1030;
  display: none;
  padding: 0;
  border: 0;
  background: rgba(2, 8, 15, .66);
  backdrop-filter: blur(2px);
}

.btn:focus,
.btn:active:focus,
.btn-link:focus,
.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.app-icon-button:focus-visible,
.app-nav-link:focus-visible,
.app-account-link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--hb-primary) 32%, transparent);
}

.btn-primary {
  --bs-btn-bg: var(--hb-primary);
  --bs-btn-border-color: var(--hb-primary);
  --bs-btn-hover-bg: var(--hb-primary-hover);
  --bs-btn-hover-border-color: var(--hb-primary-hover);
  --bs-btn-active-bg: var(--hb-primary-hover);
  --bs-btn-active-border-color: var(--hb-primary-hover);
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
}

.btn-outline-secondary {
  --bs-btn-color: var(--hb-text-soft);
  --bs-btn-border-color: var(--hb-border-strong);
  --bs-btn-hover-bg: var(--hb-surface-3);
  --bs-btn-hover-border-color: var(--hb-border-strong);
  --bs-btn-hover-color: var(--hb-text);
}

.card,
.modal-content,
.dropdown-menu,
.list-group-item {
  color: var(--hb-text);
  background: var(--hb-surface);
  border-color: var(--hb-border);
}

.card { box-shadow: 0 8px 26px rgba(0,0,0,.06); }

.form-control,
.form-select,
.input-group-text {
  color: var(--hb-text);
  background-color: var(--hb-surface-2);
  border-color: var(--hb-border);
}

.form-control::placeholder { color: color-mix(in srgb, var(--hb-muted) 78%, transparent); }

.form-control:focus,
.form-select:focus {
  color: var(--hb-text);
  background-color: var(--hb-surface-2);
  border-color: color-mix(in srgb, var(--hb-primary) 65%, var(--hb-border));
}

.form-check-input {
  background-color: var(--hb-surface-2);
  border-color: var(--hb-border-strong);
}

.table {
  --bs-table-color: var(--hb-text-soft);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--hb-border);
  --bs-table-striped-color: var(--hb-text-soft);
  --bs-table-striped-bg: color-mix(in srgb, var(--hb-surface-2) 72%, transparent);
  --bs-table-hover-color: var(--hb-text);
  --bs-table-hover-bg: color-mix(in srgb, var(--hb-surface-3) 75%, transparent);
}

.table thead th {
  color: var(--hb-muted);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .015em;
  text-transform: none;
}

.text-muted { color: var(--hb-muted) !important; }
.border,
.border-top,
.border-bottom { border-color: var(--hb-border) !important; }

.alert {
  color: var(--hb-text-soft);
  background: var(--hb-surface-2);
  border-color: var(--hb-border);
}

.pagination {
  --bs-pagination-bg: var(--hb-surface);
  --bs-pagination-color: var(--hb-text-soft);
  --bs-pagination-border-color: var(--hb-border);
  --bs-pagination-hover-bg: var(--hb-surface-2);
  --bs-pagination-hover-color: var(--hb-text);
  --bs-pagination-hover-border-color: var(--hb-border-strong);
  --bs-pagination-active-bg: var(--hb-primary);
  --bs-pagination-active-border-color: var(--hb-primary);
}

.authenticator-qr {
  display: block;
  width: 320px;
  max-width: 100%;
  height: auto;
  margin-bottom: 1rem;
  padding: .45rem;
  border-radius: .65rem;
  background: #fff;
  image-rendering: pixelated;
}

.karasu-login {
  max-width: 640px;
  overflow: hidden;
  padding: 0 0 1.4rem;
  border: 1px solid var(--hb-border);
  border-radius: 1rem;
  background: var(--hb-surface);
  box-shadow: var(--hb-shadow);
}

.karasu-login-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(132px, 24vw, 190px);
  padding: clamp(1rem, 3vw, 1.5rem);
  margin-bottom: 1.3rem;
  background:
    radial-gradient(circle at 80% 0%, rgba(214,72,54,.18), transparent 18rem),
    #0c1926;
  border-bottom: 4px solid var(--hb-primary);
}

.karasu-login-logo {
  display: block;
  width: min(100%, 560px);
  height: auto;
  max-height: 160px;
  object-fit: contain;
}

.karasu-login > h1,
.karasu-login > p,
.karasu-login > form {
  margin-left: clamp(1rem, 4vw, 2rem);
  margin-right: clamp(1rem, 4vw, 2rem);
}

.karasu-login h1 {
  margin-top: 0;
  color: var(--hb-text);
  font-size: clamp(1.5rem, 4vw, 2rem);
  font-weight: 760;
  letter-spacing: -.025em;
}

.karasu-login .btn-primary {
  min-height: 44px;
  padding-inline: 1.35rem;
}

.v3-hero {
  margin-bottom: 1rem;
  padding: clamp(1.5rem,4vw,3rem);
  color: #fff;
  background:
    linear-gradient(120deg, #0d2438, #163d50 66%, #225d61);
  border: 1px solid #29465b;
  border-top: 4px solid var(--hb-primary);
  border-radius: 1.15rem;
  box-shadow: var(--hb-shadow);
}

.v3-hero h1 {
  margin: .35rem 0;
  font-size: clamp(2rem,4vw,3.3rem);
  font-weight: 760;
  letter-spacing: -.03em;
}

.v3-hero p { max-width: 55rem; color: #d8e5ef; }
.v3-eyebrow { color: #f0b1a9; text-transform: uppercase; letter-spacing: .14em; font-size: .8rem; font-weight: 750; }

.v3-warning {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem 1.5rem;
  align-items: center;
  margin: 1rem 0 1.5rem;
  padding: .9rem 1.15rem;
  color: color-mix(in srgb, var(--hb-warning) 82%, var(--hb-text));
  background: color-mix(in srgb, var(--hb-warning) 10%, var(--hb-surface));
  border: 1px solid color-mix(in srgb, var(--hb-warning) 28%, var(--hb-border));
  border-left: .35rem solid var(--hb-warning);
  border-radius: .55rem;
}

.v3-section-title { color: var(--hb-text); font-size: 1.4rem; margin: 2rem 0 1rem; }
.v3-kpi-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 1rem; }
.v3-module-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 1rem; }

.v3-kpi,
.v3-module {
  padding: 1.2rem;
  background: var(--hb-surface);
  border: 1px solid var(--hb-border);
  border-radius: .9rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}

.v3-kpi { display: flex; flex-direction: column; gap: .45rem; }
.v3-kpi > span { color: var(--hb-muted); font-weight: 670; }
.v3-kpi strong { color: var(--hb-text); font-size: clamp(1.45rem,2.5vw,2rem); overflow-wrap: anywhere; }
.v3-kpi small, .v3-footnote { color: var(--hb-muted); }
.v3-kpi details { margin-top: auto; color: var(--hb-muted); font-size: .85rem; }
.v3-kpi details p { margin: .4rem 0; }
.v3-module h3 { color: var(--hb-text); font-size: 1.05rem; }
.v3-module p { margin-bottom: 0; color: var(--hb-text-soft); }
.v3-footnote { margin: 1.4rem 0; }
.v3-table-wrap { overflow: auto; border: 1px solid var(--hb-border); border-radius: .8rem; background: var(--hb-surface); }
.v3-table-wrap table { margin: 0; min-width: 650px; }
.v3-bar { width: 130px; height: .65rem; border-radius: 1rem; background: var(--hb-surface-3); overflow: hidden; }
.v3-bar span { display: block; height: 100%; background: linear-gradient(90deg,#26867b,#62b79f); }
.v3-caveats { margin-top: 1.5rem; padding: 1.1rem 1.4rem; color: var(--hb-text-soft); background: var(--hb-surface-2); border: 1px solid var(--hb-border); border-radius: .8rem; }

.cockpit { color: var(--hb-text); overflow-wrap: anywhere; }
.cockpit-hero {
  padding: clamp(1.25rem, 3vw, 2.5rem);
  color: #fff;
  background:
    radial-gradient(circle at 92% 0%, rgba(214,72,54,.16), transparent 20rem),
    #0c1926;
  border: 1px solid #263d52;
  border-top: 4px solid var(--hb-primary);
  border-radius: 1rem;
  box-shadow: var(--hb-shadow);
}

.cockpit-hero h1 { font-size: clamp(1.8rem, 4vw, 3rem); font-weight: 760; letter-spacing: -.03em; }
.cockpit-chips, .cockpit-jump { display: flex; flex-wrap: wrap; gap: .65rem; }
.cockpit-chips span { padding: .35rem .7rem; color: #dce7f1; border: 1px solid #506579; border-radius: 2rem; }
.cockpit-jump { margin: 1rem 0; }
.cockpit-jump a { padding: .7rem 1rem; color: var(--hb-text-soft); background: var(--hb-surface); border: 1px solid var(--hb-border); border-radius: .55rem; text-decoration: none; }
.cockpit-jump a:hover { color: var(--hb-text); border-color: var(--hb-border-strong); }
.cockpit :focus-visible { outline: 3px solid color-mix(in srgb, var(--hb-primary) 65%, #fff); outline-offset: 3px; }
.cockpit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }

.cockpit-panel {
  min-width: 0;
  padding: 1.25rem;
  background: var(--hb-surface);
  border: 1px solid var(--hb-border);
  border-radius: .85rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
  scroll-margin-top: calc(var(--hb-topbar-height) + 1rem);
}

.cockpit-panel h2 { margin-bottom: 1rem; color: var(--hb-text); font-size: 1.25rem; font-weight: 720; }
.cockpit-panel h3 { margin: 1.25rem 0 .75rem; color: var(--hb-text); font-size: 1.05rem; font-weight: 700; }
.cockpit-wide { grid-column: 1 / -1; }
#property-summary { margin-bottom: 1rem; }
.cockpit-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 0; }
.cockpit-summary dt, .cockpit-amounts dt { color: var(--hb-muted); font-weight: 520; }
.cockpit-summary dd { margin: .5rem 0 0; color: var(--hb-text); font-weight: 720; }
.cockpit-amounts > div { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid var(--hb-border); }
.cockpit-amounts dd { margin: 0; color: var(--hb-text); text-align: right; font-size: 1.25rem; font-weight: 720; }
.cockpit [data-amount-state="unknown"] { color: var(--hb-warning); }
.cockpit [data-amount-state="not-applicable"] { color: var(--hb-unknown); }
.cockpit-note { margin: .8rem 0 0; color: var(--hb-muted); }
.cockpit-legend { background: var(--hb-surface-2); }
.cockpit-legend dd { margin-bottom: .8rem; color: var(--hb-muted); }
.cockpit-table { overflow: auto; }
.cockpit-table table { min-width: 540px; margin: 0; }
.cockpit-table caption { color: var(--hb-muted); }
.cockpit-issues { list-style: none; margin: 0; padding: 0; }
.cockpit-issues li { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; padding: .9rem 0; border-bottom: 1px solid var(--hb-border); }
.cockpit-issue-state { padding: .25rem .6rem; color: color-mix(in srgb, var(--hb-warning) 88%, var(--hb-text)); background: color-mix(in srgb, var(--hb-warning) 12%, var(--hb-surface)); border: 1px solid color-mix(in srgb, var(--hb-warning) 25%, var(--hb-border)); border-radius: .4rem; }

@media (max-width: 1199px) {
  :root { --hb-sidebar-width: 238px; }
  .app-sidebar-brand img { width: 178px; }
  .app-nav-link { font-size: .88rem; }
}

@media (max-width: 991.98px) {
  .has-app-sidebar .app-stage { margin-left: 0; }

  .app-sidebar {
    width: min(86vw, 300px);
    transform: translateX(-104%);
    transition: transform .22s ease;
  }

  body.sidebar-open { overflow: hidden; }
  body.sidebar-open .app-sidebar { transform: translateX(0); }
  body.sidebar-open .app-sidebar-overlay { display: block; }

  .app-menu-button { display: inline-flex; }

  .app-topbar {
    min-height: 64px;
    padding-inline: .85rem;
  }

  .app-action-label,
  .app-topbar-text-link { display: none; }

  .app-content { padding: 1rem; }

  .cockpit-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  .app-product-title small { display: none; }
  .app-topbar-actions { gap: .4rem; }
  .app-icon-button { min-width: 40px; min-height: 40px; padding: .42rem; }
  .app-security-link { display: none; }

  .v3-kpi-grid,
  .v3-module-grid,
  .cockpit-grid,
  .cockpit-summary { grid-template-columns: 1fr; }

  .v3-hero { border-radius: .8rem; }
  .cockpit-panel { padding: 1rem; }
  .cockpit-amounts > div { flex-wrap: wrap; }

  .karasu-login { border-radius: .8rem; }
  .karasu-login-brand { min-height: 120px; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}


/* Finance presentation polish and dashboard workspace */
.v3-finance-kpis .v3-finance-kpi,
.home-kpi-card,
.home-panel,
.home-module-grid .card {
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.v3-finance-kpis .v3-finance-kpi:hover,
.home-kpi-card:hover,
.home-panel:hover,
.home-module-grid .card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--hb-primary) 28%, var(--hb-border));
  box-shadow: 0 16px 34px rgba(0,0,0,.12);
}

.v3-kpi-heading,
.v3-money-chip,
.v3-money-hero,
.v3-scale-cell,
.v3-section-heading {
  display: flex;
  align-items: center;
}

.v3-kpi-heading { gap: .65rem; color: var(--hb-muted); font-weight: 670; }
.v3-money-hero { gap: .55rem; margin-top: .2rem; }
.v3-money-hero strong { color: var(--hb-text); font-size: clamp(1.5rem,2.4vw,2rem); }
.v3-money-currency { color: var(--hb-primary); font-size: 1.1rem; font-weight: 800; }

.v3-euro-badge {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  border-radius: .65rem;
  color: #fff;
  background: linear-gradient(145deg, var(--hb-primary), #b63126);
  box-shadow: 0 7px 18px color-mix(in srgb, var(--hb-primary) 24%, transparent);
  font-weight: 850;
}
.v3-euro-badge-sm { width: 1.6rem; height: 1.6rem; border-radius: .5rem; font-size: .82rem; }
.v3-unverified-value { color: var(--hb-warning) !important; font-size: 1.2rem !important; }

.v3-section-heading {
  justify-content: space-between;
  gap: 1rem;
  margin: 2rem 0 .85rem;
}
.v3-section-heading .v3-section-title { margin: .15rem 0 0; }
.v3-section-kicker {
  color: var(--hb-primary);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.v3-section-note { color: var(--hb-muted); font-size: .8rem; }

.v3-finance-table-wrap { border-radius: 1rem; box-shadow: 0 10px 26px rgba(0,0,0,.06); }
.v3-finance-table { min-width: 780px !important; }
.v3-finance-table tbody tr { transition: background-color .15s ease; }
.v3-finance-table tbody tr:hover { background: color-mix(in srgb, var(--hb-primary) 5%, var(--hb-surface)); }
.v3-finance-table td, .v3-finance-table th { padding-top: .85rem; padding-bottom: .85rem; }

.v3-month-pill {
  display: inline-flex;
  align-items: baseline;
  gap: .45rem;
  min-width: 5rem;
}
.v3-month-pill > span { color: var(--hb-text); font-size: 1rem; font-weight: 800; }
.v3-month-pill small { color: var(--hb-muted); text-transform: capitalize; }

.v3-money-chip {
  width: max-content;
  gap: .5rem;
  padding: .38rem .55rem .38rem .4rem;
  border: 1px solid var(--hb-border);
  border-radius: .7rem;
  background: var(--hb-surface-2);
}
.v3-money-chip strong { color: var(--hb-text); font-size: .9rem; }

.v3-count-chip,
.v3-state-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.85rem;
  padding: .25rem .6rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 750;
}
.v3-count-chip { color: var(--hb-text-soft); background: var(--hb-surface-3); border: 1px solid var(--hb-border); }
.v3-state-unknown { color: var(--hb-warning); background: color-mix(in srgb, var(--hb-warning) 10%, var(--hb-surface)); border: 1px solid color-mix(in srgb, var(--hb-warning) 25%, var(--hb-border)); }

.v3-scale-cell { gap: .75rem; min-width: 180px; }
.v3-scale-track {
  position: relative;
  flex: 1 1 auto;
  height: .72rem;
  overflow: hidden;
  border-radius: 999px;
  background: var(--hb-surface-3);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--hb-border) 75%, transparent);
}
.v3-scale-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--hb-primary), #ed7b6c);
  box-shadow: 0 0 16px color-mix(in srgb, var(--hb-primary) 20%, transparent);
}
.v3-scale-value { min-width: 3.7rem; color: var(--hb-text); text-align: right; font-size: .82rem; }

.home-dashboard { margin-bottom: 2rem; }
.home-dashboard-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  padding: clamp(1.35rem, 3vw, 2.3rem);
  margin-bottom: 1rem;
  border: 1px solid #263d52;
  border-top: 4px solid var(--hb-primary);
  border-radius: 1.15rem;
  background:
    radial-gradient(circle at 90% -20%, rgba(214,72,54,.22), transparent 22rem),
    linear-gradient(135deg, #0c1926, #10273a);
  box-shadow: var(--hb-shadow);
}
.home-dashboard-eyebrow {
  color: #f0b1a9;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.home-dashboard-hero h1 { margin: .35rem 0 .25rem; color: #fff; font-size: clamp(2rem,4vw,3.1rem); font-weight: 780; letter-spacing: -.035em; }
.home-dashboard-hero p { max-width: 44rem; margin: 0; color: #c7d5e1; }
.home-dashboard-actions { display: flex; flex-wrap: wrap; gap: .65rem; }

.home-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .85rem;
  margin: 1rem 0;
}
.home-kpi-card {
  display: flex;
  align-items: flex-start;
  gap: .8rem;
  min-width: 0;
  padding: 1rem;
  color: var(--hb-text);
  text-decoration: none;
  background: var(--hb-surface);
  border: 1px solid var(--hb-border);
  border-radius: .9rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
}
.home-kpi-card:hover { color: var(--hb-text); }
.home-kpi-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 2.3rem;
  height: 2.3rem;
  border-radius: .72rem;
  font-weight: 850;
  background: var(--hb-surface-3);
}
.home-kpi-icon-money { color: #5bd3a6; background: rgba(54,179,126,.12); }
.home-kpi-icon-alert, .home-kpi-icon-issue { color: #ff8a7c; background: rgba(214,72,54,.12); }
.home-kpi-icon-deposit { color: #a78bfa; background: rgba(124,92,214,.13); }
.home-kpi-icon-source { color: #7db8ff; background: rgba(61,129,208,.13); }
.home-kpi-copy { min-width: 0; display: flex; flex-direction: column; gap: .18rem; }
.home-kpi-copy small { color: var(--hb-muted); font-weight: 650; }
.home-kpi-copy strong { color: var(--hb-text); font-size: clamp(1.25rem,2vw,1.65rem); overflow-wrap: anywhere; }
.home-kpi-copy span { color: var(--hb-muted); font-size: .75rem; line-height: 1.3; }

.home-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, .75fr);
  gap: 1rem;
  margin-top: 1rem;
}
.home-panel {
  min-width: 0;
  padding: 1.2rem;
  background: var(--hb-surface);
  border: 1px solid var(--hb-border);
  border-radius: .95rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
}
.home-panel-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.home-panel-heading h2 { margin: .15rem 0 0; color: var(--hb-text); font-size: 1.08rem; }
.home-panel-heading a { color: var(--hb-text-soft); font-size: .8rem; text-decoration: none; white-space: nowrap; }
.home-panel-heading a:hover { color: var(--hb-primary); }
.home-panel-kicker { color: var(--hb-primary); font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }

.home-month-bars {
  display: grid;
  grid-template-columns: repeat(12, minmax(24px, 1fr));
  align-items: end;
  gap: .45rem;
  min-height: 180px;
  padding: .75rem .25rem .2rem;
  border-bottom: 1px solid var(--hb-border);
}
.home-month-bar { display: flex; flex-direction: column; gap: .45rem; align-items: center; min-width: 0; }
.home-month-bar-value { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; width: 100%; height: 135px; gap: .25rem; }
.home-month-bar-value strong { color: var(--hb-muted); font-size: .66rem; font-weight: 700; }
.home-month-bar-value span {
  display: block;
  width: min(100%, 24px);
  min-height: 4px;
  border-radius: .35rem .35rem .12rem .12rem;
  background: linear-gradient(180deg, #ef7364, var(--hb-primary));
  box-shadow: 0 5px 12px rgba(214,72,54,.18);
}
.home-month-bar small { color: var(--hb-muted); font-size: .65rem; text-transform: capitalize; }
.home-panel-note { margin: .8rem 0 0; color: var(--hb-muted); font-size: .76rem; }

.home-source-list { display: grid; gap: .15rem; margin: 0; }
.home-source-list > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .7rem 0;
  border-bottom: 1px solid var(--hb-border);
}
.home-source-list dt { color: var(--hb-muted); font-weight: 550; }
.home-source-list dd { margin: 0; color: var(--hb-text); font-size: 1.05rem; font-weight: 800; }
.home-preview-badge {
  display: inline-flex;
  margin-top: 1rem;
  padding: .35rem .6rem;
  color: var(--hb-warning);
  background: color-mix(in srgb, var(--hb-warning) 10%, var(--hb-surface));
  border: 1px solid color-mix(in srgb, var(--hb-warning) 24%, var(--hb-border));
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
}
.home-modules-title { margin: 2rem 0 .9rem; color: var(--hb-text); font-size: 1.1rem; }

.app-main-content { animation: hb-page-in .24s ease-out both; }
@keyframes hb-page-in {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 1280px) {
  .home-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .home-dashboard-hero { align-items: flex-start; flex-direction: column; }
  .home-dashboard-grid { grid-template-columns: 1fr; }
  .home-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-month-bars { overflow-x: auto; grid-template-columns: repeat(12, minmax(38px, 1fr)); }
}

@media (max-width: 600px) {
  .home-kpi-grid { grid-template-columns: 1fr; }
  .v3-section-heading { align-items: flex-start; flex-direction: column; }
  .v3-section-note { align-self: flex-start; }
}


/* Property cockpit workspace polish */
.cockpit-hero-workspace {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
}

.cockpit-hero-copy { min-width: 0; }

.cockpit-hero-mark {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: clamp(92px, 11vw, 132px);
  aspect-ratio: 1;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 1.25rem;
  background:
    radial-gradient(circle at 25% 20%, rgba(214,72,54,.28), transparent 48%),
    rgba(255,255,255,.04);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
}
.cockpit-hero-mark span {
  color: #fff;
  font-size: clamp(1.8rem, 4vw, 3rem);
  font-weight: 850;
  letter-spacing: -.05em;
}
.cockpit-hero-mark small {
  margin-top: -.6rem;
  color: #f0b1a9;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .15em;
}

.cockpit-stat-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .8rem;
  margin: 1rem 0;
}

.cockpit-stat {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  min-width: 0;
  padding: .95rem;
  background: var(--hb-surface);
  border: 1px solid var(--hb-border);
  border-radius: .85rem;
  box-shadow: 0 8px 24px rgba(0,0,0,.05);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.cockpit-stat:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--hb-primary) 28%, var(--hb-border));
  box-shadow: 0 16px 32px rgba(0,0,0,.11);
}
.cockpit-stat > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: .18rem;
}
.cockpit-stat small { color: var(--hb-muted); font-weight: 650; line-height: 1.25; }
.cockpit-stat strong { color: var(--hb-text); font-size: clamp(1.05rem,1.6vw,1.35rem); overflow-wrap: anywhere; }
.cockpit-stat strong[data-state="unknown"] { color: var(--hb-warning); }
.cockpit-stat strong[data-state="not-applicable"] { color: var(--hb-unknown); }
.cockpit-stat > div > span { color: var(--hb-muted); font-size: .72rem; }

.cockpit-stat-icon,
.cockpit-finance-icon,
.cockpit-entity-icon,
.cockpit-issue-icon {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  font-weight: 850;
}
.cockpit-stat-icon {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: .7rem;
}
.cockpit-stat-icon-money { color: #62d5a8; background: rgba(54,179,126,.12); }
.cockpit-stat-icon-deposit { color: #b196ff; background: rgba(124,92,214,.14); }
.cockpit-stat-icon-owner { color: #7db8ff; background: rgba(61,129,208,.13); }
.cockpit-stat-icon-alert,
.cockpit-stat-icon-issue { color: #ff8a7c; background: rgba(214,72,54,.13); }

.cockpit-jump-sticky {
  position: sticky;
  top: calc(var(--hb-topbar-height) + .75rem);
  z-index: 15;
  padding: .5rem;
  background: color-mix(in srgb, var(--hb-bg) 88%, transparent);
  border: 1px solid var(--hb-border);
  border-radius: .75rem;
  backdrop-filter: blur(14px);
}
.cockpit-jump-sticky a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
}

.cockpit-panel-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .9rem;
}
.cockpit-panel-heading h2 { margin: .15rem 0 0; }
.cockpit-panel-kicker {
  color: var(--hb-primary);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.cockpit-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.8rem;
  padding: .2rem .55rem;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 750;
  white-space: nowrap;
}
.cockpit-status-unknown {
  color: var(--hb-warning);
  background: color-mix(in srgb, var(--hb-warning) 10%, var(--hb-surface));
  border: 1px solid color-mix(in srgb, var(--hb-warning) 24%, var(--hb-border));
}
.cockpit-status-na {
  color: var(--hb-unknown);
  background: var(--hb-surface-3);
  border: 1px solid var(--hb-border);
}
.cockpit-status-warning {
  color: #ff9b8f;
  background: rgba(214,72,54,.12);
  border: 1px solid rgba(214,72,54,.28);
}

.cockpit-summary-panel {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--hb-surface-2) 70%, transparent), transparent),
    var(--hb-surface);
}

.cockpit-unit-ref {
  display: inline-flex;
  min-width: 3.2rem;
  justify-content: center;
  padding: .28rem .5rem;
  color: var(--hb-text);
  background: var(--hb-surface-3);
  border: 1px solid var(--hb-border);
  border-radius: .55rem;
  font-size: .78rem;
  font-weight: 800;
}

.cockpit-entity-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 1rem;
}
.cockpit-entity-icon {
  width: 2.7rem;
  height: 2.7rem;
  color: #fff;
  background: linear-gradient(145deg, var(--hb-primary), #a83329);
  border-radius: .8rem;
  box-shadow: 0 8px 18px rgba(214,72,54,.18);
}
.cockpit-entity-card h2 { margin-bottom: .45rem; }
.cockpit-entity-card p { margin-bottom: .55rem; }

.cockpit-finance-panel {
  position: relative;
  overflow: hidden;
}
.cockpit-finance-panel::after {
  content: "";
  position: absolute;
  width: 9rem;
  height: 9rem;
  right: -4.5rem;
  top: -4.5rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--hb-primary) 7%, transparent);
  pointer-events: none;
}
.cockpit-finance-icon {
  width: 2rem;
  height: 2rem;
  color: #fff;
  background: linear-gradient(145deg, var(--hb-primary), #ae372c);
  border-radius: .65rem;
  z-index: 1;
}

.cockpit-amounts dd[data-amount-state="known"] {
  color: var(--hb-text);
}
.cockpit-amounts dd[data-amount-state="known"]::before {
  content: "€";
  display: inline-grid;
  place-items: center;
  width: 1.55rem;
  height: 1.55rem;
  margin-right: .45rem;
  color: #fff;
  background: var(--hb-primary);
  border-radius: .45rem;
  font-size: .7rem;
  font-weight: 850;
  vertical-align: middle;
}

.cockpit-control-panel {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--hb-surface-2) 62%, transparent), transparent),
    var(--hb-surface);
}

.cockpit-issue-icon {
  width: 1.85rem;
  height: 1.85rem;
  color: #ff9b8f;
  background: rgba(214,72,54,.12);
  border-radius: 50%;
}
.cockpit-issue-evidence {
  color: var(--hb-muted);
  margin-left: auto;
}
.cockpit-documents-block {
  margin-top: 1rem;
  padding: 1rem;
  background: var(--hb-surface-2);
  border: 1px solid var(--hb-border);
  border-radius: .75rem;
}
.cockpit-documents-block h3 { margin-top: 0; }

@media (max-width: 1380px) {
  .cockpit-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
  .cockpit-hero-workspace { align-items: flex-start; }
  .cockpit-hero-mark { width: 86px; }
  .cockpit-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cockpit-jump-sticky { position: static; }
}

@media (max-width: 520px) {
  .cockpit-hero-workspace { flex-direction: column; }
  .cockpit-hero-mark { display: none; }
  .cockpit-stat-grid { grid-template-columns: 1fr; }
  .cockpit-panel-heading { flex-direction: column; align-items: flex-start; }
  .cockpit-issue-evidence { width: 100%; margin-left: 2.45rem; }
}