/* Byld landlord dashboard demo ("Byld Manage"). Rebuilt from the v3 design export; only landlords.html uses it.
   Breakpoints follow the export: phone below 760px, two columns to 1179px, three from 1180px,
   and the section tabs sit in the header row from 1440px. */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('fonts/inter-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: 'Inter Tight'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('fonts/inter-tight-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; }

:root, :root[data-theme="light"] {
  --bg: #F3F5F9; --glow1: rgba(46,107,255,0.07); --glow2: rgba(46,107,255,0.04);
  --shell: #FFFFFF; --shell-shadow: 0 1px 2px rgba(11,27,63,0.04), 0 24px 60px rgba(11,27,63,0.07);
  --card: #FFFFFF; --card-shadow: 0 1px 2px rgba(11,27,63,0.04), 0 6px 18px rgba(11,27,63,0.04);
  --line: #E6E9F0; --tile: #F3F6FB; --tile-hover: #E8EEF8; --row-hover: #F6F8FC;
  --ink: #0B1B3F; --mute: #5D6782; --faint: #9AA3B8; --solid: #0B1B3F; --solid-ink: #FFFFFF; --bar-base: #0B1B3F; --menu: #FFFFFF;
  --menu-shadow: 0 24px 60px rgba(11,27,63,0.16);
  --green: #12895A; --red: #D63B40; --amber: #B26A00; --blue: #2E62E0; --grey: var(--mute);
  --green-bg: rgba(22,163,106,0.14); --red-bg: rgba(229,72,77,0.13); --amber-bg: rgba(232,155,43,0.18); --blue-bg: rgba(91,140,255,0.15); --grey-bg: var(--tile-hover);
  --link: #2E62E0; --link-hover: #1B47B8;
  --focus: #2E6BFF;
  color-scheme: light;
}
:root[data-theme="dark"] {
  --bg: #04060B; --glow1: rgba(46,107,255,0.22); --glow2: rgba(46,107,255,0.14);
  --shell: rgba(12,16,26,0.55); --shell-shadow: 0 30px 80px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.05);
  --card: rgba(24,30,46,0.55); --card-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 10px 30px rgba(0,0,0,0.22);
  --line: rgba(255,255,255,0.08); --tile: rgba(255,255,255,0.05); --tile-hover: rgba(255,255,255,0.1); --row-hover: rgba(255,255,255,0.04);
  --ink: #F3F5FA; --mute: rgba(226,232,246,0.66); --faint: rgba(226,232,246,0.38); --solid: #FFFFFF; --solid-ink: #0B1220; --bar-base: #E9EDF5; --menu: rgba(18,22,34,0.97);
  --menu-shadow: 0 24px 60px rgba(0,0,0,0.45);
  --green: #2FBF80; --red: #F0666B; --amber: #F0A43A; --blue: #7FA3FF; --grey: var(--mute);
  --green-bg: rgba(22,163,106,0.18); --red-bg: rgba(229,72,77,0.18); --amber-bg: rgba(232,155,43,0.18); --blue-bg: rgba(91,140,255,0.18); --grey-bg: var(--tile-hover);
  --link: #8DB0FF; --link-hover: #B5CBFF;
  --focus: #7FA6FF;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html, body { margin: 0; padding: 0; }
body {
  min-height: 100vh; color: var(--ink); font-family: 'Inter', system-ui, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden;
  background: radial-gradient(900px 640px at 0% 0%, var(--glow1), transparent 62%), radial-gradient(820px 620px at 100% 100%, var(--glow2), transparent 62%), radial-gradient(600px 420px at 100% 0%, var(--glow2), transparent 60%), var(--bg);
  background-attachment: fixed;
}
h1, h2, h3 { font-family: 'Inter Tight', 'Inter', system-ui, sans-serif; margin: 0; }
p, ul, ol, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
img { display: block; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
input::placeholder { color: var(--faint); }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--tile-hover); border-radius: 8px; }
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
::view-transition-new(root) { z-index: 2; }
[hidden] { display: none !important; }

@keyframes llIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes llToastIn { from { opacity: 0; transform: translate(-50%, 14px); } to { opacity: 1; transform: translateX(-50%); } }
@keyframes llFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes llGrowY { from { transform: scaleY(0); } to { transform: none; } }
@keyframes llGrowX { from { transform: scaleX(0); } to { transform: none; } }

.ll-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ll-skip { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: 999px; background: var(--solid); color: var(--solid-ink); font-weight: 600; }
.ll-skip:focus { top: 16px; color: var(--solid-ink); }

/* Shared text helpers */
.ll-num { font-family: 'Inter Tight', 'Inter', sans-serif; font-variant-numeric: tabular-nums; }
.ll-muted { color: var(--mute); }
.ll-faint { color: var(--faint); }
.ll-ink { color: var(--ink); }
.ll-strong { font-weight: 600; }
.ll-small { font-size: 12px; }
.ll-nowrap { white-space: nowrap; }
.ll-centre { text-align: center; }
.ll-green { color: var(--green); }
.ll-red { color: var(--red); }
.ll-amber { color: var(--amber); }
.ll-blue { color: var(--blue); }
.ll-gap-top { margin-top: 8px; }

