/* v14.7 "Looks" → v17.4 brand looks (Fabien, Nov 8 2026). Three looks:
   · Heights (B, the DEFAULT): near-black #0b0c0a, ivory #f1eee6, lime #c4f434 · Cormorant Garamond for big titles only, Inter SemiBold UI.
   · Daylight (C): off-white #f3f0e8, sand #e8e4d9 cards, ink #121212, lime as solid fills · heavy Inter, serif only for headlines.
   · Original: the first Lumen look = the base stylesheets, untouched.
   Heights and Daylight are html[data-theme] overrides: generated colour/radius/spacing remaps (themes-app.css, themes-welcome.css)
   + the hand-tuned variables, fonts and finishing touches below. The pick lives in localStorage ("lumen_look"), ?theme= on any
   page, and per login on the server (More → Appearance). public/theme.js applies it before first paint. */

/* self-hosted brand fonts (latin, variable weight). Own family names so the Original look's font stack never picks them up. */
@font-face{font-family:"Lumen Inter";font-style:normal;font-weight:300 900;font-display:swap;src:url(/fonts/Inter-normal.woff2) format("woff2")}
@font-face{font-family:"Lumen Cormorant";font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/CormorantGaramond-normal.woff2) format("woff2")}
@font-face{font-family:"Lumen Cormorant";font-style:italic;font-weight:300 700;font-display:swap;src:url(/fonts/CormorantGaramond-italic.woff2) format("woff2")}

/* ---------- B · Heights (default): warm near-black, ivory, lime · Cormorant big titles + Inter SemiBold ---------- */
html[data-theme="heights"]{--bg:#0b0c0a;--card:#151613;--card2:#1a1b17;--line:#262722;--text:#f1eee6;--muted:#8f8d86;
  --lime:#c4f434;--lime-d:#acd81f;--lime-text:#c4f434;--red:#ff7a59;--amber:#ffb547;--blue:#6fb6ff;--r:14px;
  --font-body:"Lumen Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-display:"Lumen Cormorant","Cormorant Garamond",Georgia,"Times New Roman",serif;
  color-scheme:dark}
