@font-face{font-family:"Sakura Rounded";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/mplus-rounded-700-sakura-v01.ttf") format("truetype")}
@font-face{font-family:"Sakura Zen";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/zen-kaku-500-sakura-v01.ttf") format("truetype")}
@font-face{font-family:"Sakura Zen";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/zen-kaku-700-sakura-v01.ttf") format("truetype")}
/* The identifier is anchored at the seat, independently of the accepted movie. */
.sakura-id{--id-shift:0px;position:absolute;left:49.4%;top:64.8%;width:min(43vw,520px);aspect-ratio:520/128;z-index:4;transform:translate(calc(-50% + var(--id-shift)),-26%);container-type:inline-size;visibility:hidden;opacity:0;pointer-events:none;filter:drop-shadow(0 3px 9px #004b5c45)}
.sakura-id.is-visible{visibility:visible;opacity:1}
.sakura-id-art{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sakura-id-name{position:absolute;left:28%;right:7%;top:32%;height:43%;margin:0;display:flex;align-items:center;justify-content:center;gap:clamp(12px,3.8cqw,20px);white-space:nowrap;font-family:"Sakura Zen","Hiragino Sans",sans-serif;line-height:1;color:#f1ffff}
.sakura-id-name span{font-size:clamp(17px,5cqw,26px);font-weight:500;letter-spacing:.08em;color:#b8f2ff}
.sakura-id-name strong{font-family:"Sakura Rounded","Hiragino Maru Gothic ProN",sans-serif;font-size:clamp(27px,8.45cqw,44px);font-weight:700;letter-spacing:.1em}
.sakura-id.is-visible .id-ring-base{animation:id-acquire .75s cubic-bezier(.16,.7,.24,1) both;transform-origin:64px 64px;transform-box:view-box}
.sakura-id.is-visible .id-glass{animation:id-deploy .8s cubic-bezier(.18,.78,.22,1) .22s both;transform-origin:100px 64px}
.sakura-id.is-visible .sakura-id-name{animation:id-type .5s ease .65s both}
.sakura-id.is-visible .id-connector{stroke-dasharray:1;animation:id-connect .6s ease both}
.sakura-id.is-visible .id-ring-outer{animation:id-orbit 22s linear infinite;transform-origin:0 0}
.sakura-id.is-visible .id-ring-inner{animation:id-orbit 32s linear infinite reverse;transform-origin:0 0}
.sakura-id.is-visible .id-sweep{animation:id-scan 1s ease .3s both}
@keyframes id-acquire{0%{opacity:0;filter:blur(3px)}35%{opacity:.85}100%{opacity:1;filter:none}}
@keyframes id-deploy{0%{opacity:0;transform:scaleX(.03)}40%{opacity:1}100%{opacity:1;transform:scaleX(1)}}
@keyframes id-type{from{opacity:0;transform:translateX(-7px);filter:blur(2px)}to{opacity:1;transform:none;filter:none}}
@keyframes id-connect{from{stroke-dashoffset:1;opacity:0}to{stroke-dashoffset:0;opacity:1}}
@keyframes id-orbit{to{transform:rotate(360deg)}}
@keyframes id-scan{0%{opacity:0;transform:translateY(0)}20%{opacity:.9}100%{opacity:0;transform:translateY(49px)}}
.sakura-id.is-paused *{animation-play-state:paused!important}
.sakura-id.is-static *{animation:none!important}
.sakura-id.is-static .id-sweep{opacity:0}
.sakura-id-accessible{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0;padding:0;border:0}
@media(max-width:1000px){.sakura-id{width:min(62vw,500px)}}
@media(max-width:600px){.sakura-id{width:calc(100vw - 28px);max-width:390px;top:61.8%;transform:translate(calc(-50% + var(--id-shift)),-26%)}.sakura-id-name{gap:3.4cqw}.sakura-id-name span{font-size:5cqw}.sakura-id-name strong{font-size:8.6cqw}}
@media(prefers-reduced-motion:reduce){.sakura-id *{animation:none!important}.sakura-id .id-sweep{opacity:0}}
