#teeth{--teeth-ink:#493f42;--teeth-muted:#766c70;--teeth-accent:#7a6f91;--teeth-soft:#f0ebf4;--teeth-line:rgba(89,75,96,.16)}
.teeth-shell{width:min(100%,980px);margin:auto;padding:18px 18px 110px;color:var(--teeth-ink);display:grid;gap:16px}.teeth-hero{display:flex;align-items:center;gap:14px}.teeth-hero>span{display:grid;place-items:center;width:54px;height:54px;border-radius:18px;background:var(--teeth-soft);font-size:1.7rem}.teeth-hero h1,.teeth-card h2{margin:0}.teeth-hero p,.teeth-card>p{margin:5px 0 0;color:var(--teeth-muted)}
.teeth-card{padding:clamp(17px,3vw,25px);border:1px solid var(--teeth-line);border-radius:22px;background:rgba(255,255,255,.92);box-shadow:0 12px 32px rgba(52,41,65,.06)}.teeth-eyebrow{color:var(--teeth-accent);font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.teeth-now p,.teeth-card li{line-height:1.55}.teeth-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.teeth-shell button,.teeth-shell input,.teeth-shell select,.teeth-shell textarea{min-height:44px;border:1px solid var(--teeth-line);border-radius:13px;background:#fff;color:var(--teeth-ink);font:inherit;padding:9px 12px}.teeth-shell button{font-weight:750;cursor:pointer}.teeth-shell button:focus-visible,.teeth-shell input:focus-visible,.teeth-shell select:focus-visible,.teeth-shell textarea:focus-visible,.teeth-shell a:focus-visible{outline:3px solid rgba(122,111,145,.3);outline-offset:2px}.teeth-primary{background:var(--teeth-accent)!important;color:#fff!important}
.teeth-map{margin-top:16px;padding:15px;border-radius:18px;background:#faf8fb}.teeth-jaw>strong{display:block;text-align:center;margin-bottom:8px}.teeth-row{display:grid;grid-template-columns:repeat(10,minmax(38px,1fr));gap:5px}.tooth-button{display:grid;place-items:center;gap:2px;min-width:0;padding:5px!important;border-radius:15px 15px 10px 10px!important}.tooth-shape{display:grid;place-items:center;width:31px;height:36px;border:2px solid #a99dab;border-radius:45% 45% 35% 35%;background:#fff;font-weight:900}.tooth-button.is-erupting .tooth-shape{border-style:dashed;background:#fff1cf}.tooth-button.is-erupted .tooth-shape{border-style:solid;border-color:#628275;background:#e2f1eb}.tooth-button[aria-pressed="true"]{box-shadow:0 0 0 3px rgba(122,111,145,.25)}.tooth-button small{font-size:.65rem}.teeth-midline{height:1px;margin:13px 0;background:var(--teeth-line)}
.teeth-edit{display:grid;gap:12px;margin-top:15px;padding:15px;border:1px solid var(--teeth-line);border-radius:17px;background:var(--teeth-soft)}.teeth-edit-head{display:flex;justify-content:space-between;align-items:start}.teeth-edit-head h3{margin:3px 0}.teeth-edit-head button{font-size:1.2rem}.teeth-edit label,.teeth-reminder label{display:grid;gap:6px;font-weight:750}.teeth-date-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.teeth-edit textarea{resize:vertical}.teeth-timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.teeth-timeline span{display:grid;gap:3px;padding:12px;border-radius:14px;background:var(--teeth-soft);color:var(--teeth-muted);font-size:.85rem}.teeth-timeline b{color:var(--teeth-ink)}.teeth-reminder{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin-top:14px}.teeth-help{border-left:5px solid #c89d68}.teeth-sources{display:flex;flex-wrap:wrap;gap:8px 14px;color:var(--teeth-muted);font-size:.82rem}.teeth-sources strong,.teeth-sources small{flex-basis:100%}.teeth-sources a{color:var(--teeth-accent)}
body.night #teeth{--teeth-ink:#f7eef7;--teeth-muted:#c8bdc8;--teeth-soft:rgba(135,112,157,.2);--teeth-line:rgba(235,218,240,.16)}body.night .teeth-card,body.night .teeth-shell button,body.night .teeth-shell input,body.night .teeth-shell select,body.night .teeth-shell textarea,body.night .teeth-map{background:#2f2931;color:var(--teeth-ink)}body.night .tooth-shape{color:#493f42}
@media(max-width:600px){.teeth-shell{padding-inline:12px}.teeth-card{overflow:hidden}.teeth-map{overflow:visible;margin-inline:-7px}.teeth-row{grid-template-columns:repeat(5,minmax(0,1fr));min-width:0}.teeth-date-grid,.teeth-timeline{grid-template-columns:1fr}.teeth-reminder{align-items:stretch}.teeth-reminder label,.teeth-reminder input,.teeth-reminder button{width:100%}}