html[data-theme="heights"] body{font-family:var(--font-body);font-size:15px;line-height:1.45;font-feature-settings:"cv11","ss01"}
html[data-theme="heights"] h1{font-family:var(--font-display);font-weight:500;font-size:34px;line-height:1.05;letter-spacing:0}
html[data-theme="heights"] h2{font-weight:650;letter-spacing:-.01em}
html[data-theme="heights"] h3,html[data-theme="heights"] b,html[data-theme="heights"] strong{font-weight:650}
html[data-theme="heights"] .stat .v,html[data-theme="heights"] .kpi b{font-weight:700;letter-spacing:-.02em}
html[data-theme="heights"] .btn{font-weight:600}
html[data-theme="heights"] .btn.primary,html[data-theme="heights"] button.primary{font-weight:700;color:#0b0c0a}
html[data-theme="heights"] .pill{font-weight:600}
html[data-theme="heights"] .tabbar{background:rgba(11,12,10,.95)}
html[data-theme="heights"] .tabbar button{font-weight:600}
html[data-theme="heights"] .tabbar .badge{background:var(--lime);color:#0b0c0a;font-weight:800}
html[data-theme="heights"] .brand .dot:not(.has-img){background:var(--lime);color:#0b0c0a}

/* ---------- C · Daylight: off-white, sand, ink, lime fills · heavy Inter, serif headlines ---------- */
html[data-theme="daylight"]{--bg:#f3f0e8;--card:#e8e4d9;--card2:#e1dccf;--line:#d6d0c2;--text:#121212;--muted:#6b675e;
  --lime:#c4f434;--lime-d:#b2df1f;--lime-text:#121212;--red:#c2361b;--amber:#8a5a00;--blue:#1f5f99;--r:18px;
  --font-body:"Lumen Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-display:"Lumen Cormorant","Cormorant Garamond",Georgia,"Times New Roman",serif;
  color-scheme:light}
html[data-theme="daylight"] body{font-family:var(--font-body);font-size:15px;line-height:1.45;font-weight:500}
html[data-theme="daylight"] h1{font-weight:900;letter-spacing:-.03em;line-height:1.12}
html[data-theme="daylight"] h2,html[data-theme="daylight"] h3{font-weight:850;letter-spacing:-.02em}
html[data-theme="daylight"] b,html[data-theme="daylight"] strong{font-weight:800}
html[data-theme="daylight"] .stat .v,html[data-theme="daylight"] .kpi b{font-weight:900;letter-spacing:-.04em}
html[data-theme="daylight"] .btn{font-weight:700}
html[data-theme="daylight"] .btn.primary,html[data-theme="daylight"] button.primary{background:#121212;border-color:#121212;color:var(--lime);font-weight:800}
html[data-theme="daylight"] .btn.primary:hover,html[data-theme="daylight"] button.primary:hover{background:#2a2a28}
html[data-theme="daylight"] .card,html[data-theme="daylight"] .tile{border-color:transparent}
html[data-theme="daylight"] .tabbar{background:rgba(243,240,232,.96)}
html[data-theme="daylight"] .tabbar button{font-weight:700}
html[data-theme="daylight"] .tabbar button[aria-selected=true]{color:#121212}
html[data-theme="daylight"] .tabbar button[aria-selected=true] svg{background:var(--lime);border-radius:10px;padding:3px 7px;width:38px;box-sizing:content-box;height:21px}
html[data-theme="daylight"] .tabbar .badge{background:#121212;color:var(--lime);font-weight:900}
html[data-theme="daylight"] .brand .dot:not(.has-img){background:var(--lime);color:#121212}
html[data-theme="daylight"] a{color:#121212;text-decoration-color:var(--lime-d);text-decoration-thickness:2px}
html[data-theme="daylight"] ::selection{background:var(--lime);color:#121212}
html[data-theme="daylight"] [style*="color:var(--lime)"]{color:var(--lime-text)!important} /* inline lime text in the scripts → ink */

/* finishing touches shared by the brand looks: pill buttons, solid IN tags, the demo strip, the photo chip */
html[data-theme="heights"] .btn,html[data-theme="daylight"] .btn{border-radius:999px}
html[data-theme="heights"] .tv-k.in{background:var(--lime);color:#0b0c0a;border-color:var(--lime)}
html[data-theme="heights"] .tv-k.out{color:var(--text);border-color:rgba(241,238,230,.32)}
html[data-theme="heights"] .demo-bar{background:#1a1d10;color:var(--muted);border-bottom:1px solid rgba(196,244,52,.28)}
html[data-theme="heights"] .demo-bar b{color:var(--lime);letter-spacing:.06em}
html[data-theme="heights"] .demo-bar .btn{color:var(--text);border-color:rgba(241,238,230,.22);background:transparent}
html[data-theme="heights"] .demo-bar .btn:not(.ghost){background:var(--lime);color:#0b0c0a;border-color:var(--lime)}
html[data-theme="daylight"] .tv-k.in{background:var(--lime);color:#121212;border-color:var(--lime);font-weight:900}
html[data-theme="daylight"] .tv-k.out{background:#121212;color:#f3f0e8;border-color:#121212;font-weight:900}
html[data-theme="daylight"] .demo-bar{background:var(--lime);color:#121212}
html[data-theme="daylight"] .demo-bar b{font-weight:900}
html[data-theme="daylight"] .demo-bar .btn{color:#121212;border-color:rgba(18,18,18,.3);background:transparent}
html[data-theme="daylight"] .demo-bar .btn:not(.ghost){background:#121212;color:var(--lime);border-color:#121212}
html[data-theme="daylight"] .bx-chip{background:rgba(243,240,232,.92);color:#121212}
html[data-theme="daylight"] .bx-av{border-color:var(--bg);box-shadow:none}

/* ---------- header lock-up "Lumen · by Ananda Heights" (added to the app's header by theme.js; brand looks only) ---------- */
.lt-lock{display:none}
html[data-theme="heights"] .lt-lock,html[data-theme="daylight"] .lt-lock{display:flex;align-items:center;gap:8px;max-width:1100px;margin:0 auto;padding:10px 16px 0;line-height:1;white-space:nowrap}
.lt-lock .lt-sq{width:22px;height:22px;border-radius:7px;background:var(--lime);color:#0b0c0a;font-weight:800;font-size:13px;display:grid;place-items:center;font-family:var(--font-body)}
.lt-lock .lt-prod{font-weight:700;font-size:15px;letter-spacing:-.01em;color:var(--text)}
.lt-lock .lt-by{font-family:var(--font-display);font-style:italic;font-size:14.5px;color:var(--muted)}
html[data-theme="daylight"] .lt-lock .lt-sq{color:#121212;font-weight:900}
html[data-theme="daylight"] .lt-lock .lt-prod{font-weight:900;font-size:16px;letter-spacing:-.03em}
html[data-theme="daylight"] .lt-lock .lt-by{font-family:var(--font-body);font-style:normal;font-size:11px;font-weight:600}

/* ---------- More → Appearance (the picker sheet, built by theme.js) ---------- */
.lt-back{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.55);display:flex;align-items:flex-end;justify-content:center}
.lt-sheet{width:100%;max-width:560px;max-height:92vh;overflow:auto;background:var(--bg);color:var(--text);border-radius:22px 22px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line)}
.lt-sheet h2{margin:0 0 2px;font-size:22px}
.lt-sheet .lt-sub{color:var(--muted);font-size:13.5px;margin-bottom:14px}
.lt-opt{display:block;width:100%;text-align:left;border:2px solid var(--line);background:var(--card);color:var(--text);border-radius:16px;padding:12px;margin-bottom:12px;cursor:pointer;font:inherit}
.lt-opt.on{border-color:var(--lime)}
.lt-opt .lt-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.lt-opt b{font-size:16px}
.lt-opt .lt-on{font-size:12px;font-weight:800;color:var(--lime-text,var(--lime))}
.lt-opt p{margin:2px 0 10px;color:var(--muted);font-size:13px}
.lt-prev{border-radius:12px;padding:12px;display:grid;gap:8px;overflow:hidden}
.lt-prev .lt-h{font-size:19px;line-height:1.1}
.lt-prev .lt-row{display:flex;gap:8px;align-items:center}
.lt-prev .lt-kpi{flex:1;padding:8px 10px;font-size:11px}
.lt-prev .lt-kpi strong{display:block;font-size:17px}
.lt-prev .lt-btn{padding:7px 12px;font-weight:800;font-size:12px}
.lt-prev .lt-sw{display:flex;gap:5px}.lt-prev .lt-sw i{width:16px;height:16px;border-radius:50%;display:block}
.lt-p-heights{background:#0b0c0a;color:#f1eee6;font-family:"Lumen Inter",system-ui,sans-serif}
.lt-p-heights .lt-h{font-family:"Lumen Cormorant",Georgia,serif;font-weight:500;font-size:24px}
.lt-p-heights .lt-kpi{background:#151613;border:1px solid #262722;border-radius:12px}.lt-p-heights .lt-kpi strong{font-weight:700}
.lt-p-heights .lt-btn{background:#c4f434;color:#0b0c0a;border-radius:999px;font-weight:700}
.lt-p-daylight{background:#f3f0e8;color:#121212;font-family:"Lumen Inter",system-ui,sans-serif}
.lt-p-daylight .lt-h{font-weight:900;letter-spacing:-.03em}
.lt-p-daylight .lt-kpi{background:#e8e4d9;border-radius:16px}.lt-p-daylight .lt-kpi strong{font-weight:900;letter-spacing:-.03em}
.lt-p-daylight .lt-kpi.lt-hot{background:#c4f434}
.lt-p-daylight .lt-btn{background:#121212;color:#c4f434;border-radius:999px;font-weight:800}
.lt-p-original{background:#0a0c0b;color:#eef2ea;font-family:-apple-system,system-ui,sans-serif}
.lt-p-original .lt-h{font-weight:900;letter-spacing:-.03em}.lt-p-original .lt-kpi{background:#131715;border:1px solid #232a26;border-radius:12px}.lt-p-original .lt-kpi strong{font-weight:900}
.lt-p-original .lt-btn{background:#c6f432;color:#0a0c0b;border-radius:11px}
.lt-opt .lt-def{font-size:11px;font-weight:700;color:var(--muted);margin-left:6px}
.lt-done{margin-top:4px}
.lt-link{display:block;text-align:center;color:var(--muted);font-size:13px;margin-top:10px}

/* ---------- v14.7: photo on the contractor signup page (/join) ---------- */
.join-photo{display:block;margin:0 -16px 16px;position:relative;overflow:hidden;border-radius:0 0 var(--r) var(--r)}
.join-photo img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
@media(min-width:600px){.join-photo{margin:0 0 16px;border-radius:var(--r)}}

/* v17.4.1 final Lumen mark ("Lit window", Fabien Nov 8 2026): lime rounded tile, black L with one lit square. The same inline SVG
   sits in every product mark (login, welcome pages, resident/check-in/job/pro headers, the reports, the lock-up), in all three looks. */
.lm{background:none!important;padding:0!important;border-radius:0!important;overflow:visible;color:inherit}
.lm .lm-svg{width:100%;height:100%;display:block}
.lm-svg .lm-t{fill:#c4f434}.lm-svg .lm-g{fill:#0b0c0a}
.lt-lock .lt-sq{background:none!important}
.lt-lock .lt-sq .lm-svg{width:22px;height:22px}
.lm-login{gap:12px!important}
.lm-login .dot{width:46px!important;height:46px!important}
.lm-login>div:last-child{font-size:25px;font-weight:800;letter-spacing:-.02em;line-height:1.05}
.lm-login small{font-size:13px;font-weight:500;letter-spacing:0;margin-top:3px}
html[data-theme="heights"] .lm-login small{font-family:var(--font-display);font-style:italic;font-size:16.5px}
html[data-theme="daylight"] .lm-login>div:last-child{font-weight:900;letter-spacing:-.035em}