/* Generated by npm run build:home-css. Edit auth.css/chatbot.css, then regenerate. */
.header-auth {
  position: relative;
  display: flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
}
.auth-button,
.account-chip {
  min-height: 42px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font: inherit;
  font-size: 12px;
  font-weight: 820;
  white-space: nowrap;
  cursor: pointer;
}
.auth-button--access {
  border: 1px solid rgba(168,69,4,.38);
  background: var(--orange);
  color: var(--ink);
  box-shadow: 0 9px 22px rgba(168,69,4,.18), inset 0 0 0 1px rgba(255,255,255,.24);
  transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.auth-button:hover { transform: translateY(-2px); }
.auth-button--access:hover { background: #ff8b3d; box-shadow: 0 12px 27px rgba(168,69,4,.22), inset 0 0 0 1px rgba(255,255,255,.3); }
.auth-button--access svg { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; transform: translateX(-3px); }
.auth-button:focus-visible,
.account-chip:focus-visible { outline: 3px solid rgba(252,120,31,.45); outline-offset: 2px; }
@media (min-width: 1101px) {
.header-utilities .header-actions .chatbot-trigger,
.header-utilities .header-actions .header-contact {
    width: clamp(108px, 7.2vw, 126px);
    height: 46px;
    min-height: 46px;
    padding-inline: 12px;
    flex: 0 0 clamp(108px, 7.2vw, 126px);
  }
.header-utilities .header-auth .auth-button {
    width: clamp(176px, 9.8vw, 186px);
    height: 46px;
    min-height: 46px;
    padding-inline: 18px;
    flex: 0 0 clamp(176px, 9.8vw, 186px);
  }
}
.account-chip {
  gap: 8px;
  border: 1px solid rgba(22,22,22,.12);
  background: white;
  color: var(--ink);
}
.account-chip > span {
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--orange);
  font-size: 11px;
}
.account-chip > b { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1180px) {
.header-auth { gap: 5px; }
.auth-button { padding-inline: 11px; }
}
@media (max-width: 900px) {
.header-contact {
    width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    margin-left: 0;
    display: inline-flex;
    gap: 0;
    flex: 0 0 44px;
    border-radius: 14px;
  }
.header-contact svg { width: 20px; height: 20px; flex-basis: 20px; }
.header-contact span { display: none; }
.header-auth { margin-left: 0; }
}
@media (max-width: 520px) {
.auth-button,
.account-chip { min-height: 39px; padding-inline: 11px; font-size: 11px; }
.auth-button--access,
.account-chip { width: 44px; height: 44px; min-height: 44px; padding: 0; flex: 0 0 44px; }
.auth-button--access span,
.account-chip b { display: none; }
.auth-button--access svg { transform: none; }
.account-chip b { max-width: 72px; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 380px) {
.account-chip b { display: none; }
.auth-button--access { padding-inline: 10px; }
}
@media (prefers-reduced-motion: reduce) {
.auth-button { transition: none; }
}
.header-actions { display: flex; flex: 0 0 auto; gap: 8px; align-items: center; }
.header-actions .header-contact { margin-left: 0; }
.realviewee-sprite {
  width: 100%;
  aspect-ratio: 418 / 470.5;
  display: block;
  background-image: url('/assets/mascot/realviewee-sprite-v2.webp');
  background-repeat: no-repeat;
  background-size: 400% 200%;
  background-position: 0 0;
}
.realviewee-sprite[data-mascot-state="default"] { background-image: url('/assets/mascot/realviewee-sprite-v1.webp'); background-position: 0 0; }
.realviewee-sprite[data-mascot-state="happy"] { background-position: 0 0; }
.realviewee-sprite[data-mascot-state="curious"] { background-position: 33.333% 0; }
.realviewee-sprite[data-mascot-state="surprised"] { background-position: 66.667% 0; }
.realviewee-sprite[data-mascot-state="confident"] { background-position: 0 100%; }
.realviewee-sprite[data-mascot-state="excited"] { background-position: 33.333% 100%; }
.realviewee-sprite[data-mascot-state="concerned"] { background-position: 66.667% 100%; }
.realviewee-sprite[data-mascot-state="running"] { position: relative; background-image: none; animation: realviewee-run-bob .65s ease-in-out infinite alternate; }
.realviewee-sprite[data-mascot-state="running"]::before,
.realviewee-sprite[data-mascot-state="running"]::after {
  position: absolute;
  inset: 0;
  content: "";
}
.realviewee-sprite[data-mascot-state="running"]::before {
  background: url('/assets/mascot/realviewee-sprite-v2.webp') 100% 100% / 400% 200% no-repeat;
  animation: realviewee-leg-cycle-a 5s steps(1, end) infinite;
}
.realviewee-sprite[data-mascot-state="running"]::after {
  opacity: 0;
  background: url('/assets/mascot/realviewee-running-default-step-b-v2.webp') center bottom / 126% 99% no-repeat;
  animation: realviewee-leg-cycle 5s steps(1, end) infinite;
}
@keyframes realviewee-leg-cycle-a {
  0%, 32.99%, 66%, 100% { opacity: 1; }
  33%, 65.99% { opacity: 0; }
}
@keyframes realviewee-leg-cycle {
  0%, 32.99%, 66%, 100% { opacity: 0; }
  33%, 65.99% { opacity: 1; }
}
@keyframes realviewee-run-bob {
  from { transform: translateY(0) rotate(-1deg); }
  to { transform: translateY(-3px) rotate(1deg); }
}
.realviewee-stage {
  --mascot-width: 142px;
  --mascot-end-gap: 174px;
  position: relative;
  width: min(100%, 820px);
  height: 184px;
  margin: 15px auto 0;
  overflow: visible;
  flex: 0 0 auto;
  isolation: isolate;
  border-radius: 26px;
}
.realviewee-stage::before {
  position: absolute;
  right: 14px;
  bottom: 16px;
  left: 14px;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(22,22,22,.13) 12%, rgba(252,120,31,.28) 50%, rgba(22,22,22,.13) 88%, transparent);
}
.realviewee-stage--home {
  position: relative;
  z-index: 4;
  width: min(100%, 820px);
  height: 169px;
  margin: 30px auto 0;
  background: transparent;
}
.realviewee-stage--home.is-chat-open { z-index: 95; pointer-events: none; }
.realviewee-stage--home.is-chat-open .realviewee-character { pointer-events: auto; }
.realviewee-companion {
  position: absolute;
  z-index: 1;
  bottom: -12px;
  left: 24px;
  width: var(--mascot-width);
  will-change: left;
}
.realviewee-companion.is-patrolling { animation: realviewee-patrol 24s linear infinite; }
.realviewee-companion.is-interacting,
.realviewee-companion.is-chat-open { animation-play-state: paused; }
.realviewee-character {
  position: relative;
  z-index: 1;
  width: var(--mascot-width);
  padding: 0;
  display: block;
  border: 0;
  outline: 0;
  background: transparent;
  cursor: pointer;
  transform: rotate(var(--mascot-lean, 0deg));
  transform-origin: center bottom;
  isolation: isolate;
  transition: transform .2s ease;
}
.realviewee-character::before {
  position: absolute;
  z-index: 0;
  right: 8%;
  bottom: 7%;
  left: 8%;
  height: 68%;
  content: "";
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(252,120,31,.28) 0%, rgba(252,120,31,.13) 46%, rgba(252,120,31,0) 76%);
  filter: blur(12px);
  opacity: 0;
  transform: scale(.84);
  pointer-events: none;
  transition: opacity .2s ease, transform .24s ease;
}
.realviewee-character:hover::before,
.realviewee-character:focus-visible::before { opacity: 1; transform: scale(1); }
.realviewee-character > .realviewee-sprite {
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 10px 12px rgba(35,25,18,.13));
  transition: filter .2s ease;
}
.realviewee-character:hover > .realviewee-sprite,
.realviewee-character:focus-visible > .realviewee-sprite { filter: drop-shadow(0 12px 14px rgba(252,120,31,.18)); }
.realviewee-character:focus-visible { border-radius: 24px; box-shadow: 0 0 0 3px var(--orange); }
.realviewee-state-speech {
  --state-speech-border: rgba(65,65,62,.22);
  position: absolute;
  z-index: 9;
  bottom: calc(100% + 7px);
  left: 50%;
  width: max-content;
  max-width: 218px;
  padding: 7px 13px;
  border: 1px solid var(--state-speech-border);
  border-radius: 12px;
  background: #fff;
  color: #6b6b67;
  box-shadow: 0 4px 12px rgba(0,0,0,.1);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
  white-space: nowrap;
  opacity: 0;
  transform: translate(-50%, 5px) scale(0);
  transform-origin: 50% calc(100% + 7px);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
}
.realviewee-state-speech::after {
  position: absolute;
  bottom: -6px;
  left: var(--state-speech-tail, 50%);
  width: 10px;
  height: 10px;
  content: "";
  border-right: 1px solid var(--state-speech-border);
  border-bottom: 1px solid var(--state-speech-border);
  border-radius: 0 0 2px 0;
  background: #fff;
  transform: translateX(-50%) rotate(45deg);
}
.realviewee-state-speech.is-running {
  --state-speech-tail: 53%;
  left: 70%;
}
.realviewee-state-speech.is-stopped {
  --state-speech-border: rgba(238,77,45,.72);
  color: #EE4D2D;
  font-weight: 700;
}
.realviewee-state-speech.is-visible {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
  transition: opacity .2s ease, transform .32s cubic-bezier(.34,1.56,.64,1);
}
.realviewee-state-speech.is-running.is-visible { animation: realviewee-state-speech-run .65s ease-in-out infinite alternate; }
.realviewee-companion.is-chat-open .realviewee-state-speech { opacity: 0; transform: translate(-50%, 5px) scale(0); }
.realviewee-speech {
  position: absolute;
  z-index: 10;
  bottom: calc(100% + 10px);
  left: -17px;
  width: max-content;
  max-width: 176px;
  padding: 6px 12px;
  border: 1px solid rgba(252,120,31,.3);
  border-radius: 12px;
  background: #fff;
  color: var(--orange-dark);
  box-shadow: 0 4px 12px rgba(0,0,0,.1);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  opacity: 0;
  transform: translateY(8px) scale(.96);
  transform-origin: bottom left;
  pointer-events: none;
  transition: opacity .18s ease, transform .2s ease;
}
.realviewee-speech::after {
  position: absolute;
  bottom: -6px;
  left: 32px;
  width: 10px;
  height: 10px;
  content: "";
  border-right: 1px solid rgba(252,120,31,.3);
  border-bottom: 1px solid rgba(252,120,31,.3);
  background: #fff;
  transform: rotate(45deg);
}
.realviewee-speech.is-visible { opacity: 1; transform: translateY(0) scale(1); animation: realviewee-speech-float 2.8s ease-in-out infinite alternate; }
@keyframes realviewee-state-speech-run {
  from { margin-top: 0; }
  to { margin-top: -2px; }
}
@keyframes realviewee-patrol {
  0% { left: 24px; opacity: 0; }
  2% { left: 24px; opacity: 1; }
  20.833%, 37.5% { left: 31%; opacity: 1; }
  58.333%, 75% { left: 61%; opacity: 1; }
  95.833% { left: calc(100% - var(--mascot-end-gap)); opacity: 1; }
  100% { left: calc(100% - var(--mascot-end-gap)); opacity: 0; }
}
@keyframes realviewee-speech-float {
  from { margin-top: 0; }
  to { margin-top: -3px; }
}
.chatbot-trigger {
  position: relative;
  min-height: 46px;
  padding: 0 16px;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(22, 22, 22, .14);
  border-radius: 999px;
  background: rgba(255, 255, 255, .76);
  color: var(--ink);
  box-shadow: 0 9px 22px rgba(22, 22, 22, .07);
  cursor: pointer;
  font-size: 13px;
  font-weight: 820;
  white-space: nowrap;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.chatbot-trigger:hover,
.chatbot-trigger[aria-expanded="true"] { transform: translateY(-2px); border-color: rgba(252, 120, 31, .62); background: white; }
.chatbot-trigger:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.chatbot-trigger-mascot { position: relative; order: 1; width: 32px; height: 31px; flex: 0 0 32px; overflow: hidden; border-radius: 50%; background: #fff7f1; }
.chatbot-trigger-mascot .realviewee-sprite { position: absolute; top: -1px; left: -4px; width: 40px; }
.chatbot-trigger i { order: 2; width: 5px; height: 5px; flex: 0 0 5px; border: 0; border-radius: 50%; background: #20865a; }
.chatbot-trigger > span:not(.chatbot-trigger-mascot) { order: 3; margin-right: 4px; }
@media (max-width: 1100px) {
.chatbot-trigger { width: 46px; padding: 0; gap: 0; }
.chatbot-trigger > span:not(.chatbot-trigger-mascot) { display: none; margin-right: 0; }
.chatbot-trigger-mascot { display: block; }
.chatbot-trigger i { position: absolute; top: 7px; right: 6px; width: 4px; height: 4px; flex-basis: 4px; box-shadow: 0 0 0 1px #ffffff; }
}
@media (max-width: 1024px) {
.header-actions { margin-left: auto; }
}
@media (max-width: 520px) {
.header-actions { gap: 6px; }
.chatbot-trigger { width: 44px; min-height: 44px; }
.chatbot-trigger i { top: 6px; right: 6px; }
.realviewee-stage {
    --mascot-width: 104px;
    --mascot-end-gap: 132px;
    height: 142px;
    margin-top: 10px;
    border-radius: 20px;
  }
.realviewee-stage--home { height: 136px; margin-top: 16px; }
.realviewee-companion { bottom: -5px; }
.realviewee-state-speech { bottom: calc(100% + 5px); max-width: 196px; padding: 6px 10px; font-size: 10.5px; }
.realviewee-speech { bottom: calc(100% + 8px); left: -14px; max-width: 168px; padding: 6px 10px; font-size: 11px; }
}
@media (max-width: 380px) {
.header-actions { gap: 4px; }
.chatbot-trigger { width: 40px; min-height: 40px; }
.chatbot-trigger-mascot { width: 29px; height: 29px; flex-basis: 29px; }
.chatbot-trigger-mascot .realviewee-sprite { left: -4px; width: 37px; }
}
@media (prefers-reduced-motion: reduce) {
.realviewee-companion.is-patrolling { left: 24px; animation: none; opacity: 1; }
.realviewee-sprite[data-mascot-state="running"],
.realviewee-sprite[data-mascot-state="running"]::before,
.realviewee-sprite[data-mascot-state="running"]::after,
.realviewee-state-speech { animation: none; }
.realviewee-character,
.realviewee-speech,
.realviewee-state-speech { transition: none; }
}
@media (max-width: 700px) {
.realviewee-sprite[data-mascot-state="happy"] {
    background-image: url('/assets/mascot/realviewee-happy-mobile-v1.webp');
    background-position: center;
    background-size: 100% 100%;
  }
.realviewee-sprite[data-mascot-state="default"] {
    background-image: url('/assets/mascot/realviewee-default-mobile-v1.webp');
    background-position: center;
    background-size: 100% 100%;
  }
.realviewee-sprite[data-mascot-state="running"]::before {
    background: url('/assets/mascot/realviewee-running-mobile-v1.webp') center / 100% 100% no-repeat;
  }
}
