/* ============================================================================
   RentChitti — "playful" design system. Mobile-app feel on every screen:
   a centered app column floating on an ambient gradient, tactile clay controls,
   colourful gradient cards, and bottom-sheet dialogs. Light + dark.
============================================================================ */
:root{
  /* ===== chitti motion spec — one source of truth for the chitti design language =====
     easing: --ck-spring is the signature pop/drop. durations by tier. sizes by role.
     adopt these tokens for any new chitti animation so every instance is a sibling. */
  --ck-spring:cubic-bezier(.34,1.56,.64,1);   /* error-chit drop, success pop */
  --ck-ease:ease-in-out;                        /* ambient loops (wink, breathe) */
  --ck-drop:.55s;      /* error-chit / success entrance */
  --ck-wink:2.6s;      /* stub wink / perforation tear loop (ambient) */
  --ck-scene:1.6s;     /* scene draw — e-sign seal */
  --ck-boot:4s;        /* boot "The Tear" one-shot */
  --ck-sz-mini:18px;   /* rides the bar / chip / gullak-coin */
  --ck-sz-chip:22px;   /* working-chit emblem */
  --ck-sz-scene:60px;  /* modal scene emblem */
  --ck-sz-hero:74px;   /* welcome-home / boot hero */
  --ground:#EDEBE5; --surface:#FFFDF8; --surface-2:#F4F2EA;
  --ink:#161513; --ink-soft:#3A3833; --muted:#6E6A60; --faint:#A6A296;
  --line:#E3E0D6; --line-soft:#EDEAE1; --bg:var(--ground); --card:var(--surface); --card2:var(--surface-2);
  --indigo:#2743F0; --indigo-dk:#1D34C8; --violet:#3D57FF; --indigo-lt:#E6EAFF;
  --coral:#FF7A66; --sun:#FFD84D; --sky:#38BDF8; --mint:#34D399;
  --em:#10C793; --em-dk:#0A8f66; --em-lt:#E3FBF3;
  --rose:#FB5C7D; --rose-dk:#E11D48; --rose-lt:#FFECF1;
  --amber:#F59E0B; --amber-dk:#B45309; --amber-lt:#FFF4E0;
  --grad:linear-gradient(140deg,#3D57FF,#2743F0);
  --grad-em:linear-gradient(140deg,#2DE0AE,#10C793);
  --grad-rose:linear-gradient(140deg,#FF9E85,#FB5C7D);
  --grad-amber:linear-gradient(140deg,#FFC94D,#FF9F1C);
  --clay:rgba(255,255,255,.55);
  --shadow-sm:0 2px 6px rgba(22,21,19,.08);
  --shadow:0 14px 34px -14px rgba(22,21,19,.22);
  --shadow-lg:0 36px 80px -28px rgba(22,21,19,.35);
  --r:26px; --r-lg:30px;
  --safe-b:env(safe-area-inset-bottom,0px);
}
/* legacy playful light/dark palettes removed — theming now lives in the
   PAPER SKIN section below (paper light default + inked dark via [data-theme]). */

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%}
body{font-family:"Plus Jakarta Sans",-apple-system,"SF Pro Text","Segoe UI",system-ui,sans-serif;color:var(--ink);
  background:var(--ground);font-size:15px;-webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative}
/* ambient background */
body::before,body::after{content:"";position:fixed;z-index:0;border-radius:50%;filter:blur(70px);pointer-events:none}
body::before{width:70vw;height:70vw;max-width:760px;max-height:760px;left:-16vw;top:-18vh;
  background:radial-gradient(circle at 30% 30%,rgba(255,216,77,.55),transparent 60%);animation:amb1 24s ease-in-out infinite}
body::after{width:64vw;height:64vw;max-width:700px;max-height:700px;right:-16vw;bottom:-14vh;
  background:radial-gradient(circle at 60% 50%,rgba(39,67,240,.14),transparent 60%);animation:amb2 30s ease-in-out infinite}
@keyframes amb1{50%{transform:translate(6vw,5vh) scale(1.14)}}
@keyframes amb2{50%{transform:translate(-5vw,-6vh) scale(1.12)}}
.num{font-variant-numeric:tabular-nums}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--indigo);outline-offset:2px}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px}

/* ---------- app shell : centered phone-style column on every screen ---------- */
.shell{position:relative;z-index:1;min-height:100vh}
.side{display:none}
.main{display:flex;flex-direction:column;min-height:100vh}
.topbar{display:flex;align-items:center;gap:11px;position:sticky;top:0;z-index:40;
  padding:calc(12px + env(safe-area-inset-top,0)) 18px 12px;max-width:520px;width:100%;margin:0 auto;
  background:color-mix(in srgb,var(--ground) 78%,transparent);backdrop-filter:blur(14px)}
.topbar .logo{width:38px;height:38px;border-radius:12px;font-size:20px}
.topbar b{font-size:17px;font-weight:850;letter-spacing:-.02em}
.topbar .accn{font-size:11px;color:var(--muted);font-weight:700;margin-top:-1px}
.topbar .rgt{margin-left:auto;display:flex;align-items:center;gap:9px}
.logo{width:40px;height:40px;border-radius:13px;background:var(--grad);display:grid;place-items:center;color:#fff;
  font-size:21px;box-shadow:0 10px 22px -6px rgba(122,107,255,.75),inset 0 2px 3px var(--clay);flex:none}
.brand,.nav,.who{display:none}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;
  font-weight:850;font-size:14px;flex:none;box-shadow:inset 0 2px 3px var(--clay)}
/* ---------- header (Phase 1): search / bell / profile ---------- */
.iconbtn{position:relative}
.hbadge{position:absolute;top:-6px;right:-6px;background:#E4572E;color:#fff;border:2px solid var(--ink);border-radius:99px;font-size:9.5px;font-weight:800;min-width:17px;height:17px;display:grid;place-items:center;padding:0 3px;line-height:1}
.avwrap{position:relative;cursor:pointer;flex:none}
.avplan{position:absolute;bottom:-7px;left:50%;transform:translateX(-50%);font:800 7.5px ui-monospace,Menlo,monospace;background:#FFD84D;border:1.5px solid var(--ink);border-radius:5px;padding:0 4px;line-height:1.6;color:#161513;letter-spacing:.04em}
.avsync{position:absolute;top:-3px;right:-3px;width:10px;height:10px;border-radius:99px;background:#2F9E63;border:1.5px solid var(--ink);transition:background .3s}
.rpc-busy .avsync{background:#FFD84D}
.net-off .avsync{background:var(--faint)}
.hsearch{display:flex;align-items:center;gap:8px;background:var(--surface-2);border:1.5px solid var(--line);border-radius:12px;padding:8px 12px;min-width:250px;color:var(--muted);font-size:13px;cursor:pointer;font-weight:650}
.hsearch:hover{border-color:var(--ink)}
.hsearch .k{margin-left:auto;font:700 10px ui-monospace,Menlo,monospace;border:1.5px solid var(--line);border-radius:5px;padding:1px 6px;color:var(--muted)}
.pmhat{display:flex;gap:8px;padding:2px 2px 12px}
.pmhat span{flex:1;text-align:center;font-weight:800;font-size:12.5px;border:2px solid var(--ink);border-radius:10px;padding:8px 4px;background:var(--surface);cursor:pointer}
.pmhat span.on{background:#FFD84D;box-shadow:2px 2px 0 rgba(var(--stamp),.85)}
.pmhat span.dis{opacity:.45}
.pmrow{display:flex;align-items:center;gap:11px;padding:12px 10px;border-bottom:1px solid var(--line-soft);font-weight:750;font-size:14px;cursor:pointer;border-radius:10px}
.pmrow:hover{background:var(--surface-2)}
.pmrow small{color:var(--muted);font-weight:600;font-size:11.5px}
.pmrow .arr{margin-left:auto;color:var(--muted);font-size:12.5px;font-weight:700}
.sgl{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:12px 10px 4px}
.srowx{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;cursor:pointer;font-size:13.5px}
.srowx:hover{background:var(--surface-2)}
.srowx .ic{width:30px;height:30px;border:2px solid var(--ink);border-radius:8px;display:grid;place-items:center;background:var(--sun);color:var(--ink);flex:none;font-size:14px;box-shadow:1.5px 1.5px 0 rgba(var(--stamp),.7)}
.srowx b{display:block;font-size:13.5px}
.srowx small{display:block;color:var(--muted);font-size:11px}
.nrowx{display:flex;gap:10px;padding:11px 8px;border-bottom:1px solid var(--line-soft);font-size:13px;align-items:flex-start}
.nrowx:last-child{border-bottom:0}
.nrowx .dot{width:9px;height:9px;border-radius:99px;border:1.5px solid var(--ink);margin-top:4px;flex:none;background:#E4572E}
.nrowx .dot.y{background:#FFD84D}.nrowx .dot.g{background:#2F9E63}
.nrowx b{font-size:13px}
.nrowx small{display:block;color:var(--muted);font-size:11px}
.nrowx .act{margin-left:auto;flex:none}
.nrowx.unseen{background:var(--surface-2);border-radius:10px}
.nrowx.unseen b::after{content:'•';color:#E4572E;margin-left:5px}
.content{padding:14px 16px calc(112px + var(--safe-b));max-width:520px;width:100%;margin:0 auto}

.phead{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}
h1.page{font-size:27px;font-weight:880;letter-spacing:-.03em;margin:0}
.psub{color:var(--muted);font-size:13.5px;margin-top:4px;font-weight:600}
.back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-weight:800;font-size:12.5px;margin-bottom:12px}
.back:hover{color:var(--indigo)}

/* ---------- KPI tiles : colourful & tactile ---------- */
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}
.kpi{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);padding:15px 16px;
  box-shadow:var(--shadow-sm);position:relative;overflow:hidden;transition:transform .18s cubic-bezier(.34,1.4,.6,1)}
.kpi:hover{transform:translateY(-3px)}
.kpi .strip{position:absolute;left:0;top:0;height:5px;width:100%}
.kpi .kt{display:flex;align-items:center;gap:8px;margin-top:2px}
.kpi .ki{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:15px;color:#fff;box-shadow:inset 0 2px 3px var(--clay)}
.kpi .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:850}
.kpi .v{font-size:24px;font-weight:880;letter-spacing:-.03em;margin-top:9px}
.kpi .sub{font-size:11.5px;color:var(--muted);margin-top:2px;font-weight:600}

/* ---------- cards / grids ---------- */
.grid{display:grid;grid-template-columns:1fr;gap:13px}
.grid2{display:grid;grid-template-columns:1fr;gap:15px;align-items:start}
.card{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm);overflow:hidden}
.card .ch{padding:15px 17px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.card .ch h3{margin:0;font-size:15.5px;font-weight:850}
.card .ch .hint{font-size:11.5px;color:var(--muted);font-weight:700}
.prop{padding:16px;cursor:pointer;transition:transform .18s cubic-bezier(.34,1.4,.6,1);display:block}
.prop:hover{transform:translateY(-3px)}
.prop .top{display:flex;align-items:center;gap:12px}
.picon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:23px;flex:none;color:#fff;box-shadow:inset 0 2px 3px var(--clay)}
.picon.apt{background:var(--grad)}.picon.house{background:var(--grad-amber)}
.prop .nm{font-weight:850;font-size:16.5px}
.prop .ad{font-size:12.5px;color:var(--muted);margin-top:1px;font-weight:600}
.prop .row{display:flex;gap:16px;margin-top:14px;padding-top:14px;border-top:1.5px dashed var(--line)}
.prop .row .m .l{font-size:10.5px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.prop .row .m .n{font-weight:850;font-size:15px;margin-top:2px}

.badge{font-size:10.5px;font-weight:850;padding:5px 11px;border-radius:999px;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;color:#fff}
.b-ok{background:var(--grad-em)}.b-vac{background:var(--grad-amber)}.b-over{background:var(--grad-rose)}
.b-up{background:var(--grad)}.b-part{background:linear-gradient(140deg,#5AC8FF,#38BDF8)}
.b-mut{background:var(--surface-2);color:var(--muted);box-shadow:inset 0 0 0 1.5px var(--line)}
.pill{font-size:11px;font-weight:800;padding:5px 11px;border-radius:10px;background:var(--surface-2);color:var(--muted);box-shadow:inset 0 0 0 1.5px var(--line);display:inline-block}

.rowitem{display:flex;align-items:center;gap:13px;padding:13px 16px;border-top:1.5px solid var(--line-soft);transition:.12s}
.rowitem:first-of-type{border-top:none}
.rowitem.click{cursor:pointer}.rowitem.click:hover{background:var(--surface-2)}
.rowitem .uic{width:42px;height:42px;border-radius:13px;background:var(--grad);color:#fff;display:grid;place-items:center;
  font-weight:850;flex:none;font-size:14px;box-shadow:inset 0 2px 3px var(--clay)}
.rowitem .un{font-weight:850;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rowitem .us{font-size:12px;color:var(--muted);margin-top:2px;font-weight:600}
.rowitem .ur{margin-left:auto;text-align:right;flex:none}.rowitem .ur .a{font-weight:880}.rowitem .ur .l{font-size:11px;color:var(--muted);font-weight:600}
/* trailing action buttons on a list row (e.g. tenant Invite/verify/agreement).
   Inline on the right on wide screens; on a phone the row wraps and these drop to
   their own line under the name instead of crushing it into an unreadable strip. */
.rowacts{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;margin-left:auto;flex:none}
@media (max-width:560px){
  .rowitem{flex-wrap:wrap}
  .rowitem>div[style*="flex:1"]{min-width:calc(100% - 56px)}
  .rowacts{width:100%;margin:6px 0 0;padding-left:56px;justify-content:flex-start}
  .rowacts .btn.sm{flex:0 0 auto}
}

.txn{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1.5px solid var(--line-soft)}
.txn:first-of-type{border-top:none}
.tdot{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;flex:none;font-size:16px;color:#fff;box-shadow:inset 0 2px 3px var(--clay)}
.txn .td{font-weight:800;font-size:14px}.txn .ts{font-size:11.5px;color:var(--muted);margin-top:1px;font-weight:600}
.txn .ta{margin-left:auto;font-weight:880;white-space:nowrap;font-size:14.5px}

/* progress ring */
.ring{--p:0;--c:var(--indigo);width:124px;height:124px;border-radius:50%;flex:none;
  background:conic-gradient(var(--c) calc(var(--p)*1%),var(--surface-2) 0);display:grid;place-items:center;position:relative;box-shadow:var(--shadow-sm)}
.ring::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--surface)}
.ring .rv{position:relative;text-align:center}.ring .rv b{font-size:25px;font-weight:880}.ring .rv span{font-size:10.5px;color:var(--muted);font-weight:800;display:block}

/* category bars */
.catbar{padding:12px 17px;border-top:1.5px solid var(--line-soft)}
.catbar:first-of-type{border-top:none}
.catbar .cl{display:flex;justify-content:space-between;font-size:13px;font-weight:800;margin-bottom:7px}
.catbar .track{height:9px;border-radius:99px;background:var(--surface-2);overflow:hidden;box-shadow:inset 0 0 0 1px var(--line-soft)}
.catbar .fill{height:100%;border-radius:99px;background:var(--grad)}

/* ---------- clay buttons ---------- */
.btn{border-radius:16px;padding:14px 18px;font-weight:850;font-size:14.5px;color:#fff;background:var(--grad);
  box-shadow:0 14px 28px -12px rgba(122,107,255,.8),inset 0 2px 3px var(--clay);
  transition:transform .14s cubic-bezier(.34,1.56,.64,1),box-shadow .14s;display:inline-flex;align-items:center;gap:8px;justify-content:center}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(1px);box-shadow:0 6px 14px -10px rgba(122,107,255,.8),inset 0 2px 3px var(--clay)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn.ghost{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-sm),inset 0 0 0 1.5px var(--line)}
.btn.ghost:hover{background:var(--surface-2)}
.btn.sm{padding:9px 14px;font-size:13px;border-radius:13px}
.btn.wide{width:100%}
.btn.rose{background:var(--grad-rose);box-shadow:0 14px 28px -12px rgba(251,92,125,.7),inset 0 2px 3px var(--clay)}
.btn.em{background:var(--grad-em);box-shadow:0 14px 28px -12px rgba(16,199,147,.7),inset 0 2px 3px var(--clay)}
.btn.amber{background:var(--grad-amber);box-shadow:0 14px 28px -12px rgba(245,158,11,.7),inset 0 2px 3px var(--clay)}
.chipbtn{padding:8px 15px;border-radius:999px;font-weight:800;font-size:12.5px;background:var(--surface);color:var(--ink-soft);
  box-shadow:inset 0 0 0 1.5px var(--line);white-space:nowrap}
.chipbtn.on{background:var(--grad);color:#fff;box-shadow:inset 0 2px 3px var(--clay)}
.chiprow{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.chiprow::-webkit-scrollbar{display:none}
.iconbtn{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--surface);
  color:var(--muted);font-size:16px;flex:none;box-shadow:var(--shadow-sm),inset 0 0 0 1.5px var(--line)}
.iconbtn:hover{color:var(--indigo)}

.empty{padding:44px 20px;text-align:center;color:var(--muted)}
.empty .ic{font-size:44px}.empty h3{color:var(--ink);margin:12px 0 4px;font-size:17px;font-weight:850}
.empty p{font-size:13px;margin:0 0 4px;font-weight:600}

/* rent month bar + summary tiles */
.mbar{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px solid var(--line);border-radius:18px;padding:8px 10px;box-shadow:var(--shadow-sm);margin-bottom:16px}
.mbar .mnav{width:40px;height:40px;border-radius:13px;background:var(--surface-2);font-size:18px;font-weight:850;color:var(--ink-soft);display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px var(--line)}
.mbar .mlabel{font-weight:850;font-size:15.5px;flex:1;text-align:center}
.summaryrow{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:16px}
.sumtile{flex:1;min-width:120px;background:var(--surface);border:1.5px solid var(--line);border-radius:18px;padding:13px 15px;box-shadow:var(--shadow-sm)}
.sumtile .l{font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.sumtile .v{font-size:20px;font-weight:880;margin-top:5px;letter-spacing:-.02em}
.sumtile .subl{font-size:12px;font-weight:650;color:var(--muted);margin-top:4px}
.dropz{display:block;width:100%;box-sizing:border-box;border:2px dashed var(--ink);border-radius:16px;padding:22px;text-align:center;cursor:pointer;background:repeating-linear-gradient(45deg,#F7E8DA,#F7E8DA 10px,#FBF3E8 10px,#FBF3E8 20px);transition:transform .12s}
.dropz:hover{transform:translateY(-2px)}
.dropz .dzt{font-weight:800;margin-top:6px}
.detgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.detcell{border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--surface-2)}
.detcell .dl{font-size:10.5px;font-weight:850;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-family:ui-monospace,'SF Mono',Menlo,monospace}
.detcell .dv{font-size:15.5px;font-weight:850;margin-top:4px;letter-spacing:-.01em}
/* Collapsible card (progressive disclosure): a <details class="card"> with a
   <summary class="ch"> header + a rotating chevron. */
summary.ch,summary.collap{list-style:none;cursor:pointer;user-select:none}
summary.ch::-webkit-details-marker,summary.collap::-webkit-details-marker{display:none}
.chev{display:inline-block;transition:transform .2s;color:var(--muted);font-weight:900;margin-left:2px}
details[open]>summary .chev{transform:rotate(90deg)}
summary.collap{display:flex;align-items:center;justify-content:space-between;margin:14px 0 7px;font-weight:850}
/* Checkboxes: the global input rule sets appearance:none (for text fields),
   which hides the native tick. Restore it + brand-colour the check. */
input[type=checkbox]{appearance:auto;-webkit-appearance:checkbox;width:20px;height:20px;min-width:20px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;accent-color:var(--indigo);cursor:pointer;flex:none}
input[type=checkbox]:focus{outline:2px solid var(--indigo);outline-offset:1px;box-shadow:none}

/* ---------- modal / bottom sheet ---------- */
.scrim{position:fixed;inset:0;background:rgba(20,14,50,.5);backdrop-filter:blur(5px);display:none;place-items:end center;z-index:80;padding:0}
.scrim.show{display:grid;animation:fade .2s}
.modal{background:var(--surface);border-radius:28px 28px 0 0;width:100%;max-width:520px;max-height:93vh;overflow:auto;
  box-shadow:var(--shadow-lg);transform:none;padding-bottom:var(--safe-b)}
.modal.in{animation:sheet .34s cubic-bezier(.34,1.3,.5,1)}
.modal .mh{padding:20px 20px 14px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--surface);z-index:2}
.modal .mh::before{content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);width:40px;height:5px;border-radius:99px;background:var(--line)}
.modal .mh h3{margin:0;font-size:19px;font-weight:880}
.modal .mh .sub{font-size:12px;color:var(--muted);font-weight:700;margin-top:2px}
.modal .mb{padding:14px 20px 24px}
.modal .x{background:var(--surface-2);width:34px;height:34px;border-radius:12px;font-size:16px;color:var(--muted);display:grid;place-items:center;flex:none;box-shadow:inset 0 0 0 1.5px var(--line)}
label{font-size:12.5px;font-weight:850;color:var(--ink-soft);display:block;margin:15px 0 6px}
input,select,textarea{width:100%;font:inherit;font-weight:700;color:var(--ink);background:var(--surface-2);
  border:1.6px solid var(--line);border-radius:14px;padding:13px 14px;appearance:none}
input::placeholder,textarea::placeholder{color:var(--faint);font-weight:600}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--indigo);box-shadow:0 0 0 4px color-mix(in srgb,var(--indigo) 18%,transparent);background:var(--surface)}
select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236E6796' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}
.seg{display:grid;grid-auto-flow:column;gap:5px;background:var(--surface-2);border-radius:15px;padding:5px;margin-bottom:2px;box-shadow:inset 0 0 0 1.5px var(--line)}
.seg button{padding:11px 0;border-radius:11px;font-weight:850;color:var(--muted);font-size:13.5px}
.seg button.on{background:var(--grad);color:#fff;box-shadow:inset 0 2px 3px var(--clay)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.sugg{margin-top:10px;background:var(--grad-em);color:#fff;font-weight:850;font-size:13.5px;padding:12px;border-radius:14px;width:100%;display:none;box-shadow:inset 0 2px 3px var(--clay)}
.sugg.show{display:block}
.fieldnote{font-size:11.5px;color:var(--muted);margin-top:9px;line-height:1.55;font-weight:600}
.sentrow{opacity:.5;filter:grayscale(.4)}

/* toast */
.toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(96px + var(--safe-b));z-index:120;display:flex;flex-direction:column;gap:8px;align-items:center;width:max-content;max-width:92vw}
.toast{background:var(--ink);color:var(--surface);font-weight:800;font-size:13.5px;padding:12px 18px;border-radius:16px;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:9px;animation:rise .25s}
.toast.err{background:var(--rose-dk);color:#fff}.toast.ok{background:var(--em-dk);color:#fff}

/* skeleton */
.skel{background:linear-gradient(90deg,var(--surface-2) 25%,var(--line-soft) 37%,var(--surface-2) 63%);background-size:400% 100%;animation:sh 1.3s infinite;border-radius:14px}
@keyframes sh{0%{background-position:100% 0}100%{background-position:-100% 0}}

/* fab + floating bottom nav (all screen sizes) */
.fab{display:grid;place-items:center;position:fixed;right:max(18px,calc(50% - 250px));bottom:calc(96px + var(--safe-b));width:60px;height:60px;border-radius:20px;
  background:var(--grad-em);color:#fff;font-size:28px;box-shadow:0 18px 36px -10px rgba(16,199,147,.8),inset 0 2px 3px var(--clay);z-index:50}
.fab:active{transform:scale(.94)}
/* the FAB carries data-tip; [data-tip]{position:relative} has equal specificity and
   comes later, so it was clobbering position:fixed and dropping the FAB off-screen.
   Higher-specificity selector re-pins it to fixed. */
.fab[data-tip]{position:fixed}
.botnav{display:flex;justify-content:space-around;position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + var(--safe-b));
  width:min(440px,calc(100vw - 28px));background:color-mix(in srgb,var(--surface) 86%,transparent);backdrop-filter:blur(16px);
  border:1.5px solid var(--line);border-radius:24px;z-index:45;padding:9px 6px;box-shadow:var(--shadow)}
.botnav a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 10px;color:var(--muted);font-size:10.5px;font-weight:850;position:relative;border-radius:14px}
.botnav a .ic{font-size:21px;line-height:1}
.botnav a.on{color:#fff;background:var(--grad);box-shadow:inset 0 2px 3px var(--clay)}
.botnav a .dot{position:absolute;top:2px;right:calc(50% - 15px);width:9px;height:9px;border-radius:50%;background:var(--rose);border:2px solid var(--surface)}
@media (max-width:560px){ .fab{right:18px} }

/* sign-in gate */
.gate{position:relative;z-index:1;min-height:100vh;display:grid;place-items:center;padding:22px}
.gatecard{background:var(--surface);border-radius:32px;box-shadow:var(--shadow-lg);width:100%;max-width:400px;padding:34px 26px;text-align:center;
  animation:pop .5s cubic-bezier(.3,1.3,.5,1);border:1.5px solid var(--line)}
.gatecard .logo{width:64px;height:64px;border-radius:20px;font-size:32px;margin:0 auto 16px}
.gatecard h1{font-size:27px;font-weight:880;margin:0;letter-spacing:-.03em}
.gatecard p{color:var(--muted);font-size:13.5px;margin:8px 0 22px;line-height:1.55;font-weight:600}
.gsi{display:flex;justify-content:center;margin-bottom:10px;min-height:44px}
.feat{display:flex;gap:8px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.feat span{font-size:11px;color:#fff;font-weight:800;padding:7px 12px;border-radius:999px;box-shadow:inset 0 2px 3px var(--clay)}
.feat span:nth-child(1){background:var(--grad)}.feat span:nth-child(2){background:var(--grad-em)}.feat span:nth-child(3){background:var(--grad-amber)}

@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes pop{from{opacity:0;transform:scale(.94) translateY(10px)}to{opacity:1;transform:none}}
@keyframes sheet{from{opacity:0;transform:translateY(44px)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.content>*{animation:rise .45s both}

/* ---------- desktop / web-app view (sidebar + wide content + centered dialogs) ---------- */
@media (min-width:981px){
  .shell{display:flex;max-width:1240px;margin:0 auto}
  .topbar{display:none}
  .side{display:flex;flex-direction:column;gap:3px;width:256px;flex:none;position:sticky;top:0;height:100vh;
    padding:20px 14px;background:color-mix(in srgb,var(--surface) 72%,transparent);backdrop-filter:blur(14px);border-right:1.5px solid var(--line)}
  .side .brand{display:flex;align-items:center;gap:11px;padding:6px 8px 16px}
  .side .brand b{font-size:17px;font-weight:850;letter-spacing:-.02em;display:block;line-height:1.1}
  .side .brand span{display:block;font-size:11px;color:var(--muted);font-weight:700;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .nav{display:flex;flex-direction:column;gap:3px}
  .nav a{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:14px;font-weight:800;color:var(--ink-soft);font-size:14px}
  .nav a .ic{width:22px;text-align:center;font-size:17px}
  .nav a .cnt{margin-left:auto;font-size:11px;font-weight:850;background:var(--grad-rose);color:#fff;border-radius:999px;padding:2px 8px;min-width:22px;text-align:center;box-shadow:inset 0 2px 3px var(--clay)}
  .nav a:hover{background:var(--surface-2)}
  .nav a.on{background:var(--grad);color:#fff;box-shadow:inset 0 2px 3px var(--clay)}
  .side>.btn.wide{margin-top:12px}
  .who{display:flex;align-items:center;gap:10px;margin-top:auto;border-top:1.5px solid var(--line);padding-top:12px}
  .who .nm{font-size:13px;font-weight:850;line-height:1.1}
  .who .em{font-size:11px;color:var(--muted);max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .who .out{margin-left:auto;font-size:16px;color:var(--muted);width:34px;height:34px;border-radius:11px;background:var(--surface-2);box-shadow:inset 0 0 0 1.5px var(--line)}
  .main{min-height:100vh;min-width:0}
  .content{max-width:860px;padding:28px 34px 64px;margin:0}
  .kpis{grid-template-columns:repeat(4,1fr)}
  .grid2{grid-template-columns:1.35fr 1fr}
  .grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
  .fab,.botnav{display:none}
  h1.page{font-size:30px}
  /* centered dialog instead of bottom sheet */
  .scrim{place-items:center;padding:18px}
  .modal{border-radius:26px;max-width:480px;max-height:90vh;align-self:auto}
  .modal.in{animation:pop .3s cubic-bezier(.34,1.4,.5,1)}
  .modal .mh{border-radius:26px 26px 0 0}
  .modal .mh::before{display:none}
}
@media (prefers-reduced-motion:reduce){
  body::before,body::after,.content>*,.modal.in{animation:none}
  *{transition:none!important}
}

/* RentChitti brand */
.logo{background:transparent !important;box-shadow:none !important;padding:0}
.logo svg{width:100%;height:100%;display:block}
/* M4 · The Breath — near-still ambient: 6s bob, door glows once per cycle */
.logo svg{animation:lgbreath 6s ease-in-out infinite}
@keyframes lgbreath{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-1.4px) rotate(.6deg)}65%{transform:translateY(.5px) rotate(-.4deg)}}
.logo svg .glow{animation:lgamb 6s linear infinite}
@keyframes lgamb{0%,54%{opacity:0}62%,74%{opacity:.85}84%,100%{opacity:0}}
/* M5 · Payment Beat — rent lands: pop + double door-flash + stub tip */
@keyframes lgbeat{0%,8%{transform:scale(1)}16%{transform:scale(1.1)}26%,100%{transform:scale(1)}}
@keyframes lgdfl{0%,8%{opacity:0}13%,22%{opacity:1}27%,33%{opacity:0}38%,48%{opacity:1}58%,100%{opacity:0}}
.logo.lgo-beat svg{animation:lgbeat 1.2s cubic-bezier(.5,0,.3,1.4)}
.logo.lgo-beat svg .glow{animation:lgdfl 1.2s linear}
.logo.lgo-beat svg .stub{animation:lgwink .6s cubic-bezier(.65,0,.3,1)}
@media(prefers-reduced-motion:reduce){.logo svg,.logo svg .glow,.logo svg .stub,.ldxfan .lg4 .stub,.ldxfan .lg4 .tearln{animation:none}}
.dy{font-family:'Iowan Old Style',Palatino,Georgia,serif;font-style:italic;color:#2743F0;font-weight:700}
/* ---- auth gate = landing-page (index) theme: paper ground, ink borders, hard shadows ---- */
/* ===== Premium phone-first sign-in gate (brand-yellow ground, paper card) ===== */
.gate{background:radial-gradient(130% 105% at 0% 0%,#FFF7DC 0%,#FFE79A 42%,#FFD84D 100%);min-height:100vh;padding:0;display:block;place-items:stretch}
:root[data-theme="dark"] .gate{background:radial-gradient(130% 105% at 0% 0%,#2A2416 0%,#1B1810 46%,#141109 100%)}
.gate .authwrap{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);min-height:100vh}
@media(max-width:860px){.gate .authwrap{grid-template-columns:1fr}}
.gate .brandpane{position:relative;overflow:hidden;padding:44px 46px;display:flex;flex-direction:column;justify-content:space-between}
@media(max-width:860px){.gate .brandpane{display:none}}
.gate .blogo{display:flex;align-items:center;gap:11px;font-weight:800;font-size:22px;letter-spacing:-.03em;color:var(--ink)}
.gate .blogo .c{font-family:'Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;font-style:italic;font-weight:600;color:var(--indigo)}
.gate .brandmid{margin:auto 0}
.gate .hero-h{margin:0 0 14px;line-height:.98}
.gate .hero-h .l1{display:block;font-size:clamp(30px,3.4vw,44px);font-weight:800;letter-spacing:-.035em;text-transform:uppercase;color:var(--ink)}
.gate .stick{display:inline-block;background:linear-gradient(135deg,#2E4BFF,#1B2FB8);color:#fff;font-family:'Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;font-style:italic;font-weight:600;text-transform:none;border:2px solid rgba(20,18,12,.9);border-radius:15px;box-shadow:0 14px 30px -10px rgba(27,47,240,.5)}
.gate .hero-h .stick{margin-top:12px;font-size:clamp(30px,3.4vw,44px);padding:2px 20px 8px;transform:rotate(-2.5deg);animation:g4wig 6s ease-in-out infinite}
@keyframes g4wig{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(-4.2deg)}}
.gate .hero-sub{font-size:14px;color:var(--muted);margin:0 0 26px;font-weight:500}
.gate .rcard{background:var(--surface);border-radius:18px;box-shadow:var(--shadow-lg);padding:16px;max-width:300px;transform:rotate(-2deg);text-align:left}
.gate .rcard .rh{display:flex;align-items:center;gap:8px;padding-bottom:11px;border-bottom:1px solid var(--line)}
.gate .rcard .rh b{font-size:13px}.gate .rcard .rh .m{margin-left:auto;font:700 9px ui-monospace,Menlo,monospace;color:var(--muted)}
.gate .rcard .rr{display:flex;align-items:center;gap:10px;padding:10px 0 2px}
.gate .rcard .av{width:30px;height:30px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-weight:800;font-size:11px;flex:none}
.gate .rcard .nm{font-size:12.5px;font-weight:700}.gate .rcard .nm small{display:block;color:var(--muted);font-weight:500;font-size:10px}
.gate .rcard .amt{margin-left:auto;font-weight:800;font-size:13px;text-align:right}
.gate .rcard .amt small{display:block;font:700 8px ui-monospace,Menlo,monospace;color:#129a63}
.gate .rcard .tot{display:flex;justify-content:space-between;margin-top:11px;background:var(--ink);color:var(--sun);border-radius:11px;padding:10px 12px;font-weight:800;font-size:13px}
.gate .brandfoot{font:700 11px ui-monospace,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.gate .formpane{display:grid;place-items:center;padding:40px}
.gate .gatecard{width:100%;max-width:400px;background:var(--surface);border:0;border-radius:24px;box-shadow:var(--shadow-lg);padding:36px 34px;text-align:left;color:var(--ink)}
@media(max-width:860px){.gate .gatecard{padding:28px 24px}.gate .formpane{padding:26px 18px}}
.gate .mhead{display:none}
@media(max-width:860px){.gate .mhead{display:block;text-align:center;margin-bottom:24px}}
.gate .mhead .blogo{justify-content:center;margin-bottom:14px}
.gate .mh-hero{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center}
.gate .mh-hero .mh-rent{font-weight:800;text-transform:uppercase;letter-spacing:-.03em;font-size:22px;color:var(--ink)}
.gate .stick.sm{font-size:22px;border-radius:11px;padding:0 12px 3px;transform:rotate(-2deg)}
.gate .auth-eyebrow{color:var(--indigo)}
.gate .auth-head{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--ink)}
.gate .auth-lede{color:var(--muted);font-weight:500}
.gate label{display:block;font-size:11.5px;font-weight:700;color:var(--muted);margin:0 0 6px}
.gate input,.gate select{background:var(--surface);border:1px solid var(--line);border-radius:12px;color:var(--ink);box-shadow:none;font-weight:500;padding:13px 14px;margin-bottom:14px}
.gate input:focus,.gate select:focus{outline:none;border-color:var(--indigo);box-shadow:0 0 0 4px color-mix(in srgb,var(--indigo) 14%,transparent)}
.gate input::placeholder{color:var(--faint)}
.gate .pill{background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:none;color:var(--ink);font-weight:700}
.gate .btn{background:var(--grad);color:#fff;border:0;border-radius:13px;box-shadow:0 14px 30px -12px rgba(39,67,240,.55),inset 0 2px 3px var(--clay);font-weight:700;transition:transform .1s,box-shadow .15s}
.gate .btn:hover{transform:translateY(-1px);box-shadow:0 18px 34px -14px rgba(39,67,240,.65),inset 0 2px 3px var(--clay)}
.gate .btn:active{transform:translateY(1px)}
.gate .btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.gate .btn.busy{color:transparent!important;position:relative;pointer-events:none}
.gate .btn.busy::after{content:"";position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;animation:g4spin .7s linear infinite}
@keyframes g4spin{to{transform:rotate(360deg)}}
.gate .fieldnote{color:var(--muted);opacity:1}
.gate .fieldnote a{color:var(--indigo)}
.gate .gbtn{position:relative;overflow:hidden;width:100%;display:flex;align-items:center;justify-content:center;gap:11px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow-sm);padding:13px 0;font-weight:700;font-size:14.5px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.gate .gbtn:hover{border-color:color-mix(in srgb,var(--ink) 26%,transparent);box-shadow:var(--shadow)}
.gate .gbtn svg{flex:none}
.gate .gbtn .gsi{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;opacity:.0001}
.gate .gbtn .gsi iframe{transform:scale(3);transform-origin:center}
.gate .ordiv{display:flex;align-items:center;gap:12px;margin:18px 0}
.gate .ordiv i{flex:1;height:1px;background:var(--line);opacity:1}
.gate .ordiv span{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);opacity:1}
.gate .otpcell{border:1px solid var(--line);border-radius:13px;box-shadow:none;font-weight:700;color:var(--ink)}
.gate .otpcell.on{background:color-mix(in srgb,var(--indigo) 8%,var(--surface));border-color:color-mix(in srgb,var(--indigo) 35%,var(--line))}
.gate .otpcell.cur{transform:none;box-shadow:0 0 0 4px color-mix(in srgb,var(--indigo) 14%,transparent);border-color:var(--indigo)}
.gate .otpcells.bad .otpcell{border-color:#E0483D;animation:g4shake .4s}
@keyframes g4shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
/* ===== chitti error language on the gate ===== */
/* every error is a little torn rent-chit: marigold ledger stub + perforation + coral body */
.gate .ferr{display:flex;align-items:stretch;border-radius:0 11px 11px 0;overflow:hidden;box-shadow:0 8px 20px -12px rgba(22,21,19,.34);
  max-height:0;opacity:0;margin:0;transform:translateY(-6px) rotate(-1.5deg);transform-origin:left top;
  transition:max-height .32s,opacity .22s,margin .3s,transform .4s cubic-bezier(.34,1.56,.64,1)}
.gate .ferr.on{max-height:96px;opacity:1;margin:12px 0 4px;transform:none;animation:chitDrop var(--ck-drop) var(--ck-spring)}
@keyframes chitDrop{0%{transform:translateY(-8px) rotate(-4deg)}45%{transform:translateY(0) rotate(1.5deg)}70%{transform:rotate(-.8deg)}100%{transform:none}}
.gate .ferr .chit-stub{position:relative;flex:0 0 30px;background:#F2C13B;border-right:2px dashed rgba(22,21,19,.42);display:flex;flex-direction:column;justify-content:center;gap:4px;padding:0 6px}
.gate .ferr .chit-stub i{display:block;height:1.6px;border-radius:2px;background:rgba(22,21,19,.4)}
.gate .ferr .chit-stub i:nth-child(2){width:70%}
.gate .ferr .chit-body{flex:1;background:linear-gradient(180deg,#FFF3F0,#FFE7E2);color:#B4271F;font-weight:650;font-size:13px;line-height:1.32;display:flex;align-items:center;gap:9px;padding:10px 12px}
.gate .ferr .chit-ic{flex:0 0 auto;width:20px;height:20px;border-radius:50%;background:linear-gradient(140deg,#FF6F6F,#E23B3B);color:#fff;font-weight:800;font-size:13px;display:grid;place-items:center}
:root[data-theme="dark"] .gate .ferr .chit-body{background:linear-gradient(180deg,#3A1F1F,#4A2523);color:#FFC9C2}
/* email typo: a marigold "Shayad" sticky with a tappable pencil-fix */
.gate .fsug{font-size:12.5px;color:var(--muted);margin:0;min-height:0;transition:margin .25s ease}
.gate .fsug.on{margin:-2px 0 12px;animation:chitDrop var(--ck-drop) var(--ck-spring)}
.gate .fsug b{display:inline-flex;align-items:center;gap:5px;cursor:pointer;color:#7a5f14;font-weight:750;background:#FFF6DD;border:1px dashed #F2C13B;border-radius:999px;padding:3px 10px;margin-left:3px;transition:transform .15s ease}
.gate .fsug b:hover{transform:translateY(-1px)}
/* bad field: coral tear-edge + glow-ring shake */
.gate input.bad{border-color:#F0685E!important;border-top-style:dashed;box-shadow:0 0 0 4px rgba(240,104,94,.16);animation:g4shake .42s,badGlow 1.5s ease-out .42s}
@keyframes badGlow{0%{box-shadow:0 0 0 5px rgba(240,104,94,.34)}100%{box-shadow:0 0 0 5px rgba(240,104,94,0)}}
/* OTP cells as receipt stubs: cancel-slash + flash on a wrong code */
.gate .otpcells.bad .otpcell{border-color:#E0483D;color:#C42B2B;background:#FFF0EE;position:relative;overflow:hidden;animation:g4shake .42s,cellFlash .6s ease-out}
.gate .otpcells.bad .otpcell::after{content:"";position:absolute;inset:0;background:linear-gradient(-20deg,transparent 46%,#E23B3B 47% 53%,transparent 54%)}
@keyframes cellFlash{0%{background:#FFD9D4}100%{background:#FFFDF8}}
/* welcome-home success: the chitti's door lights up with a warm bloom */
.gate .succ{text-align:center;padding:14px 0}
.gate .succ .wchit{position:relative;display:inline-grid;place-items:center;padding:8px}
.gate .succ .wchit svg{position:relative;z-index:1;animation:wpop var(--ck-drop) cubic-bezier(.3,1.4,.5,1)}
.gate .succ .wchit .mk-door{animation:wdoor .5s ease .3s both}
@keyframes wdoor{0%{fill:#FFD84D}100%{fill:#FFF3B0}}
@keyframes wpop{0%{transform:scale(0)}60%{transform:scale(1.08)}100%{transform:scale(1)}}
.gate .succ .wchit .wbloom{position:absolute;inset:-14px;border-radius:50%;background:radial-gradient(circle,rgba(255,201,84,.72),transparent 62%);opacity:0;z-index:0;animation:wbloom 1s ease-out .3s both}
@keyframes wbloom{0%{opacity:0;transform:scale(.6)}60%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.12)}}
@media (prefers-reduced-motion:reduce){.gate .ferr,.gate .ferr.on,.gate .fsug.on,.gate input.bad,.gate .otpcells.bad .otpcell,.gate .succ .wchit svg,.gate .succ .wchit .wbloom,.gate .succ .wchit .mk-door{animation:none!important}}
/* signature tear (identical to the landing page) */
.gate .mk-tear{stroke-dashoffset:0}
.gate .tear .mk{overflow:visible}
@keyframes g4sqL{0%{transform:scale(1)}55%{transform:scale(1.035,.96) rotate(-1.4deg)}100%{transform:scale(1)}}
@keyframes g4tearL{0%{stroke-dashoffset:34;opacity:0}12%{opacity:.55}100%{stroke-dashoffset:0;opacity:.55}}
@keyframes g4stubL{0%{transform:rotate(0) translateX(0)}55%{transform:rotate(-13deg) translateX(-2.5px)}80%{transform:rotate(-3.5deg) translateX(-.8px)}100%{transform:rotate(0) translateX(0)}}
.gate .tear .mk{transform-box:fill-box;transform-origin:50% 50%;animation:g4sqL .5s .15s cubic-bezier(.6,0,.4,1)}
.gate .tear .mk-tear{animation:g4tearL .55s .55s linear both}
.gate .tear .mk-stub{transform-box:fill-box;transform-origin:0% 100%;animation:g4stubL 1s 1.05s cubic-bezier(.65,0,.3,1)}
.gate .tear:hover .mk-stub{animation:g4stubL .9s cubic-bezier(.65,0,.3,1)}
@media (prefers-reduced-motion:reduce){.gate .tear .mk,.gate .tear .mk-tear,.gate .tear .mk-stub,.gate .stick{animation:none}.gate .mk-tear{stroke-dashoffset:0}}
/* ============================================================================
   PAPER SKIN — landing-page (index) design language applied app-wide:
   paper ground, ink borders, hard offset shadows, flat brand colours,
   mono "stamp" badges. Appended last so it wins the cascade.
============================================================================ */
:root{
  --r:18px; --r-lg:20px;
  --grad:#2743F0; --grad-em:#1B9E6B; --grad-rose:#E85D75; --grad-amber:#FFB03A;
  --clay:transparent;
  --stamp:22,21,19;              /* hard offset-shadow ink (light: near-black) */
  --emstamp:#1B7A4B;             /* empty-state stamp green */
  --hs-xs:3px 3px 0 rgba(var(--stamp),.9); --hs-sm:4px 4px 0 rgba(var(--stamp),.9);
  --hs:6px 6px 0 rgba(var(--stamp),.9); --hs-lg:8px 8px 0 rgba(var(--stamp),.9);
  --shadow-sm:var(--hs-sm); --shadow:var(--hs); --shadow-lg:var(--hs-lg);
}
body::before,body::after{display:none}
/* cards & tiles */
.card,.kpi,.mbar,.sumtile{border:2px solid var(--ink);border-radius:var(--r);box-shadow:var(--hs-sm);transition:transform .15s,box-shadow .15s}
.kpi:hover,.prop:hover{transform:translate(-2px,-2px)}
.kpi:hover{box-shadow:var(--hs)}
.card .ch{border-bottom:2px solid var(--ink);background:var(--indigo-lt)}
.card .ch h3{font-weight:900}
.card.inboxcard .ch{background:#FFD84D}
/* page title = yellow chitti slip */
h1.page{display:inline-block;position:relative;background:#FFD84D;border:2.5px solid var(--ink);border-radius:13px;padding:7px 28px 9px 18px;
  box-shadow:5px 5px 0 rgba(var(--stamp),.9);transform:rotate(-1.2deg);animation:slipin .5s cubic-bezier(.2,1.2,.4,1) backwards}
h1.page::before{content:'';position:absolute;top:-6.5px;right:-10.5px;width:32px;height:32px;background:var(--ground);
  clip-path:polygon(0 0,100% 0,100% 100%)}
h1.page::after{content:'';position:absolute;top:-4.5px;right:-4.5px;width:24px;height:24px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 2 22 22 H2 Z' fill='%23F7E8DA' stroke='%23161513' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat;background-size:100% 100%}
@keyframes slipin{from{opacity:0;transform:rotate(-7deg) scale(.8)}to{opacity:1;transform:rotate(-1.2deg) scale(1)}}
/* staggered entrance for cards & tiles */
@keyframes cardrise{from{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:none}}
.card,.kpi,.sumtile,.mbar{animation:cardrise .6s cubic-bezier(.18,.9,.3,1.12) backwards}
.kpi:nth-child(2),.sumtile:nth-child(2),.card:nth-of-type(2){animation-delay:.08s}
.kpi:nth-child(3),.sumtile:nth-child(3),.card:nth-of-type(3){animation-delay:.16s}
.kpi:nth-child(4),.sumtile:nth-child(4),.card:nth-of-type(4){animation-delay:.24s}
.grid2>div:nth-child(2) .card{animation-delay:.12s}
.grid2>div:nth-child(2) .card:nth-of-type(2){animation-delay:.2s}
/* page meta chip under the title slip */
.psub{display:inline-block;position:relative;background:var(--surface);border:1.5px solid var(--ink);border-radius:9px;padding:4px 11px;
  font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:11px;font-weight:700;color:var(--ink);
  box-shadow:2px 2px 0 rgba(var(--stamp),.9);margin-top:9px;animation:cardrise .45s .14s cubic-bezier(.2,.8,.3,1) backwards}
h1.page+.psub{margin-left:16px}
.phead{margin-bottom:20px}
/* month mover = cyan band with tactile arrows */
.mbar{background:var(--indigo-lt)}
.mbar .mlabel{font-weight:900;animation:cardrise .35s backwards}
.mbar .mnav{transition:transform .12s,box-shadow .12s}
.mbar .mnav:hover{transform:translate(-1px,-1px);box-shadow:2px 2px 0 rgba(var(--stamp),.9)}
.sumtile{padding-top:19px}
/* icons: larger, chipped, inked for visibility */
.kpi .ki{width:36px;height:36px;font-size:19px;border-radius:11px}
.tdot{width:42px;height:42px;font-size:19px;border-radius:12px}
.picon{font-size:25px}
.uic{font-size:15px}
.iconbtn{font-size:18px}
.nav a .ic{display:grid;place-items:center;width:34px;height:34px;background:var(--ground);border:2px solid var(--ink);border-radius:10px;font-size:17px;flex:none;transition:transform .12s}
.nav a:hover .ic{transform:rotate(-6deg) scale(1.06)}
.nav a.on .ic{background:var(--surface);color:var(--ink)}
.botnav a .ic{font-size:23px}
.empty .ic{font-size:42px;filter:none}
.modal .x{font-size:17px}
.mbar .mnav{font-size:20px}
.ic svg,.ki svg,.tdot svg,.iconbtn svg,.out svg,.mi svg{display:block}
.btn svg,.picon svg,.empty .ic svg{display:inline-block;vertical-align:-3px}
.picon svg{width:1.05em;height:1.05em}
.tdot{color:var(--ink)}
/* ink the remaining grey/white icon containers — currentColor strokes were
   inheriting #fff (kpi tiles) or --muted (iconbtn, sign-out) */
.kpi .ki{color:var(--ink)}
.iconbtn{color:var(--ink)}
.iconbtn:hover{color:var(--indigo)}
.who .out{color:var(--ink)}
.picon{color:var(--ink)}
.rowitem .uic{color:var(--ink)}
/* ------- paper-skin loaders (4 variants, all functional) ------- */
@keyframes ldrsweep{0%{transform:translateX(-100%)}100%{transform:translateX(300%)}}
@keyframes ldrspin{to{transform:rotate(360deg)}}
@keyframes ldrhop{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}
@keyframes ldrflip{0%,10%{transform:rotate(0deg)}45%,55%{transform:rotate(180deg)}90%,100%{transform:rotate(360deg)}}
/* v1 · top activity bar — any API call in flight */
.ldrbar{position:fixed;top:0;left:0;right:0;height:4px;z-index:200;background:color-mix(in srgb,var(--ink) 12%,transparent);display:none;overflow:hidden}
.ldrbar::after{content:'';position:absolute;top:0;bottom:0;width:34%;background:var(--sun,#FFD84D);border-right:2px solid var(--ink);border-left:2px solid var(--ink);animation:ldrsweep 1s linear infinite}
body.rpc-busy .ldrbar{display:block}
/* v2 · working chit — bottom-right ink chip with hopping dots (slow calls) */
.ldrchip{position:fixed;right:16px;bottom:76px;z-index:200;display:none;align-items:center;gap:8px;
  background:var(--ink);color:var(--surface);font-family:ui-monospace,Menlo,monospace;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:9px 14px;border-radius:999px;box-shadow:3px 3px 0 rgba(var(--stamp),.3)}
.ldrchip i{width:5px;height:5px;border-radius:50%;background:var(--sun,#FFD84D);animation:ldrhop .9s infinite}
.ldrchip i:nth-child(2){animation-delay:.15s}.ldrchip i:nth-child(3){animation-delay:.3s}
.ldrchip .lchit{flex:0 0 auto;line-height:0;margin-right:1px}   /* winking chitti leads the working chip */
.ldrchip .lchit svg{display:block;overflow:visible}
.ldrchip .lchit .stub{transform-box:fill-box;transform-origin:0% 100%;animation:lgwink var(--ck-wink) var(--ck-ease) infinite}
body.rpc-slow .ldrchip{display:flex}
/* v3 · ink-ring button spinner — .btn.busy swaps label for a ring */
.btn.busy{pointer-events:none;position:relative;color:transparent!important}
.btn.busy::after{content:'';position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;
  border:3px dashed var(--sun,#FFD84D);animation:ldrspin .9s linear infinite}   /* chitti perforation ring */
/* v4 · chitti-slip flip — hero loader for boot / empty loading states */
/* ------- mixed loaders (user picks 30·47·48·52·63·75·83·84·86·91) ------- */
@keyframes ldxblink{0%,45%,100%{opacity:1}50%,95%{opacity:.15}}
@keyframes ldxsteam{0%{transform:translateY(5px);opacity:0}30%{opacity:.7}100%{transform:translateY(-13px);opacity:0}}
@keyframes ldxwob{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes ldxroll{0%{transform:translateX(-46px) rotate(0)}100%{transform:translateX(46px) rotate(360deg)}}
@keyframes ldxtick{0%,35%{opacity:0;transform:scale(.4)}48%{opacity:1;transform:scale(1.15)}55%,88%{opacity:1;transform:scale(1)}100%{opacity:0}}
@keyframes ldxtruck{0%{transform:translateX(-34px)}100%{transform:translateX(38px)}}
/* M1 boot: Chitti letters + sun dots + caption */
/* Boot: the ORIGINAL B6 — the chitti unfolds. One flap swings open to reveal
   the mark, wordmark fades in beneath. Plays ONCE and holds; staged captions
   below; FLIP handoff flies the mark to the sidebar when the app is ready. */
.ldxboot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;
  min-height:100vh;min-height:100dvh;position:relative}
@keyframes b6wm{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
/* M1 · The Tear — boot: squeeze → perforation rips → stub peels → door lights. One-shot. */
@keyframes g4sq{0%{transform:scale(1)}55%{transform:scale(1.035,.96) rotate(-1.4deg)}100%{transform:scale(1)}}
@keyframes g4tear{0%{stroke-dashoffset:32;opacity:0}12%{opacity:.55}100%{stroke-dashoffset:0;opacity:.55}}
@keyframes g4stub{0%{transform:rotate(0) translateX(0)}55%{transform:rotate(-13deg) translateX(-2.5px)}80%{transform:rotate(-3.5deg) translateX(-.8px)}100%{transform:rotate(0) translateX(0)}}
@keyframes g4lit{0%{opacity:0}100%{opacity:1}}
@keyframes g4door{0%{fill:#FFFDF8}100%{fill:#FFD84D}}
.ldxboot .g4book{position:relative}
.ldxboot .g4book svg{display:block;filter:drop-shadow(4px 4px 0 rgba(22,21,19,.9));overflow:visible}
.ldxboot .g4book .whole{transform-box:fill-box;transform-origin:50% 50%;animation:g4sq .5s .15s cubic-bezier(.6,0,.4,1)}
.ldxboot .g4book .tearln{stroke-dashoffset:32;opacity:0;animation:g4tear .55s .55s linear forwards}
.ldxboot .g4book .stub{transform-box:fill-box;transform-origin:0% 100%;animation:g4stub 1s 1.05s cubic-bezier(.65,0,.3,1) forwards}
.ldxboot .g4book .glow{opacity:0;animation:g4lit .45s 1.7s ease forwards}
.ldxboot .g4book .door{animation:g4door .45s 1.7s ease forwards}
.ldxboot .lwmk{opacity:0;animation:b6wm .5s 1.2s cubic-bezier(.5,0,.4,1) forwards}
.ldxboot .lwmk .wm1{font-size:clamp(22px,5vw,30px)}
/* the logo's signature wink (M2): stub tips, door-glow blinks — on FLIP landing,
   once per load, and on brand hover. At rest the mark is still. */
@keyframes lgwink{0%{transform:rotate(0)}40%{transform:rotate(-9deg)}100%{transform:rotate(0)}}
@keyframes lgglow{0%,18%{opacity:0}38%,66%{opacity:1}100%{opacity:0}}
.logo{position:relative}
.logo svg .stub{transform-box:fill-box;transform-origin:0% 100%}
.logo.lgo-play svg .stub,.brand:hover .logo svg .stub{animation:lgwink .55s cubic-bezier(.65,0,.3,1)}
.logo.lgo-play svg .glow,.brand:hover .logo svg .glow{animation:lgglow .55s linear}
.ldxboot .lcapw{height:19px;overflow:hidden;text-align:center}
.ldxboot .lcaps{font-family:ui-monospace,Menlo,monospace;font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#6E6A60;line-height:19px;transition:transform .45s cubic-bezier(.5,0,.3,1)}
.ldxboot .lcaps .lslow{color:#B45309}
.ldxboot .lorn{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none}
/* seasonal ornaments */
.ldxboot .odiya{position:absolute;left:70px;top:-64px}
.ldxboot .odiya i{display:block;width:11px;height:15px;background:#FFD84D;border:2px solid #161513;border-radius:50%/38% 38% 62% 62%;margin:0 auto;box-shadow:0 0 8px 1.5px rgba(255,190,60,.75);animation:ldxwob .5s ease-in-out infinite;transform-origin:bottom}
.ldxboot .odiya em{display:block;width:24px;height:8px;background:#FB5C7D;border:2.5px solid #161513;border-radius:0 0 10px 10px;margin-top:1px}
.ldxboot .orain i{position:absolute;width:3px;height:9px;border-radius:2px;background:#2743F0;animation:ldxfall 1s linear infinite}
.ldxboot .okite{position:absolute;left:64px;top:-78px;width:17px;height:17px;background:#FB5C7D;border:2.5px solid #161513;transform:rotate(45deg);animation:ldxwob 2.2s ease-in-out infinite}
@keyframes ldxfall{0%{transform:translateY(-6px);opacity:0}25%{opacity:1}80%{transform:translateY(16px);opacity:1}100%{transform:translateY(19px);opacity:0}}
/* P5 flip clone + P6 develop ghosts */
.ldxflip{position:fixed;z-index:320;transform-origin:top left;transition:transform .55s cubic-bezier(.55,0,.25,1)}
.ldxdev{position:fixed;inset:0;z-index:310;pointer-events:none;background:var(--ground,#EDEBE5);animation:ldxdevout .55s .25s ease forwards}
.ldxdev i{position:absolute;border:2px dashed #C9C5B8;border-radius:12px;background:linear-gradient(90deg,#F4F2EA 25%,#E4E1D6 37%,#F4F2EA 63%);background-size:400% 100%;animation:shimmer 1.1s linear infinite}
@keyframes ldxdevout{to{opacity:0}}
/* P4 success beats — one-shot overlays */
.ldxbeat{position:fixed;inset:0;z-index:340;display:grid;place-items:center;pointer-events:none}
.ldxbeat .btxt{font-family:ui-monospace,Menlo,monospace;font-weight:800;font-size:22px;color:#1B7A4B;border:3px solid #1B7A4B;border-radius:10px;padding:6px 16px;background:#FFFDF8;transform:rotate(-5deg);box-shadow:4px 4px 0 rgba(22,21,19,.5);animation:ldxstamptxt 1.25s ease forwards}
.ldxbeat .bstamp{position:absolute;width:34px;height:18px;background:#161513;border-radius:5px 5px 3px 3px;margin-top:-64px;animation:ldxthump 1.25s ease forwards}
@keyframes ldxthump{0%{transform:translateY(-30px) rotate(-4deg);opacity:0}20%{opacity:1}38%,52%{transform:translateY(6px) rotate(0)}70%,100%{transform:translateY(-30px) rotate(-4deg);opacity:0}}
@keyframes ldxstamptxt{0%,30%{opacity:0;transform:scale(.55) rotate(-5deg)}44%{opacity:1;transform:scale(1.12) rotate(-5deg)}52%,82%{opacity:1;transform:scale(1) rotate(-5deg)}100%{opacity:0;transform:rotate(-5deg)}}
.ldxbeat.gullak .bgul{width:52px;height:40px;background:#FB5C7D;border:3px solid #161513;border-radius:50% 50% 42% 42%/62% 62% 38% 38%;animation:ldxgshake 1.25s ease forwards}
.ldxbeat.gullak b{position:absolute;margin-top:-58px;width:20px;height:20px;border-radius:50%;background:#FFD84D;border:2.5px solid #161513;display:grid;place-items:center;font-size:11px;font-weight:800;animation:ldxgcoin 1.25s ease forwards}
/* property added → house pops; tenant joined → warm welcome (door-light) */
.ldxbeat.ghar .bhouse,.ldxbeat.swagat .bwave{position:absolute;margin-top:-64px;width:48px;height:48px;border-radius:12px;background:#FFD84D;border:3px solid #161513;box-shadow:4px 4px 0 rgba(22,21,19,.4);display:grid;place-items:center;animation:ldxbpop 1.25s cubic-bezier(.3,1.5,.4,1) forwards}
.ldxbeat.swagat .bwave{border-radius:50%}
.ldxbeat.ghar .bhouse::before{content:"";width:24px;height:19px;background:#161513;clip-path:polygon(50% 0,100% 44%,100% 100%,0 100%,0 44%)}
.ldxbeat.ghar .bhouse::after{content:"";position:absolute;bottom:13px;width:5px;height:9px;border-radius:1px;background:#FFE9A0}
.ldxbeat.swagat .bwave::before{content:"";width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#FFF6C8,#FFD84D);box-shadow:0 0 12px 3px rgba(255,201,84,.85);border:2px solid #161513}
@keyframes ldxbpop{0%{transform:scale(0) translateY(12px)}55%{transform:scale(1.15) translateY(0)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.ldxbeat.ghar .bhouse,.ldxbeat.swagat .bwave{animation:none}}
@keyframes ldxgcoin{0%{transform:translateY(-16px);opacity:0}25%{opacity:1}45%{transform:translateY(26px);opacity:1}50%,100%{opacity:0}}
@keyframes ldxgshake{0%,40%{transform:translateX(0)}48%{transform:translateX(-4px)}56%{transform:translateX(4px)}64%{transform:translateX(-2px)}72%,80%{transform:translateX(0)}100%{transform:translateX(0);opacity:0}}
.ldxbeat.conf .btxt{font-size:16px;animation:ldxstamptxt 2.1s ease forwards}
.ldxbeat.conf .bconf i{position:absolute;width:12px;height:9px;border:1.5px solid #161513;border-radius:2px;opacity:0}
.ldxbeat.conf .bconf i:nth-child(1){background:#FFD84D;animation:ldxc1 2.1s ease forwards}
.ldxbeat.conf .bconf i:nth-child(2){background:#FB5C7D;animation:ldxc2 2.1s ease forwards}
.ldxbeat.conf .bconf i:nth-child(3){background:#34C79A;animation:ldxc3 2.1s ease forwards}
.ldxbeat.conf .bconf i:nth-child(4){background:#2743F0;animation:ldxc4 2.1s ease forwards}
.ldxbeat.conf .bconf i:nth-child(5){background:#FFD84D;animation:ldxc5 2.1s ease forwards}
.ldxbeat.conf .bconf i:nth-child(6){background:#FB5C7D;animation:ldxc6 2.1s ease forwards}
.ldxbeat.conf .bconf i:nth-child(7){background:#9B5CF6;animation:ldxc1 2.1s .12s ease forwards}
.ldxbeat.conf .bconf i:nth-child(8){background:#34C79A;animation:ldxc4 2.1s .12s ease forwards}
@keyframes ldxc1{0%,18%{transform:translate(0,0) rotate(0);opacity:0}24%{opacity:1}85%,100%{transform:translate(-110px,-130px) rotate(-220deg);opacity:0}}
@keyframes ldxc2{0%,18%{transform:translate(0,0) rotate(0);opacity:0}24%{opacity:1}85%,100%{transform:translate(120px,-140px) rotate(200deg);opacity:0}}
@keyframes ldxc3{0%,18%{transform:translate(0,0) rotate(0);opacity:0}24%{opacity:1}85%,100%{transform:translate(-150px,-40px) rotate(160deg);opacity:0}}
@keyframes ldxc4{0%,18%{transform:translate(0,0) rotate(0);opacity:0}24%{opacity:1}85%,100%{transform:translate(150px,-52px) rotate(-170deg);opacity:0}}
@keyframes ldxc5{0%,18%{transform:translate(0,0) rotate(0);opacity:0}24%{opacity:1}85%,100%{transform:translate(-52px,-170px) rotate(260deg);opacity:0}}
@keyframes ldxc6{0%,18%{transform:translate(0,0) rotate(0);opacity:0}24%{opacity:1}85%,100%{transform:translate(56px,-176px) rotate(-260deg);opacity:0}}
/* P1 real progress: modal counter + progressive truck boxes / chai glasses */
.lprog{font-family:ui-monospace,Menlo,monospace;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  border:2px solid #161513;border-radius:8px;padding:4px 12px;background:#FFD84D;box-shadow:2px 2px 0 #161513;margin:10px auto 0;width:max-content}
.ldxtruckw.prog .lgo{animation:none;left:44px}
.ldxtruckw.prog .lbx{opacity:0;animation:none;transition:opacity .25s}
.ldxchai{display:flex;gap:12px;justify-content:center;align-items:flex-end;padding:6px 0 2px}
.ldxchai .lgl{width:26px;height:44px;border:2.5px solid #161513;border-top-width:1.5px;border-radius:3px 3px 8px 8px;display:flex;align-items:flex-end;padding:0 3px 3px}
.ldxchai .lgl span{display:block;width:100%;background:#B45309;border-radius:2px;height:3px;transition:height .35s cubic-bezier(.4,0,.4,1)}
/* M2 chai-under-fan: upgrades the working chit on very slow calls */
.ldxfan{position:fixed;right:16px;bottom:76px;z-index:200;display:none;flex-direction:column;align-items:center;gap:2px;
  background:var(--card,#FFFDF8);border:2.5px solid var(--ink,#161513);border-radius:16px;box-shadow:4px 4px 0 var(--ink,#161513);padding:12px 18px 9px}
/* M3 · Counting Chittis — the stub tears off and a fresh one slides in */
.ldxfan .lg4{width:40px;height:42px}
.ldxfan .lg4 svg{display:block;overflow:visible;filter:drop-shadow(1.5px 1.5px 0 rgba(22,21,19,.85))}
.ldxfan .lg4 .stub{transform-box:fill-box;transform-origin:0% 100%;animation:m3stub var(--ck-wink) cubic-bezier(.6,0,.4,1) infinite}
@keyframes m3stub{0%,10%{transform:rotate(0) translate(0,0);opacity:1}38%{transform:rotate(-26deg) translate(-9px,3px);opacity:1}54%{transform:rotate(-30deg) translate(-15px,8px);opacity:0}60%{transform:rotate(0) translate(-10px,0);opacity:0}80%,100%{transform:rotate(0) translate(0,0);opacity:1}}
.ldxfan .lg4 .tearln{animation:m3tear 2.6s linear infinite}
@keyframes m3tear{0%,8%{opacity:.55}30%,58%{opacity:0}78%,100%{opacity:.55}}
.ldxfan .lcup{position:relative;width:30px;height:22px}
.ldxfan .lcup i{position:absolute;left:3px;top:-6px;width:3px;height:7px;border-radius:2px;background:#6E6A60;animation:ldxsteam 1.4s infinite}
.ldxfan .lcup i:nth-child(2){left:12px;animation-delay:.6s}
.ldxfan .lcup em{position:absolute;left:0;bottom:0;width:22px;height:14px;background:var(--card,#FFFDF8);border:2.5px solid var(--ink,#161513);border-radius:0 0 9px 9px}
.ldxfan .lcup u{position:absolute;left:20px;bottom:3px;width:7px;height:8px;border:2.5px solid var(--ink,#161513);border-left:0;border-radius:0 6px 6px 0;text-decoration:none}
.ldxfan .lcap{font-family:ui-monospace,Menlo,monospace;font-size:8.5px;font-weight:700;letter-spacing:.09em;color:#6E6A60;text-transform:uppercase;margin-top:3px}
body.rpc-verylong .ldrchip{display:none}
body.rpc-verylong .ldxfan{display:flex}
/* M3 diya-rangoli (sign-in) & M5 truck (sample data) — modal scenes */
.ldxscene{position:relative;margin:6px auto 4px}
.ldxrangoli{width:96px;height:96px}
.ldxrangoli .lring{position:absolute;inset:6px;animation:ldrspin 4.5s linear infinite}
.ldxrangoli .lring i{position:absolute;width:11px;height:11px;border-radius:50%;border:2px solid #161513}
.ldxrangoli .lring i:nth-child(1){left:50%;top:0;margin-left:-5.5px;background:#9B5CF6}
.ldxrangoli .lring i:nth-child(2){right:0;top:50%;margin-top:-5.5px;background:#FB5C7D}
.ldxrangoli .lring i:nth-child(3){left:50%;bottom:0;margin-left:-5.5px;background:#34C79A}
.ldxrangoli .lring i:nth-child(4){left:0;top:50%;margin-top:-5.5px;background:#2743F0}
.ldxrangoli .ldiya{position:absolute;left:50%;top:34px;margin-left:-12px;text-align:center}
.ldxrangoli .ldiya i{display:block;width:12px;height:16px;background:#FFD84D;border:2px solid #161513;border-radius:50%/38% 38% 62% 62%;margin:0 auto;box-shadow:0 0 8px 1.5px rgba(255,190,60,.75);animation:ldxwob .5s ease-in-out infinite;transform-origin:bottom}
.ldxrangoli .ldiya em{display:block;width:24px;height:9px;background:#FB5C7D;border:2.5px solid #161513;border-radius:0 0 10px 10px;margin-top:1px}
.ldxtruckw{width:150px;height:64px}
.ldxtruckw .lgo{position:absolute;left:34px;top:8px;animation:ldxtruck 2.4s linear infinite}
.ldxtruckw .lbody{position:relative;width:56px;height:38px}
.ldxtruckw .lbody>i{position:absolute}
.ldxtruckw .lbed{left:0;top:6px;width:38px;height:20px;background:#FFD84D;border:2.5px solid #161513;border-radius:4px}
.ldxtruckw .lbx{top:-2px;width:9px;height:10px;background:#F7E8DA;border:2px solid #161513;border-radius:3px 3px 0 0;animation:ldrhop .8s infinite}
.ldxtruckw .lbx1{left:5px}.ldxtruckw .lbx2{left:16px;animation-delay:.2s}.ldxtruckw .lbx3{left:27px;animation-delay:.4s}
.ldxtruckw .lcab{right:0;top:10px;width:17px;height:16px;background:#2743F0;border:2.5px solid #161513;border-radius:3px 7px 0 0}
.ldxtruckw .lwh{bottom:-4px;width:11px;height:11px;border:2.5px solid #161513;border-radius:50%;background:#FFFDF8;border-top-color:#6E6A60;animation:ldrspin .5s linear infinite}
.ldxtruckw .lw1{left:7px}.ldxtruckw .lw2{right:5px}
.ldxtruckw .lroad{position:absolute;left:0;bottom:8px;width:150px;height:2.5px;background:#6E6A60;opacity:.5}
.ldxcap{text-align:center;font-family:ui-monospace,Menlo,monospace;font-size:9.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#6E6A60;margin-top:8px}
/* e-stamp seal — a certification seal draws its ring + check on a loop */
.ldxseal{width:72px;height:72px}
.ldxseal svg{width:72px;height:72px}
.ldxseal .sring{stroke:#0E9F73;stroke-width:2.6;stroke-dasharray:120;stroke-dashoffset:120;animation:ldxsealDraw var(--ck-scene) var(--ck-ease) infinite}
.ldxseal .sring2{stroke:#0E9F73;stroke-width:1;stroke-dasharray:3 3;opacity:.55;animation:ldrspin 3s linear infinite;transform-origin:center}
.ldxseal .schk{stroke:#0E9F73;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:22;stroke-dashoffset:22;animation:ldxschk var(--ck-scene) var(--ck-ease) infinite}
@keyframes ldxsealDraw{0%{stroke-dashoffset:120}60%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:.4}}
@keyframes ldxschk{0%,55%{stroke-dashoffset:22}80%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:.4}}
@media (prefers-reduced-motion:reduce){.ldxseal .sring,.ldxseal .sring2,.ldxseal .schk{animation:none!important;stroke-dashoffset:0}}
/* gullak (clay matka) — fills as bulk-rent payments record; a coin drops in */
.ldxgullak{position:relative;width:82px;height:78px;margin:2px auto 0}
.ldxgullak .gpot{position:relative}
.ldxgullak .gpot.jig{animation:gjig .35s ease}
@keyframes gjig{0%,100%{transform:translateY(0)}42%{transform:translateY(2px) scaleX(1.03)}}
.ldxgullak .gfill{transition:y .3s ease,height .3s ease}
.ldxgullak .gcoin{position:absolute;left:50%;top:-4px;margin-left:-8px;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFE9A0,#FFD84D);border:2px solid #161513;display:grid;place-items:center;font:800 9px ui-monospace,Menlo,monospace;color:#161513;z-index:2;animation:gcoindrop 1.4s cubic-bezier(.5,0,.7,1) infinite}
@keyframes gcoindrop{0%{top:-6px;opacity:0}18%{opacity:1}60%{top:24px;opacity:1}70%{top:29px;opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.ldxgullak .gcoin,.ldxgullak .gpot.jig{animation:none}}
/* refresh icon spins while data reloads */
body.rpc-busy .iconbtn[data-tip="Refresh"] svg,body.rpc-busy .iconbtn[aria-label="Refresh data"] svg{animation:ldrspin .8s linear infinite}
@media (prefers-reduced-motion:reduce){.ldrbar::after,.ldrchip i,.btn.busy::after{animation-duration:2.5s}}
/* paper skeleton slips */
.skel{background:linear-gradient(90deg,var(--surface-2) 25%,var(--line-soft) 37%,var(--surface-2) 63%);background-size:400% 100%;
  border:2px dashed color-mix(in srgb,var(--ink) 26%,transparent);border-radius:14px}
/* rows cascade in like the home cards */
.rowitem,.txn,.catbar{animation:cardrise .38s cubic-bezier(.2,.8,.3,1) backwards}
.rowitem:nth-child(2),.txn:nth-child(2),.catbar:nth-child(2){animation-delay:.05s}
.rowitem:nth-child(3),.txn:nth-child(3),.catbar:nth-child(3){animation-delay:.1s}
.rowitem:nth-child(4),.txn:nth-child(4),.catbar:nth-child(4){animation-delay:.15s}
.rowitem:nth-child(5),.txn:nth-child(5),.catbar:nth-child(5){animation-delay:.2s}
.rowitem:nth-child(n+6),.txn:nth-child(n+6),.catbar:nth-child(n+6){animation-delay:.25s}
@media (prefers-reduced-motion:reduce){.rowitem,.txn,.catbar{animation:none}}
/* status-tinted rows (rent, tenants, portal) */
.rowitem:has(.b-over){background:linear-gradient(90deg,#FFF3F6,transparent 72%)}
.rowitem:has(.b-ok){background:linear-gradient(90deg,color-mix(in srgb,var(--em) 13%,transparent),transparent 72%)}
.rowitem:has(.b-part),.rowitem:has(.b-up){background:linear-gradient(90deg,#F0F7FF,transparent 72%)}
.rowitem:has(.b-vac){background:linear-gradient(90deg,#FBF4EA,transparent 72%)}
/* clickable cards feel alive (More hub modules etc.) */
.picon{transition:transform .18s cubic-bezier(.34,1.56,.64,1)}
.card[onclick]:hover .picon{transform:rotate(-7deg) scale(1.1)}
.card[onclick]{position:relative}
.card[onclick]::after{content:'\2192';position:absolute;right:14px;bottom:12px;font-weight:900;font-size:16px;color:var(--faint);opacity:0;transform:translateX(-6px);transition:.18s}
.card[onclick]:hover::after{opacity:1;transform:none;color:var(--indigo)}
@media (prefers-reduced-motion:reduce){.card,.kpi,.sumtile,.mbar,h1.page{animation:none}}
.card .ch .hint{background:var(--surface);border:1.5px solid var(--ink);border-radius:8px;padding:2px 9px;color:var(--ink);font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10.5px;font-weight:700}
.modal .mh{background:#FFD84D;border-bottom:2.5px solid var(--ink);border-radius:19px 19px 0 0}
.modal .mh::before{background:rgba(var(--stamp),.35)}
.modal .mh .sub{color:var(--ink);opacity:.7}
.kpi .strip{height:6px;border-bottom:2px solid var(--ink)}
.kpi .ki,.picon,.uic,.tdot,.avatar,.iconbtn,.modal .x,.mbar .mnav{border:2px solid var(--ink);box-shadow:none;border-radius:11px}
.avatar{border-radius:50%}
.logo{box-shadow:none;background:none;border-radius:11px}
.kpi .v,.sumtile .v{font-weight:900;letter-spacing:-.02em}
.kpi .k,.sumtile .l{font-family:ui-monospace,'SF Mono',Menlo,monospace;letter-spacing:.1em;font-size:9.5px}
/* buttons */
.btn{border:2px solid var(--ink);border-radius:14px;box-shadow:var(--hs-sm);background:var(--grad);font-weight:900;
  transition:transform .12s,box-shadow .12s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:var(--hs)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 rgba(var(--stamp),.9)}
.btn.ghost{background:var(--indigo-lt);color:var(--ink);box-shadow:var(--hs-sm)}
.btn.ghost:hover{background:#D8E2FF}
.btn.em{background:var(--grad-em);box-shadow:var(--hs-sm)}
.btn.rose{background:var(--grad-rose);box-shadow:var(--hs-sm)}
.btn.amber{background:var(--grad-amber);color:var(--ink);box-shadow:var(--hs-sm)}
.btn.sm{border-radius:11px;box-shadow:var(--hs-xs)}
.btn:disabled{box-shadow:none}
.chipbtn{border:2px solid var(--ink);box-shadow:var(--hs-xs);background:var(--indigo-lt);color:var(--ink)}
/* Paper-skin tooltips: [data-tip] replaces native title=. Ink chit with a
   hard offset shadow, instant on hover/keyboard-focus. Desktop enhancement
   only (no hover on touch) — important info never lives only in a tip. */
[data-tip]{position:relative}
[data-tip]::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%) scale(.94);
  background:var(--ink,var(--ink));color:var(--surface);font-size:11.5px;font-weight:700;letter-spacing:.02em;line-height:1.45;
  padding:6px 10px;border-radius:9px;box-shadow:3px 3px 0 rgba(var(--stamp),.25);
  width:max-content;max-width:230px;white-space:normal;text-align:center;
  opacity:0;pointer-events:none;z-index:80;transition:opacity .12s,transform .12s}
[data-tip]::before{content:'';position:absolute;left:50%;bottom:calc(100% + 3px);transform:translateX(-50%);
  border:6px solid transparent;border-top-color:var(--ink,var(--ink));opacity:0;pointer-events:none;z-index:80;transition:opacity .12s}
[data-tip]:hover::after,[data-tip]:focus-visible::after{opacity:1;transform:translateX(-50%) scale(1)}
[data-tip]:hover::before,[data-tip]:focus-visible::before{opacity:1}
/* below-position variant for elements hugging the top bar */
[data-tip][data-tip-b]::after{bottom:auto;top:calc(100% + 9px)}
[data-tip][data-tip-b]::before{bottom:auto;top:calc(100% + 3px);border-top-color:transparent;border-bottom-color:var(--ink,var(--ink))}
@media (hover:none){[data-tip]::after,[data-tip]::before{display:none}}
/* iOS Safari auto-zooms the page when a focused field's font-size is <16px. The
   design uses a 15px base (font:inherit on inputs), so on touch devices bump form
   controls to 16px — visually imperceptible, but it stops the jarring zoom-jump on
   every field focus. Desktop keeps the designed 15px. */
@media (hover:none){input,select,textarea,.gate input,.gate select{font-size:16px}}
.chipbtn.on{background:var(--grad);color:#fff;box-shadow:var(--hs-xs)}
.iconbtn{background:var(--indigo-lt);color:var(--ink)}
.mbar .mnav{background:var(--indigo-lt);color:var(--ink)}
.modal .x{background:#FFDDE6;color:#161513}
.back{display:inline-flex;align-items:center;gap:6px;background:var(--indigo-lt);color:var(--ink);border:1.5px solid var(--ink);border-radius:9px;padding:5px 11px;font-size:12px;box-shadow:2px 2px 0 rgba(var(--stamp),.9);transition:transform .12s,box-shadow .12s}
.back:hover{color:var(--ink);transform:translate(-1px,-1px);box-shadow:3px 3px 0 rgba(var(--stamp),.9)}
.fab{border:2.5px solid var(--ink);border-radius:16px;background:var(--grad-em);box-shadow:var(--hs);transition:transform .12s,box-shadow .12s}
.fab:hover{transform:translate(-2px,-2px);box-shadow:var(--hs-lg)}
.fab:active{transform:translate(2px,2px);box-shadow:1px 1px 0 rgba(var(--stamp),.9)}
/* badges = inked stamps */
.badge{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-weight:700;font-size:10px;letter-spacing:.06em;
  border:2px solid var(--ink);border-radius:8px;color:var(--ink)}
/* pastel "sticker" stamps: fixed light fills → keep dark ink text/border in both themes */
.b-ok,.b-vac,.b-up,.b-part,.b-over{color:#161513;border-color:#161513}
.b-ok{background:#CDEFD9}.b-vac{background:#F7E8DA}.b-up{background:#D8ECFF}.b-part{background:#D8ECFF}
.b-over{background:#FFDDE6;transform:rotate(-3deg)}
.b-mut{background:var(--surface);color:var(--muted);box-shadow:none}
.pill{border:2px solid var(--ink);border-radius:9px;background:var(--surface);color:var(--ink);box-shadow:none;font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10.5px}
/* forms */
input,select,textarea{border:2px solid var(--ink);border-radius:12px;background:var(--surface)}
input:focus,select:focus,textarea:focus{border-color:var(--indigo);box-shadow:3px 3px 0 color-mix(in srgb,var(--indigo) 45%,transparent)}
.seg{background:var(--surface);border:2px solid var(--ink);border-radius:13px;box-shadow:none;padding:4px}
.seg button{color:var(--ink);font-weight:900;border-radius:8px}
.seg button.on{background:var(--grad);color:#fff;box-shadow:none}
.sugg{border:2px solid var(--ink);box-shadow:var(--hs-xs);background:var(--grad-em)}
/* sheets, nav, toasts */
.modal{border:2.5px solid var(--ink);border-bottom:none;border-radius:22px 22px 0 0}
.modal .mh::before{background:var(--ink);opacity:.25}
.scrim{background:rgba(var(--stamp),.45)}
.botnav{background:var(--surface);border:2.5px solid var(--ink);border-radius:18px;box-shadow:var(--hs)}
.botnav a.on{background:var(--grad);color:#fff;box-shadow:none;border-radius:11px}
.botnav a.on .ic svg{color:#fff}
.botnav a .dot{border-color:var(--ink);background:var(--grad-rose)}
.toast{border:2px solid var(--ink);border-radius:12px;box-shadow:var(--hs-sm)}
.ring{box-shadow:none;border:2px solid var(--ink)}
.ring::before{inset:10px;border:2px solid var(--ink)}
.catbar .track{border:1.5px solid var(--ink);box-shadow:none;height:11px}
.catbar .fill{background:var(--grad)}
.txn,.rowitem,.catbar{border-top-color:color-mix(in srgb,var(--ink) 14%,transparent)}
.empty .ic{filter:grayscale(.1)}
h1.page{font-weight:900;letter-spacing:-.02em}
.psub{font-weight:600}
/* clickability affordances — anything actionable must look it */
[onclick]{cursor:pointer}
.card[onclick]{transition:transform .15s,box-shadow .15s}
.card[onclick]:hover{transform:translate(-2px,-2px);box-shadow:var(--hs)}
.rowitem.click{position:relative}
.rowitem.click::after{content:'\203A';font-size:20px;font-weight:900;color:var(--faint);margin-left:2px;flex:none;transition:color .12s,transform .12s}
.rowitem.click:hover{background:var(--indigo-lt)}
.rowitem.click:hover::after{color:var(--indigo);transform:translateX(2px)}
.rowitem div[onclick]:hover .un,.txn[onclick]:hover .td{text-decoration:underline 2.5px var(--indigo);text-underline-offset:3px}
.txn[onclick]:hover{background:var(--indigo-lt)}
.side .brand span[onclick],.topbar span[onclick]{text-decoration:underline dotted 1.5px var(--muted);text-underline-offset:3px}
.fieldnote[onclick],p[onclick],.mb a:not(.btn):not(.mtile),.gatecard a:not(.btn){text-decoration:underline 2px;text-underline-offset:3px;font-weight:800}
.mgrp{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;opacity:.55;margin:16px 0 8px}
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mtile{display:flex;align-items:center;gap:10px;padding:11px 12px;border:2px solid var(--ink);border-radius:12px;background:var(--surface);
  box-shadow:3px 3px 0 rgba(var(--stamp),.9);font-weight:850;font-size:13.5px;transition:transform .12s,box-shadow .12s,background .12s;animation:cardrise .4s cubic-bezier(.2,.8,.3,1) backwards}
.mtile:nth-child(2){animation-delay:.05s}.mtile:nth-child(3){animation-delay:.1s}.mtile:nth-child(4){animation-delay:.15s}
.mtile:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 rgba(var(--stamp),.9);background:var(--indigo-lt)}
.mtile .mi{width:34px;height:34px;border-radius:9px;border:2px solid var(--ink);display:grid;place-items:center;font-size:16px;flex:none}
.mtile .arr{margin-left:auto;font-weight:900;color:var(--faint);transition:.15s}
.mtile:hover .arr{color:var(--indigo);transform:translateX(3px)}
/* ===== THEMING — light paper is the default :root above. Dark is an inked
   repaint below. theme.js sets data-theme on <html>, resolving "system" via
   matchMedia, so the SPA never needs a prefers-color-scheme fallback. ===== */
:root[data-theme="dark"]{
  --ground:#141109; --surface:#211D12; --surface-2:#2A2416;
  --ink:#F3EEDF; --ink-soft:#D8D2C1; --muted:#A79F88; --faint:#7A7360;
  --line:#37311F; --line-soft:#2A2515;
  --indigo-lt:#242142; --em-lt:#123626; --rose-lt:#3A1622; --amber-lt:#332510;
  --clay:transparent; --stamp:0,0,0; --emstamp:#43C289;
  color-scheme:dark;
}
/* empty states = stamped slips */
.empty h3{display:inline-block;font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--emstamp);border:3px solid var(--emstamp);border-radius:10px;padding:7px 16px;transform:rotate(-4deg)}
/* report chart bars — landing palette, inked, grow in */
:root{--em:#1B9E6B;--rose:#E85D75}
div[title^="Collected "],div[title^="Spent "]{border:2px solid var(--ink);border-bottom:none;min-height:3px;transform-origin:bottom;animation:barup .6s cubic-bezier(.2,.8,.3,1) backwards}
div[title^="Spent "]{animation-delay:.1s}
@keyframes barup{from{transform:scaleY(0)}}
/* gate hanging tag */
.gate .hangwrap{position:relative;display:flex;flex-direction:column;align-items:center;margin:-34px auto 16px;
  transform-origin:top center;animation:swing 5.5s ease-in-out infinite}
.gate .hstring{display:block;width:2.5px;height:30px;background:var(--ink)}
.gate .hangtag{position:relative;display:flex;align-items:center;gap:11px;background:var(--surface);border:2.5px solid var(--ink);
  border-radius:14px;padding:12px 18px;box-shadow:5px 5px 0 rgba(var(--stamp),.92)}
.gate .hangtag::before{content:'';position:absolute;top:-5.5px;left:50%;transform:translateX(-50%);width:9px;height:9px;
  border-radius:50%;background:var(--ground);border:2.5px solid var(--ink)}
.gate .hangtag .wm1{font-size:24px}
@keyframes swing{0%,100%{transform:rotate(-2.4deg)}50%{transform:rotate(2deg)}}
@media (prefers-reduced-motion:reduce){.gate .hangwrap{animation:none;transform:rotate(-1.5deg)}}
/* wordmark chips: blue Rent + folded yellow Chitti; inked logo shadow */
.logo svg{filter:drop-shadow(2.5px 2.5px 0 rgba(var(--stamp),.92))}
/* One wordmark everywhere (Direction B): no filled tag — just ink "Rent" + indigo
   serif-italic "Chitti". The emblem SVG beside it carries the marigold. */
.wm1{display:inline-flex;align-items:center;position:relative;vertical-align:middle;flex:none;white-space:nowrap;color:#161513;
  line-height:1;font-weight:900;letter-spacing:-.02em}
.wm1 .dy{margin-left:.05em}
.wm1 .wmf{display:none}
/* brand plaque: mark + chips on one line, mono caption beneath */
.side .brand,.topbar>div:first-of-type{align-items:center}
.side .brand b,.topbar b{display:flex;align-items:center;line-height:1}
.side .brand span.wm1{font-size:20px;max-width:none;overflow:visible;color:#161513}
.topbar span.wm1{font-size:18px}
.gatecard h1 .wm1{font-size:30px}
.side .brand span[onclick],.topbar .accn{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:9px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--muted);margin-top:5px;text-decoration:none}
.side .brand span[onclick]:hover{text-decoration:underline dotted 1.5px var(--muted);text-underline-offset:3px}
/* desktop side rail */
@media (min-width:981px){
  .side{border-right:2.5px solid var(--ink);background:var(--surface)}
  .nav a{border:2px solid transparent;border-radius:12px;font-weight:850}
  .nav a:hover{background:var(--ground)}
  .nav a.on{background:var(--grad);color:#fff;border-color:var(--ink);box-shadow:var(--hs-xs)}
  .nav a .cnt{background:var(--grad-rose);border:1.5px solid var(--ink);box-shadow:none;color:var(--ink);font-family:ui-monospace,'SF Mono',Menlo,monospace}
  .who .pill{box-shadow:none}
}
/* semantic nav-icon colors — each chip carries its section's meaning:
   blue=overview, green=money-in, sun=property, lilac=people, rose=leave */
.nav a[href="#/dashboard"] .ic{background:#D8ECFF;color:#2743F0}
.nav a[href="#/rent"] .ic{background:#CDEFD9;color:#1B7A4B}
.nav a[href="#/properties"] .ic{background:#FFE9A8;color:#9A6A00}
.nav a[href="#/tenants"] .ic{background:#E6DEFF;color:#6C4BC7}
.nav a.on .ic{border-color:var(--ink)}
.botnav a[href="#/dashboard"] .ic{color:#2743F0}
.botnav a[href="#/rent"] .ic{color:#1B7A4B}
.botnav a[href="#/properties"] .ic{color:#9A6A00}
.botnav a[href="#/tenants"] .ic{color:#6C4BC7}
.who .out{color:#B3502B}
/* desktop utility strip — language/refresh/avatar have no home once the topbar hides */
.utilbar{display:none}
@media (min-width:981px){
  .utilbar{display:flex;gap:8px;justify-content:flex-end;align-items:center;padding:16px 26px 0}
  .utilbar .hsp{flex:1}
  .utilbar .htit{font-weight:850;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:34vw}
  .utilbar .htit small{color:var(--muted);font-weight:600;font-size:11.5px}
  .utilbar .avatar{width:38px;height:38px;cursor:pointer;font-size:13px}
  .utilbar+.content{padding-top:6px}
}

/* ---- second block (theme fixes) ---- */
/* gate view transitions: soft rise + brief brand glow instead of a hard swap */
#gateBody.rise{animation:gateRise .85s cubic-bezier(.16,.8,.26,1) both}
@keyframes gateRise{
  0%{opacity:.35;transform:translateY(10px)}
  55%{opacity:1;filter:drop-shadow(0 12px 30px rgba(255,216,77,.32))}
  100%{opacity:1;transform:none;filter:none}
}
@media (prefers-reduced-motion: reduce){#gateBody.rise{animation:none}}

/* ============================================================================
   AUTH POLISH — OTP cells, choice cards, section headers (paper/stamp skin).
   Brings the login/role/chooser screens up to the phone-first mockup while
   keeping the app's ink-border + hard-offset-shadow design language.
============================================================================ */
.auth-eyebrow{font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--indigo);margin:0 0 4px}
.auth-head{font-size:21px;font-weight:900;letter-spacing:-.4px;line-height:1.15;margin:0 0 5px;text-wrap:balance}
.auth-lede{font-size:13px;color:var(--muted);font-weight:600;line-height:1.5;margin:0 0 2px}
/* OTP: 6 cells with a transparent overlay input */
.otpwrap{position:relative;margin:16px 0 4px}
.otpcells{display:flex;gap:9px;justify-content:space-between}
.otpcell{flex:1;aspect-ratio:1/1.15;border:2.5px solid var(--ink);border-radius:12px;background:var(--surface);box-shadow:var(--hs-sm);display:grid;place-items:center;font-size:22px;font-weight:900;color:var(--ink);font-variant-numeric:tabular-nums;transition:transform .1s,box-shadow .1s}
.otpcell.on{background:var(--indigo-lt)}
.otpcell.cur{transform:translate(-1px,-1px);box-shadow:var(--hs)}
.otpover{position:absolute;inset:0;width:100%;height:100%;opacity:0;border:0;background:transparent;cursor:pointer;font-size:16px}
/* Choice cards — role step & workspace chooser */
.choice{display:flex;align-items:center;gap:13px;text-align:left;width:100%;cursor:pointer;padding:15px;border-radius:16px;border:2.5px solid var(--ink);background:var(--surface);box-shadow:var(--hs);transition:transform .12s,box-shadow .12s;font:inherit;color:var(--ink)}
.choice:hover{transform:translate(-2px,-2px);box-shadow:var(--hs-lg)}
.choice:active{transform:translate(2px,2px);box-shadow:var(--hs-xs)}
.choice+.choice{margin-top:11px}
.choice .cic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:22px;flex:none;border:2px solid var(--ink)}
.choice.owner .cic{background:var(--sun)}
.choice.tenant .cic{background:var(--em-lt)}
.choice .ctx b{display:block;font-size:15px;font-weight:900;letter-spacing:-.2px}
.choice .ctx span{display:block;font-size:12px;color:var(--muted);font-weight:600;margin-top:2px;line-height:1.35}
.choice .cgo{margin-left:auto;color:var(--faint);font-size:20px;font-weight:900;flex:none}
/* Gate wordmark — stacked tag + "RentChitti" with a hand-drawn yellow highlight */
.gate .brand{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;margin:-4px 0 16px}
.gate .brand .tag{width:52px;height:52px;filter:drop-shadow(3px 3px 0 rgba(var(--stamp),.9))}
.gate .wordmark{font-size:29px;font-weight:900;letter-spacing:-.9px;margin-top:9px;color:var(--ink)}
.gate .wordmark em{font-family:'Iowan Old Style',Palatino,Georgia,serif;font-style:italic;font-weight:700;color:var(--indigo);margin-left:.03em}
.gate .brand .sub{font-size:13.5px;color:var(--ink);opacity:.72;max-width:250px;margin:5px auto 0;line-height:1.45;text-wrap:balance}
.gate .brand .sub em{font-style:italic}
/* Success "moment" modal — a stamped seal over the freshly-loaded dashboard */
.authdone{text-align:center;padding-top:6px}
.authseal{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;margin:2px auto 16px;font-size:34px;border:2.5px solid var(--ink);box-shadow:var(--hs)}
.authseal.owner{background:var(--sun)}
.authseal.tenant{background:var(--em-lt)}
.authdone-h{font-size:20px;font-weight:900;letter-spacing:-.4px;margin:0 0 4px}
.authdone-sub{font-size:13px;color:var(--muted);font-weight:600;margin:0}
.authdone-sub b{color:var(--ink)}
.authdone-id{font-size:12.5px;color:var(--muted);margin:6px 0 0;font-variant-numeric:tabular-nums}

/* ============================================================================
   PAPER-CHITTI polish — rubber-stamp status badges (app-wide) + tenant cards.
   Turns the rounded gradient pills into inked mono "stamps", and gives the
   Tenants list the premium per-tenant chitti-card treatment.
============================================================================ */
.badge{font-family:ui-monospace,'SF Mono',Menlo,monospace;font-weight:800;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  border:1.6px solid var(--ink);border-radius:4px;padding:3px 7px;color:var(--ink);box-shadow:1.5px 1.5px 0 rgba(var(--stamp),.85);white-space:nowrap;gap:4px}
.b-ok{background:#CFF5E6;color:var(--em-dk)}
.b-vac{background:#FFE4A6;color:#8A5D00}
.b-over{background:#FFD7DF;color:var(--rose-dk)}
.b-up{background:var(--indigo-lt);color:var(--indigo-dk)}
.b-part{background:#D6EBFF;color:#1D5FB8}
.b-mut{background:var(--surface-2);color:var(--muted);box-shadow:1.5px 1.5px 0 rgba(var(--stamp),.35)}
/* all letter avatars = sun-yellow chitti slips (ink initial + ink border + hard shadow) */
.avatar{background:var(--sun);color:var(--ink);border:2px solid var(--ink);box-shadow:2px 2px 0 rgba(var(--stamp),.85)}
/* tenant chitti card */
.tcard{background:var(--surface);border:2px solid var(--ink);border-radius:10px;box-shadow:var(--hs-sm),inset 6px 0 0 var(--ac,var(--indigo));
  padding:13px 14px 14px 18px;margin-bottom:14px;animation:cardrise .5s cubic-bezier(.18,.9,.3,1.12) backwards}
.tcard .th{display:flex;align-items:flex-start;gap:11px}
.tcard .th .avatar{width:44px;height:44px;border:2px solid var(--ink);border-radius:9px;box-shadow:2px 2px 0 rgba(var(--stamp),.85);font-size:15px;
  background:var(--sun);color:var(--ink)}
.tcard .tnm{font-weight:850;font-size:16px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;line-height:1.14}
.tcard .tmeta{font-size:12px;color:var(--muted);font-weight:600;margin-top:3px}
.tcard .tstamp{margin-left:auto;flex:none;display:flex;flex-direction:column;gap:5px;align-items:flex-end}
.tcard .trule{border:none;border-top:1.6px dashed #cdc7b8;margin:12px -2px}
.tcard .tacts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ibgrp{display:flex;gap:7px}
.tcard .tprim{margin-left:auto;display:flex;gap:7px;flex-wrap:wrap}
.ib{width:38px;height:38px;border:2px solid var(--ink);border-radius:7px;background:var(--surface);display:grid;place-items:center;
  font-size:16px;flex:none;box-shadow:2px 2px 0 rgba(var(--stamp),.85);color:var(--ink);transition:transform .1s,box-shadow .1s}
.ib svg{display:block;width:1.05em;height:1.05em}
.ib:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 rgba(var(--stamp),.85)}
.ib:active{transform:translate(1px,1px);box-shadow:1px 1px 0 rgba(var(--stamp),.85)}
/* per-tenant coloured left accent stripe (colour cycles by --ac) + coloured icon actions */
.ib.i1{background:#2743F0;color:#fff}.ib.i2{background:#1B9E6B;color:#fff}.ib.i3{background:#E58A00;color:#fff}
/* plain section header (no card) so cards sit directly on the page & tabs aren't clipped */
.secthead{font-weight:900;font-size:15.5px;letter-spacing:-.01em;margin:4px 2px 13px;display:flex;align-items:center;gap:9px}
.secthead .secount{font:800 10.5px ui-monospace,'SF Mono',Menlo,monospace;background:var(--surface);border:1.6px solid var(--ink);
  border-radius:6px;padding:1px 8px;box-shadow:2px 2px 0 rgba(var(--stamp),.85);color:var(--ink)}
/* past-tenant archived card — muted paper, neutral grey stripe, compact, no actions */
.ptcard{background:var(--surface-2);border:2px solid var(--ink);border-radius:10px;box-shadow:3px 3px 0 rgba(var(--stamp),.5),inset 6px 0 0 #B4AE9E;
  padding:11px 14px 11px 18px;margin-bottom:11px;display:flex;align-items:center;gap:12px;transition:transform .12s,box-shadow .12s}
.ptcard.click{cursor:pointer}
.ptcard.click:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 rgba(var(--stamp),.5),inset 6px 0 0 #B4AE9E}
.ptcard .avatar{width:40px;height:40px;background:#E7E3D6;color:#8A8577;border:2px solid var(--ink);border-radius:9px;box-shadow:2px 2px 0 rgba(var(--stamp),.55);font-size:14px}
.ptcard .pnm{font-weight:850;font-size:15px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;line-height:1.12}
.ptcard .pmeta{font-size:11.5px;color:var(--muted);font-weight:600;margin-top:2px}
.ptcard .pr{margin-left:auto;text-align:right;flex:none}
.ptcard .pr .a{font-weight:850;font-size:13px}
.ptcard .pr .l{font:700 9px ui-monospace,'SF Mono',Menlo,monospace;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-top:1px}
/* top-bar quick-add: prominent green chitti button (replaces the removed FAB) */
.topbar .addbtn{background:var(--grad-em);color:#fff;border:2px solid var(--ink);box-shadow:2px 2px 0 rgba(var(--stamp),.85);font-size:23px;font-weight:600;transition:transform .1s,box-shadow .1s}
.topbar .addbtn:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 rgba(var(--stamp),.85);color:#fff}
.topbar .addbtn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 rgba(var(--stamp),.85)}
/* Properties list — chitti card: per-property accent stripe, yellow icon, occupancy stamp */
.prop{box-shadow:var(--hs-sm),inset 6px 0 0 var(--ac,var(--indigo));padding-left:20px}
.prop .top{align-items:center}
.prop .picon{background:var(--sun);color:var(--ink);border:2px solid var(--ink);box-shadow:2px 2px 0 rgba(var(--stamp),.85);border-radius:11px;width:46px;height:46px}
.prop .pstamp{margin-left:auto;flex:none}
/* Home — this-month money card + slim attention nudge */
.mhero .m-head{font-size:26px;font-weight:900;letter-spacing:-.02em;line-height:1.05;color:var(--ink)}
.mhero .m-amt{font-size:13.5px;color:var(--muted);font-weight:700;margin-top:6px}
.mhero .m-amt b{color:var(--ink);font-weight:900}
.pbar{height:15px;border-radius:99px;background:var(--surface-2);border:2px solid var(--ink);overflow:hidden;margin:13px 0 12px;box-shadow:2px 2px 0 rgba(var(--stamp),.35)}
.pbar .pfill{height:100%;background:var(--grad-em);border-right:2px solid var(--ink);min-width:3px;transition:width .5s cubic-bezier(.2,.8,.3,1)}
.mchips{display:flex;gap:8px;flex-wrap:wrap}
.nudge{display:flex;align-items:center;gap:12px;padding:13px 15px;background:#FFE4E9;border:2px solid var(--ink);box-shadow:var(--hs-sm);border-radius:14px;margin-bottom:16px;color:var(--ink);cursor:pointer;transition:transform .12s,box-shadow .12s}
.nudge:hover{transform:translate(-1px,-1px);box-shadow:var(--hs)}
.nudge.amber{background:#FFF1D6}
.nudge.ok{background:var(--em-lt);cursor:default}
.nudge .ni{width:38px;height:38px;border:2px solid var(--ink);border-radius:10px;background:var(--sun);color:var(--ink);display:grid;place-items:center;font-size:18px;flex:none;box-shadow:2px 2px 0 rgba(var(--stamp),.85)}
.nudge .ni svg{width:1.05em;height:1.05em;display:block}
.nudge .nt{font-weight:850;font-size:14.5px;line-height:1.15}
.nudge .ns{font-size:12px;color:var(--muted);font-weight:600;margin-top:2px}
.nudge .ng{margin-left:auto;font-weight:900;font-size:20px;color:var(--rose-dk)}
/* Rent tracker — invoice cards with a status-coloured accent stripe */
.rcard{background:var(--surface);border:2px solid var(--ink);border-radius:10px;box-shadow:var(--hs-sm),inset 6px 0 0 var(--ac,var(--muted));padding:11px 14px 11px 18px;margin-bottom:11px;display:flex;align-items:center;gap:12px;transition:transform .12s,box-shadow .12s}
.rcard.click{cursor:pointer}
.rcard.click:hover{transform:translate(-1px,-1px);box-shadow:var(--hs),inset 6px 0 0 var(--ac,var(--muted))}
.rcard .rtile{width:40px;height:40px;border:2px solid var(--ink);border-radius:9px;background:var(--sun);color:var(--ink);display:grid;place-items:center;font-weight:850;font-size:14px;flex:none;box-shadow:2px 2px 0 rgba(var(--stamp),.85)}
.rcard .pnm{font-weight:850;font-size:15px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;line-height:1.12}
.rcard .pmeta{font-size:11.5px;color:var(--muted);font-weight:600;margin-top:2px}
.rcard .pr{margin-left:auto;text-align:right;flex:none}
.rcard .pr .a{font-weight:880;font-size:14px}
.rcard .pr .l{font:700 9.5px ui-monospace,'SF Mono',Menlo,monospace;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-top:1px}
/* Rent-tracker row (Option B): full-flat tile + Due/Paid/Balance ledger figures
   + ⓘ tap-to-toggle rent/maintenance split popover. Accent stripe is status-driven. */
.rcard .rtile.flat{width:auto;min-width:46px;max-width:90px;padding:0 8px;font-family:ui-monospace,Menlo,monospace;font-size:12.5px;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rentrow{align-items:stretch}
.rentrow .rtwho{flex:1;min-width:0;align-self:center}
.rentrow .rstamp{margin-top:4px;display:flex;align-items:center;gap:7px}
.rentrow .rmode{font:700 10px ui-monospace,Menlo,monospace;color:var(--em-dk);letter-spacing:.02em}
.rentrow .figs{display:flex;flex:none;align-self:center;text-align:right}
.rentrow .fig{padding:0 9px;border-left:1.5px solid var(--line-soft)}
.rentrow .fig:first-child{border-left:0}
.rentrow .fig:last-child{padding-right:0}
.rentrow .fig .fl{font:700 9px ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);display:inline-flex;align-items:center;gap:3px}
.rentrow .fig .fv{font-weight:850;font-size:14px;margin-top:3px}
.rentrow .fig .fv.g{color:var(--em-dk)}.rentrow .fig .fv.r{color:var(--rose-dk)}.rentrow .fig .fv.m{color:var(--muted)}
.rentrow .info{width:15px;height:15px;flex:none;border:1.5px solid var(--ink);border-radius:50%;background:var(--surface);color:var(--ink);font:italic 800 9px Georgia,serif;display:inline-grid;place-items:center;cursor:pointer;padding:0;position:relative;line-height:1}
.rentrow .info .tip{position:absolute;bottom:calc(100% + 9px);right:-9px;width:max-content;text-align:left;background:var(--surface);border:2px solid var(--ink);border-radius:9px;padding:8px 11px;box-shadow:3px 3px 0 rgba(var(--stamp),.22);opacity:0;visibility:hidden;transform:translateY(3px);transition:.13s;z-index:30;pointer-events:none}
.rentrow .info .tip::after{content:"";position:absolute;top:100%;right:12px;border:6px solid transparent;border-top-color:var(--ink)}
.rentrow .info.open .tip{opacity:1;visibility:visible;transform:translateY(0)}
.rentrow .tip .tl{display:flex;justify-content:space-between;gap:20px;font:600 11.5px/1.55 -apple-system,system-ui,sans-serif;color:var(--ink-soft);white-space:nowrap}
.rentrow .tip .tl .tn{font-weight:800;color:var(--ink)}
.rentrow .tip .tl.sum{border-top:1.5px solid var(--line);margin-top:3px;padding-top:3px;color:var(--ink)}
/* Linked expense ledger under a rent row (owner side): rent on top, its expenses
   + net below a perforation; collapses to a summary, expands to an itemised ledger. */
.rentrow.blink{flex-direction:column;align-items:stretch;padding:0;gap:0}
.rentrow.blink .top{display:flex;gap:12px;align-items:center;padding:11px 14px 11px 18px}
.rentrow .linked{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:2px dashed var(--line);margin:0 14px 0 18px;padding:9px 0 11px;cursor:pointer}
.rentrow .exp{font-size:12px;font-weight:700;color:var(--ink-soft);min-width:0}
.rentrow .expsum{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rentrow .expsum b{font-weight:850;color:var(--ink)}
.rentrow .expsum .open{font:800 9px ui-monospace,Menlo,monospace;color:var(--indigo);border:1.5px solid var(--indigo);border-radius:6px;padding:2px 7px;text-transform:uppercase;letter-spacing:.04em}
.rentrow .netc{text-align:right;flex:none}
.rentrow .netc .l{font:700 9px ui-monospace,Menlo,monospace;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.rentrow .netc .v{font-weight:880;font-size:15px;margin-top:1px}
.rentrow .netc .v.g{color:var(--em-dk)} .rentrow .netc .v.r{color:var(--rose-dk)}
.rentrow .ledgerwrap{padding:2px 14px 12px 18px;cursor:default}
.rentrow .addbar{border-top:2px dashed var(--line);margin:0 14px 0 18px;padding:8px 0 10px;cursor:default}
.rentrow .ledgeradd{margin-top:9px;padding-top:8px;border-top:1px dashed var(--line)}
.rentrow .addexp{font:700 12px -apple-system,system-ui,sans-serif;color:var(--indigo);background:none;border:0;border-bottom:1.5px dashed var(--indigo);cursor:pointer;padding:0 0 1px}
/* contextual action bar (Record / Remind / Receipt / ＋ Expense) */
.rentrow .actbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border-top:2px dashed var(--line);margin:0 14px 0 18px;padding:10px 0 12px}
.rentrow .ledgerwrap + .actbar,.rentrow .linked + .actbar{border-top:1.5px solid var(--line)}
.rentrow .act{font:800 11.5px -apple-system,system-ui,sans-serif;border:2px solid var(--ink);border-radius:9px;padding:6px 11px;cursor:pointer;box-shadow:2px 2px 0 rgba(var(--stamp),.75);display:inline-flex;align-items:center;gap:5px;background:var(--surface);color:var(--ink);white-space:nowrap}
.rentrow .act.rec{background:var(--em-dk);color:#fff}
.rentrow .act.rcpt{background:var(--sun);color:var(--ink)}
.rentrow .act.ghost{background:none;border-style:dashed;box-shadow:none;color:var(--indigo);border-color:var(--indigo)}
/* receipts chooser (a month paid in multiple installments) */
.rm-sum{padding:9px 2px 4px;font-size:12px;color:var(--ink-soft);font-weight:700}
.rm-row{display:flex;align-items:center;gap:11px;padding:11px 4px;border-top:1px solid var(--line-soft);cursor:pointer}
.rm-row:first-of-type{border-top:1.5px solid var(--line)}
.rm-row .rt{width:36px;height:36px;flex:none;border:2px solid var(--ink);border-radius:9px;background:var(--sun);display:grid;place-items:center;box-shadow:2px 2px 0 rgba(var(--stamp),.85);font-size:15px}
.rm-mid{flex:1;min-width:0}.rm-mid b{font-weight:850;font-size:15px}.rm-mid small{display:block;color:var(--muted);font-size:11px;margin-top:1px}
.rm-go{font:800 10px ui-monospace,Menlo,monospace;color:var(--indigo);border:1.5px solid var(--indigo);border-radius:6px;padding:3px 8px;text-transform:uppercase;letter-spacing:.03em;flex:none}
.rm-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 4px 2px;margin-top:6px;border-top:1.5px dashed var(--line);font-weight:800;font-size:12.5px;color:var(--indigo);cursor:pointer}
/* record-rent modal: itemised balance hero + amount/mode chips + receipt-tile history */
.rec-hero{background:var(--surface-2);border:2px solid var(--ink);border-radius:13px;padding:13px 15px}
.rec-hero .lbl{font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.rec-hero .amt{font-weight:880;font-size:28px;letter-spacing:-.02em;margin-top:2px}
.rec-hero .brk{margin-top:9px;padding-top:9px;border-top:1.5px dashed var(--line);font-size:11.5px;color:var(--ink-soft);display:flex;flex-wrap:wrap;gap:4px 12px}
.rec-hero .brk b{color:var(--ink)}
.rchips{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}
.rchip{font:800 11px -apple-system,system-ui,sans-serif;border:2px solid var(--ink);border-radius:8px;padding:6px 11px;background:var(--surface);cursor:pointer;box-shadow:2px 2px 0 rgba(var(--stamp),.7);color:var(--ink)}
.rchip.on{background:var(--sun)}
.rhist{margin-top:16px}
.rhist .hh{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
/* who / which flat identity row in the record + confirm modals */
.payid{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.payid .rtile{width:auto;min-width:46px;height:42px;padding:0 9px;border:2px solid var(--ink);border-radius:9px;background:var(--sun);color:var(--ink);display:grid;place-items:center;font:850 13px ui-monospace,Menlo,monospace;box-shadow:2px 2px 0 rgba(var(--stamp),.85);white-space:nowrap;flex:none}
.payid-nm{font-weight:850;font-size:16px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.payid-mt{color:var(--muted);font-size:12px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adjcard{background:var(--surface);border:2px dashed var(--ink);border-radius:12px;padding:12px 14px;margin-bottom:4px}
.overstrip{margin-top:14px;border:2px solid var(--ink);border-left-width:6px;border-left-color:#E58A00;border-radius:12px;background:#FBEBD0;padding:12px 14px}
.overstrip .h{font-weight:850;font-size:14px;color:var(--amber-dk);display:flex;align-items:center;gap:7px}
.overstrip .n{font-size:11.5px;color:var(--ink-soft);margin-top:4px}
.overstrip .acts{display:flex;gap:8px;margin-top:11px;flex-wrap:wrap}
.ldgr .r{display:flex;justify-content:space-between;gap:16px;font-size:12.5px;padding:3px 0;color:var(--ink-soft)}
.ldgr .r .v{font-weight:800;font-variant-numeric:tabular-nums}
.ldgr .r.in .v{color:var(--em-dk)} .ldgr .r.out .v{color:var(--rose-dk)} .ldgr .r.ten .v{color:var(--indigo)}
.ldgr .r.net{border-top:1.5px solid var(--line);margin-top:3px;padding-top:5px;font-weight:850;color:var(--ink);font-size:13.5px}
.ldgr .r.sub{font-weight:850;color:var(--ink)} .ldgr .r.sub.ten .v{color:var(--indigo)}
.ldgr .sec{font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-top:9px;padding-top:6px;border-top:1px dashed var(--line)}
/* month net strip on the rent tracker */
.moneynet{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--surface);border:2px solid var(--ink);border-radius:12px;box-shadow:var(--hs-sm);padding:10px 15px;margin-bottom:16px;font-size:12.5px;font-weight:700;color:var(--ink-soft)}
.moneynet b{font-size:15px;letter-spacing:-.01em;margin-left:6px}
/* primary stays on the icon-row, pushed right (matches the approved mock); it only
   drops to its own line when it genuinely can't fit, and stays right-aligned there. */

/* ---------- profile photos + tenant page (#/tenant/<id>) ---------- */
.avatar.photo{overflow:hidden;background:var(--sun)}
.avatar.photo img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.b-sun{background:var(--sun);color:#161513;border-color:#161513}
/* ============================================================================
   Tenant details — AURORA GLASS (tg- prefixed). Live redesign; supersedes td-.
============================================================================ */
.tpage{--ink:#161513;--paper:#EDEBE5;--cream:#F7E8DA;--white:#FFFDF8;--soft:#4a463f;--mut:#8b8578;--line:#ded7ca;
  --sun:#FFD84D;--sundp:#ffcf2f;--blue:#2743F0;--green:#1B9E6B;--rose:#E85D75;--amber:#E58A00;--roseb:#b3123a;
  --mono:ui-monospace,"SF Mono",Menlo,monospace;--serif:"Iowan Old Style","Palatino Linotype",Georgia,serif;
  max-width:460px;margin:0 auto;width:100%;position:relative;isolation:isolate;padding-bottom:20px}
@media (min-width:981px){.tpage{max-width:460px;margin:0 auto;columns:auto}}
.tpage .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
/* aurora backdrop */
.tg-aur{position:absolute;inset:-30px -14px;z-index:-1;overflow:hidden;pointer-events:none;border-radius:26px}
.tg-blob{position:absolute;border-radius:50%;filter:blur(42px);opacity:.5;mix-blend-mode:multiply;animation:tgDrift 18s ease-in-out infinite}
@keyframes tgDrift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(28px,-22px) scale(1.12)}66%{transform:translate(-18px,24px) scale(.95)}}
.tg-b1{width:300px;height:300px;background:var(--sun);left:-70px;top:0}
.tg-b2{width:280px;height:280px;background:#8fb4ff;right:-80px;top:250px;animation-delay:-4s}
.tg-b3{width:260px;height:260px;background:#8fe6c0;left:-40px;top:560px;animation-delay:-8s}
.tg-b4{width:240px;height:240px;background:#ffb3c1;right:-50px;top:860px;animation-delay:-12s}
.tg-b5{width:280px;height:280px;background:#c9a0ff;left:-60px;top:1160px;animation-delay:-6s}
.tg-b6{width:250px;height:250px;background:var(--sun);right:-70px;top:1480px;animation-delay:-10s}
.tg-b7{width:260px;height:260px;background:#8fe6c0;left:-30px;top:1800px;animation-delay:-2s}
.tg-b8{width:250px;height:250px;background:#ffb3c1;right:-50px;top:auto;bottom:-30px;animation-delay:-14s}

/* topbar */
.tg-tb{display:flex;align-items:center;gap:10px;margin:2px 0 15px}
.tg-tbb{width:38px;height:38px;border-radius:13px;background:rgba(255,253,248,.58);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1.5px solid rgba(255,255,255,.75);box-shadow:0 8px 16px -8px rgba(22,21,19,.35);display:grid;place-items:center;font-size:18px;font-weight:900;flex:none;cursor:pointer;color:var(--ink);text-decoration:none}
.tg-tbm{flex:1;text-align:center;line-height:1.1}
.tg-tbs{font:800 9px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--soft)}
.tg-tbp{font-size:13px;font-weight:900;margin-top:2px}

/* glass base + tints */
.tg-glass{background:rgba(255,253,248,.58);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border:1.5px solid rgba(255,255,255,.7);border-radius:22px;box-shadow:0 18px 40px -18px rgba(22,21,19,.35),inset 0 1px 0 rgba(255,255,255,.6);padding:16px;margin-bottom:13px}
.tg-warm{background:linear-gradient(160deg,rgba(255,244,214,.58),rgba(255,253,248,.5))}
.tg-rose{background:linear-gradient(160deg,rgba(253,234,238,.66),rgba(255,253,248,.5));border-left:5px solid rgba(232,93,117,.8)}
.tg-green{background:linear-gradient(160deg,rgba(233,247,239,.68),rgba(255,253,248,.5));border-left:5px solid rgba(27,158,107,.8)}
.tg-sun{background:linear-gradient(160deg,rgba(255,243,201,.72),rgba(255,253,248,.5));border-left:5px solid rgba(230,138,0,.85)}
.tg-blue{background:linear-gradient(160deg,rgba(228,234,255,.72),rgba(255,253,248,.5));border-left:5px solid rgba(39,67,240,.65)}
.tg-plum{background:linear-gradient(160deg,rgba(244,231,249,.72),rgba(255,253,248,.5));border-left:5px solid rgba(138,79,179,.65)}
.tg-rose .tg-sect{color:var(--roseb)}.tg-green .tg-sect{color:#0c6b45}.tg-sun .tg-sect{color:#8a5300}.tg-blue .tg-sect{color:var(--blue)}.tg-plum .tg-sect{color:#7a3fa0}

/* zone pills */
.tg-zn{display:inline-flex;align-items:center;gap:7px;font:800 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#fff;border-radius:20px;padding:5px 12px;margin:20px 0 11px;box-shadow:0 8px 16px -8px rgba(22,21,19,.45)}
.tg-zn::before{content:"";width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.92)}
.z-stand{background:linear-gradient(135deg,#14b8a6,#0e9488)}
.z-money{background:linear-gradient(135deg,var(--rose),#ff8095)}
.z-quick{background:linear-gradient(135deg,var(--amber),#ffb020);color:#3a2600}.z-quick::before{background:#3a2600}
.z-ledger{background:linear-gradient(135deg,var(--green),#37c98d)}
.z-paper{background:linear-gradient(135deg,var(--blue),#5b6bff)}
.z-access{background:linear-gradient(135deg,#8a4fb3,#a86fd0)}

/* hero */
.tg-hero{display:flex;align-items:center;gap:14px}
.tg-av{position:relative;width:60px;height:60px;border-radius:18px;background:linear-gradient(150deg,var(--sun),#ffcf2f);border:1.5px solid rgba(255,255,255,.8);display:grid;place-items:center;font-weight:900;font-size:22px;box-shadow:0 8px 18px -6px rgba(22,21,19,.4);flex:none;overflow:visible;cursor:pointer;color:var(--ink);animation:tgBob 4.5s ease-in-out infinite}
@keyframes tgBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.tg-av img{width:100%;height:100%;object-fit:cover;border-radius:16px}
.tg-av .vf{position:absolute;bottom:-5px;right:-5px;width:23px;height:23px;border-radius:50%;background:var(--green);border:2.5px solid var(--white);display:grid;place-items:center;font-size:11px;color:#fff;transform:scale(0)}
.tg-av .cam{position:absolute;bottom:-5px;right:-5px;width:23px;height:23px;border-radius:50%;background:var(--white);border:2px solid var(--ink);display:grid;place-items:center;font-size:10px}
.shown .tg-av .vf{animation:tgPop .55s cubic-bezier(.3,1.5,.5,1) .45s forwards}
@keyframes tgPop{to{transform:scale(1)}}
.tg-nm{font-size:23px;font-weight:900;letter-spacing:-.025em;line-height:1.05}
.tg-meta{font-size:11.5px;color:var(--soft);font-weight:700;margin-top:3px}
.tg-chips{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.tg-chip{font:800 8px var(--mono);letter-spacing:.04em;text-transform:uppercase;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.85);border-radius:20px;padding:3px 9px;box-shadow:0 2px 6px -2px rgba(22,21,19,.25);opacity:0;transform:translateY(6px)}
.tg-chip.warn{background:rgba(255,216,77,.6)}
.shown .tg-chip{opacity:1;transform:none;transition:all .45s ease .3s}.shown .tg-chip:nth-child(2){transition-delay:.42s}.shown .tg-chip:nth-child(3){transition-delay:.54s}

/* contacts */
.tg-contacts{display:flex;gap:9px;margin-bottom:13px}
.tg-cb{flex:1;display:flex;align-items:center;justify-content:center;gap:7px;background:rgba(255,253,248,.56);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1.5px solid rgba(255,255,255,.7);border-radius:15px;padding:11px;font-size:12.5px;font-weight:850;box-shadow:0 8px 18px -10px rgba(22,21,19,.3);cursor:pointer;color:var(--ink);text-decoration:none;opacity:0;transform:translateY(12px)}
.tg-contacts.shown .tg-cb{opacity:1;transform:none;transition:opacity .5s cubic-bezier(.2,.7,.2,1),transform .5s cubic-bezier(.2,.7,.2,1)}
.tg-contacts.shown .tg-cb:nth-child(2){transition-delay:.09s}.tg-contacts.shown .tg-cb:nth-child(3){transition-delay:.18s}
.tg-cb .ic{width:24px;height:24px;border-radius:50%;border:2px solid var(--ink);display:grid;place-items:center;font-size:12px}
.tg-cb.call{background:linear-gradient(160deg,#e9edff,#f5f7ff)}.tg-cb.call .ic{background:#c6d0ff}
.tg-cb.mail{background:linear-gradient(160deg,#fbeede,#fff8f0)}.tg-cb.mail .ic{background:var(--cream)}
.tg-cb.wa{background:rgba(37,211,102,.85);color:#06341c;border-color:rgba(255,255,255,.5);position:relative;overflow:hidden}.tg-cb.wa .ic{background:#fff;border-color:#06341c}

/* trust tiles */
.tg-trust{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:13px}
.tg-ti{display:flex;align-items:center;gap:9px;background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.7);border-radius:14px;padding:8px 10px;box-shadow:0 8px 18px -12px rgba(22,21,19,.3)}
.tg-ti.lease{background:linear-gradient(160deg,rgba(228,234,255,.65),rgba(255,253,248,.5))}
.tg-ti.agr{background:linear-gradient(160deg,rgba(255,243,201,.68),rgba(255,253,248,.5))}
.tg-ti.kyc{background:linear-gradient(160deg,rgba(233,247,239,.65),rgba(255,253,248,.5))}
.tg-ti.portal{background:linear-gradient(160deg,rgba(244,231,249,.68),rgba(255,253,248,.5))}
.tg-ti .ic{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:13px;border:1px solid rgba(255,255,255,.8);transition:transform .3s}
.tg-ti:hover .ic{transform:rotate(-7deg) scale(1.1)}
.tg-ti.lease .ic{background:rgba(143,180,255,.5)}.tg-ti.agr .ic{background:rgba(255,216,77,.6)}.tg-ti.kyc .ic{background:rgba(143,230,192,.5)}.tg-ti.portal .ic{background:rgba(201,160,255,.45)}
.tg-ti .lb{flex:1;min-width:0}.tg-ti .lb b{font-size:12.5px;font-weight:850;display:block;line-height:1.1}.tg-ti .lb small{font-size:9.5px;color:var(--soft);font-weight:700}
.tg-ti .ck{margin-left:auto;width:19px;height:19px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:10px;font-weight:900;transform:scale(0)}
.tg-ti .ck.mut{background:rgba(22,21,19,.25);color:var(--ink)}
.tg-trust.shown .tg-ti .ck{transform:scale(1);transition:transform .55s cubic-bezier(.3,1.5,.5,1)}
.tg-trust.shown .tg-ti:nth-child(1) .ck{transition-delay:.15s}.tg-trust.shown .tg-ti:nth-child(2) .ck{transition-delay:.28s}.tg-trust.shown .tg-ti:nth-child(3) .ck{transition-delay:.41s}.tg-trust.shown .tg-ti:nth-child(4) .ck{transition-delay:.54s}

/* section header */
.tg-sect{font:800 10px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--soft);display:flex;align-items:center;gap:8px;margin:0 0 12px}
.tg-sect .r{margin-left:auto;color:var(--blue);font-size:11px;font-weight:800;cursor:pointer;text-transform:none;letter-spacing:0}

/* money + jar */
.tg-money{overflow:hidden}
.tg-mrow{display:flex;align-items:center;gap:16px}
.tg-mleft{flex:1;min-width:0}
.tg-olbl{font:800 9px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--roseb)}
.tg-money.ok .tg-olbl{color:#0c6b45}
.tg-obig{font-size:40px;font-weight:900;letter-spacing:-.04em;line-height:.92;color:var(--roseb);margin-top:5px}
.tg-money.ok .tg-obig{color:var(--green)}
.tg-osub{font-size:11px;color:var(--soft);font-weight:700;margin-top:6px}
.tg-jar{position:relative;width:104px;height:126px;flex:none;border-radius:15px 15px 26px 26px;border:2px solid rgba(255,255,255,.85);overflow:hidden;background:rgba(255,255,255,.28);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:inset 0 0 22px rgba(255,255,255,.5),inset 0 -6px 14px rgba(27,158,107,.12),0 12px 26px -12px rgba(22,21,19,.4)}
.tg-jar .lid{position:absolute;top:0;left:0;right:0;height:12px;background:rgba(255,255,255,.55);border-bottom:1.5px solid rgba(255,255,255,.8);z-index:4}
.tg-jar .fill{position:absolute;left:0;right:0;bottom:0;height:0;background:linear-gradient(180deg,rgba(55,201,141,.92),rgba(27,158,107,.96));transition:height 1.5s cubic-bezier(.3,.8,.3,1)}
.tg-jar .wave{position:absolute;top:-9px;left:-40%;width:180%;height:18px;background:radial-gradient(circle at 9px -2px,transparent 8.5px,rgba(55,201,141,.92) 9px) repeat-x;background-size:18px 18px;animation:tgWv 2.4s linear infinite}
.tg-jar .wave.w2{top:-7px;opacity:.5;animation-duration:3.4s;animation-direction:reverse}
@keyframes tgWv{to{transform:translateX(18px)}}
.tg-jar .glint{position:absolute;top:8px;left:10px;width:14px;height:64px;border-radius:10px;background:linear-gradient(180deg,rgba(255,255,255,.75),transparent);z-index:5}
.tg-jar .bub{position:absolute;bottom:4px;border-radius:50%;background:rgba(255,255,255,.6);z-index:2;opacity:0;animation:tgBubble linear infinite}
@keyframes tgBubble{0%{transform:translateY(0) scale(.7);opacity:0}18%{opacity:.75}100%{transform:translateY(-92px) scale(1);opacity:0}}
.tg-jar .pct{position:absolute;inset:0;display:grid;place-items:center;text-align:center;z-index:6;line-height:1}
.tg-jar .pct b{font-size:27px;font-weight:900;text-shadow:0 1px 2px rgba(255,255,255,.6)}
.tg-jar .pct i{font:800 6.5px var(--mono);font-style:normal;letter-spacing:.12em;color:var(--soft);display:block;margin-top:2px}
.tg-mcap{font-size:11px;color:var(--soft);font-weight:700;margin:14px 0 0;text-align:center}.tg-mcap b{color:var(--ink)}
.tg-agerow{display:flex;gap:8px;margin-top:12px}
.tg-age{flex:1;background:rgba(253,234,238,.7);border:1.5px solid rgba(255,255,255,.7);border-radius:12px;padding:8px 10px}
.tg-age .k{font:800 8px var(--mono);text-transform:uppercase;color:var(--roseb)}
.tg-age .v{font-size:14px;font-weight:900;color:var(--roseb);margin-top:2px}
.tg-age .s{font-size:8.5px;color:var(--soft);font-weight:700}

/* stats */
.tg-stats{display:flex;gap:11px;margin-bottom:13px}
.tg-stat{flex:1;background:rgba(255,253,248,.52);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.65);border-radius:16px;padding:11px 12px;box-shadow:0 10px 22px -12px rgba(22,21,19,.3)}
.tg-stat.s-green{background:linear-gradient(160deg,rgba(143,230,192,.55),rgba(255,253,248,.4))}
.tg-stat.s-blue{background:linear-gradient(160deg,rgba(143,180,255,.5),rgba(255,253,248,.4))}
.tg-stat.s-sun{background:linear-gradient(160deg,rgba(255,216,77,.6),rgba(255,253,248,.4))}
.tg-stat .l{font:800 8px var(--mono);text-transform:uppercase;color:var(--soft)}
.tg-stat .v{font-size:18px;font-weight:900;margin-top:3px;letter-spacing:-.02em}.tg-stat .s{font-size:9px;color:var(--soft);font-weight:700}

/* cta + buttons */
.tg-cta{display:flex;gap:9px;margin-bottom:13px}
.tg-cta .p{flex:1;text-align:center;background:linear-gradient(150deg,var(--sun),#ffcf2f);border:1.5px solid rgba(255,255,255,.7);border-radius:16px;font-size:13.5px;font-weight:900;padding:13px;box-shadow:0 12px 26px -12px rgba(230,180,0,.7);cursor:pointer;color:var(--ink);position:relative;overflow:hidden}
.tg-cta .s{text-align:center;background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.7);border-radius:16px;font-size:12.5px;font-weight:800;padding:13px 15px;cursor:pointer;color:var(--ink)}
.tg-btn{display:inline-flex;align-items:center;gap:7px;background:var(--white);border:2px solid var(--ink);border-radius:12px;padding:9px 13px;font-size:12px;font-weight:850;box-shadow:0 4px 0 var(--ink);cursor:pointer;color:var(--ink);text-decoration:none;transition:transform .13s cubic-bezier(.2,.7,.2,1),box-shadow .13s}
.tg-btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--ink)}
.tg-btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}
.tg-btn.primary{background:var(--blue);color:#fff;position:relative;overflow:hidden}
.tg-btn.primary:hover{background:#3550ff}
/* card action grid — aligned buttons with coloured icon discs + hover pop */
.tg-akts{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}
.tg-ak{flex:1 1 calc(50% - 4px);display:inline-flex;align-items:center;gap:9px;border:2px solid var(--ink);border-radius:12px;background:var(--white);padding:9px 11px;font-size:12px;font-weight:850;box-shadow:0 4px 0 var(--ink);cursor:pointer;color:var(--ink);text-align:left;text-decoration:none;font-family:inherit;position:relative;overflow:hidden;transition:transform .13s cubic-bezier(.2,.7,.2,1),box-shadow .13s}
.tg-ak.full{flex-basis:100%;justify-content:center}
.tg-ak:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--ink)}
.tg-ak:active{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}
.tg-ak .bi{width:26px;height:26px;flex:none;border:1.5px solid var(--ink);border-radius:8px;display:grid;place-items:center;font-size:13px;transition:transform .25s cubic-bezier(.3,1.4,.5,1)}
.tg-ak:hover .bi{transform:scale(1.15) rotate(-6deg)}
.tg-ak.b1{background:linear-gradient(160deg,#e9edff,#f5f7ff)}.tg-ak.b1 .bi{background:#c6d0ff}
.tg-ak.b2{background:linear-gradient(160deg,#e4f5ec,#f3fbf7)}.tg-ak.b2 .bi{background:#b6e5cd}
.tg-ak.b3{background:linear-gradient(160deg,#fff2d3,#fffaed)}.tg-ak.b3 .bi{background:#ffdf7a}
.tg-ak.b4{background:linear-gradient(160deg,#f4e8f9,#fbf5fd)}.tg-ak.b4 .bi{background:#e6cdf0}
.tg-ak.prime{background:var(--blue);color:#fff}.tg-ak.prime .bi{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.6)}
.tg-ak.prime::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);animation:tgShine 3.8s ease-in-out infinite}
@media (max-width:360px){.tg-ak{flex-basis:100%}}

/* ===== System A — glossy gradient pills applied to ALL tenant action buttons ===== */
.tg-ak,.tg-xbtn,.tg-cb,.tg-cta .p,.tg-cta .s{border:none!important;border-radius:30px!important;position:relative;overflow:hidden;transition:transform .16s cubic-bezier(.2,.7,.2,1),box-shadow .16s}
.tg-ak::before,.tg-xbtn::before,.tg-cb::before,.tg-cta .p::before,.tg-cta .s::before{content:"";position:absolute;left:0;right:0;top:0;height:46%;background:linear-gradient(180deg,rgba(255,255,255,.38),transparent);pointer-events:none}
.tg-ak:hover,.tg-xbtn:hover,.tg-cb:hover,.tg-cta .p:hover,.tg-cta .s:hover{transform:translateY(-2px)}
.tg-ak:active,.tg-xbtn:active,.tg-cb:active,.tg-cta .p:active,.tg-cta .s:active{transform:translateY(0) scale(.98)}
.tg-ak .bi,.tg-xbtn .bi,.tg-cb .ic{border:none!important;background:rgba(255,255,255,.26)!important;border-radius:50%!important}
.tg-ak.b1,.tg-ak.prime,.tg-xbtn.record,.tg-cb.call{background:linear-gradient(145deg,#5a72ff,#2338d8);box-shadow:0 10px 22px -9px rgba(39,67,240,.6);color:#fff}
.tg-ak.b2,.tg-xbtn.share,.tg-cb.wa,.tg-cta .p{background:linear-gradient(145deg,#2ecb91,#159a63);box-shadow:0 10px 22px -9px rgba(27,158,107,.6);color:#fff}
.tg-ak.b3,.tg-xbtn.remind,.tg-cb.mail,.tg-cta .s{background:linear-gradient(145deg,#ffe06a,#f2a900);box-shadow:0 10px 22px -9px rgba(230,138,0,.55);color:#3a2600}
.tg-ak.b3 .bi,.tg-xbtn.remind .bi,.tg-cb.mail .ic{background:rgba(255,255,255,.5)!important}
.tg-ak.b4,.tg-xbtn.expense{background:linear-gradient(145deg,#a76fd0,#7a3fa0);box-shadow:0 10px 22px -9px rgba(138,79,179,.55);color:#fff}
.tg-rip{position:absolute;border-radius:50%;background:rgba(255,255,255,.5);transform:translate(-50%,-50%) scale(0);animation:tgRip .55s ease-out;pointer-events:none}
@keyframes tgRip{to{transform:translate(-50%,-50%) scale(9);opacity:0}}
.tg-btn.danger{color:var(--roseb)}
.tg-btnrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}
/* shimmer on primary surfaces */
.tg-cb.wa::after,.tg-cta .p::after,.tg-btn.primary::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:tgShine 3.6s ease-in-out infinite}
@keyframes tgShine{0%{left:-70%}50%{left:150%}100%{left:150%}}

/* quick actions */
.tg-qgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-bottom:13px}
/* Quick actions — mini glossy app-icon tiles (matches the System A pills + glass) */
.tg-q{display:flex;flex-direction:column;align-items:center;gap:8px;background:rgba(255,253,248,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.7);border-radius:17px;box-shadow:0 10px 20px -12px rgba(22,21,19,.35);padding:12px 4px 10px;text-align:center;cursor:pointer;transition:transform .16s cubic-bezier(.2,.7,.2,1),box-shadow .16s}
.tg-q:hover{transform:translateY(-4px);box-shadow:0 18px 26px -14px rgba(22,21,19,.4)}
.tg-q:active{transform:translateY(0) scale(.97)}
.tg-q .i{position:relative;overflow:hidden;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:20px;color:#fff;box-shadow:0 8px 16px -7px rgba(22,21,19,.5);transition:transform .3s cubic-bezier(.3,1.5,.4,1)}
.tg-q .i::before{content:"";position:absolute;left:0;right:0;top:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.4),transparent);pointer-events:none}
.tg-q:hover .i{transform:translateY(-2px) rotate(-6deg)}
.tg-q:nth-child(1) .i{background:linear-gradient(145deg,#5a72ff,#2338d8)}
.tg-q:nth-child(2) .i{background:linear-gradient(145deg,#2ecb91,#159a63)}
.tg-q:nth-child(3) .i{background:linear-gradient(145deg,#ffe06a,#f2a900)}
.tg-q:nth-child(4) .i{background:linear-gradient(145deg,#a76fd0,#7a3fa0)}
.tg-q:nth-child(5) .i{background:linear-gradient(145deg,#20c2bf,#0e9488)}
.tg-q .t{display:block;font:800 8.5px var(--mono);letter-spacing:.02em;text-transform:uppercase;color:var(--soft);line-height:1.2}

/* ledger */
.tg-lg{margin-top:2px}
.tg-lgrow{display:block;background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.7);border-left:5px solid var(--green);border-radius:13px;padding:11px 13px;margin-bottom:9px;box-shadow:0 8px 18px -12px rgba(22,21,19,.3);cursor:pointer}
.tg-lgrow.part{border-left-color:var(--amber);background:linear-gradient(160deg,rgba(255,248,234,.6),rgba(255,253,248,.5))}
.tg-lgrow.over{border-left-color:var(--rose);background:linear-gradient(160deg,rgba(253,240,243,.6),rgba(255,253,248,.5))}
.tg-lgrow.due{border-left-color:var(--blue);background:linear-gradient(160deg,rgba(238,242,255,.6),rgba(255,253,248,.5))}
.tg-lgrow.paid{background:rgba(255,253,248,.5)}
/* per-month calendar chip — reads as distinct months even when all paid/green */
.tg-cal{width:44px;flex:none;border:1.5px solid var(--ink);border-radius:9px;overflow:hidden;text-align:center;background:var(--white);box-shadow:0 3px 7px -3px rgba(22,21,19,.4)}
.tg-cal .mo{display:block;font:800 9px var(--mono);letter-spacing:.06em;color:#fff;background:var(--green);padding:2px 0}
.tg-cal .yr{display:block;font-size:13px;font-weight:900;padding:2px 0;line-height:1.1}
.tg-cal.part .mo{background:var(--amber)}.tg-cal.over .mo{background:var(--rose)}.tg-cal.due .mo{background:var(--blue)}
/* compact status pill (replaces the big green PAID text) */
.tg-pill{font:800 8px var(--mono);letter-spacing:.05em;border-radius:20px;padding:4px 9px;border:1.5px solid;white-space:nowrap}
.tg-pill.paid{color:#0c6b45;border-color:rgba(27,158,107,.4);background:rgba(27,158,107,.13)}
.tg-pill.part{color:#8a5300;border-color:rgba(230,138,0,.45);background:rgba(230,138,0,.15)}
.tg-pill.over{color:var(--roseb);border-color:rgba(232,93,117,.45);background:rgba(232,93,117,.13)}
.tg-pill.due{color:var(--blue);border-color:rgba(39,67,240,.35);background:rgba(39,67,240,.1)}
.tg-lgmid .tg-lgamt{font-size:15px;font-weight:900;letter-spacing:-.01em}
.tg-lgmid .tg-lgpl{margin:6px 0 5px}
.tg-lgtop{display:flex;align-items:center;gap:11px}
.tg-lgmo{width:42px;font-size:14px;font-weight:900}.tg-lgmo .yr{display:block;font:700 8px var(--mono);color:var(--mut)}
.tg-lgmid{flex:1;min-width:0}.tg-lgpl{height:4px;border-radius:3px;background:rgba(22,21,19,.1);overflow:hidden}.tg-lgpl i{display:block;height:100%;width:0;transition:width 1s ease}
.tg-d-paid{background:var(--green)}.tg-d-part{background:var(--amber)}.tg-d-over{background:var(--rose)}.tg-d-due{background:var(--blue)}
.tg-lgsub{font-size:10.5px;color:var(--soft);font-weight:700;margin-top:6px;display:flex;align-items:center;gap:5px}
.tg-dot{width:7px;height:7px;border-radius:50%}
.tg-lgrt{text-align:right;flex:none}.tg-lgamt{font-size:14px;font-weight:900}.tg-lgst{font:800 8.5px var(--mono);letter-spacing:.03em;margin-top:2px}
.tg-s-paid{color:var(--green)}.tg-s-part{color:var(--amber)}.tg-s-over{color:var(--roseb)}.tg-s-due{color:var(--blue)}
.tg-lgchev{font-size:11px;color:var(--mut);transition:transform .3s;margin-left:2px}
.tg-lgrow.open .tg-lgchev{transform:rotate(180deg)}
.tg-lgbody{max-height:0;overflow:hidden;transition:max-height .42s cubic-bezier(.2,.7,.2,1)}
.tg-lgrow.open .tg-lgbody{max-height:820px}
.tg-lgbody .in{padding:12px 2px 2px;margin-top:11px;border-top:1px solid rgba(22,21,19,.12)}
.tg-gh{font:800 8.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin:11px 0 3px}.tg-gh:first-child{margin-top:0}
.tg-br{display:flex;justify-content:space-between;padding:4px 0;font-size:12.5px}.tg-br span{color:var(--soft)}.tg-br b{font-weight:750}
.tg-br .tag{font:800 7.5px var(--mono);text-transform:uppercase;color:var(--amber);margin-left:6px}
.tg-br.add b{color:var(--amber)}.tg-br.cred b{color:var(--green)}.tg-br.total{border-top:1px solid rgba(22,21,19,.2);margin-top:5px;padding-top:7px;font-weight:900}.tg-br.total span{color:var(--ink);font-weight:900}
.tg-pay{display:flex;justify-content:space-between;padding:4px 0;font-size:12px}.tg-pl{color:var(--soft);display:flex;gap:6px;align-items:center;flex-wrap:wrap}.tg-md{font:800 7.5px var(--mono);text-transform:uppercase;background:rgba(39,67,240,.12);color:var(--blue);border-radius:4px;padding:1px 5px}.tg-pay b{color:var(--green);font-weight:750}
.tg-nopay{font-size:11.5px;color:var(--mut);font-weight:650;padding:3px 0}
.tg-bal{display:flex;justify-content:space-between;margin-top:6px;padding-top:7px;border-top:1px solid rgba(22,21,19,.2);font-size:12.5px;font-weight:900}.tg-bal .zero{color:var(--green)}.tg-bal .pos{color:var(--roseb)}
.tg-docs{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.tg-doc{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink);border:1.5px solid rgba(255,255,255,.8);background:rgba(255,255,255,.5);border-radius:10px;padding:7px 11px;cursor:pointer}
.tg-doc .dic{font-size:15px;line-height:1}.tg-doc .it{display:flex;flex-direction:column;line-height:1.2}.tg-doc .it b{font-size:12px;font-weight:800}.tg-doc .it small{font-size:9px;color:var(--mut);font-weight:600}.tg-doc .ar{color:var(--blue);font-weight:900}
.tg-doc.prime{background:rgba(255,216,77,.75);border-color:rgba(255,255,255,.7)}.tg-doc.prime .it small{color:#5c4b00}.tg-doc.prime .ar{color:var(--ink)}
.tg-reclink{display:inline-flex;align-items:center;gap:6px;margin-top:9px;font-size:11px;font-weight:800;color:var(--soft);text-decoration:none;cursor:pointer}.tg-reclink .st{font:800 7px var(--mono);text-transform:uppercase;color:var(--mut);border:1.5px solid var(--line);border-radius:4px;padding:1px 4px}
.tg-lgacts{display:flex;gap:15px;margin-top:11px}.tg-lgacts a{font-size:12px;font-weight:800;text-decoration:none;color:var(--soft);cursor:pointer}.tg-lgacts a.pri{color:var(--blue)}
/* ===== expanded month panel — premium (V2 + V4) ===== */
.tg-lgin{border-top:1px dashed var(--line);padding:14px}
.tg-xgrid{display:grid;grid-template-columns:1fr 128px;gap:13px}
.tg-xgh{font:800 8.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin:0 0 8px}
.tg-xli{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:13px;opacity:0;transform:translateX(-8px)}
.tg-lgrow.open .tg-xli{opacity:1;transform:none;transition:opacity .4s ease,transform .4s cubic-bezier(.2,.7,.2,1)}
.tg-lgrow.open .tg-xli:nth-child(2){transition-delay:.06s}.tg-lgrow.open .tg-xli:nth-child(3){transition-delay:.12s}.tg-lgrow.open .tg-xli:nth-child(4){transition-delay:.18s}.tg-lgrow.open .tg-xli:nth-child(5){transition-delay:.24s}.tg-lgrow.open .tg-xli:nth-child(6){transition-delay:.3s}.tg-lgrow.open .tg-xli:nth-child(7){transition-delay:.36s}
.tg-xli .ic{width:24px;height:24px;flex:none;border:1.5px solid var(--ink);border-radius:7px;display:grid;place-items:center;font-size:11px;background:var(--cream)}
.tg-xli .lb{color:var(--soft);font-weight:700}
.tg-xli .ldr{flex:1;border-bottom:1.5px dotted var(--line);height:9px;margin:0 3px}
.tg-xli b{font-weight:800}
.tg-xli.add .ic{background:#ffedcf}.tg-xli.add b{color:var(--amber)}
.tg-xli.cred .ic{background:var(--mint)}.tg-xli.cred b{color:var(--green)}
.tg-xli.total{border-top:1.5px solid var(--ink);margin-top:5px;padding-top:8px}.tg-xli.total .lb{color:var(--ink);font-weight:900}.tg-xli.total b{font-weight:900;font-size:14px}
.tg-xsum{border:1.5px solid var(--ink);border-radius:14px;background:linear-gradient(160deg,var(--mint),var(--white));padding:12px 11px;text-align:center;box-shadow:3px 3px 0 var(--ink);opacity:0;transform:translateY(10px)}
.tg-xsum.part,.tg-xsum.over,.tg-xsum.due{background:linear-gradient(160deg,#fdf1d8,var(--white))}
.tg-lgrow.open .tg-xsum{opacity:1;transform:none;transition:opacity .5s ease .12s,transform .5s cubic-bezier(.2,.7,.2,1) .12s}
.tg-xring{width:76px;height:76px;margin:0 auto 10px;position:relative;transform:scale(.8);opacity:0}
.tg-lgrow.open .tg-xring{transform:scale(1);opacity:1;transition:transform .55s cubic-bezier(.3,1.4,.5,1) .14s,opacity .3s .14s}
.tg-xring svg{display:block;transform:rotate(-90deg)}
.tg-xring .trk{fill:none;stroke:#e7ddd3;stroke-width:6.5}
.tg-xring .prg{fill:none;stroke:var(--green);stroke-width:6.5;stroke-linecap:round;transition:stroke-dashoffset 1.1s cubic-bezier(.2,.7,.2,1) .2s}
.tg-xsum.part .tg-xring .prg,.tg-xsum.over .tg-xring .prg,.tg-xsum.due .tg-xring .prg{stroke:var(--amber)}
.tg-xring .lbl{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.tg-xring .lbl b{font-size:15px;font-weight:900;letter-spacing:-.03em}.tg-xring .lbl i{font:700 6px var(--mono);color:var(--mut);font-style:normal;margin-top:2px}
.tg-xsl{display:flex;justify-content:space-between;font-size:11px;padding:4px 0;border-top:1px dashed var(--line)}.tg-xsl:first-of-type{border-top:0}.tg-xsl span{color:var(--soft);font-weight:700}.tg-xsl b{font-weight:900}.tg-xsl b.g{color:var(--green)}.tg-xsl b.r{color:var(--roseb)}
.tg-xdocs{display:flex;gap:9px;margin-top:14px;flex-wrap:wrap;opacity:0;transform:translateY(8px)}
.tg-lgrow.open .tg-xdocs{opacity:1;transform:none;transition:opacity .5s ease .34s,transform .5s cubic-bezier(.2,.7,.2,1) .34s}
.tg-xdoc{flex:1;min-width:150px;display:flex;align-items:center;gap:10px;border:2px solid var(--ink);border-radius:13px;padding:9px 11px;box-shadow:0 4px 0 var(--ink);cursor:pointer;text-decoration:none;color:#fff;position:relative;overflow:hidden;transition:transform .13s cubic-bezier(.2,.7,.2,1),box-shadow .13s}
.tg-xdoc.rc{background:linear-gradient(150deg,#28b07f,var(--green))}
.tg-xdoc.inv{background:linear-gradient(150deg,#4a63f7,var(--blue))}
.tg-xdoc:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--ink)}
.tg-xdoc:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}
.tg-xdoc .ic{width:32px;height:32px;flex:none;border:1.5px solid rgba(255,255,255,.6);border-radius:9px;display:grid;place-items:center;font-size:15px;background:rgba(255,255,255,.28);transition:transform .25s cubic-bezier(.3,1.4,.5,1)}
.tg-xdoc:hover .ic{transform:scale(1.12) rotate(-5deg)}
.tg-xdoc .it{flex:1;min-width:0}.tg-xdoc .it b{font-size:12.5px;font-weight:850;display:block;line-height:1.1}.tg-xdoc .it small{font-size:9.5px;color:rgba(255,255,255,.85);font-weight:700}
.tg-xdoc .ar{font-weight:900;color:#fff;transition:transform .2s}.tg-xdoc:hover .ar{transform:translate(3px,-3px)}
.tg-xdoc.prime::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:tgShine 3.6s ease-in-out infinite}
.tg-xreclink{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:11px;font-weight:800;color:var(--soft);text-decoration:none;cursor:pointer}.tg-xreclink .st{font:800 7px var(--mono);text-transform:uppercase;color:var(--mut);border:1.5px solid var(--line);border-radius:4px;padding:1px 4px}
.tg-xacts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap;opacity:0;transform:translateY(8px)}
.tg-lgrow.open .tg-xacts{opacity:1;transform:none;transition:opacity .5s ease .42s,transform .5s cubic-bezier(.2,.7,.2,1) .42s}
.tg-xbtn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:2px solid var(--ink);border-radius:13px;padding:11px 10px;font-size:12.5px;font-weight:850;box-shadow:0 5px 0 var(--ink);cursor:pointer;background:var(--white);color:var(--ink);position:relative;overflow:hidden;white-space:nowrap;font-family:inherit;transition:transform .13s cubic-bezier(.2,.7,.2,1),box-shadow .13s}
.tg-xbtn .bi{width:22px;height:22px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:12px;border:1.5px solid var(--ink);background:var(--cream);transition:transform .25s cubic-bezier(.3,1.4,.5,1)}
.tg-xbtn:hover{transform:translateY(-2px);box-shadow:0 7px 0 var(--ink)}
.tg-xbtn:active{transform:translateY(3px);box-shadow:0 2px 0 var(--ink)}
.tg-xbtn.share{background:linear-gradient(150deg,#28b07f,var(--green));color:#fff}.tg-xbtn.share .bi{background:rgba(255,255,255,.32);border-color:rgba(255,255,255,.6)}
.tg-xbtn.record{background:linear-gradient(150deg,#4a63f7,var(--blue));color:#fff}.tg-xbtn.record .bi{background:rgba(255,255,255,.32);border-color:rgba(255,255,255,.6)}
.tg-xbtn.remind{background:linear-gradient(150deg,var(--sun),var(--amber));color:#3a2600}.tg-xbtn.remind .bi{background:rgba(255,255,255,.6)}
.tg-xbtn.expense{background:var(--cream);color:var(--ink)}.tg-xbtn.expense .bi{background:var(--sun)}
.tg-xbtn.share::after,.tg-xbtn.record::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);animation:tgShine 3.8s ease-in-out infinite}
.tg-xbtn:hover .bi{transform:scale(1.14)}
.tg-xbtn.share:hover .bi{animation:tgBiSend .6s ease}
.tg-xbtn.record:hover .bi{animation:tgBiPop .55s ease}
.tg-xbtn.remind:hover .bi{animation:tgBiRing .7s ease;transform-origin:50% 20%}
.tg-xbtn.expense:hover .bi{transform:rotate(90deg) scale(1.12)}
@keyframes tgBiSend{0%{transform:translateY(0)}45%{transform:translateY(-5px) scale(1.12)}100%{transform:translateY(0) scale(1.14)}}
@keyframes tgBiPop{0%{transform:scale(1)}45%{transform:scale(1.3)}100%{transform:scale(1.14)}}
@keyframes tgBiRing{0%,100%{transform:rotate(0)}12%{transform:rotate(22deg)}28%{transform:rotate(-17deg)}44%{transform:rotate(12deg)}60%{transform:rotate(-8deg)}76%{transform:rotate(4deg)}}
@media (max-width:460px){.tg-xgrid{grid-template-columns:1fr}}

/* kv / mfacts / progress / stepper / badges / idbox */
.tg-kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:12.5px;border-top:1px solid rgba(22,21,19,.08)}.tg-kv:first-of-type{border-top:0}.tg-kv .k{color:var(--soft);font-weight:700}.tg-kv .v{font-weight:850;text-align:right}
.tg-mfacts{display:flex;gap:9px}
.tg-mfact{flex:1;background:rgba(255,255,255,.45);border:1.5px solid rgba(255,255,255,.7);border-radius:13px;padding:9px 11px}.tg-mfact .l{font:800 8px var(--mono);text-transform:uppercase;color:var(--soft)}.tg-mfact .v{font-size:15px;font-weight:900;margin-top:3px}
.tg-prog{height:9px;border:1.5px solid rgba(255,255,255,.8);border-radius:6px;overflow:hidden;background:rgba(255,255,255,.4);margin:11px 0 5px}.tg-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--sun),var(--amber));transition:width 1.1s cubic-bezier(.2,.7,.2,1)}
.tg-stepper{display:flex;align-items:center;margin:12px 0 2px}
.tg-step{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;position:relative}
.tg-step .b{width:22px;height:22px;border:2px solid var(--ink);border-radius:50%;background:rgba(255,255,255,.85);display:grid;place-items:center;font-size:10px;font-weight:900;z-index:2;transform:scale(.3);opacity:0}
.tg-step.done .b{background:var(--green);color:#fff;border-color:var(--green)}.tg-step.cur .b{background:var(--sun)}
.shown .tg-step .b{transform:scale(1);opacity:1;transition:transform .5s cubic-bezier(.3,1.5,.5,1),opacity .3s}
.shown .tg-step:nth-child(1) .b{transition-delay:.1s}.shown .tg-step:nth-child(2) .b{transition-delay:.28s}.shown .tg-step:nth-child(3) .b{transition-delay:.46s}.shown .tg-step:nth-child(4) .b{transition-delay:.64s}
.tg-step .t{font:800 8px var(--mono);text-transform:uppercase;color:var(--soft)}
.tg-step::before{content:"";position:absolute;top:10px;left:-50%;width:100%;height:2px;background:rgba(22,21,19,.22);z-index:1}.tg-step:first-child::before{display:none}.tg-step.done::before,.tg-step.cur::before{background:var(--green)}
.tg-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.tg-badge{font:800 9px var(--mono);text-transform:uppercase;border:1.5px solid rgba(255,255,255,.8);border-radius:7px;padding:3px 8px;background:rgba(255,255,255,.55);white-space:nowrap}.tg-badge.sun{background:rgba(255,216,77,.75)}.tg-badge.ok{background:rgba(143,230,192,.65);color:#0c6b45}.tg-badge.mut{background:rgba(22,21,19,.08);color:var(--soft)}
.tg-idbox{display:flex;align-items:center;gap:13px}.tg-idbox .big{font-size:14px;font-weight:900}.tg-idbox .sm{font-size:11px;color:var(--soft);font-weight:700}

/* expanders */
.tg-more{background:rgba(255,253,248,.58);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1.5px solid rgba(255,255,255,.7);border-radius:18px;box-shadow:0 14px 30px -18px rgba(22,21,19,.35);margin-bottom:12px;overflow:hidden}
.tg-more.m-blue{background:linear-gradient(160deg,rgba(228,234,255,.55),rgba(255,253,248,.5))}.tg-more.m-green{background:linear-gradient(160deg,rgba(233,247,239,.58),rgba(255,253,248,.5))}.tg-more.m-sun{background:linear-gradient(160deg,rgba(255,243,201,.6),rgba(255,253,248,.5))}
.tg-more>summary{display:flex;align-items:center;gap:10px;padding:13px 15px;list-style:none;cursor:pointer}.tg-more>summary::-webkit-details-marker{display:none}
.tg-more>summary:hover{background:rgba(255,255,255,.25)}
.tg-more .msi{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;font-size:12px;background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.8);flex:none}
.tg-more .mt{flex:1;font:800 11px var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--soft)}
.tg-more .cnt{font:700 10px var(--mono);color:var(--mut)}
.tg-more .chev{font-size:13px;color:var(--soft);transition:transform .3s}.tg-more[open] .chev{transform:rotate(180deg)}
.tg-more[open]{box-shadow:0 16px 34px -16px rgba(22,21,19,.4)}
.tg-more .body{padding:0 15px 15px}
.tg-fdoc{display:flex;align-items:center;gap:11px;padding:10px 0;border-top:1px solid rgba(22,21,19,.09)}.tg-fdoc:first-of-type{border-top:0}
.tg-fic{width:33px;height:38px;border-radius:6px;flex:none;display:grid;place-items:center;font:800 8px var(--mono);color:#fff;position:relative;box-shadow:0 5px 10px -5px rgba(22,21,19,.55)}
.tg-fic::after{content:"";position:absolute;top:0;right:0;border-width:0 9px 9px 0;border-style:solid;border-color:rgba(255,255,255,.55) transparent;border-radius:0 6px 0 0}
.tg-fic.pdf{background:linear-gradient(150deg,#ff8095,var(--roseb))}.tg-fic.img{background:linear-gradient(150deg,#8fb4ff,var(--blue))}
.tg-fx{flex:1;min-width:0}.tg-fx b{font-size:12.5px;font-weight:850;display:block;line-height:1.15}.tg-fx small{font-size:9.5px;color:var(--mut);font-weight:700}
.tg-fgo{flex:none;font:800 10px var(--mono);letter-spacing:.03em;color:var(--blue);border:1.5px solid rgba(39,67,240,.35);background:rgba(39,67,240,.08);border-radius:9px;padding:6px 12px;cursor:pointer;text-decoration:none}
.tg-drop{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:11px;padding:14px;border:2px dashed rgba(39,67,240,.4);border-radius:12px;background:rgba(39,67,240,.05);font-size:12.5px;font-weight:850;color:var(--blue);cursor:pointer;text-align:center}.tg-drop small{font-size:9.5px;color:var(--mut);font-weight:700}
.tg-prow{display:flex;align-items:center;gap:12px;padding:2px 0 11px}
.tg-pdot{width:12px;height:12px;border-radius:50%;background:var(--green);flex:none;box-shadow:0 0 0 4px rgba(27,158,107,.2);animation:tgPulse 2s infinite}
.tg-pdot.off{background:var(--mut);box-shadow:0 0 0 4px rgba(139,133,120,.2);animation:none}
@keyframes tgPulse{0%,100%{box-shadow:0 0 0 0 rgba(27,158,107,.5)}50%{box-shadow:0 0 0 6px rgba(27,158,107,0)}}
.tg-px b{font-size:13px;font-weight:850;display:block;color:#0c6b45}.tg-px small{font-size:10px;color:var(--mut);font-weight:700}
.tg-quote{position:relative;font-family:var(--serif);font-style:italic;font-size:13.5px;line-height:1.5;color:var(--ink);background:rgba(255,243,201,.55);border:1.5px solid rgba(230,138,0,.3);border-left:4px solid var(--amber);border-radius:12px;padding:12px 14px 12px 16px}
.tg-qby{display:block;font-family:-apple-system,system-ui,sans-serif;font-style:normal;font-size:10px;color:var(--mut);font-weight:700;margin-top:9px}

/* end tenancy */
.tg-endten{display:flex;align-items:center;gap:12px;width:100%;text-align:left;cursor:pointer;margin:6px 0 10px;background:linear-gradient(160deg,rgba(253,226,231,.72),rgba(255,253,248,.5));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1.5px solid rgba(232,93,117,.55);border-left:5px solid var(--rose);border-radius:16px;padding:13px 15px;box-shadow:0 13px 28px -14px rgba(179,18,58,.5)}
.tg-endten .ic{width:40px;height:40px;border-radius:12px;flex:none;display:grid;place-items:center;font-size:18px;background:linear-gradient(150deg,#ff8095,var(--roseb));border:1.5px solid rgba(255,255,255,.55);box-shadow:0 7px 13px -6px rgba(179,18,58,.65)}
.tg-endten .tx{flex:1;min-width:0}.tg-endten .tx b{display:block;font-size:14px;font-weight:900;color:var(--roseb);letter-spacing:-.01em}.tg-endten .tx small{font-size:10.5px;color:var(--soft);font-weight:700}
.tg-endten .ar{font-size:16px;font-weight:900;color:var(--roseb);transition:transform .2s}.tg-endten:hover .ar{transform:translateX(4px)}

/* hover lifts + scroll reveal */
.tg-glass,.tg-q,.tg-stat,.tg-cb,.tg-ti,.tg-more,.tg-lgrow,.tg-mfact,.tg-age,.tg-tbb,.tg-btn,.tg-fgo,.tg-drop,.tg-endten,.tg-doc,.tg-cta .p,.tg-cta .s{transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s,background .15s}
.tg-stat:hover,.tg-ti:hover,.tg-mfact:hover,.tg-age:hover,.tg-glass:hover,.tg-doc:hover,.tg-fgo:hover,.tg-drop:hover{transform:translateY(-3px)}
.tg-cb:hover,.tg-btn:hover,.tg-tbb:hover,.tg-endten:hover{transform:translateY(-2px)}
.tg-cta .p:active,.tg-cta .s:active,.tg-btn:active,.tg-cb:active,.tg-endten:active{transform:translateY(1px)}
.tg-rise{opacity:0;transform:translateY(22px)}
.tg-rise.shown{opacity:1;transform:none;transition:opacity .65s cubic-bezier(.2,.7,.2,1),transform .65s cubic-bezier(.2,.7,.2,1)}

.tg-empty{font-size:12px;color:var(--mut);font-weight:650;padding:6px 0}
/* ===== Home (owner dashboard) — aurora glass, reuses .tpage/tg- system ===== */
.hg-greet{display:flex;align-items:center;gap:12px;margin-bottom:15px}
.hg-gav{width:46px;height:46px;border-radius:14px;border:2px solid rgba(255,255,255,.8);background:linear-gradient(150deg,var(--sun),#ffcf2f);display:grid;place-items:center;font-weight:900;font-size:18px;box-shadow:0 8px 16px -7px rgba(22,21,19,.4);flex:none;color:var(--ink)}
.hg-ghi{font-size:20px;font-weight:900;letter-spacing:-.02em}.hg-ghi em{font-family:var(--serif);font-style:italic;font-weight:700}
.hg-gsub{font-size:11px;color:var(--soft);font-weight:700;margin-top:2px}
.hg-gbell{margin-left:auto;width:40px;height:40px;border-radius:13px;background:rgba(255,253,248,.6);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.7);display:grid;place-items:center;font-size:17px;box-shadow:0 8px 16px -8px rgba(22,21,19,.3);position:relative;cursor:pointer;color:var(--ink);text-decoration:none;flex:none}
.hg-gbell.on::after{content:"";position:absolute;top:8px;right:9px;width:7px;height:7px;border-radius:50%;background:var(--rose);border:1.5px solid #fff}
.hg-money .hg-mtop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.hg-mlbl{font:800 9px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#0c6b45}
.hg-mlbl .r{float:right;color:var(--blue);text-transform:none;letter-spacing:0;font-size:11px;cursor:pointer}
.hg-mbig{font-size:38px;font-weight:900;letter-spacing:-.04em;line-height:.95;color:var(--green);margin-top:5px}
.hg-msub{font-size:11.5px;color:var(--soft);font-weight:700;margin-top:5px}.hg-msub b{color:var(--ink)}
.hg-money .tg-jar{width:88px;height:110px}.hg-money .tg-jar .pct b{font-size:20px}
.hg-meter{height:11px;border-radius:7px;background:rgba(22,21,19,.1);overflow:hidden;display:flex;margin:14px 0 12px}
.hg-meter i{height:100%;width:0;transition:width 1s ease}.hg-meter .g{background:var(--green)}.hg-meter .a{background:var(--amber)}.hg-meter .r{background:var(--rose)}
.hg-mstats{display:flex;gap:8px}
.hg-mst{flex:1;background:rgba(255,255,255,.5);border:1.5px solid rgba(255,255,255,.7);border-radius:12px;padding:8px 10px}
.hg-mst .l{font:800 8px var(--mono);text-transform:uppercase;color:var(--soft);display:flex;align-items:center;gap:5px}
.hg-mst .l .d{width:8px;height:8px;border-radius:50%}.hg-mst .v{font-size:15px;font-weight:900;margin-top:2px}.hg-mst .ct{font-size:8px;color:var(--mut);font-weight:700;margin-top:1px}
.hg-d-g{background:var(--green)}.hg-d-b{background:var(--blue)}.hg-d-r{background:var(--rose)}
/* do this next — sun focus queue */
.hg-dnext{background:linear-gradient(160deg,#fff3cc,rgba(255,253,248,.6));border-left:5px solid var(--sun);box-shadow:0 18px 40px -18px rgba(230,138,0,.4),inset 0 1px 0 rgba(255,255,255,.6);position:relative;overflow:hidden}
.hg-dnext::after{content:"";position:absolute;right:-34px;top:-34px;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,rgba(255,216,77,.4),transparent 70%);pointer-events:none}
.hg-dnhead{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}
.hg-dnlbl{font:800 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#8a5300;display:inline-flex;align-items:center;gap:8px}
.hg-dnlbl .z{width:22px;height:22px;border-radius:50%;background:linear-gradient(145deg,#ffe06a,#f2a900);display:grid;place-items:center;font-size:11px;color:#3a2600;animation:dnpulse 1.8s infinite}
@keyframes dnpulse{0%,100%{box-shadow:0 0 0 0 rgba(230,138,0,.55)}50%{box-shadow:0 0 0 7px rgba(230,138,0,0)}}
.hg-dncount{font:800 9px var(--mono);color:#8a5300;background:rgba(230,138,0,.15);border:1.5px solid rgba(230,138,0,.4);border-radius:20px;padding:3px 9px}
.hg-dnbody{position:relative;z-index:1;transition:transform .32s cubic-bezier(.2,.7,.2,1),opacity .32s}
.hg-dnbody.out{transform:translateY(-16px);opacity:0}.hg-dnbody.in0{transform:translateY(16px);opacity:0}
.hg-dnitem{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.62);border:1.5px solid rgba(255,255,255,.85);border-radius:14px;padding:11px 13px;margin-top:12px;box-shadow:0 8px 18px -12px rgba(230,138,0,.35)}
.hg-dnav{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;font-weight:900;font-size:15px;color:#3a2600;background:linear-gradient(145deg,#ffe06a,#f2a900);box-shadow:0 6px 12px -6px rgba(230,138,0,.6)}
.hg-dnmid{flex:1;min-width:0}.hg-dnnm{font-size:14px;font-weight:850;letter-spacing:-.01em}.hg-dnsub{font-size:11px;color:var(--soft);font-weight:700;margin-top:2px}
.hg-dnrt{text-align:right;flex:none}.hg-dnamt{font-size:16px;font-weight:900;color:var(--ink)}
.hg-dnchip{display:inline-block;margin-top:3px;font:800 8px var(--mono);color:#8a5300;background:rgba(230,138,0,.15);border:1.5px solid rgba(230,138,0,.4);border-radius:20px;padding:2px 8px}
.hg-dnchip.over{color:var(--roseb);background:rgba(232,93,117,.13);border-color:rgba(232,93,117,.4)}
.hg-dnall{display:block;text-align:center;margin-top:11px;font-size:11.5px;font-weight:800;color:var(--soft);text-decoration:none;cursor:pointer;position:relative;z-index:1;border:none;background:none;width:100%;font-family:inherit}
.hg-dndone{text-align:center;padding:8px 4px 2px;position:relative;z-index:1}.hg-dndone .e{font-size:30px}.hg-dndone .h{font-size:15px;font-weight:900;margin-top:4px;color:#0c6b45}.hg-dndone .s{font-size:12px;color:var(--soft);font-weight:650}
/* by-flat rows */
.hg-frow{display:flex;align-items:center;gap:12px;background:rgba(255,253,248,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.7);border-left:5px solid var(--green);border-radius:15px;box-shadow:0 10px 22px -14px rgba(22,21,19,.35);padding:11px 13px;margin-bottom:9px;cursor:pointer;transition:transform .16s,box-shadow .16s}
.hg-frow:hover{transform:translateY(-2px)}
.hg-frow.conf{border-left-color:var(--blue)}.hg-frow.over{border-left-color:var(--rose)}.hg-frow.vac{border-left-color:var(--mut)}
.hg-fav{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;font-weight:900;font-size:15px;color:#fff;box-shadow:0 6px 12px -6px rgba(22,21,19,.5)}
.hg-fav.c1{background:linear-gradient(145deg,#5a72ff,#2338d8)}.hg-fav.c2{background:linear-gradient(145deg,#2ecb91,#159a63)}.hg-fav.c3{background:linear-gradient(145deg,#a76fd0,#7a3fa0)}.hg-fav.c4{background:linear-gradient(145deg,#20c2bf,#0e9488)}
.hg-frow.vac .hg-fav{background:rgba(22,21,19,.08);color:var(--soft);box-shadow:none;border:1.5px dashed rgba(22,21,19,.3);font:800 11px var(--mono)}
.hg-fmid{flex:1;min-width:0}.hg-fnm{font-size:14px;font-weight:850;letter-spacing:-.01em}.hg-fmeta{font-size:10.5px;color:var(--soft);font-weight:700;margin-top:2px}
.hg-frt{text-align:right;flex:none}.hg-famt{font-size:14px;font-weight:900}
.hg-vlink{margin-left:auto;color:var(--blue);font-weight:800;font-size:12px;cursor:pointer;white-space:nowrap;text-decoration:none}
.hg-racts{display:flex;gap:18px;margin:1px 0 11px 56px}.hg-racts a{font-size:12px;font-weight:800;color:var(--soft);cursor:pointer;text-decoration:none}.hg-racts a.pri{color:var(--blue)}
/* your money */
.hg-mml{font:800 9px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--amber);margin-bottom:8px}
.hg-eqn{display:flex;align-items:baseline;justify-content:center;gap:7px;flex-wrap:wrap;font-size:12.5px;color:var(--soft);font-weight:700;text-align:center}.hg-eqn b,.hg-eqn .num{color:var(--ink);font-weight:900}
.hg-kept{font-size:30px;font-weight:900;letter-spacing:-.03em;color:var(--green);text-align:center;margin-top:3px}.hg-kept.neg{color:var(--roseb)}
.hg-keptcap{font-size:10.5px;color:var(--mut);font-weight:700;text-align:center;margin-bottom:4px}
.hg-spark{display:flex;align-items:flex-end;gap:5px;height:46px;margin:10px 0 4px}.hg-spark i{flex:1;border-radius:5px 5px 3px 3px;background:linear-gradient(180deg,#9fe6c6,var(--green));opacity:.5}.hg-spark i.on{opacity:1;box-shadow:0 6px 12px -6px rgba(27,158,107,.6)}
.hg-sparkcap{font-size:9.5px;color:var(--mut);font-weight:700;text-align:center}
.hg-minirow{display:flex;justify-content:space-between;font-size:12px;padding:7px 0;border-top:1px dashed rgba(22,21,19,.1);font-weight:700;color:var(--soft)}.hg-minirow b{font-weight:900;color:var(--ink)}
.hg-stmt{display:block;text-align:center;margin-top:11px;color:var(--blue);font-weight:800;font-size:12px;text-decoration:none;cursor:pointer}
.hg-calm{background:linear-gradient(160deg,#eafaf2,rgba(255,253,248,.5));text-align:center;padding:20px 14px}.hg-calm .e{font-size:28px}.hg-calm .h{font-size:15px;font-weight:900;margin-top:5px}.hg-calm .s{font-size:12px;color:var(--soft);font-weight:650}
.z-flat{background:linear-gradient(135deg,var(--blue),#5b6bff)}
/* Rent tracker */
.hg-mnav{display:flex;align-items:center;gap:12px;background:rgba(255,253,248,.58);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1.5px solid rgba(255,255,255,.7);border-radius:18px;box-shadow:0 10px 22px -14px rgba(22,21,19,.35);padding:9px 12px;margin-bottom:14px}
.hg-mnav button{width:34px;height:34px;border-radius:11px;border:none;background:linear-gradient(145deg,#5a72ff,#2338d8);color:#fff;font-size:16px;font-weight:900;cursor:pointer;box-shadow:0 6px 12px -6px rgba(39,67,240,.6)}
.hg-mnav .lab{flex:1;text-align:center}.hg-mnav .lab b{font-size:15px;font-weight:900}.hg-mnav .lab small{display:block;font:700 8px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.hg-prompt{display:flex;align-items:center;gap:10px;background:linear-gradient(160deg,#e7ecff,rgba(255,253,248,.6));border:1.5px solid rgba(255,255,255,.7);border-left:4px solid var(--blue);border-radius:14px;padding:12px 14px;margin-bottom:12px;font-size:12px;font-weight:700;color:var(--soft)}
.hg-prompt a{margin-left:auto;color:var(--blue);font-weight:850;cursor:pointer;white-space:nowrap}
.z-att{background:linear-gradient(135deg,var(--rose),#ff8095)}
.z-set{background:linear-gradient(135deg,var(--green),#37c98d)}
.tg-zn .n{background:rgba(255,255,255,.35);border-radius:10px;padding:1px 8px;margin-left:3px}
/* App header buttons — glossy aurora match (scoped to the top bar only) */
.topbar .rgt .iconbtn{background:rgba(255,253,248,.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.8);box-shadow:0 8px 16px -8px rgba(22,21,19,.32);border-radius:13px;color:#161513;transition:transform .15s cubic-bezier(.2,.7,.2,1),box-shadow .15s}
.topbar .rgt .iconbtn:hover{transform:translateY(-2px);box-shadow:0 12px 22px -10px rgba(22,21,19,.4)}
.topbar .rgt .iconbtn:active{transform:translateY(0)}
.topbar .rgt .addbtn{background:linear-gradient(145deg,#2ecb91,#159a63);color:#fff;border:1.5px solid rgba(255,255,255,.5);box-shadow:0 10px 20px -8px rgba(27,158,107,.6);position:relative;overflow:hidden}
.topbar .rgt .addbtn::before{content:"";position:absolute;left:0;right:0;top:0;height:48%;background:linear-gradient(180deg,rgba(255,255,255,.42),transparent);pointer-events:none;border-radius:13px 13px 0 0}

/* keyboard focus */
.tpage a:focus-visible,.tpage button:focus-visible,.tpage [role="button"]:focus-visible,.tg-cb:focus-visible,.tg-q:focus-visible,.tg-lgtop:focus-visible,.tg-lgrow:focus-visible,.tg-drop:focus-visible,.tg-endten:focus-visible{outline:2.5px solid var(--blue);outline-offset:2px}
/* fallback where backdrop-filter unsupported */
@supports not ((-webkit-backdrop-filter:blur(2px)) or (backdrop-filter:blur(2px))){
  .tg-glass,.tg-cb,.tg-stat,.tg-ti,.tg-more,.tg-lgrow,.tg-tbb,.tg-btn,.tg-endten,.tg-jar,.tg-q{background:var(--white)}
  .tg-warm{background:#fff6de}.tg-rose{background:#fdeaee}.tg-green{background:#eef8f2}.tg-sun{background:#fff3cf}.tg-blue{background:#eef1ff}.tg-plum{background:#f6ecf9}
}
@media (prefers-reduced-motion:reduce){
  .tpage *{animation:none!important;transition:none!important}
  .tg-rise{opacity:1;transform:none}.tg-av .vf,.tg-ti .ck,.tg-step .b,.tg-chip{opacity:1;transform:none}
}
/* Mobile perf: the aurora is GPU-heavy — animated blurred blobs behind ~15
   backdrop-filter cards forces a full backdrop recomposite every frame. On
   phones drop to 5 STATIC blobs (no drift) with lighter blur, and thin the
   card blur, so scrolling stays smooth. Desktop keeps the full effect. */
@media (max-width:700px){
  .tg-b2,.tg-b5,.tg-b7{display:none}
  .tg-blob{animation:none;filter:blur(32px);opacity:.44}
  .tpage .tg-glass,.tpage .tg-cb,.tpage .tg-stat,.tpage .tg-ti,.tpage .tg-more,.tpage .tg-lgrow,.tpage .tg-jar,.tpage .tg-btn,.tpage .tg-tbb,.tpage .tg-endten,.tpage .tg-q,.tpage .tg-cta .s{-webkit-backdrop-filter:blur(9px) saturate(1.15);backdrop-filter:blur(9px) saturate(1.15)}
}

/* Web view: every page fills the content width instead of a narrow left column
   with an empty gutter. .main didn't grow on its own (no flex:1), so it shrank to
   the content — make it fill, cap the content, and let Home's property grid go
   two-up. The tenant page keeps its own masonry via the .tpage :has() rules. */
@media (min-width:981px){
  .main{flex:1 1 auto}
  .content{max-width:900px}
}
/* ===== Owner Home — "Rent Desk" (Direction D). hd- prefixed + chitti palette. ===== */
.hdesk{
  --mk:#161513;--mp:#EDEBE5;--mcr:#F7E8DA;--mw:#FFFDF8;--soft:#4a463f;
  --sun:#FFD84D;--sundp:#ffe89a;--mblue:#2743F0;--mgreen:#1B9E6B;--mrose:#E85D75;--mamber:#E58A00;--mln:#ded7ca;
  max-width:452px;margin:0 auto;width:100%
}
@media(min-width:981px){
  .hdesk{max-width:820px;columns:2;column-gap:16px}
  .hdesk>*{break-inside:avoid}
  .hdesk>.hd-greet,.hdesk>.hd-chit,.hdesk>.hd-do,.hdesk>.card{column-span:all}
}
.hdesk .num{font-variant-numeric:tabular-nums}
.hd-greet{margin:2px 2px 12px}
.hd-greet b{font-size:19px;font-weight:900;letter-spacing:-.02em;display:block}
.hd-greet span{font-size:12px;color:var(--soft);font-weight:650}
.hd-card{background:var(--mw);border:2.5px solid var(--mk);border-radius:17px;box-shadow:4px 4px 0 var(--mk);padding:14px;margin-bottom:12px}
.hd-sect{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);margin:0 0 10px;display:flex;align-items:center;gap:7px}
.hd-sect .si{width:21px;height:21px;border:2px solid var(--mk);border-radius:6px;display:grid;place-items:center;font-size:11px;background:var(--mcr)}
.hd-sect .r{margin-left:auto;color:var(--mblue);font-weight:800;text-transform:none;letter-spacing:0;font-size:11.5px;cursor:pointer}
.hd-chit{position:relative;background:var(--mw);border:2.5px solid var(--mk);border-radius:15px;box-shadow:4px 4px 0 var(--mk);padding:15px 14px 13px;margin-bottom:12px;overflow:hidden;cursor:pointer}
.hd-chit::before{content:"";position:absolute;left:0;right:0;top:6px;height:6px;background:radial-gradient(circle at 6px 3px,var(--mp) 2.6px,transparent 3px) repeat-x;background-size:13px 6px}
.hd-lab{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);margin-top:6px;display:flex;align-items:center}
.hd-lab .r{margin-left:auto;color:var(--mblue);text-transform:none;letter-spacing:0;font-size:11px}
.hd-money{display:flex;align-items:baseline;gap:8px;margin-top:5px}
.hd-money .big{font-size:29px;font-weight:900;letter-spacing:-.03em;color:var(--mgreen)}
.hd-money .of{font-size:13px;color:var(--soft);font-weight:700}
.hd-pbar{height:12px;border:2px solid var(--mk);border-radius:7px;overflow:hidden;background:var(--mp);margin:11px 0 5px}
.hd-pbar i{display:block;height:100%;background:var(--mgreen)}
.hd-mchips{display:flex;gap:7px;margin-top:10px}
.hd-mchip{border:2px solid var(--mk);border-radius:9px;background:var(--mw);box-shadow:2px 2px 0 var(--mk);padding:6px 9px;flex:1;min-width:0}
.hd-mchip .l{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--soft)}
.hd-mchip .v{font-size:15px;font-weight:900;margin-top:1px}
.hd-mchip.rose .v{color:var(--mrose)}.hd-mchip.green .v{color:var(--mgreen)}
.hd-cta{display:block;text-align:center;margin-top:12px;border:2.5px solid var(--mk);border-radius:12px;background:var(--mgreen);color:#fff;padding:11px;font-size:13.5px;font-weight:900;box-shadow:3px 3px 0 var(--mk);cursor:pointer}
.hd-do{background:var(--sun);border-color:var(--mk)}
.hd-do .t{font-size:15px;font-weight:900;line-height:1.25}
.hd-do .s{font-size:12px;color:#6b675f;font-weight:700;margin-top:2px}
.hd-do .btns{display:flex;gap:8px;margin-top:12px}
.hd-do .b1{flex:1;text-align:center;border:2.5px solid var(--mk);border-radius:12px;background:var(--mgreen);color:#fff;padding:11px;font-size:13.5px;font-weight:900;box-shadow:3px 3px 0 var(--mk);cursor:pointer}
.hd-do .b2{flex:none;text-align:center;border:2.5px solid var(--mk);border-radius:12px;background:var(--mw);color:var(--mk);padding:11px 15px;font-size:12.5px;font-weight:800;box-shadow:3px 3px 0 var(--mk);cursor:pointer}
.hd-todo{display:flex;gap:9px;align-items:flex-start;padding:9px 0;border-top:1.5px dashed var(--mln);cursor:pointer}
.hd-todo:first-of-type{border-top:0}
.hd-todo .dot{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--mk);flex:none;margin-top:3px}
.hd-todo .tt{font-size:12.5px;font-weight:800;line-height:1.25}
.hd-todo .ts{font-size:11px;color:var(--soft);font-weight:650;margin-top:1px}
.hd-todo .go{margin-left:auto;color:var(--mblue);font-weight:900;font-size:17px;align-self:center}
.hd-kpis{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hd-kpi{border:2px solid var(--mk);border-radius:11px;background:var(--mw);box-shadow:2px 2px 0 var(--mk);padding:8px 10px}
.hd-kpi .l{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--soft)}
.hd-kpi .v{font-size:16px;font-weight:900;margin-top:1px}
.hd-chart{display:flex;align-items:flex-end;gap:7px;height:76px;padding:6px 2px 0;border-bottom:2px solid var(--mk);margin-top:2px}
.hd-chart .b{flex:1;background:var(--sun);border:2px solid var(--mk);border-bottom:0;border-radius:5px 5px 0 0;position:relative;min-height:3px}
.hd-chart .b.now{background:var(--mgreen)}
.hd-chart .b span{position:absolute;bottom:-16px;left:0;right:0;text-align:center;font:700 8.5px ui-monospace,Menlo,monospace;color:var(--soft)}
.hd-chartx{height:15px}
.hd-qg{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:12px}
.hd-q{border:2.5px solid var(--mk);border-radius:12px;background:var(--mw);padding:9px 3px;display:flex;flex-direction:column;align-items:center;gap:3px;font:800 9px system-ui;box-shadow:3px 3px 0 var(--mk);text-align:center;cursor:pointer;color:var(--mk)}
.hd-q .i{font-size:16px}
/* Home Rent-Radar (E) extra components */
.hd-totline{font-size:12.5px;color:var(--soft);font-weight:700;margin:2px 0 0}.hd-totline b{font-size:15px}
.hd-rentboxes{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:11px}
.hd-rbox{border:2px solid var(--mk);border-radius:12px;box-shadow:2px 2px 0 var(--mk);padding:11px 6px 9px;text-align:center;background:var(--mw)}
.hd-rbox .ic{font-size:19px;line-height:1}
.hd-rbox .w{font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.02em;text-transform:uppercase;color:var(--soft);margin-top:4px;line-height:1.15;min-height:22px;display:flex;align-items:center;justify-content:center}
.hd-rbox .a{font-size:16px;font-weight:900;margin-top:2px}
.hd-rbox .s{font-size:9.5px;color:var(--soft);font-weight:650;margin-top:1px}
.hd-rbox.paid{background:#eafaf1}.hd-rbox.paid .a{color:var(--mgreen)}
.hd-rbox.confirm{background:#fff6e2}.hd-rbox.confirm .a{color:var(--mamber)}
.hd-rbox.late{background:#fdeaee}.hd-rbox.late .a{color:var(--mrose)}
.hd-flat{padding:10px 0;border-top:1.5px dashed var(--mln)}.hd-flat:first-of-type{border-top:0}
.hd-flat .top{display:flex;align-items:center;gap:10px;cursor:pointer}
.hd-flat .tile{width:34px;height:34px;border:2px solid var(--mk);border-radius:8px;background:var(--sun);display:grid;place-items:center;font-weight:900;font-size:11px;flex:none}
.hd-flat .nm{font-size:13px;font-weight:800}.hd-flat .mt{font-size:10.5px;color:var(--soft);font-weight:650}
.hd-fchip{margin-left:auto;font:700 9px ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;border:1.6px solid var(--mk);border-radius:6px;padding:2px 6px;flex:none}
.hd-fchip.g{background:#d9f4e6;color:#0c6b45}.hd-fchip.a{background:#fff1cf;color:#7a4d00}.hd-fchip.r{background:#fdeaee;color:#b3123a}.hd-fchip.mut{background:#eceae4;color:#6b675f}
.hd-facts{display:flex;gap:7px;margin:9px 0 0 44px}
.hd-fbtn{border:2px solid var(--mk);border-radius:9px;background:var(--mp);padding:6px 10px;font-size:11px;font-weight:800;box-shadow:2px 2px 0 var(--mk);cursor:pointer}
.hd-fbtn.wa{background:#d9f4e6}.hd-fbtn.g{background:var(--mgreen);color:#fff}
.hd-moneyrow{display:flex;align-items:stretch;gap:6px;margin-top:2px}
.hd-mbox{flex:1;border:2px solid var(--mk);border-radius:11px;box-shadow:2px 2px 0 var(--mk);padding:9px 5px 8px;text-align:center;background:var(--mw)}
.hd-mbox .ic{font-size:16px;line-height:1}.hd-mbox .l{font:800 8px ui-monospace,Menlo,monospace;text-transform:uppercase;letter-spacing:.02em;color:var(--soft);margin-top:3px}
.hd-mbox .v{font-size:14px;font-weight:900;margin-top:1px}.hd-mbox.keep{background:#eafaf1}.hd-mbox.keep .v{color:var(--mgreen)}
.hd-op{align-self:center;font-size:16px;font-weight:900;color:var(--soft);flex:none}
.hd-trend{display:flex;align-items:center;gap:11px;margin-top:12px;padding-top:11px;border-top:1.5px dashed var(--mln)}
.hd-trend .cap{flex:none;font-size:11px;color:var(--soft);font-weight:650;line-height:1.3}.hd-trend .cap b{color:var(--mk);font-size:13px}
.hd-spark{flex:1;display:flex;align-items:flex-end;gap:4px;height:40px}
.hd-spark i{flex:1;background:var(--sun);border:1.5px solid var(--mk);border-bottom:0;border-radius:3px 3px 0 0;min-height:3px}.hd-spark i.now{background:var(--mgreen)}
.hd-mfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:11px;padding-top:11px;border-top:1.5px dashed var(--mln);font-size:11.5px;font-weight:700;color:var(--soft)}
.hd-mfoot b{color:var(--mk)}.hd-mfoot .tx{color:var(--mblue);font-weight:800;flex:none;cursor:pointer}
/* ===== Properties page (portfolio). Shares hd- summary boxes + own pp- cards. ===== */
.ppage{--mk:#161513;--mp:#EDEBE5;--mcr:#F7E8DA;--mw:#FFFDF8;--soft:#4a463f;--sun:#FFD84D;--mblue:#2743F0;--mgreen:#1B9E6B;--mrose:#E85D75;--mamber:#E58A00;--mln:#ded7ca;--msun:#FFD84D;--msundp:#ffe89a;--mks:#4a463f;max-width:452px;margin:0 auto;width:100%}
@media(min-width:981px){.ppage{max-width:820px;columns:2;column-gap:16px}.ppage>*{break-inside:avoid}.ppage>.phead,.ppage>.hd-card,.ppage>.hd-sect{column-span:all}}
.ppage .phead{margin-bottom:12px}
.pp-add{margin-bottom:2px;font:800 11px ui-monospace,Menlo,monospace;letter-spacing:.03em;color:#fff;background:var(--mblue);border:2px solid var(--mk);border-radius:9px;padding:6px 11px;box-shadow:2px 2px 0 var(--mk);cursor:pointer;transition:transform .06s,box-shadow .06s}
.pp-add:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--mk)}
.pp-add:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--mk)}
.pp-map{color:var(--mblue);font-weight:800;text-decoration:none;cursor:pointer}
.pp-map:hover{text-decoration:underline}
.pp-meter{display:flex;gap:4px;margin-top:9px}
.pp-meter i{flex:1;height:15px;border:2px solid var(--mk);border-radius:4px;background:var(--mw)}
.pp-meter i.on{background:var(--mgreen)}.pp-meter i.late{background:var(--mamber)}
.pp-sumhead{font-size:14px;font-weight:800;margin:0}
.pp-prop{background:var(--mw);border:2.5px solid var(--mk);border-radius:17px;box-shadow:4px 4px 0 var(--mk);overflow:hidden;margin-bottom:12px}
.pp-body{padding:13px 14px;cursor:pointer}
.pp-top{display:flex;align-items:flex-start;gap:11px}
.pp-tile{width:42px;height:42px;border:2.5px solid var(--mk);border-radius:11px;display:grid;place-items:center;font-weight:900;font-size:14px;box-shadow:2px 2px 0 var(--mk);flex:none;background:var(--mcr)}
.pp-tile.apt{background:#dfe4ff}
.pp-nm{font-size:16px;font-weight:900;letter-spacing:-.01em;line-height:1.1}
.pp-mt{font-size:11.5px;color:var(--soft);font-weight:650;margin-top:2px}
.pp-badge{margin-left:auto;font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;border:2px solid var(--mk);border-radius:7px;padding:3px 7px;box-shadow:1.5px 1.5px 0 var(--mk);white-space:nowrap;flex:none}
.pp-badge.full{background:#d9f4e6;color:#0c6b45}.pp-badge.vac{background:#fdeaee;color:#b3123a}
.pp-health{display:flex;align-items:center;gap:9px;margin-top:12px}
.pp-health .pp-meter{margin-top:0;width:60px;flex:none}
.pp-health .lr{font-size:12.5px;font-weight:800}.pp-health .lr b{font-weight:900}
.pp-cstat{margin-left:auto;font:800 9.5px ui-monospace,Menlo,monospace;text-transform:uppercase;letter-spacing:.03em;border:2px solid var(--mk);border-radius:7px;padding:3px 8px;white-space:nowrap;flex:none}
.pp-cstat.ok{background:#d9f4e6;color:#0c6b45}.pp-cstat.bad{background:#fdeaee;color:#b3123a}
.pp-strip{display:inline-flex;align-items:center;gap:6px;margin-top:12px;flex-wrap:wrap;font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.02em}
.pp-strip .s{display:inline-flex;align-items:baseline;gap:5px;padding:5px 9px;text-transform:uppercase;color:var(--soft);background:var(--mw);border:2px solid var(--mk);border-radius:8px;box-shadow:1.5px 1.5px 0 var(--mk)}
.pp-strip .s b{font-size:13px;color:var(--mk);font-variant-numeric:tabular-nums}
.pp-strip .s.tot{background:var(--mcr)}
.pp-strip .s.f{background:#eafaf1;color:#0c6b45}.pp-strip .s.f b{color:#0c6b45}
.pp-strip .s.e{background:#fdeaee;color:#b3123a}.pp-strip .s.e b{color:#b3123a}
.pp-strip .op{font:900 13px ui-monospace,Menlo,monospace;color:var(--soft)}

/* ---- property detail (pd) ---- */
@media(min-width:981px){.ppage.pd{columns:auto;max-width:660px}}
.ppage.pd .back{display:inline-block;margin:0 2px 9px}
.pd-title{display:flex;align-items:flex-start;gap:11px;margin:0 2px 14px}
.pd-tile{width:46px;height:46px;border:2.5px solid var(--mk);border-radius:12px;background:#dfe4ff;display:grid;place-items:center;font-weight:900;font-size:15px;box-shadow:2px 2px 0 var(--mk);flex:none}
.pd-title h1{font-size:22px;font-weight:900;letter-spacing:-.02em;margin:0;line-height:1.05}
.pd-title .sub{font-size:12px;font-weight:800;margin-top:4px}.pd-title .sub .ty{color:var(--soft)}
.pd-title .acts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.pd-abtn{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.02em;border:2px solid var(--mk);border-radius:8px;padding:6px 9px;box-shadow:2px 2px 0 var(--mk);background:var(--mw);cursor:pointer;white-space:nowrap}
.pd-abtn.pri{background:var(--mblue);color:#fff}
.pd-obar{height:12px;border:2px solid var(--mk);border-radius:6px;overflow:hidden;background:var(--mw);display:flex;margin-top:11px}
.pd-obar i{height:100%;background:var(--mgreen)}
.pd-money{display:flex;gap:8px;margin-top:12px}
.pd-mbox{flex:1;border:2px solid var(--mk);border-radius:11px;box-shadow:2px 2px 0 var(--mk);padding:9px 9px;background:var(--mw)}
.pd-mbox .l{font:800 8px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--soft)}
.pd-mbox .v{font-size:16px;font-weight:900;margin-top:3px;font-variant-numeric:tabular-nums}
.pd-mbox.in .v{color:var(--mgreen)}
.pd-vac{display:flex;align-items:center;gap:10px;background:var(--sun);border:2.5px solid var(--mk);border-radius:15px;box-shadow:4px 4px 0 var(--mk);padding:12px 14px;margin-bottom:12px}
.pd-vac .txt{font-size:12.5px;font-weight:850;line-height:1.25}.pd-vac .txt span{display:block;font-size:10.5px;font-weight:700;color:#6b675f;margin-top:1px}
.pd-vac .go{margin-left:auto;flex:none;font-size:12px;font-weight:900;color:#fff;background:var(--mk);border:2px solid var(--mk);border-radius:10px;padding:8px 12px;box-shadow:2px 2px 0 rgba(0,0,0,.25);cursor:pointer}
.pd-flat{display:flex;border:2.5px solid var(--mk);border-radius:14px;box-shadow:3px 3px 0 var(--mk);background:var(--mw);margin-bottom:10px;overflow:hidden;cursor:pointer}
.pd-rail{width:8px;flex:none;align-self:stretch}
.pd-rail.g{background:var(--mgreen)}.pd-rail.a{background:var(--mamber)}.pd-rail.r{background:var(--mrose)}
.pd-in{flex:1;min-width:0;padding:11px 12px}
.pd-flat .top{display:flex;align-items:center;gap:10px}
.pd-flat .ftile{width:34px;height:34px;border:2px solid var(--mk);border-radius:9px;background:var(--mcr);display:grid;place-items:center;font-weight:900;font-size:13px;flex:none}
.pd-flat .fnm{font-size:14px;font-weight:900;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.pd-flat .fmeta{font-size:10.5px;color:var(--soft);font-weight:650;margin-top:1px}
.pd-flat .fpr{margin-left:auto;text-align:right;flex:none}
.pd-flat .fpr .a{font-size:14px;font-weight:900;font-variant-numeric:tabular-nums}.pd-flat .fpr .l{font:700 8px ui-monospace,Menlo,monospace;color:var(--soft);text-transform:uppercase}
.fst{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;border:2px solid var(--mk);border-radius:6px;padding:2px 6px;box-shadow:1.2px 1.2px 0 var(--mk)}
.fst.ok{background:#d9f4e6;color:#0c6b45}.fst.vac{background:#fdeaee;color:#b3123a}.fst.due{background:#fff2c9;color:#7a4d00}
.fst.bhk{background:var(--mcr);color:var(--soft)}
.pd-who{display:inline-block;font-size:11px;color:var(--mblue);font-weight:800;margin-top:2px;text-decoration:none;cursor:pointer}
.pd-who .dim{color:var(--soft);font-weight:700}
.pd-facts{display:flex;margin:11px 0 0;border:2px solid var(--mk);border-radius:10px;overflow:hidden;background:var(--mw)}
.pd-facts .f{flex:1;min-width:0;padding:7px 9px;border-right:1.5px dashed var(--mln)}
.pd-facts .f:last-child{border-right:0}
.pd-facts .l{font:800 7.5px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--soft)}
.pd-facts .v{font-size:13px;font-weight:900;margin-top:2px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pd-facts .v.g{color:var(--mgreen)}.pd-facts .v.r{color:var(--mrose)}
.pd-facts .sb{font-size:9px;color:var(--soft);font-weight:700;margin-top:1px;white-space:nowrap}
.pd-flat .fact{display:flex;gap:7px;margin-top:10px}
.pd-fbtn{flex:1;text-align:center;font-size:11.5px;font-weight:800;border:2px solid var(--mk);border-radius:9px;padding:7px;box-shadow:2px 2px 0 var(--mk);cursor:pointer}
.pd-fbtn.g{background:var(--mgreen);color:#fff}.pd-fbtn.wa{background:#25D366;color:#08331b}.pd-fbtn.dk{background:var(--mk);color:#fff}.pd-fbtn.pl{background:var(--mw)}
.pd-drow{display:flex;align-items:center;gap:8px;padding:8px 0;border-top:1.5px dashed var(--mln);font-size:12px}
.pd-drow:first-child{border-top:0}
.pd-drow .dl{font-weight:750;color:var(--soft);display:flex;align-items:center;gap:6px}
.pd-drow .dv{margin-left:auto;font-weight:850;text-align:right}.pd-drow .dv a{color:var(--mblue);font-weight:800;cursor:pointer}
.pd-chips{display:flex;flex-wrap:wrap;gap:6px}
.pd-chip{font-size:11px;font-weight:750;background:var(--mp);border:2px solid var(--mk);border-radius:8px;padding:4px 8px;box-shadow:1.5px 1.5px 0 var(--mk);display:inline-flex;gap:5px;align-items:center}
.pd-chip b{font-weight:850}
.pd-inh{font-size:11px;color:var(--soft);font-weight:700;margin-bottom:9px}.pd-inh a{color:var(--mblue);font-weight:800;cursor:pointer}
.pd-dropz{display:block;border:2.5px dashed var(--mln);border-radius:13px;padding:18px;text-align:center;background:var(--mp);cursor:pointer}
.pd-dropz .ic{font-size:28px}.pd-dropz .t{font-weight:850;font-size:13px;margin-top:4px}.pd-dropz .n{font-size:10.5px;color:var(--soft);font-weight:650;margin-top:3px}
.pd-photos{display:flex;gap:8px;flex-wrap:wrap}
.pd-ph{width:106px;height:76px;border:2px solid var(--mk);border-radius:10px;object-fit:cover;display:block}
/* ---- flat/unit detail (Version A) ---- */
.fst.blue{background:#dfe4ff;color:#1a2a9c}.fst.mut{background:#eceae4;color:#6b675f}
.pd-hero{position:relative}
.pd-hero.r-g{border-left:7px solid var(--mgreen)}.pd-hero.r-a{border-left:7px solid var(--mamber)}.pd-hero.r-r{border-left:7px solid var(--mrose)}
.pd-rstamp{position:absolute;top:12px;right:12px;transform:rotate(9deg);font:800 12px ui-monospace,Menlo,monospace;letter-spacing:.12em;padding:3px 9px;border-radius:7px;border:2.5px solid var(--mgreen);color:var(--mgreen)}
.pd-rstamp.a{border-color:var(--mamber);color:var(--mamber)}.pd-rstamp.r{border-color:var(--mrose);color:var(--mrose)}
.pd-add{color:var(--mblue);cursor:pointer;font-weight:800}
.pd-big{font-size:29px;font-weight:900;letter-spacing:-.03em;line-height:1;margin-top:2px;font-variant-numeric:tabular-nums}
.pd-big .per{font-size:13px;font-weight:800;color:var(--soft)}
.pd-split{font-size:12px;font-weight:700;color:var(--soft);margin-top:5px}.pd-split b{color:var(--mk);font-weight:850}
.pd-trow{display:flex;align-items:center;gap:11px;border:2px solid var(--mk);border-radius:12px;background:var(--mcr);padding:10px 11px;box-shadow:2px 2px 0 var(--mk);cursor:pointer}
.pd-av{width:42px;height:42px;border-radius:11px;border:2.5px solid var(--mk);background:var(--sun);display:grid;place-items:center;font-size:17px;font-weight:900;flex:none;box-shadow:2px 2px 0 var(--mk)}
.pd-tnm{font-size:15px;font-weight:900;display:flex;align-items:center;gap:6px;flex-wrap:wrap;line-height:1.1}
.pd-tmt{font-size:11px;color:var(--soft);font-weight:700;margin-top:2px}
.pd-trow .pd-go{margin-left:auto;font-size:17px;font-weight:900;color:var(--soft);flex:none}
.pd-contacts{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.pd-cbtn{display:flex;align-items:center;gap:5px;border:2px solid var(--mk);border-radius:10px;background:var(--mp);padding:7px 11px;font-size:11.5px;font-weight:800;box-shadow:2px 2px 0 var(--mk);cursor:pointer;color:var(--mk)}
.pd-cbtn.g{background:var(--mgreen);color:#fff}.pd-cbtn.wa{background:#d9f4e6}
.pd-bar{height:11px;border:2px solid var(--mk);border-radius:7px;overflow:hidden;background:var(--mp);display:flex;margin:5px 0}
.pd-bar i{height:100%;background:repeating-linear-gradient(45deg,var(--sun),var(--sun) 7px,#ffe89a 7px,#ffe89a 14px)}
.pd-barcap{display:flex;justify-content:space-between;font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--soft)}
.pd-dgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pd-dcell{border:1.8px solid var(--mln);border-radius:10px;padding:8px 10px;background:var(--mp)}
.pd-dcell .dl{font:800 8px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--soft)}
.pd-dcell .dv{font-size:13.5px;font-weight:850;margin-top:3px}
.pd-lrow{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1.5px dashed var(--mln)}
.pd-lrow:first-of-type{border-top:0}
.pd-lrow .mo{font-size:12.5px;font-weight:850}.pd-lrow .mo small{color:var(--mut);font-weight:700;font-size:10px;margin-left:5px}
.pd-lrow .amt{margin-left:auto;font-size:12.5px;font-weight:900}
.pd-exrow{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1.5px dashed var(--mln)}
.pd-exrow:first-of-type{border-top:0}
.pd-exrow .ic{width:28px;height:28px;border:2px solid var(--mk);border-radius:8px;background:var(--mcr);display:grid;place-items:center;font-size:13px;flex:none}
.pd-exrow .ea{margin-left:auto;font-weight:900;color:var(--mrose)}
.pd-hist{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1.5px dashed var(--mln)}
.pd-hist:first-of-type{border-top:0}
.pd-hist .dot{width:26px;height:26px;border-radius:50%;border:2px solid var(--mk);background:#eceae4;display:grid;place-items:center;font-size:11px;font-weight:900;flex:none}
.pd-hist .hn{font-size:12.5px;font-weight:850}.pd-hist .hm{font-size:10.5px;color:var(--soft);font-weight:700}
.pd-hist .hb{margin-left:auto;font:800 8.5px ui-monospace,Menlo,monospace;color:var(--soft)}
.pd-actions{display:flex;gap:7px;flex-wrap:wrap}
.pd-fbtn2{flex:1;min-width:calc(50% - 4px);text-align:center;border:2px solid var(--mk);border-radius:10px;background:var(--mw);padding:8px;font-size:12px;font-weight:800;box-shadow:2px 2px 0 var(--mk);cursor:pointer;text-decoration:none;color:var(--mk)}
.pd-fbtn2.pri{background:var(--mblue);color:#fff}.pd-fbtn2.am{background:var(--mamber);color:#fff}.pd-fbtn2.danger{color:var(--mrose)}
/* ---- agreements hub ---- */
.ag-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media(max-width:452px){.ag-stats{grid-template-columns:1fr 1fr}}
.ag-filters{display:flex;flex-wrap:wrap;gap:7px;margin:0 2px 13px}
.ag-chip{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;background:var(--mw);border:2px solid var(--mk);border-radius:8px;padding:6px 10px;box-shadow:2px 2px 0 var(--mk);cursor:pointer;color:var(--soft)}
.ag-chip.on{background:var(--mblue);color:#fff}
.ag-chip:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--mk)}
/* ---- tenant portal ---- */
.tport-break{margin-top:12px;border:2px solid var(--mk);border-radius:12px;padding:10px 12px;background:var(--mw);font-size:12.5px}
.tport-break .row{display:flex;justify-content:space-between;gap:12px;padding:3px 0;font-weight:700}
.tport-break .row.tot{margin-top:5px;padding-top:7px;border-top:1.5px solid var(--mk);font-weight:900}
.tport-pay{display:block;width:100%;margin-top:14px;border:2.5px solid var(--mk);border-radius:13px;background:var(--mgreen);color:#fff;font-size:15px;font-weight:900;padding:13px;box-shadow:4px 4px 0 var(--mk);cursor:pointer}
.tport-pay:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--mk)}
.tport-note{margin-top:10px;border:2px solid var(--mk);border-radius:11px;background:var(--mcr);padding:9px 11px;font-size:12px;font-weight:750}
.tport-streak{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tport-streak i{width:17px;height:17px;border:2px solid var(--mk);border-radius:5px;background:var(--mw);flex:none}
.tport-streak i.on{background:var(--mgreen)}
.tport-streak i.off{background:#fdeaee}
/* ---- explore (premium) ---- */
.exp-search{display:flex;align-items:center;gap:8px;border:2.5px solid var(--mk);border-radius:13px;background:var(--mw);box-shadow:3px 3px 0 var(--mk);padding:9px 12px;margin-bottom:11px}
.exp-search .mag{font-size:15px;flex:none}
.exp-search input{flex:1;border:0;background:none;font-size:14px;font-weight:650;color:var(--mk);outline:none;min-width:0}
.exp-search .go{flex:none;border:2px solid var(--mk);border-radius:9px;background:var(--mblue);color:#fff;font:800 11px ui-monospace,Menlo,monospace;padding:6px 11px;box-shadow:2px 2px 0 var(--mk);cursor:pointer}
.exp-chips{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-bottom:11px}
.exp-fchip{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.02em;text-transform:uppercase;background:var(--mw);border:2px solid var(--mk);border-radius:8px;padding:6px 10px;box-shadow:2px 2px 0 var(--mk);cursor:pointer;color:var(--soft);white-space:nowrap}
.exp-fchip.on{background:var(--sun);color:var(--mk)}
.exp-pills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:11px}
.exp-pill{font:800 10px ui-monospace,Menlo,monospace;text-transform:uppercase;background:var(--mcr);border:2px solid var(--mk);border-radius:20px;padding:4px 10px;cursor:pointer}
.exp-pill.clear{background:var(--mk);color:#fff}
.exp-count{font-size:12px;font-weight:750;color:var(--soft);margin:0 2px 11px}.exp-count b{color:var(--mk)}
.exp-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:981px){.exppage{max-width:980px}.exp-grid{grid-template-columns:1fr 1fr 1fr}}
.exp-card{border:2.5px solid var(--mk);border-radius:16px;box-shadow:4px 4px 0 var(--mk);background:var(--mw);overflow:hidden;display:flex;flex-direction:column}
.exp-photo{position:relative;height:168px;border-bottom:2.5px solid var(--mk);background:#e7e2d8;overflow:hidden}
.exp-photo img{width:100%;height:100%;object-fit:cover;display:block}
.exp-photo.noimg{display:grid;place-items:center;background:linear-gradient(135deg,#cfd7ff,#eafaf1 55%,#ffe9c9)}
.exp-photo.noimg::after{content:"🏢";font-size:44px}
.exp-photo.noimg img{display:none}
.exp-ribbon{position:absolute;top:10px;left:10px;font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;background:var(--mgreen);color:#fff;border:2px solid var(--mk);border-radius:7px;padding:3px 8px;box-shadow:2px 2px 0 var(--mk)}
.exp-avail{position:absolute;bottom:10px;left:10px;font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;border:2px solid var(--mk);border-radius:7px;padding:3px 8px;box-shadow:1.5px 1.5px 0 var(--mk)}
.exp-avail.free{background:#d9f4e6;color:#0c6b45}.exp-avail.full{background:#eceae4;color:#6b675f}
.exp-body{padding:12px 13px 13px}
.exp-price{font-size:20px;font-weight:900;letter-spacing:-.02em}.exp-price span{font-size:12px;font-weight:750;color:var(--soft)}
.exp-nm{font-size:15px;font-weight:900;margin-top:2px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.exp-loc{font-size:11.5px;color:var(--soft);font-weight:700;margin-top:2px}
.exp-specs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.exp-cta{display:block;text-align:center;margin-top:12px;border:2.5px solid var(--mk);border-radius:11px;background:var(--mgreen);color:#fff;font-size:13px;font-weight:850;padding:10px;box-shadow:3px 3px 0 var(--mk);text-decoration:none}
.exp-cta.manage{background:var(--mblue)}
.pp-roll{display:flex;align-items:center;gap:8px;margin-top:12px;padding-top:11px;border-top:1.5px dashed var(--mln);font-size:11.5px;color:var(--soft);font-weight:700}.pp-roll b{color:var(--mk);font-size:16px;font-weight:900}
.pp-nudge{display:flex;align-items:center;gap:10px;background:var(--sun);border-top:2.5px solid var(--mk);padding:11px 14px}
.pp-nudge.rose{background:#fdeaee}
.pp-nudge .txt{font-size:12px;font-weight:800;line-height:1.25}
.pp-nudge .txt span{display:block;font-size:10.5px;font-weight:700;color:#6b675f;margin-top:1px}
.pp-nudge .fill{margin-left:auto;flex:none;font-size:12px;font-weight:900;color:#fff;background:var(--mk);border:2px solid var(--mk);border-radius:10px;padding:8px 12px;box-shadow:2px 2px 0 rgba(0,0,0,.25);cursor:pointer}
.pp-nudge .fill.grn{background:var(--mgreen)}
.pp-foot{display:flex;align-items:center;gap:10px;padding:9px 14px;border-top:1.5px dashed var(--mln);font-size:11.5px;font-weight:800;color:var(--soft);cursor:pointer}
.pp-foot .st{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-foot .vw{margin-left:auto;flex:none;display:flex;align-items:center;gap:5px;color:var(--mblue)}
.pp-foot .go{color:var(--mblue);font-weight:900;font-size:15px}
.pp-tmplcard{background:var(--mcr);border:2.5px solid var(--mk);border-radius:17px;box-shadow:4px 4px 0 var(--mk);padding:14px;margin-bottom:12px}
.pp-tmplrow{display:flex;align-items:center;gap:10px;cursor:pointer}
.pp-tmpllab{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);display:flex;align-items:center;gap:7px}
.pp-tmpllab .si{width:21px;height:21px;border:2px solid var(--mk);border-radius:6px;display:grid;place-items:center;font-size:11px;background:var(--mw)}
.pp-tmplt{font-size:14.5px;font-weight:900;line-height:1.25;margin-top:6px}
.pp-tmpls{font-size:11.5px;color:#6b675f;font-weight:700;margin-top:2px}
.pp-tmplgo{margin-left:auto;color:var(--mblue);font-weight:900;font-size:18px;flex:none}
.pp-tchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.pp-tchip{font:800 9.5px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;background:var(--mw);border:2px solid var(--mk);border-radius:7px;padding:4px 8px;box-shadow:1.5px 1.5px 0 var(--mk)}
.pp-tchip.act{color:var(--mblue);cursor:pointer}
.pmphoto{display:flex;align-items:center;gap:12px;position:relative;cursor:pointer;padding:4px 2px 12px;border-bottom:1px solid var(--line);margin-bottom:8px}
.pmphoto .cam{position:absolute;left:44px;bottom:9px;width:22px;height:22px;border-radius:50%;background:var(--surface);border:2px solid var(--ink);display:grid;place-items:center;font-size:10px}
/* ================= airy (Home & Rent) ================= */
.airy{--acard:#FFFFFF;--ahair:rgba(26,24,21,.07);--aink:#1A1815;--asoft:#5c574f;--amut:#928c81;--aline:#e4ded3;--ablue:#2743F0;--agreen:#127a53;--arose:#c8324f;--aamber:#a76a00;--acream:#F7E8DA;--awhite:#FDFBF6;--apaper2:#F1EFE9;
  max-width:640px;margin:0 auto;color:var(--aink)}
.airy .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.airy .s-paid{color:var(--agreen)}.airy .s-conf{color:var(--ablue)}.airy .s-over{color:var(--arose)}.airy .s-due{color:var(--aamber)}
.a-dot{width:7px;height:7px;border-radius:50%;flex:none;display:inline-block}
.a-d-paid{background:var(--agreen)}.a-d-conf{background:var(--ablue)}.a-d-over{background:var(--arose)}.a-d-due{background:var(--aamber)}
.a-m-paid{background:var(--agreen)}.a-m-conf{background:var(--ablue)}.a-m-over{background:var(--arose)}.a-m-due{background:var(--aamber)}
.a-mnav{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 17px}
.a-mnav button{width:36px;height:36px;border-radius:11px;border:1px solid var(--ahair);background:var(--acard);box-shadow:0 1px 2px rgba(26,24,21,.03);font-size:16px;color:var(--asoft);cursor:pointer}
.a-mnav .lab{min-width:150px;text-align:center}.a-mnav .lab b{display:block;font-size:16px;font-weight:750;letter-spacing:-.01em}.a-mnav .lab small{font-size:10px;color:var(--amut);font-family:ui-monospace,Menlo,monospace;letter-spacing:.08em}
.a-card{background:var(--acard);border:1px solid var(--ahair);border-radius:20px;box-shadow:0 1px 2px rgba(26,24,21,.035),0 22px 44px -34px rgba(26,24,21,.55);padding:19px;margin-bottom:15px}
.a-lbl{font:700 10.5px ui-monospace,Menlo,monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--amut);display:flex;align-items:center;gap:8px;margin:0 0 13px}
.a-lbl .r{margin-left:auto;text-transform:none;letter-spacing:.01em;font-size:11px;color:var(--asoft)}.a-lbl .r a{color:var(--ablue);text-decoration:none;cursor:pointer}
.a-collect .a-amt{font-size:37px;font-weight:800;letter-spacing:-.035em;line-height:1}
.a-collect .a-of{font-size:13px;color:var(--amut);font-weight:600;margin-top:5px}.a-collect .a-of b{color:var(--asoft);font-weight:750}
.a-meter{display:flex;gap:3px;height:9px;margin:15px 0 12px;border-radius:6px;overflow:hidden;background:#eceae3}.a-meter i{height:100%}
.a-substats{display:flex;border-top:1px solid var(--ahair);padding-top:14px}
.a-substats .s{flex:1}.a-substats .s + .s{border-left:1px solid var(--ahair);padding-left:14px}
.a-substats .k{font:700 9px ui-monospace,Menlo,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--amut)}
.a-substats .v{font-size:17px;font-weight:800;letter-spacing:-.02em;margin-top:5px}
.a-prompt{display:flex;align-items:center;gap:10px;background:#eef0ff;border:1px solid #d9ddff;border-radius:14px;padding:11px 15px;margin-bottom:15px;font-size:12.5px;color:#2a2f6b;font-weight:600}
.a-prompt a{margin-left:auto;color:var(--ablue);font-weight:750;text-decoration:none;white-space:nowrap;cursor:pointer}
.a-sect{font:700 10px ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--amut);margin:20px 4px 9px;display:flex;align-items:center;gap:7px}
.a-sect .n{background:var(--aink);color:#fff;border-radius:20px;font-size:9.5px;padding:1px 7px}
.a-frow{background:var(--acard);border:1px solid var(--ahair);border-radius:16px;box-shadow:0 1px 2px rgba(26,24,21,.03);margin-bottom:10px;overflow:hidden}
.a-frow.att{border-color:#f0d9c2}
.a-frow summary{list-style:none;cursor:pointer}.a-frow summary::-webkit-details-marker{display:none}
.a-fsum{display:flex;align-items:center;gap:12px;padding:13px 14px}
.a-av{width:40px;height:40px;border-radius:12px;background:var(--acream);border:1px solid var(--ahair);display:grid;place-items:center;font-weight:800;font-size:14px;color:var(--asoft);flex:none}
.a-fmid{flex:1;min-width:0}.a-fmid b{font-size:14.5px;font-weight:750;letter-spacing:-.01em;display:block}.a-fmid small{font-size:11.5px;color:var(--amut)}
.a-pline{height:4px;border-radius:3px;background:#ece9e2;margin-top:8px;overflow:hidden}.a-pline i{display:block;height:100%}
.a-frt{text-align:right;flex:none}.a-frt .a-n{font-size:15px;font-weight:800;letter-spacing:-.02em}
.a-frt .a-st{font:700 10px ui-monospace,Menlo,monospace;letter-spacing:.02em;display:inline-flex;align-items:center;gap:5px;margin-top:3px}
.a-fbody{padding:0 14px 14px}
.a-grp{margin-top:12px}
.a-gh{font:700 9px ui-monospace,Menlo,monospace;letter-spacing:.07em;text-transform:uppercase;color:var(--amut);margin-bottom:6px}
.a-brk{background:var(--apaper2);border:1px solid var(--ahair);border-radius:12px;padding:11px 13px}
.a-br{display:flex;justify-content:space-between;align-items:center;padding:4px 0;font-size:13px}.a-br span{color:var(--asoft)}.a-br b{font-weight:700}
.a-br .a-tag{font:700 8px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;background:#f6efdd;color:var(--aamber);border-radius:5px;padding:1px 5px;margin-left:6px}
.a-br.add b{color:var(--aamber)}.a-br.cred b{color:var(--agreen)}
.a-br.total{border-top:1px solid var(--ahair);margin-top:4px;padding-top:8px;font-weight:800}.a-br.total span{color:var(--aink);font-weight:800}
.a-pay{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:12.5px;border-bottom:1px dashed var(--aline)}.a-pay:last-child{border-bottom:0}
.a-pl{color:var(--asoft);display:flex;align-items:center;gap:7px}.a-md{font:700 8px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;background:#e9f0ff;color:var(--ablue);border-radius:5px;padding:1px 5px}
.a-pay b{font-weight:750;color:var(--agreen)}
.a-nopay{font-size:12px;color:var(--amut);padding:4px 0}
.a-balrow{display:flex;justify-content:space-between;margin-top:8px;padding-top:8px;border-top:1px solid var(--ahair);font-size:13px;font-weight:800}
.a-bv.pos{color:var(--arose)}.a-bv.zero{color:var(--agreen)}
.a-invbar{display:flex;gap:8px;margin-top:13px;flex-wrap:wrap}
.a-ilink{flex:1;min-width:130px;display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--aink);background:var(--awhite);border:1px solid var(--ahair);border-radius:12px;padding:10px 12px;box-shadow:0 1px 2px rgba(26,24,21,.03);cursor:pointer}
.a-ilink .ic{width:30px;height:30px;border-radius:9px;background:var(--acream);border:1px solid var(--ahair);display:grid;place-items:center;font-size:14px;flex:none}
.a-ilink .it{flex:1;min-width:0}.a-ilink .it b{font-size:12.5px;font-weight:700;display:block}.a-ilink .it small{font-size:10.5px;color:var(--amut)}
.a-ilink .ar{color:var(--ablue);font-weight:800}
.a-acts{display:flex;gap:16px;margin-top:12px;flex-wrap:wrap}
.a-acts a{font-size:12.5px;font-weight:700;text-decoration:none;color:var(--asoft);cursor:pointer}.a-acts a.pri{color:var(--ablue)}
/* airy — Home extras */
.a-hdr{display:flex;align-items:center;gap:12px;margin:0 4px 18px}
.a-hdr .g{flex:1;min-width:0}.a-hdr h2{font-size:22px;font-weight:800;letter-spacing:-.02em;margin:0}.a-hdr p{margin:2px 0 0;font-size:12.5px;color:var(--amut);font-weight:500}
.a-hav{width:40px;height:40px;border-radius:50%;background:var(--acream);border:1px solid var(--ahair);display:grid;place-items:center;font-weight:800;font-size:15px;color:var(--asoft);flex:none}
.a-setup{display:flex;align-items:center;gap:12px;background:var(--acard);border:1px solid var(--ahair);border-radius:16px;box-shadow:0 1px 2px rgba(26,24,21,.03);padding:12px 15px;margin-bottom:15px}
.a-setup .g{flex:1;min-width:0}.a-setup .t{font-size:12.5px;font-weight:700}.a-setup .s{font-size:11.5px;color:var(--amut)}
.a-setup .ring{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:none}
.a-setup .ring b{width:28px;height:28px;border-radius:50%;background:var(--acard);display:grid;place-items:center;font:700 10px ui-monospace,Menlo,monospace;color:var(--asoft)}
.a-collect .a-amt .of2{font-size:16px;font-weight:600;color:var(--amut);letter-spacing:-.01em}
.a-three{display:flex;margin-top:16px}
.a-three .p{flex:1;padding-right:8px}.a-three .p + .p{border-left:1px solid var(--ahair);padding-left:14px}
.a-three .c{display:flex;align-items:center;gap:6px;font:700 9.5px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--amut)}
.a-three .v{font-size:17px;font-weight:800;letter-spacing:-.02em;margin-top:6px}.a-three .ct{font-size:11px;color:var(--amut);margin-top:1px}
.a-next{position:relative;padding-left:14px}.a-next::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:3px;border-radius:3px;background:var(--ablue)}
.a-next .t{font-size:14.5px;font-weight:750;letter-spacing:-.01em}.a-next .m{font-size:12.5px;color:var(--asoft);margin-top:3px}
.a-hflat{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--ahair);cursor:pointer}
.a-card .a-hflat:first-of-type{border-top:0;padding-top:2px}
.a-hmid{flex:1;min-width:0}.a-hmid b{font-size:14.5px;font-weight:700;letter-spacing:-.01em;display:block}.a-hmid small{font-size:11.5px;color:var(--amut)}
.a-hrt{text-align:right;flex:none}.a-hrt .a-n{font-size:14.5px;font-weight:750}
.a-hrt .a-st{font:700 10.5px ui-monospace,Menlo,monospace;letter-spacing:.02em;display:inline-flex;align-items:center;gap:5px;margin-top:2px}
.a-rowacts{display:flex;gap:16px;padding:0 0 12px 52px;margin-top:-4px}.a-rowacts a{font-size:12.5px;font-weight:700;text-decoration:none;color:var(--asoft);cursor:pointer}.a-rowacts a.pri{color:var(--ablue)}
.a-vacrow{display:flex;align-items:center;gap:12px;padding:12px 0 2px;border-top:1px solid var(--ahair)}
.a-av.vac{background:transparent;border:1px dashed var(--aline);color:var(--amut)}
.a-addlink{color:var(--ablue);font-weight:700;font-size:12.5px;text-decoration:none;cursor:pointer}
.a-idc{text-align:center;padding:4px 0 2px}.a-idc .eq{font-size:12.5px;color:var(--asoft);font-weight:500}
.a-idc .kept{font-size:33px;font-weight:800;letter-spacing:-.03em;margin:5px 0 1px}.a-idc .cap{font-size:11.5px;color:var(--amut)}
.a-spark{display:flex;align-items:flex-end;gap:7px;height:56px;margin:18px 8px 6px;justify-content:center}
.a-spark i{flex:1;max-width:26px;background:#e2ddd3;border-radius:4px 4px 2px 2px}.a-spark i.on{background:var(--ablue)}
.a-sparkcap{text-align:center;font:600 11px ui-monospace,Menlo,monospace;letter-spacing:.03em;color:var(--amut)}
.a-minirow{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-top:1px solid var(--ahair);font-size:13px}.a-minirow span{color:var(--asoft)}.a-minirow b{font-weight:750}
.a-stmt{display:block;margin-top:14px;text-align:center;font-size:13px;font-weight:700;color:var(--ablue);text-decoration:none;cursor:pointer}
.a-qrow{display:flex;align-items:center;gap:12px;padding:13px 0;border-top:1px solid var(--ahair);text-decoration:none;color:var(--aink);cursor:pointer}
.a-card .a-qrow:first-of-type{border-top:0;padding-top:2px}
.a-qrow .qic{width:34px;height:34px;border-radius:11px;background:var(--apaper2);border:1px solid var(--ahair);display:grid;place-items:center;font-size:15px;color:var(--asoft);flex:none}
.a-qrow .qt{flex:1;font-size:14px;font-weight:650}.a-qrow .ar{color:var(--amut);font-size:16px}
/* ===== airy → CHITTI brand skin (Home & Rent unified with the rest of the app) ===== */
.airy{--acard:#FFFDF8;--awhite:#FFFDF8;--acream:#FFF0D6;--apaper2:#F6EEDD;--aink:#161513;--asoft:#4a463f;--amut:#6b675f;--aline:#ddd4c4;--ahair:#ddd4c4;--ablue:#2743F0;--agreen:#1B9E6B;--arose:#E85D75;--aamber:#E58A00;--asun:#FFD84D}
.a-card,.a-frow{border:2.5px solid var(--aink);border-radius:16px;box-shadow:4px 4px 0 var(--aink)}
.a-frow.att{border-color:var(--aink)}
.a-brk,.a-ilink{border:2px solid var(--aink);box-shadow:2px 2px 0 var(--aink);border-radius:10px}
.a-av{border:2px solid var(--aink);background:var(--asun);color:var(--aink)}
.a-av.vac{background:transparent;border:2px dashed var(--aline);color:var(--amut)}
.a-mnav button{border:2px solid var(--aink);box-shadow:2px 2px 0 var(--aink)}
.a-setup,.a-prompt{border:2px solid var(--aink);box-shadow:2px 2px 0 var(--aink)}
.a-hav{border:2px solid var(--aink);background:var(--asun);color:var(--aink)}
.a-qrow .qic,.a-setup .ring b{border:2px solid var(--aink)}
.a-md,.md{background:#e9edff}
.a-ilink.prime{background:var(--asun);border-color:var(--aink);color:var(--aink)}
.a-ilink.prime .ic{background:rgba(0,0,0,.08);border-color:transparent}
.a-ilink.prime .it small{color:#5c4b00}.a-ilink.prime .ar{color:var(--aink)}
.a-doclink{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:11.5px;font-weight:750;color:var(--asoft);text-decoration:none;cursor:pointer}
.a-doclink .st{font:700 8px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--amut);border:1px solid var(--aline);border-radius:5px;padding:1px 5px}

/* ===== Properties · portfolio summary card (V1 stacked bar) ===== */
.pf-card{position:relative;border-radius:20px;padding:15px;margin-bottom:14px;overflow:hidden;
  background:linear-gradient(160deg,#fffdf8,#f6f2ea);border:1px solid rgba(22,21,19,.06);
  box-shadow:0 14px 30px -18px rgba(30,20,60,.28),inset 0 1px 0 rgba(255,255,255,.9)}
.pf-sect{display:flex;align-items:center;gap:7px;font:800 11px system-ui;color:var(--soft);letter-spacing:.01em;text-transform:uppercase}
.pf-sect span{font-size:14px}
.pf-row{display:flex;gap:16px;margin-top:13px;align-items:center}
.pf-col{width:44px;height:140px;border-radius:12px;overflow:hidden;display:flex;flex-direction:column-reverse;flex:none;background:rgba(22,21,19,.05);box-shadow:inset 0 1px 4px rgba(30,20,60,.12)}
.pf-col span{width:100%;display:block}
.pf-col .f{background:linear-gradient(180deg,#33c98a,#149a60)}
.pf-col .o{background:linear-gradient(180deg,#ff8298,#e85d75)}
.pf-col .e{background:transparent}
.pf-leg{flex:1;display:flex;flex-direction:column;gap:9px;min-width:0}
.pf-l{display:flex;align-items:center;gap:8px;font-size:13px}
.pf-l .nm{font-weight:750;color:#161513}
.pf-l .ct{font-weight:800;margin-left:auto;color:#161513}
.pf-l .ct.r{color:#b3123a}
.pf-l .mo{color:var(--soft);font-weight:700;font-size:11px;min-width:64px;text-align:right}
.pf-l.sub .nm{color:var(--soft);font-size:11.5px}
.pf-l.tot{border-top:1px solid rgba(22,21,19,.1);padding-top:8px;font-weight:800}
.pf-d{width:11px;height:11px;border-radius:4px;flex:none}
.pf-d.f{background:linear-gradient(180deg,#33c98a,#149a60)}
.pf-d.o{background:linear-gradient(180deg,#ff8298,#e85d75)}
.pf-d.e{background:#d9d3c5;border:1.5px dashed rgba(22,21,19,.3)}
.pf-roll{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;padding-top:11px;border-top:1px solid rgba(22,21,19,.1);font-size:11.5px;color:var(--soft);font-weight:650}
.pf-roll b{color:#161513;font-size:15px}
.pf-over{color:#b3123a;font-weight:800;white-space:nowrap}

/* ===== Properties + Tenants · aurora conversion ===== */
/* page header */
.tpage .pf-head{display:flex;align-items:flex-end;gap:10px;margin:2px 2px 14px}
.tpage .pf-title{margin:0;font-size:25px;letter-spacing:-.02em;font-weight:800;color:#161513}
.tpage .pf-sub{color:var(--soft);font-size:12.5px;font-weight:600;margin-top:3px;line-height:1.35}
.pf-add{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;cursor:pointer;
  border-radius:24px;padding:10px 17px;font-weight:800;font-size:13px;color:#fff;
  background:linear-gradient(165deg,#31c986,#149a60);box-shadow:0 10px 22px -8px rgba(20,154,96,.75),inset 0 1px 0 rgba(255,255,255,.4)}
.pf-add::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.5),transparent 52%);pointer-events:none}
.pf-add:active{transform:translateY(1px)}

/* portfolio card (frosted, jar) */
.pf-card{position:relative;border-radius:22px;padding:16px;margin-bottom:14px;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,253,248,.9),rgba(255,253,248,.6));
  backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,255,255,.65);box-shadow:0 16px 38px -18px rgba(30,20,60,.32),inset 0 1px 0 rgba(255,255,255,.85)}
.pf-sect{display:flex;align-items:center;gap:7px;font:800 11px system-ui;color:var(--soft);letter-spacing:.01em;text-transform:uppercase}
.pf-sect span{font-size:14px}
.pf-row{display:flex;gap:18px;margin-top:13px;align-items:center}
.pf-leg{flex:1;display:flex;flex-direction:column;gap:9px;min-width:0}
.pf-l{display:flex;align-items:center;gap:8px;font-size:13px}
.pf-l .nm{font-weight:750;color:#161513}
.pf-l .ct{font-weight:800;margin-left:auto;color:#161513}
.pf-l .ct.r{color:#b3123a}
.pf-l .mo{color:var(--soft);font-weight:700;font-size:11px;min-width:64px;text-align:right}
.pf-l.sub .nm{color:var(--soft);font-size:11.5px}
.pf-l.tot{border-top:1px solid rgba(22,21,19,.1);padding-top:8px;font-weight:800}
.pf-d{width:11px;height:11px;border-radius:4px;flex:none}
.pf-d.f{background:linear-gradient(180deg,#33c98a,#149a60)}
.pf-d.o{background:linear-gradient(180deg,#ff8298,#e85d75)}
.pf-d.e{background:#d9d3c5;border:1.5px dashed rgba(22,21,19,.3)}
.pf-roll{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;padding-top:11px;border-top:1px solid rgba(22,21,19,.1);font-size:11.5px;color:var(--soft);font-weight:650}
.pf-roll b{color:#161513;font-size:15px}
.pf-over{color:#b3123a;font-weight:800;white-space:nowrap}
.tg-jar .pf-od{position:absolute;left:0;right:0;top:0;background:linear-gradient(180deg,#ff8298,#e85d75);box-shadow:0 1px 0 rgba(255,255,255,.4);z-index:1}

/* building cards */
.pb-card{position:relative;border-radius:22px;margin-bottom:14px;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,253,248,.9),rgba(255,253,248,.6));
  backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,255,255,.65);box-shadow:0 16px 38px -18px rgba(30,20,60,.32),inset 0 1px 0 rgba(255,255,255,.85)}
.pb-body{padding:15px 15px 4px;cursor:pointer}
.pb-top{display:flex;align-items:center;gap:11px;margin-bottom:11px}
.pb-tile{width:46px;height:46px;border-radius:14px;flex:none;display:grid;place-items:center;font-weight:800;font-size:16px;color:#3a2c00;
  background:linear-gradient(160deg,#ffe27a,#f6c22c);box-shadow:0 6px 14px -6px rgba(230,160,0,.6),inset 0 1px 0 rgba(255,255,255,.6)}
.pb-tile.apt{color:#fff;background:linear-gradient(160deg,#5f79ff,#2743f0);box-shadow:0 6px 14px -6px rgba(39,67,240,.6),inset 0 1px 0 rgba(255,255,255,.4)}
.pb-nm{font-size:17px;font-weight:800;letter-spacing:-.01em;color:#161513}
.pb-mt{font-size:11.5px;color:var(--soft);font-weight:600;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pb-map{color:#2743f0;text-decoration:none}
.pb-badge{font:800 9.5px ui-monospace,Menlo,monospace;letter-spacing:.05em;padding:5px 10px;border-radius:14px;flex:none;text-transform:uppercase}
.pb-badge.vac{background:#fff0d9;color:#e58a00}
.pb-badge.full{background:#e0f6ec;color:#0f7a53}
.pb-strip{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:12px;font-weight:700;color:#161513;background:rgba(22,21,19,.045);border-radius:13px;padding:8px 11px;margin-bottom:10px}
.pb-strip .op{color:var(--soft);font-weight:800}
.pb-strip .s.f b{color:#0f7a53}.pb-strip .s.e b{color:#e58a00}.pb-strip .s.tot b{color:#161513}
.pb-roll{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--soft);font-weight:600;padding-bottom:11px}
.pb-roll b{color:#161513;font-size:15px}
.pb-cstat{font:800 10px ui-monospace,Menlo,monospace;letter-spacing:.03em;padding:5px 9px;border-radius:12px}
.pb-cstat.ok{background:#e0f6ec;color:#0f7a53}
.pb-cstat.bad{background:#ffe1e6;color:#b3123a}
.pb-nudge{display:flex;align-items:center;gap:10px;margin:0 12px 12px;padding:11px 13px;border-radius:15px;background:linear-gradient(160deg,#fff6df,#fff);border:1px solid rgba(230,160,0,.25)}
.pb-nudge.rose{background:linear-gradient(160deg,#fff0f2,#fff);border-color:rgba(179,18,58,.22)}
.pb-nudge .txt{flex:1;min-width:0;font-size:12.5px;font-weight:800;color:#161513}
.pb-nudge .txt span{display:block;font-size:11px;font-weight:600;color:var(--soft);margin-top:2px}
.pb-fill{position:relative;overflow:hidden;cursor:pointer;font-size:12px;font-weight:800;color:#3a2c00;padding:8px 13px;border-radius:20px;white-space:nowrap;
  background:linear-gradient(165deg,#ffdf6b,#f6c22c);box-shadow:0 7px 16px -7px rgba(230,160,0,.7)}
.pb-fill.grn{background:linear-gradient(165deg,#31c986,#149a60);color:#fff;box-shadow:0 7px 16px -7px rgba(20,154,96,.7)}
.pb-fill::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.45),transparent 55%);pointer-events:none}
.pb-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 15px;border-top:1px solid rgba(22,21,19,.07);font-size:11.5px;color:var(--soft);font-weight:600;cursor:pointer}
.pb-foot .vw{color:#2743f0;font-weight:800;white-space:nowrap;display:flex;align-items:center;gap:4px}
.pb-foot .go{font-size:16px}

/* agreement template */
.pb-tmpl{border-radius:20px;padding:14px;margin-bottom:10px;background:linear-gradient(160deg,rgba(247,232,218,.7),rgba(255,253,248,.45));border:1px dashed rgba(22,21,19,.2)}
.pb-tmplrow{display:flex;align-items:center;gap:10px;cursor:pointer}
.pb-tmpllab{display:flex;align-items:center;gap:7px;font-weight:800;font-size:13px;color:#161513}
.pb-tmplt{font-size:12px;color:#161513;font-weight:700;margin-top:2px}
.pb-tmpls{font-size:11px;color:var(--soft);font-weight:600;margin-top:2px}
.pb-tmplgo{margin-left:auto;font-size:20px;color:var(--soft)}
.pb-tchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.pb-tchip{font:700 10.5px ui-monospace,Menlo,monospace;letter-spacing:.02em;padding:5px 9px;border-radius:12px;background:rgba(255,255,255,.72);border:1px solid rgba(22,21,19,.08);color:#161513}
.pb-tchip.act{background:#e4e9ff;color:#2743f0;border-color:rgba(39,67,240,.2);cursor:pointer}

/* tenants summary tiles */
.tn-sumrow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:6px}
.tn-sum{border-radius:17px;padding:13px 11px;text-align:center;background:linear-gradient(160deg,rgba(255,253,248,.9),rgba(255,253,248,.58));
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.65);box-shadow:0 10px 26px -14px rgba(30,20,60,.3),inset 0 1px 0 rgba(255,255,255,.8)}
.tn-sum .v{font-size:21px;font-weight:800;letter-spacing:-.02em;color:#161513}
.tn-sum .l{font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.06em;color:var(--soft);text-transform:uppercase;margin-top:4px}

/* tenant cards */
.tn-card{position:relative;border-radius:20px;margin-bottom:13px;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,253,248,.9),rgba(255,253,248,.6));
  backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,255,255,.65);box-shadow:0 16px 38px -18px rgba(30,20,60,.32),inset 0 1px 0 rgba(255,255,255,.85)}
.tn-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--ac,#2743f0);z-index:2}
.tn-h{display:flex;align-items:flex-start;gap:12px;padding:15px 15px 13px;cursor:pointer}
.tn-card .avatar{width:46px;height:46px;border-radius:14px;flex:none;display:grid;place-items:center;font-weight:800;font-size:17px;color:#fff;
  background:var(--ac,#2743f0);background-image:linear-gradient(160deg,rgba(255,255,255,.28),rgba(0,0,0,.22));box-shadow:0 6px 14px -6px rgba(30,20,60,.5),inset 0 1px 0 rgba(255,255,255,.3)}
.tn-card .avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.tn-nm{font-size:16px;font-weight:800;letter-spacing:-.01em;color:#161513;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.tn-meta{font-size:11.5px;color:var(--soft);font-weight:600;margin-top:3px}
.tn-meta.money{color:#161513;font-weight:750}
.tn-stamp{display:flex;flex-direction:column;gap:5px;align-items:flex-end;flex:none}
.tn-acts{display:flex;align-items:center;gap:9px;padding:11px 14px;border-top:1px solid rgba(22,21,19,.07)}
.tn-ibs{display:flex;gap:8px}
.tn-ib{width:39px;height:39px;border-radius:13px;border:none;display:grid;place-items:center;font-size:15px;cursor:pointer;color:#fff;position:relative;overflow:hidden}
.tn-ib::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.45),transparent 55%);pointer-events:none}
.tn-ib.i1{background:linear-gradient(160deg,#5f79ff,#2743f0);box-shadow:0 7px 15px -7px rgba(39,67,240,.7)}
.tn-ib.i2{background:linear-gradient(160deg,#2ec27e,#149a60);box-shadow:0 7px 15px -7px rgba(20,154,96,.7)}
.tn-ib.i3{background:linear-gradient(160deg,#ffdf6b,#f6c22c);color:#3a2c00;box-shadow:0 7px 15px -7px rgba(230,160,0,.7)}
.tn-prim{margin-left:auto}
.tn-cta{position:relative;overflow:hidden;cursor:pointer;border:none;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;gap:5px;
  padding:9px 15px;border-radius:24px;font-weight:800;font-size:12.5px;color:#fff}
.tn-cta::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.45),transparent 55%);pointer-events:none}
.tn-cta.blu{background:linear-gradient(165deg,#4560ff,#1e37e0);box-shadow:0 8px 18px -7px rgba(39,67,240,.7)}
.tn-cta.grn{background:linear-gradient(165deg,#31c986,#149a60);box-shadow:0 8px 18px -7px rgba(20,154,96,.7)}
.tn-cta.amber{background:linear-gradient(165deg,#ffdf6b,#f6c22c);color:#3a2c00;box-shadow:0 8px 18px -7px rgba(230,160,0,.7)}
.tn-cta.ghost{background:linear-gradient(160deg,#fff,rgba(255,253,248,.7));color:#2743f0;box-shadow:0 5px 14px -6px rgba(30,20,60,.3),inset 0 1px 0 #fff}
.tn-cta:active{transform:translateY(1px)}

/* past tenant row */
.tn-past{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;margin-bottom:10px;cursor:pointer;
  background:linear-gradient(160deg,rgba(255,253,248,.62),rgba(255,253,248,.36));border:1px solid rgba(255,255,255,.5)}
.tn-past .pav{width:38px;height:38px;border-radius:12px;flex:none;display:grid;place-items:center;font-weight:800;font-size:14px;background:rgba(22,21,19,.1);color:var(--soft)}
.tn-past .nm{font-size:14px;font-weight:800;color:#161513}
.tn-past .mt{font-size:11px;color:var(--soft);font-weight:600;margin-top:2px}
.tn-past .pr{text-align:right;flex:none}
.tn-past .pr .a{font-size:14px;font-weight:800;color:#161513}
.tn-past .pr .l{font:700 8.5px ui-monospace,Menlo,monospace;letter-spacing:.05em;color:var(--soft);text-transform:uppercase}

/* ===== Properties + Tenants · warmth & depth polish ===== */
/* portfolio = warm peach hero (like Home money card) */
.pf-card{background:linear-gradient(150deg,#fff2e6 0%,#fdecdb 40%,rgba(255,253,248,.66) 100%);
  border:1px solid rgba(255,255,255,.78);
  box-shadow:0 22px 46px -20px rgba(232,150,60,.42),0 6px 16px -10px rgba(30,20,60,.28),inset 0 1px 0 rgba(255,255,255,.92)}
.pf-sect{color:#a85f00}
.pf-sect span{filter:saturate(1.1)}
.pf-roll{border-top-color:rgba(168,95,0,.16)}
.pf-roll b{color:#161513}

/* building cards — warm frost + status accent stripe */
.pb-card{background:linear-gradient(155deg,#fffaf2,rgba(255,253,248,.64));
  box-shadow:0 18px 40px -20px rgba(30,20,60,.34),0 4px 12px -8px rgba(30,20,60,.2),inset 0 1px 0 rgba(255,255,255,.9)}
.pb-card::after{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;z-index:2;border-radius:22px 0 0 22px}
.pb-card.ok::after{background:linear-gradient(180deg,#33c98a,#149a60)}
.pb-card.over::after{background:linear-gradient(180deg,#ff8298,#e85d75)}
.pb-card.vac::after{background:linear-gradient(180deg,#ffdf6b,#e58a00)}
.pb-body{padding-left:18px}
.pb-foot{padding-left:18px}
.pb-tile{width:48px;height:48px;font-size:17px}

/* section pills a touch bolder */
.tpage .tg-zn.z-flat{box-shadow:0 8px 18px -10px rgba(39,67,240,.4)}

/* tenant summary tiles — colour-tinted */
.tn-sum{box-shadow:0 12px 28px -14px rgba(30,20,60,.3),inset 0 1px 0 rgba(255,255,255,.85)}
.tn-sum.grn{background:linear-gradient(160deg,#e3f7ed,rgba(227,247,237,.55))}
.tn-sum.grn .v{color:#0f7a53}
.tn-sum.blu{background:linear-gradient(160deg,#e7ecff,rgba(231,236,255,.55))}
.tn-sum.blu .v{color:#2743f0}
.tn-sum.amber{background:linear-gradient(160deg,#fff0d9,rgba(255,240,217,.55))}
.tn-sum.amber .v{color:#e58a00}

/* tenant cards — warm frost + bolder stripe + depth */
.tn-card{background:linear-gradient(155deg,#fffaf2,rgba(255,253,248,.64));
  box-shadow:0 18px 40px -20px rgba(30,20,60,.34),0 4px 12px -8px rgba(30,20,60,.2),inset 0 1px 0 rgba(255,255,255,.9)}
.tn-card::before{width:5px;border-radius:20px 0 0 20px}
.tn-h{padding-left:18px}
.tn-acts{padding-left:18px}

/* ===== Properties · B1 building card (header band + occupancy meter) ===== */
.b1card{position:relative;border-radius:22px;margin-bottom:14px;overflow:hidden;
  background:linear-gradient(155deg,#fffaf2,rgba(255,253,248,.64));
  backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(255,255,255,.7);box-shadow:0 18px 40px -20px rgba(30,20,60,.34),0 4px 12px -8px rgba(30,20,60,.2),inset 0 1px 0 rgba(255,255,255,.9)}
.b1band{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;position:relative}
.b1band.apt{background:linear-gradient(150deg,#5f79ff,#2743f0);color:#fff}
.b1band.villa{background:linear-gradient(150deg,#ffd45a,#e58a00);color:#3a2c00}
.b1tile{width:44px;height:44px;border-radius:13px;flex:none;display:grid;place-items:center;font-weight:800;font-size:16px;background:rgba(255,255,255,.24);border:1px solid rgba(255,255,255,.42)}
.b1nm{font-size:17px;font-weight:800;letter-spacing:-.01em;line-height:1.12}
.b1mt{font-size:11px;font-weight:650;opacity:.92;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b1map{color:inherit;text-decoration:none}
.b1pill{font:800 9.5px ui-monospace,Menlo,monospace;letter-spacing:.05em;padding:5px 10px;border-radius:13px;text-transform:uppercase;flex:none;background:rgba(255,255,255,.22);color:inherit}
.b1body{padding:14px 16px 4px;cursor:pointer}
.b1meterhead{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:11.5px;font-weight:700;color:var(--soft);margin-bottom:8px}
.b1meterhead b{color:#161513;font-size:12.5px}
.b1obar{display:flex;gap:3px;height:14px;border-radius:7px;overflow:hidden;background:#d9d3c5}
.b1obar i{min-width:0}
.b1obar i.f{background:linear-gradient(180deg,#33c98a,#149a60)}
.b1obar i.o{background:linear-gradient(180deg,#ff8298,#e85d75)}
.b1obar i.e{background:repeating-linear-gradient(45deg,rgba(22,21,19,.09),rgba(22,21,19,.09) 5px,rgba(22,21,19,.03) 5px,rgba(22,21,19,.03) 10px)}
.b1card .pb-strip{margin-top:11px;margin-bottom:0}
.b1roll{margin-top:13px}
.b1roll .n{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1;color:#161513}
.b1roll .n small{font-size:12px;color:var(--soft);font-weight:700}
.b1roll .lab{font-size:10.5px;color:var(--soft);font-weight:700;margin-top:3px}
.b1nudge{display:flex;align-items:center;gap:10px;margin:12px 16px 0;padding:10px 12px;border-radius:14px}
.b1nudge.sun{background:linear-gradient(160deg,#fff6df,#fff);border:1px solid rgba(230,160,0,.25)}
.b1nudge.rose{background:linear-gradient(160deg,#fff0f2,#fff);border:1px solid rgba(179,18,58,.22)}
.b1nudge .tx{flex:1;min-width:0;font-size:12px;font-weight:800;color:#161513}
.b1nudge .tx span{display:block;font-size:10.5px;font-weight:600;color:var(--soft);margin-top:1px}
.b1act{position:relative;overflow:hidden;cursor:pointer;border:none;white-space:nowrap;font-size:11.5px;font-weight:800;padding:8px 13px;border-radius:20px;color:#3a2c00;transition:transform .14s ease,filter .14s ease,box-shadow .14s ease}
.b1act::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.45),transparent 55%);pointer-events:none}
.b1act.sun{background:linear-gradient(165deg,#ffdf6b,#f6c22c);box-shadow:0 7px 16px -7px rgba(230,160,0,.7)}
.b1act.grn{background:linear-gradient(165deg,#31c986,#149a60);color:#fff;box-shadow:0 7px 16px -7px rgba(20,154,96,.7)}
.b1act:hover{transform:translateY(-1px);filter:brightness(1.05)}
.b1act:active{transform:translateY(0) scale(.97)}
.b1foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;margin-top:12px;border-top:1px solid rgba(22,21,19,.08);font-size:11.5px;color:var(--soft);font-weight:600;cursor:pointer}
.b1foot .vw{color:#2743f0;font-weight:800;white-space:nowrap;display:flex;align-items:center;gap:4px}
.b1foot .go{font-size:16px}

/* ===== Tenants · modernise + icon alignment / hover ===== */
.tn-card{transition:transform .16s ease,box-shadow .16s ease}
.tn-card:hover{transform:translateY(-2px);box-shadow:0 24px 50px -20px rgba(30,20,60,.42),0 6px 16px -8px rgba(30,20,60,.24),inset 0 1px 0 rgba(255,255,255,.9)}
.tn-ib{padding:0;transition:transform .14s ease,box-shadow .14s ease,filter .14s ease}
.tn-ib svg{width:18px;height:18px;display:block}
.tn-ib:hover{transform:translateY(-2px);filter:brightness(1.08)}
.tn-ib:active{transform:translateY(0) scale(.95)}
.tn-ib:focus-visible{outline:2px solid #2743f0;outline-offset:2px}
.tn-ibs{align-items:center}
.tn-acts{align-items:center}
.tn-stamp{gap:6px}
.tn-cta{transition:transform .14s ease,filter .14s ease}
.tn-cta:hover{transform:translateY(-1px);filter:brightness(1.05)}
.pf-add{transition:transform .14s ease,filter .14s ease}
.pf-add:hover{transform:translateY(-1px);filter:brightness(1.05)}
/* modern tinted badges inside tenant + past rows */
.tn-card .badge,.tn-past .badge{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.05em;padding:4px 8px;border-radius:11px;text-transform:uppercase;border:none;line-height:1.5}
.tn-card .badge.b-ok,.tn-past .badge.b-ok{background:#e0f6ec;color:#0f7a53}
.tn-card .badge.b-part,.tn-past .badge.b-part{background:#fff0d9;color:#e58a00}
.tn-card .badge.b-up,.tn-past .badge.b-up{background:#e4e9ff;color:#2743f0}
.tn-card .badge.b-mut,.tn-past .badge.b-mut{background:rgba(22,21,19,.08);color:var(--soft)}

/* ===== match tenant-detail: translucent glass so the aurora glows through ===== */
.pf-card{background:linear-gradient(160deg,rgba(255,244,214,.6),rgba(255,253,248,.46));
  border:1.5px solid rgba(255,255,255,.7);box-shadow:0 18px 40px -18px rgba(22,21,19,.35),inset 0 1px 0 rgba(255,255,255,.6)}
.b1card{background:rgba(255,253,248,.56);border:1.5px solid rgba(255,255,255,.7);
  box-shadow:0 18px 40px -18px rgba(22,21,19,.35),inset 0 1px 0 rgba(255,255,255,.6)}
.tn-card{background:rgba(255,253,248,.56);border:1.5px solid rgba(255,255,255,.7);
  box-shadow:0 18px 40px -18px rgba(22,21,19,.35),inset 0 1px 0 rgba(255,255,255,.6)}
.tn-card:hover{box-shadow:0 24px 52px -18px rgba(22,21,19,.44),inset 0 1px 0 rgba(255,255,255,.6)}
.tn-past{background:rgba(255,253,248,.44);border:1.5px solid rgba(255,255,255,.6);
  box-shadow:0 10px 24px -14px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.55)}
/* soften the building-card inner strip so translucency reads */
.b1card .pb-strip{background:rgba(22,21,19,.06)}

/* ===== Tenants · glassier + fix broken hover · detail-primitive actions ===== */
.tn-card{background:rgba(255,253,248,.5)}
.tn-card:hover{transform:none;box-shadow:0 20px 44px -18px rgba(22,21,19,.42),inset 0 1px 0 rgba(255,255,255,.6)}
.tn-actarea{padding:12px 14px 13px;border-top:1px solid rgba(22,21,19,.07)}
.tn-actarea .tg-cta{margin-bottom:10px}
.tn-cta1 .p,.tn-cta1 .s{flex:1;text-align:center}
.tn-qg{display:grid;gap:8px}
.tn-qg .tg-q{padding:10px 4px 8px}
.tn-qg .tg-q .i{width:40px;height:40px;border-radius:12px;font-size:18px}

/* ===== Tenants · compact action tiles + since line ===== */
.tn-qg{gap:7px}
.tn-qg .tg-q{padding:8px 3px 7px;border-radius:13px;gap:5px}
.tn-qg .tg-q .i{width:32px;height:32px;border-radius:10px;font-size:15px;box-shadow:0 6px 12px -6px rgba(22,21,19,.45)}
.tn-qg .tg-q:hover .i{transform:translateY(-2px) rotate(-5deg)}
.tn-qg .tg-q .t{font-size:7.5px;letter-spacing:.03em}
.tn-meta.since{color:var(--soft);font-weight:700;margin-top:3px}

/* ===== Properties · glassier + tg-cta building buttons + glass template ===== */
.b1card{background:rgba(255,253,248,.5)}
.b1cta{display:inline-flex;margin:0;flex:none}
.b1cta .p,.b1cta .s{flex:none;padding:9px 14px;font-size:12px}
.pb-tmpl{background:linear-gradient(160deg,rgba(255,244,214,.5),rgba(255,253,248,.42));
  -webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);
  border:1.5px dashed rgba(22,21,19,.16);box-shadow:0 14px 32px -18px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.6)}
.pb-tchip{background:rgba(255,255,255,.62)}

/* ===== Agreements page · aurora glass ===== */
.tg-stat.s-rose{background:linear-gradient(160deg,rgba(255,150,170,.52),rgba(255,253,248,.4))}
.tg-stat.s-rose .v{color:#b3123a}
.ag-statgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px;margin-bottom:13px}
.ag-filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:13px}
.ag-chip{border:none;cursor:pointer;font:800 11px system-ui;padding:8px 13px;border-radius:20px;color:var(--ink);
  background:rgba(255,253,248,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:0 5px 14px -8px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.7)}
.ag-chip.on{background:linear-gradient(165deg,#4560ff,#1e37e0);color:#fff;box-shadow:0 9px 18px -8px rgba(39,67,240,.6)}
.ag-card{position:relative;border-radius:20px;margin-bottom:13px;padding:14px 15px 14px 19px;overflow:hidden;cursor:pointer;
  background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  border:1.5px solid rgba(255,255,255,.7);box-shadow:0 18px 40px -18px rgba(22,21,19,.35),inset 0 1px 0 rgba(255,255,255,.6)}
.ag-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;border-radius:20px 0 0 20px;background:var(--blue,#2743f0)}
.ag-card.g::before{background:linear-gradient(180deg,#33c98a,#149a60)}
.ag-card.a::before{background:linear-gradient(180deg,#ffcf5a,#e58a00)}
.ag-card.r::before{background:linear-gradient(180deg,#ff8298,#e85d75)}
.ag-top{display:flex;align-items:center;gap:11px}
.ag-tile{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;font-weight:800;font-size:14px;color:#3a2c00;background:linear-gradient(160deg,#ffe27a,#f6c22c);box-shadow:0 6px 14px -6px rgba(230,160,0,.5)}
.ag-nm{font-size:14.5px;font-weight:800;letter-spacing:-.01em;color:#161513;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ag-meta{font-size:11px;color:var(--soft);font-weight:650;margin-top:2px}
.ag-ex{flex:none}
.ag-pill{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.04em;padding:3px 8px;border-radius:10px;text-transform:uppercase}
.ag-pill.ok{background:#e0f6ec;color:#0f7a53}
.ag-pill.due{background:#e4e9ff;color:#2743f0}
.ag-pill.mut{background:rgba(22,21,19,.08);color:var(--soft)}
.ag-pill.vac{background:#ffe1e6;color:#b3123a}
.ag-pill.v{background:#fff0d9;color:#e58a00}
.ag-stepper{display:flex;margin:13px 0 2px;padding:0 2px}
.ag-step{flex:1;display:flex;flex-direction:column;align-items:center;position:relative}
.ag-step .b{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;z-index:2;background:#e9e4d8;color:var(--soft);border:2px solid #e9e4d8}
.ag-step.done .b{background:linear-gradient(160deg,#33c98a,#149a60);color:#fff;border-color:transparent;box-shadow:0 4px 9px -4px rgba(20,154,96,.7)}
.ag-step.cur .b{background:#fff;color:#e58a00;border-color:#e58a00}
.ag-step .t{font:800 8px ui-monospace,Menlo,monospace;letter-spacing:.02em;text-transform:uppercase;color:var(--soft);margin-top:4px}
.ag-step.done .t{color:#0f7a53}.ag-step.cur .t{color:#e58a00}
.ag-step::before{content:"";position:absolute;top:10px;left:-50%;width:100%;height:3px;background:#e6e0d5;z-index:1}
.ag-step:first-child::before{display:none}
.ag-step.done::before,.ag-step.done+.ag-step::before{background:linear-gradient(90deg,#33c98a,#149a60)}
.ag-acts{margin:11px 0 0}
.ag-acts .p,.ag-acts .s{flex:1;text-align:center;text-decoration:none;font-size:12px;padding:10px}

/* ===== Properties · Agreement template — premium glass card ===== */
.agt-card{position:relative;border-radius:22px;padding:16px;margin-bottom:10px;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,244,214,.5),rgba(255,253,248,.42));
  -webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  border:1.5px solid rgba(255,255,255,.7);box-shadow:0 18px 40px -18px rgba(22,21,19,.35),inset 0 1px 0 rgba(255,255,255,.6)}
.agt-head{display:flex;align-items:center;gap:11px;cursor:pointer;padding-bottom:13px;border-bottom:1px solid rgba(22,21,19,.09)}
.agt-ic{width:42px;height:42px;border-radius:13px;flex:none;display:grid;place-items:center;font-size:20px;background:linear-gradient(160deg,#ffe27a,#f6c22c);box-shadow:0 6px 14px -6px rgba(230,160,0,.55),inset 0 1px 0 rgba(255,255,255,.6)}
.agt-title{font-size:15.5px;font-weight:800;letter-spacing:-.01em;color:#161513}
.agt-sub{font-size:11.5px;color:var(--soft);font-weight:650;margin-top:2px;line-height:1.35}
.agt-go{font-size:22px;color:var(--soft);flex:none}
.agt-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:13px 0}
.agt-t{border-radius:14px;padding:10px 11px;background:linear-gradient(165deg,rgba(255,255,255,.6),rgba(255,255,255,.28));border:1px solid rgba(255,255,255,.6)}
.agt-t .l{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;color:var(--soft)}
.agt-t .v{font-size:15px;font-weight:800;letter-spacing:-.01em;color:#161513;margin-top:4px}
.agt-t .s{font-size:10px;color:var(--soft);font-weight:650;margin-top:1px}
.agt-acts{margin:0}
.agt-acts .p,.agt-acts .s{flex:1;text-align:center;font-size:12.5px;padding:11px}

/* ===== Tenants · cleaner premium card layout ===== */
.tn-h{align-items:center;padding:14px 14px 13px 18px}
.tn-hmid{flex:1;min-width:0}
.tn-sub{font-size:12px;color:var(--soft);font-weight:650;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tn-chev{font-size:22px;color:var(--soft);flex:none;font-weight:400;align-self:center}
.tn-strip{display:flex;margin:0 14px;padding:12px 0 13px;border-top:1px solid rgba(22,21,19,.08)}
.tn-s{flex:1;text-align:center;padding:0 6px;min-width:0}
.tn-s+.tn-s{border-left:1px solid rgba(22,21,19,.08)}
.tn-s .l{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--soft)}
.tn-s .v{font-size:15px;font-weight:800;letter-spacing:-.01em;color:#161513;margin-top:4px}
.tn-s .v i{display:block;font-style:normal;font-size:9px;font-weight:650;color:var(--soft);margin-top:2px}
.tn-status{display:flex;gap:6px;flex-wrap:wrap;padding:11px 14px 0}

/* ===== Tenants · V3 compact card (row + named quick actions) ===== */
.tn-top{display:flex;align-items:center;gap:11px;padding:13px 13px 0 18px;cursor:pointer}
.tn-top .avatar{width:44px;height:44px}
.tn-hmid{flex:1;min-width:0}
.tn-top .tn-nm{font-size:15px;font-weight:800;letter-spacing:-.01em;color:#161513;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tn-top .tn-sub{font-size:11.5px;color:var(--soft);font-weight:650;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tn-top .tn-chev{font-size:20px;color:var(--soft);flex:none;align-self:center;font-weight:400}
.tn-meta2{display:flex;gap:12px;flex-wrap:wrap;padding:10px 15px 0 18px;font-size:11.5px;color:var(--soft);font-weight:650}
.tn-meta2 b{color:#161513;font-weight:800}
.tn-qbrow{display:flex;gap:7px;padding:11px 14px 0 18px}
.tn-qb{flex:1;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:5px;height:36px;border-radius:12px;font-size:11px;font-weight:800;cursor:pointer;border:none;color:#fff;position:relative;overflow:hidden;transition:transform .14s ease,filter .14s ease}
.tn-qb::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.42),transparent 55%);pointer-events:none}
.tn-qb .e{font-size:14px}
.tn-qb:hover{transform:translateY(-2px);filter:brightness(1.06)}
.tn-qb:active{transform:translateY(0) scale(.96)}
.tn-qb.b1{background:linear-gradient(160deg,#5f79ff,#2743f0);box-shadow:0 7px 15px -8px rgba(39,67,240,.6)}
.tn-qb.b2{background:linear-gradient(160deg,#2ec27e,#149a60);box-shadow:0 7px 15px -8px rgba(20,154,96,.6)}
.tn-qb.b3{background:linear-gradient(160deg,#ffdf6b,#f6c22c);color:#3a2c00;box-shadow:0 7px 15px -8px rgba(230,160,0,.6)}
.tn-qb.b4{background:linear-gradient(160deg,#a76fd0,#7a3fa0);box-shadow:0 7px 15px -8px rgba(138,79,179,.55)}
.tn-cta1{margin:10px 14px 14px 18px}
/* clearer, more legible status pills */
.tn-card .badge{display:inline-flex;align-items:center;gap:3px;font:800 9px system-ui;letter-spacing:.01em;padding:3px 8px;border-radius:999px;text-transform:none;white-space:nowrap;line-height:1;border:none}

/* ===== Property detail · aurora glass ===== */
.uf-hero{display:flex;align-items:center;gap:12px}
.uf-htile{width:52px;height:52px;border-radius:15px;flex:none;display:grid;place-items:center;font-weight:800;font-size:18px;color:#3a2c00;background:linear-gradient(160deg,#ffe27a,#f6c22c);box-shadow:0 8px 16px -7px rgba(230,160,0,.55),inset 0 1px 0 rgba(255,255,255,.6)}
.uf-htile.apt{color:#fff;background:linear-gradient(160deg,#5f79ff,#2743f0);box-shadow:0 8px 16px -7px rgba(39,67,240,.55)}
.uf-hnm{font-size:19px;font-weight:800;letter-spacing:-.02em;color:#161513}
.uf-hmeta{font-size:11.5px;color:var(--soft);font-weight:650;margin-top:3px}
.uf-hmap{display:inline-block;font-size:11.5px;color:#2743f0;font-weight:700;text-decoration:none;margin-top:2px}
.uf-occ{display:flex;align-items:center;gap:18px;margin-top:14px}
.uf-occ .pf-leg{flex:1}
/* flat cards */
.uf-card{position:relative;border-radius:18px;margin-bottom:11px;padding:13px 14px 13px 18px;overflow:hidden;cursor:pointer;
  background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  border:1.5px solid rgba(255,255,255,.7);box-shadow:0 16px 36px -20px rgba(22,21,19,.38),inset 0 1px 0 rgba(255,255,255,.6)}
.uf-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;border-radius:18px 0 0 18px;background:var(--blue,#2743f0)}
.uf-card.g::before{background:linear-gradient(180deg,#33c98a,#149a60)}
.uf-card.a::before{background:linear-gradient(180deg,#ffcf5a,#e58a00)}
.uf-card.r::before{background:linear-gradient(180deg,#ff8298,#e85d75)}
.uf-top{display:flex;align-items:center;gap:11px}
.uf-tile{width:40px;height:40px;border-radius:11px;flex:none;display:grid;place-items:center;font-weight:800;font-size:13px;color:#3a2c00;background:linear-gradient(160deg,#ffe27a,#f6c22c);box-shadow:0 5px 12px -6px rgba(230,160,0,.5)}
.uf-card .fnm{font-size:14.5px;font-weight:800;letter-spacing:-.01em;color:#161513;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.uf-card .fpr{text-align:right;flex:none}
.uf-card .fpr .a{font-size:14.5px;font-weight:800;color:#161513}
.uf-card .fpr .l{font:700 8px ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;color:var(--soft)}
.uf-card .fst{display:inline-flex;align-items:center;font:800 8.5px system-ui;padding:3px 8px;border-radius:999px;text-transform:none;white-space:nowrap}
.uf-card .fst.ok{background:#dff4e9;color:#0f7a53}
.uf-card .fst.due{background:#fdeccd;color:#a86500}
.uf-card .fst.vac{background:#ffe1e6;color:#b3123a}
.uf-card .fst.bhk{background:#e4e9ff;color:#2743f0}
.uf-card .pd-who{display:inline-block;font-size:11.5px;color:#2743f0;font-weight:750;text-decoration:none;margin-top:3px;cursor:pointer}
.uf-card .pd-who .dim{color:var(--soft);font-weight:600}
.uf-card .fmeta{font-size:11px;color:var(--soft);font-weight:650;margin-top:3px}
.uf-card .pd-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:11px}
.uf-card .pd-facts .f{background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.6);border-radius:11px;padding:7px 8px;text-align:center;min-width:0}
.uf-card .pd-facts .f .l{font:800 7.5px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--soft)}
.uf-card .pd-facts .f .v{font-size:12.5px;font-weight:800;color:#161513;margin-top:3px}
.uf-card .pd-facts .f .v.r{color:#b3123a}.uf-card .pd-facts .f .v.g{color:#0f7a53}
.uf-card .pd-facts .f .sb{font-size:9px;color:var(--soft);font-weight:600;margin-top:1px}
.uf-acts{margin-top:11px}
.uf-acts .p,.uf-acts .s{flex:1;text-align:center;font-size:12px;padding:10px}

/* ===== Property detail · premium glass polish (flat cards + sections) ===== */
/* flat card: warmer glass + frosted facts tiles */
.uf-card{background:linear-gradient(160deg,rgba(255,253,248,.6),rgba(255,253,248,.42));box-shadow:0 18px 40px -20px rgba(22,21,19,.42),0 4px 12px -8px rgba(22,21,19,.22),inset 0 1px 0 rgba(255,255,255,.7)}
.uf-tile{width:42px;height:42px;font-size:14px;box-shadow:0 6px 14px -6px rgba(230,160,0,.55),inset 0 1px 0 rgba(255,255,255,.6)}
.uf-card .pd-facts{gap:8px;margin-top:12px}
.uf-card .pd-facts .f{background:linear-gradient(165deg,rgba(255,255,255,.72),rgba(255,255,255,.32));border:1px solid rgba(255,255,255,.72);border-radius:13px;padding:9px 8px 10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 6px 14px -10px rgba(22,21,19,.25)}
.uf-card .pd-facts .f .v{font-size:13px;margin-top:4px}
.uf-card .pd-facts .f .l{font-size:8px}
.uf-acts{margin-top:12px}

/* sections on glass: premium header + chips + detail rows + dropzone */
.tg-glass .hd-sect{display:flex;align-items:center;gap:7px;font:800 12px system-ui;color:var(--soft);letter-spacing:.01em;text-transform:uppercase;margin-bottom:4px}
.tg-glass .hd-sect .si{font-size:15px}
.tg-glass .hd-sect .r{margin-left:auto;color:#2743f0;font-weight:800;text-transform:none;font-size:12px}
.tg-glass .pd-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}
.tg-glass .pd-chip{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(165deg,rgba(255,255,255,.72),rgba(255,255,255,.4));border:1px solid rgba(255,255,255,.7);border-radius:999px;padding:6px 12px;font-size:11.5px;font-weight:700;color:#161513;box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 6px 14px -11px rgba(22,21,19,.3)}
.tg-glass .pd-chip b{font-weight:800}
.tg-glass .pd-inh{font-size:11.5px;color:var(--soft);font-weight:650;margin:9px 0 2px}
.tg-glass .pd-inh a{color:#2743f0;font-weight:800}
.tg-glass .pd-drow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid rgba(22,21,19,.07);font-size:12.5px}
.tg-glass .pd-drow:last-child{border-bottom:none}
.tg-glass .pd-drow .dl{color:var(--soft);font-weight:700;white-space:nowrap}
.tg-glass .pd-drow .dv{color:#161513;font-weight:800;text-align:right}
.tg-glass .pd-drow .dv a,.tg-glass .pd-chip a{color:#2743f0}
.tg-glass .pd-dropz{display:flex;flex-direction:column;align-items:center;gap:4px;padding:24px 14px;border-radius:15px;border:1.5px dashed rgba(22,21,19,.18);background:linear-gradient(160deg,rgba(255,255,255,.4),rgba(255,255,255,.2));cursor:pointer;text-align:center}
.tg-glass .pd-dropz .ic{font-size:28px}
.tg-glass .pd-dropz .t{font-weight:800;color:#161513;margin-top:2px}
.tg-glass .pd-dropz .n{font-size:11.5px;color:var(--soft);font-weight:650}
.tg-glass .pd-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;margin-top:11px}
.tg-glass .pd-ph{width:100%;height:78px;object-fit:cover;border-radius:12px;border:1.5px solid rgba(255,255,255,.7)}

/* ===== Unit detail · aurora glass ===== */
.pd-hero{position:relative}
.pd-hero .pd-rstamp{position:absolute;top:14px;right:16px;font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.1em;padding:4px 9px;border-radius:999px}
.pd-rstamp.g{background:#dff4e9;color:#0f7a53}.pd-rstamp.a{background:#fdeccd;color:#a86500}.pd-rstamp.r{background:#ffe1e6;color:#b3123a}
.pd-hero .pd-big{font-size:32px;font-weight:800;letter-spacing:-.03em;color:#161513;margin-top:6px}
.pd-hero .pd-big .per{font-size:14px;color:var(--soft);font-weight:700}
.pd-hero .pd-split{font-size:12px;color:var(--soft);font-weight:650;margin-top:3px}
.pd-hero .pd-split b{color:#161513;font-weight:800}
.pd-hero .chiprow{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}
.tg-glass .fst{display:inline-flex;align-items:center;font:800 9px system-ui;padding:4px 9px;border-radius:999px;text-transform:none;white-space:nowrap}
.tg-glass .fst.ok{background:#dff4e9;color:#0f7a53}.tg-glass .fst.due{background:#fdeccd;color:#a86500}.tg-glass .fst.vac{background:#ffe1e6;color:#b3123a}.tg-glass .fst.blue{background:#e4e9ff;color:#2743f0}
.pd-hero .pd-money{display:flex;gap:10px;margin-top:13px}
.pd-hero .pd-mbox{flex:1;border-radius:14px;padding:11px 12px;background:linear-gradient(165deg,rgba(255,255,255,.62),rgba(255,255,255,.3));border:1px solid rgba(255,255,255,.65);box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.pd-hero .pd-mbox .l{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;color:var(--soft)}
.pd-hero .pd-mbox .v{font-size:16px;font-weight:800;letter-spacing:-.01em;color:#161513;margin-top:4px}
.pd-hero .pd-mbox.in{background:linear-gradient(165deg,rgba(143,230,192,.4),rgba(255,255,255,.3))}
.pd-hero .pd-mbox.sunbg{background:linear-gradient(165deg,rgba(255,216,77,.4),rgba(255,255,255,.3))}
.tg-glass .pd-trow{display:flex;align-items:center;gap:11px;cursor:pointer;padding-top:2px}
.tg-glass .pd-av{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;font-weight:800;font-size:15px;color:#fff;background:linear-gradient(160deg,#5f79ff,#2743f0);box-shadow:0 6px 13px -6px rgba(39,67,240,.5)}
.tg-glass .pd-tnm{font-size:14.5px;font-weight:800;color:#161513;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.tg-glass .pd-tmt{font-size:11px;color:var(--soft);font-weight:650;margin-top:3px}.tg-glass .pd-tmt b{color:#161513}
.tg-glass .pd-go{font-size:20px;color:var(--soft);flex:none}
.tg-glass .pd-contacts{display:flex;gap:7px;margin-top:12px}
.pd-cbtn{flex:1;text-align:center;text-decoration:none;position:relative;overflow:hidden;cursor:pointer;border-radius:12px;padding:10px;font-size:12px;font-weight:800;color:#fff;background:linear-gradient(160deg,#5f79ff,#2743f0);box-shadow:0 8px 16px -8px rgba(39,67,240,.5);transition:transform .14s ease,filter .14s ease}
.pd-cbtn::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.4),transparent 55%);pointer-events:none}
.pd-cbtn.g{background:linear-gradient(160deg,#2ec27e,#149a60);box-shadow:0 8px 16px -8px rgba(20,154,96,.5)}
.pd-cbtn.wa{background:linear-gradient(160deg,#ffdf6b,#f6c22c);color:#3a2600;box-shadow:0 8px 16px -8px rgba(230,160,0,.5)}
.pd-cbtn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.tg-glass .tm-stepper{display:flex;margin:12px 0}
.tg-glass .tm-step{flex:1;display:flex;flex-direction:column;align-items:center;position:relative}
.tg-glass .tm-step .b{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:800;z-index:2;background:#e9e4d8;color:var(--soft);border:2px solid #e9e4d8}
.tg-glass .tm-step.done .b{background:linear-gradient(160deg,#33c98a,#149a60);color:#fff;border-color:transparent}
.tg-glass .tm-step.cur .b{background:#fff;color:#e58a00;border-color:#e58a00}
.tg-glass .tm-step .t{font:800 8px ui-monospace,Menlo,monospace;text-transform:uppercase;color:var(--soft);margin-top:4px}
.tg-glass .tm-step.done .t{color:#0f7a53}.tg-glass .tm-step.cur .t{color:#e58a00}
.tg-glass .tm-step::before{content:"";position:absolute;top:10px;left:-50%;width:100%;height:3px;background:#e6e0d5;z-index:1}
.tg-glass .tm-step:first-child::before{display:none}
.tg-glass .tm-step.done::before,.tg-glass .tm-step.done+.tm-step::before{background:linear-gradient(90deg,#33c98a,#149a60)}
.tg-glass .pd-bar{height:9px;border-radius:5px;background:#e6e0d5;overflow:hidden;margin:3px 0}
.tg-glass .pd-bar i{display:block;height:100%;background:linear-gradient(90deg,#4560ff,#1e37e0);border-radius:5px}
.tg-glass .pd-barcap{display:flex;justify-content:space-between;font-size:10.5px;color:var(--soft);font-weight:700}
.tg-glass .pd-dgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:4px}
.tg-glass .pd-dcell{background:linear-gradient(165deg,rgba(255,255,255,.6),rgba(255,255,255,.28));border:1px solid rgba(255,255,255,.65);border-radius:12px;padding:9px 11px}
.tg-glass .pd-dcell .dl{font:800 8px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--soft)}
.tg-glass .pd-dcell .dv{font-size:13px;font-weight:800;color:#161513;margin-top:3px}
.tg-glass .pd-actions{display:flex;gap:8px;flex-wrap:wrap}
.pd-actions{display:flex;gap:8px;flex-wrap:wrap}
.pd-fbtn2{flex:1;min-width:92px;text-align:center;text-decoration:none;cursor:pointer;position:relative;overflow:hidden;border:none;border-radius:12px;padding:10px 12px;font-size:12px;font-weight:800;color:#161513;background:rgba(255,253,248,.66);box-shadow:0 6px 15px -8px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.7);transition:transform .14s ease}
.pd-fbtn2:hover{transform:translateY(-1px)}
.pd-fbtn2.pri{background:linear-gradient(160deg,#2ec27e,#149a60);color:#fff;box-shadow:0 9px 18px -8px rgba(20,154,96,.6)}
.pd-fbtn2.am{background:linear-gradient(160deg,#ffdf6b,#f6c22c);color:#3a2600}
.pd-fbtn2.danger{background:linear-gradient(160deg,#ff8298,#e85d75);color:#fff;box-shadow:0 9px 18px -8px rgba(232,93,117,.55)}
.tg-glass .tm-lrow{display:flex;align-items:center;gap:9px;padding:8px 0;border-bottom:1px solid rgba(22,21,19,.06);font-size:12px}
.tg-glass .tm-lrow:last-child{border-bottom:none}
.tg-glass .tm-dot{width:8px;height:8px;border-radius:50%;flex:none}
.tg-glass .tm-lmo{font-weight:800;color:#161513;width:66px;flex:none}
.tg-glass .tm-lbar{flex:1;height:7px;border-radius:4px;background:#e6e0d5;overflow:hidden}
.tg-glass .tm-lbar i{display:block;height:100%;border-radius:4px}
.tg-glass .tm-lamt{font-weight:800;color:#161513;white-space:nowrap;font-size:11.5px}
.tg-glass .pd-exrow{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(22,21,19,.06)}
.tg-glass .pd-exrow:last-child{border-bottom:none}
.tg-glass .pd-exrow .ic{font-size:16px}
.tg-glass .pd-exrow .ea{font-weight:800;color:#b3123a;white-space:nowrap}
.tg-glass .pd-hist{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid rgba(22,21,19,.06)}
.tg-glass .pd-hist:last-child{border-bottom:none}
.tg-glass .pd-hist .dot{width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;font-weight:800;font-size:13px;background:rgba(22,21,19,.08);color:var(--soft)}
.tg-glass .pd-hist .hn{font-size:13px;font-weight:800;color:#161513}
.tg-glass .pd-hist .hm{font-size:10.5px;color:var(--soft);font-weight:650}
.tg-glass .pd-hist .hb{font:800 8px ui-monospace,Menlo,monospace;text-transform:uppercase;color:var(--soft);background:rgba(22,21,19,.07);padding:3px 8px;border-radius:8px}
.tpage .pd-vac{display:flex;align-items:center;gap:10px;margin-bottom:13px;padding:12px 14px;border-radius:16px;background:linear-gradient(160deg,#fff0f2,rgba(255,253,248,.5));border:1px solid rgba(179,18,58,.2)}
.tpage .pd-vac .txt{flex:1;min-width:0;font-size:13px;font-weight:800;color:#161513}
.tpage .pd-vac .txt span{display:block;font-size:11px;font-weight:600;color:var(--soft);margin-top:2px}
.tpage .pd-vac .go{cursor:pointer;position:relative;overflow:hidden;font-size:12px;font-weight:800;color:#fff;padding:9px 14px;border-radius:20px;white-space:nowrap;background:linear-gradient(160deg,#2ec27e,#149a60);box-shadow:0 8px 16px -8px rgba(20,154,96,.6)}
.tg-glass .pd-add,.tpage .pd-add{color:#2743f0;font-weight:800;cursor:pointer}

/* ===== Reports · aurora glass ===== */
.rp-years{display:flex;gap:6px;flex-wrap:wrap}
.rp-yr{border:none;cursor:pointer;font:800 12px system-ui;padding:7px 13px;border-radius:18px;color:var(--ink);background:rgba(255,253,248,.62);box-shadow:0 5px 14px -8px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.7)}
.rp-yr.on{background:linear-gradient(165deg,#4560ff,#1e37e0);color:#fff;box-shadow:0 9px 18px -8px rgba(39,67,240,.6)}
.rp-tools{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 4px}
.rp-tool{border:none;cursor:pointer;font-size:11.5px;font-weight:800;padding:8px 12px;border-radius:12px;color:#161513;background:linear-gradient(165deg,rgba(255,255,255,.7),rgba(255,255,255,.4));box-shadow:0 6px 14px -9px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.7)}
.rp-tool:hover{filter:brightness(1.04)}
.rp-chart{display:flex;gap:5px;align-items:flex-end;padding:14px 4px 6px}
.rp-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0}
.rp-bars{width:100%;display:flex;gap:2px;align-items:flex-end;justify-content:center;height:120px}
.rp-b{width:44%;border-radius:5px 5px 0 0;min-height:2px}
.rp-b.in{background:linear-gradient(180deg,#33c98a,#149a60)}
.rp-b.out{background:linear-gradient(180deg,#ff8298,#e85d75)}
.rp-ml{font-size:10px;color:var(--soft);font-weight:800}
.rp-leg{display:flex;gap:16px;padding:4px 2px 2px;font-size:11.5px;color:var(--soft);font-weight:750}
.rp-leg .in::before{content:"●";color:#149a60;margin-right:5px}
.rp-leg .out::before{content:"●";color:#e85d75;margin-right:5px}
.rp-prow{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid rgba(22,21,19,.06)}
.rp-prow:last-child{border-bottom:none}
.rp-ptile{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;font-size:18px;background:linear-gradient(160deg,rgba(255,255,255,.7),rgba(255,255,255,.35));border:1px solid rgba(255,255,255,.65)}
.rp-pnm{font-size:13.5px;font-weight:800;color:#161513}
.rp-pmt{font-size:11px;color:var(--soft);font-weight:650;margin-top:2px}
.rp-net{font:800 10px ui-monospace,Menlo,monospace;padding:4px 9px;border-radius:999px;white-space:nowrap}
.rp-net.ok{background:#dff4e9;color:#0f7a53}.rp-net.bad{background:#ffe1e6;color:#b3123a}
.rp-cat{margin:10px 0}
.rp-cl{display:flex;justify-content:space-between;font-size:12px;font-weight:750;color:#161513;margin-bottom:5px}
.rp-cl .num{font-weight:800}
.rp-track{height:9px;border-radius:5px;background:#e6e0d5;overflow:hidden}
.rp-fill{height:100%;border-radius:5px}
.rp-empty{text-align:center;color:var(--soft);font-weight:650;font-size:12.5px;padding:16px}

/* ===== Reports P&L table + Unit doc rows on glass ===== */
.rp-pltbl{overflow-x:auto;margin-top:11px}
.rp-pltbl table{width:100%;border-collapse:collapse;font-size:12.5px}
.rp-pltbl th{text-align:right;padding:7px 6px;font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;color:var(--soft);border-bottom:1.5px solid rgba(22,21,19,.12);white-space:nowrap}
.rp-pltbl th:first-child{text-align:left}
.rp-pltbl td{padding:8px 6px;border-bottom:1px solid rgba(22,21,19,.06);color:#161513;font-weight:700;white-space:nowrap}
.rp-pltbl td.r{text-align:right;font-variant-numeric:tabular-nums}
.rp-pltbl td.g{color:#0f7a53;font-weight:800}.rp-pltbl td.bad{color:#b3123a;font-weight:800}
.rp-pltbl tfoot td{border-top:2px solid rgba(22,21,19,.16);border-bottom:none;font-weight:850}
.rp-plmt{color:var(--soft);font-weight:650;text-align:center;padding:14px;white-space:normal}
.rp-plnote{font-size:11px;color:var(--soft);font-weight:650;margin:10px 0 0;line-height:1.5}
.doc-row{display:flex;align-items:center;gap:9px;padding:9px 0;border-bottom:1px solid rgba(22,21,19,.06)}
.doc-row:last-child{border-bottom:none}
.doc-ic{font-size:16px;flex:none}
.doc-type{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.03em;text-transform:uppercase;color:#2743f0;background:#e4e9ff;padding:3px 8px;border-radius:8px;flex:none}
.doc-lnk{color:#2743f0;font-weight:750;font-size:12.5px;text-decoration:none}
.doc-nm{font-size:12.5px;font-weight:700;color:#161513}
.doc-del{margin-left:auto;flex:none;width:28px;height:28px;border:none;border-radius:9px;background:rgba(22,21,19,.06);cursor:pointer;font-size:13px}
.doc-del:hover{background:#ffe1e6}

/* ===== Expenses / Documents / Team · aurora glass ===== */
.fchiprow{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:11px}
.fchip{border:none;cursor:pointer;font:800 11px system-ui;padding:7px 12px;border-radius:18px;color:var(--ink);background:rgba(255,253,248,.6);box-shadow:0 4px 12px -7px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.7)}
.fchip.on{background:linear-gradient(165deg,#4560ff,#1e37e0);color:#fff;box-shadow:0 8px 16px -8px rgba(39,67,240,.6)}
.ex-card{position:relative;display:flex;align-items:center;gap:11px;border-radius:16px;margin-bottom:10px;padding:11px 13px 11px 17px;overflow:hidden;
  background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  border:1.5px solid rgba(255,255,255,.7);box-shadow:0 14px 32px -20px rgba(22,21,19,.38),inset 0 1px 0 rgba(255,255,255,.6)}
.ex-card.click{cursor:pointer}
.ex-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--ac,#e85d75)}
.ex-tile{width:40px;height:40px;border-radius:12px;flex:none;display:grid;place-items:center;font-size:19px}
.ex-nm{font-size:14px;font-weight:800;color:#161513;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ex-meta{font-size:11px;color:var(--soft);font-weight:650;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ex-pr{text-align:right;flex:none}
.ex-pr .a{font-size:15px;font-weight:800;color:#b3123a}
.ex-pr .l{font:700 8px ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;color:var(--soft)}
.doc-agr{display:flex;gap:12px;align-items:center;text-decoration:none}
.doc-agr .ic{font-size:20px;flex:none}
.doc-agr .t{font-weight:800;color:#161513;font-size:13.5px}
.doc-agr .n{font-size:11px;color:var(--soft);font-weight:650;margin-top:2px}
.doc-agr .go{color:#2743f0;font-weight:800;white-space:nowrap;flex:none}
.doc-note{font-size:11.5px;color:var(--soft);font-weight:650;line-height:1.5;margin:0 2px 14px;padding:0 2px}
.dg-card{position:relative;border-radius:18px;margin-bottom:12px;overflow:hidden;padding:14px 15px 8px 18px;
  background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  border:1.5px solid rgba(255,255,255,.7);box-shadow:0 16px 36px -20px rgba(22,21,19,.4),inset 0 1px 0 rgba(255,255,255,.6)}
.dg-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--ac,#2743f0)}
.dg-head{display:flex;align-items:center;gap:11px;padding-bottom:8px;border-bottom:1px solid rgba(22,21,19,.07)}
.dg-av{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;font-weight:800;font-size:14px;color:#fff;background:var(--ac,#2743f0);background-image:linear-gradient(160deg,rgba(255,255,255,.25),rgba(0,0,0,.2))}
.dg-nm{font-size:14px;font-weight:800;color:#161513}
.dg-mt{font-size:11px;color:var(--soft);font-weight:650;margin-top:2px}
.dg-link{border:none;cursor:pointer;font-size:11.5px;font-weight:800;color:#2743f0;background:#e4e9ff;padding:7px 12px;border-radius:12px;flex:none}
.dg-docs{padding-top:2px}
.dg-empty{color:var(--soft);font-weight:650;font-size:12px;padding:12px 0 14px}
.mbr-card{position:relative;display:flex;align-items:center;gap:11px;border-radius:16px;margin-bottom:10px;padding:12px 13px 12px 18px;overflow:hidden;
  background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);
  border:1.5px solid rgba(255,255,255,.7);box-shadow:0 14px 32px -20px rgba(22,21,19,.38),inset 0 1px 0 rgba(255,255,255,.6)}
.mbr-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--ac,#2743f0)}
.mbr-av{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;font-weight:800;font-size:16px;color:#fff;background:var(--ac,#2743f0);background-image:linear-gradient(160deg,rgba(255,255,255,.25),rgba(0,0,0,.2))}
.mbr-nm{font-size:14.5px;font-weight:800;color:#161513}
.mbr-mt{font-size:11.5px;color:var(--soft);font-weight:650;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mbr-role{font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.04em;text-transform:uppercase;padding:4px 9px;border-radius:999px;flex:none}
.mbr-role.own{background:#e4e9ff;color:#2743f0}.mbr-role.edit{background:#dff4e9;color:#0f7a53}.mbr-role.view{background:rgba(22,21,19,.08);color:var(--soft)}
.mbr-del{flex:none;width:30px;height:30px;border:none;border-radius:9px;background:rgba(22,21,19,.06);cursor:pointer;font-size:13px}
.mbr-del:hover{background:#ffe1e6}

/* ===== generic old-skin → glass, scoped to .tpage (finishes remaining screens) ===== */
.tpage .phead{display:flex;align-items:flex-end;gap:10px;margin:2px 2px 14px}
.tpage .phead>div:first-child{flex:1;min-width:0}
.tpage .phead .page,.tpage h1.page{margin:0;font-size:24px;font-weight:800;letter-spacing:-.02em;color:#161513}
.tpage .phead .psub,.tpage .psub{color:var(--soft);font-size:12.5px;font-weight:600;margin-top:3px}
.tpage .phead .btn,.tpage .phead .chiprow{margin-left:auto}
.tpage .back{display:inline-block;color:#2743f0;font-weight:800;text-decoration:none;margin-bottom:8px;font-size:13px}
.tpage .card,.tpage .hd-card{position:relative;background:rgba(255,253,248,.55);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border:1.5px solid rgba(255,255,255,.7)!important;border-radius:20px!important;box-shadow:0 16px 38px -18px rgba(22,21,19,.35),inset 0 1px 0 rgba(255,255,255,.6)!important;margin-bottom:13px}
/* keep inline-coloured cards (e.g. Guard-kiosk tiles) readable — they carry their own bg + white text */
.tpage .card[style*="background:#"],.tpage .card[style*="background: #"]{border:none!important;box-shadow:0 12px 26px -12px rgba(22,21,19,.4)!important}
.tpage .card .ch,.tpage .hd-card .hd-sect{display:flex;align-items:center;justify-content:space-between;gap:8px}
.tpage .card .ch h3{margin:0;font-size:14px;font-weight:800;color:#161513}
.tpage .ch .hint{font-size:11px;color:var(--soft);font-weight:700}
.tpage .summaryrow{display:flex;gap:11px;margin-bottom:13px}
.tpage .summaryrow .sumtile{flex:1;border-radius:16px;padding:12px 13px;background:linear-gradient(160deg,rgba(255,253,248,.85),rgba(255,253,248,.5));border:1.5px solid rgba(255,255,255,.65);box-shadow:0 10px 26px -14px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.75)}
.tpage .summaryrow .sumtile .l{font:800 8.5px ui-monospace,Menlo,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--soft)}
.tpage .summaryrow .sumtile .v{font-size:20px;font-weight:800;letter-spacing:-.02em;margin-top:4px;color:#161513}
.tpage .secthead{display:inline-flex;align-items:center;gap:8px;font:800 10.5px ui-monospace,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:#2743f0;background:linear-gradient(120deg,#e4e9ff,#d6ddff);padding:7px 13px;border-radius:20px;margin:6px 2px 10px}
.tpage .secthead .secount{background:rgba(39,67,240,.16);color:#2743f0;border-radius:9px;padding:1px 7px;font-size:10px}
.tpage .chipbtn,.tpage .chiprow .chip,.tpage .chip{border:none;cursor:pointer;font:800 11px system-ui;padding:7px 12px;border-radius:18px;color:var(--ink);background:rgba(255,253,248,.62);box-shadow:0 4px 12px -7px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.7)}
.tpage .chipbtn.on,.tpage .chip.on{background:linear-gradient(165deg,#4560ff,#1e37e0);color:#fff}
.tpage .btn{border:none;cursor:pointer;border-radius:22px;font-weight:800;font-size:13px;padding:10px 16px;color:#fff;background:linear-gradient(165deg,#31c986,#149a60);box-shadow:0 9px 18px -8px rgba(20,154,96,.6)}
.tpage .btn.ghost{background:rgba(255,253,248,.72);color:#2743f0;box-shadow:0 5px 14px -7px rgba(22,21,19,.3),inset 0 1px 0 #fff}
.tpage .btn.sm{padding:8px 13px;font-size:12px;border-radius:18px}
.tpage .btn.wide{width:100%}
.tpage .rcard,.tpage .rowitem{position:relative;background:rgba(255,253,248,.5)!important;-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border:1.5px solid rgba(255,255,255,.7)!important;border-radius:16px!important;box-shadow:0 14px 32px -20px rgba(22,21,19,.38),inset 0 1px 0 rgba(255,255,255,.6)!important;margin-bottom:10px}
.tpage .rcard .pnm,.tpage .rowitem .un{font-weight:800;color:#161513}
.tpage .rcard .pmeta,.tpage .rowitem .us{color:var(--soft);font-weight:650}
.tpage .empty{text-align:center;color:var(--soft);padding:22px 14px}
.tpage .empty .ic{font-size:30px}.tpage .empty h3{margin:6px 0 2px;color:#161513;font-size:15px}.tpage .empty p{margin:0;font-size:12px;font-weight:650}
.tpage .fieldnote{font-size:11.5px;color:var(--soft);font-weight:650;line-height:1.5}
.tpage .pill{display:inline-block;font:800 10px system-ui;padding:4px 10px;border-radius:999px;background:#e4e9ff;color:#2743f0}
.tpage .badge.b-ok{background:#dff4e9;color:#0f7a53}.tpage .badge.b-up{background:#e4e9ff;color:#2743f0}.tpage .badge.b-mut{background:rgba(22,21,19,.08);color:var(--soft)}.tpage .badge.b-over{background:#ffe1e6;color:#b3123a}

/* ===== Tenant portal + explore · glass overrides ===== */
.tpage .pd-title{display:flex;align-items:center;gap:11px;margin:2px 2px 14px}
.tpage .pd-title .pd-tile{width:46px;height:46px;border-radius:13px;flex:none;display:grid;place-items:center;font-size:20px;font-weight:800;color:#3a2c00;background:linear-gradient(160deg,#ffe27a,#f6c22c);box-shadow:0 6px 14px -6px rgba(230,160,0,.55)}
.tpage .pd-title h1{margin:0;font-size:22px;font-weight:800;letter-spacing:-.02em;color:#161513}
.tpage .pd-title .sub,.tpage .pd-title .sub .ty{font-size:12px;color:var(--soft);font-weight:600}
.tpage .pd-title .acts{margin-left:auto;display:flex;gap:8px}
.tpage .pd-flat{position:relative;display:flex;padding:0;background:rgba(255,253,248,.5);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border:1.5px solid rgba(255,255,255,.7);border-radius:16px;box-shadow:0 14px 32px -20px rgba(22,21,19,.38),inset 0 1px 0 rgba(255,255,255,.6);margin-bottom:11px;overflow:hidden}
.tpage .pd-flat .pd-rail{width:5px;flex:none}
.tpage .pd-flat .pd-in{flex:1;min-width:0;padding:13px 14px}
.tpage .pd-flat .ftile{width:40px;height:40px;border-radius:11px;flex:none;display:grid;place-items:center;font-weight:800;font-size:13px;color:#3a2c00;background:linear-gradient(160deg,#ffe27a,#f6c22c)}
.tpage .pd-flat .fnm{font-size:14px;font-weight:800;color:#161513}
.tpage .pd-flat .fmeta,.tpage .pd-flat .fpr .l{font-size:11px;color:var(--soft);font-weight:650}
.tpage .pd-flat .fpr .a{font-size:14px;font-weight:800;color:#161513}
.tpage .exp-card{background:rgba(255,253,248,.55)!important;-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border:1.5px solid rgba(255,255,255,.7)!important;border-radius:18px!important;box-shadow:0 16px 38px -20px rgba(22,21,19,.4),inset 0 1px 0 rgba(255,255,255,.6)!important}
.tpage .exp-fchip{background:rgba(255,253,248,.62);box-shadow:0 4px 12px -7px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.7)}
.tpage .exp-fchip.on{background:linear-gradient(165deg,#4560ff,#1e37e0);color:#fff}
.tpage .fst{display:inline-flex;align-items:center;font:800 8.5px system-ui;padding:3px 8px;border-radius:999px;text-transform:none;white-space:nowrap;background:rgba(22,21,19,.07);color:#161513}
.tpage .fst.ok{background:#dff4e9;color:#0f7a53}.tpage .fst.due{background:#fdeccd;color:#a86500}.tpage .fst.vac{background:#ffe1e6;color:#b3123a}.tpage .fst.bhk{background:#e4e9ff;color:#2743f0}.tpage .fst.mut{background:rgba(22,21,19,.07);color:var(--soft)}.tpage .fst.blue{background:#e4e9ff;color:#2743f0}
.tpage .pd-chips{display:flex;flex-wrap:wrap;gap:7px}
.tpage .pd-chip{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(165deg,rgba(255,255,255,.72),rgba(255,255,255,.4));border:1px solid rgba(255,255,255,.7);border-radius:999px;padding:6px 12px;font-size:11.5px;font-weight:700;color:#161513}
.tpage .pd-drow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid rgba(22,21,19,.07);font-size:12.5px}
.tpage .pd-drow:last-child{border-bottom:none}
.tpage .pd-drow .dl{color:var(--soft);font-weight:700}.tpage .pd-drow .dv{color:#161513;font-weight:800;text-align:right}
.tpage .tm-lrow{display:flex;align-items:center;gap:9px;padding:8px 0;border-bottom:1px solid rgba(22,21,19,.06);font-size:12px}
.tpage .tm-lrow .tm-lmo{font-weight:800;color:#161513;width:66px;flex:none}
.tpage .tm-lbar{flex:1;height:7px;border-radius:4px;background:#e6e0d5;overflow:hidden}.tpage .tm-lbar i{display:block;height:100%}
.tpage .tm-lamt{font-weight:800;color:#161513;font-size:11.5px;white-space:nowrap}
.tpage .pd-fbtn2{position:relative;overflow:hidden;border:none;border-radius:12px;padding:10px 12px;font-size:12px;font-weight:800;cursor:pointer;color:#161513;background:rgba(255,253,248,.66);box-shadow:0 6px 15px -8px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.7)}
.tpage .pd-fbtn2.pri{background:linear-gradient(160deg,#2ec27e,#149a60);color:#fff}

/* ===== .tpage: plain headings (kill old sticky-note badge) + softer form controls ===== */
.tpage .phead .page,.tpage h1.page{background:none!important;border:none!important;box-shadow:none!important;padding:0!important;transform:none!important;color:#161513;font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.tpage .phead .psub,.tpage .psub{background:none!important;border:none!important;box-shadow:none!important;padding:0!important;color:var(--soft);font-size:12.5px;font-weight:600;margin-top:3px}
.tpage input,.tpage select,.tpage textarea{border:1.5px solid rgba(22,21,19,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)!important;border-radius:12px!important;background:rgba(255,255,255,.72)!important}
.tpage label{color:#161513;font-weight:750}

/* ===== Society hub · contrast tweaks ===== */
.tpage .card.mhero{background:linear-gradient(150deg,#fff2e6,rgba(255,253,248,.6))!important}
.tpage .m-head{font-size:30px;font-weight:800;letter-spacing:-.03em;color:#161513;line-height:1}
.tpage .card .us{color:var(--soft);font-weight:750;font-size:11px}
.tpage .picon{border-radius:12px;display:grid;place-items:center;background:linear-gradient(160deg,#5f79ff,#2743f0)!important;color:#fff}
.tpage .card h3,.tpage .ch h3{color:#161513}
.tpage .grid .card [style*="font-weight:850"]{color:#161513}

/* ===== Settings plan pills: drop the old hard border ===== */
.tpage .pill{border:none!important;box-shadow:none!important;background:#e4e9ff;color:#2743f0;font-weight:800}

/* ===== force glass summary tiles on .tpage (beats the paper .sumtile hard-shadow) ===== */
.tpage .summaryrow .sumtile{background:linear-gradient(160deg,rgba(255,253,248,.85),rgba(255,253,248,.5))!important;border:1.5px solid rgba(255,255,255,.65)!important;box-shadow:0 10px 26px -14px rgba(22,21,19,.3),inset 0 1px 0 rgba(255,255,255,.75)!important;border-radius:16px!important}
.tpage .summaryrow .sumtile .v{color:#161513}

/* ===== Aurora-glass modal chrome (Rent & money mock, applies to all modals) ===== */
.modal{background:linear-gradient(165deg,rgba(255,253,248,.9),rgba(255,253,248,.74))!important;
  -webkit-backdrop-filter:blur(26px) saturate(1.35);backdrop-filter:blur(26px) saturate(1.35);
  border:1.5px solid rgba(255,255,255,.78)!important;
  box-shadow:0 -18px 50px -18px rgba(20,14,40,.4),0 30px 64px -22px rgba(20,14,40,.55),inset 0 1px 0 rgba(255,255,255,.9)!important}
.modal::before{content:"";display:block;width:38px;height:5px;border-radius:3px;background:rgba(22,21,19,.16);margin:10px auto -2px}
.modal .mh{background:transparent!important;border-bottom:none!important;border-radius:0!important;padding:12px 16px 10px!important;display:flex;align-items:center;gap:11px}
.modal .m-ic{width:40px;height:40px;border-radius:13px;flex:none;display:grid;place-items:center;font-size:19px;color:#fff;box-shadow:0 7px 15px -6px rgba(22,21,19,.4);position:relative;overflow:hidden}
.modal .m-ic::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.4),transparent 55%)}
.modal .m-ic.grn{background:linear-gradient(160deg,#33c98a,#149a60)}
.modal .m-ic.blu{background:linear-gradient(160deg,#5f79ff,#2743f0)}
.modal .m-ic.amb{background:linear-gradient(160deg,#ffdf6b,#f6c22c);color:#3a2600}
.modal .m-ic.rose{background:linear-gradient(160deg,#ff8298,#e85d75)}
.modal .m-ic.sun{background:linear-gradient(160deg,#ffe27a,#f6c22c);color:#3a2600}
.modal .m-htext{flex:1;min-width:0}
.modal .mh h3{margin:0;font-size:17px;font-weight:800;letter-spacing:-.01em;color:#161513}
.modal .mh .sub{font-size:11.5px;color:#8b8578!important;font-weight:650;margin-top:2px;opacity:1!important}
.modal .x{background:rgba(22,21,19,.06)!important;color:#8b8578!important;box-shadow:none!important;border-radius:50%!important;width:32px;height:32px}
.modal .mb{padding:2px 16px 18px!important}
/* glass form controls inside modals */
.modal input,.modal select,.modal textarea{border:1.5px solid rgba(22,21,19,.14)!important;background:rgba(255,255,255,.72)!important;border-radius:13px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)!important;font-weight:700}
.modal label{color:#161513;font-weight:750}
.modal .fieldnote{color:#8b8578}
/* glossy buttons inside modals */
.modal .btn{border:none!important;border-radius:15px!important;font-weight:800;color:#fff;background:linear-gradient(165deg,#31c986,#149a60)!important;box-shadow:0 11px 22px -9px rgba(20,154,96,.65)!important}
.modal .btn::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.38),transparent 55%);pointer-events:none}
.modal .btn{position:relative;overflow:hidden}
.modal .btn.ghost{background:rgba(255,253,248,.72)!important;color:#2743f0!important;box-shadow:0 6px 14px -8px rgba(22,21,19,.3),inset 0 1px 0 #fff!important}
.modal .btn.em{background:linear-gradient(165deg,#4560ff,#1e37e0)!important;color:#fff!important;box-shadow:0 11px 22px -9px rgba(39,67,240,.6)!important}
.modal .btn.rose{background:linear-gradient(165deg,#ff8298,#e85d75)!important;box-shadow:0 11px 22px -9px rgba(232,93,117,.6)!important}
.modal .btn.amber{background:linear-gradient(165deg,#ffdf6b,#f6c22c)!important;color:#3a2600!important;box-shadow:0 11px 22px -9px rgba(230,160,0,.6)!important}
.modal .btn.sm{padding:8px 14px;font-size:12.5px}
/* chip selectors + pills in modals */
.modal .chips button,.modal .seg button,.modal .chip{border:1.5px solid rgba(22,21,19,.12)!important;background:rgba(255,255,255,.6)!important;border-radius:12px!important;font-weight:800;color:#161513;box-shadow:none!important}
.modal .chips button.on,.modal .seg button.on,.modal .chip.on{background:linear-gradient(165deg,#4560ff,#1e37e0)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 7px 15px -7px rgba(39,67,240,.6)!important}
.modal .pill{border:none!important;box-shadow:none!important;background:#e4e9ff;color:#2743f0}

/* ===== Modal premium pass: warm glass, no white/grey buttons, icon pop, glass receipt ===== */
/* warm aurora tint on the sheet */
.modal{background:radial-gradient(120% 60% at 50% 0%,rgba(255,216,77,.16),transparent 60%),linear-gradient(170deg,rgba(255,247,235,.95),rgba(240,242,255,.84))!important}
/* colour-icon pop on open */
.modal.in .m-ic{animation:mIcPop .5s cubic-bezier(.34,1.5,.5,1) both}
@keyframes mIcPop{0%{transform:scale(.5) rotate(-8deg);opacity:0}60%{opacity:1}100%{transform:none;opacity:1}}
/* buttons: never white/grey — every one is a colour glass */
.modal .btn{transition:transform .14s ease,filter .14s ease}
.modal .btn:hover{filter:brightness(1.06)}
.modal .btn:active{transform:translateY(1px) scale(.99)}
.modal .btn.ghost,.modal .btn.soft,.modal .btn.sm.ghost{background:linear-gradient(165deg,#eaf0ff,#dbe4ff)!important;color:#2743f0!important;border:none!important;box-shadow:0 9px 20px -10px rgba(39,67,240,.45),inset 0 1px 0 rgba(255,255,255,.85)!important}
.modal .x{background:rgba(39,67,240,.09)!important;color:#2743f0!important;transition:transform .14s ease,filter .14s ease}
.modal .x:hover{filter:brightness(1.05);transform:scale(1.06)}
/* soften any inline hard-bordered / surface-2 panels inside modals → glass */
.modal .mb div[style*="solid var(--ink)"]{border:1.5px solid rgba(255,255,255,.72)!important;background:linear-gradient(165deg,rgba(255,255,255,.62),rgba(255,255,255,.34))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)!important;border-radius:15px!important}
.modal .mb [style*="var(--surface-2)"]{background:linear-gradient(165deg,rgba(255,255,255,.62),rgba(255,255,255,.34))!important;border:1px solid rgba(255,255,255,.6)!important;border-radius:13px!important}
/* premium glass receipt */
.rcpt{position:relative;border-radius:16px;padding:18px 16px 16px;margin-top:6px;overflow:hidden;
  background:linear-gradient(165deg,rgba(255,244,224,.72),rgba(255,253,248,.5));
  border:1.5px solid rgba(255,255,255,.72);box-shadow:0 16px 34px -18px rgba(22,21,19,.4),inset 0 1px 0 rgba(255,255,255,.7)}
.rcpt::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,#33c98a,#149a60)}
.rcpt-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:2px}
.rcpt-biz{font-weight:800;font-size:16px;color:#161513}
.rcpt-sub{font-size:11.5px;color:var(--soft);font-weight:700;margin:3px 0 10px}
.rcpt-tbl{width:100%;border-collapse:collapse;font-size:13px}
.rcpt-tbl td{padding:8px 0;border-bottom:1px dashed rgba(22,21,19,.14);color:#161513;font-weight:700}
.rcpt-tbl td.r{text-align:right;font-variant-numeric:tabular-nums;font-weight:800}
.rcpt-tbl tr:last-child td{border-bottom:none}

/* ===== Modal buttons: coloured, icon-led, animated (no plain/pale buttons) ===== */
.modal .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.modal .btn .bic{display:inline-flex;align-items:center;font-size:16px;line-height:1}
/* receipt: blue Print, WhatsApp-green WhatsApp */
.modal .btn.m-pdf{background:linear-gradient(165deg,#5a72ff,#2338d8)!important;color:#fff!important;box-shadow:0 13px 26px -10px rgba(39,67,240,.65)!important}
.modal .btn.m-wa{background:linear-gradient(165deg,#3ce07a,#1faa52)!important;color:#fff!important;box-shadow:0 13px 26px -10px rgba(31,170,82,.6)!important}
/* secondary is a real blue glass button, never pale/white/grey */
.modal .btn.ghost,.modal .btn.soft{background:linear-gradient(165deg,#dbe4ff,#b9c8ff)!important;color:#1e37e0!important;border:none!important;box-shadow:0 11px 22px -10px rgba(39,67,240,.5),inset 0 1px 0 rgba(255,255,255,.85)!important}
/* animated shine sweep on every coloured (primary) modal button */
.modal .btn:not(.ghost):not(.soft)::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);animation:tgShine 3.8s ease-in-out infinite;pointer-events:none;z-index:1}
@media (prefers-reduced-motion:reduce){.modal .btn:not(.ghost):not(.soft)::after{animation:none}}

/* ===== Modal CONTENT glassification (applies to all modal bodies) ===== */
.modal .mb label{display:block;font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);margin:13px 0 6px}
.modal .mb .fieldnote{color:var(--soft);font-size:11px;font-weight:650;line-height:1.5}
.modal .mb .psub,.modal .mb .us{color:var(--soft)}
/* amount hero panel */
.modal .rec-hero{background:linear-gradient(160deg,rgba(255,255,255,.62),rgba(255,255,255,.32));border:1px solid rgba(255,255,255,.62);border-radius:16px;padding:14px 15px;box-shadow:inset 0 1px 0 rgba(255,255,255,.6);text-align:center;margin-top:4px}
.modal .rec-hero .lbl{font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--soft)}
.modal .rec-hero .amt{font-size:30px;font-weight:800;letter-spacing:-.03em;margin-top:3px}
.modal .rec-hero .brk{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;margin-top:10px;font-size:11.5px;color:var(--soft);font-weight:650}
.modal .rec-hero .brk b{color:#161513;font-weight:800}
/* chip selectors */
.modal .rchips{display:flex;gap:7px;flex-wrap:wrap;margin-top:2px}
.modal .rchip{border:1.5px solid rgba(22,21,19,.12)!important;background:rgba(255,255,255,.58)!important;border-radius:12px!important;padding:9px 13px;font-size:12.5px;font-weight:800;cursor:pointer;color:#161513;box-shadow:none!important}
.modal .rchip.on{background:linear-gradient(165deg,#4560ff,#1e37e0)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 16px -8px rgba(39,67,240,.6)!important}
/* payment history rows */
.modal .rhist{margin-top:12px}
.modal .rhist .hh{font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);margin-bottom:7px}
.modal .rm-row{display:flex;align-items:center;gap:10px;padding:10px 11px;border-radius:13px;background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.62);margin-bottom:8px;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.55)}
.modal .rm-row .rt{font-size:16px;flex:none}
.modal .rm-row .rm-mid{flex:1;min-width:0}.modal .rm-row .rm-mid b{font-size:14px;font-weight:800;color:#161513}.modal .rm-row .rm-mid small{display:block;font-size:11px;color:var(--soft);font-weight:650}
.modal .rm-row .rm-go{color:#2743f0;font-weight:800;font-size:12px;white-space:nowrap}
/* generic panels / cards / tables / lists inside modals → glass */
.modal .mb .card,.modal .mb [style*="solid var(--line)"],.modal .mb [style*="solid var(--ink)"]{background:linear-gradient(160deg,rgba(255,255,255,.6),rgba(255,255,255,.34))!important;border:1px solid rgba(255,255,255,.62)!important;border-radius:14px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)!important}
.modal .mb [style*="border-top:1.5px dashed var(--line)"]{border-top:1px dashed rgba(22,21,19,.14)!important;background:none!important;box-shadow:none!important}
.modal .mb table{width:100%;border-collapse:collapse;font-size:13px}
.modal .mb table td{padding:7px 0;color:#161513}
.modal .mb table td.r{text-align:right;font-weight:800;font-variant-numeric:tabular-nums}
.modal .mb .empty{text-align:center;color:var(--soft);padding:20px 14px}
.modal .mb .empty .ic{font-size:28px}.modal .mb .empty h3{margin:6px 0 2px;color:#161513}
/* keep the section divider (msec) subtle */
.modal .mb hr{border:none;border-top:1px solid rgba(22,21,19,.1);margin:14px 0}

/* ===== V3 Add-expense modal — glass fields, trendy pickers, calendar ===== */
/* amount hero */
.modal .xv-amt{background:linear-gradient(160deg,rgba(255,255,255,.62),rgba(255,255,255,.32));border:1px solid rgba(255,255,255,.62);border-radius:18px;padding:13px;text-align:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.6);margin-top:4px}
.modal .xv-amt .l{font:800 9px ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase;color:#8b8578}
.modal .xv-amt .in{display:flex;align-items:center;justify-content:center;gap:2px;margin-top:2px}
.modal .xv-amt .cur{font-size:26px;font-weight:800;color:#8b8578}
.modal .xv-amt input{border:none;background:none;text-align:center;font-size:34px;font-weight:800;letter-spacing:-.03em;width:auto;max-width:210px;color:#161513;outline:none;box-shadow:none;padding:0;-moz-appearance:textfield}
.modal .xv-amt input::-webkit-outer-spin-button,.modal .xv-amt input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
/* category icon grid */
.modal .xv-catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:7px}
.modal .xv-cat{border:1.5px solid rgba(22,21,19,.1);background:rgba(255,255,255,.5);border-radius:14px;padding:10px 3px;text-align:center;cursor:pointer;transition:transform .13s cubic-bezier(.34,1.56,.64,1),box-shadow .13s,background .13s;box-shadow:none}
.modal .xv-cat .i{font-size:20px;line-height:1;display:block}
.modal .xv-cat .t{font-size:8.5px;font-weight:800;color:#161513;margin-top:5px;letter-spacing:.01em;display:block;line-height:1.1}
.modal .xv-cat:hover{transform:translateY(-2px)}
.modal .xv-cat.on{transform:translateY(-2px) scale(1.03);background:color-mix(in srgb,var(--cc) 14%,#fff);border-color:var(--cc);box-shadow:0 9px 18px -9px var(--cc)}
/* segmented scope */
.modal .xv-seg{display:flex;gap:6px;background:rgba(22,21,19,.05);border-radius:14px;padding:4px;margin-top:7px}
.modal .xv-seg button{flex:1;border:none;background:none;border-radius:11px;padding:10px 8px;font-size:12.5px;font-weight:800;cursor:pointer;color:#8b8578;display:inline-flex;align-items:center;justify-content:center;gap:5px;transition:.14s;box-shadow:none}
.modal .xv-seg button.on{background:#fff;color:#161513;box-shadow:0 4px 10px -5px rgba(22,21,19,.35)}
/* split toggle */
.modal .xv-split{display:flex;gap:7px;margin-top:7px}
.modal .xv-opt{flex:1;border:1.5px solid rgba(22,21,19,.12);background:rgba(255,255,255,.55);border-radius:13px;padding:10px 8px;cursor:pointer;text-align:center;transition:.14s}
.modal .xv-opt .h{font-size:12.5px;font-weight:800;color:#161513}
.modal .xv-opt .d{font-size:9.5px;font-weight:650;color:#8b8578;margin-top:3px}
.modal .xv-opt.on{background:linear-gradient(160deg,#e0e6ff,rgba(224,230,255,.45));border-color:#2743F0;box-shadow:0 8px 16px -8px rgba(39,67,240,.5)}
/* live split math */
.modal .xv-calc{margin-top:11px;border-radius:14px;padding:11px 13px;background:linear-gradient(160deg,rgba(39,67,240,.09),rgba(39,67,240,.03));border:1px solid rgba(39,67,240,.18);display:flex;align-items:center;gap:10px}
.modal .xv-calc:empty{display:none}
.modal .xv-calcic{width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;font-size:15px;background:rgba(39,67,240,.14)}
.modal .xv-calctx{font-size:13px;font-weight:800;color:#1e37e0;line-height:1.35}
.modal .xv-calctx b{color:#122}
.modal .xv-calctx small{display:block;font-size:10.5px;font-weight:650;color:#8b8578}
/* who pays */
.modal .xv-who{display:flex;gap:7px;margin-top:7px}
.modal .xv-who button{flex:1;justify-content:center;border:1.5px solid rgba(22,21,19,.12);background:rgba(255,255,255,.6);border-radius:12px;padding:11px;font-size:12.5px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.14s;color:#161513;box-shadow:none}
.modal .xv-who button.on{background:linear-gradient(165deg,#4560ff,#1e37e0);color:#fff;border-color:transparent;box-shadow:0 8px 16px -8px rgba(39,67,240,.6)}
.modal .xv-who button.t.on{background:linear-gradient(165deg,#31c986,#149a60);box-shadow:0 8px 16px -8px rgba(20,154,96,.6)}
/* picker button (shared by building & flat) */
.modal .xv-fp{position:relative;margin-top:7px}
.modal .xv-fpbtn{width:100%;display:flex;align-items:center;gap:11px;border:1.5px solid rgba(22,21,19,.14);background:rgba(255,255,255,.72);border-radius:14px;padding:9px 12px;cursor:pointer;text-align:left;box-shadow:inset 0 1px 0 rgba(255,255,255,.6);transition:.15s}
.modal .xv-fpbtn:hover{border-color:rgba(39,67,240,.35)}
.xv-fpic{width:36px;height:36px;border-radius:11px;flex:none;display:grid;place-items:center;font-size:16px;background:linear-gradient(160deg,#e0e6ff,#c9d3ff);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.xv-fptxt{flex:1;min-width:0;line-height:1.25}
.xv-fptxt b{display:block;font-size:14.5px;font-weight:800;color:#161513}
.xv-fptxt small{display:block;font-size:11px;font-weight:650;color:#8b8578;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xv-fpstatus{font:800 8px ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px;border-radius:8px;flex:none}
.xv-fpstatus.occ{background:rgba(20,154,96,.14);color:#0f7a53}
.xv-fpstatus.vac{background:rgba(139,133,120,.16);color:#6f6a5f}
.xv-fpcv{flex:none;color:#8b8578;font-size:13px;transition:transform .2s}
/* picker menu (portaled to body) */
.xv-fpmenu{position:absolute;left:0;right:0;top:calc(100% + 7px);z-index:2200;border-radius:16px;padding:7px;display:flex;flex-direction:column;
  background:linear-gradient(170deg,rgba(255,251,246,.99),rgba(243,245,255,.99));
  -webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);
  border:1.5px solid rgba(255,255,255,.9);box-shadow:0 28px 56px -14px rgba(20,14,40,.6),inset 0 1px 0 rgba(255,255,255,.95);
  transform-origin:top;transform:scaleY(.7) translateY(-6px);opacity:0;pointer-events:none;visibility:hidden;
  transition:transform .19s cubic-bezier(.34,1.5,.6,1),opacity .15s}
.xv-fpmenu.floating{position:fixed}
.xv-fpmenu.up{transform-origin:bottom;transform:scaleY(.7) translateY(6px)}
.xv-fpmenu.show{transform:none;opacity:1;pointer-events:auto;visibility:visible}
.xv-fpsearch{width:100%;border:1.5px solid rgba(22,21,19,.1);background:rgba(255,255,255,.7);border-radius:11px;padding:9px 11px;font-size:13px;font-weight:650;color:#161513;margin-bottom:5px;outline:none;box-shadow:none}
.xv-fpsearch:focus{border-color:rgba(39,67,240,.4)}
.xv-fplist{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
.xv-fplist::-webkit-scrollbar{width:8px}
.xv-fplist::-webkit-scrollbar-thumb{background:rgba(22,21,19,.16);border-radius:8px;border:2px solid transparent;background-clip:content-box}
.xv-fpopt{display:flex;align-items:center;gap:10px;padding:8px 9px;border-radius:12px;cursor:pointer;transition:background .12s}
.xv-fpopt:hover{background:rgba(39,67,240,.08)}
.xv-fpopt.sel{background:rgba(39,67,240,.1)}
.xv-fpcheck{flex:none;color:#2743F0;font-size:14px;opacity:0;font-weight:800}
.xv-fpopt.sel .xv-fpcheck{opacity:1}
.xv-fpnone{padding:14px;text-align:center;font-size:12px;font-weight:650;color:#8b8578;display:none}
/* glass calendar (portaled to body) */
.xv-cal{position:absolute;z-index:2200;width:290px;border-radius:18px;padding:12px;
  background:linear-gradient(170deg,rgba(255,251,246,.99),rgba(243,245,255,.99));
  -webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);
  border:1.5px solid rgba(255,255,255,.9);box-shadow:0 28px 56px -14px rgba(20,14,40,.6),inset 0 1px 0 rgba(255,255,255,.95);
  transform-origin:top;transform:scaleY(.7) translateY(-6px);opacity:0;pointer-events:none;visibility:hidden;
  transition:transform .19s cubic-bezier(.34,1.5,.6,1),opacity .15s}
.xv-cal.floating{position:fixed}
.xv-cal.up{transform-origin:bottom;transform:scaleY(.7) translateY(6px)}
.xv-cal.show{transform:none;opacity:1;pointer-events:auto;visibility:visible}
.xv-calhd{display:flex;align-items:center;gap:6px;margin-bottom:8px}
.xv-caltitle{flex:1;text-align:center;font-size:14px;font-weight:800;color:#161513}
.xv-calnav{width:32px;height:32px;flex:none;border:none;border-radius:10px;background:rgba(39,67,240,.08);color:#2743F0;font-size:16px;font-weight:800;cursor:pointer;display:grid;place-items:center;transition:.13s;box-shadow:none}
.xv-calnav:hover{background:rgba(39,67,240,.16)}
.xv-calwk{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:3px}
.xv-calwk span{text-align:center;font:800 9px ui-monospace,Menlo,monospace;color:#8b8578;padding:4px 0}
.xv-calgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.xv-calday{aspect-ratio:1;border:none;background:none;border-radius:10px;font-size:13px;font-weight:750;color:#161513;cursor:pointer;display:grid;place-items:center;transition:.12s;position:relative;box-shadow:none}
.xv-calday:hover{background:rgba(39,67,240,.1)}
.xv-calday.mut{color:rgba(22,21,19,.25);font-weight:600;cursor:default}
.xv-calday.today{color:#2743F0;font-weight:800}
.xv-calday.today::after{content:"";position:absolute;bottom:5px;width:4px;height:4px;border-radius:50%;background:#2743F0}
.xv-calday.sel{background:linear-gradient(165deg,#4560ff,#1e37e0);color:#fff;box-shadow:0 7px 14px -6px rgba(39,67,240,.6)}
.xv-calday.sel::after{background:#fff}
.xv-calfoot{margin-top:9px;display:flex;justify-content:center}
.xv-caltoday{border:none;background:rgba(20,154,96,.12);color:#0f7a53;font-size:12px;font-weight:800;padding:8px 16px;border-radius:11px;cursor:pointer;transition:.13s;box-shadow:none}
.xv-caltoday:hover{background:rgba(20,154,96,.2)}
/* date field face */
.modal .xv-date{position:relative;display:flex;align-items:center;gap:11px;width:100%;border:1.5px solid rgba(22,21,19,.14);background:rgba(255,255,255,.72);border-radius:14px;padding:9px 12px;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.6);transition:.15s;margin-top:7px}
.modal .xv-date:hover{border-color:rgba(39,67,240,.35)}
.modal .xv-date:focus{outline:none;border-color:#2743F0;box-shadow:0 0 0 3px rgba(39,67,240,.14)}
.xv-dfic{width:36px;height:36px;border-radius:11px;flex:none;display:grid;place-items:center;font-size:16px;background:linear-gradient(160deg,#fff0cf,#ffe08a);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.xv-dftxt{flex:1;min-width:0;font-size:15px;font-weight:800;color:#161513}
.xv-dftxt small{display:block;font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#149a60}
.xv-dfcv{flex:none;color:#8b8578;font-size:13px}
/* green save button (uses existing .btn.em base; ensure gradient) */
.modal .btn.xv-mbtn{background:linear-gradient(165deg,#31c986,#149a60);color:#fff}
/* tenant-charge billing-month control (glass) */
.modal .xv-billbox{margin-top:14px;border-radius:15px;padding:12px 13px;background:linear-gradient(160deg,rgba(229,138,0,.1),rgba(229,138,0,.03));border:1px solid rgba(229,138,0,.22)}
.modal .xv-billtitle{font-weight:850;font-size:12.5px;color:#a15c00}
.modal .xv-billsub{font-size:11px;font-weight:650;color:#8b8578;margin:3px 0 8px}
.modal .xv-billbox .xv-seg{background:rgba(255,255,255,.5)}