:root{--ground: #F5F6F1;--ink: #18241F;--muted: #4E5B54;--line: #C9D1CA;--hair: #E4E9E4;--teal: #0F5E50;--teal-soft: #E1F0E8;--teal-mid: #2E7E6E;--mist: #DDE6DF;--orange: #A44A15;--warn: #9A3412;--display: "Bricolage Grotesque", Georgia, serif;--body: "Figtree", "Segoe UI", system-ui, sans-serif;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--orange);outline-offset:2px}img{max-width:100%;display:block}h1{margin:0;font-family:var(--display);font-size:28px;line-height:1.12;font-weight:700}h2{margin:0;font-family:var(--display);font-size:20px;font-weight:700}.hero{font-size:34px;margin-top:28px}.muted{color:var(--muted)}.small{font-size:13px}.center{text-align:center}.lead{font-size:16px;margin:8px 0 0}.grow{flex-grow:1}.vh{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.app{min-height:100%;display:flex;flex-direction:column;padding-bottom:env(safe-area-inset-bottom)}.banner{padding:6px 12px;padding-top:calc(6px + env(safe-area-inset-top));background:var(--ink);color:var(--ground);font-size:12px;font-weight:600;text-align:center}.shell{flex-grow:1;display:flex;flex-direction:column}.col{flex-grow:1;display:flex;flex-direction:column;align-items:center;min-width:0}.content{width:100%;max-width:480px;flex-grow:1;display:flex;flex-direction:column}.content.wide{max-width:1120px}.side,.desktop-only{display:none}.screen{flex-grow:1;display:flex;flex-direction:column;gap:18px;padding:24px 24px 28px}.screen.centred{padding-top:64px}.stack{display:flex;flex-direction:column;gap:12px}.stack-s{display:flex;flex-direction:column;gap:8px}.row{display:flex;align-items:center;gap:14px}.row.between{justify-content:space-between}.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.brand{font-family:var(--display);font-size:22px;font-weight:700}.brand.inline{color:var(--teal);font-size:20px}.label{font-size:13px;font-weight:600;color:#3a4740}input[type=email],input[type=text],input[type=search],select{min-height:52px;border-radius:14px;border:1.5px solid var(--line);background:#fff;padding:0 16px;font-size:16px;width:100%}input:focus,select:focus{border-color:var(--teal);outline:none;box-shadow:0 0 0 3px var(--teal-soft)}.btn{min-height:52px;border-radius:14px;border:none;background:var(--teal);color:#fff;font-size:16px;font-weight:600;cursor:pointer;padding:0 18px}.btn:disabled{background:#a9bdb4;cursor:not-allowed}.btn.big{min-height:56px;font-size:17px;font-weight:700}.btn.secondary{background:#fff;color:var(--ink);border:1.5px solid var(--line)}.btn.soft{background:var(--teal-soft);color:var(--teal);border:2px solid var(--teal);font-weight:700}.btn.ghost{background:transparent;color:#5a665f;border:1.5px solid #C3CBC4}.btn.small-btn{min-height:44px;border-radius:12px;font-size:15px}.link{align-self:center;min-height:44px;border:none;background:none;color:var(--teal);font-weight:600;text-decoration:underline;cursor:pointer}.back{align-self:flex-start;min-height:44px;min-width:44px;padding:0;border:none;background:none;cursor:pointer;display:flex;align-items:center}.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}.or:before,.or:after{content:"";flex-grow:1;height:1px;background:#d5dbd5}.fine{margin:4px 0 0;color:var(--muted);font-size:13px;text-align:center}.fine a{color:var(--teal)}.drop{min-height:112px;border-radius:16px;border:2px dashed #9FB3A7;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:16px;text-align:center;cursor:pointer;color:var(--teal)}.drop.done{border-style:solid;border-color:var(--teal);background:var(--teal-soft)}.drop:focus-within{outline:3px solid var(--orange);outline-offset:2px}.thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.thumb{aspect-ratio:1;border-radius:14px;overflow:hidden;background:var(--mist);display:flex;align-items:center;justify-content:center;color:var(--teal);font-weight:600;font-size:13px}.thumb img{width:100%;height:100%;object-fit:cover}.thumb.add{border:2px dashed #9FB3A7;background:#fff;cursor:pointer}.status{margin:0;color:var(--teal);font-weight:600;font-size:14px}.status.warn{color:var(--warn)}.avatar{flex-shrink:0;border-radius:50%;overflow:hidden;background:var(--mist);display:flex;align-items:center;justify-content:center;color:var(--teal);border:3px solid #fff;align-self:center}.screen .row .avatar{align-self:auto}.avatar img{width:100%;height:100%;object-fit:cover}.progress{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}.progress li{display:flex;align-items:center;gap:12px;color:#6a766f;min-height:28px}.progress .tick{width:26px;height:26px;border-radius:50%;border:2px solid var(--line);flex-shrink:0}.progress li.active{color:var(--ink);font-weight:700}.progress li.active .tick{border:3px solid #C2581B}.progress li.done{color:var(--ink);font-weight:600}.progress li.done .tick{background:var(--teal) 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/15px no-repeat;border-color:var(--teal)}.ask{background:#fff;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:12px;border:1.5px solid #E7C3A8}.firstlook{position:relative;background:#fff;border:1.5px solid #CFE0D7;border-radius:6px 18px 18px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;animation:pop .35s ease-out}.firstlook p{margin:0;font-size:15px;line-height:1.5}.firstlook .fl-label{font-size:12px;font-weight:700;color:var(--orange)}.firstlook.busy{flex-direction:row;align-items:center;justify-content:space-between}.screen.centred .firstlook{text-align:left;align-self:stretch}.dots{display:inline-flex;gap:4px}.dots i{width:6px;height:6px;border-radius:50%;background:var(--teal-mid);animation:blink 1.2s infinite ease-in-out}.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}.caption{font-size:14px;color:var(--teal);font-weight:600}@keyframes pop{0%{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}@keyframes blink{0%,80%,to{opacity:.25}40%{opacity:1}}.progressbar{display:flex;align-items:center;gap:8px}.bar{flex-grow:1;height:6px;border-radius:3px;background:#dde3dd;overflow:hidden}.bar div{height:100%;background:var(--teal);border-radius:3px;transition:width .3s}.card{background:#fff;border-radius:18px}.rows{padding:2px 16px}.rowitem{display:flex;align-items:center;gap:12px;padding:14px 0}.rowitem+.rowitem{border-top:1px solid var(--hair)}.rowitem .grow{display:flex;flex-direction:column;gap:2px;min-width:0}.val{font-size:17px}.chip-btn{min-height:44px;padding:0 14px;border-radius:12px;border:1.5px solid var(--line);background:#fff;color:var(--teal);font-weight:700;cursor:pointer}.option{min-height:48px;border-radius:12px;border:1px solid #D5DBD5;background:#fff;text-align:left;padding:0 14px;cursor:pointer;font-weight:600}.option.dashed{border:1.5px dashed var(--line);background:transparent;color:var(--orange);text-align:center}.option.tall{min-height:72px;border-radius:16px;border-width:1.5px;border-color:var(--line);padding:14px 16px;display:flex;flex-direction:column;gap:2px}.option.on{border:2px solid var(--teal);background:var(--teal-soft)}.stepper{padding:18px;display:flex;align-items:center;justify-content:space-between}.stepper .center{display:flex;flex-direction:column;align-items:center}.round{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--line);background:var(--ground);font-size:24px;cursor:pointer}.num{font-family:var(--display);font-size:40px;font-weight:700;line-height:1}.profile{padding:16px 20px 28px;gap:14px}.hero-art{position:relative;margin:0 -20px;height:232px;overflow:hidden;background:#cde9f2}.hero-art img{width:100%;height:100%;object-fit:cover;object-position:82% 50%;animation:fadein .6s ease-out}.hero-art:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,#0f261a9e,#0f261a2e 45%,#0f261a00 70%);pointer-events:none}.meadow{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(60% 90% at 62% 0%,#fff4d2e6,#fff4d200 60%),linear-gradient(to bottom,#9fd3ec,#cde9f2 42%,#f3f1dc 58%,#97c58a 60%,#80b86f 72%,#5e9a4f);background-size:200% 100%;animation:drift 6s ease-in-out infinite alternate}.painting{position:absolute;top:12px;right:12px;z-index:1;background:#ffffffe0;color:var(--teal);font-size:12px;font-weight:700;border-radius:999px;padding:6px 12px}.hero-text{position:absolute;left:20px;bottom:16px;right:40%;z-index:1;color:#fff;display:flex;flex-direction:column;gap:2px;text-shadow:0 1px 12px rgba(0,0,0,.35)}.hero-text h1{font-size:34px}.hero-text span{font-size:14px;font-weight:600;opacity:.95}@keyframes drift{0%{background-position:0 0}to{background-position:100% 0}}@keyframes fadein{0%{opacity:0}to{opacity:1}}.facts{display:flex;flex-wrap:wrap;gap:8px}.facts span{background:#fff;border:1.5px solid var(--hair);border-radius:999px;padding:6px 12px;font-size:13px;color:var(--muted)}.facts strong{color:var(--ink)}.steps{padding:18px;display:flex;flex-direction:column;gap:10px;border:1.5px solid #CFE0D7}.steps .bar{flex:0 0 6px}.checklist{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column}.checklist li{display:flex;align-items:flex-start;gap:12px;padding:12px 0}.checklist li+li{border-top:1px solid var(--hair)}.checklist li>.grow{display:flex;flex-direction:column;gap:2px;min-width:0}.checklist li>button{flex-shrink:0;align-self:center}.checklist .check{width:26px;height:26px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;margin-top:1px}.checklist li.cur{background:var(--teal-soft);margin:0 -10px;padding:12px 10px;border-radius:14px;border-top-color:transparent}.checklist li.cur+li{border-top-color:transparent}.checklist li.cur .check{border:3px solid #C2581B}.checklist li.done strong{color:var(--muted)}.checklist li.done .check{background:var(--teal) 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/15px no-repeat;border-color:var(--teal)}.checklist .btn.small-btn{padding:0 20px}.stack-xs{display:flex;flex-direction:column;gap:1px}.vetcard{padding:18px;display:flex;flex-direction:column;gap:12px}.vetcard p{margin:0;color:#2f3b35}.vet-avatar{width:56px;height:56px;border-radius:50%;flex-shrink:0;overflow:hidden;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:20px}.vet-avatar img{width:100%;height:100%;object-fit:cover}.vname{font-family:var(--display);font-size:19px}.nurse{display:grid;grid-template-columns:34px minmax(0,1fr);column-gap:12px;row-gap:10px;align-items:start;background:#fbf4ee;border:1.5px solid #F0DCCB;border-radius:14px;padding:12px}.nurse .btn{grid-column:2;justify-self:start}.nurse-dot{width:34px;height:34px;border-radius:50%;background:var(--orange);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}.fact{padding:14px 16px;display:flex;flex-direction:column;gap:4px;border-left:4px solid var(--orange)}.fact p{margin:0}.fl-label{font-size:12px;font-weight:700;color:var(--orange)}.inline-extras{display:flex;flex-direction:column;gap:8px;margin-top:10px}.topbar{display:flex;align-items:center;justify-content:space-between}.pgrid{display:flex;flex-direction:column;gap:22px}.chips{display:flex;gap:8px;flex-wrap:wrap}.chip{min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid var(--line);background:#fff;font-weight:600;cursor:pointer}.chip.on{border-color:var(--teal);background:var(--teal-soft);color:var(--teal);font-weight:700}.tiles-area,.inbox-area{display:flex;flex-direction:column;gap:12px}.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tile{background:#fff;border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:8px;border:1.5px solid #CFE0D7;position:relative}.tile .small{color:var(--muted)}.tile .badge{align-self:flex-end;font-size:11px;font-weight:700;color:var(--teal);background:var(--teal-soft);border-radius:999px;padding:2px 8px}.tile.soon{background:#eef0ec;border-style:dashed;border-color:#c3cbc4;color:#5a665f}.tile.soon .badge{color:#5a665f;background:#e0e4df}.inbox{padding:4px 16px}.mail{display:flex;gap:12px;padding:12px 0}.mail+.mail{border-top:1px solid var(--hair)}.when{min-width:74px;font-size:12px;font-weight:700;color:var(--orange);padding-top:2px}.narrow{max-width:560px;width:100%;align-self:center}.result{padding:20px;display:flex;flex-direction:column;gap:10px}.result p{margin:0}.score{display:flex;align-items:baseline;gap:8px}.portrait{aspect-ratio:1;width:100%;max-width:420px;align-self:center;border-radius:20px;background:#e7dccb;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;color:#6b4a2b;font-weight:600;overflow:hidden}.portrait img{width:100%;height:100%;object-fit:cover}.sidecard{background:#fff;color:var(--ink);border-radius:18px;padding:16px;display:flex;align-items:center;gap:14px}.sidecard>div:last-child{display:flex;flex-direction:column}.sidecard strong{font-family:var(--display);font-size:20px}.sidecard span{color:var(--muted);font-size:14px}.vid{font-size:13px}@media (min-width: 900px){.shell:not(.full){flex-direction:row}.side{display:flex;flex:0 0 42%;max-width:560px;padding:48px 56px;background:var(--teal);color:#fff;flex-direction:column;gap:24px}.side h2{font-size:40px;line-height:1.08;margin-top:24px}.side p{margin:0;font-size:17px;color:#d7ebe3}.side .sidecard{margin-top:auto}.stages{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;color:#d7ebe3}.stages li{display:flex;align-items:center;gap:12px}.stages .dot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;border:2px solid #5E9E8F}.stages li.cur{color:#fff;font-weight:700}.stages li.cur .dot{background:#fff;color:var(--teal);border-color:#fff}.stages li.done .dot{background:var(--teal-mid);border-color:var(--teal-mid);color:#fff}.mobile-only{display:none}.desktop-only{display:block}.screen{padding:56px 40px 28px}.screen.centred{justify-content:center;padding-top:56px}.screen>.grow{flex-grow:0;min-height:8px}.profile{padding:32px 40px 40px}.pgrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto 1fr;column-gap:28px;row-gap:24px;align-items:start}.col-a{grid-column:1;grid-row:1}.inbox-area{grid-column:1;grid-row:2}.col-b{grid-column:2;grid-row:1 / span 2}.col-a,.col-b{display:flex;flex-direction:column;gap:22px}.hero-art{margin:0;border-radius:24px;height:auto;aspect-ratio:21 / 7}.hero-text h1{font-size:44px}.facts{margin-top:-4px}}@media (max-width: 899px){.col-a,.col-b{display:contents}.steps{order:1}.vetcard{order:2}.tiles-area{order:3}.fact{order:4}.inbox-area{order:5}}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}