#aiSheet{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  height: auto;
  min-height: min(380px, 60vh);
  min-height: min(380px, 60dvh);
  max-height: 78vh;
  max-height: 78dvh;

  background: #ffffff;
  border-radius: 24px 24px 0 0;
  border: 1px solid rgba(255,255,255,0.55);
  z-index: 3100;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding-bottom: var(--sheet-safe-bottom);
  box-sizing: border-box;

  touch-action: pan-y;
  overscroll-behavior: contain;
  -webkit-user-select: none;
  user-select: none;

  isolation: isolate;

  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
  transition: transform 380ms cubic-bezier(.22,.61,.36,1),
              opacity 260ms ease;

  box-shadow: 0 -8px 24px rgba(15,23,42,0.10);
}
#aiSheet::before{
  content: '';
  pointer-events: none;
  position: absolute;
  inset: -1.5px;
  border-radius: inherit;
  padding: 1.5px;
  background: transparent;
  border-top: 1px solid rgba(34,120,255,.28);
  box-sizing: border-box;
  z-index: 0;
  opacity: 1;
}
#aiSheet.open{
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
#aiSheet:not(.open) *,
#aiSheet:not(.open)::before,
#aiSheet:not(.open)::after {
  animation-play-state: paused !important;
}
@media (prefers-reduced-motion: reduce){
  #aiSheet *, #aiSheet::before, #aiSheet::after,
  .as-ai-hello-avatar, .as-ai-hello-avatar * {
    animation: none !important;
  }
}
html.keyboard-open #aiSheet{
  padding-bottom: 0;
}

.ai-sheet-inner{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 0 18px 14px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  overflow-x: hidden;
  min-height: 0;
  touch-action: pan-y;
  box-sizing: border-box;
}

.ai-grab-area{
  flex: 0 0 auto;
  height: 44px;
  margin: 0 -18px 0;
  position: relative;
  box-sizing: border-box;
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}
.ai-grab-area:active{ cursor: grabbing; }
.ai-grab-area .ai-restart{
  position: absolute;
  top: 10px;
  right: 18px;
  width: 30px;
  height: 30px;
  z-index: 2;
}

.ai-topline{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 0 14px;
  flex: 0 0 auto;
}
.ai-brand{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.ai-brand-spark{
  display: inline-flex;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--ai-grad-conic);
  color: #fff;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(34,120,255,.34);
  overflow: hidden;
  position: relative;
}
.ai-brand-text{
  background: var(--ai-grad);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #2278FF;
  font-weight: 800;
}

.ai-spark-eye{
  display: block;
  transform-origin: 50% 50%;
  will-change: transform;
  animation: aiSparkEye 5.6s ease-in-out infinite;
}
.ai-brand-spark .ai-spark-eye{ animation-duration: 5.2s; }
.ai-greeting-avatar .ai-spark-eye{ animation-duration: 6.4s; animation-delay: .3s; }
.ai-message-avatar .ai-spark-eye{ animation-duration: 6.0s; animation-delay: .9s; }
.ai-intent-avatar .ai-spark-eye{ animation-duration: 7.0s; animation-delay: 1.4s; }
.parking-status-spark .ai-spark-eye{ animation-duration: 5.8s; animation-delay: .6s; }

