@font-face{font-family:"Chewy Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:85.4%;ascent-override:114.7%;descent-override:35.5%;line-gap-override:2.9%}@font-face{font-family:"Nunito Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:97.9%;ascent-override:103.3%;descent-override:36.1%;line-gap-override:0%}
.hero{background:linear-gradient(160deg,#111111,#6B4B52);color:#fff;border-radius:22px;overflow:hidden;margin-bottom:16px}
.hero .ph{height:150px;background:url(/ph-handoff-800.webp) center 40%/cover}
.hero .in{padding:20px 18px 18px}.hero h2{font:900 28px/1.1 Archivo,sans-serif;font-stretch:80%;text-transform:uppercase;margin-bottom:8px}.hero p{color:rgba(255,255,255,.88);font-size:15px;margin-bottom:14px}
.link{display:flex;background:#fff;border-radius:14px;overflow:hidden;min-height:48px}.link input{flex:1;min-width:0;border:0;padding:0 12px;font:600 14px Nunito,"Nunito Fallback",sans-serif;color:var(--fg);background:#fff}
.link button{border:0;background:var(--rose-ink,#000000);color:#fff;font:800 15px Nunito,"Nunito Fallback",sans-serif;padding:0 16px;min-height:48px;cursor:pointer}
.eyebrow{font:800 11px Nunito,"Nunito Fallback",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.75);margin:16px 0 8px}
.share{display:flex;gap:8px;flex-wrap:wrap}.share a,.share button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:48px;min-height:48px;padding:0 14px;border-radius:12px;background:#fff;color:#111111;border:0;font:800 15px Nunito,"Nunito Fallback",sans-serif;text-decoration:none;cursor:pointer}
.share .wa{background:#167540;color:#fff}.share svg{width:20px;height:20px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0 12px}.stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px}.stat b{display:block;font:800 24px Nunito,"Nunito Fallback",sans-serif;margin-top:4px}.stat small{font-size:12px;color:var(--mute)}
.stat.g{background:#EEF6F0;border-color:#BFDCC8;color:#2F5D3F}.stat.g small{color:#2F5D3F}
.inv{display:flex;align-items:flex-start;gap:8px;padding:12px 0;border-bottom:1px solid var(--line)}.inv:last-child{border:0}
.pager{display:flex;align-items:center;justify-content:space-between;padding-top:10px}.pager button{min-width:44px;min-height:44px;border-radius:12px;border:1px solid var(--line);background:#fff;font-size:18px;cursor:pointer}.pager button:disabled{opacity:.4}
.how{list-style:none;padding:0;margin:0}.how li{display:flex;gap:14px;padding-bottom:22px;position:relative}.how li:not(:last-child):after{content:"";position:absolute;left:23px;top:50px;bottom:4px;border-left:1.5px dashed var(--line)}
.how i{flex:none;width:48px;height:48px;border-radius:50%;background:#fff;box-shadow:0 4px 14px rgba(17,17,17,.12);display:grid;place-items:center;font-style:normal;color:#000000}.how i svg{width:22px;height:22px}
.prog2{display:flex;gap:4px;margin:10px 0}.prog2 b{flex:1;height:5px;border-radius:3px;background:#E4E7EA}.prog2 b.on{background:var(--rose-ink,#000000)}
#pmap{height:170px;border-radius:14px;overflow:hidden;margin-top:10px;border:1px solid var(--line)}
.kv{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}.kv:last-child{border:0}.kv span:first-child{color:var(--mute)}
.banner{border-radius:14px;padding:12px 14px;margin-bottom:12px;font-size:15px}.banner.ok{background:#EEF6F0;color:#2F5D3F}.banner.bad{background:#FFF8D1;color:#8E3B3B}
textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:10px;font:inherit}
.top .btn svg{width:20px;height:20px}.hero h2{font-size:25px}

/* ---- Phase 4: NoLaundry brand restyle for the customer account ---- */
@font-face{font-family:Chewy;src:url(/fonts/chewy.woff2) format("woff2");font-display:swap}
@font-face{font-family:Nunito;src:url(/fonts/nunito.woff2) format("woff2");font-weight:300 900;font-display:swap}
body[data-mode="customer"]{--g:#0B2B1E;--g2:#1E4A36;--y:#FEE136;--y2:#FFF4B8;--p:#F9D6D4;--s:#EEF5E3;--b:#D1F0FC;
 --bg:#FBFAF4;--paper:#fff;--fg:#0B2B1E;--mute:#3F5249;--line:rgba(11,43,30,.13);--rose:#0B2B1E;--rose-ink:#0B2B1E;--rose2:#1E4A36;--blush:#EEF5E3;--sky2:#D1F0FC;--sel:#FFF4B8;--ok:#1E6B3A;--warn:#7A4E00;
 --sh:0 10px 30px rgba(11,43,30,.07);--r:20px;color-scheme:light;background:var(--bg);color:var(--fg);font-family:Nunito,"Nunito Fallback",system-ui,-apple-system,"Segoe UI",sans-serif}
body[data-mode="customer"] h1,body[data-mode="customer"] h2,body[data-mode="customer"] h3,body[data-mode="customer"] .t,body[data-mode="customer"] .hero h2{font-family:Chewy,"Chewy Fallback","Arial Rounded MT Bold",sans-serif;font-weight:400;font-stretch:normal;letter-spacing:.01em;color:inherit}
body[data-mode="customer"] .top{background:rgba(251,250,244,.92);border-bottom:1px solid var(--line)}
body[data-mode="customer"] .top h1{font-size:22px;text-transform:uppercase}
body[data-mode="customer"] .top .logo{width:auto!important;height:34px!important}
body[data-mode="customer"] .tabs{background:rgba(251,250,244,.94)}
body[data-mode="customer"] .card{border-radius:var(--r);border-color:var(--line);box-shadow:var(--sh)}
body[data-mode="customer"] .btn{background:var(--g);color:#fff;border-radius:999px;font-weight:800;letter-spacing:.02em}
body[data-mode="customer"] .btn:hover{background:var(--g2)}
body[data-mode="customer"] .btn.ghost{background:#fff;color:var(--g);border:1.5px solid var(--g)}
body[data-mode="customer"] .chip{border-color:var(--line);font-weight:700}
body[data-mode="customer"] .chip.on,body[data-mode="customer"] .chip[aria-pressed="true"]{background:var(--y);border-color:var(--g);color:var(--g)}
body[data-mode="customer"] .pill{background:var(--s);color:var(--g);font-weight:800}
body[data-mode="customer"] .hero{background:var(--g);color:#FBFAF4;border-radius:28px}
body[data-mode="customer"] .hero .ph{border-radius:0 0 46% 54%/0 0 18% 22%}
body[data-mode="customer"] .link button,body[data-mode="customer"] .prog2 b.on{background:var(--g)}
body[data-mode="customer"] .prog2 b.on{background:var(--y)}
body[data-mode="customer"] .stat.g{background:var(--s);border-color:rgba(11,43,30,.2);color:var(--g)}
body[data-mode="customer"] .banner.bad{background:var(--y2);color:#6B2A1F}
body[data-mode="customer"] .banner.ok{background:var(--s);color:var(--g)}
body[data-mode="customer"] :focus-visible{outline:3px solid #1E6FD9;outline-offset:2px}
body[data-mode="customer"] #app{min-height:100vh}
@media(prefers-reduced-motion:reduce){body[data-mode="customer"] *{animation:none!important;transition:none!important}}
body[data-mode="customer"] button,body[data-mode="customer"] input,body[data-mode="customer"] select,body[data-mode="customer"] textarea,body[data-mode="customer"] .btn{font-family:Nunito,"Nunito Fallback",system-ui,sans-serif}
