/* ============================================================
   View-specific styles — households, profile, timeline,
   conversations, planner, food library, groceries, AI, analytics.
   ============================================================ */

/* ---------- Status pills (households table, orders) ---------- */

.pill {
  justify-self: start; display: inline-flex; align-items: center; gap: 4px;
  height: 22px; padding: 0 9px; border-radius: 6px;
  font-size: 11px; font-weight: 600; white-space: nowrap;
  background: var(--khadi); border: 1px solid var(--steam); color: var(--mut);
}
.pill--jade   { background: var(--jade-a08); border-color: var(--moss-br); color: var(--jade); }
.pill--moss   { background: var(--moss); border-color: var(--moss-br); color: var(--jade-ink); }
.pill--mirchi { background: rgba(217,72,43,.08); border-color: var(--mirchi); color: var(--mirchi); }
.pill--genda  { background: rgba(242,169,59,.14); border-color: var(--genda); color: #8A5A12; }
.pill--neel   { background: var(--neel-a08); border-color: var(--neel-a30); color: var(--neel); }

:root[data-theme="dark"] .pill--genda { color: var(--genda); }

.kstate { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--mut); }

/* ---------- Filter bar ---------- */

.filterbar { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 14px; }
.filterbar__sort { font-family: var(--mo); font-size: 10px; color: var(--mut2); margin-left: auto; }

/* ---------- Tabs ---------- */

.tabs { display: flex; align-items: center; gap: 20px; border-bottom: 1px solid var(--steam); padding: 0 16px; }
.tab {
  height: 44px; display: flex; align-items: center; font-size: 13px; font-weight: 600;
  color: var(--mut); background: none; border: 0; cursor: pointer; white-space: nowrap;
}
.tab:hover { color: var(--ink); }
.tab.is-on { color: var(--jade); box-shadow: inset 0 -2px 0 0 var(--jade); }

/* ---------- Profile header ---------- */

.profhead { display: flex; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.profhead__name { font-family: var(--gro); font-weight: 700; font-size: 22px; letter-spacing: -.02em; }
.profhead__meta { font-family: var(--mo); font-size: 10.5px; color: var(--mut2); }

.slot {
  display: flex; align-items: center; gap: 12px; padding: 11px 12px;
  background: var(--khadi); border: 1px solid var(--steam); border-radius: var(--r-md);
}
.slot--blocked { background: var(--mirchi-a05); border-color: var(--mirchi-a35); }
.slot__name { font-family: var(--mo); font-size: 9.5px; letter-spacing: .12em; color: var(--mut2); width: 74px; flex: none; }
.slot__dish { font-size: 13.5px; font-weight: 500; flex: 1; min-width: 0; }
.slot--blocked .slot__dish { color: var(--mirchi-ink); }

.member { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--steam); }
.member:last-child { border-bottom: 0; }

/* ---------- Taste graph ---------- */

