/* A small interactive hourglass, reused for milestone warnings and questions. */
.reaper-hourglass{position:relative;display:block;height:100%;aspect-ratio:2/3;filter:drop-shadow(0 9px 12px #000a)}
.reaper-hourglass img,.reaper-hourglass canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.reaper-hourglass canvas{z-index:0}.reaper-hourglass img{z-index:1;object-fit:contain}
.hourglass-cue{position:fixed;z-index:75;width:clamp(82px,10vw,128px);aspect-ratio:2/3;padding:0;border:0;background:none;box-shadow:none;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.hourglass-cue:hover,.hourglass-cue:active{background:none;border:0}.hourglass-cue[hidden]{display:none!important}
.hourglass-art{display:block;height:100%}.hourglass-cue .reaper-hourglass{margin:auto}.hourglass-cue .turning{animation:turnHourglass .55s cubic-bezier(.3,.05,.3,1) both}.hourglass-cue.shaken .hourglass-art{animation:glassShake .42s ease-in-out}
.hourglass-cue[data-kind=question]{z-index:95;width:clamp(82px,12vw,150px);animation:glassQuestion var(--cue-duration,5s) ease-in-out both;transform-origin:50% 50%}
.hourglass-cue[data-kind=milestone]{left:50%;top:50%;width:clamp(145px,23vmin,290px);z-index:94;animation:glassOmen var(--cue-duration,3s) ease-in-out both}
.hourglass-cue[data-kind=milestone]:after{content:'';position:absolute;inset:15%;border:3px solid #f13225;border-radius:50%;box-shadow:0 0 35px #f30,0 0 70px #d00;pointer-events:none;animation:glassBlast var(--cue-duration,3s) ease-out both}
@keyframes turnHourglass{from{transform:rotate(-180deg) scale(.85)}to{transform:rotate(0) scale(1)}}
@keyframes glassAppear{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@keyframes glassOmen{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}18%{opacity:1;transform:translate(-50%,-50%) scale(.85)}70%{opacity:1;transform:translate(-50%,-50%) scale(1.45)}86%{opacity:1;transform:translate(-50%,-50%) scale(1.85);filter:blur(0)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.5);filter:blur(12px)}}
@keyframes glassQuestion{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}12%{opacity:.94;transform:translate(-50%,-50%) scale(.67)}75%{opacity:1;transform:translate(-50%,-50%) scale(1.18)}90%{opacity:1;transform:translate(-50%,-50%) scale(1.42)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.7)}}
@keyframes glassBlast{0%,78%{opacity:0;transform:scale(.2)}88%{opacity:.95;transform:scale(1)}100%{opacity:0;transform:scale(2.7)}}
@keyframes glassShake{0%,100%{transform:rotate(0)}25%{transform:rotate(-11deg)}60%{transform:rotate(9deg)}}
@media(max-width:600px){.hourglass-cue[data-kind=question]{width:clamp(90px,23vw,125px)}.hourglass-cue[data-kind=milestone]{width:clamp(135px,40vw,200px)}}
@media(prefers-reduced-motion:reduce){.hourglass-cue,.hourglass-cue:after,.hourglass-cue .turning,.hourglass-cue.shaken .hourglass-art{animation:none}.hourglass-cue[data-kind=milestone]{transform:translate(-50%,-50%)}}
@media(prefers-reduced-motion:reduce){.hourglass-cue[data-kind=question]{transform:translate(-50%,-50%)}}

.hourglass-cue:focus-visible{outline:2px solid #ae4f37;outline-offset:2px}