/* "When to get help fast" (can-bad-teeth-make-you-sick, #emergency): owner-approved and locked 2026-10-28 (Daniel: "yes- approved... give to lead
   to hand to claude for integration...."; Codex same-day v002, light-red emergency box with a full red outline). Site placement of the locked
   style.css: every rule scoped to .dio-same-day, the h1/h2 rules restyle the h3/h4, the review shell, review note, body rules, page media rule and
   @font-face dropped (fonts.css supplies Nunito Sans). The arch band masks the site's own assets/arch-tile.svg (resolved from this stylesheet's
   folder). Values are unchanged. Clinical review stays awaiting sign-off, separate from this design approval. */
.dio-same-day .sd-figure{margin:0;container-type:inline-size;--sd-ink:#2f4452;--sd-steel:#4c7288;--sd-orange:#ed873c;--sd-mineral:#f5f7f7;color:var(--sd-ink);font-family:"Avenir Next",Avenir,"Nunito Sans",system-ui,sans-serif}
.dio-same-day .sd-figure *{box-sizing:border-box}
.dio-same-day .sd-stage{background:var(--sd-mineral);overflow:hidden;clip-path:polygon(20px 0,100% 0,100% calc(100% - 20px),calc(100% - 20px) 100%,0 100%,0 20px)}
.dio-same-day .sd-heading{position:relative;isolation:isolate;overflow:hidden;padding:22px 28px 20px;background:#e8eff3;border-bottom:1px solid #cad5da}
.dio-same-day .sd-heading .sd-title{position:relative;margin:0;font-size:30px;line-height:1.25;font-weight:500;letter-spacing:-.025em}
.dio-same-day .sd-arch{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;
  -webkit-mask-image:url(../../arch-tile.svg),linear-gradient(90deg,rgba(0,0,0,.05),rgba(0,0,0,.10) 40%,rgba(0,0,0,.45) 72%,#000);
  mask-image:url(../../arch-tile.svg),linear-gradient(90deg,rgba(0,0,0,.05),rgba(0,0,0,.10) 40%,rgba(0,0,0,.45) 72%,#000);
  -webkit-mask-size:179.4px 179.4px,100% 100%;mask-size:179.4px 179.4px,100% 100%;-webkit-mask-repeat:repeat,no-repeat;mask-repeat:repeat,no-repeat;
  -webkit-mask-composite:source-in;mask-composite:intersect}
/* resting state is the end frame: steel lines, the orange crest already past */
.dio-same-day .sd-arch>i{position:absolute;inset:0;background:linear-gradient(115deg,rgba(76,114,136,.20) 0%,rgba(76,114,136,.20) 30%,rgba(76,114,136,.34) 40%,rgba(237,135,60,.55) 47%,rgba(76,114,136,.30) 54%,rgba(76,114,136,.20) 64%,rgba(76,114,136,.20) 100%);background-size:300% 100%;background-position:0 0}
.dio-same-day .sd-figure.sd-in:not(.sd-still) .sd-arch>i{animation:sd-header-wave 4.4s cubic-bezier(.45,.05,.35,1) .2s 1 both;animation-play-state:var(--sd-play-state,paused)}
@keyframes sd-header-wave{from{background-position:100% 0}to{background-position:0 0}}

.dio-same-day .sd-content{padding:30px 36px 36px}
.dio-same-day .sd-same-day .sd-section-title,.dio-same-day .sd-emergency .sd-section-title{margin:0;font-size:23px;line-height:1.3;font-weight:500;letter-spacing:-.018em}
.dio-same-day .sd-intro{margin:8px 0 14px;color:#526a78;font-size:18px;line-height:1.5;font-weight:400}
.dio-same-day .sd-signs{list-style:none;padding:0;margin:0}
.dio-same-day .sd-signs li{position:relative;margin:0;padding:18px 0 18px 25px;border-top:1px solid #d9e1e5;font-size:21px;line-height:1.45;font-weight:400}
.dio-same-day .sd-signs li:before{content:"";position:absolute;left:0;top:29px;width:7px;height:7px;border-radius:50%;background:var(--sd-steel)}
.dio-same-day .sd-emergency{margin-top:26px;padding:24px 26px;background:#fff1f0;border:2px solid #c43b35}
.dio-same-day .sd-emergency .sd-section-title{font-size:20px;color:#526a78;letter-spacing:-.01em}
.dio-same-day .sd-emergency p{font-size:23px;line-height:1.4;font-weight:500;margin:12px 0 0;letter-spacing:-.015em}
.dio-same-day .sd-figure figcaption{font-size:16px;line-height:1.5;font-weight:400;margin:18px 18px 0;text-align:center;color:#526a78}
@container(max-width:560px){.dio-same-day .sd-stage{clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}.dio-same-day .sd-heading .sd-title{font-size:26px;line-height:1.2;max-width:260px}.dio-same-day .sd-content{padding:25px 26px 28px}.dio-same-day .sd-same-day .sd-section-title{font-size:22px}.dio-same-day .sd-intro{font-size:17px;margin-top:8px;margin-bottom:13px}.dio-same-day .sd-signs li{font-size:19px;padding:17px 0 17px 22px}.dio-same-day .sd-signs li:before{top:27px;width:6px;height:6px}.dio-same-day .sd-emergency{padding:21px 20px;margin-top:23px}.dio-same-day .sd-emergency .sd-section-title{font-size:18px;line-height:1.4}.dio-same-day .sd-emergency p{font-size:21px;line-height:1.4;margin-top:12px}.dio-same-day .sd-desktop-break{display:none}.dio-same-day .sd-figure figcaption{font-size:15px;margin:17px 10px 0}}
@container(max-width:340px){.dio-same-day .sd-heading .sd-title{font-size:25px;max-width:235px}.dio-same-day .sd-content{padding:24px 22px 26px}.dio-same-day .sd-same-day .sd-section-title{font-size:21px}.dio-same-day .sd-signs li{font-size:18px;line-height:1.5;padding-left:20px}.dio-same-day .sd-emergency{padding:19px 17px}.dio-same-day .sd-emergency p{font-size:20px}.dio-same-day .sd-emergency .sd-section-title{font-size:17px}}
@media(prefers-reduced-motion:reduce){.dio-same-day .sd-figure *{animation:none!important;transition:none!important}}
html.reduce-motion .dio-same-day .sd-figure *,html.dio-alive-off .dio-same-day .sd-figure *{animation:none!important;transition:none!important}
@media print{.dio-same-day .sd-stage{clip-path:none}}

.dio-same-day .sd-figure.sd-still .sd-arch>i,html.reduce-motion .dio-same-day .sd-figure .sd-arch>i,html.dio-alive-off .dio-same-day .sd-figure .sd-arch>i{animation:none!important;background-position:0 0}

/* site guards: answer-body rules (section.part p/li, .ans-anim figcaption) must not reach in */
.dio-same-day h3,.dio-same-day h4{font-family:inherit;color:#2f4452;text-transform:none}
.dio-same-day .sd-emergency h4.sd-section-title{color:#526a78}
.dio-same-day .sd-signs li{list-style:none}
.dio-same-day .sd-figure figcaption{padding:0;background:none}
/* Replay / Still view controls restored 2026-11-11 (Daniel: animations get pause or replay; GPT 21:37Z).
   Same look as the where-bar and plan-b controls: one row above the figure, right side, wrapping on narrow widths; real buttons at least 44 px
   tall with a visible focus ring; hidden in print. Every rule is scoped to this widget. */
.dio-same-day .controls{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin:0 0 12px;padding:0;max-width:none}
.dio-same-day .controls[hidden]{display:none}
/* 2026-11-11 audit: the controls take the finish of the site's animation toggle (2px steel border, 6px corners, ink focus ring) so every animation's controls match */
.dio-same-day .controls button{font:500 14px/1.2 'Avenir Next',Avenir,'Nunito Sans',system-ui,sans-serif;min-height:44px;min-width:82px;margin:0;padding:10px 16px;background:#fff;color:#203846;border:2px solid #4c7288;border-radius:6px;cursor:pointer}
.dio-same-day .controls button:hover{background:#f1f5f6}.dio-same-day .controls button:focus-visible{outline:3px solid #203846;outline-offset:2px}.dio-same-day .controls button[aria-pressed=true]{background:#e6edf0}.dio-same-day .controls button:disabled{opacity:.55;cursor:default}
.dio-same-day .sd-status{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media print{.dio-same-day .controls{display:none!important}}