@keyframes aiSparkEye {
  0%,  10% { transform: translate(0, 0); }
  13%      { transform: translate(3px, -1.5px); }
  28%      { transform: translate(3px, -1.5px); }
  31%      { transform: translate(1px, 2.5px); }
  46%      { transform: translate(1px, 2.5px); }
  49%      { transform: translate(-3px, 1px); }
  62%      { transform: translate(-3px, 1px); }
  65%      { transform: translate(-1px, -2.5px); }
  72%      { transform: translate(-1px, -2.5px); }
  74%      { transform: translate(-1px, -2.5px) scaleY(.10); }
  76%      { transform: translate(-1px, -2.5px) scaleY(1); }
  82%      { transform: translate(2.5px, 1.5px); }
  95%      { transform: translate(2.5px, 1.5px); }
  100%     { transform: translate(0, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .ai-spark-eye{ animation: none; }
}

.ai-close{
  width: 30px; height: 30px;
  border-radius: 50%;
  background: rgba(15,23,42,.06);
  border: 0;
  color: #475569;
  font-size: 18px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 160ms ease, transform 120ms ease;
}
.ai-close:hover{ background: rgba(15,23,42,.10); color: #0F172A; }
.ai-close:active{ transform: scale(.92); }

.ai-greeting{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  flex: 0 0 auto;
  margin-bottom: 16px;
  animation: aiFadeIn 440ms ease 60ms backwards;
}
.ai-greeting-avatar{
  width: 28px; height: 28px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--ai-grad-conic);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  margin-top: 2px;
}
.ai-greeting-bubble{
  position: relative;
  padding: 11px 14px;
  background: var(--ai-grad-soft);
  border: 1px solid rgba(34,120,255,.18);
  border-radius: 4px 16px 16px 16px;
  font-size: 15.5px;
  font-weight: 600;
  color: #0F172A;
  letter-spacing: -.015em;
  line-height: 1.35;
  max-width: calc(100% - 44px);
}

@keyframes aiSparkPulse {
  0%, 100% { box-shadow: var(--ai-shadow), 0 0 0 0 rgba(34,120,255,.34); }
  50%      { box-shadow: var(--ai-shadow), 0 0 0 9px rgba(34,120,255,0); }
}

.as-ai-hello-avatar[data-weather="rain"],
.ai-brand-spark[data-weather="rain"]{
  background: linear-gradient(135deg, #5b6fd6 0%, #3b82f6 60%, #2563eb 100%) !important;
  position: relative;
  overflow: hidden;
}
.as-ai-hello-avatar[data-weather="rain"]::before,
.as-ai-hello-avatar[data-weather="rain"]::after,
.ai-brand-spark[data-weather="rain"]::before,
.ai-brand-spark[data-weather="rain"]::after{
  content: '';
  position: absolute;
  width: 2px;
  height: 6px;
  background: rgba(255,255,255,.85);
  border-radius: 1px;
  top: -8px;
  animation: aiWeatherRainDrop 1.1s linear infinite;
}
.as-ai-hello-avatar[data-weather="rain"]::before,
.ai-brand-spark[data-weather="rain"]::before{ left: 30%; animation-delay: 0s; }
.as-ai-hello-avatar[data-weather="rain"]::after,
.ai-brand-spark[data-weather="rain"]::after{ left: 62%; animation-delay: .55s; }

@keyframes aiWeatherRainDrop {
  0%   { transform: translateY(0)    rotate(15deg); opacity: 0; }
  10%  { opacity: 1; }
  85%  { opacity: 1; }
  100% { transform: translateY(38px) rotate(15deg); opacity: 0; }
}

.as-ai-hello-avatar[data-weather="snow"],
.ai-brand-spark[data-weather="snow"]{
  background: linear-gradient(135deg, #94c5ff 0%, #6db4ff 60%, #4f9eff 100%) !important;
  position: relative;
  overflow: hidden;
}
.as-ai-hello-avatar[data-weather="snow"]::before,
.as-ai-hello-avatar[data-weather="snow"]::after,
.ai-brand-spark[data-weather="snow"]::before,
.ai-brand-spark[data-weather="snow"]::after{
  content: '❄';
  position: absolute;
  font-size: 8px;
  color: rgba(255,255,255,.95);
  top: -10px;
  animation: aiWeatherSnowFall 2.4s linear infinite;
}
.as-ai-hello-avatar[data-weather="snow"]::before,
.ai-brand-spark[data-weather="snow"]::before{ left: 22%; animation-delay: 0s; }
.as-ai-hello-avatar[data-weather="snow"]::after,
.ai-brand-spark[data-weather="snow"]::after{ left: 60%; animation-delay: 1.2s; }

@keyframes aiWeatherSnowFall {
  0%   { transform: translateY(0)    translateX(0)   rotate(0deg);   opacity: 0; }
  15%  { opacity: 1; }
  85%  { opacity: 1; }
  100% { transform: translateY(40px) translateX(4px) rotate(220deg); opacity: 0; }
}

.as-ai-hello-avatar[data-weather="sleet"],
.ai-brand-spark[data-weather="sleet"]{
  background: linear-gradient(135deg, #7593c8 0%, #5b7fbf 100%) !important;
  position: relative;
  overflow: hidden;
}
.as-ai-hello-avatar[data-weather="sleet"]::before,
.ai-brand-spark[data-weather="sleet"]::before{
  content: '';
  position: absolute;
  width: 1.5px;
  height: 5px;
  background: rgba(255,255,255,.8);
  border-radius: 1px;
  top: -5px;
  left: 34%;
  animation: aiWeatherRainDrop 1.3s linear infinite;
}
.as-ai-hello-avatar[data-weather="sleet"]::after,
.ai-brand-spark[data-weather="sleet"]::after{
  content: '❄';
  position: absolute;
  font-size: 7px;
  color: rgba(255,255,255,.9);
  top: -9px;
  left: 58%;
  animation: aiWeatherSnowFall 2.6s linear infinite;
  animation-delay: .6s;
}

.as-ai-hello-avatar[data-weather="hot"],
.ai-brand-spark[data-weather="hot"]{
  background: linear-gradient(135deg, #ffb547 0%, #ff7a45 60%, #ef4444 100%) !important;
  animation: aiWeatherHotPulse 1.8s ease-in-out infinite;
}
@keyframes aiWeatherHotPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,.45); }
  50%      { box-shadow: 0 0 0 8px rgba(239,68,68,0); }
}

.as-ai-hello-avatar[data-weather="cold"],
.ai-brand-spark[data-weather="cold"]{
  background: linear-gradient(135deg, #a7d8ff 0%, #5fa8ff 60%, #2563eb 100%) !important;
  animation: aiWeatherColdShiver .9s ease-in-out infinite;
}
@keyframes aiWeatherColdShiver {
  0%, 100% { transform: translateX(0); }
  25%      { transform: translateX(-.6px); }
  75%      { transform: translateX(.6px); }
}

.as-ai-hello-avatar[data-weather="humid"],
.ai-brand-spark[data-weather="humid"]{
  background: linear-gradient(135deg, #6ee7b7 0%, #34d399 60%, #14b8a6 100%) !important;
  position: relative;
  overflow: hidden;
  animation: aiWeatherHumidShimmer 2.6s ease-in-out infinite;
}
@keyframes aiWeatherHumidShimmer {
  0%, 100% { box-shadow: 0 0 4px 0 rgba(20,184,166,.3); }
  50%      { box-shadow: 0 0 11px 2px rgba(20,184,166,.55); }
}
.as-ai-hello-avatar[data-weather="humid"]::before,
.as-ai-hello-avatar[data-weather="humid"]::after,
.ai-brand-spark[data-weather="humid"]::before,
.ai-brand-spark[data-weather="humid"]::after{
  content: '';
  position: absolute;
  bottom: -6px;
  width: 3px;
  height: 3px;
  background: rgba(255,255,255,.7);
  border-radius: 50%;
  animation: aiWeatherHumidVapor 2.8s ease-in infinite;
}
.as-ai-hello-avatar[data-weather="humid"]::before,
.ai-brand-spark[data-weather="humid"]::before{ left: 34%; animation-delay: 0s; }
.as-ai-hello-avatar[data-weather="humid"]::after,
.ai-brand-spark[data-weather="humid"]::after{ left: 60%; animation-delay: 1.4s; }
@keyframes aiWeatherHumidVapor {
  0%   { transform: translateY(0)    scale(.6); opacity: 0; }
  20%  { opacity: .8; }
  80%  { opacity: .5; }
  100% { transform: translateY(-30px) scale(1.3); opacity: 0; }
}

.as-ai-hello-avatar[data-weather="clear"],
.ai-brand-spark[data-weather="clear"]{
  animation: aiWeatherClearGlow 4.2s ease-in-out infinite;
}
@keyframes aiWeatherClearGlow {
  0%, 100% { box-shadow: 0 2px 8px rgba(34,120,255,.34); }
  50%      { box-shadow: 0 2px 8px rgba(34,120,255,.34), 0 0 10px 2px rgba(147,197,253,.55); }
}

@media (prefers-reduced-motion: reduce){
  .as-ai-hello-avatar[data-weather]::before,
  .as-ai-hello-avatar[data-weather]::after,
  .ai-brand-spark[data-weather]::before,
  .ai-brand-spark[data-weather]::after{ animation: none !important; opacity: 0 !important; }
  .as-ai-hello-avatar[data-weather="hot"],
  .as-ai-hello-avatar[data-weather="cold"],
  .as-ai-hello-avatar[data-weather="humid"],
  .as-ai-hello-avatar[data-weather="fog"],
  .as-ai-hello-avatar[data-weather="clear"],
  .ai-brand-spark[data-weather="hot"],
  .ai-brand-spark[data-weather="cold"],
  .ai-brand-spark[data-weather="humid"],
  .ai-brand-spark[data-weather="fog"],
  .ai-brand-spark[data-weather="clear"]{ animation: none !important; }
}
@keyframes aiFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.ai-content{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  margin-bottom: 12px;
  padding: 8px 6px 4px;
  scrollbar-width: none;
  -ms-overflow-style: none;
  touch-action: pan-y;
  -webkit-mask-image: linear-gradient(to bottom,
                        transparent 0,
                        black 20px,
                        black calc(100% - 14px),
                        transparent 100%);
          mask-image: linear-gradient(to bottom,
                        transparent 0,
                        black 20px,
                        black calc(100% - 14px),
                        transparent 100%);
}
.ai-content::-webkit-scrollbar{ display: none; }

.ai-suggestions{
  display: flex;
  flex-direction: column;
}
.ai-suggestions.hidden{ display: none; }

.ai-section{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.ai-section:last-child{ margin-bottom: 0; }
.ai-section-title{
  font-size: 11.5px;
  font-weight: 700;
  color: #64748B;
  letter-spacing: -.01em;
  margin: 0 2px;
}

.ai-ask-sub{
  font-size: 12px;
  color: #94A3B8;
  letter-spacing: -.01em;
  margin: -3px 2px 3px;
}
.ai-ask-chips{
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.ai-ask-chip{
  text-align: left;
  width: 100%;
  padding: 11px 14px;
  border: 1px solid rgba(34,120,255,.16);
  border-radius: 16px;
  background: rgba(34,120,255,.045);
  color: #1E293B;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -.01em;
  cursor: pointer;
  transition: background .15s ease, transform .08s ease;
}
.ai-ask-chip:active{ transform: scale(.985); background: rgba(34,120,255,.10); }

.ai-recent-row{
  display: flex;
  gap: 6px;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 2px;
  margin: 0 -2px;
}
.ai-recent-row::-webkit-scrollbar{ display: none; }
.ai-recent-row{
  touch-action: pan-x;
}
.ai-recent-chip{
  display: inline-flex;
  align-items: center;
  padding: 7px 12px;
  background: var(--ai-grad-soft);
  border: 1px solid rgba(34,120,255,.20);
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 600;
  color: #1E40AF;
  white-space: nowrap;
  cursor: pointer;
  flex: 0 0 auto;
  transition: background 160ms ease, transform 120ms ease, border-color 160ms ease;
  font-family: inherit;
}
.ai-recent-chip:hover{ border-color: rgba(34,120,255,.40); }
.ai-recent-chip:active{ transform: scale(.96); }
.ai-recent-chip{ gap: 4px; max-width: 220px; }
.ai-recent-chip-label{
  display: inline-block;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}

.ai-sheet-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.40);
  opacity: 0;
  pointer-events: none;
  z-index: 3090;
  transition: opacity 280ms ease;
}
.ai-sheet-backdrop.open{
  opacity: 1;
  pointer-events: auto;
}

#actionSheet .as-section{ padding: 0 18px; }
#badges.as-cards{
  margin: 0 -18px;
  padding-left: 18px;
  padding-right: 18px;
}

.as-ai-hello{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 0 0 12px;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: opacity 160ms ease;
}
.as-ai-hello:hover{ opacity: .92; }
.as-ai-hello:active{ opacity: .78; }
.as-ai-hello-avatar{
  width: 28px; height: 28px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--ai-grad-conic);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
  margin-top: 2px;
}
.as-ai-hello-side{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  min-width: 28px;
}
.as-ai-hello-temp{
  font-size: 10.5px;
  font-weight: 800;
  color: #475569;
  letter-spacing: -.02em;
  line-height: 1;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.as-ai-hello-bubble{
  flex: 1 1 auto;
  min-width: 0;
  padding: 11px 14px;
  background: linear-gradient(135deg, rgba(34,120,255,.08), rgba(34,120,255,.10));
  border: 1px solid rgba(34,120,255,.18);
  border-radius: 4px 16px 16px 16px;
  font-size: 15.5px;
  font-weight: 600;
  color: #0F172A;
  letter-spacing: -.015em;
  line-height: 1.35;
  word-break: break-word;
  min-height: 2.7em;
}

.as-ai-composer{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 8px 8px 14px;
  margin: 0 0 12px;
  border: 1.5px solid transparent;
  background:
    linear-gradient(#fff, #fff) padding-box,
    var(--ai-grad) border-box;
  border-radius: 16px;
  cursor: text;
  width: 100%;
  font-family: inherit;
  text-align: left;
  box-shadow: 0 4px 14px rgba(15,23,42,.04);
  transition: box-shadow 200ms ease, transform 140ms ease;
  -webkit-tap-highlight-color: transparent;
}
.as-ai-composer:hover{ box-shadow: 0 4px 14px rgba(15,23,42,.10); }
.as-ai-composer:active{ transform: scale(.992); }
.as-ai-composer-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.as-ai-composer-placeholder{
  flex: 1 1 auto;
  min-width: 0;
  font-size: 15px;
  color: #94A3B8;
  font-weight: 400;
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 6px 0;
}
.as-ai-composer-send{
  width: 36px; height: 36px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--ai-grad);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(15,23,42,.12);
  transition: transform 140ms ease, box-shadow 200ms ease;
}
.as-ai-composer:hover .as-ai-composer-send{
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 4px 10px rgba(15,23,42,.14);
}

.as-unpaid-card{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  margin: 4px 0 20px;
  background: var(--ai-grad);
  border: 0;
  border-radius: 16px;
  color: #fff;
  cursor: pointer;
  width: 100%;
  text-align: left;
  font-family: inherit;
  box-shadow: 0 4px 12px rgba(15,23,42,.10);
  transition: transform 140ms ease, box-shadow 220ms ease;
  -webkit-tap-highlight-color: transparent;
}
.as-unpaid-card:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(15,23,42,.14);
}
.as-unpaid-card:active{ transform: scale(.985); }
.as-unpaid-card-body{
  flex: 1 1 auto;
  min-width: 0;
}
.as-unpaid-card-title{
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.015em;
  margin-bottom: 2px;
}
.as-unpaid-card-sub{
  font-size: 12.5px;
  opacity: .9;
  letter-spacing: -.01em;
}
.as-unpaid-card-arrow{
  font-size: 20px;
  font-weight: 600;
  flex: 0 0 auto;
}

.as-fade-pending{
  opacity: 0 !important;
  transform: translateY(14px);
  pointer-events: none;
  transition: opacity 360ms ease-out,
              transform 360ms cubic-bezier(.22,.61,.36,1);
  will-change: opacity, transform;
}

.as-ai-samples{
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding: 0 4px 12px;
  margin: -4px -4px 8px;
  transition: opacity 480ms ease, transform 480ms ease;
}
.as-ai-samples::-webkit-scrollbar{ display: none; }
.as-ai-samples:empty{ display: none; }

#badges.as-cards:empty{ display: none; }
.as-ai-samples{ display: none; }
.as-sample-chip{
  display: inline-flex;
  align-items: center;
  padding: 7px 12px;
  background: rgba(34,120,255,.08);
  border: 1px solid rgba(34,120,255,.22);
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 500;
  color: #1D4ED8;
  white-space: nowrap;
  cursor: pointer;
  flex: 0 0 auto;
  font-family: inherit;
  letter-spacing: -.01em;
  transition: background 160ms ease, transform 120ms ease, border-color 160ms ease;
}
.as-sample-chip:hover{
  background: rgba(34,120,255,.16);
  border-color: rgba(34,120,255,.35);
}
.as-sample-chip:active{ transform: scale(.96); }

.as-ai-hello-bubble{ transition: opacity 220ms ease; }
.as-ai-hello-bubble.fading{ opacity: 0; }

@keyframes badgeSlideIn {
  from { opacity: 0; transform: translateX(-14px); }
  to   { opacity: 1; transform: translateX(0); }
}
#badges.from-ai .badge {
  animation: badgeSlideIn 380ms cubic-bezier(.22,.61,.36,1) backwards;
}
#badges.from-ai .badge:nth-child(1) { animation-delay: 60ms; }
#badges.from-ai .badge:nth-child(2) { animation-delay: 130ms; }
#badges.from-ai .badge:nth-child(3) { animation-delay: 200ms; }
#badges.from-ai .badge:nth-child(4) { animation-delay: 270ms; }
#badges.from-ai .badge:nth-child(5) { animation-delay: 340ms; }
#badges.from-ai .badge:nth-child(6) { animation-delay: 410ms; }
#badges.from-ai .badge:nth-child(n+7) { animation-delay: 480ms; }

.ai-typing{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 12px 14px !important;
  min-height: 22px;
}
.ai-typing span{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(34,120,255,.55);
  display: inline-block;
  animation: aiTypingDots 1.1s ease-in-out infinite;
}
.ai-typing span:nth-child(2){ animation-delay: .15s; }
.ai-typing span:nth-child(3){ animation-delay: .30s; }
@keyframes aiTypingDots{
  0%, 60%, 100% { transform: translateY(0); opacity: .55; }
  30%           { transform: translateY(-4px); opacity: 1; }
}

.ai-section-head{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin: 0 2px;
}
.ai-section-head .ai-section-title{ margin: 0; }
.ai-section-clear{
  background: transparent;
  border: 0;
  color: #94A3B8;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  padding: 2px 4px;
  font-family: inherit;
  letter-spacing: -.01em;
  transition: color 140ms ease;
}
.ai-section-clear:hover{ color: #2278FF; }

.ai-chip-remove,
.ai-card-remove{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(34,120,255,.12);
  color: #2278FF;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  flex: 0 0 auto;
  transition: background 140ms ease, transform 120ms ease;
  user-select: none;
}
.ai-chip-remove{ margin-left: 4px; }
.ai-card-remove{ margin-left: 6px; margin-right: 2px; }
.ai-chip-remove:hover,
.ai-card-remove:hover{
  background: rgba(34,120,255,.24);
  transform: scale(1.08);
}

.ai-topline-actions{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ai-restart{
  width: 30px; height: 30px;
  border-radius: 50%;
  background: rgba(34,120,255,.10);
  border: 0;
  color: #2278FF;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 200ms ease, transform 280ms ease;
}
.ai-restart:hover{ background: rgba(34,120,255,.18); transform: rotate(-90deg); }
.ai-restart:active{ transform: rotate(-90deg) scale(.92); }

.ai-messages{
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 12px;
  padding-bottom: 4px;
}
.ai-messages:empty{ display: none; }

.ai-message{
  display: flex;
  gap: 8px;
  animation: aiFadeIn 320ms ease;
  max-width: 92%;
}
.ai-message.user{
  align-self: flex-end;
  flex-direction: row-reverse;
  max-width: 80%;
}
.ai-message.ai{
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  width: 100%;
  max-width: 100%;
}
.ai-message-avatar{
  width: 28px; height: 28px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--ai-grad-conic);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
  overflow: hidden;
  position: relative;
}
.ai-message-content{ display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.ai-message-bubble{
  padding: 11px 14px;
  font-size: 14.5px;
  line-height: 1.55;
  letter-spacing: -.01em;
  font-weight: 500;
  word-break: break-word;
  white-space: pre-wrap;
}
.ai-message-bubble.is-streaming::after{
  content: '';
  display: inline-block;
  width: 2px;
  height: 1em;
  margin-left: 1px;
  vertical-align: -2px;
  background: currentColor;
  opacity: .55;
  animation: aiCaretBlink 1s steps(1) infinite;
}
@keyframes aiCaretBlink{ 50%{ opacity: 0; } }
.ai-message.user .ai-message-bubble{
  background: var(--ai-grad);
  color: #fff;
  border-radius: 16px 16px 4px 16px;
  box-shadow: 0 1px 3px rgba(15,23,42,.10);
}
.ai-message.ai .ai-message-bubble{
  background: var(--ai-grad-soft);
  border: 1px solid rgba(34,120,255,.18);
  color: #0F172A;
  border-radius: 4px 16px 16px 16px;
}

.ai-result-cards{
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 87%;
  gap: 10px;
  margin-top: 8px;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding: 2px 2px 6px;
  touch-action: pan-x;
  overscroll-behavior-x: contain;
}
.ai-result-cards::-webkit-scrollbar{ display: none; }

.ai-result-card{
  scroll-snap-align: start;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-height: 112px;
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  padding: 13px 15px;
  cursor: pointer;
  text-align: left;
  min-width: 0;
  box-shadow: 0 2px 10px rgba(15,23,42,.05);
  transition: background 180ms ease, border-color 180ms ease, transform 140ms ease, box-shadow 180ms ease;
}
.ai-result-card:hover{
  background: rgba(248,250,252,.95);
  border-color: rgba(34,120,255,.30);
}
.ai-result-card:active{ transform: scale(.985); }

.ai-result-card-head{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.ai-result-card-name{
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 700;
  font-size: 15px;
  color: #0F172A;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: -.01em;
}
.ai-result-card-meta{
  font-size: 12.5px;
  color: #64748B;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ai-result-card-foot{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
  min-width: 0;
}
.ai-result-card-price{
  color: #2278FF;
  font-weight: 800;
  font-size: 15px;
  flex: 0 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ai-result-card-price.free{ color: #10B981; }
.ai-result-card-price.muted{ color: #94A3B8; font-weight: 600; font-size: 13px; }

.ai-results-hint{
  font-size: 11.5px;
  color: #94A3B8;
  text-align: right;
  margin: 6px 2px 0;
  letter-spacing: -.01em;
}

.ai-results{ margin-top: 8px; }

.ai-cmp-sort{
  display: inline-flex;
  gap: 2px;
  margin: 0 0 8px;
  padding: 2px;
  background: rgba(34,120,255,.06);
  border-radius: 999px;
}
.ai-cmp-sort-btn{
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  color: #64748B;
  padding: 5px 13px;
  border-radius: 999px;
  letter-spacing: -.01em;
  -webkit-tap-highlight-color: transparent;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.ai-cmp-sort-btn.active{
  background: #fff;
  color: #2278FF;
  box-shadow: 0 1px 4px rgba(15,23,42,.10);
}

.ai-cmp-list{ display: flex; flex-direction: column; gap: 8px; }

.ai-result-card.ai-cmp-row{
  flex-direction: row;
  align-items: center;
  min-height: 0;
  gap: 10px;
  padding: 12px 14px;
}
.ai-cmp-idx{
  flex: 0 0 auto;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: #2278FF;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  letter-spacing: -.02em;
  pointer-events: none;
}
.ai-cmp-main{
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.ai-cmp-top{
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex-wrap: wrap;
}
.ai-cmp-name{
  font-weight: 700;
  font-size: 15px;
  color: #0F172A;
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.ai-cmp-badge{
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: 5px;
  letter-spacing: -.01em;
}
.ai-cmp-badge.best-price{ background: rgba(16,185,129,.12); color: #0E9F6E; }
.ai-cmp-badge.best-dist{ background: rgba(34,120,255,.12); color: #2278FF; }

.ai-cmp-stats{
  display: grid;
  grid-template-columns: minmax(66px, auto) 1fr;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.ai-cmp-price{
  color: #2278FF;
  font-weight: 800;
  font-size: 14.5px;
  white-space: nowrap;
}
.ai-cmp-price.free{ color: #10B981; }
.ai-cmp-price.muted{ color: #94A3B8; font-weight: 600; font-size: 12.5px; }
.ai-cmp-dist{
  font-size: 12.5px;
  color: #64748B;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.ai-cmp-actions{
  flex: 0 0 auto;
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.ai-action-wrap{ margin-top: 8px; min-width: 0; }
.ai-action-card{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid rgba(34,120,255,.20);
  border-radius: 16px;
  padding: 12px 14px;
  cursor: pointer;
  text-align: left;
  box-shadow: 0 2px 10px rgba(15,23,42,.05);
  transition: background 160ms ease, border-color 160ms ease, transform 140ms ease;
}
.ai-action-card:hover{ background: rgba(34,120,255,.04); border-color: rgba(34,120,255,.34); }
.ai-action-card:active{ transform: scale(.985); }
.ai-action-card-body{ flex: 1 1 auto; min-width: 0; }
.ai-action-card-title{
  font-weight: 700;
  font-size: 14px;
  color: #0F172A;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: -.01em;
}
.ai-action-card-sub{
  font-size: 12px;
  color: #64748B;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ai-action-card-arrow{
  flex: 0 0 auto;
  color: #2278FF;
  font-weight: 800;
  font-size: 18px;
}
.ai-result-card-pill{
  background: var(--ai-grad);
  color: #fff;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.ai-result-empty{
  font-size: 13.5px;
  color: #64748B;
  margin-top: 4px;
}

.ai-suggestion{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  font-size: 14.5px;
  font-weight: 500;
  color: #0F172A;
  cursor: pointer;
  transition: background 200ms ease, border-color 200ms ease,
              transform 140ms ease, box-shadow 200ms ease;
  text-align: left;
  flex: 0 0 auto;
  animation: aiFadeIn 380ms ease backwards;
}
.ai-suggestion:nth-child(1){ animation-delay: 140ms; }
.ai-suggestion:nth-child(2){ animation-delay: 200ms; }
.ai-suggestion:nth-child(3){ animation-delay: 260ms; }
.ai-suggestion:nth-child(4){ animation-delay: 320ms; }
.ai-suggestion:nth-child(5){ animation-delay: 380ms; }

.ai-followup-chips-row{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px 0 6px 40px;
  animation: aiFadeIn 320ms ease backwards;
}
.ai-place-chips .ai-followup-chip{
  background: linear-gradient(135deg, rgba(34,120,255,.12), rgba(34,120,255,.06));
  border-color: rgba(34,120,255,.28);
  color: #1e40af;
  font-weight: 700;
}
.ai-followup-chip{
  flex: 0 0 auto;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(34,120,255,0.08);
  border: 1px solid rgba(34,120,255,0.18);
  color: #2278FF;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: background 180ms ease, transform 140ms ease;
}
.ai-followup-chip:hover{ background: rgba(34,120,255,0.14); }
.ai-followup-chip:active{ transform: scale(0.96); }

.ai-egg-fill{
  position: absolute; inset: 0;
  border-radius: inherit;
  background: linear-gradient(to top, #d61f1f 0%, #ff5a3c 65%, #ffa24d 100%);
  mix-blend-mode: color;
  clip-path: inset(100% 0 0 0);
  pointer-events: none;
  z-index: 3;
  animation: aiEggFill 2.2s linear 1 forwards;
}
@keyframes aiEggFill{
  0%   { clip-path: inset(100% 0 0 0); opacity: .92; }
  10%  { clip-path: inset(80% 0 0 0); }
  18%  { clip-path: inset(78% 0 0 0); }
  32%  { clip-path: inset(56% 0 0 0); }
  40%  { clip-path: inset(54% 0 0 0); }
  54%  { clip-path: inset(33% 0 0 0); }
  62%  { clip-path: inset(31% 0 0 0); }
  76%  { clip-path: inset(8% 0 0 0); }
  84%  { clip-path: inset(0 0 0 0);  opacity: 1; }
  92%  { clip-path: inset(0 0 0 0);  opacity: 1; }
  100% { clip-path: inset(0 0 0 0);  opacity: 0; }
}
.ai-egg-charge{ animation: aiEggCharge 2.2s ease-in-out 1; transform-origin: 50% 60%; }
@keyframes aiEggCharge{
  0%   { box-shadow: 0 0 0 0 rgba(239,68,68,0);      transform: scale(1); }
  18%  { box-shadow: 0 0 8px 1px rgba(239,68,68,.3);  transform: scale(1.025); }
  40%  { box-shadow: 0 0 12px 2px rgba(239,68,68,.42); transform: scale(1.04); }
  62%  { box-shadow: 0 0 16px 3px rgba(239,68,68,.52); transform: scale(1.055); }
  84%  { box-shadow: 0 0 20px 5px rgba(239,68,68,.65); transform: scale(1.075); }
  100% { box-shadow: 0 0 0 0 rgba(239,68,68,0);      transform: scale(1); }
}
.ai-egg-charge .ai-spark-eye{ animation: aiEggEyeTremble .07s linear infinite !important; }
@keyframes aiEggEyeTremble{
  0%   { transform: translate(.6px, -.4px); }
  25%  { transform: translate(-.5px, .5px); }
  50%  { transform: translate(.4px, .5px); }
  75%  { transform: translate(-.6px, -.3px); }
  100% { transform: translate(.6px, -.4px); }
}

.ai-egg-asleep, .ai-asleep{ filter: grayscale(1); opacity: .45; transition: filter .75s ease-out, opacity .75s ease-out; }
@keyframes aiFallAsleep{ from{ transform: scaleY(1); } to{ transform: scaleY(.08); } }
.ai-egg-asleep .ai-spark-eye, .ai-asleep .ai-spark-eye{
  animation: aiFallAsleep .8s ease-out forwards !important;
  transform-origin: 50% 50%;
}

@keyframes aiEggPop{
  0%{ opacity: 0; transform: translateY(10px) scale(.5); }
  65%{ opacity: 1; transform: translateY(-3px) scale(1.12); }
  100%{ opacity: 1; transform: translateY(0) scale(1); }
}
.ai-egg-chips{ animation: none; }
.ai-egg-chips-done{ opacity: .38; filter: grayscale(.5); pointer-events: none; transition: opacity .3s ease, filter .3s ease; }
.ai-egg-chips-done .ai-followup-chip{ animation: none; opacity: 1; cursor: default; }
.ai-egg-chips .ai-followup-chip{
  opacity: 0;
  animation: aiEggPop .42s cubic-bezier(.2,.9,.3,1.5) forwards;
}
.ai-egg-chips .ai-followup-chip:nth-child(1){ animation-delay: 0s; }
.ai-egg-chips .ai-followup-chip:nth-child(2){ animation-delay: .05s; }
.ai-egg-chips .ai-followup-chip:nth-child(3){ animation-delay: .10s; }
.ai-egg-chips .ai-followup-chip:nth-child(4){ animation-delay: .15s; }
.ai-egg-chips .ai-followup-chip:nth-child(5){ animation-delay: .20s; }
.ai-egg-chips .ai-followup-chip:nth-child(6){ animation-delay: .25s; }
.ai-egg-chips .ai-followup-chip:nth-child(7){ animation-delay: .30s; }
.ai-egg-chips .ai-followup-chip:nth-child(8){ animation-delay: .35s; }

.ai-suggestion:hover{
  background: var(--ai-grad-soft);
  border-color: rgba(34,120,255,.28);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(15,23,42,.08);
}
.ai-suggestion:active{ transform: translateY(0) scale(.985); }

.ai-suggestion-icon{
  font-size: 18px;
  line-height: 1;
  flex: 0 0 auto;
  width: 22px;
  text-align: center;
}
.ai-suggestion-label{
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ai-suggestion-arrow{
  color: rgba(34,120,255,.55);
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  transition: transform 180ms ease;
}
.ai-suggestion:hover .ai-suggestion-arrow{ transform: translateX(2px); }

.ai-composer{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 8px 8px 14px;
  border: 1.5px solid transparent;
  background:
    linear-gradient(#fff, #fff) padding-box,
    var(--ai-grad) border-box;
  border-radius: 16px;
  flex: 0 0 auto;
  transition: box-shadow 200ms ease;
  box-shadow: 0 4px 14px rgba(15,23,42,.04);
}
.ai-composer:focus-within{
  box-shadow: 0 4px 14px rgba(15,23,42,.10);
}
.ai-composer-icon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
#aiInput{
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 15px;
  color: #0F172A;
  font-family: inherit;
  padding: 6px 0;
}
#aiInput::placeholder{ color: #94A3B8; }
#aiInput.ai-input-shake{ animation: aiInputShake .35s cubic-bezier(.36,.07,.19,.97); }
@keyframes aiInputShake{
  10%, 90% { transform: translateX(-1px); }
  20%, 80% { transform: translateX(2px); }
  30%, 50%, 70% { transform: translateX(-3px); }
  40%, 60% { transform: translateX(3px); }
}

.ai-send{
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 0;
  background: #CBD5E1;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 200ms ease, transform 140ms ease, box-shadow 200ms ease;
  flex: 0 0 auto;
}
.ai-send:not(:disabled){
  background: var(--ai-grad);
  box-shadow: var(--ai-shadow);
}
.ai-send:not(:disabled):hover{
  transform: translateY(-1px) scale(1.04);
  box-shadow: var(--ai-shadow-strong);
}
.ai-send:not(:disabled):active{ transform: scale(.94); }
.ai-send:disabled{ cursor: default; opacity: .6; }

#actionSheet.ai-mode{
  transform: translateY(110%);
  opacity: 0;
  pointer-events: none;
  transition: transform 320ms cubic-bezier(.5,0,.75,0), opacity 200ms ease;
}

.ai-intent-sheet{
  position: fixed;
  inset: 0;
  z-index: 5800;
  display: none;
  align-items: flex-end;
  justify-content: center;
  pointer-events: none;
}
.ai-intent-sheet.open{
  display: flex;
  pointer-events: auto;
}
.ai-intent-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(15,23,42,.62);
  opacity: 0;
  transition: opacity 280ms ease;
}
.ai-intent-sheet.open .ai-intent-backdrop{ opacity: 1; }

.ai-intent-card{
  position: relative;
  width: calc(100% - 28px);
  max-width: 420px;
  margin: 0 14px calc(var(--sheet-safe-bottom) + 16px);
  background: #fff;
  border-radius: 24px;
  padding: 20px 18px 16px;
  box-shadow: 0 16px 40px rgba(15,23,42,.20);
  transform: translateY(28px);
  opacity: 0;
  transition: transform 380ms cubic-bezier(.22,.61,.36,1), opacity 240ms ease;
}
.ai-intent-sheet.open .ai-intent-card{
  transform: translateY(-8px);
  opacity: 1;
}

.ai-intent-message{
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
  position: relative;
}
.ai-intent-avatar{
  width: 34px; height: 34px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--ai-grad-conic);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--ai-shadow);
  margin-top: 2px;
  overflow: hidden;
  position: relative;
}
.ai-intent-bubble{
  flex: 1 1 auto;
  padding: 12px 14px;
  background: var(--ai-grad-soft);
  border: 1px solid rgba(34,120,255,.18);
  border-radius: 4px 16px 16px 16px;
  font-size: 14.5px;
  line-height: 1.55;
  color: #0F172A;
  font-weight: 500;
  letter-spacing: -.01em;
}
.ai-intent-bubble strong{
  background: var(--ai-grad);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #2278FF;
  font-weight: 800;
}

.ai-intent-actions{
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
}
.ai-intent-btn{
  width: 100%;
  padding: 13px 14px;
  border-radius: 16px;
  border: 0;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: -.01em;
  cursor: pointer;
  transition: transform 140ms ease, box-shadow 220ms ease, background 200ms ease;
  font-family: inherit;
}
.ai-intent-btn.primary{
  background: var(--ai-grad);
  color: #fff;
  box-shadow: var(--ai-shadow);
}
.ai-intent-btn.primary:hover{
  transform: translateY(-1px);
  box-shadow: var(--ai-shadow-strong);
}
.ai-intent-btn.primary:active{ transform: scale(.98); }
.ai-intent-btn.secondary{
  background: rgba(15,23,42,.06);
  color: #475569;
}
.ai-intent-btn.secondary:hover{
  background: rgba(15,23,42,.10);
  color: #0F172A;
}
.ai-intent-btn.tertiary{
  background: transparent;
  color: #94A3B8;
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 500;
}
.ai-intent-btn.tertiary:hover{
  color: #475569;
  background: rgba(15,23,42,.04);
}

.parking-status-bar{
  position: fixed;
  top: calc(env(safe-area-inset-top, 0px) + 110px);
  left: 14px; right: 14px;
  z-index: 3100;
  display: none;
  align-items: center;
  gap: 10px;
  padding: 10px 12px 10px 10px;
  background: var(--ai-grad);
  border-radius: 16px;
  box-shadow: var(--ai-shadow-strong);
  color: #fff;
  cursor: pointer;
  user-select: none;
  transition: transform 220ms ease, box-shadow 220ms ease;
  -webkit-tap-highlight-color: transparent;
}
.parking-status-bar.show{
  display: flex;
  animation: parkingStatusSlide 380ms cubic-bezier(.22,.61,.36,1);
}
.parking-status-bar.hidden-by-ai{
  display: none !important;
}
.parking-status-bar:hover{
  box-shadow: 0 8px 24px rgba(15,23,42,.16);
}
.parking-status-bar:active{ transform: scale(.985); }

@keyframes parkingStatusSlide{
  from { opacity: 0; transform: translateY(-14px); }
  to   { opacity: 1; transform: translateY(0); }
}

.parking-status-spark{
  width: 30px; height: 30px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
}

.parking-status-content{
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.25;
}
.parking-status-title{
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: -.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.parking-status-sub{
  font-size: 11.5px;
  opacity: .88;
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.parking-status-action{
  flex: 0 0 auto;
  background: rgba(255,255,255,.22);
  color: #fff;
  font-size: 12.5px;
  font-weight: 700;
  padding: 7px 13px;
  border-radius: 999px;
  letter-spacing: -.01em;
}
.parking-status-bar:hover .parking-status-action{ background: rgba(255,255,255,.30); }

.ai-message-time{
  font-size: 11px;
  color: #94A3B8;
  opacity: 0;
  transition: opacity .15s ease;
  margin-top: 2px;
  letter-spacing: -.02em;
  align-self: flex-start;
}
.ai-message.user .ai-message-time{ align-self: flex-end; }
.ai-message:hover .ai-message-time,
.ai-message:focus-within .ai-message-time{ opacity: 1; }

.ai-results-sort{
  font-size: 11.5px;
  color: #64748B;
  margin: 0 0 6px 0;
  padding: 4px 10px;
  background: rgba(34,120,255,.06);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  letter-spacing: -.01em;
  font-weight: 500;
}
.ai-results-sort-arrow{ font-size: 10px; color: #2278FF; }

.ai-result-card-idx{
  position: static;
  flex: 0 0 auto;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: #2278FF;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  letter-spacing: -.02em;
  pointer-events: none;
}

.ai-card-quick-actions{
  display: inline-flex;
  gap: 6px;
  flex: 0 0 auto;
}
.ai-card-quick-btn{
  width: 30px; height: 30px;
  flex: 0 0 auto;
  border-radius: 50%;
  border: 1px solid rgba(34,120,255,.18);
  background: rgba(255,255,255,.95);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}
.ai-card-quick-btn:hover{
  background: rgba(34,120,255,.08);
  border-color: rgba(34,120,255,.32);
}
.ai-card-quick-btn:active{ transform: scale(.92); }
.ai-card-quick-btn.active{ background: rgba(34,120,255,.16); border-color: #2278FF; }

.ai-results-more{
  width: 100%;
  margin-top: 6px;
  padding: 9px 12px;
  border: 1px dashed rgba(34,120,255,.32);
  background: rgba(34,120,255,.04);
  color: #2278FF;
  font-size: 13px;
  font-weight: 600;
  border-radius: 12px;
  cursor: pointer;
  text-align: center;
  letter-spacing: -.01em;
  transition: background .12s ease;
}
.ai-results-more:hover{ background: rgba(34,120,255,.10); }

.ai-active-filters{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 6px 12px;
  margin: 4px 0 8px 0;
}
.ai-active-filter-chip{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: rgba(34,120,255,.10);
  color: #2278FF;
  border: 1px solid rgba(34,120,255,.24);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -.01em;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .12s ease, color .12s ease;
}
.ai-active-filter-chip:hover{ background: rgba(34,120,255,.18); }
.ai-active-filter-chip:active{ transform: scale(.96); }
.ai-active-filter-chip span{ font-size: 13px; opacity: .7; margin-left: 2px; }

.ai-empty-state{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 22px 16px;
  margin: 4px 16px 8px;
  background: linear-gradient(180deg, rgba(34,120,255,.04), rgba(34,120,255,.01));
  border: 1px dashed rgba(34,120,255,.22);
  border-radius: 16px;
  text-align: center;
}
.ai-empty-icon{
  font-size: 32px;
  line-height: 1;
}
.ai-empty-text{
  font-size: 14px;
  font-weight: 600;
  color: #0F172A;
  letter-spacing: -.01em;
}
.ai-empty-hint{
  font-size: 12.5px;
  color: #64748B;
  letter-spacing: -.01em;
}

@media (prefers-reduced-motion: reduce){
  .ai-card-quick-btn,
  .ai-active-filter-chip,
  .ai-results-more{
    transition: none;
  }
}


.as-ai-hello-avatar[data-weather="icy"],
.ai-brand-spark[data-weather="icy"]{
  background: linear-gradient(135deg, #dbeafe 0%, #93c5fd 50%, #3b82f6 100%) !important;
  animation: aiWeatherColdShiver .9s ease-in-out infinite;
  box-shadow: 0 0 0 2px rgba(255,255,255,.45) inset,
              0 2px 8px rgba(59,130,246,.35);
}

.as-ai-hello-avatar[data-weather="heavy_rain"],
.ai-brand-spark[data-weather="heavy_rain"]{
  background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 60%, #172554 100%) !important;
  position: relative;
  overflow: hidden;
}
.as-ai-hello-avatar[data-weather="heavy_rain"]::before,
.as-ai-hello-avatar[data-weather="heavy_rain"]::after,
.ai-brand-spark[data-weather="heavy_rain"]::before,
.ai-brand-spark[data-weather="heavy_rain"]::after{
  content: '';
  position: absolute;
  width: 2px;
  height: 7px;
  background: rgba(255,255,255,.85);
  top: -7px;
  border-radius: 1px;
  animation: aiWeatherRainDrop .65s linear infinite;
}
.as-ai-hello-avatar[data-weather="heavy_rain"]::before,
.ai-brand-spark[data-weather="heavy_rain"]::before{ left: 28%; animation-delay: 0s; }
.as-ai-hello-avatar[data-weather="heavy_rain"]::after,
.ai-brand-spark[data-weather="heavy_rain"]::after{ left: 60%; animation-delay: .3s; }

.as-ai-hello-avatar[data-weather="drizzle"],
.ai-brand-spark[data-weather="drizzle"]{
  background: linear-gradient(135deg, #93c5fd 0%, #60a5fa 100%) !important;
  position: relative;
  overflow: hidden;
}
.as-ai-hello-avatar[data-weather="drizzle"]::before,
.ai-brand-spark[data-weather="drizzle"]::before{
  content: '';
  position: absolute;
  width: 1.5px;
  height: 4px;
  background: rgba(255,255,255,.75);
  top: -4px;
  left: 45%;
  border-radius: 1px;
  animation: aiWeatherRainDrop 1.6s linear infinite;
}

.as-ai-hello-avatar[data-weather="heatwave"],
.ai-brand-spark[data-weather="heatwave"]{
  background: linear-gradient(135deg, #fbbf24 0%, #f97316 40%, #dc2626 100%) !important;
  animation: aiWeatherHotPulse 1.1s ease-in-out infinite;
}

.as-ai-hello-avatar[data-weather="freezing"],
.ai-brand-spark[data-weather="freezing"]{
  background: linear-gradient(135deg, #60a5fa 0%, #1d4ed8 60%, #1e3a8a 100%) !important;
  animation: aiWeatherColdShiver .55s ease-in-out infinite;
}

.as-ai-hello-avatar[data-weather="storm_wind"],
.ai-brand-spark[data-weather="storm_wind"]{
  background: linear-gradient(135deg, #94a3b8 0%, #475569 100%) !important;
  animation: aiWeatherWindSway .7s ease-in-out infinite;
}
@keyframes aiWeatherWindSway {
  0%, 100% { transform: translateX(0) rotate(0); }
  25%      { transform: translateX(-1.5px) rotate(-2deg); }
  75%      { transform: translateX(1.5px) rotate(2deg); }
}

.as-ai-hello-avatar[data-weather="windy"],
.ai-brand-spark[data-weather="windy"]{
  background: linear-gradient(135deg, #cbd5e1 0%, #94a3b8 100%) !important;
  animation: aiWeatherWindSway 1.3s ease-in-out infinite;
}

.as-ai-hello-avatar[data-weather="fog"],
.ai-brand-spark[data-weather="fog"]{
  background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 50%, #94a3b8 100%) !important;
  position: relative;
  overflow: hidden;
  animation: aiWeatherFogGlow 3.2s ease-in-out infinite;
}
@keyframes aiWeatherFogGlow {
  0%, 100% { box-shadow: 0 0 6px 1px rgba(148,163,184,.35); }
  50%      { box-shadow: 0 0 11px 3px rgba(148,163,184,.6); }
}
.as-ai-hello-avatar[data-weather="fog"]::before,
.as-ai-hello-avatar[data-weather="fog"]::after,
.ai-brand-spark[data-weather="fog"]::before,
.ai-brand-spark[data-weather="fog"]::after{
  content: '';
  position: absolute;
  left: -40%;
  width: 180%;
  height: 4px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.85), transparent);
  border-radius: 3px;
  animation: aiWeatherFogDrift 3.6s ease-in-out infinite;
}
.as-ai-hello-avatar[data-weather="fog"]::before,
.ai-brand-spark[data-weather="fog"]::before{ top: 44%; animation-delay: 0s; }
.as-ai-hello-avatar[data-weather="fog"]::after,
.ai-brand-spark[data-weather="fog"]::after{ top: 66%; height: 3px; animation-delay: .9s; animation-duration: 4.4s; }
@keyframes aiWeatherFogDrift {
  0%   { transform: translateX(-18%); opacity: 0; }
  30%  { opacity: .9; }
  70%  { opacity: .9; }
  100% { transform: translateX(18%);  opacity: 0; }
}

@media (prefers-reduced-motion: reduce){
  .as-ai-hello-avatar[data-weather="heavy_rain"]::before,
  .as-ai-hello-avatar[data-weather="heavy_rain"]::after,
  .as-ai-hello-avatar[data-weather="drizzle"]::before,
  .ai-brand-spark[data-weather="heavy_rain"]::before,
  .ai-brand-spark[data-weather="heavy_rain"]::after,
  .ai-brand-spark[data-weather="drizzle"]::before{
    animation: none !important; opacity: 0 !important;
  }
  .as-ai-hello-avatar[data-weather="icy"],
  .as-ai-hello-avatar[data-weather="heatwave"],
  .as-ai-hello-avatar[data-weather="freezing"],
  .as-ai-hello-avatar[data-weather="storm_wind"],
  .as-ai-hello-avatar[data-weather="windy"],
  .ai-brand-spark[data-weather="icy"],
  .ai-brand-spark[data-weather="heatwave"],
  .ai-brand-spark[data-weather="freezing"],
  .ai-brand-spark[data-weather="storm_wind"],
  .ai-brand-spark[data-weather="windy"]{ animation: none !important; }
}

.ai-composer{
  margin-bottom: var(--kb-inset, 0px);
  transition: box-shadow 200ms ease, margin-bottom 160ms ease-out;
}
html.kb-open #aiSheet{
  padding-bottom: 0;
}
html.kb-open #aiSheet{
  max-height: min(calc(78vh + var(--kb-inset, 0px)), calc(100vh - 24px));
}

/* ── AI 답변 평가(👍/👎) ─────────────────────────────────────────────
   프롬프트를 고쳤을 때 좋아졌는지 판단할 유일한 현장 신호. 눈에 띄되
   답변을 방해하지 않도록 흐린 아이콘으로 두고, 누른 뒤에는 잠근다. */
.ai-feedback {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-top: 2px;
  padding-left: 2px;
}
.ai-feedback-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: rgba(15, 23, 42, .32);
  cursor: pointer;
  transition: color .15s ease, background-color .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.ai-feedback-btn:hover { color: rgba(15, 23, 42, .62); background: rgba(15, 23, 42, .05); }
.ai-feedback-btn.is-on { color: #2278FF; }
.ai-feedback.is-done .ai-feedback-btn { cursor: default; }
.ai-feedback.is-done .ai-feedback-btn:not(.is-on) { opacity: .35; }
.ai-feedback.is-done .ai-feedback-btn:hover { background: transparent; }
.ai-feedback-thanks {
  margin-left: 4px;
  font-size: 11px;
  color: rgba(15, 23, 42, .45);
}

/* ── 상담 연결(에스컬레이션) ─────────────────────────────────────────
   AI가 근거로 답하지 못했을 때만 뜬다. 지어내는 대신 사람에게 넘기는 출구. */
.ai-cs-escalate {
  display: flex;
  padding: 0 0 4px 40px;   /* 아바타 폭만큼 들여써 답변과 줄을 맞춘다 */
}
.ai-cs-escalate-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 0 16px;
  border-radius: 12px;
  background: #FEE500;
  color: #191600;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.ai-cs-escalate-btn:active { opacity: .85; }
