/* Smartstay OS — Getaway design language (Geist, white cards, outlined pill tabs, highlighted titles)
   recoloured: Blueberry #243B8F replaces Getaway purple, Cream Soda #FFF0C9 replaces its lime.
   Mobile only: everything lives in one phone-width column. No inline styles (CSP). */
@font-face{font-family:Geist;src:url(/fonts/geist-latin.woff2) format('woff2');font-weight:100 900;font-display:swap}
:root{
  --brand:#243b8f;--accent:#fff0c9;--ink:#121a3f;--fg:#1c1d22;--muted:#5f6270;--border:#d9dade;--page:#f4f5f9;--white:#fff;--backdrop:#e4e7f0;
  --line:rgba(217,218,222,.7);--brand-10:rgba(36,59,143,.1);--brand-06:rgba(36,59,143,.06);--brand-35:rgba(36,59,143,.35);
  --warn-bg:#fef3c7;--warn-fg:#78350f;--crit-bg:#ffe4e6;--crit-fg:#9f1239;
  --shadow:0 1px 2px rgba(18,26,63,.04),0 16px 40px -32px rgba(18,26,63,.22);
  --font:Geist,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;background:var(--backdrop);font-family:var(--font);color:var(--fg);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.45}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation;background:none;border:0;padding:0}
