:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, sans-serif; --ink:#312a28; --cream:#fff8ec; --orange:#f4a261; --coral:#e76f51; }
* { box-sizing: border-box; }
body { min-height:100vh; margin:0; display:grid; grid-template-rows:1fr auto; color:var(--ink); background:radial-gradient(circle at 20% 15%,#ffe0b5 0,transparent 30%),radial-gradient(circle at 85% 80%,#f8c6b7 0,transparent 32%),var(--cream); }
main { display:grid; place-items:center; padding:2rem 1rem; }
.card { width:min(680px,100%); text-align:center; padding:clamp(2rem,6vw,4.5rem); border:1px solid rgba(49,42,40,.1); border-radius:28px; background:rgba(255,255,255,.72); box-shadow:0 24px 80px rgba(86,55,38,.13); backdrop-filter:blur(12px); }
.eyebrow { color:var(--coral); font-size:.75rem; font-weight:850; letter-spacing:.15em; text-transform:uppercase; }
h1 { margin:.25rem 0 1rem; font-family:Georgia,serif; font-size:clamp(2.4rem,8vw,4.8rem); line-height:.98; letter-spacing:-.04em; }
.lead { max-width:510px; margin:0 auto; color:#6d5f5a; font-size:clamp(1rem,2vw,1.15rem); line-height:1.7; }
.status { display:inline-flex; align-items:center; gap:.55rem; margin-top:1.8rem; padding:.55rem .9rem; border-radius:999px; background:#fff1dc; font-weight:750; font-size:.82rem; }
.status span { width:.6rem; height:.6rem; border-radius:50%; background:#3a9d6f; box-shadow:0 0 0 5px rgba(58,157,111,.12); }
.illustration { position:relative; width:90px; height:84px; margin:0 auto 1rem; }
.ear { position:absolute; top:0; width:27px; height:54px; border:7px solid var(--orange); border-radius:80% 80% 35% 35%; background:#ffd4bd; }
.ear--left { left:17px; transform:rotate(-10deg); }.ear--right { right:17px; transform:rotate(10deg); }
.face { position:absolute; left:11px; bottom:0; width:68px; height:58px; border-radius:50%; background:var(--orange); box-shadow:inset 0 -8px rgba(231,111,81,.18); }
.face i { position:absolute; top:22px; width:6px; height:8px; border-radius:50%; background:var(--ink); }.face i:first-child { left:19px; }.face i:nth-child(2) { right:19px; }
.face b { position:absolute; left:29px; top:34px; width:10px; height:7px; border-radius:50% 50% 60% 60%; background:var(--coral); }
footer { padding:1.2rem; text-align:center; color:#8b7770; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; }