/* Дизайн-система «Золотой час» — компоненты.
   Зависит только от astro-tokens.css. Ни одного «сырого» цвета: всё через токены,
   поэтому тёмная тема включается автоматически. */

/* ——— корень приложения ——— */
.a-app{
  background:var(--c-bg); color:var(--c-text);
  font-family:var(--font-text); position:relative; isolation:isolate;
  -webkit-font-smoothing:antialiased;
}
.a-app::before{content:"";position:absolute;inset:0;background:var(--aura);pointer-events:none;z-index:-1}

/* ——— шапка ——— */
.a-appbar{
  display:flex;align-items:center;gap:var(--space-5);
  padding:var(--space-5) var(--space-5);
  background:var(--c-glass-chrome);backdrop-filter:blur(var(--blur-chrome));
  -webkit-backdrop-filter:blur(var(--blur-chrome));
  border-bottom:1px solid var(--c-border);
}
@supports not (backdrop-filter:blur(1px)){ .a-appbar{background:var(--c-surface)} }
.a-appbar__id{flex:1;min-width:0}
.a-appbar__name{
  font-family:var(--font-display);font-size:var(--t-title-size);line-height:var(--t-title-lh);
  font-weight:var(--t-title-weight);letter-spacing:var(--t-title-tracking);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.a-appbar__status{
  font-size:var(--t-caption-size);line-height:var(--t-caption-lh);
  color:var(--c-text-3);margin-top:2px;
}

/* ——— аватар ——— */
.a-avatar{border-radius:var(--radius-pill);flex:none;background-size:cover;background-position:50% 50%;
  box-shadow:var(--shadow-gold)}
.a-avatar--sm{width:32px;height:32px}
.a-avatar--md{width:40px;height:40px}
.a-avatar--lg{width:64px;height:64px}
.a-avatar--xl{width:96px;height:96px}

/* ——— лента и сообщения ——— */
.a-thread{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-5)}
.a-msg{max-width:81%;padding:var(--space-4) var(--space-5);font-size:var(--t-body-size);
  line-height:var(--t-body-lh);white-space:pre-line;
  overflow-wrap:anywhere;word-break:break-word;hyphens:auto}
.a-msg--bot{
  align-self:flex-start;background:var(--c-glass);border:1px solid var(--c-glass-border);
  backdrop-filter:blur(var(--blur-glass));-webkit-backdrop-filter:blur(var(--blur-glass));
  border-radius:var(--radius-lg) var(--radius-lg) var(--radius-lg) var(--radius-xs);
  box-shadow:var(--shadow-glass);color:var(--c-text);
}
@supports not (backdrop-filter:blur(1px)){ .a-msg--bot{background:var(--c-surface)} }
.a-msg--user{
  align-self:flex-end;background:var(--gradient-gold);color:var(--c-on-gold);
  border-radius:var(--radius-lg) var(--radius-lg) var(--radius-xs) var(--radius-lg);
  box-shadow:var(--shadow-gold);
}
.a-msg__time{display:block;font-size:var(--t-caption-size);line-height:var(--t-caption-lh);
  letter-spacing:var(--t-caption-tracking);margin-top:var(--space-3);text-align:right;color:var(--c-text-3)}
.a-msg--user .a-msg__time{color:var(--c-on-gold);opacity:.58}

.a-typing{align-self:flex-start;display:flex;gap:var(--space-2);align-items:center;
  padding:var(--space-5);background:var(--c-glass);border:1px solid var(--c-glass-border);
  border-radius:var(--radius-lg) var(--radius-lg) var(--radius-lg) var(--radius-xs);
  backdrop-filter:blur(var(--blur-glass));-webkit-backdrop-filter:blur(var(--blur-glass))}
.a-typing i{width:6px;height:6px;border-radius:var(--radius-pill);background:var(--c-accent);
  animation:a-blink 1.25s infinite ease-in-out}
.a-typing i:nth-child(2){animation-delay:.18s}
.a-typing i:nth-child(3){animation-delay:.36s}
@keyframes a-blink{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-2px)}}
@media (prefers-reduced-motion:reduce){.a-typing i{animation:none;opacity:.5}}

/* ——— карточка ——— */
.a-card{
  background:var(--c-glass);border:1px solid var(--c-glass-border);
  backdrop-filter:blur(var(--blur-glass));-webkit-backdrop-filter:blur(var(--blur-glass));
  border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-card);
}
@supports not (backdrop-filter:blur(1px)){ .a-card{background:var(--c-surface)} }
.a-card__over{font-size:var(--t-overline-size);line-height:var(--t-overline-lh);
  font-weight:var(--t-overline-weight);letter-spacing:var(--t-overline-tracking);
  text-transform:uppercase;color:var(--c-accent);margin-bottom:var(--space-5)}
.a-card__title{font-family:var(--font-display);font-size:var(--t-display-m-size);
  line-height:var(--t-display-m-lh);font-weight:var(--t-display-m-weight);
  letter-spacing:var(--t-display-m-tracking);margin:0}