button:disabled{opacity:.45;cursor:not-allowed}
a{color:var(--brand);text-decoration:none}
h1,h2,h3,p{margin:0}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
#app{max-width:430px;min-height:100dvh;margin:0 auto;background:var(--page);position:relative;overflow-x:clip}
@media (min-width:480px){#app{box-shadow:0 0 0 1px rgba(18,26,63,.06),0 30px 80px -30px rgba(18,26,63,.35)}}
.loading{padding:30vh 20px;text-align:center;color:var(--muted);font-weight:600}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- Header ---- */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:6px;height:84px;padding:0 12px 0 16px;background:var(--white);border-bottom:1px solid var(--line)}
.wordmark{margin-right:auto;font-size:21px;font-weight:800;letter-spacing:-.045em;color:var(--brand);line-height:1}
.iconbtn{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;color:var(--ink);transition:background .15s}
.iconbtn.on{background:var(--brand-06);color:var(--brand)}
.iconbtn svg,.ico{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.badge-dot{position:absolute;top:6px;right:5px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:var(--brand);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 2px #fff}
main{padding:14px 16px 96px;min-width:0}
.stack{display:flex;flex-direction:column;gap:14px}
.stack-s{display:flex;flex-direction:column;gap:8px}
.row-flex{display:flex;align-items:center;gap:8px}
.between{display:flex;align-items:center;justify-content:space-between;gap:8px}
.grow{flex:1;min-width:0}
.wrap{flex-wrap:wrap}
.muted{color:var(--muted)}
.small,small{font-size:12px}
.nowrap{white-space:nowrap}
.trunc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bold{font-weight:700;color:var(--ink)}
.right{text-align:right}
.hidden{display:none!important}

/* ---- Titles: the Getaway highlight, in Cream Soda ---- */
.page-title{font-size:26px;font-weight:800;letter-spacing:-.03em;line-height:1.25;color:var(--ink);text-wrap:balance}
.hl-wrap{display:inline-block;max-width:100%;transform:rotate(-.8deg)}
.hl{display:inline;background:var(--accent);color:var(--ink);padding:2px 8px;border-radius:10px;-webkit-box-decoration-break:clone;box-decoration-break:clone;line-height:1.6}
.hl-name{display:inline-block;background:var(--accent);color:var(--ink);padding:0 8px;border-radius:8px;transform:rotate(-1deg)}
.greeting{font-size:28px;font-weight:800;letter-spacing:-.03em;line-height:1.25;color:var(--ink)}
.lead{margin-top:6px;font-size:14px;color:var(--muted)}
.page-head{display:flex;flex-direction:column;gap:12px}
.page-actions{display:flex;flex-wrap:wrap;gap:8px}
.back{display:inline-flex;align-items:center;gap:2px;margin:-4px 0 8px -6px;padding:6px 10px 6px 4px;border-radius:10px;font-weight:700;font-size:13px;color:var(--brand)}

.back svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---- Cards ---- */
.card{background:var(--white);border:1px solid var(--line);border-radius:24px;padding:16px;box-shadow:var(--shadow)}
.card.flat{box-shadow:none}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.card-label{position:relative;display:inline-block;padding:0 4px;font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#fff}
.card-label::before{content:"";position:absolute;inset:-3px -4px -3px -6px;background:var(--brand);border-radius:2px;transform:rotate(-.8deg)}
.card-label span{position:relative}
.card-sub{font-size:12px;font-weight:600;color:var(--muted)}
.divider{height:0;margin:8px 0;border:0;background:none}
.divider.rule{height:1px;background:var(--line);margin:12px 0}
.empty{padding:28px 12px;text-align:center;color:var(--muted);font-size:13px}
.empty strong{display:block;color:var(--ink);font-size:15px;margin-bottom:4px}
.note{border-radius:14px;background:var(--accent);color:var(--ink);padding:10px 12px;font-size:12.5px;line-height:1.5}
.note.plain{background:var(--white);border:1px dashed var(--border);color:var(--muted)}
.note.warn{background:var(--warn-bg);color:var(--warn-fg)}

/* ---- KPI (white card, brand edge) ---- */
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kpi{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:6px;min-width:0;padding:14px 12px 14px 16px;background:var(--white);border:1px solid var(--line);border-radius:16px;overflow:hidden;color:inherit;transition:border-color .15s,transform .15s}

.kpi::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--brand)}
.kpi b{font-size:28px;line-height:1;font-weight:800;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.kpi .lab{font-size:13px;font-weight:700;color:var(--ink)}
.kpi small{font-size:12px;color:var(--muted);line-height:1.3}
.kpi.money b{font-size:20px;letter-spacing:-.01em;overflow-wrap:anywhere}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 14px;border-radius:12px;font-size:13px;font-weight:700;white-space:nowrap;transition:filter .15s,background .15s;text-align:center}
.btn.sm{min-height:34px;padding:6px 12px;border-radius:10px;font-size:12px}
.btn.block{display:flex;width:100%;min-height:48px;font-size:15px}
.btn-primary{background:var(--brand);color:#fff}
.btn-subtle{background:var(--white);color:var(--brand);border:1px solid var(--brand-35)}
.btn-cream{background:var(--accent);color:var(--brand)}
.btn-ghost{color:var(--ink)}
.btn-danger{background:var(--white);color:var(--crit-fg);border:1px solid #f4b6c0}
.btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.btn-row{display:flex;flex-wrap:wrap;gap:8px}
.link{font-size:12px;font-weight:700;color:var(--brand)}

/* ---- Pill tabs (Getaway segmented tabs) ---- */
.seg{display:flex;gap:6px;overflow-x:auto;margin:0 -16px;padding:2px 16px;scrollbar-width:none;-ms-overflow-style:none}
.seg::-webkit-scrollbar{display:none}
.seg>*{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:99px;border:1px solid var(--brand-35);background:var(--white);color:var(--brand);font-size:13px;font-weight:700;white-space:nowrap;transition:background .15s}

.seg>.on{background:var(--brand);border-color:var(--brand);color:#fff}
.seg i{font-style:normal;font-size:12px;font-weight:800;padding:1px 6px;border-radius:99px;background:var(--brand-10);color:var(--brand)}
.seg>.on i{background:rgba(255,255,255,.22);color:#fff}

/* ---- Status pills ---- */
.pill{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:99px;font-size:12px;font-weight:700;white-space:nowrap;background:rgba(217,218,222,.5);color:var(--muted)}
.pill.brand{background:var(--brand-10);color:var(--brand)}
.pill.positive{background:var(--accent);color:var(--ink)}
.pill.warning{background:var(--warn-bg);color:var(--warn-fg)}
.pill.critical{background:var(--crit-bg);color:var(--crit-fg)}
.pill.sm{font-size:12px;padding:2px 8px}

/* ---- Forms ---- */
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>span{font-size:12px;font-weight:700;color:var(--ink)}
.field small{font-size:12px;color:var(--muted)}
input,select,textarea{width:100%;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:var(--white);font-size:16px;line-height:1.3;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:rgba(36,59,143,.5);box-shadow:0 0 0 4px rgba(36,59,143,.15)}
textarea{min-height:88px;resize:vertical}
select{appearance:none;-webkit-appearance:none;padding-right:34px;font-weight:600;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235f6270' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
input[type=checkbox]{width:20px;height:20px;padding:0;accent-color:var(--brand);flex-shrink:0}
input[type=file]{padding:9px 10px;font-size:14px}
.field.inline{flex-direction:row;align-items:center;gap:10px;padding:6px 0}
.field.inline>span{font-size:14px;font-weight:600}
.form{display:flex;flex-direction:column;gap:14px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.filters{display:flex;gap:8px}
.filters>*{flex:1;min-width:0}
.search{position:relative}
.search input{padding-left:38px}
.search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round}
.error{color:var(--crit-fg);font-size:13px;font-weight:600}
.switch{position:relative;flex-shrink:0;width:46px;height:28px;border-radius:99px;background:#cfd2dc;transition:background .15s}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .15s}
.switch[aria-checked=true]{background:var(--brand)}
.switch[aria-checked=true]::after{transform:translateX(18px)}

/* ---- Rows / list cards ---- */
.item{display:flex;flex-direction:column;gap:6px;padding:14px;background:var(--white);border:1px solid var(--line);border-radius:18px;color:inherit;box-shadow:var(--shadow);transition:border-color .15s}

button.item{width:100%;text-align:left}
.item.unread{border-color:var(--brand-35);background:#fbfbfe}
.item-title{font-size:15px;font-weight:700;color:var(--ink);line-height:1.3;overflow-wrap:anywhere}
.item-sub{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.item-meta{font-size:12.5px;color:var(--muted)}
.flag{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--ink)}
.flag::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--accent);box-shadow:0 0 0 1px rgba(36,59,143,.35);transform:rotate(45deg);flex-shrink:0}
.flag.warn::before{background:#f59e0b;box-shadow:none}
.avatar{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--brand-10);color:var(--brand);font-size:13px;font-weight:800;flex-shrink:0}
.tile{display:grid;place-items:center;height:84px;border-radius:18px 18px 0 0;background:var(--brand-10);color:var(--brand);font-size:26px;font-weight:800;letter-spacing:.02em;overflow:hidden}
.tile img{width:100%;height:100%;object-fit:cover}
.prop{padding:0;overflow:hidden}
.prop .body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px}

/* ---- Agenda (Today card) ---- */
.agenda{display:flex;flex-direction:column}
.ag{display:grid;grid-template-columns:3rem 8px 1fr;align-items:start;column-gap:10px;padding:10px 8px;margin:0 -8px;border-radius:12px;color:inherit}

.ag .t{font-size:13px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;padding-top:1px}
.ag .dot{width:6px;height:6px;border-radius:50%;background:rgba(95,98,112,.4);margin-top:7px}
.ag.guest .t,.ag.guest .ttl.arr{color:var(--brand)}
.ag.guest .dot{background:var(--brand)}
.ag .ttl{font-size:13.5px;font-weight:700;color:var(--ink);overflow-wrap:anywhere}
.ag .sub{font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.ag .ex{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px}
.daylabel{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--brand);margin:8px 0 2px}

/* Stretched links keep whole rows tappable while buttons stay independent. */
.rel{position:relative}
.stretch::after{content:"";position:absolute;inset:0}
.rel .btn,.rel button{position:relative;z-index:1}
/* ---- Attention ---- */
.att{display:flex;flex-direction:column;gap:8px;padding:12px 0;border-top:0;color:inherit}
.att:first-of-type{border-top:0;padding-top:0}
.att .ttl{font-size:14px;font-weight:700;color:var(--ink);overflow-wrap:anywhere}

/* ---- Week strip ---- */
.nav-week{display:flex;align-items:center;gap:6px}
.nav-week .lbl{flex:1;text-align:center;font-weight:800;color:var(--ink);font-size:15px}
.strip{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.strip button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 0 7px;border-radius:14px;background:var(--white);border:1px solid var(--line);min-width:0}
.strip .w{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.strip .n{font-size:16px;font-weight:800;color:var(--ink);line-height:1}
.strip .dots{display:flex;gap:2px;height:6px;align-items:center}
.strip .dots i{width:5px;height:5px;border-radius:50%;background:var(--brand-35)}
.strip .dots i.g{background:var(--brand)}
.strip .dots i.o{background:#f59e0b}
.strip .today .n{color:var(--brand)}
.strip .on{background:var(--brand);border-color:var(--brand)}
.strip .on .w,.strip .on .n{color:#fff}
.strip .on .dots i{background:rgba(255,255,255,.55)}
.strip .on .dots i.g{background:#fff}

/* ---- Key/value ---- */
.kv{display:flex;flex-direction:column}
.kv>div{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:10px 0;border-top:0}
.kv>div:first-child{border-top:0}
.kv dt{color:var(--muted);font-size:13px;flex:0 1 52%;min-width:0}
.kv dd{margin:0;text-align:right;font-weight:600;color:var(--ink);font-size:13.5px;overflow-wrap:break-word;min-width:0;flex:1 1 40%}
.sum-line{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:13.5px}
.sum-line.total{border-top:2px solid var(--ink);margin-top:4px;padding-top:10px;font-weight:800;color:var(--ink)}
.check{display:flex;align-items:center;gap:12px;width:100%;padding:11px 0;border-top:0;text-align:left;font-size:14px}
.check:first-of-type{border-top:0}
.box{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;border:2px solid var(--brand-35);flex-shrink:0;color:#fff}
.box svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.check.done .box{background:var(--brand);border-color:var(--brand)}
.check.done .box svg{opacity:1}
.check.done span:last-child{color:var(--muted);text-decoration:line-through}
.steps{display:flex;flex-direction:column;gap:0}
.step{display:flex;gap:12px;padding:8px 0;position:relative;font-size:13.5px}
.step::before{content:"";position:absolute;left:5px;top:24px;bottom:-8px;width:2px;background:var(--line)}
.step:last-child::before{display:none}
.step .pt{width:12px;height:12px;border-radius:50%;border:2px solid var(--brand-35);background:#fff;margin-top:3px;flex-shrink:0}
.step.done .pt{background:var(--brand);border-color:var(--brand)}
.step.now .pt{border-color:var(--brand);background:var(--accent)}
.step b{color:var(--ink)}

/* ---- Messages ---- */
.bubbles{display:flex;flex-direction:column;gap:6px}
.bubble{max-width:84%;padding:8px 12px;border-radius:18px;font-size:14.5px;line-height:1.45;overflow-wrap:anywhere;background:#eceef2;color:var(--fg);border-bottom-left-radius:6px}
.bubble.me{margin-left:auto;background:var(--accent);color:var(--ink);border-radius:18px 18px 6px 18px}
.bubble time{display:block;margin-top:2px;font-size:12px;color:var(--muted);text-align:right}
.chat-day{align-self:center;margin:8px 0 2px;font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--muted)}
.chat-head{display:flex;align-items:center;gap:12px;padding:2px 2px 8px}
.chat-head .iconbtn{flex-shrink:0}
.chat-foot{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.conv{display:flex;flex-direction:column;gap:3px;padding:12px 14px}
.conv .item-sub{color:var(--muted);font-size:13px}
.conv.unread .item-title{color:var(--ink)}
.conv.unread .item-sub{color:var(--fg);font-weight:600}
.udot{width:9px;height:9px;border-radius:50%;background:var(--brand);flex-shrink:0}
.composer{display:flex;gap:8px;align-items:flex-end}
.composer textarea{min-height:44px;height:44px}

/* ---- Sheets / drawer / toast (constrained to the phone column) ---- */
.layer{position:fixed;top:0;bottom:0;left:50%;width:min(100vw,430px);transform:translateX(-50%);z-index:50;display:flex;pointer-events:none}
.layer>*{pointer-events:auto}
.scrim{position:absolute;inset:0;background:rgba(18,26,63,.45)}
.sheet{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;max-height:92dvh;background:var(--white);border-radius:24px 24px 0 0;box-shadow:0 -30px 80px -24px rgba(18,26,63,.5);animation:up .2s ease-out}
.sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 16px 12px 20px;border-bottom:1px solid var(--line)}
.eyebrow{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--brand)}
.sheet-head h2{font-size:18px;font-weight:800;letter-spacing:-.01em;color:var(--ink);margin-top:2px}
.sheet-body{padding:16px 20px;overflow-y:auto;flex:1;overscroll-behavior:contain}
.sheet-foot{display:flex;gap:8px;justify-content:flex-end;padding:12px 20px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.sheet-foot .btn{flex:1}
.drawer{position:absolute;top:0;bottom:0;right:0;width:296px;max-width:88%;display:flex;flex-direction:column;background:var(--white);box-shadow:-20px 0 60px -20px rgba(18,26,63,.4);animation:in .2s ease-out}
.drawer-top{display:flex;align-items:center;justify-content:space-between;padding:6px 8px 0 20px;min-height:56px}
.nav{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 12px 16px;display:flex;flex-direction:column;gap:24px}
.nav-label{display:flex;justify-content:center;margin-bottom:8px}
.nav-label span{position:relative;display:inline-block;padding:0 4px;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--brand)}
.nav-label span::before{content:"";position:absolute;inset:-3px -6px -3px -10px;background:var(--accent);border-radius:2px;transform:rotate(-1.6deg)}
.nav-label b{position:relative;font-weight:800}
.nav a{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 12px;border-radius:12px;font-size:15px;font-weight:600;color:var(--ink)}
.nav a.home{justify-content:center}
.nav .count{font-size:12px;font-weight:800;padding:1px 8px;border-radius:99px;background:var(--brand-10);color:var(--brand)}
.nav a.on .count{background:rgba(255,255,255,.22);color:#fff}

.nav a.on{background:var(--brand);color:#fff}
.nav a.home{text-align:center;font-weight:800;color:var(--brand);border:2px solid rgba(36,59,143,.6)}
.nav a.home.on{background:var(--brand);color:#fff;border-color:var(--brand)}
.nav .group{display:flex;flex-direction:column;gap:2px}
.account{position:relative;padding:12px}
.account-btn{display:flex;align-items:center;gap:8px;width:100%;padding:13px 16px;border-radius:18px;background:var(--accent);color:var(--brand);text-align:left}
.account-btn b{display:block;font-size:14px;font-weight:800}
.account-btn small{display:block;font-size:12px;font-weight:600;opacity:.75}
.account-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-left:auto;transition:transform .15s}
.account-btn[aria-expanded=true] svg{transform:rotate(180deg)}
.menu{position:absolute;left:12px;right:12px;bottom:calc(100% - 4px);padding:6px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 18px 60px -16px rgba(18,26,63,.32)}
.menu a,.menu button{display:block;width:100%;text-align:left;padding:10px 12px;border-radius:12px;font-size:14px;font-weight:600;color:var(--ink)}

.notif{display:flex;gap:10px;width:100%;text-align:left;padding:10px 2px;border:0;border-bottom:1px solid var(--line);border-radius:0;color:inherit;background:transparent}
.notif:last-child{border-bottom:0}
.notif .grow{display:flex;flex-direction:column;gap:2px;min-width:0}
.notif .bold{font-size:14.5px;line-height:1.3}
.notif-bar{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:0 2px 2px}
.linkbtn{font-size:12.5px;font-weight:700;color:var(--brand);padding:8px 4px;min-height:36px}
.notif-list{display:flex;flex-direction:column}
.notif:not(.unread) .bold{font-weight:600;opacity:.8}

.notif .d{width:7px;height:7px;border-radius:50%;margin-top:7px;background:transparent;flex-shrink:0}
.notif.unread .d{background:var(--brand)}
.toast{position:absolute;left:16px;right:16px;bottom:calc(20px + env(safe-area-inset-bottom));padding:12px 16px;border-radius:14px;background:var(--ink);color:#fff;font-size:13.5px;font-weight:600;text-align:center;animation:up .2s ease-out}
@keyframes up{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@keyframes in{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}

/* ---- Login ---- */
.login{padding:12vh 20px 40px;display:flex;flex-direction:column;gap:20px}
.login .wordmark{font-size:30px;margin:0}
.demo-note{font-size:12.5px;line-height:1.55}

/* ---- Charts (SVG, no inline styles) ---- */
.bars{width:100%;height:auto;display:block}
.bars rect{fill:var(--brand)}
.bars rect.soft{fill:var(--brand-35)}
.bars text{font-size:11px;fill:var(--muted);font-family:var(--font);text-anchor:middle}
.big{font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.tabnum{font-variant-numeric:tabular-nums}
.settings-card{display:flex;flex-direction:column;gap:8px;padding:18px;background:var(--white);border:1px solid var(--line);border-radius:18px;color:inherit;box-shadow:0 1px 2px rgba(18,26,63,.04);transition:border-color .15s}

.settings-card .t{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:var(--ink)}
.settings-card .t::before{content:"";width:3px;height:20px;border-radius:99px;background:var(--brand)}
.settings-card p{font-size:13.5px;color:var(--muted);line-height:1.5}
@media (max-width:340px){.page-title,.greeting{font-size:23px}.kpi b{font-size:25px}.kpi.money b{font-size:18px}.grid2{grid-template-columns:1fr}.filters{flex-direction:column}.btn{padding:8px 11px}}

/* ---- Home / Calendar ---- */
button.ttl{display:block;width:100%;text-align:left;font:inherit;font-weight:700;color:var(--ink);padding:0}
.att .ttl{display:block;text-align:left}
.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---- Additions ---- */
.nav,.sheet-body{scrollbar-width:thin;scrollbar-color:rgba(36,59,143,.28) transparent}
.nav::-webkit-scrollbar,.sheet-body::-webkit-scrollbar{width:6px}
.nav::-webkit-scrollbar-thumb,.sheet-body::-webkit-scrollbar-thumb{background:rgba(36,59,143,.28);border-radius:99px}
.kpi.wide{grid-column:1/-1}
details.more summary{cursor:pointer;font-weight:700;color:var(--brand);font-size:13px;padding:6px 0;list-style:none}
details.more summary::-webkit-details-marker{display:none}
details.more summary::after{content:" +"}
details.more[open] summary::after{content:" –"}
details.more[open] summary{margin-bottom:10px}
.btn[data-disabled]{opacity:.45}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;background:var(--brand-06);padding:1px 5px;border-radius:6px}

/* ---- Refined week selector (Home, Calendar) ---- */
.nav-week.lux{gap:10px}
.nav-week.lux .iconbtn{width:42px;height:42px;border-radius:50%;background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow)}
.nav-week.lux .lbl{font-size:16px;font-weight:800;letter-spacing:-.01em}
.strip.lux{gap:6px}
.strip.lux button{padding:11px 0 12px;gap:7px;border-radius:20px;border-color:rgba(217,218,222,.55);box-shadow:var(--shadow);transition:background .15s,transform .15s}
.strip.lux .w{font-size:12px;letter-spacing:.08em}
.strip.lux .n{font-size:19px;font-weight:800}
.strip.lux .today:not(.on){background:var(--accent);border-color:transparent}
.strip.lux .today:not(.on) .n{color:var(--brand)}
.strip.lux .on{background:var(--brand);border-color:var(--brand);box-shadow:0 10px 20px -10px rgba(36,59,143,.7)}
/* ---- Event rows: category colour (label only) + status pill ---- */
.ev{display:grid;grid-template-columns:90px minmax(0,1fr) auto;column-gap:10px;align-items:center;min-height:56px;padding:10px 0;border-top:0;position:relative;color:inherit;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.evs>.ev:first-child{border-top:0;padding-top:2px}
.ev:active{background:var(--brand-06)}
.ev .l{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
.ev .cat{padding:2px 8px;border-radius:8px;font-size:12px;line-height:1.5}
.ev .time{font-size:12px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;padding-left:2px}
.ev .m{display:flex;flex-direction:column;gap:2px;min-width:0}
.ev .ttl{font-size:14.5px;font-weight:800;color:var(--ink);overflow-wrap:anywhere;line-height:1.25}
.ev .who{font-size:12px;color:var(--muted);overflow-wrap:anywhere;line-height:1.3}
.ev .s{display:flex;justify-content:flex-end}
@media (max-width:359px){.ev{grid-template-columns:90px minmax(0,1fr)}.ev .s{grid-column:2;justify-content:flex-start}}
.empty.compact{padding:12px 4px;font-size:13px}
/* Touch date control: a month grid inside the form, never the browser's own picker */
.dp{position:relative}
.dp-panel{margin-top:6px;padding:10px;border:1px solid var(--line);border-radius:16px;background:var(--white)}
.dp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.dp-head b{font-size:14px;color:var(--ink)}
.dp-panel .mc-day{min-height:36px}
.task-quiet{display:flex;justify-content:center;margin-top:4px}
.cat{display:inline-block;padding:4px 11px;border-radius:9px;font-size:13px;font-weight:800;letter-spacing:.005em;text-align:left}
.cat.cleaning{background:#fde8d4;color:#9a4a12}
.cat.arrival{background:#fff2bf;color:#7a5a00}
.cat.departure{background:#fadcdc;color:#9b3030}
.cat.maintenance{background:#dcefdf;color:#2e6a3e}
.cat.laundry{background:#dbe8f8;color:#2b5a96}
.cat.task{background:#ececef;color:#555a66}
/* ---- Centred modal (Add task) ---- */
.layer.center{align-items:center;justify-content:center;padding:16px}
.layer.center .sheet{position:relative;left:auto;right:auto;bottom:auto;width:100%;max-height:min(88dvh,640px);border-radius:26px;box-shadow:0 30px 80px -24px rgba(18,26,63,.5);animation:pop .18s ease-out}
.layer.center .sheet-head{padding:18px 16px 12px 22px}
.layer.center .sheet-body{padding:16px 22px}
.layer.center .sheet-foot{padding:14px 22px 18px}
@keyframes pop{from{transform:scale(.97);opacity:0}to{transform:none;opacity:1}}
/* ---- Reservation cards ---- */
.rc{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;align-items:start}
.rc .rl{display:flex;flex-direction:column;gap:4px;min-width:0}
.rc .rr{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}
.rc .amt{font-size:14px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.rc .amt small{display:block;font-size:12px;font-weight:600;color:var(--muted)}
.src{display:inline-flex;align-items:center;vertical-align:middle}
.src img{height:16px;width:auto;border-radius:4px}

/* ---- Logo ---- */
.logo-link{margin-right:auto;display:flex;align-items:center;height:84px}
.logo{height:74px;width:auto;display:block}
.topbar .logo{margin-left:-9px}
.login-logo{height:120px;align-self:flex-start;margin:-8px 0 -4px -6px}
.topbar .iconbtn{width:54px;height:54px;border-radius:16px}
.topbar .iconbtn svg{width:29px;height:29px}
.topbar .badge-dot{top:7px;right:5px}
.drawer-top{min-height:56px;justify-content:flex-end;padding:8px 10px 0 20px}

/* ---- Home to-do: grouped by property, one card per task ---- */
.todo-sec{display:flex;flex-direction:column;gap:12px}
.todo-group{display:flex;flex-direction:column;gap:8px}
.grp-h{margin:6px 2px 0;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--brand)}
.todo{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px;padding:13px 14px;background:var(--white);border:1px solid var(--line);border-radius:18px}
.td-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.td-main .ttl{font-size:14px;font-weight:700;color:var(--ink);overflow-wrap:anywhere;line-height:1.3}
.td-act{display:flex;align-items:center}
.late{color:#a3424a;font-weight:600}
/* ---- Reservation cards with property image ---- */
.rescard{flex-direction:row;align-items:center;gap:14px;padding:10px}
.rimg{width:96px;height:96px;border-radius:16px;overflow:hidden;flex-shrink:0;background:#eceef3;display:grid;place-items:center}
.rimg img{width:100%;height:100%;object-fit:cover;display:block}
.rimg .ph{color:#9aa0b0;font-size:20px;font-weight:800;letter-spacing:.04em}
.rbody{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
.rbody .item-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rguest{display:flex;align-items:center;gap:7px;font-size:13.5px;color:var(--muted);min-width:0}
.src-text{font-size:12px;font-weight:700;color:var(--ink);background:var(--brand-06);padding:1px 8px;border-radius:99px;white-space:nowrap}
.src img{height:17px;width:17px;border-radius:0}
/* ---- Reservation detail ---- */
.rhead{display:flex;flex-direction:column;gap:2px;padding:14px 16px 12px}
.rhead .msgbtn{margin-top:-6px}
.rhead .top{align-items:flex-start}
.rhead .page-title{font-size:23px}
.rprop{display:inline-flex;align-items:center;gap:7px;min-width:0}
.msgbtn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--white)}
.msgbtn svg{width:19px;height:19px}
.kv.plain>div{border-top:0;padding:7px 0}
.kv.plain dt{font-size:13px}
.lc{display:flex;flex-direction:column}
.lc-row{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;column-gap:12px;padding:10px 0;position:relative}
.lc-row .box{border-color:var(--brand-35)}
.lc-row.done .box{background:var(--brand);border-color:var(--brand)}
.lc-row.done .box svg{opacity:1}
.lc-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.lc-t b{font-size:14px;color:var(--ink)}
.lc-row.done .lc-t b{color:var(--muted);font-weight:600}
.lc-t small{font-size:12px;color:var(--muted)}
.lc-hit{position:absolute;inset:0;width:100%}
.lc-tax{margin:0 0 6px 34px;padding:10px 12px;background:var(--page);border-radius:14px;display:flex;flex-direction:column;gap:6px}
.lc-count{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;font-weight:700;color:var(--ink)}
.lc-count input{width:84px;padding:7px 10px;border-radius:10px;font-size:16px;text-align:center}
.card.lc-done{background:#f1f2f5;box-shadow:none;padding:0}
.lc-done summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;cursor:pointer;list-style:none}
.lc-done summary::-webkit-details-marker{display:none}
.lc-done .lc{padding:0 16px 12px}

/* ---- Cleaning: action row and monthly calendar (Getaway operations calendar, phone width) ---- */
.action-row{display:flex;align-items:center;gap:10px}
.action-row .field{flex:1;min-width:0}
.action-row .btn{flex-shrink:0;min-height:46px}
.mc{padding:12px}
.mc-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.mc-title{font-size:15px;font-weight:800;color:var(--ink)}
.mc-nav{display:inline-flex;align-items:center;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--white)}
.mc-nav button{display:grid;place-items:center;min-width:40px;height:38px;padding:0 10px;font-size:13px;font-weight:700;color:var(--ink)}
.mc-nav button+button{border-left:1px solid var(--line)}
.mc-nav svg{width:18px;height:18px}
.mc-wd,.mc-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.mc-wd span{padding-bottom:6px;text-align:center;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mc-grid{gap:4px;touch-action:pan-y}
.mc-day{aspect-ratio:1;min-height:36px;display:grid;place-items:center;border-radius:10px;background:#f4f5f9;font-size:13px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.mc-day.out{background:transparent;color:rgba(95,98,112,.4);font-weight:500}
.mc-day.has{background:#fde8d4;color:#9a4a12;font-weight:800}
.mc-day.has.out{background:#fdf1e6;color:rgba(154,74,18,.55)}
.mc-day.today:not(.on){box-shadow:inset 0 0 0 1.5px rgba(36,59,143,.55)}
.mc-day.on{background:var(--brand);color:#fff;font-weight:800}
.mc-sel{margin:4px 2px 0;font-size:16px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.empty-card{padding:26px 16px;text-align:center;color:var(--muted);font-size:13.5px;background:var(--white);border:1px dashed var(--border);border-radius:18px}
.warn-text{color:#8a5a00;font-weight:600}
@media (max-width:340px){.action-row .btn{padding:8px 10px}.mc{padding:10px}}

.lc-row .btn{position:relative;z-index:1}
/* Category colours for the shared month calendar */
.mc.cat-maintenance .mc-day.has{background:#dcefdf;color:#2e6a3e}
.mc.cat-maintenance .mc-day.has.out{background:#eef7f0;color:rgba(46,106,62,.55)}
.mc.cat-laundry .mc-day.has{background:#dbe8f8;color:#2b5a96}
.mc.cat-laundry .mc-day.has.out{background:#eef4fc;color:rgba(43,90,150,.55)}

/* ---------- Properties: cards, checklist template, secrets, preview ---------- */
.pcard{padding:8px;gap:14px}
.pcard .rimg{flex:0 0 38%;width:38%;height:auto;aspect-ratio:4/3;border-radius:16px}
.pcard .rbody{gap:4px;justify-content:center}
.pcard .item-title{font-size:16px;font-weight:800;color:var(--ink);-webkit-line-clamp:2}
.ck-list{display:flex;flex-direction:column}
.ck{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:0}
.ck:first-child{border-top:0}
.ck-t{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.ck-t b{font-size:14px;color:var(--ink);overflow-wrap:anywhere}
.ck-t small{font-size:12px;color:var(--muted)}
.ck.off .ck-t b{color:var(--muted);font-weight:600}
.secret{display:inline-flex;align-items:center;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.secret .link{font-size:12.5px}
.preview{display:flex;flex-direction:column;gap:8px;padding-top:4px}
.preview .between{align-items:flex-end}
.preview .field{flex:1;min-width:0}
.preview-out{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13.5px;color:var(--ink);background:var(--page);border-radius:14px;padding:12px;min-height:0}
.preview-out:empty{display:none}

/* ---------- Finance: month bar, compact popups, file picker, outstanding rows ---------- */
.monthbar{display:flex;align-items:center;gap:8px}
.monthbar .iconbtn{flex-shrink:0}
.monthpick{position:relative;flex:1;display:flex;align-items:center;justify-content:center;min-height:46px;padding:0 14px;border-radius:99px;border:1px solid var(--brand-35);background:var(--white);color:var(--brand);font-weight:800;font-size:15px;cursor:pointer}
.monthpick select{position:absolute;inset:0;width:100%;height:100%;opacity:0;font-size:16px;cursor:pointer}
.layer.center.upper{align-items:flex-start;padding:max(14px,env(safe-area-inset-top)) 16px 16px}
.layer.center.upper{padding-top:calc(5dvh + env(safe-area-inset-top))}
.layer.center.upper .sheet{max-height:min(86dvh,640px);width:100%}
.layer.center.upper .sheet-head{padding:14px 14px 10px 20px}
.layer.center.upper .sheet-head h2{font-size:17px}
.layer.center.upper .sheet-body{padding:12px 20px}
.layer.center.upper .sheet-foot{padding:10px 20px calc(12px + env(safe-area-inset-bottom))}
.layer.center.upper .sheet-foot .btn{flex:1;min-height:42px;padding:8px 14px}
.layer.center.upper .form{gap:10px}
.filepick{display:flex;flex-direction:column;gap:6px}
.filepick>span{font-size:13px;font-weight:700;color:var(--ink)}
.filepick .row{display:flex;gap:8px;flex-wrap:wrap}
.filepick label.btn{cursor:pointer;position:relative}
.filepick small{color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.seg2{display:flex;gap:6px}
.seg2>label{flex:1;position:relative}
.seg2 input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer}
.seg2 span{display:flex;align-items:center;justify-content:center;min-height:42px;border-radius:99px;border:1px solid var(--brand-35);background:var(--white);color:var(--brand);font-weight:700;font-size:14px}
.seg2 input:checked+span{background:var(--brand);border-color:var(--brand);color:#fff}
.seg2 input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}
.out-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:0;color:inherit}
.out-row:first-child{border-top:0}
.out-row .grow{min-width:0}
.out-row b{font-variant-numeric:tabular-nums}
.out-head{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin:8px 0 2px}
.exp-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.doc-card{display:flex;flex-direction:column;gap:8px}
.doc-actions{display:flex;flex-wrap:wrap;gap:6px}
.bank{display:flex;flex-direction:column;gap:8px}
.bank .big{font-size:30px}
button.kpi{font:inherit;width:100%;cursor:pointer}
button.out-row{width:100%;background:none;border:0;border-top:1px solid var(--line);font:inherit;text-align:left;cursor:pointer;padding:10px 0}
button.out-row:first-child{border-top:0}
a.out-row{text-decoration:none}

/* ---------- App feel: touch first (hover effects only where a pointer can hover) ---------- */
@media (hover:hover){.iconbtn:hover{background:var(--brand-06);color:var(--brand)}
.back:hover{background:var(--brand-06)}
.kpi:hover{border-color:var(--brand-35)}
.btn-primary:hover{filter:brightness(1.1)}
.btn-subtle:hover{background:var(--brand-06)}
.btn-cream:hover{filter:brightness(.96)}
.btn-ghost:hover{background:var(--brand-06)}
.seg>*:hover{background:var(--brand-06)}
a.item:hover,button.item:hover{border-color:var(--brand-35)}
a.ag:hover{background:var(--brand-06)}
.nav a:hover{background:var(--brand-06)}
.menu a:hover,.menu button:hover{background:var(--brand-06)}
.notif:hover{background:var(--brand-06)}
.settings-card:hover{border-color:var(--brand-35)}}
html{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:contain}
body{overscroll-behavior-y:contain}
a,button,input,select,textarea,label,summary,[data-act]{touch-action:manipulation}
button,.btn,.iconbtn,.pill,.item,.kpi,.seg,.strip,.mc,.nav-week,.topbar,.nav,.out-row,.sheet-head{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,select,.kv dd,.preview-out,.selectable{-webkit-user-select:text;user-select:text}
img,a{-webkit-user-drag:none}
.seg{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.seg>*{min-height:44px}
.nav-week,.strip{touch-action:pan-y}
.wk{display:contents}
.nav-week.lux .iconbtn{width:44px;height:44px}
.mc-nav button{height:44px}
.btn,.back,.link{position:relative}
.btn::after{content:"";position:absolute;inset:-2px}
.btn.sm::after,.back::after{inset:-5px -4px}
.link::after{content:"";position:absolute;inset:-14px -8px}
.iconbtn.msgbtn{width:44px;height:44px}
.back{min-height:44px}
/* Immediate, light press feedback */
.btn,.iconbtn,.seg>*,.strip button,.mc-day,.item,.kpi,.out-row,.nav a{transition:transform .08s ease-out,background .15s,filter .15s,border-color .15s}
.btn:active,.iconbtn:active,.seg>*:active,.strip button:active,.mc-day:active,.item:active,.kpi:active,.out-row:active,.nav a:active{transform:scale(.97)}
/* Calendar change: a short slide of the strip or grid in the direction of the swipe */
@keyframes slnext{from{opacity:.35;transform:translateX(22px)}to{opacity:1;transform:none}}
@keyframes slprev{from{opacity:.35;transform:translateX(-22px)}to{opacity:1;transform:none}}
.sl-next .strip,.sl-next .mc-grid{animation:slnext .2s ease-out}
.sl-prev .strip,.sl-prev .mc-grid{animation:slprev .2s ease-out}
/* Drawer closes as smoothly as it opens */
#drawer-closing .scrim{opacity:0;transition:opacity .16s}
#drawer-closing .drawer{transform:translateX(100%);transition:transform .16s ease-in;animation:none}
/* Safe areas and the keyboard */
.topbar{padding-top:env(safe-area-inset-top);height:calc(84px + env(safe-area-inset-top))}
main{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
.drawer{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
.layer{bottom:var(--kb,0px)}
@media (prefers-reduced-motion:reduce){.sl-next .strip,.sl-next .mc-grid,.sl-prev .strip,.sl-prev .mc-grid,.sheet,.drawer{animation:none!important}}
/* With the keyboard open (iOS reports it only through visualViewport) every modal shrinks to the space above it */
.sheet{max-height:min(92dvh,calc(100dvh - var(--kb,0px) - 12px))}
.layer.center .sheet{max-height:min(88dvh,640px,calc(100dvh - var(--kb,0px) - 32px))}
.layer.center.upper .sheet{max-height:min(86dvh,640px,calc(100dvh - var(--kb,0px) - 5dvh - 24px))}

/* ---------- Finance V3: selector, month picker, hero balance, compact expense cards ---------- */
.pick{position:relative}
.pick-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:46px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:var(--white);font-size:16px;font-weight:600;color:var(--fg);text-align:left}
.pick-btn .pv{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pick-btn .ico{width:16px;height:16px;flex-shrink:0;color:var(--muted);transition:transform .15s}
.pick-btn[aria-expanded=true]{border-color:rgba(36,59,143,.5);box-shadow:0 0 0 4px rgba(36,59,143,.15)}
.pick-btn[aria-expanded=true] .ico{transform:rotate(180deg)}
.pick-list{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);max-height:min(300px,45dvh);overflow-y:auto;overscroll-behavior:contain;padding:6px;border-radius:16px;background:var(--white);border:1px solid var(--line);box-shadow:0 18px 40px -16px rgba(18,26,63,.35)}
.pick-list button{display:flex;align-items:center;width:100%;min-height:44px;padding:10px 12px;border-radius:10px;font-size:15px;font-weight:600;color:var(--ink);text-align:left}
.pick-list button.on{background:var(--brand-10);color:var(--brand)}
.form .pick-list{position:static;margin-top:6px;box-shadow:none}
.action-row .pick{min-width:0}
.monthbar-wrap{position:relative}
.monthpick{display:flex;align-items:center;justify-content:center;gap:8px;flex:1;min-height:46px;padding:0 14px;border-radius:99px;border:1px solid var(--brand-35);background:var(--white);color:var(--brand);font-weight:800;font-size:15px}
.monthpick .ico{width:16px;height:16px}
.mp{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 8px);padding:12px;border-radius:18px;background:var(--white);border:1px solid var(--line);box-shadow:0 18px 40px -16px rgba(18,26,63,.35)}
.mp-year{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.mp-year b{font-size:16px;color:var(--ink)}
.mp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.mp-grid button{min-height:44px;border-radius:12px;background:var(--page);font-size:14px;font-weight:700;color:var(--ink)}
.mp-grid button.now{box-shadow:inset 0 0 0 1.5px var(--brand-35)}
.mp-grid button.on{background:var(--brand);color:#fff}
.card.hero{background:var(--brand);color:#fff;border-color:var(--brand);gap:6px;display:flex;flex-direction:column;padding:18px 18px 20px}
.hero-label{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.hero-amount{font-size:34px;line-height:1.1;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.hero-sub{font-size:12.5px;color:rgba(255,255,255,.78)}
.exp-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.exp-main{min-width:0;display:flex;flex-direction:column;gap:2px;flex:1}
.exp-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0}
.exp-side .amt{font-size:15px;text-align:right}
.out-row .adv{text-align:left}
.reasons{margin:4px 0 0;padding-left:18px;color:var(--muted);font-size:12.5px}
details.card.more.bill{padding:14px 16px}
details.card.more.bill[open] summary{margin-bottom:6px}
.block{width:100%}
.lc-msgs{display:flex;flex-wrap:wrap;gap:6px 8px;margin:-2px 0 8px 34px}
.lc-m{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.lc-m.done{padding:4px 0}
.lc-m .link{margin-left:2px}

/* ---------- Properties V3: search clear, tab focus, compact rows ---------- */
.search input{padding-right:42px}
.search input[type=search]::-webkit-search-cancel-button,.search input[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}
.search-clear{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:40px;height:40px;display:grid;place-items:center;border-radius:50%;color:var(--muted)}
.search-clear .ico{width:16px;height:16px}
/* Selected is a filled pill; keyboard focus is only a ring and never looks selected */
.seg>*:focus{outline:none}
.seg>*:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.seg>.on:focus-visible{outline-color:var(--accent);box-shadow:0 0 0 4px var(--brand)}
.card-head .row-flex{gap:6px}
.pcard .rimg{overflow:hidden}
.pcard .rimg .ph{width:100%;height:100%;display:grid;place-items:center}

/* ---------- Cleaning V3: job card, property selector, progress, photos ---------- */
.clcard{padding:8px;gap:12px}
.clcard .rimg{flex:0 0 28%;width:28%;height:auto;aspect-ratio:1/1;border-radius:14px;overflow:hidden}
.clcard .rimg .ph{width:100%;height:100%;display:grid;place-items:center}
.clcard .rbody{gap:3px;justify-content:center}
.clcard .item-title{font-size:15px;font-weight:800;color:var(--ink)}
.clcard .flag{font-size:12px;margin-top:2px}
.pp-list{padding:6px;display:flex;flex-direction:column;gap:2px}
.pp-row{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:6px 8px;border-radius:12px;text-align:left;font-size:15px;font-weight:600;color:var(--ink)}
.pp-row.on{background:var(--brand-06)}
.cbx{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;border:2px solid var(--brand-35);flex-shrink:0;color:#fff}
.cbx svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.pp-row.on .cbx{background:var(--brand);border-color:var(--brand)}
.pp-row.on .cbx svg{opacity:1}
.pp-img{width:40px;height:40px;border-radius:10px;overflow:hidden;flex-shrink:0;background:#eceef3;display:grid;place-items:center}
.pp-img img{width:100%;height:100%;object-fit:cover;display:block}
.pp-img .ph{color:#9aa0b0;font-size:13px;font-weight:800}
.pp-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-done{margin:6px 4px 2px;min-height:44px}
.pp-list .pp-done{width:calc(100% - 8px);justify-content:center;color:#fff}
.action-row .pp-list{right:auto;width:max-content;min-width:100%;max-width:calc(100vw - 32px)}
.cl-main{margin-top:12px}
.photos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0 8px}
.ph-slot{position:relative;aspect-ratio:1/1;border-radius:14px;background:var(--page);border:1px dashed var(--brand-35);overflow:hidden;display:grid;place-items:center}
.ph-slot.on{border-style:solid;border-color:var(--line);background:#eceef3}
.ph-slot.add{cursor:pointer;color:var(--brand);font-weight:800;font-size:13px}
.ph-slot img{width:100%;height:100%;object-fit:cover;display:block}
.ph-view{position:absolute;inset:0;width:100%;height:100%}
.ph-del{position:absolute;top:4px;right:4px;width:30px;height:30px;border-radius:50%;background:rgba(18,26,63,.7);color:#fff;font-size:18px;line-height:1;display:grid;place-items:center}
.btn-row.quiet{justify-content:center}
.cl-list .lc-row{padding:12px 0}
.cl-list .lc-hit{position:absolute;inset:0;width:100%}
.between.top{align-items:flex-start}

/* ---------- Maintenance V3: To address, ticket cards, the three detail cards ---------- */
.mtcard .rbody{min-width:0}
.mtcard .between{align-items:flex-start;gap:8px}
.mtcard .item-title{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.mtcard .pill{flex-shrink:0}
.addr-card{padding-bottom:6px}
.addr{display:flex;flex-direction:column}
.addr-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:52px;padding:8px 0;border-top:0;color:inherit;text-decoration:none}
.addr-row:first-child{border-top:0}
.addr-main{min-width:0;display:flex;flex-direction:column;gap:1px}
.addr-main b{font-size:14.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.addr-main small{color:var(--muted);font-size:12.5px}
.addr-row .pill{flex-shrink:0}
.addr-more{display:block;margin:2px auto 0;padding:10px 14px;font-size:13px}
.issue-title{font-size:19px;font-weight:800;line-height:1.25;margin:2px 0 8px;color:var(--ink)}
.mt-photos{margin-top:12px}
.field .ro{min-height:44px;display:flex;align-items:center;padding:0 14px;border-radius:12px;background:var(--page);font-weight:600;color:var(--ink)}
.decision{padding:10px 0;border-top:0}
.decision:first-child{border-top:0}

/* ---------- Laundry V3: pickup cards and overdue pickups ---------- */
.lncard{cursor:pointer}
.lncard.done{opacity:.62}
.lncard .rbody{min-width:0}
.lncard .between{align-items:flex-start;gap:8px}
.lncard .item-title{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lncard .pill{flex-shrink:0}
.lncard .lnact{margin-top:6px}
.ln-head{padding:0 4px 0 14px}
.lnover.item{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px}
.lnover .btn{flex-shrink:0}
.addr-tap{flex:1;min-width:0;align-items:flex-start;text-align:left;background:none;border:0;padding:0;cursor:pointer;color:inherit;font:inherit}
.addr-tap b{max-width:100%}
.addr-tap small{text-align:left}

/* ---------- Reservations V3: phases that open and close, a quiet finished phase, a compact tourist fee ---------- */
.lc-phase{padding:0}
.lc-ph{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:52px;padding:12px 16px;text-align:left}
.lc-phase .lc{padding:0 16px 10px}
.lc-chev{display:grid;place-items:center}
.lc-chev svg{width:16px;height:16px;color:var(--muted);transition:transform .15s}
.lc-phase.open .lc-chev svg{transform:rotate(180deg)}
.lc-phase.lc-done .card-label{opacity:.6}
.lc-phase.lc-done .lc-row b{color:var(--muted);font-weight:600}
.lc-count-in{width:64px;padding:6px 8px;border:1px solid var(--line);border-radius:10px;font-size:16px;text-align:center;background:var(--white)}
.lc-tax .kv.plain dd{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.rescard.cancelled{opacity:.6}

/* ---------- Team & Access V3 ---------- */
.head-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.head-row .page-title{min-width:0}
.head-row .btn{flex-shrink:0}
.sec-h{margin:6px 2px 0;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--brand)}
.teamcard{display:flex;flex-direction:column;gap:3px;padding:12px 14px;text-align:left;width:100%}
.teamcard .between{gap:10px}
.teamcard .item-sub{color:var(--muted);font-size:13px;overflow-wrap:anywhere}
.hidden[data-grp]{display:none}

/* ---- Cleaning partner portal ---- */
.cl-main .btn[data-disabled]{opacity:.55}
.teamcard .late{font-size:12.5px}

/* ---- Owner portal ---- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:12px;color:inherit}
.duo>a{display:flex;flex-direction:column;gap:4px;min-width:0;color:inherit}
.duo>a+a{border-left:1px solid var(--line);padding-left:14px}
.duo b{font-size:21px;line-height:1.1;font-weight:800;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.duo span{font-size:12.5px;color:var(--muted)}
.big-fig{font-size:26px;line-height:1.1;font-weight:800;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums;margin-bottom:6px;overflow-wrap:anywhere}
.attn-none{margin:0 2px}
.act-row{color:inherit}
.cal-note{margin:2px 4px}
.calcard .between{align-items:flex-start;gap:8px}
.mc.cat-owner .mc-day.has{background:rgba(36,59,143,.12);color:var(--brand)}
.mc.cat-owner .mc-day.has.out{background:rgba(36,59,143,.06);color:rgba(36,59,143,.5)}
.mc.cat-owner .mc-day.has.leaving{background:rgba(36,59,143,.06)}
.mc.cat-owner .mc-day.has.owner-stay{background:var(--accent);color:#7a5a00}
.bars .axis{stroke:var(--line);stroke-width:1}
.bars .grid{stroke:var(--line);stroke-width:1;stroke-dasharray:3 4}
.bars .y{text-anchor:start;font-size:11px}
.bars rect.unknown{fill:none;stroke:var(--brand-35);stroke-width:1.2;stroke-dasharray:4 3}
.bars text.q,.bars text.z{font-size:11px;font-weight:700}
.prop-hero .hero-img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:14px;margin-bottom:10px}
.bars rect.hit{fill:transparent;cursor:pointer}
.bars rect.est{fill:rgba(36,59,143,.18);stroke:var(--brand);stroke-width:1.2;stroke-dasharray:4 3}
.chip-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.chip{display:inline-flex;align-items:center;padding:6px 12px;border-radius:99px;background:var(--accent);color:var(--ink);font-size:12.5px;font-weight:700}
.ins{display:flex;flex-direction:column;gap:8px}
.ins p{margin:0}
.ins .item-meta{margin-bottom:1px}
/* Installed app and connection state */
.center{text-align:center}
.login{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
.offline-bar{position:fixed;left:0;right:0;top:env(safe-area-inset-top);z-index:60;padding:8px 16px;background:var(--ink);color:#fff;font-size:13px;font-weight:600;text-align:center}
@media (display-mode:standalone){body{overscroll-behavior-y:none}}
.hand-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0}

/* Lodgify preview */
.lg-list{display:flex;flex-direction:column;gap:8px}
.lg-row{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:14px;background:#f4f5f9}
.lg-row.off{opacity:.7}
.lg-row input{margin-top:3px;width:18px;height:18px;flex:none}
.lg-row .grow{display:flex;flex-direction:column;gap:2px;min-width:0}
.lg-ul{margin:8px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.lg-prev{text-align:left}