/* Original art stays visible. Only the eye areas use the generated blink frame. */
.arai-actor { position: relative; display: block; width: 100%; aspect-ratio: 1; --eye-left-x: 45.415%; --eye-left-y: 22.01%; --eye-right-x: 54.19%; --eye-right-y: 21.05%; --lid-left-x: 0%; --lid-left-y: 0%; --lid-right-x: 0%; --lid-right-y: 0%; }
.arai-actor[data-arai-pose=it] { --lid-left-x: .399%; --lid-left-y: -.598%; --lid-right-x: .043%; --lid-right-y: -.84%; }
.arai-actor[data-arai-pose=web] { --lid-left-x: .04%; --lid-left-y: -.399%; --lid-right-x: -.156%; --lid-right-y: -.361%; }
.arai-actor[data-arai-pose=photo] { --eye-left-x: 44.737%; --eye-left-y: 23.126%; --eye-right-x: 53.907%; --eye-right-y: 22.329%; --lid-left-x: .399%; --lid-left-y: -.359%; --lid-right-x: -.239%; --lid-right-y: -.319%; }
.arai-actor[data-arai-pose=album] { --eye-left-x: 44.458%; --eye-left-y: 21.411%; --eye-right-x: 53.549%; --eye-right-y: 20.933%; --lid-left-x: .24%; --lid-left-y: -.28%; --lid-right-x: -.279%; --lid-right-y: -.439%; }
.arai-actor .arai-surface { position: absolute; display: block; top: 0; bottom: 0; left: 50%; aspect-ratio: 1; translate: -50% 0; transform-origin: 50% 70%; }
.arai-actor .arai-frame { display: block; position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; border-radius: 0; object-fit: contain; }
.arai-eye-mask,.arai-eyelid { position: absolute; display: block; inset: 0; pointer-events: none; }
.arai-eye-mask { opacity: 0; }
.arai-eye-left { mask-image: radial-gradient(ellipse 2.4% 2% at var(--eye-left-x) var(--eye-left-y), #000 82%, transparent 100%); }
.arai-eye-right { mask-image: radial-gradient(ellipse 2.4% 2% at var(--eye-right-x) var(--eye-right-y), #000 82%, transparent 100%); }
.arai-eyelid { background-position: center; background-size: 100% 100%; background-repeat: no-repeat; }
.arai-eye-left .arai-eyelid { translate: var(--lid-left-x) var(--lid-left-y); }
.arai-eye-right .arai-eyelid { translate: var(--lid-right-x) var(--lid-right-y); }
.arai-actor.is-blinking[data-arai-blink-ready=true] .arai-eye-mask { opacity: 1; }
.journey-character > .arai-actor { height: 100%; }
.mascot-button > .arai-actor { width: 100%; height: auto; }
.route-guide > .arai-actor { position: absolute; width: 150%; height: 115%; max-width: none; left: -25%; top: -3%; }
.route-guide .route-guide-caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 6px; background: var(--tint); color: var(--accent-text); text-align: center; font-size: 11px; }
.arai-actor-portrait { overflow: hidden; background: #f5eddf; border-radius: 16px; }
.arai-actor-portrait > .arai-surface { top: 2px; bottom: auto; height: 205%; }
.arai-launch > .arai-actor { width: 48px; height: 48px; flex: none; border-radius: 50%; }
.arai-launch .arai-surface { height: 240%; top: 0; }
#arai-chat .chat-header { display: grid; grid-template-columns: 92px minmax(0,1fr) 40px; gap: 8px 12px; align-items: center; padding: 14px 16px; }
.chat-header > .arai-actor { grid-column: 1; grid-row: 1 / 3; width: 92px; height: 122px; border-radius: 12px; background: #fff8ed; }
.chat-header .chat-heading { grid-column: 2; grid-row: 1; min-width: 0; }
.chat-header .chat-heading h2 { font-size: 15px; line-height: 1.7; }
.chat-header .chat-heading small { display: block; font-size: 11px; line-height: 1.8; margin-top: 5px; }
.chat-header .chat-close { grid-column: 3; grid-row: 1; padding: 0; width: 40px; height: 44px; border: 0; }
.chat-header .arai-motion-toggle { grid-column: 2 / 4; grid-row: 2; justify-self: start; max-width: 100%; border: 1px solid #d8cbb6; border-radius: 16px; background: #fffaf3; padding: 6px 10px; font-size: 11px; min-height: 34px; line-height: 1.5; color: #526574; }
.arai-motion-toggle:focus-visible { outline: 3px solid #1766a3; outline-offset: 3px; }
.arai-motion-toggle:disabled { opacity: .7; cursor: default; }
#arai-chat .chat-body { max-height: calc(100dvh - 260px); }
@media (max-width: 600px) {
  .arai-launch > .arai-actor { width: 38px; height: 38px; }
}
[data-arai-motion=paused] .journey-character { animation: none !important; }
@media (max-width: 480px) {
  .route-guide > .arai-actor { height: 105%; top: -3%; }
  .route-guide .route-guide-caption { font-size: 9px; }
  #arai-chat .chat-header { grid-template-columns: 76px minmax(0,1fr) 36px; padding: 12px; gap: 8px 10px; }
  .chat-header > .arai-actor { width: 76px; height: 112px; }
  .chat-header .chat-heading h2 { font-size: 14px; }
  .chat-header .chat-close { width: 36px; }
  .chat-header .arai-motion-toggle { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .arai-actor .arai-surface { transform: none !important; }
  .arai-actor .arai-eye-mask { opacity: 0 !important; }
}