.a-card__text{font-size:var(--t-body-s-size);line-height:var(--t-body-s-lh);
  color:var(--c-text-2);margin:var(--space-3) 0 0}

/* ——— кнопки ——— */
.a-btn{
  appearance:none;font-family:var(--font-text);font-size:var(--t-label-size);
  font-weight:var(--t-label-weight);letter-spacing:var(--t-label-tracking);
  min-height:var(--tap-comfort);padding:0 var(--space-7);border-radius:var(--radius-pill);
  display:inline-flex;align-items:center;justify-content:center;gap:var(--space-4);
  cursor:pointer;border:1px solid transparent;
  transition:transform var(--motion-fast) var(--motion-ease),
             box-shadow var(--motion-base) var(--motion-ease),
             background var(--motion-base) var(--motion-ease);
}
.a-btn:focus-visible{outline:none;box-shadow:var(--shadow-focus)}
.a-btn:active{transform:scale(.975)}
.a-btn[disabled]{opacity:.42;pointer-events:none}
.a-btn--primary{background:var(--gradient-gold);color:var(--c-on-gold);box-shadow:var(--shadow-gold)}
.a-btn--primary:hover{box-shadow:var(--shadow-lift)}
.a-btn--secondary{background:var(--c-glass);color:var(--c-text);border-color:var(--c-border-2);
  backdrop-filter:blur(var(--blur-glass));-webkit-backdrop-filter:blur(var(--blur-glass))}
.a-btn--secondary:hover{border-color:var(--c-accent)}
.a-btn--ghost{background:transparent;color:var(--c-accent);padding:0 var(--space-5)}
.a-btn--ghost:hover{background:var(--c-accent-quiet)}
@media (prefers-reduced-motion:reduce){.a-btn{transition:none}.a-btn:active{transform:none}}

/* ——— поле ввода и строка отправки ——— */
.a-composer{display:flex;align-items:center;gap:var(--space-5);padding:var(--space-5);
  background:var(--c-glass-chrome);backdrop-filter:blur(var(--blur-chrome));
  -webkit-backdrop-filter:blur(var(--blur-chrome));border-top:1px solid var(--c-border)}
.a-field{
  flex:1;min-width:0;min-height:var(--tap-min);display:flex;align-items:center;
  padding:0 var(--space-6);border-radius:var(--radius-pill);
  background:var(--c-glass);border:1px solid var(--c-border);
  font-family:var(--font-text);font-size:var(--t-body-s-size);color:var(--c-text);
}
.a-field::placeholder,.a-field--empty{color:var(--c-text-3)}
.a-field:focus-within{border-color:var(--c-accent);box-shadow:var(--shadow-focus)}
.a-send{
  width:var(--tap-min);height:var(--tap-min);flex:none;border:0;cursor:pointer;
  border-radius:var(--radius-pill);background:var(--gradient-gold);color:var(--c-on-gold);
  display:grid;place-items:center;box-shadow:var(--shadow-gold);
}
.a-send:focus-visible{outline:none;box-shadow:var(--shadow-focus)}

/* ——— мелкие элементы ——— */
.a-chip{display:inline-flex;align-items:center;gap:var(--space-3);min-height:32px;
  padding:0 var(--space-5);border-radius:var(--radius-pill);background:var(--c-accent-quiet);
  color:var(--c-text-2);font-size:var(--t-caption-size);font-weight:500}
.a-chip--on{background:var(--gradient-gold);color:var(--c-on-gold)}
.a-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;
  padding:0 6px;border-radius:var(--radius-pill);background:var(--gradient-gold);
  color:var(--c-on-gold);font-size:var(--t-caption-size);font-weight:700;
  font-variant-numeric:tabular-nums}
.a-meter{height:5px;border-radius:var(--radius-pill);background:var(--c-accent-quiet);overflow:hidden}
.a-meter > i{display:block;height:100%;border-radius:var(--radius-pill);background:var(--gradient-gold)}
.a-divider{height:1px;background:var(--c-border);border:0;margin:var(--space-6) 0}
.a-row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-5);
  padding:var(--space-4) 0;font-size:var(--t-body-s-size)}
.a-row + .a-row{border-top:1px solid var(--c-border)}
.a-row__k{color:var(--c-text-3)}
.a-row__v{font-weight:600;font-variant-numeric:tabular-nums}

/* ——— состояния ——— */
.a-empty{display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:var(--space-5);padding:var(--space-10) var(--space-6)}
.a-empty__art{width:120px;height:120px;background-size:contain;background-repeat:no-repeat;
  background-position:50% 50%}
.a-empty__title{font-family:var(--font-display);font-size:var(--t-title-size);
  font-weight:var(--t-title-weight);margin:0}
.a-empty__text{font-size:var(--t-body-s-size);line-height:var(--t-body-s-lh);
  color:var(--c-text-2);margin:0;max-width:34ch}
.a-skeleton{border-radius:var(--radius-md);background:var(--c-sunken);position:relative;overflow:hidden}
.a-skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,var(--c-accent-quiet),transparent);
  animation:a-shimmer 1.4s infinite}
@keyframes a-shimmer{100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.a-skeleton::after{animation:none}}