/* Client area. Uses the tokens from style.css; no inline styles anywhere (the site's security policy blocks them). */
.portal-loading{color:var(--muted)}
.portal .wrap{max-width:1000px}
.pbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-3);margin:0 0 var(--s-5)}
.pbar h2{margin:0;font-size:clamp(1.4rem,3vw,1.9rem)}
.pcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-5);margin:0 0 var(--s-5)}
.pcard>h2,.pcard>h3:first-child{margin-top:0}
.pcard h2{font-size:clamp(1.3rem,2.6vw,1.6rem)}
.pcard h3{margin:var(--s-5) 0 var(--s-2);font-size:1.0625rem;font-family:var(--font-body);font-weight:700}
.pcard>p,.portal p{max-width:none}
.pcard p{margin:0 0 var(--s-3)}
.login{max-width:30rem;margin:0 auto}
.pw{display:flex;gap:var(--s-2)}.pw input{flex:1;min-width:0}
.pw button{flex:none}
.btn-link{background:none;border:0;padding:var(--s-2);font:600 .9375rem var(--font-body);color:var(--sward);text-decoration:underline;cursor:pointer;min-height:2.5rem}
.btn-danger{background:transparent;border-color:var(--danger);color:var(--danger)}
.btn-danger:hover{background:var(--danger);border-color:var(--danger);color:#fff}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center;margin:var(--s-4) 0 0}
.btn-row .btn{width:auto}
.btn-small.btn-outline{min-height:2.5rem}
/* messages */
.msg.ok{display:flex;gap:var(--s-3);align-items:flex-start;background:var(--ok-bg);padding:var(--s-3) var(--s-4);border-radius:var(--r-sm);color:var(--deep)}
.alertbar{display:flex;gap:var(--s-3);align-items:flex-start;background:#fff4d1;border:1px solid var(--accent);border-left-width:6px;border-radius:var(--r-sm);padding:var(--s-4);margin:0 0 var(--s-5);color:var(--ink)}
.alertbar strong{display:block;color:var(--deep)}
.warnbar{background:#fff4d1;border:1px solid var(--accent);border-radius:var(--r-sm);padding:var(--s-4);margin:0 0 var(--s-5)}
.toast{position:fixed;left:50%;bottom:var(--s-5);transform:translateX(-50%);z-index:70;background:var(--deep);color:#fff;padding:var(--s-3) var(--s-5);border-radius:var(--r-pill);font-weight:600;box-shadow:0 6px 20px rgba(0,0,0,.3);max-width:calc(100vw - 2rem);text-align:center;animation:pop .2s var(--ease)}
.toast[hidden]{display:none}
/* quick-glance tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr));gap:var(--s-3)}
.tile{background:var(--chalk);border-radius:var(--r-sm);padding:var(--s-4)}
.tile .k{display:block;font-size:var(--t-sm);font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:var(--s-1)}
.tile .v{display:block;font:700 1.25rem/1.25 var(--font-head);color:var(--deep)}
.tile .s{display:block;font-size:var(--t-sm);color:var(--muted);margin-top:var(--s-1)}
.tile.wide{grid-column:1/-1}
.tile .tbd{font:600 1rem var(--font-body);color:var(--muted)}
.tile.pending .v{color:var(--muted);font-weight:600}
.tile .thumbs{margin-top:var(--s-3)}
/* property list */
.dl{display:grid;grid-template-columns:minmax(8rem,12rem) 1fr;gap:var(--s-2) var(--s-4);margin:0}
.dl dt{font-weight:700;color:var(--muted)}.dl dd{margin:0;overflow-wrap:anywhere}
.two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5)}
.three{display:grid;grid-template-columns:repeat(3,1fr);column-gap:var(--s-4)}
/* chips (one-click services) */
.chips{display:flex;flex-wrap:wrap;gap:var(--s-2);margin:var(--s-3) 0 0;padding:0;list-style:none}
.chip{display:inline-flex;align-items:center;gap:.4em;min-height:2.75rem;padding:.5rem 1rem;border:1.5px solid var(--sward);border-radius:var(--r-pill);background:#fff;color:var(--sward);font:600 .9375rem var(--font-body);cursor:pointer;transition:background var(--dur),color var(--dur)}
.chip:hover{background:var(--sward);color:#fff}
.chip[disabled]{background:var(--ok-bg);border-color:var(--ok-bg);color:var(--deep);cursor:default}
.chip[disabled]::before{content:"";width:1rem;height:1rem;background:var(--sward);-webkit-mask:var(--ico-check) center/contain no-repeat;mask:var(--ico-check) center/contain no-repeat}
/* photos */
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(7.5rem,1fr));gap:var(--s-2)}
.thumbs.big{grid-template-columns:repeat(auto-fill,minmax(11rem,1fr))}
.thumbs a,.thumbs .pv{display:block;position:relative}
.thumbs img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--line)}
.pv button{position:absolute;top:var(--s-1);right:var(--s-1);width:2rem;height:2rem;border-radius:50%;border:0;background:rgba(0,0,0,.65);color:#fff;font:700 1.1rem/1 var(--font-body);cursor:pointer}
.picker{margin:0 0 var(--s-4)}
.picker .thumbs{margin-top:var(--s-3)}
.picker .sr:focus-visible+label{outline:3px solid var(--deep);outline-offset:3px}
.picker label.btn{cursor:pointer}
/* referral */
.codebox{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3);background:var(--chalk);border-radius:var(--r-md);padding:var(--s-4) var(--s-5);margin:0 0 var(--s-3)}
.codebox .code{font:700 1.75rem/1.2 var(--font-body);overflow-wrap:anywhere}
.codebox .lbl{display:block;font-size:var(--t-sm);font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.codebox .link{flex:1 1 16rem;min-width:0}
/* lists: visits, requests, clients */
.list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3)}
.item{border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--s-4);background:#fff}
.item .top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s-2);align-items:baseline;margin-bottom:var(--s-2)}
.item .top strong{color:var(--deep)}
.item p{margin:0 0 var(--s-2);white-space:pre-line}
.item p.note{color:var(--muted)}
.item .thumbs{margin-top:var(--s-3)}
.badge{display:inline-block;padding:.15rem .7rem;border-radius:var(--r-pill);background:var(--chalk);border:1px solid var(--line);font-size:var(--t-sm);font-weight:700;color:var(--muted)}
.badge.new{background:#fff4d1;border-color:var(--accent);color:var(--deep)}
.badge.done{background:var(--ok-bg);border-color:var(--ok-bg);color:var(--deep)}
.reply{background:var(--chalk);border-radius:var(--r-sm);padding:var(--s-3) var(--s-4);margin-top:var(--s-3)}
.clientrow{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s-2) var(--s-4);width:100%;text-align:left;padding:var(--s-4);background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);font:inherit;color:var(--ink);cursor:pointer;min-height:3.5rem;transition:border-color var(--dur)}
.clientrow:hover{border-color:var(--sward)}
.clientrow strong{display:block;color:var(--deep)}
.clientrow small{display:block;color:var(--muted);font-size:var(--t-sm)}
/* owner area */
.tabs{display:flex;flex-wrap:wrap;gap:var(--s-2);margin:0 0 var(--s-5)}
.tab{min-height:2.75rem;padding:.5rem 1.1rem;border:1.5px solid var(--sward);border-radius:var(--r-pill);background:#fff;color:var(--sward);font:700 .9375rem var(--font-body);cursor:pointer}
.tab[aria-pressed=true]{background:var(--sward);color:#fff}
.tab .badge{margin-left:.4em;padding:0 .5rem}
.search{margin:0 0 var(--s-4)}
.savebar{position:sticky;bottom:0;z-index:20;background:#fff;border-top:1px solid var(--line);padding:var(--s-3) 0;margin-top:var(--s-4);display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center}
.savebar .btn{width:auto}
.creds{background:var(--ok-bg);border-radius:var(--r-md);padding:var(--s-5);margin:0 0 var(--s-5)}
.creds .pwd{font:700 1.5rem/1.3 ui-monospace,Menlo,Consolas,monospace;overflow-wrap:anywhere;margin:var(--s-2) 0}
.presets{display:flex;flex-wrap:wrap;gap:var(--s-2);margin:0 0 var(--s-3)}
details.more{border-top:1px solid var(--line);margin-top:var(--s-5);padding-top:var(--s-4)}
details.more summary{cursor:pointer;font-weight:700;color:var(--deep);min-height:2.5rem}
.hint{font-size:var(--t-sm);color:var(--muted);margin:calc(var(--s-1) * -1) 0 var(--s-3)}
@media(max-width:700px){.two,.three{grid-template-columns:1fr}.dl{grid-template-columns:1fr}.dl dt{margin-top:var(--s-2)}.pcard{padding:var(--s-4)}.codebox .code{font-size:1.4rem}}
@media(max-width:560px){.btn-row .btn,.savebar .btn{width:100%}.pw{flex-direction:column}.pw button{width:100%}}
