@font-face{font-family:CheckinPixel;src:url('/fonts/handjet-bold.ttf') format('truetype');font-weight:700;font-display:swap}
.hero-checkin{position:absolute;right:0;top:3%;z-index:5;text-align:center;direction:rtl;padding:10px 13px;background:#0b100ce8;border:2px solid #b0ff49;box-shadow:4px 4px 0 #213319;color:#fff;font-family:"IBM Plex Sans Arabic",Tahoma,sans-serif}
.hero-checkin strong{display:block;font-size:32px;line-height:1.1;margin-bottom:8px}.hero-checkin>div{display:flex;gap:8px}.hero-checkin button{font:700 24px "IBM Plex Sans Arabic",Tahoma,sans-serif;min-width:48px;min-height:44px;background:#182414;color:#c1ff72;border:2px solid #83bc43;cursor:pointer}.hero-checkin button:focus-visible{outline:3px solid white;outline-offset:3px}
.motivation-dialog{position:fixed;inset:0;margin:auto;width:min(90vw,680px);max-width:680px;padding:56px 25px;background:#101510;border:3px solid #a8ed50;box-shadow:8px 8px 0 #293d1a;color:#fff;text-align:center;direction:rtl}.motivation-dialog::backdrop{background:#000d;backdrop-filter:blur(5px)}.motivation-dialog p{font:700 clamp(34px,7vw,64px)/1.4 "IBM Plex Sans Arabic",Tahoma,sans-serif;margin:0;text-shadow:3px 3px 0 #555;white-space:normal}.motivation-dialog button{position:absolute;top:8px;left:12px;width:44px;height:44px;color:white;font-size:32px;background:transparent;border:0;cursor:pointer}
.calorie-adjust .cut-minus{color:#ff343e;text-shadow:0 0 5px #ff2533,0 0 13px #ff2533,0 0 24px #ee1428}
.calorie-goal-grid strong{white-space:nowrap;font-size:clamp(20px,5vw,34px)!important}
@media(prefers-reduced-motion:reduce){.logo-showcase.hero-flex-ready>.hero-flex-canvas{display:block!important}.logo-showcase.hero-flex-ready>img{opacity:0}}

.hero-checkin,.hero-checkin strong,.hero-checkin button,.motivation-dialog p{letter-spacing:normal!important;font-variant-ligatures:normal;font-feature-settings:"liga" 1,"calt" 1;word-spacing:normal}
html.hero-flex-enabled .logo-showcase>img{width:100%;max-width:450px;transform:none}
html.hero-flex-enabled .logo-showcase>.hero-pixels-canvas{top:50%;width:100%;max-width:450px;transform:translate(-50%,-50%)}
.hero-return-sprite{display:none;position:absolute;inset:0;margin:auto;width:100%;max-width:450px;aspect-ratio:1;background-image:url('/animation/hero-return-v6.png');background-size:300% 100%;background-repeat:no-repeat;image-rendering:pixelated;mix-blend-mode:screen}
.logo-showcase[data-checkin-state="returning"]>img,.logo-showcase[data-checkin-state="done"]>img{opacity:0}
.logo-showcase[data-checkin-state="returning"]>.hero-return-sprite,.logo-showcase[data-checkin-state="done"]>.hero-return-sprite{display:block}
.hero-checkin{top:auto;bottom:0;right:0}
.logo-showcase>img,.hero-return-sprite{image-rendering:pixelated!important;image-rendering:crisp-edges;filter:none}
.logo-showcase[data-checkin-state="done"]>.hero-return-sprite{background-image:url('/animation/hero-finished-v7.png');background-size:100% 100%;background-position:center!important}
/* Dedicated space below the artwork keeps the question clear of every pose. */
.logo-showcase{margin-bottom:150px!important;overflow:visible!important}
.hero-checkin{top:calc(100% + 14px);bottom:auto;right:0}

.hero-checkin{top:calc(100% + 2px)}
.logo-showcase{margin-bottom:138px!important}

.logo-showcase{margin-top:125px!important;margin-bottom:12px!important}
.hero-checkin{top:auto;bottom:calc(100% + 10px);right:0}
.hero-return-sprite{background-image:url('/animation/hero-return-v15.png');background-size:200% 100%}
.logo-showcase[data-checkin-state="done"]>.hero-return-sprite{background-image:url('/animation/hero-finished-v7.png');background-size:100% 100%}
.hero-curl-canvas{position:absolute;inset:0;margin:auto;width:100%;height:auto;image-rendering:pixelated;mix-blend-mode:screen;pointer-events:none}

/* Shared padded square contains every extended arm pose. */
html.hero-flex-enabled .logo-showcase>img{width:83.333333%;max-width:375px;transform:translate(-5.555556%,-1.851852%)}
.hero-return-sprite{width:83.333333%;max-width:375px;inset:0;transform:translate(-5.555556%,-1.851852%)}
.hero-curl-canvas{width:100%;max-width:450px;aspect-ratio:1}
html.hero-flex-enabled .logo-showcase>.hero-pixels-canvas{width:83.333333%;max-width:375px;transform:translate(-55.555556%,-51.851852%)}

.hero-motto{display:none;position:absolute;top:-112px;left:0;width:100%;height:108px;overflow:hidden;pointer-events:none;--travel-width:450px}
.logo-showcase[data-checkin-state="done"]>.hero-motto{display:block}
.hero-motto-runner{position:absolute;left:100%;top:0;width:max-content;animation:hero-motto-travel 11s linear infinite;will-change:transform}
.hero-motto canvas{display:block;image-rendering:pixelated}
@keyframes hero-motto-travel{from{transform:translateX(0)}to{transform:translateX(calc(-100% - var(--travel-width)))}}
@media(prefers-reduced-motion:reduce){.hero-motto-runner{animation:none;left:50%;transform:translateX(-50%)}.hero-motto canvas{max-width:100%;height:auto!important}}

.hero-motto-runner{left:0;display:flex;direction:ltr;gap:0;animation:hero-motto-loop 7s linear infinite}
.hero-motto-runner canvas{flex:none;max-width:none}
@keyframes hero-motto-loop{from{transform:translateX(0)}to{transform:translateX(calc(-1 * var(--motto-unit)))}}
@media(prefers-reduced-motion:reduce){.hero-motto-runner{animation:none;left:0;transform:none}}

.logo-showcase[data-answer="no"]>.hero-motto{display:block}

.hero-no-message{position:fixed;inset:0;z-index:150;display:flex;align-items:center;justify-content:center;padding:24px;background:#090b09f7;overflow:auto}
.hero-no-message canvas{display:block;max-width:min(100%,520px);image-rendering:pixelated;flex-shrink:1}