/* Demo strip */
.ll-demo { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 16px 16px 0; padding: 8px 8px 8px 16px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); box-shadow: var(--card-shadow); font-size: 13px; }
.ll-demo__text { color: var(--mute); }
.ll-demo__tag { display: inline-flex; align-items: center; height: 22px; margin-right: 6px; padding: 0 9px; border-radius: 999px; background: var(--amber-bg); color: var(--amber); font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.ll-demo__actions { display: flex; gap: 6px; flex: none; }

/* Shell */
.ll-shell { position: relative; z-index: 1; margin: 16px; min-height: calc(100vh - 32px); border-radius: 34px; background: var(--shell); border: 1px solid var(--line); box-shadow: var(--shell-shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }

/* Header */
.ll-top { position: relative; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; padding: 18px 22px 8px; }
.ll-pillbox, .ll-brand, .ll-tabs__track, .ll-iconbar, .ll-person { background: var(--card); border: 1px solid var(--line); box-shadow: var(--card-shadow); border-radius: 999px; }
.ll-brand { display: flex; align-items: center; gap: 10px; height: 50px; padding: 0 18px 0 7px; flex: none; color: var(--ink); }
.ll-brand:hover { color: var(--ink); }
.ll-mark { width: 36px; height: 36px; flex: none; border-radius: 999px; background: linear-gradient(140deg, #0B1B3F, #2E6BFF); display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 16px rgba(46,107,255,0.35); }
.ll-mark img { width: 22px; height: 22px; }
.ll-mark--small { width: 30px; height: 30px; box-shadow: none; }
.ll-mark--small img { width: 18px; height: 18px; }
.ll-brand__name { font-family: 'Inter Tight', sans-serif; font-size: 17px; font-weight: 700; letter-spacing: -0.02em; }
.ll-brand__sub { font-size: 12px; font-weight: 500; color: var(--mute); }

.ll-tabs { order: 3; flex: 1 0 100%; min-width: 0; display: flex; justify-content: center; }
.ll-tabs__track { display: flex; flex-wrap: nowrap; align-items: center; gap: 2px; padding: 5px; flex: none; max-width: 100%; }
.ll-tabs__link { display: inline-flex; align-items: center; height: 38px; padding: 0 16px; border-radius: 999px; font-size: 13.5px; font-weight: 500; white-space: nowrap; color: var(--mute); transition: background .25s, color .25s; }
.ll-tabs__link:hover { color: var(--ink); }
.ll-tabs__link[aria-current="page"] { background: var(--solid); color: var(--solid-ink); }

.ll-top__end { display: flex; align-items: center; gap: 10px; flex: none; margin-left: auto; }
.ll-iconbar { position: relative; display: flex; align-items: center; gap: 2px; padding: 5px; }
.ll-icon { position: relative; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 999px; background: transparent; color: var(--ink); transition: background .2s, transform .15s; }
.ll-icon:hover { background: var(--tile); }
.ll-icon:active { transform: scale(.94); }
.ll-icon--phone-only { display: none; }
.ll-icon__dot { position: absolute; top: 9px; right: 10px; width: 7px; height: 7px; border-radius: 50%; background: #2E6BFF; box-shadow: 0 0 0 2px var(--card); }
.ll-moon { display: none; }
:root[data-theme="dark"] .ll-sun { display: none; }
:root[data-theme="dark"] .ll-moon { display: block; }

.ll-person { display: flex; align-items: center; gap: 10px; height: 50px; padding: 0 5px; }
.ll-person__photo { width: 38px; height: 38px; flex: none; padding: 2px; border-radius: 999px; background: linear-gradient(140deg, #0B1B3F, #2E6BFF); }
.ll-person__photo img { width: 100%; height: 100%; border-radius: 999px; object-fit: cover; }
.ll-person__text { display: none; flex-direction: column; min-width: 0; padding-right: 8px; }
.ll-person__name { font-size: 13.5px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.ll-person__company { font-size: 11.5px; color: var(--mute); line-height: 1.3; white-space: nowrap; }

/* Search popover */
.ll-search { position: absolute; right: 0; top: 56px; z-index: 50; width: 380px; padding: 8px; border-radius: 24px; background: var(--menu); border: 1px solid var(--line); box-shadow: var(--menu-shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); animation: llFade .18s ease both; }
.ll-search__field { position: relative; }
.ll-search__field svg { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--mute); pointer-events: none; }
.ll-search__input { width: 100%; height: 44px; padding: 0 16px 0 44px; border-radius: 999px; background: var(--tile); border: 1px solid var(--line); color: var(--ink); font-size: 14px; outline: none; }
.ll-search__input:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.ll-search__results { display: flex; flex-direction: column; margin-top: 6px; }
.ll-search__result { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 0; border-radius: 14px; background: transparent; color: var(--ink); text-align: left; }
.ll-search__result:hover, .ll-search__result[aria-selected="true"] { background: var(--row-hover); }
.ll-search__text { display: flex; flex-direction: column; min-width: 0; }
.ll-search__hint, .ll-search__empty { padding: 10px 12px 4px; font-size: 12.5px; color: var(--mute); }
.ll-search__empty { overflow-wrap: anywhere; }

/* Body: rail and main */
.ll-body { display: flex; align-items: flex-start; gap: 18px; padding: 14px 22px 28px 16px; }
.ll-rail { position: sticky; top: 16px; flex: none; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.ll-rail__group { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 5px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); box-shadow: var(--card-shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.ll-rail__button { width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 999px; background: transparent; color: var(--mute); transition: background .25s, color .25s, transform .15s; }
.ll-rail__group--desktop .ll-rail__button { color: var(--ink); }
.ll-rail__button:hover { background: var(--tile); color: var(--ink); }
.ll-rail__button:active { transform: scale(.92); }
.ll-rail__button[aria-current="page"] { background: var(--solid); color: var(--solid-ink); }
.ll-main { min-width: 0; flex: 1; }
.ll-main:focus, .ll-view:focus { outline: none; }

.ll-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 18px; margin: 6px 0 22px; }
.ll-head__titles { min-width: 0; }
.ll-head h1 { font-size: 34px; font-weight: 600; letter-spacing: -0.035em; line-height: 1.1; }
.ll-head p { margin-top: 6px; font-size: 14px; color: var(--mute); }
.ll-head__actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ll-pill { display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px 0 18px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); box-shadow: var(--card-shadow); color: var(--ink); font-size: 13.5px; font-weight: 500; white-space: nowrap; transition: transform .15s; }
.ll-pill:active { transform: scale(.96); }
.ll-property { position: relative; }
.ll-property__menu { position: absolute; right: 0; top: 50px; z-index: 30; min-width: 210px; padding: 6px; border-radius: 20px; background: var(--menu); border: 1px solid var(--line); box-shadow: var(--menu-shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); animation: llFade .15s ease both; }
.ll-property__option { width: 100%; display: block; padding: 10px 14px; border: 0; border-radius: 14px; text-align: left; font-size: 13.5px; font-weight: 500; background: transparent; color: var(--ink); }
.ll-property__option:hover { background: var(--row-hover); }
.ll-property__option[aria-pressed="true"] { background: var(--solid); color: var(--solid-ink); }

/* Buttons */
.ll-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 42px; padding: 0 16px; border: 0; border-radius: 999px; background: var(--tile); color: var(--ink); font-size: 13px; font-weight: 600; white-space: nowrap; transition: transform .15s, background .2s; }
.ll-btn:hover { background: var(--tile-hover); color: var(--ink); }
.ll-btn:active { transform: scale(.96); }
.ll-btn--solid, .ll-btn--solid:hover { background: var(--solid); color: var(--solid-ink); }
.ll-btn--brand, .ll-btn--brand:hover { padding: 0 20px; background: linear-gradient(135deg, #0B1B3F, #2E6BFF); color: #fff; font-size: 13.5px; box-shadow: 0 10px 24px rgba(46,107,255,0.35); }
.ll-btn--small { height: 36px; padding: 0 16px; font-size: 12.5px; }
.ll-btn--mid { height: 40px; padding: 0 18px; }
.ll-btn--tiny { height: 32px; padding: 0 14px; font-size: 12px; flex: none; }
.ll-btn.is-done, .ll-btn.is-done:hover { background: var(--green-bg); color: var(--green); }
.ll-btn[aria-disabled="true"] { cursor: default; }
.ll-btn[aria-disabled="true"]:active { transform: none; }
.ll-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.ll-actions--split .ll-btn { flex: 1 1 0; min-width: 0; }
.ll-actions--bottom { margin-top: auto; padding-top: 18px; }
.ll-chip-button { display: flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 999px; background: transparent; border: 1px solid var(--line); color: var(--ink); font-size: 13px; font-weight: 500; white-space: nowrap; }
.ll-textlink { display: inline-block; margin-top: 12px; padding: 6px 4px; font-size: 13px; font-weight: 600; }
.ll-arrow { width: 34px; height: 34px; flex: none; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 999px; background: var(--tile); color: var(--ink); transition: transform .15s, background .2s; }
.ll-arrow:hover { background: var(--tile-hover); color: var(--ink); }
.ll-arrow:active { transform: scale(.92); }

/* Grid and cards */
.ll-grid { display: grid; gap: 18px; grid-auto-flow: row dense; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ll-span2, .ll-span-chart, .ll-span-narrow, .ll-full { grid-column: 1 / -1; }
.ll-align-start { align-self: start; }
.ll-card { position: relative; min-width: 0; padding: 22px; border-radius: 28px; background: var(--card); border: 1px solid var(--line); box-shadow: var(--card-shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.ll-card.is-selected { border-color: rgba(46,107,255,0.55); }
.ll-card--column { display: flex; flex-direction: column; }
.ll-card--gap { gap: 10px; }
.ll-card--list { padding: 8px 22px; }
.ll-view.is-entering .ll-card { animation: llIn .6s cubic-bezier(.16,1,.3,1) both; }
.ll-view.is-entering .ll-grid > :nth-child(2), .ll-view.is-entering .ll-narrow > :nth-child(2) { animation-delay: .07s; }
.ll-view.is-entering .ll-grid > :nth-child(3) { animation-delay: .14s; }
.ll-view.is-entering .ll-grid > :nth-child(4) { animation-delay: .21s; }
.ll-view.is-entering .ll-grid > :nth-child(5) { animation-delay: .28s; }
.ll-view.is-entering .ll-grid > :nth-child(6) { animation-delay: .35s; }
.ll-view.is-entering .ll-grid > :nth-child(7) { animation-delay: .42s; }
.ll-view.is-entering .ll-grid > :nth-child(n+8) { animation-delay: .49s; }
.ll-card__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px 14px; }
.ll-card__head--spaced { margin-top: 16px; flex-wrap: nowrap; }
.ll-card__titles { min-width: 0; }
.ll-card__titles h2, .ll-subhead { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; }
.ll-card__titles p { margin-top: 3px; font-size: 12.5px; color: var(--mute); }
.ll-card__title-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ll-subhead { margin: 20px 0 10px; font-size: 13px; }
.ll-subhead--flush { margin: 0; }
.ll-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; max-width: 100%; }
.ll-legend { display: flex; gap: 12px; font-size: 12px; color: var(--mute); }
.ll-legend span { display: flex; align-items: center; gap: 6px; }
.ll-dot { display: inline-block; width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--dot, var(--faint)); }
.ll-dot--base { background: var(--bar-base); }
.ll-dot--amber { background: #E89B2B; }
.ll-dot--faint { background: var(--faint); }
.ll-dot--blue { background: #2E6BFF; }
.ll-dot--green { background: #16A36A; }
.ll-dot--red { background: #E5484D; }
.ll-empty { padding: 16px 14px; font-size: 13px; color: var(--mute); }
.ll-inline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; }
.ll-big { margin: 18px 0 10px; font-size: 34px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; white-space: nowrap; }
.ll-card--column .ll-muted.ll-gap-top { margin-top: 20px; font-size: 12.5px; }
.ll-card--column .ll-big.ll-green { margin: 6px 0; }
.ll-card--column > p.ll-muted { font-size: 12.5px; }

/* Tags */
.ll-tag { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; font-family: 'Inter', sans-serif; font-size: 11.5px; font-weight: 600; white-space: nowrap; flex: none; letter-spacing: 0; }
.ll-tag--green { color: var(--green); background: var(--green-bg); }
.ll-tag--red { color: var(--red); background: var(--red-bg); }
.ll-tag--amber { color: var(--amber); background: var(--amber-bg); }
.ll-tag--blue { color: var(--blue); background: var(--blue-bg); }
.ll-tag--grey { color: var(--grey); background: var(--grey-bg); }
.ll-tag--plain { color: var(--ink); background: var(--tile); }
.ll-card__title-row .ll-tag { height: 22px; padding: 0 9px; font-size: 11px; }

/* Avatars */
.ll-avatar { display: flex; align-items: center; justify-content: center; flex: none; border-radius: 999px; background: var(--grad); color: #fff; font-weight: 600; }
.ll-avatar--30 { width: 30px; height: 30px; font-size: 11px; }
.ll-avatar--32 { width: 32px; height: 32px; font-size: 12px; }
.ll-avatar--34 { width: 34px; height: 34px; font-size: 12px; }
.ll-avatar--36 { width: 36px; height: 36px; font-size: 13px; }
.ll-avatar--56 { width: 56px; height: 56px; font-size: 20px; box-shadow: 0 8px 20px rgba(46,107,255,0.35); }

/* Tiles */
.ll-tile { padding: 12px; border-radius: 16px; background: var(--tile); min-width: 0; }
.ll-tile__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 12px; }
.ll-tile__label { font-size: 11.5px; color: var(--mute); }
.ll-tile__value { margin-top: 5px; font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.ll-tile__note { margin-top: 3px; font-size: 11px; color: var(--mute); }
.ll-minis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
.ll-minis--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ll-minis--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ll-card--column > .ll-minis:last-child { margin-top: auto; }
.ll-card--column > .ll-actions--split + .ll-minis { margin-top: auto; padding: 8px; border-radius: 22px; border: 1px solid var(--line); }
.ll-card--column > .ll-actions--split { margin-top: 18px; margin-bottom: 18px; }
.ll-minis--bottom { padding-top: 18px; }
.ll-minis--plain .ll-tile { padding: 10px 12px; }
.ll-minis--plain .ll-tile__value { margin-top: 4px; font-size: 16px; }
.ll-minis--big .ll-tile { padding: 14px; border-radius: 18px; }
.ll-minis--big .ll-tile__value { margin-top: 8px; font-size: 22px; letter-spacing: -0.02em; }
.ll-card--column > .ll-minis:not(.ll-minis--two):not(.ll-minis--bottom) .ll-tile__value { margin-top: 6px; font-size: 18px; letter-spacing: -0.02em; }

/* Overview tile grid */
.ll-card--tiles .ll-tilegrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; height: 100%; }
.ll-hero-tile, .ll-stat-tile { position: relative; overflow: hidden; display: flex; flex-direction: column; min-width: 0; min-height: 150px; padding: 16px; border: 0; border-radius: 22px; text-align: left; font: inherit; transition: transform .15s, background .2s; }
.ll-hero-tile { color: #fff; background: linear-gradient(145deg, #0B1B3F 0%, #2E6BFF 100%); box-shadow: 0 16px 36px rgba(46,107,255,0.38); }
.ll-hero-tile::after { content: ''; position: absolute; right: -40px; top: -40px; width: 140px; height: 140px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,0.38), rgba(255,255,255,0) 68%); pointer-events: none; }
a.ll-hero-tile:hover { color: #fff; }
.ll-hero-tile__top, .ll-stat-tile__top { position: relative; display: flex; justify-content: space-between; align-items: flex-start; gap: 6px; font-size: 12px; font-weight: 500; line-height: 1.3; }
.ll-hero-tile__top { color: rgba(255,255,255,0.88); }
.ll-hero-tile__tag { height: 22px; padding: 0 8px; display: inline-flex; align-items: center; border-radius: 999px; background: rgba(255,255,255,0.18); font-size: 11px; font-weight: 600; white-space: nowrap; color: #fff; }
.ll-hero-tile__value { position: relative; margin-top: auto; padding-top: 18px; font-size: 30px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; white-space: nowrap; }
.ll-hero-tile__foot { position: relative; margin-top: 6px; font-size: 11.5px; color: rgba(255,255,255,0.82); }
.ll-stat-tile { color: var(--ink); background: var(--tile); }
a.ll-stat-tile:hover, button.ll-stat-tile:hover { background: var(--tile-hover); color: var(--ink); }
.ll-hero-tile:active, a.ll-stat-tile:active, button.ll-stat-tile:active { transform: scale(.97); }
.ll-stat-tile__top { color: var(--mute); }
.ll-stat-tile__value { margin-top: auto; padding-top: 18px; font-size: 26px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; white-space: nowrap; }
.ll-stat-tile__foot { margin-top: 6px; font-size: 11.5px; color: var(--mute); }

/* Monthly bars */
.ll-bars { position: relative; flex: 1; min-height: 190px; margin-top: 18px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; align-items: end; padding-top: 40px; border-bottom: 1px dashed var(--faint); }
.ll-bars__col { position: relative; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 3px; padding: 0 0 4px; border: 0; background: transparent; border-radius: 8px; }
.ll-bars__on, .ll-bars__late { width: 100%; max-width: 26px; border-radius: 8px; transform-origin: bottom; transition: opacity .2s; }
.ll-bars__on { height: var(--on); background: var(--bar-base); }
.ll-bars__late { height: var(--late); background: #E89B2B; }
.ll-bars__col.is-current .ll-bars__on { background: linear-gradient(180deg, #2E6BFF, #0B1B3F); }
.ll-view.is-entering .ll-bars__on, .ll-view.is-entering .ll-bars__late { animation: llGrowY .9s cubic-bezier(.16,1,.3,1) both; }
.ll-bars.is-hovering .ll-bars__col:not(.is-hover) .ll-bars__on, .ll-bars.is-hovering .ll-bars__col:not(.is-hover) .ll-bars__late { opacity: .45; }
.ll-bars__labels { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.ll-bars__labels span { font-size: 10.5px; color: var(--mute); text-align: center; white-space: nowrap; }

/* Chart tips */
.ll-tip { position: absolute; z-index: 3; display: block; padding: 8px 12px; border-radius: 14px; background: var(--menu); border: 1px solid var(--line); box-shadow: 0 12px 30px rgba(0,0,0,0.18); color: var(--ink); font-size: 12px; font-weight: 400; line-height: 1.45; white-space: nowrap; text-align: left; opacity: 0; pointer-events: none; transition: opacity .15s; }
.ll-tip strong { font-weight: 600; }
.ll-bars__col .ll-tip { left: 50%; bottom: calc(var(--total) + 14px); transform: translateX(-50%); }
.ll-bars__col .ll-tip--start { transform: translateX(-20%); }
.ll-bars__col .ll-tip--end { transform: translateX(-80%); }
.ll-bars__col.is-hover .ll-tip { opacity: 1; }

/* Velocity line */
.ll-line { position: relative; height: 230px; margin-top: 22px; border-bottom: 1px dashed var(--faint); }
.ll-line svg { display: block; width: 100%; height: 100%; overflow: visible; }
.ll-line__point { position: absolute; top: 0; bottom: 0; left: var(--x); width: 7.2%; margin-left: -3.6%; padding: 0; border: 0; background: transparent; border-radius: 6px; }
.ll-line__dot { position: absolute; left: 50%; top: var(--y); width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: #fff; border: 3px solid #2E6BFF; box-shadow: 0 0 0 5px rgba(46,107,255,0.2); opacity: 0; transition: opacity .15s; }
.ll-line__point .ll-tip { left: 50%; top: var(--y); transform: translate(-50%, calc(-100% - 16px)); }
.ll-line__point .ll-tip--start { transform: translate(-12%, calc(-100% - 16px)); }
.ll-line__point .ll-tip--end { transform: translate(-88%, calc(-100% - 16px)); }
.ll-tip--pill { padding: 7px 12px; border-radius: 999px; font-weight: 600; }
.ll-line__point.is-peak .ll-tip, .ll-line__point.is-peak .ll-line__dot, .ll-line__point.is-hover .ll-tip, .ll-line__point.is-hover .ll-line__dot { opacity: 1; }
.ll-line.is-hovering .ll-line__point.is-peak:not(.is-hover) .ll-tip, .ll-line.is-hovering .ll-line__point.is-peak:not(.is-hover) .ll-line__dot { opacity: 0; }
.ll-ticks { display: flex; justify-content: space-between; margin-top: 10px; font-size: 11.5px; color: var(--mute); }

/* Lists */
.ll-list { display: flex; flex-direction: column; margin-top: 12px; }
.ll-list__row { display: flex; align-items: center; gap: 12px; width: 100%; padding: 11px 8px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink); text-align: left; transition: background .2s; }
button.ll-list__row:hover { background: var(--row-hover); }
.ll-list__row--static { padding: 11px 0; }
.ll-list__main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ll-list__title { display: block; font-size: 13.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ll-list__sub { display: block; margin-top: 2px; font-size: 12px; color: var(--mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 400; }
.ll-list__end { flex: none; text-align: right; display: flex; flex-direction: column; align-items: flex-end; }
.ll-list__amount { font-size: 13.5px; font-weight: 600; white-space: nowrap; }

.ll-risk { display: flex; flex-direction: column; margin-top: 10px; }
.ll-risk__row { display: flex; align-items: center; gap: 10px 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.ll-risk__row:last-child { border-bottom: 0; }
.ll-risk__who { flex: 1 1 calc(100% - 48px); min-width: 0; padding: 0; border: 0; background: transparent; color: var(--ink); text-align: left; }
.ll-risk__who .ll-list__sub { font-size: 12.5px; white-space: normal; }

/* Tables */
.ll-table { width: 100%; margin-top: 14px; border-collapse: separate; border-spacing: 0; font-size: 13px; table-layout: auto; }
.ll-table th, .ll-table td { padding: 11px 14px; text-align: left; vertical-align: middle; }
.ll-table thead th { padding: 10px 14px; background: var(--tile); font-size: 12px; font-weight: 500; color: var(--mute); white-space: nowrap; }
.ll-table thead th:first-child { border-radius: 14px 0 0 14px; }
.ll-table thead th:last-child { border-radius: 0 14px 14px 0; }
.ll-table tbody td, .ll-table tbody th { border-bottom: 1px solid var(--line); }
.ll-table tbody th { font-weight: 400; }
.ll-table .ll-r { text-align: right; }
.ll-table .ll-status { width: 132px; }
.ll-table tr.is-link { cursor: pointer; transition: background .2s; }
.ll-table tr.is-link:hover td { background: var(--row-hover); }
.ll-table tr.is-current td { background: var(--tile); }
.ll-table tr.is-current td:first-child { border-radius: 14px 0 0 14px; }
.ll-table tr.is-current td:last-child { border-radius: 0 14px 14px 0; }
.ll-table td.ll-num { font-size: 13.5px; white-space: nowrap; }
.ll-table--activity td { padding: 12px 14px; }
.ll-who { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ll-who__text { display: flex; flex-direction: column; min-width: 0; }
.ll-rowlink { padding: 0; border: 0; background: transparent; color: var(--ink); font-size: 13.5px; font-weight: 500; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.ll-strong-ish { font-size: 13.5px; font-weight: 500; }
.ll-sm-only { display: none; }
.ll-scroll { overflow-y: auto; }
.ll-scroll--tall { max-height: 560px; }
.ll-scroll--list { max-height: 520px; }
.ll-scroll thead th { position: sticky; top: 0; z-index: 1; }
.ll-scroll--x { overflow-x: auto; overflow-y: visible; margin-top: 14px; }
.ll-scroll--x .ll-table { margin-top: 0; }
.ll-scroll--x { scrollbar-width: thin; scrollbar-color: rgba(127,127,127,0.4) transparent; }
.ll-scroll--x::-webkit-scrollbar { height: 6px; }
.ll-scroll--x::-webkit-scrollbar-thumb { background: rgba(127,127,127,0.4); border-radius: 999px; }
.ll-scroll--x[data-hidden="end"] { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 48px), transparent); }
.ll-scroll--x[data-hidden="start"] { -webkit-mask-image: linear-gradient(to left, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(to left, #000 calc(100% - 48px), transparent); }
.ll-scroll--x[data-hidden="both"] { -webkit-mask-image: linear-gradient(to right, transparent, #000 48px, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(to right, transparent, #000 48px, #000 calc(100% - 48px), transparent); }
.ll-scroll:focus-visible { outline-offset: -2px; border-radius: 14px; }

/* Comparison and heat tables */
.ll-table--compare { min-width: 680px; }
.ll-table--compare thead th { padding: 5px; }
.ll-table--compare thead th:first-child { padding-left: 14px; }
.ll-colpick { min-height: 34px; padding: 6px 12px; border: 0; border-radius: 999px; background: transparent; color: var(--mute); font-size: 12.5px; font-weight: 600; text-align: right; line-height: 1.25; transition: background .2s, color .2s, transform .15s; }
.ll-colpick:hover { color: var(--ink); }
.ll-colpick[aria-pressed="true"] { background: var(--solid); color: var(--solid-ink); }
.ll-table--compare tr.ll-group th { padding: 20px 14px 8px; font-size: 11.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--blue); }
.ll-table--compare td { font-family: 'Inter Tight', sans-serif; font-size: 13.5px; border-radius: 0; }
.ll-table--compare td.is-selected { background: rgba(46,107,255,0.1); }
.ll-table--compare td.is-best { color: var(--green); font-weight: 600; }
.ll-metric { display: block; font-size: 13.5px; }
.ll-table--figures { min-width: 600px; }
.ll-table--figures tbody th { font-size: 13.5px; white-space: nowrap; }
.ll-table--figures td { padding: 12px 10px; font-size: 13.5px; }
.ll-table--figures td[style*="--heat"] { background: rgba(229,72,77,var(--heat)); }
.ll-table--figures td[style*="--lease"] { background: rgba(46,107,255,var(--lease)); }
.ll-table--figures tr.ll-total th, .ll-table--figures tr.ll-total td { font-weight: 600; border-bottom: 0; }
.ll-table--figures tr.is-selected th, .ll-table--figures tr.is-selected td { background-color: rgba(46,107,255,0.08); }
.ll-cell-note { display: block; margin-top: 2px; font-size: 11px; font-weight: 400; color: var(--mute); }

/* Search fields in cards and segmented filters */
.ll-find { position: relative; }
.ll-find svg { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--mute); pointer-events: none; }
.ll-find__input { width: 170px; height: 36px; padding: 0 14px 0 36px; border-radius: 999px; background: var(--tile); border: 1px solid transparent; color: var(--ink); font-size: 13px; outline: none; }
.ll-find__input:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.ll-seg { display: flex; gap: 2px; padding: 3px; border-radius: 999px; background: var(--tile); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.ll-seg__option { height: 30px; padding: 0 13px; border: 0; border-radius: 999px; font-size: 12.5px; font-weight: 600; white-space: nowrap; background: transparent; color: var(--mute); transition: background .2s, color .2s, transform .15s; }
.ll-seg__option:hover { color: var(--ink); }
.ll-seg__option[aria-pressed="true"] { background: var(--solid); color: var(--solid-ink); }
.ll-seg__option:active { transform: scale(.95); }
.ll-seg__count { opacity: .6; }

/* Payment methods and meters */
.ll-methods { display: flex; flex-direction: column; gap: 18px; margin-top: 22px; }
.ll-methods__top { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; margin-bottom: 8px; }
.ll-meter { height: 6px; border-radius: 999px; background: var(--tile); overflow: hidden; }
.ll-meter span { display: block; height: 100%; width: var(--w); border-radius: 999px; background: linear-gradient(90deg, #0B1B3F, #2E6BFF); transform-origin: left; }
:root[data-theme="dark"] .ll-meter span { background: linear-gradient(90deg, #1D3E8F, #2E6BFF); }
.ll-view.is-entering .ll-meter span { animation: llGrowX 1s cubic-bezier(.16,1,.3,1) both; }
.ll-meter--card { margin-top: 12px; background: var(--card); }
.ll-meter--thick { flex: 1; height: 10px; }
.ll-meter--before span, :root[data-theme="dark"] .ll-meter--before span { background: var(--faint); }
.ll-methods .ll-tile__note { margin-top: 6px; font-size: 11.5px; }
.ll-stack { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.ll-health { padding: 16px; border-radius: 20px; background: var(--tile); }
.ll-health__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 12px; }
.ll-health__value { margin-top: 12px; font-size: 28px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; }
.ll-ages { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 32px; margin-top: 16px; }
.ll-donut { position: relative; width: 140px; height: 140px; flex: none; }
.ll-donut svg { transform: rotate(-90deg); overflow: visible; }
.ll-donut__track { fill: none; stroke: var(--tile); stroke-width: 12; }
.ll-donut__centre { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 11.5px; }
.ll-donut__value { font-size: 22px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; }
.ll-ages__list { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.ll-ages__list li { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 16px; background: var(--tile); font-size: 13px; }
.ll-ages__list .ll-dot { width: 9px; height: 9px; }
.ll-ages__label { flex: 1; min-width: 0; white-space: nowrap; }
.ll-ages__amount { font-weight: 600; white-space: nowrap; min-width: 60px; text-align: right; }
.ll-month-tile { flex: 1; display: flex; flex-direction: column; padding: 16px; border: 0; border-radius: 20px; background: var(--tile); color: var(--ink); text-align: left; transition: background .2s, transform .15s; }
.ll-month-tile:hover { background: var(--tile-hover); }
.ll-month-tile:active { transform: scale(.98); }
.ll-month-tile__top { display: flex; justify-content: space-between; align-items: center; width: 100%; font-size: 12px; color: var(--mute); }
.ll-month-tile__top .ll-tag { height: 22px; padding: 0 8px; font-size: 11px; }
.ll-month-tile__value { margin-top: auto; padding-top: 14px; font-size: 30px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; }
.ll-month-tile__foot { margin-top: 6px; font-size: 12px; color: var(--mute); }

/* Tenant record */
.ll-profile { display: flex; align-items: center; gap: 14px; }
.ll-profile__text { min-width: 0; flex: 1; }
.ll-profile__name { font-size: 20px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.15; }
.ll-profile__text .ll-muted { margin-top: 3px; font-size: 12.5px; }
.ll-profile__status { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; font-size: 12.5px; }
.ll-history { position: relative; height: 200px; margin-top: 20px; border-bottom: 1px dashed var(--faint); }
.ll-history svg { display: block; width: 100%; height: 100%; overflow: visible; }
.ll-history__due { stroke: var(--faint); }
.ll-gauge { position: relative; width: 100%; max-width: 210px; margin: 18px auto 0; }
.ll-gauge svg { display: block; width: 100%; overflow: visible; }
.ll-gauge__track { stroke: var(--tile); }
.ll-gauge__value { position: absolute; left: 0; right: 0; bottom: 0; text-align: center; font-size: 32px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; }
.ll-gauge + .ll-muted { margin-top: 10px; font-size: 12.5px; }
.ll-months { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
.ll-months__box { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 12px 4px; border-radius: 16px; min-width: 0; font-size: 11.5px; white-space: nowrap; }
.ll-months__box .ll-dot { width: 10px; height: 10px; }
.ll-months__box--green { background: var(--green-bg); }
.ll-months__box--red { background: var(--red-bg); }
.ll-months__box--amber { background: var(--amber-bg); }
.ll-months__box--blue { background: var(--blue-bg); }
.ll-credit__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 14px; font-size: 12.5px; }
.ll-rows { display: flex; flex-direction: column; margin-top: 10px; }
.ll-rows > div { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.ll-rows dt { color: var(--mute); }
.ll-rows dd { font-weight: 500; text-align: right; }

/* Portfolio */
.ll-photo { position: relative; height: 150px; border-radius: 20px; overflow: hidden; display: flex; align-items: center; justify-content: center; color: var(--faint); background: linear-gradient(160deg, var(--tile), var(--tile-hover)); }
.ll-photo__chip { position: absolute; left: 10px; top: 10px; height: 26px; padding: 0 10px; display: inline-flex; align-items: center; border-radius: 999px; background: var(--menu); color: var(--ink); font-size: 11.5px; font-weight: 600; box-shadow: 0 4px 12px rgba(0,0,0,0.12); }
.ll-prop__collected { margin: 16px 0 10px; font-size: 26px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; white-space: nowrap; }
.ll-prop__collected span { font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 500; color: var(--mute); letter-spacing: 0; }
.ll-minis--plain { margin-top: 14px; }

/* Rewards */
.ll-settings { display: flex; flex-direction: column; margin-top: 6px; }
.ll-settings li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; }
.ll-settings li.ll-settings__top { align-items: flex-start; }
.ll-settings li .ll-muted { margin-top: 3px; font-size: 12.5px; }
.ll-settings--roomy li { padding: 18px 0; font-size: 14px; }
.ll-settings--roomy li:last-child { border-bottom: 0; }
.ll-switch { position: relative; width: 48px; height: 28px; flex: none; border-radius: 999px; border: 0; padding: 0; background: var(--tile-hover); transition: background .25s; }
.ll-switch[aria-checked="true"] { background: linear-gradient(135deg, #0B1B3F, #2E6BFF); }
.ll-switch__knob { position: absolute; top: 4px; left: 4px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.2); transition: left .25s; }
.ll-switch[aria-checked="true"] .ll-switch__knob { left: 24px; }
.ll-streaks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ll-streaks .ll-tile { padding: 14px; border-radius: 18px; }
.ll-streaks .ll-strong { margin-top: 10px; font-size: 14px; }
.ll-nudge { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; margin-top: 16px; }
.ll-nudge__preview { padding: 16px; border-radius: 22px; background: var(--tile); min-width: 0; }
.ll-bubble { margin-top: 10px; max-width: 380px; padding: 12px 14px; border-radius: 18px 18px 18px 6px; background: var(--card); border: 1px solid var(--line); font-size: 13.5px; line-height: 1.5; text-wrap: pretty; }
.ll-nudge__side { display: flex; flex-direction: column; min-width: 0; }
.ll-nudge__top { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-bottom: 6px; }
.ll-nudge .ll-rows { margin-top: 0; }
.ll-nudge .ll-rows > div { padding: 10px 0; }
.ll-triggers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
.ll-triggers .ll-tile { display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 20px; font-size: 12.5px; }
.ll-triggers .ll-tile__top { font-size: 13.5px; }

/* Reports */
.ll-lift { margin-top: 10px; }
.ll-lift__row { display: grid; grid-template-columns: minmax(150px, 210px) minmax(0, 1fr); gap: 10px 18px; align-items: center; padding: 14px 8px; border-radius: 14px; border-bottom: 1px solid var(--line); }
.ll-lift__row.ll-total { font-weight: 600; border-bottom: 0; }
.ll-lift__row.is-selected { background: rgba(46,107,255,0.07); }
.ll-lift__name { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; font-size: 13.5px; }
.ll-lift__name > span:first-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ll-lift__bars { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ll-lift__bar { display: flex; align-items: center; gap: 10px; font-size: 12.5px; }
.ll-lift__bar > .ll-num { width: 40px; text-align: right; }
.ll-roi { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin-top: 16px; align-items: start; }
.ll-statement { padding: 22px; border-radius: 22px; border: 1px solid var(--line); min-width: 0; }
.ll-statement__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 12.5px; }
.ll-statement__brand { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; }
.ll-statement__owner { margin-top: 18px; font-family: 'Inter Tight', sans-serif; font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
.ll-statement__owner + .ll-muted { margin-top: 3px; font-size: 12.5px; }
.ll-statement .ll-minis--big .ll-tile__note { margin-top: 4px; font-size: 11.5px; }
.ll-roi__side { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ll-note { padding: 16px; border-radius: 20px; background: var(--tile); font-size: 13.5px; }
.ll-note .ll-muted { margin-top: 4px; font-size: 12.5px; text-wrap: pretty; }

/* Settings */
.ll-narrow { display: flex; flex-direction: column; gap: 18px; max-width: 680px; }
.ll-pms { display: flex; align-items: center; gap: 14px; min-width: 0; }
.ll-pms__icon { width: 44px; height: 44px; flex: none; border-radius: 14px; background: var(--tile); display: flex; align-items: center; justify-content: center; color: var(--ink); }
.ll-narrow .ll-tile { padding: 12px 14px; }
.ll-narrow .ll-tile__value { font-size: 13.5px; }

/* Footer and toast */
.ll-footer { display: flex; flex-direction: column; gap: 6px; padding: 8px 22px 28px 82px; font-size: 12.5px; color: var(--mute); }
.ll-noscript { padding: 22px; }
.ll-toast { position: fixed; z-index: 60; left: 50%; bottom: 32px; transform: translateX(-50%); max-width: calc(100% - 32px); padding: 13px 22px; border-radius: 999px; background: var(--solid); color: var(--solid-ink); box-shadow: 0 20px 50px rgba(0,0,0,0.35); font-size: 13.5px; font-weight: 500; text-align: center; opacity: 0; pointer-events: none; transition: opacity .2s; }
.ll-toast.is-visible { opacity: 1; animation: llToastIn .3s ease both; }

/* Three columns from 1180px */
@media (min-width: 1180px) {
  .ll-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ll-span2 { grid-column: span 2; }
  .ll-span-chart, .ll-span-narrow { grid-column: auto; }
  .ll-person { padding: 0 10px 0 5px; }
  .ll-person__text { display: flex; }
  .ll-roi { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
}
@media (max-width: 1179.98px) {
  .ll-lg { display: none; }
}
@media (min-width: 1440px) {
  .ll-tabs { order: 0; flex: 1 1 0; }
}
@media (min-width: 760px) and (max-width: 1079.98px) {
  .ll-tabs__link { padding: 0 12px; }
}
@media (min-width: 760px) and (max-width: 879.98px) {
  .ll-tabs__link { padding: 0 9px; font-size: 12.5px; }
}

/* Phones */
@media (max-width: 759.98px) {
  .ll-demo { margin: 10px 10px 0; border-radius: 20px; padding: 10px 12px; font-size: 12.5px; }
  .ll-shell { margin: 10px 0 0; min-height: 100vh; border-radius: 0; border: 0; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .ll-top { padding: 14px 14px 6px; }
  .ll-tabs { margin: 0 -14px; padding: 0 14px; overflow-x: auto; scrollbar-width: none; justify-content: flex-start; }
  .ll-tabs::-webkit-scrollbar { display: none; }
  .ll-icon--phone-only { display: flex; }
  .ll-body { display: block; padding: 14px 14px 112px; }
  .ll-rail { position: fixed; z-index: 40; left: 12px; right: 12px; top: auto; bottom: max(12px, env(safe-area-inset-bottom)); flex-direction: row; justify-content: center; gap: 6px; }
  .ll-rail__group { flex-direction: row; }
  .ll-rail__button { width: 36px; height: 36px; }
  .ll-property__menu { left: 0; right: auto; }
  .ll-rail__group--desktop, .ll-rail__desktop { display: none; }
  .ll-grid { grid-template-columns: minmax(0, 1fr); }
  .ll-md { display: none; }
  .ll-table:not(.ll-table--compare):not(.ll-table--figures) { table-layout: fixed; }
  .ll-table:not(.ll-table--compare):not(.ll-table--figures) thead th:first-child { width: 46%; }
  .ll-table:not(.ll-table--compare):not(.ll-table--figures) thead th { white-space: normal; }
  .ll-table:not(.ll-table--compare):not(.ll-table--figures) td .ll-tag { height: auto; min-height: 24px; padding: 4px 10px; line-height: 1.25; white-space: normal; text-align: center; }
  .ll-seg { flex-wrap: wrap; border-radius: 18px; }
  .ll-sm-only { display: block; white-space: normal; }
  /* Below the header, so the demo bar above the shell never covers the field. */
  .ll-iconbar { position: static; }
  .ll-search { left: 14px; right: 14px; top: calc(100% - 4px); width: auto; }
  .ll-find__input { width: 100%; }
  .ll-find { flex: 1 1 100%; }
  .ll-table th, .ll-table td { padding-left: 10px; padding-right: 10px; }
  .ll-table .ll-status { width: auto; }
  .ll-risk__row { flex-wrap: wrap; }
  .ll-risk__chip { margin-left: 48px; }
  .ll-streaks, .ll-triggers, .ll-nudge { grid-template-columns: minmax(0, 1fr); }
  .ll-statement .ll-minis--three { grid-template-columns: minmax(0, 1fr); }
  .ll-card--column > .ll-minis:not(.ll-minis--two) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ll-lift__row { grid-template-columns: minmax(0, 1fr); }
  .ll-months { gap: 4px; }
  .ll-months__box { padding: 10px 2px; font-size: 10.5px; }
  .ll-footer { padding: 8px 14px 112px; }
  html { scroll-padding-bottom: 96px; }
  .ll-toast { bottom: 92px; border-radius: 22px; }
}

@media (max-width: 374.98px) {
  .ll-rail { left: 8px; right: 8px; gap: 4px; }
  .ll-rail__group { padding: 3px; gap: 0; }
  .ll-rail__button { width: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}