@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("fonts/manrope-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
:root { font-family: Manrope, "Google Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --paper: #f8faf7; --card: #ffffff; --muted: #60716a; --line: #e3e9e3; --radius: 18px; }
body { -webkit-font-smoothing: antialiased; }
h1, h2, .brand-word, .family-card p { font-family: inherit; }
h1 { font-size: clamp(28px, 3vw, 36px); font-weight: 650; line-height: 1.18; letter-spacing: -1.3px; }
h2 { font-weight: 600; letter-spacing: -.6px; }
.brand-word { font-size: 24px; font-weight: 650; letter-spacing: -.9px; }
.icon-button { min-height: 44px; min-width: 44px; border-radius: 12px; }
.btn, .nav-item, .icon-button, .sidebar-hub-link, .module-back { transition: background-color .18s, border-color .18s, color .18s; }
.field input, .field select, .field textarea { transition: border-color .18s, box-shadow .18s; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--green); }
.landing-header .brand-word { font-size: 25px; }
.landing-login { letter-spacing: .3px; min-height: 44px; font-weight: 550; }
.landing-actions .icon-button { min-width: 44px; }
.hub-topbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; max-width: 1160px; margin: 0 auto; padding: 26px 32px; min-height: 96px; }
.hub-brand { display: inline-flex; align-items: center; gap: 8px; font-size: 24px; font-weight: 650; letter-spacing: -1px; white-space: nowrap; color: var(--green); min-height: 44px; }
.hub-brand-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--orange); margin-top: 16px; }
.hub-account-actions { display: flex; align-items: center; gap: 8px; }
.hub-account-button { display: inline-flex; align-items: center; gap: 10px; padding: 5px 10px 5px 6px; background: transparent; border: 1px solid var(--line); border-radius: 100px; min-height: 44px; color: var(--ink); }
.hub-account-button:hover { border-color: var(--green); background: var(--green-light); }
.hub-account-button .avatar { height: 30px; width: 30px; font-weight: 700; }
.hub-account-name { font-size: 12px; font-weight: 550; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hub-shell-footer { display: flex; justify-content: center; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; padding: 32px 20px 28px; }
.hub-shell-footer .icon { height: 12px; width: 12px; }
.sidebar { padding-top: 32px; }
.sidebar .brand { padding: 0 12px; min-height: 44px; }
.sidebar-hub-link { display: flex; align-items: center; gap: 9px; width: 100%; padding: 13px 12px; margin: 24px 0 20px; background: transparent; border: 1px solid var(--line); border-radius: 12px; text-align: left; font-size: 11px; color: var(--green); min-height: 44px; }
.sidebar-hub-link .icon { width: 16px; height: 16px; }
.sidebar-hub-link .icon:last-child { margin-left: auto; }
.sidebar-hub-link:hover { background: var(--green-light); }
.main-nav { gap: 5px; }
.main-nav .nav-item { min-height: 44px; }
.main-nav .nav-item[data-view="hub"] { display: none; }
.nav-mobile-label { display: none; }
.profile { margin-top: 20px; }
.module-back { display: inline-flex; align-items: center; gap: 7px; background: transparent; border: 0; padding: 8px 6px; min-height: 44px; color: var(--muted); font-size: 12px; border-radius: 8px; }
.module-back:hover { color: var(--green); background: var(--green-light); }
.module-back .icon { width: 16px; height: 16px; }
.breadcrumb strong { font-size: 12px; }
.mobile-logout { display: none; }
.content { max-width: 1280px; padding-top: 34px; }
.page-heading p { font-size: 12px; }
.page-heading .eyebrow { font-size: 10px; letter-spacing: 1px; }
.panel-heading h2, .modal-header h2 { font-size: 22px; }
.stat-value, .account-card .account-balance, .welcome-number, .donut-label strong { font-family: inherit; letter-spacing: -1px; font-weight: 600; }
.welcome-panel h2 { font-size: 27px; }
.welcome-panel p { font-size: 12px; }
.page-footer { font-size: 10px; }
[data-view-root]:focus { outline: none; }
.view-arrive { animation: view-arrive .28s ease both; }
@keyframes view-arrive { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
[data-theme="dark"] { --paper: #12231d; --card: #1c3028; --line: #33473b; --muted: #a9b9ae; }
[data-theme="dark"] .hub-account-button .avatar { color: #f0d2ae; }
[data-theme="dark"] .btn-primary:hover { background: #b0d3c5; }
@media (max-width: 960px) {
  .hub-topbar { padding: 20px 28px; }
  .sidebar .brand { padding: 0 7px; }
  .sidebar .brand-word { font-size: 21px; }
  .sidebar-hub-link { font-size: 10px; gap: 6px; padding: 10px 8px; }
}
@media (max-width: 720px) {
  .hub-topbar { padding: 14px 20px; min-height: 76px; gap: 8px; }
  .hub-brand { font-size: 22px; }
  .hub-account-name { display: none; }
  .hub-account-button { padding: 5px; min-width: 44px; justify-content: center; }
  .hub-account-actions { gap: 3px; }
  .hub-shell-footer { padding-top: 24px; }
  .sidebar { height: calc(72px + env(safe-area-inset-bottom)); padding: 0 6px env(safe-area-inset-bottom); }
  .sidebar-hub-link { display: none; }
  .main-nav .nav-item[data-view="hub"] { display: flex; }
  .main-nav .nav-item[data-view="home"] { display: none; }
  .main-nav .nav-item { flex: 1; min-width: 0; padding: 9px 2px; font-size: 9px; }
  .main-nav .nav-item[data-view="settings"] .nav-label { display: none; }
  .main-nav .nav-item[data-view="settings"] .nav-mobile-label { display: block; }
  .mobile-logout { display: inline-flex; }
  .main { padding-bottom: calc(82px + env(safe-area-inset-bottom)); }
  .mobile-brand .brand-word { font-size: 21px; }
  .topbar { padding: 0 20px; }
  .topbar-right { gap: 1px; }
  .topbar-right .privacy-badge { display: none; }
  .content { padding: 24px 20px; }
  .page-heading h1 { font-size: 28px; }
  .page-heading p { font-size: 12px; }
  .stat-value { font-size: 25px; }
  .welcome-panel h2 { font-size: 23px; }
  .welcome-panel p { font-size: 11px; }
  .landing-header .brand-word { font-size: 22px; }
  .toast { bottom: calc(91px + env(safe-area-inset-bottom)); }
}
@media (max-width: 360px) {
  .hub-topbar { padding-left: 16px; padding-right: 16px; }
  .hub-brand { font-size: 20px; }
  .hub-account-actions { gap: 0; }
}
@media (max-width: 420px) {
  .calendar-toolbar h2 { font-size: 20px; letter-spacing: -.6px; white-space: nowrap; }
  .calendar-controls { gap: 2px; }
  .calendar-controls .btn { padding-left: 8px; padding-right: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .view-arrive { animation: none; }
}
