/* Star Rose tenant report page. Brand tokens from starrose.co.uk */
:root{
  --navy:#121f2e; --navy-2:#1d3047; --pink:#ea4e98; --pink-d:#c9327a; --cream:#f6eee2; --cream-2:#efe3d0;
  --ink:#1b2430; --muted:#5b6675; --line:#e3dccf; --white:#fff; --ok:#1f8a5b; --alert:#c62f2f;
  --job-red:#d50000;
  --radius:16px; --shadow:0 6px 24px rgba(18,31,46,.08); --max:760px;
}
@font-face{font-family:Poppins;font-weight:400;font-display:swap;src:url(assets/fonts/poppins-400.woff2) format("woff2")}
@font-face{font-family:Poppins;font-weight:500;font-display:swap;src:url(assets/fonts/poppins-500.woff2) format("woff2")}
@font-face{font-family:Poppins;font-weight:600;font-display:swap;src:url(assets/fonts/poppins-600.woff2) format("woff2")}
@font-face{font-family:Poppins;font-weight:700;font-display:swap;src:url(assets/fonts/poppins-700.woff2) format("woff2")}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
[id]{scroll-margin-top:76px}
body{margin:0;font-family:Poppins,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--white);line-height:1.55;font-size:16px;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-underline-offset:3px}
a:hover{color:var(--pink-d)}
:focus-visible{outline:3px solid var(--pink);outline-offset:3px;border-radius:6px}
h1,h2,h3{line-height:1.2;margin:0 0 .45em;color:var(--navy);letter-spacing:-.01em}
h1{font-size:clamp(1.9rem,7vw,2.8rem);font-weight:700}
h2{font-size:clamp(1.35rem,4.5vw,1.8rem);font-weight:700}
h3{font-size:1.08rem;font-weight:600}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 18px}
.skip{position:absolute;left:-999px;top:0;background:var(--navy);color:#fff;padding:10px 14px;z-index:100}
.skip:focus{left:10px;top:10px}
.eyebrow{display:inline-block;font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--pink-d);margin-bottom:.5em}
.lead{font-size:1.05rem;color:var(--muted)}
.small{font-size:.88rem;color:var(--muted)}
/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:12px;height:62px}
.brand img{height:36px;width:auto}
.tag{font-size:.8rem;font-weight:600;color:var(--navy);background:var(--cream);border-radius:999px;padding:6px 12px;white-space:nowrap}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 22px;border-radius:999px;font:inherit;font-weight:600;line-height:1.2;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:transform .15s,background .15s}
.btn:active{transform:translateY(1px)}
.btn svg{width:20px;height:20px;flex:none}
.btn-pink{background:var(--pink);color:#fff}.btn-pink:hover{background:var(--pink-d);color:#fff}
.btn-navy{background:var(--navy);color:#fff}.btn-navy:hover{background:var(--navy-2);color:#fff}
.btn-ghost{border-color:var(--navy);color:var(--navy);background:#fff}.btn-ghost:hover{background:var(--navy);color:#fff}
.btn-sm{min-height:42px;padding:8px 16px;font-size:.92rem}
.btn-block{width:100%}
/* hero */
.hero{background:var(--cream);padding:30px 0 34px}
.who{display:flex;align-items:center;gap:14px;margin:0 0 20px}
.avatar{width:56px;height:56px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:700;font-size:1.15rem;flex:none}
.who b{display:block;color:var(--navy);font-size:1.05rem}
.who span{color:var(--muted);font-size:.92rem}
.actions{display:grid;gap:12px;margin-top:22px}
.action{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px 16px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);transition:transform .15s}
.action:hover{transform:translateY(-2px);color:var(--ink)}
.action .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex:none;background:var(--pink);color:#fff}
.action.navy .ic{background:var(--navy)}
.action.red .ic{background:var(--alert)}
.action .ic svg{width:24px;height:24px}
.action b{display:block;color:var(--navy);font-size:1.05rem;line-height:1.25}
.action span{display:block;color:var(--muted);font-size:.88rem;line-height:1.35;margin-top:2px}
.action .chev{margin-left:auto;color:var(--pink-d);flex:none;width:20px;height:20px}
/* sections */
section{padding:40px 0}
.sec-alt{background:var(--cream)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px}
/* emergency */
.emergency{background:#fff1f5;border:2px solid var(--alert);border-radius:var(--radius);padding:20px}
.emergency h2{color:var(--alert);display:flex;align-items:center;gap:10px}
.emergency h2 svg{width:26px;height:26px;flex:none}
.elist{list-style:none;margin:0;padding:0}
.elist li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #f3c9d6}
.elist li:last-child{border-bottom:0;padding-bottom:0}
.elist .what{font-weight:500;color:var(--ink);font-size:.95rem;line-height:1.35}
.elist .what small{display:block;color:var(--muted);font-size:.82rem;font-weight:400}
.tel{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-weight:700;color:#fff;background:var(--navy);text-decoration:none;border-radius:999px;padding:9px 14px;font-size:.95rem}
.tel.red{background:var(--alert)}
.tel:hover{color:#fff;background:var(--navy-2)}
.tel.red:hover{background:#a52222}
.tel svg{width:16px;height:16px}
/* forms */
label,.lbl{display:block;font-weight:600;font-size:.92rem;margin:0 0 6px;color:var(--navy)}
.req{color:var(--pink-d)}
.field{margin-bottom:16px}
.row2{display:grid;grid-template-columns:1fr;gap:0}
input,select,textarea{width:100%;font:inherit;font-size:16px;padding:13px 14px;border:1.5px solid #cfc6b7;border-radius:12px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--pink);outline:none;box-shadow:0 0 0 3px rgba(234,78,152,.2)}
textarea{min-height:120px;resize:vertical}
.tick{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:.95rem;color:var(--ink);cursor:pointer;font-weight:500}
.tick input{width:22px;height:22px;flex:none;margin:0;padding:0;accent-color:var(--navy);cursor:pointer}
input.is-off{background:#efebe4;color:#6b6358;border-color:#ddd5c8}
input[aria-invalid="true"]{border-color:#d9534f}
.hint{font-size:.84rem;color:var(--muted);margin-top:5px}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg label{display:flex;align-items:center;justify-content:center;min-height:50px;border:1.5px solid #cfc6b7;border-radius:12px;background:#fff;cursor:pointer;font-weight:600;margin:0}
.seg input:checked + label{border-color:var(--navy);background:var(--navy);color:#fff}
.seg input:focus-visible + label{outline:3px solid var(--pink);outline-offset:2px}
.seg input.urgent-yes:checked + label{background:var(--alert);border-color:var(--alert)}
.form-error{display:none;background:#fdecec;border:1px solid #f0b4b4;color:#8f1d1d;border-radius:12px;padding:12px 14px;font-size:.93rem;margin-bottom:14px}
.urgent-note{display:none;background:#fff1f5;border:1px solid var(--pink);border-radius:12px;padding:12px 14px;font-size:.9rem;margin-top:10px}
.sent{display:none;margin-top:16px;background:#eef8f2;border:1px solid #b5dcc5;border-radius:var(--radius);padding:18px}
.sent h3{color:var(--ok)}
.sent .btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.photo-tip{display:flex;gap:10px;align-items:flex-start;background:var(--cream);border-radius:12px;padding:12px 14px;font-size:.9rem;margin:4px 0 16px}
.photo-tip svg{width:22px;height:22px;flex:none;color:var(--pink-d)}
/* tips */
.ticks{list-style:none;padding:0;margin:0}
.ticks li{position:relative;padding-left:28px;margin:0 0 .6em}
.ticks li::before{content:"";position:absolute;left:0;top:.3em;width:17px;height:17px;border-radius:50%;background:var(--pink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/10px no-repeat}
/* footer */
.site-footer{background:var(--navy);color:#b9c4d1;padding:36px 0 110px;font-size:.92rem}
.site-footer img{height:34px;width:auto;margin-bottom:14px}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{color:var(--pink)}
.site-footer p{margin:0 0 .5em}
.foot-base{border-top:1px solid rgba(255,255,255,.12);margin-top:22px;padding-top:14px;font-size:.8rem}
/* bottom action bar (phones) */
.actionbar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--navy);padding:8px 8px calc(8px + env(safe-area-inset-bottom));gap:6px;box-shadow:0 -6px 20px rgba(0,0,0,.15)}
.actionbar a{display:flex;flex-direction:column;align-items:center;gap:2px;color:#fff;text-decoration:none;font-size:.76rem;font-weight:500;padding:6px 4px;border-radius:10px}
.actionbar a.hot{background:var(--pink)}
.actionbar a.sos{background:var(--alert)}
.actionbar svg{width:22px;height:22px}
@media (min-width:720px){
  .actions{grid-template-columns:1fr 1fr}
  .actions .action.wide{grid-column:1/-1}
  .row2{grid-template-columns:1fr 1fr;gap:14px}
  .actionbar{display:none}
  .site-footer{padding-bottom:40px}
  section{padding:56px 0}
  .hero{padding:48px 0 52px}
}
/* ---------- jobs board ---------- */
.jobs-body{background:#f7f4ef}
.jobs-head{background:var(--navy);color:#fff;padding:22px 0 24px}
.jobs-head h1{color:#fff;margin:0;font-size:clamp(1.6rem,6vw,2.2rem)}
.jobs-head .date{color:#ffd0e5;font-weight:500;margin:4px 0 0}
.jobs-head .meta{color:#b9c4d1;font-size:.82rem;margin:8px 0 0}
.jobs-head .brandrow{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.jobs-head .brandrow img{height:30px;width:auto}
.jobs-head .brandrow span{font-size:.78rem;color:#b9c4d1;font-weight:500}
.jsec{padding:22px 0 6px}
.jsec h2{font-size:1.15rem;display:flex;align-items:center;gap:10px;margin-bottom:12px}
.count{background:var(--job-red);color:#fff;border-radius:999px;font-size:.78rem;padding:2px 10px;font-weight:600}
.count.muted{background:#9aa3ae}
.job{background:#fff;border-radius:14px;border:1px solid var(--line);border-left:6px solid var(--job-red);padding:16px 16px 14px;margin-bottom:12px;box-shadow:0 2px 10px rgba(18,31,46,.05)}
.job .top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.job .time{font-weight:700;color:var(--job-red);font-size:1rem}
.job .day{font-weight:600;color:var(--navy);font-size:.88rem}
.badge{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;border-radius:999px;padding:3px 9px;background:var(--cream);color:var(--navy)}
.badge.now{background:var(--job-red);color:#fff}
.badge.past{background:#e7e9ec;color:#5b6675}
.job h3{margin:8px 0 2px;font-size:1.08rem}
.job .addr{color:var(--ink);font-size:.95rem;margin:0 0 8px}
.job .notes{background:#fff6f6;border-radius:10px;padding:10px 12px;font-size:.9rem;margin:0 0 10px;white-space:pre-line}
.job .from{display:block;color:var(--muted);font-size:.8rem;margin-top:4px}
.job .links{display:flex;flex-wrap:wrap;gap:8px}
.maplink{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border-radius:999px;background:var(--navy);color:#fff;text-decoration:none;font-weight:600;font-size:.92rem}
.maplink:hover{background:var(--navy-2);color:#fff}
.maplink svg{width:18px;height:18px}
.job.is-past{opacity:.7;border-left-color:#e9a3a3}
.empty{background:#fff;border:1px dashed #d8cfbf;border-radius:14px;padding:18px;color:var(--muted);text-align:center}
details.done{margin:6px 0 30px}
details.done summary{cursor:pointer;list-style:none;font-weight:600;color:var(--navy);padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:14px;display:flex;align-items:center;gap:10px}
details.done summary::-webkit-details-marker{display:none}
details.done summary::after{content:"+";margin-left:auto;font-size:1.3rem;color:var(--pink-d)}
details.done[open] summary::after{content:"–"}
details.done[open] summary{margin-bottom:12px}
.jobs-foot{color:var(--muted);font-size:.8rem;padding:10px 0 40px}
@media print{.site-header,.actionbar,.site-footer,.no-print{display:none!important}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.mt{margin-top:14px}
.site-footer b.w{color:#fff}

/* ---- Send flow: photos, sending, success, fallback ---- */
.opt{font-weight:400;color:var(--muted);font-size:.85em}
.hp{position:absolute!important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.vh{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden;clip:rect(0 0 0 0);border:0!important;opacity:0}
.photo-pick{display:flex;gap:12px;align-items:center;background:var(--cream);border:1.5px dashed #cdbfa8;border-radius:12px;padding:14px 16px;cursor:pointer;margin:0;font-weight:400;color:var(--ink)}
.photo-pick svg{width:28px;height:28px;flex:none;color:var(--pink-d)}
.photo-pick b{display:block;color:var(--navy);font-size:1rem}
.photo-pick small{display:block;color:var(--muted);font-size:.85rem}
.photo-pick:active{background:var(--cream-2)}
.photo-pick.full{opacity:.6;cursor:default}
input.vh:focus-visible + .thumbs, .photos:focus-within .photo-pick{outline:3px solid rgba(234,78,152,.35);outline-offset:2px}
.thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:10px}
.thumbs:empty{display:none}
.thumb{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--cream-2)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb-x{position:absolute;top:3px;right:3px;width:26px;height:26px;border-radius:50%;border:0;background:rgba(18,31,46,.8);color:#fff;font-size:18px;line-height:26px;padding:0;cursor:pointer}
.photo-msg:empty{display:none}
.thumb.vid video{width:100%;height:100%;object-fit:cover;display:block;background:var(--navy);pointer-events:none}
.thumb .vbadge{position:absolute;left:4px;bottom:4px;display:inline-flex;align-items:center;gap:2px;background:rgba(18,31,46,.85);color:#fff;font-size:.72rem;font-weight:700;border-radius:999px;padding:2px 7px 2px 4px;line-height:1.4}
.thumb .vbadge svg{width:12px;height:12px}
.vid-up{margin:12px 0;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:.92rem}
.vid-up p{margin:0 0 8px}
.vbar{height:8px;border-radius:999px;background:var(--cream-2);overflow:hidden}
.vbar span{display:block;height:100%;width:0;background:var(--pink);transition:width .3s}
.vid-up.ok{border-color:#b5dcc5}.vid-up.ok .vbar span{background:var(--ok)}
.vid-up.bad{border-color:var(--pink);background:#fff1f5}.vid-up.bad .vbar{display:none}
.btn[disabled]{opacity:.75;cursor:progress}
.spin{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;display:inline-block;animation:spin .8s linear infinite;margin-right:2px}
@keyframes spin{to{transform:rotate(360deg)}}
form.is-done > :not(.sent){display:none!important}
form.is-done .sent{margin-top:0;text-align:center}
.ok-badge{width:56px;height:56px;border-radius:50%;background:var(--ok);color:#fff;display:flex;align-items:center;justify-content:center;margin:2px auto 10px}
.ok-badge svg{width:30px;height:30px}
.sent h3{color:var(--navy)}
.ref-box{background:#fff;border:1.5px solid #b5dcc5;border-radius:12px;padding:12px;margin:14px auto;max-width:320px;font-size:.85rem;color:var(--muted)}
.ref-box b{display:block;font-size:1.45rem;letter-spacing:.04em;color:var(--navy);margin-top:2px}
.send-fail{display:none;margin-top:16px;background:#fdecec;border:1px solid #f0b4b4;border-radius:var(--radius);padding:18px}
.send-fail h3{color:#8f1d1d}
.js-fail-msg{color:#8f1d1d;font-size:.93rem}
form.is-done,.send-fail,.sent{scroll-margin-top:96px}

/* "Help me describe this" assistant */
.helper{margin-top:10px}
.helper-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.helper-bar .btn{gap:6px}.helper-bar .spark{font-size:1.05em;line-height:1}
.helper-note{margin-top:0;flex:1 1 180px}
.js-help[disabled]{opacity:.6;cursor:default}
.helper-out{margin-top:12px;display:grid;gap:10px}
.helper-out[hidden]{display:none}
.helper-tips{margin-bottom:10px;display:grid;gap:10px}
.helper-tips:empty{display:none}
.hbox{background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:.93rem}
.hbox h4{margin:0 0 8px;font-size:.98rem;font-weight:600;color:var(--navy)}
.hbox ul{margin:0;padding-left:20px}.hbox li{margin:4px 0}
.hbox.checks{background:#fff8e8;border-color:#ecd9a8}
.hbox.rewrite{background:#fff}
.hbox.rewrite .rw{white-space:pre-wrap;margin:0 0 10px;color:var(--ink)}
.hbox.ask{background:#f0f4fa;border-color:#cfdaea}
.hbox .btns{display:flex;gap:8px;flex-wrap:wrap;margin:0}
.hbox .btn-sm{min-height:38px;padding:6px 14px;font-size:.88rem}
.hbox.emerg{background:#fdecec;border:1.5px solid var(--alert);color:#5a1414}
.hbox.emerg h4{color:var(--alert)}
.hbox.emerg .tel{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:8px 20px;border-radius:999px;background:var(--alert);color:#fff;font-weight:700;font-size:1.1rem;text-decoration:none;margin:8px 0 4px}
.hbox .small{margin:6px 0 0;font-size:.85rem;color:var(--muted)}
.hbox.wait{display:flex;align-items:center;gap:10px;color:var(--muted)}
.hbox.wait .spin{border-color:rgba(18,31,46,.2);border-top-color:var(--navy)}
.hero-h1{font-size:clamp(1.45rem,6.2vw,2.6rem)}

.tried-q{margin:10px 0 4px}.tried-q .lbl{display:block;font-size:.9rem;margin-bottom:6px}.seg-sm{max-width:220px}.seg-sm label{min-height:38px;font-size:.92rem}

/* Fire panel help (shown when "Fire panel" is the problem picked; Oct 28 2026) */
.fire-help{margin:4px 0 18px;padding:16px;border:1.5px solid #f1c4c4;border-radius:var(--radius);background:#fffafa}
.fire-help[hidden]{display:none}
.fire-help h3{margin:4px 0 4px;color:var(--navy);font-size:1.12rem}
.fire-help>p{margin:0 0 12px;color:var(--muted);font-size:.95rem}
.fire-999{background:#fdecec;border:1.5px solid var(--alert);color:#5a1414;border-radius:12px;padding:10px 12px;margin-bottom:12px;font-size:.95rem}
.fire-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.fire-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px;border:1.5px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;font:inherit;color:var(--ink);text-align:center;-webkit-tap-highlight-color:transparent}
.fire-card img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#f8fafc;border-radius:8px;display:block}
.fire-card b{font-size:.98rem;color:var(--navy)}
.fire-card span{font-size:.74rem;color:var(--muted);line-height:1.2}
.fire-card[aria-expanded="true"]{border-color:var(--alert);box-shadow:0 0 0 3px rgba(198,47,47,.15)}
.fire-steps{margin-top:12px;padding:14px;border-radius:12px;background:#fff;border:1.5px solid var(--line);line-height:1.6;font-size:.95rem}
.fire-steps[hidden]{display:none}
.fire-steps-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.fire-steps h4{margin:0;color:var(--navy);font-size:1.05rem}
.fire-steps h5{margin:6px 0 2px;font-size:.95rem}
.fire-steps p{margin:4px 0 8px}
.fire-steps ol{padding-left:20px;margin:0}
.fire-steps li+li{margin-top:10px}
.fire-close{border:0;background:#f1ece3;color:var(--navy);width:32px;height:32px;border-radius:50%;font-size:20px;line-height:1;cursor:pointer;flex:none}
.fire-warn{margin-top:14px;padding:10px 12px;border-radius:10px;background:rgba(180,35,24,.08);border:1px solid rgba(180,35,24,.15);font-size:.9rem}
.fire-after{margin:12px 0 0;font-size:.9rem;color:var(--muted)}
.fire-none{margin-top:12px;font-size:.92rem;color:var(--ink)}
.fire-help a{color:var(--pink-d);font-weight:600}
@media (max-width:360px){.fire-card span{display:none}}
.fire-steps{scroll-margin-top:96px}