.taste__legend { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.taste__legend span { display: inline-flex; align-items: center; gap: 5px; font-family: var(--mo); font-size: 9px; letter-spacing: .1em; color: var(--mut2); }
.taste__group { font-family: var(--mo); font-size: 9px; letter-spacing: .14em; color: var(--mut2); margin-bottom: 7px; }
.dishchip {
  height: 28px; padding: 0 12px; border-radius: 99px;
  background: var(--card); border: 1px solid var(--steam);
  font-size: 12px; font-weight: 500; display: inline-flex; align-items: center; cursor: pointer;
}
.dishchip:hover { border-color: var(--sand); }
.dishchip--loved {
  background: var(--jade); color: var(--khadi); border: 1.5px solid var(--jade); font-weight: 600;
}

/* ---------- AI memory ---------- */

.memory { display: flex; flex-direction: column; gap: 6px; padding: 12px 0; border-bottom: 1px dashed var(--steam); }
.memory:last-child { border-bottom: 0; }
.memory__fact { font-size: 13px; font-weight: 600; line-height: 1.35; }
.memory__from { font-family: var(--mo); font-size: 9.5px; color: var(--mut2); }
.memory__acts { display: flex; gap: 12px; padding-top: 2px; }
.linkbtn { font-size: 11px; font-weight: 600; color: var(--jade); background: none; border: 0; padding: 0; cursor: pointer; }
.linkbtn--mut { color: var(--mut); }
.linkbtn--danger { color: var(--mirchi); }

.ministat { display: flex; flex-direction: column; }
.ministat__n { font-family: var(--gro); font-weight: 700; font-size: 15px; }
.ministat__t { font-family: var(--mo); font-size: 8.5px; letter-spacing: .1em; color: var(--mut2); }

.invrow { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px dashed var(--steam); font-size: 12.5px; }
.invrow:last-child { border-bottom: 0; }
.invrow__state { margin-left: auto; font-family: var(--mo); font-size: 9px; font-weight: 700; letter-spacing: .06em; }

/* ---------- Timeline ---------- */

.tl__day { display: flex; flex-direction: column; gap: 12px; }
.tl__dayhead { display: flex; align-items: baseline; gap: 10px; }
.tl__dayname { font-family: var(--gro); font-weight: 700; font-size: 15px; }
.tl__daymeta { font-family: var(--mo); font-size: 9.5px; color: var(--mut2); }
.tl__event { display: flex; gap: 14px; align-items: flex-start; padding: 9px 0; border-bottom: 1px dashed var(--steam); }
.tl__event:last-child { border-bottom: 0; }
.tl__t { font-family: var(--mo); font-size: 10px; color: var(--mut2); width: 42px; flex: none; padding-top: 2px; }
.tl__body { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.tl__what { font-size: 13px; font-weight: 500; }
.tl__event.is-now .tl__what { font-weight: 600; }
.tl__sub { font-family: var(--mo); font-size: 9.5px; color: var(--mut2); }

.kind {
  height: 16px; padding: 0 6px; border-radius: 5px; font-family: var(--mo); font-size: 8.5px;
  letter-spacing: .05em; font-weight: 700; display: inline-flex; align-items: center; flex: none;
}
.kind--AI      { background: rgba(47,59,119,.10); color: var(--neel); }
.kind--COOK    { background: var(--moss); color: var(--jade-ink); }
.kind--STOCK,
.kind--GROCERY { background: rgba(242,169,59,.18); color: #8A5A12; }
.kind--USER    { background: rgba(23,126,99,.12); color: var(--jade-d); }
.kind--ALERT   { background: rgba(217,72,43,.10); color: var(--mirchi); }
:root[data-theme="dark"] .kind--STOCK,
:root[data-theme="dark"] .kind--GROCERY { color: var(--genda); }

.filterrow {
  display: flex; align-items: center; gap: 8px; padding: 6px 0;
  font-size: 12.5px; color: var(--mut); cursor: pointer; background: none; border: 0; width: 100%; text-align: left;
}
.filterrow__n { margin-left: auto; font-family: var(--mo); font-size: 9.5px; color: var(--mut2); }
.jump { font-size: 13px; color: var(--mut); font-weight: 500; padding: 5px 0; background: none; border: 0; cursor: pointer; text-align: left; }
.jump.is-now { color: var(--jade); font-weight: 700; }

.tipcard {
  background: var(--moss); border: 1px solid var(--moss-br); border-radius: var(--r-md); padding: 12px;
  display: flex; flex-direction: column; gap: 5px;
}
.tipcard__t { font-family: var(--mo); font-size: 9px; letter-spacing: .12em; color: var(--jade); }
.tipcard__b { font-size: 11.5px; line-height: 1.45; color: var(--jade-sub); }

/* ---------- Conversations ---------- */

.convo { display: flex; height: min(720px, calc(100dvh - 160px)); min-height: 460px; }
.convo__list { width: 280px; flex: none; border-right: 1px solid var(--steam); display: flex; flex-direction: column; min-height: 0; }
.convo__listhead { padding: 12px; border-bottom: 1px solid var(--steam); display: flex; flex-direction: column; gap: 10px; }
.convo__scroll { overflow-y: auto; flex: 1; min-height: 0; }
.convo__thread { flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.convo__rail { width: 260px; flex: none; border-left: 1px solid var(--steam); overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 16px; }

.chatrow {
  display: flex; align-items: flex-start; gap: 10px; padding: 11px 12px; width: 100%;
  border: 0; border-bottom: 1px solid var(--steam); background: none; cursor: pointer; text-align: left;
}
.chatrow:hover { background: var(--khadi); }
.chatrow.is-on { background: var(--moss); box-shadow: inset 2px 0 0 0 var(--jade); }
.chatrow__body { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.chatrow__prev {
  font-size: 11.5px; color: var(--mut); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.chatrow__time { font-family: var(--mo); font-size: 9px; color: var(--mut2); flex: none; }
.chatrow__unread {
  min-width: 17px; height: 17px; padding: 0 5px; border-radius: 99px; background: var(--jade);
  color: var(--khadi); font-family: var(--mo); font-size: 9px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
}

.thread__head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--steam); }
.thread__body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; background: var(--khadi); }
.thread__date { align-self: center; font-family: var(--mo); font-size: 9px; letter-spacing: .12em; color: var(--mut2); }
.msg { max-width: 76%; display: flex; flex-direction: column; gap: 4px; }
.msg--them { align-self: flex-start; }
.msg--us { align-self: flex-end; align-items: flex-end; }
.msg__bubble {
  padding: 9px 12px; border-radius: 12px; font-size: 13px; line-height: 1.4;
  background: var(--card); border: 1px solid var(--steam);
}
.msg--us .msg__bubble { background: var(--moss); border-color: var(--moss-br); color: var(--jade-ink); }
.msg__time { font-family: var(--mo); font-size: 9px; color: var(--mut2); }
.msg__wave { display: flex; align-items: center; gap: 10px; }
.msg__transcript {
  margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--steam);
  display: flex; flex-direction: column; gap: 4px;
}
.msg__tlabel { font-family: var(--mo); font-size: 8.5px; letter-spacing: .1em; color: var(--mut2); }
.composer {
  display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--steam);
  background: var(--card);
}
.composer input {
  flex: 1; height: 38px; padding: 0 12px; border-radius: 9px; border: 1px solid var(--steam);
  background: var(--khadi); font-family: var(--in); font-size: 12.5px; color: var(--ink); outline: none;
}
.composer input:focus { border-color: var(--jade); }

.rail__label { font-family: var(--mo); font-size: 9px; letter-spacing: .12em; color: var(--mut2); }
.rail__box { display: flex; flex-direction: column; gap: 7px; }
.entrow { display: flex; align-items: center; gap: 8px; }
.entrow__n { font-size: 12.5px; font-weight: 600; flex: 1; }
.menurow { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.menurow__slot {
  width: 18px; height: 18px; border-radius: 5px; background: var(--khadi); border: 1px solid var(--steam);
  font-family: var(--mo); font-size: 9px; font-weight: 700; color: var(--mut2);
  display: inline-flex; align-items: center; justify-content: center; flex: none;
}

/* ---------- Meal planner ---------- */

.week { display: grid; grid-template-columns: 62px repeat(7, 1fr); gap: 8px; }
.week__daycol { display: flex; flex-direction: column; align-items: center; gap: 1px; padding-bottom: 6px; }
.week__d { font-size: 12px; font-weight: 600; }
.week__d.is-today { color: var(--jade); font-weight: 700; }
.week__n { font-family: var(--mo); font-size: 9px; color: var(--mut2); }
.week__slot {
  font-family: var(--mo); font-size: 9px; letter-spacing: .1em; color: var(--mut2);
  display: flex; align-items: center;
}
.cell {
  min-height: 52px; padding: 9px 10px; border-radius: var(--r-md); text-align: left; cursor: pointer;
  background: var(--khadi); border: 1px solid var(--steam); font-size: 12px; font-weight: 500;
  display: flex; align-items: center; line-height: 1.3;
}
.cell:hover { border-color: var(--sand); }
.cell--ok { background: var(--moss); border-color: var(--moss-br); color: var(--jade-ink); }
.cell--pending { background: var(--khadi); border-color: var(--genda-a35); }
.cell--conflict { background: var(--mirchi-a05); border-color: var(--mirchi-a50); color: var(--mirchi); font-weight: 600; }
.cell.is-selected { box-shadow: 0 0 0 2px var(--jade); }

.drawer__when { font-family: var(--mo); font-size: 9px; letter-spacing: .12em; color: var(--mut2); }
.drawer__dish { font-family: var(--gro); font-weight: 700; font-size: 17px; letter-spacing: -.01em; }
.photo-tk {
  display: flex; align-items: center; justify-content: center;
  background: var(--khadi); border: 1px dashed var(--sand); border-radius: var(--r-md);
  font-family: var(--mo); font-size: 9px; color: var(--mut2); text-align: center;
}
.macro { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 7px 10px; background: var(--khadi); border: 1px solid var(--steam); border-radius: 8px; flex: 1; }
.macro__n { font-family: var(--gro); font-weight: 700; font-size: 14px; }
.macro__t { font-family: var(--mo); font-size: 8px; letter-spacing: .08em; color: var(--mut2); }
.why { display: flex; align-items: flex-start; gap: 7px; font-size: 12px; line-height: 1.4; padding: 4px 0; }
.why__mark { font-weight: 700; flex: none; }
.why--ok .why__mark { color: var(--jade); }
.why--no .why__mark { color: var(--mirchi); }
.why--no { color: var(--mirchi-ink); }

/* ---------- Food library ---------- */

.dishcard { display: flex; gap: 18px; align-items: stretch; flex-wrap: wrap; }
.dishcard__name { font-family: var(--gro); font-weight: 700; font-size: 19px; letter-spacing: -.02em; }
.dishcard__aka { font-family: var(--mo); font-size: 10px; color: var(--mut2); }

.step { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-bottom: 1px dashed var(--steam); }
.step:last-child { border-bottom: 0; }
.step__grip { color: var(--sand); font-size: 13px; padding-top: 1px; cursor: grab; }
.step__n {
  width: 20px; height: 20px; border-radius: 6px; background: var(--moss); color: var(--jade-ink);
  font-family: var(--mo); font-size: 10px; font-weight: 700; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
}
.step__body { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.step__text { font-size: 12.5px; line-height: 1.4; }
.media {
  font-family: var(--mo); font-size: 9px; padding: 3px 7px; border-radius: 5px;
  border: 1px dashed var(--sand); color: var(--mut2); background: none; cursor: pointer;
}
.ingrow { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px dashed var(--steam); }
.ingrow:last-child { border-bottom: 0; }
.ingrow__n { font-size: 12px; font-weight: 500; flex: 1; }
.ingrow__q { font-family: var(--mo); font-size: 10px; color: var(--mut2); }

.cluster { display: flex; flex-direction: column; gap: 6px; }
.cluster__label { font-family: var(--mo); font-size: 9px; letter-spacing: .12em; color: var(--mut2); }
.node {
  height: 26px; padding: 0 11px; border-radius: 99px; font-size: 11.5px; font-weight: 500;
  display: inline-flex; align-items: center; background: var(--khadi); border: 1px solid var(--steam);
}
.node--jade  { background: var(--moss); border-color: var(--moss-br); color: var(--jade-ink); }
.node--neel  { background: var(--neel-a08); border-color: var(--neel-a30); color: var(--neel); }
.node--genda { background: rgba(242,169,59,.14); border-color: var(--genda-a35); color: #8A5A12; }
:root[data-theme="dark"] .node--genda { color: var(--genda); }
.node--focus { background: var(--jade); border-color: var(--jade); color: var(--khadi); font-weight: 700; }

/* ---------- Groceries ---------- */

.approw {
  display: flex; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px dashed var(--steam);
}
.approw:last-child { border-bottom: 0; }
.approw__what { font-family: var(--mo); font-size: 9.5px; color: var(--mut2); }
.approw__amt { font-family: var(--gro); font-weight: 700; font-size: 14px; }

.deltarow { display: flex; align-items: center; gap: 10px; }
.deltarow__item { width: 78px; flex: none; font-size: 12px; font-weight: 500; }
.deltarow__change { font-family: var(--mo); font-size: 10px; color: var(--mut2); flex: 1; }
.deltarow__pct { font-family: var(--mo); font-size: 11px; font-weight: 700; }
.up { color: var(--mirchi); }
.down { color: var(--neel); }
.flat { color: var(--mut2); }

.hhrow { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--steam); }
.hhrow:last-child { border-bottom: 0; }
.hhrow__name { font-size: 12.5px; font-weight: 600; width: 68px; flex: none; }
.hhrow__why { font-size: 11px; color: var(--mut); flex: 1; line-height: 1.35; }

.insight {
  display: flex; flex-direction: column; gap: 4px; padding: 11px 12px; margin-top: 4px;
  background: var(--khadi); border: 1px solid var(--steam); border-radius: var(--r-md);
}
.insight__t { font-family: var(--mo); font-size: 9px; letter-spacing: .1em; color: var(--jade); }
.insight__b { font-size: 11.5px; color: var(--mut); line-height: 1.4; }

.heatrow { display: flex; align-items: center; gap: 10px; }
.heatrow__item { width: 74px; flex: none; font-size: 12px; }
.heatrow__track { display: block; flex: 1; height: 20px; border-radius: 5px; background: var(--khadi); overflow: hidden; }
.heatrow__fill { display: block; height: 100%; border-radius: 5px; }
.heatrow__n { font-family: var(--mo); font-size: 10.5px; color: var(--mut2); width: 26px; text-align: right; flex: none; }

.failrow { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px dashed var(--steam); }
.failrow:last-child { border-bottom: 0; }

/* ---------- AI intelligence ---------- */

.confbar { display: flex; align-items: flex-end; gap: 10px; height: 140px; }
.confcol { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; height: 100%; justify-content: flex-end; }
.confcol__pct { font-family: var(--mo); font-size: 10px; font-weight: 700; }
.confcol__bar { display: block; width: 100%; border-radius: 5px 5px 0 0; min-height: 4px; }
.confcol__band { font-family: var(--mo); font-size: 8.5px; color: var(--mut2); }

.failbucket { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px dashed var(--steam); }
.failbucket:last-child { border-bottom: 0; }
.failbucket__n {
  width: 34px; height: 34px; border-radius: 9px; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--gro); font-weight: 700; font-size: 14px;
}
.failbucket__n--mirchi { background: rgba(217,72,43,.10); color: var(--mirchi); }
.failbucket__n--genda  { background: rgba(242,169,59,.18); color: #8A5A12; }
.failbucket__n--neel   { background: var(--neel-a08); color: var(--neel); }
:root[data-theme="dark"] .failbucket__n--genda { color: var(--genda); }

.modelrow { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px dashed var(--steam); }
.modelrow:last-child { border-bottom: 0; }
.ver {
  font-family: var(--mo); font-size: 9px; padding: 1px 5px; border-radius: 4px;
  background: var(--khadi); border: 1px solid var(--steam); color: var(--mut2);
}

.verdict { display: flex; align-items: center; gap: 10px; padding: 9px 0; }
.verdict__label { font-family: var(--mo); font-size: 8.5px; letter-spacing: .1em; color: var(--mut2); width: 96px; flex: none; }

/* ---------- Analytics ---------- */

.bars { display: flex; align-items: flex-end; gap: 10px; height: 150px; padding-top: 8px; }
.bars__col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; justify-content: flex-end; height: 100%; }
.bars__bar { display: block; width: 100%; border-radius: 5px 5px 0 0; }
.bars__lab { font-family: var(--mo); font-size: 8px; color: var(--mut2); }
.bars__lab.is-now { color: var(--jade); font-weight: 700; }

.xaxis { display: flex; justify-content: space-between; font-family: var(--mo); font-size: 9px; color: var(--mut2); }

.trend { display: flex; align-items: center; gap: 10px; }
.trend__name { width: 92px; flex: none; font-size: 12px; }
.trend__track { display: block; flex: 1; height: 14px; border-radius: 4px; background: var(--khadi); overflow: hidden; }
.trend__fill { display: block; height: 100%; border-radius: 4px; }
.trend__pct { font-family: var(--mo); font-size: 10.5px; color: var(--mut2); width: 30px; text-align: right; flex: none; }

.fav { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px dashed var(--steam); }
.fav:last-child { border-bottom: 0; }
.fav__rank {
  width: 18px; height: 18px; border-radius: 5px; background: var(--khadi); border: 1px solid var(--steam);
  font-family: var(--mo); font-size: 9px; color: var(--mut2); flex: none;
  display: inline-flex; align-items: center; justify-content: center;
}
.fav__n { font-family: var(--mo); font-size: 10.5px; color: var(--mut2); }

.verdictcard { display: flex; flex-direction: column; gap: 2px; padding: 12px; border-radius: var(--r-md); }
.verdictcard--good { background: var(--moss); border: 1px solid var(--moss-br); }
.verdictcard--bad  { background: var(--mirchi-a05); border: 1px solid var(--mirchi-a35); }
.verdictcard__l { font-family: var(--mo); font-size: 8.5px; letter-spacing: .1em; color: var(--mut2); }
.verdictcard__d { font-family: var(--gro); font-weight: 700; font-size: 16px; }
.verdictcard--good .verdictcard__d { color: var(--jade-ink); }
.verdictcard--bad .verdictcard__d { color: var(--mirchi); }

/* ---------- Responsive tweaks ---------- */

@media (max-width: 1240px) {
  .convo__rail { display: none; }
}
@media (max-width: 900px) {
  .convo { flex-direction: column; height: auto; }
  .convo__list { width: 100%; border-right: 0; border-bottom: 1px solid var(--steam); max-height: 260px; }
  .convo__thread { min-height: 420px; }
  .week { grid-template-columns: 52px repeat(7, minmax(84px, 1fr)); }
  .week-scroll { overflow-x: auto; }
}

/* ---------- Console sign-in ---------- */

.app--bare .sidebar,
.app--bare .topbar { display: none; }
.app--bare .main { padding: 0; }

.authwrap {
  min-height: 100dvh; display: flex; align-items: center; justify-content: center;
  padding: 24px; background: var(--khadi);
}
.authcard {
  width: 100%; max-width: 380px; padding: 28px;
  background: var(--card); border: 1px solid var(--steam); border-radius: var(--r-xl);
  box-shadow: var(--shadow-pop); display: flex; flex-direction: column; gap: 12px;
}
.authcard__h {
  font-family: var(--gro); font-weight: 700; font-size: 22px; letter-spacing: -.02em; margin: 6px 0 0;
}
.authcard__p { font-size: 13px; line-height: 1.5; color: var(--mut); margin: 0 0 6px; }
.authcard__foot {
  font-family: var(--mo); font-size: 10px; line-height: 1.5; color: var(--mut2); margin: 4px 0 0;
}
.afield { display: flex; flex-direction: column; gap: 5px; }
.afield input {
  height: 38px; padding: 0 12px; border-radius: 9px; width: 100%;
  background: var(--khadi); border: 1px solid var(--steam); color: var(--ink);
  font-family: var(--in); font-size: 13.5px; outline: none;
}
.afield input:focus { border-color: var(--jade); }

.autherr {
  padding: 9px 11px; border-radius: 9px; font-size: 12px; line-height: 1.45;
  background: var(--mirchi-a05); border: 1px solid var(--mirchi-a35); color: var(--mirchi);
}

.bootdots { display: flex; gap: 7px; }
.bootdots i {
  width: 9px; height: 9px; border-radius: 99px; background: var(--sand); display: block;
  animation: kkpulse 1.2s infinite;
}
.bootdots i:nth-child(2) { animation-delay: .15s; }
.bootdots i:nth-child(3) { animation-delay: .3s; }