:root{--linen:#F6F1EA;--card:#fff;--sage:#7F9A86;--deep:#3F5A4C;--clay:#C97B5A;--sand:#EAD9C8;--line:#E3DACD;--ink:#2B2A27;--muted:#7A746B;--warn:#D9A441;--bad:#B5534A}
*{box-sizing:border-box}html,body{margin:0;background:var(--linen);color:var(--ink);font:400 15px/1.45 "DM Sans",system-ui,sans-serif;overflow-x:hidden}
h1,h2,h3,.serif{font-family:Fraunces,Georgia,serif;font-weight:600;color:var(--deep);margin:0 0 8px}h1{font-size:24px}h2{font-size:19px}h3{font-size:16px}
.num{font-weight:600;font-variant-numeric:tabular-nums}
header.top{position:sticky;top:0;z-index:5;height:56px;background:var(--linen);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;padding:0 16px}
header.top .brand{display:flex;align-items:center;gap:8px;font-family:Fraunces,serif;font-weight:600;color:var(--deep);font-size:18px;flex:1;min-width:0}
header.top .full{display:none}@media(min-width:420px){header.top .full{display:inline}header.top .short{display:none}}
header.top select{max-width:120px;font:500 13px "DM Sans";color:var(--deep);border:1px solid var(--line);border-radius:10px;padding:6px 8px;background:#fff}
main{padding:16px 16px 140px;max-width:760px;margin:0 auto}
.card{background:var(--card);border-radius:16px;padding:20px;box-shadow:0 1px 3px #2B2A2714;margin-bottom:16px;animation:rise 240ms cubic-bezier(.2,.7,.2,1)}
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.hero{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:16/9;margin-bottom:16px;background:var(--sand)}
.hero img,.hero .ph{width:100%;height:100%;object-fit:cover;display:block}
.ph{display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px;background:repeating-linear-gradient(135deg,var(--sand) 0 12px,#efe3d6 12px 24px)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(63,90,76,.72))}
.hero .cap{position:absolute;left:16px;bottom:14px;z-index:1;color:#fff;font:600 22px Fraunces,serif}
.btn{display:inline-block;border:0;border-radius:12px;padding:12px 16px;min-height:44px;font:600 14px "DM Sans";cursor:pointer;background:var(--clay);color:#fff}
.btn.ghost{background:transparent;color:var(--deep);border:1px solid var(--line)}
.row{display:flex;align-items:center;gap:12px;min-height:64px;border-bottom:1px solid var(--line)}.row:last-child{border-bottom:0}
.row .t{font:600 16px Fraunces,serif;color:var(--deep);width:56px;flex:none}.row .m{flex:1;min-width:0}.row .s{color:var(--muted);font-size:13px}
.chip{display:inline-block;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;background:var(--sand);color:var(--ink)}
.chip.today{background:var(--deep);color:#fff}.chip.reexam{background:var(--warn);color:#2B2A27}.chip.noshow{background:var(--bad);color:#fff}.chip.done{background:var(--sage);color:#fff}.chip.verify{background:#fff;border:1px dashed var(--warn);color:#7a5a12}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.svc{border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 1px 3px #2B2A2714}.svc .ph,.svc img{aspect-ratio:4/5;width:100%;object-fit:cover}.svc div.l{padding:10px 12px;font-weight:600}
.ring{--p:50;width:72px;height:72px;border-radius:50%;background:conic-gradient(var(--sage) calc(var(--p)*1%),var(--line) 0);display:grid;place-items:center;flex:none}
.ring span{width:62px;height:62px;border-radius:50%;background:#fff;display:grid;place-items:center;font:600 13px "DM Sans"}
.note{font-size:12px;color:var(--muted);border-left:3px solid var(--sage);padding:6px 10px;margin:8px 0 16px;background:#fff8}
nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:6;background:#fff;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr)}
nav.tabs button{background:none;border:0;min-height:56px;padding:6px 2px;display:flex;flex-direction:column;align-items:center;gap:2px;font:500 11px "DM Sans";color:var(--muted);cursor:pointer}
nav.tabs svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.6}
nav.tabs button.on{color:var(--deep)}nav.tabs button.on::after{content:"";width:4px;height:4px;border-radius:50%;background:var(--clay)}
footer.brandline{position:fixed;left:0;right:0;bottom:62px;text-align:center;font-size:11px;color:var(--muted);background:var(--linen);padding:4px}
.empty{text-align:center;padding:16px}.empty svg{width:96px;height:96px}
.alerts{border-left:4px solid var(--sage)}.alerts li{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line)}
.alerts ul,.cl ul{list-style:none;padding:0;margin:0}.alerts .btn{padding:8px 12px;min-height:40px;font-size:13px;flex:none}
.cl li{padding:10px 0;border-bottom:1px solid var(--line)}
input,select.f{font:inherit;width:100%;padding:10px;border:1px solid var(--line);border-radius:10px;background:#fff}
label{display:block;margin:8px 0;font-weight:500}
.collapsed ul,.collapsed p{display:none}
.hero .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center}