/* Kits design system (from the "Kits — Full Redesign" canvas).
   Tokens first, then base, then components. Loaded after style.css, so it
   wins over legacy rules; legacy variables are remapped to these tokens so
   anything still on old classes follows the same palette and theme. */

/* ---------- Tokens ---------- */
:root{
  color-scheme: light;
  --k-font: 'Noto Sans Georgian', 'Noto Sans Armenian', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --k-page: #FFFFFF;        /* page background (design: white) */
  --k-bg: #F8FAFC;          /* band sections, hover fills */
  --k-surface: #FFFFFF;     /* cards, header */
  --k-surface-2: #F1F5F9;   /* hover fills, segmented tracks */
  --k-ink: #0F172A;
  --k-ink-2: #334155;
  --k-soft: #475569;        /* secondary text */
  --k-muted: #64748B;       /* captions, placeholders */
  --k-line: #E2E8F0;
  --k-line-2: #CBD5E1;      /* field borders, card hover */
  --k-line-3: #94A3B8;

  --k-brand: #16A34A;       /* logo, icons, focus */
  --k-primary: #15803D;     /* primary buttons, links */
  --k-on-dark-accent: #86EFAC; /* kicker text on the dark band */
  --k-primary-hover: #166534;
  --k-on-primary: #FFFFFF;
  --k-brand-soft: #DCFCE7;
  --k-brand-soft-2: #F0FDF4;
  --k-brand-soft-ink: #166534;
  --k-dark-btn: #0F172A;
  --k-dark-btn-hover: #1E293B;
  --k-on-dark-btn: #FFFFFF;

  --k-sponsor-bg: #FEF3C7;
  --k-sponsor-ink: #92400E;
  --k-error: #B42318;
  --k-error-bg: #FEF2F2;
  --k-warn: #B45309;
  --k-warn-bg: #FFFBEB;
  --k-info: #1D4ED8;
  --k-info-bg: #EFF6FF;
  --k-star: #B45309;

  --k-r-sm: 8px;
  --k-r: 12px;              /* controls */
  --k-r-card: 16px;
  --k-r-panel: 20px;
  --k-r-xl: 24px;

  --k-shadow-hover: 0 1px 2px rgba(15,23,42,.04), 0 12px 32px -12px rgba(15,23,42,.18);
  --k-shadow-pop: 0 1px 2px rgba(15,23,42,.06), 0 16px 40px -16px rgba(15,23,42,.28);
  --k-focus: 0 0 0 4px rgba(22,163,74,.15);
  --k-scrim: rgba(15,23,42,.48);
  --k-scrim-strong: rgba(15,23,42,.88);

  --k-container: 1200px;
  --k-gutter: clamp(16px, 4vw, 40px);
  --k-ease: cubic-bezier(.2,.7,.2,1);

  /* Legacy variables (style.css) follow the tokens. */
  --accent: var(--k-primary);
  --accent-dark: var(--k-primary-hover);
  --accent-soft: var(--k-brand-soft);
  --accent-error: var(--k-error);
  --accent-success: var(--k-primary);
  --ink: var(--k-ink);
  --ink-soft: var(--k-soft);
  --border: var(--k-line);
  --bg: var(--k-bg);
  --bg-alt: var(--k-surface-2);
  --surface: var(--k-surface);
  --price-ink: var(--k-ink);
  --price-bg: var(--k-brand-soft-2);
  --teal: var(--k-primary);
  --teal-soft: var(--k-brand-soft);
  --violet: var(--k-info);
  --violet-soft: var(--k-info-bg);
  --font-display: var(--k-font);
  --font-body: var(--k-font);
}

/* Dark: chosen explicitly, or "system" on a dark OS (set on <html> by the
   inline script in base.html). */
:root[data-theme="dark"]{
  color-scheme: dark;
  --k-page: #0B1210;
  --k-bg: #0B1210;
  --k-surface: #111A17;
  --k-surface-2: #16201C;
  --k-ink: #ECF2EF;
  --k-ink-2: #C9D3CF;
  --k-soft: #A7B4AE;
  --k-muted: #8A9792;
  --k-line: #1E2A25;
  --k-line-2: #2C3A34;
  --k-line-3: #3B4A44;
  --k-brand: #22C55E;
  --k-primary: #22C55E;
  --k-on-dark-accent: #22C55E;
  --k-primary-hover: #4ADE80;
  --k-on-primary: #052E16;
  --k-brand-soft: #14261D;
  --k-brand-soft-2: #111F18;
  --k-brand-soft-ink: #86EFAC;
  --k-dark-btn: #ECF2EF;
  --k-dark-btn-hover: #FFFFFF;
  --k-on-dark-btn: #0B1210;
  --k-sponsor-bg: #2A2110;
  --k-sponsor-ink: #FBBF24;
  --k-error: #F97066;
  --k-error-bg: #2A1513;
  --k-warn: #FBBF24;
  --k-warn-bg: #2A2110;
  --k-info: #93C5FD;
  --k-info-bg: #13203A;
  --k-star: #FBBF24;
  --k-shadow-hover: 0 12px 32px -12px rgba(0,0,0,.6);
  --k-shadow-pop: 0 16px 40px -16px rgba(0,0,0,.7);
  --k-focus: 0 0 0 4px rgba(34,197,94,.22);
  --k-scrim: rgba(0,0,0,.6);
  --k-scrim-strong: rgba(0,0,0,.9);
}

/* ---------- Base ---------- */
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; font-family:var(--k-font); font-size:16px; line-height:1.5;
  color:var(--k-ink); background:var(--k-page);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
a{ color:var(--k-primary); }
a:hover{ color:var(--k-primary-hover); }
h1,h2,h3,h4{ color:var(--k-ink); text-wrap:balance; }
p{ text-wrap:pretty; }
img{ max-width:100%; }
input::placeholder, textarea::placeholder{ color:var(--k-muted); opacity:1; }
:focus-visible{ outline:2px solid var(--k-brand); outline-offset:2px; }
.k-tnum{ font-variant-numeric:tabular-nums; }
.k-sr{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

.k-skip{
  position:absolute; left:12px; top:-60px; z-index:100; padding:10px 16px; border-radius:var(--k-r);
  background:var(--k-dark-btn); color:var(--k-on-dark-btn); font-weight:600; text-decoration:none;
}
.k-skip:focus{ top:12px; color:var(--k-on-dark-btn); }

.k-container{ width:100%; max-width:calc(var(--k-container) + 2 * var(--k-gutter)); margin:0 auto; padding-left:var(--k-gutter); padding-right:var(--k-gutter); box-sizing:border-box; }
.k-main{ padding-top:clamp(28px, 4vw, 48px); padding-bottom:clamp(48px, 6vw, 88px); }
.k-stack{ display:flex; flex-direction:column; gap:var(--k-gap, 16px); }
.k-row{ display:flex; align-items:center; gap:var(--k-gap, 12px); flex-wrap:wrap; }
.k-spacer{ flex:1 1 auto; }

/* ---------- Type ---------- */
.k-h1{ margin:0; font-size:clamp(30px, 4.2vw, 44px); line-height:1.12; letter-spacing:-.02em; font-weight:700; }
.k-h2{ margin:0; font-size:clamp(24px, 2.8vw, 30px); line-height:1.2; letter-spacing:-.02em; font-weight:700; }
.k-h3{ margin:0; font-size:20px; line-height:1.3; letter-spacing:-.01em; font-weight:600; }
.k-h4{ margin:0; font-size:17px; line-height:1.35; font-weight:600; }
.k-lead{ margin:0; font-size:17px; line-height:1.6; color:var(--k-soft); max-width:62ch; }
.k-text{ margin:0; color:var(--k-soft); }
.k-small{ font-size:14px; }
.k-caption{ font-size:13px; color:var(--k-muted); }
.k-muted{ color:var(--k-muted); }
.k-soft{ color:var(--k-soft); }
.k-link{ text-decoration:none; font-weight:600; }
.k-link:hover{ text-decoration:underline; }
.k-crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:14px; color:var(--k-muted); }
.k-crumbs a{ color:var(--k-soft); text-decoration:none; }
.k-crumbs a:hover{ color:var(--k-ink); text-decoration:underline; }

/* ---------- Buttons ---------- */
.k-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:48px; padding:0 20px; box-sizing:border-box; border-radius:var(--k-r);
  border:1px solid transparent; background:transparent; color:var(--k-ink);
  font:inherit; font-size:15px; font-weight:600; line-height:1; white-space:nowrap;
  text-decoration:none; cursor:pointer;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .2s ease, transform .1s ease;
}
.k-btn:active{ transform:translateY(1px); }
.k-btn:disabled, .k-btn[aria-disabled="true"]{ opacity:.55; cursor:not-allowed; transform:none; }
.k-btn--primary{ background:var(--k-primary); color:var(--k-on-primary); }
.k-btn--primary:hover{ background:var(--k-primary-hover); color:var(--k-on-primary); }
.k-btn--dark{ background:var(--k-dark-btn); color:var(--k-on-dark-btn); }
.k-btn--dark:hover{ background:var(--k-dark-btn-hover); color:var(--k-on-dark-btn); }
.k-btn--secondary{ background:var(--k-surface); border-color:var(--k-line-2); color:var(--k-ink); }
.k-btn--secondary:hover{ background:var(--k-bg); border-color:var(--k-line-3); color:var(--k-ink); }
.k-btn--ghost{ color:var(--k-ink); }
.k-btn--ghost:hover{ background:var(--k-surface-2); color:var(--k-ink); }
.k-btn--danger{ background:var(--k-surface); border-color:var(--k-line-2); color:var(--k-error); }
.k-btn--danger:hover{ background:var(--k-error-bg); border-color:var(--k-error); color:var(--k-error); }
.k-btn--sm{ height:40px; padding:0 14px; font-size:14px; border-radius:10px; }
.k-btn--md{ height:44px; padding:0 16px; }
.k-btn--block{ display:flex; width:100%; }
.k-icon-btn{
  display:inline-flex; align-items:center; justify-content:center; position:relative;
  width:44px; height:44px; padding:0; border:0; border-radius:var(--k-r); background:transparent;
  color:var(--k-soft); cursor:pointer; text-decoration:none;
  transition:background-color .15s ease, color .15s ease;
}
.k-icon-btn:hover{ background:var(--k-surface-2); color:var(--k-ink); }
.k-icon-btn--danger:hover{ background:var(--k-error-bg); color:var(--k-error); }
.k-count{
  position:absolute; top:5px; right:3px; min-width:18px; height:18px; padding:0 5px; box-sizing:border-box;
  border-radius:999px; background:var(--k-primary); color:var(--k-on-primary);
  font-size:11px; font-weight:700; line-height:18px; text-align:center; box-shadow:0 0 0 2px var(--k-surface);
}
.k-count[hidden]{ display:none; }

/* ---------- Fields ---------- */
.k-field{ display:flex; flex-direction:column; gap:8px; }
.k-label{ font-size:14px; font-weight:600; color:var(--k-ink); }
.k-help{ font-size:13px; color:var(--k-muted); }
.k-error-text{ font-size:13px; color:var(--k-error); }
.k-input, .k-select, .k-textarea,
.k-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
.k-field select, .k-field textarea{
  width:100%; box-sizing:border-box; min-height:48px; padding:0 14px;
  border:1px solid var(--k-line-2); border-radius:var(--k-r); background:var(--k-surface); color:var(--k-ink);
  font:inherit; font-size:16px;
  transition:border-color .15s ease, box-shadow .2s ease;
}
.k-textarea, .k-field textarea{ padding:12px 14px; min-height:120px; line-height:1.5; resize:vertical; }
.k-input:focus, .k-select:focus, .k-textarea:focus,
.k-field input:focus, .k-field select:focus, .k-field textarea:focus{
  outline:none; border-color:var(--k-brand); box-shadow:var(--k-focus);
}
.k-input[aria-invalid="true"], .k-field.has-error input, .k-field.has-error select, .k-field.has-error textarea{ border-color:var(--k-error); }
.k-check{ display:flex; align-items:flex-start; gap:10px; min-height:44px; font-size:15px; color:var(--k-ink); cursor:pointer; }
.k-check input{ width:20px; height:20px; margin:2px 0 0; accent-color:var(--k-primary); flex:none; }

/* ---------- Surfaces ---------- */
.k-card{
  background:var(--k-surface); border:1px solid var(--k-line); border-radius:var(--k-r-card);
  transition:border-color .15s ease, box-shadow .2s ease;
}
.k-card--pad{ padding:clamp(20px, 3vw, 28px); }
.k-card--link{ display:block; color:inherit; text-decoration:none; }
.k-card--link:hover, .k-card--hover:hover{ border-color:var(--k-line-2); box-shadow:var(--k-shadow-hover); color:inherit; }
.k-panel{ background:var(--k-surface); border:1px solid var(--k-line); border-radius:var(--k-r-panel); padding:clamp(24px, 4vw, 40px); }
.k-band{ background:var(--k-surface); border-top:1px solid var(--k-line); border-bottom:1px solid var(--k-line); }
.k-divider{ height:1px; background:var(--k-line); border:0; margin:0; }

/* ---------- Chips, badges ---------- */
.k-chip{
  display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 16px; box-sizing:border-box;
  border-radius:999px; border:1px solid var(--k-line-2); background:var(--k-surface); color:var(--k-ink-2);
  font:inherit; font-size:15px; font-weight:500; white-space:nowrap; text-decoration:none; cursor:pointer;
  transition:border-color .15s ease, color .15s ease, background-color .15s ease;
}
.k-chip:hover{ border-color:var(--k-line-3); color:var(--k-ink); }
.k-chip.is-active, .k-chip[aria-pressed="true"], .k-chip[aria-current="page"]{ background:var(--k-dark-btn); border-color:var(--k-dark-btn); color:var(--k-on-dark-btn); font-weight:600; }
.k-chip--sm{ height:36px; padding:0 12px; font-size:14px; }
.k-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.k-chips--scroll{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
.k-chips--scroll::-webkit-scrollbar{ display:none; }

.k-badge{
  display:inline-flex; align-items:center; gap:6px; height:24px; padding:0 9px; box-sizing:border-box;
  border-radius:999px; background:var(--k-surface-2); color:var(--k-ink-2);
  font-size:12px; font-weight:600; line-height:1; white-space:nowrap;
}
.k-badge--brand{ background:var(--k-brand-soft); color:var(--k-brand-soft-ink); }
.k-badge--sponsored{ background:var(--k-sponsor-bg); color:var(--k-sponsor-ink); }
.k-badge--warn{ background:var(--k-warn-bg); color:var(--k-warn); }
.k-badge--error{ background:var(--k-error-bg); color:var(--k-error); }
.k-badge--info{ background:var(--k-info-bg); color:var(--k-info); }
.k-badge--outline{ background:transparent; border:1px solid var(--k-line-2); color:var(--k-soft); }

/* ---------- Alerts ---------- */
.k-alert{ display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border-radius:var(--k-r); font-size:14px; background:var(--k-surface-2); color:var(--k-ink-2); }
.k-alert svg{ flex:none; margin-top:1px; }
.k-alert--error{ background:var(--k-error-bg); color:var(--k-error); }
.k-alert--warn{ background:var(--k-warn-bg); color:var(--k-warn); }
.k-alert--info{ background:var(--k-info-bg); color:var(--k-info); }
.k-alert--success{ background:var(--k-brand-soft-2); color:var(--k-brand-soft-ink); border:1px solid var(--k-brand-soft); }

/* ---------- Avatar ---------- */
.k-avatar{
  display:inline-flex; align-items:center; justify-content:center; flex:none; overflow:hidden;
  width:40px; height:40px; border-radius:50%; background:var(--k-dark-btn); color:var(--k-on-dark-btn);
  font-size:14px; font-weight:600;
}
.k-avatar img{ width:100%; height:100%; object-fit:cover; }
.k-avatar--sm{ width:32px; height:32px; font-size:12px; }
.k-avatar--lg{ width:64px; height:64px; font-size:20px; }
.k-avatar--xl{ width:96px; height:96px; font-size:28px; }

/* ---------- Empty state ---------- */
.k-empty{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; padding:clamp(24px, 4vw, 40px); border:1px dashed var(--k-line-2); border-radius:var(--k-r-card); background:var(--k-surface); }
.k-empty__icon{ width:48px; height:48px; border-radius:14px; background:var(--k-surface-2); color:var(--k-ink-2); display:flex; align-items:center; justify-content:center; }
.k-empty__title{ margin:0; font-size:18px; font-weight:600; color:var(--k-ink); }
.k-empty__text{ margin:0; color:var(--k-soft); max-width:56ch; }

/* ---------- Popover / menus ---------- */
.k-pop{ position:relative; }
.k-menu{
  position:absolute; top:calc(100% + 8px); right:0; z-index:40; min-width:220px; padding:6px;
  background:var(--k-surface); border:1px solid var(--k-line); border-radius:var(--k-r-card); box-shadow:var(--k-shadow-pop);
  display:none;
}
.k-menu.open{ display:block; }
.k-menu--left{ right:auto; left:0; }
.k-menu__item{
  display:flex; align-items:center; gap:10px; width:100%; min-height:40px; padding:0 12px; box-sizing:border-box;
  border:0; border-radius:10px; background:transparent; color:var(--k-ink); font:inherit; font-size:14px; font-weight:500;
  text-align:left; text-decoration:none; cursor:pointer;
}
.k-menu__item:hover{ background:var(--k-surface-2); color:var(--k-ink); }
.k-menu__item.active, .k-menu__item[aria-checked="true"]{ color:var(--k-primary); font-weight:600; }
.k-menu__item--danger{ color:var(--k-error); }
.k-menu__label{ padding:8px 12px 4px; font-size:12px; font-weight:600; color:var(--k-muted); }
.k-menu__sep{ height:1px; margin:6px 4px; background:var(--k-line); }
.k-menu__toggle{ justify-content:space-between; }
.k-switch{ position:relative; flex:none; width:32px; height:18px; border-radius:999px; background:var(--k-line-2); transition:background .15s ease; }
.k-switch::after{ content:""; position:absolute; top:2px; left:2px; width:14px; height:14px; border-radius:50%; background:var(--k-surface); box-shadow:0 1px 2px rgba(0,0,0,.2); transition:transform .15s ease; }
/* The label names the mode the click switches to, so the switch shows off. */
.k-menu__toggle:hover > .k-switch{ background:var(--k-primary); }
.k-seg{ display:flex; gap:4px; padding:4px; background:var(--k-surface-2); border-radius:var(--k-r); }
.k-seg > *{ flex:1 1 0; min-width:0; height:40px; border:0; border-radius:9px; background:transparent; color:var(--k-soft); font:inherit; font-size:14px; font-weight:500; cursor:pointer; white-space:nowrap; }
.k-seg > .active, .k-seg > [aria-checked="true"]{ background:var(--k-surface); color:var(--k-ink); font-weight:600; box-shadow:0 1px 2px rgba(15,23,42,.08), 0 1px 3px rgba(15,23,42,.06); }

/* ---------- Header ---------- */
.k-header{ position:sticky; top:0; z-index:30; background:var(--k-surface); border-bottom:1px solid var(--k-line); }
.k-header.is-raised{ box-shadow:0 8px 24px -18px rgba(15,23,42,.35); }
.k-header__in{ display:flex; align-items:center; gap:24px; min-height:68px; }
.k-logo{ display:inline-flex; align-items:center; gap:6px; color:var(--k-ink); text-decoration:none; }
.k-logo:hover{ color:var(--k-ink); }
.k-logo__word{ font-weight:700; font-size:21px; letter-spacing:-.02em; }
.k-logo .k-logo__curve{ stroke:#8C8C8C; }
:root[data-theme="dark"] .k-logo .k-logo__curve{ stroke:#7C8784; }
.k-nav{ display:flex; align-items:stretch; gap:20px; align-self:stretch; }
.k-nav a{
  display:flex; align-items:center; min-height:68px; font-size:15px; font-weight:500; color:var(--k-soft);
  text-decoration:none; box-shadow:inset 0 -2px 0 transparent; transition:color .15s ease, box-shadow .15s ease;
}
.k-nav a:hover{ color:var(--k-ink); }
.k-nav a[aria-current="page"]{ color:var(--k-ink); font-weight:600; box-shadow:inset 0 -2px 0 var(--k-brand); }
.k-header__tools{ display:flex; align-items:center; gap:4px; }
.k-header__burger{ display:none; }
.k-header__locale{ display:inline-flex; align-items:center; gap:8px; height:44px; padding:0 12px; border:0; border-radius:var(--k-r); background:transparent; color:var(--k-soft); font:inherit; font-size:14px; font-weight:500; cursor:pointer; }
.k-header__locale:hover{ background:var(--k-surface-2); color:var(--k-ink); }
.k-account{ display:inline-flex; align-items:center; gap:6px; height:44px; padding:0 6px 0 4px; border:0; border-radius:999px; background:transparent; color:var(--k-soft); cursor:pointer; }
.k-account:hover{ background:var(--k-surface-2); }
.k-account .k-avatar{ width:36px; height:36px; font-size:13px; box-shadow:0 0 0 2px var(--k-surface), 0 0 0 3px var(--k-line); }
.k-notif-dot{ position:absolute; top:11px; right:12px; width:8px; height:8px; border-radius:50%; background:var(--k-brand); box-shadow:0 0 0 2px var(--k-surface); }
.k-notif-list{ max-height:360px; overflow-y:auto; min-width:300px; }
.k-notif-all{ justify-content:center; margin-top:4px; border-top:1px solid var(--k-line); font-weight:600; color:var(--k-primary); }
.k-notif-all + .k-notif-all{ margin-top:0; }
.k-notif-more{ display:block; width:100%; text-align:center; color:var(--k-muted); font-size:13px; }
@media (max-width: 1100px){
  .k-nav, .k-header__hide-md{ display:none; }
  .k-header__burger{ display:inline-flex; }
}
@media (max-width: 560px){
  .k-header__in{ gap:8px; min-height:60px; }
  .k-header__hide-sm{ display:none !important; }
}

/* Drawer (mobile menu) */
.k-drawer-scrim{ position:fixed; inset:0; z-index:50; background:var(--k-scrim); opacity:0; pointer-events:none; transition:opacity .2s ease; }
.k-drawer-scrim.open{ opacity:1; pointer-events:auto; }
.k-drawer{
  position:fixed; top:0; right:0; bottom:0; z-index:51; width:min(390px, 100%); box-sizing:border-box;
  display:flex; flex-direction:column; background:var(--k-surface); color:var(--k-ink);
  transform:translateX(100%); transition:transform .25s var(--k-ease); overflow-y:auto;
}
.k-drawer.open{ transform:none; }
.k-drawer__head{ display:flex; align-items:center; height:60px; padding:0 8px 0 16px; border-bottom:1px solid var(--k-line); flex:none; }
.k-drawer__body{ display:flex; flex-direction:column; gap:20px; padding:8px 16px 24px; }
.k-drawer__nav{ display:flex; flex-direction:column; }
.k-drawer__link{
  display:flex; align-items:center; gap:14px; min-height:56px; padding:0 8px; margin:0 -8px; border-radius:var(--k-r);
  color:var(--k-ink); font-size:18px; font-weight:600; text-decoration:none;
}
.k-drawer__link:hover{ background:var(--k-bg); color:var(--k-ink); }
.k-drawer__link svg:first-child{ color:var(--k-soft); flex:none; }
.k-drawer__link .k-chev{ margin-left:auto; color:var(--k-line-3); }
/* The signup gift, for signed-out visitors: the drawer is where a phone
   visitor decides whether to register, so the offer sits above the buttons. */
.k-drawer__promo{ display:flex; gap:10px; align-items:flex-start; padding:12px 14px; border-radius:var(--k-r); background:var(--k-brand-soft-2); border:1px solid var(--k-brand-soft); color:var(--k-brand-soft-ink); }
.k-drawer__promo svg{ flex:none; margin-top:1px; }
.k-drawer__promo p{ margin:0; font-size:14px; line-height:1.45; }
@media (prefers-reduced-motion: reduce){ .k-drawer, .k-drawer-scrim{ transition:none; } }

/* ---------- Footer ---------- */
.k-footer{ background:var(--k-bg); border-top:1px solid var(--k-line); }
.k-footer__in{ display:flex; flex-direction:column; gap:48px; padding-top:64px; padding-bottom:32px; }
.k-footer__grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap:40px 32px; }
.k-footer__brand{ display:flex; flex-direction:column; gap:16px; min-width:0; }
.k-footer__brand p{ margin:0; font-size:14px; color:var(--k-soft); max-width:260px; }
.k-footer__col{ display:flex; flex-direction:column; gap:12px; }
.k-footer__title{ font-size:14px; font-weight:600; color:var(--k-ink); }
.k-footer__col a{ font-size:14px; color:var(--k-soft); text-decoration:none; }
.k-footer__col a:hover{ color:var(--k-ink); }
.k-footer__bottom{ display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding-top:24px; border-top:1px solid var(--k-line); font-size:13px; color:var(--k-soft); }
.k-footer__bottom a{ display:inline-flex; align-items:center; gap:8px; min-height:44px; color:var(--k-soft); text-decoration:none; }
.k-footer__bottom a:hover{ color:var(--k-ink); }
.k-footer select{ height:44px; padding:0 10px; border:1px solid var(--k-line-2); border-radius:var(--k-r); background:var(--k-surface); color:var(--k-ink); font:inherit; font-size:14px; }

/* ---------- Flash messages ---------- */
.k-flash-wrap{ position:fixed; z-index:60; left:50%; bottom:24px; transform:translateX(-50%); display:flex; flex-direction:column; gap:8px; width:min(520px, calc(100% - 32px)); }
.k-flash{ padding:12px 16px; border-radius:var(--k-r); background:var(--k-dark-btn); color:var(--k-on-dark-btn); font-size:14px; box-shadow:var(--k-shadow-pop); transition:opacity .3s ease, transform .3s ease; }
.k-flash--error{ background:var(--k-error); color:#fff; }
.k-flash.flash-out{ opacity:0; transform:translateY(8px); }

/* ---------- Tables (panel, lists) ---------- */
.k-table-wrap{ overflow-x:auto; border:1px solid var(--k-line); border-radius:var(--k-r-card); background:var(--k-surface); }
.k-table{ width:100%; border-collapse:collapse; font-size:14px; }
.k-table th{ text-align:left; font-weight:600; font-size:13px; color:var(--k-muted); padding:12px 16px; border-bottom:1px solid var(--k-line); background:var(--k-bg); white-space:nowrap; }
.k-table td{ padding:12px 16px; border-bottom:1px solid var(--k-line); color:var(--k-ink); vertical-align:middle; }
.k-table tr:last-child td{ border-bottom:0; }
.k-table tbody tr:hover td{ background:var(--k-bg); }

/* ---------- Pagination ---------- */
.k-pages{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; justify-content:center; margin-top:32px; }
.k-pages a, .k-pages span{
  display:inline-flex; align-items:center; justify-content:center; min-width:44px; height:44px; padding:0 10px; box-sizing:border-box;
  border-radius:var(--k-r); border:1px solid var(--k-line-2); background:var(--k-surface); color:var(--k-ink); font-weight:600; text-decoration:none;
}
.k-pages a:hover{ border-color:var(--k-line-3); }
.k-pages .is-current{ background:var(--k-dark-btn); border-color:var(--k-dark-btn); color:var(--k-on-dark-btn); }
.k-pages .is-disabled{ opacity:.45; }
.k-pages .is-gap{ border:0; background:none; min-width:24px; }

/* ---------- Reveal (light, motivated: content entering) ---------- */
@media (prefers-reduced-motion: no-preference){
  .k-reveal{ opacity:0; transform:translateY(12px); transition:opacity .5s var(--k-ease), transform .5s var(--k-ease); }
  .k-reveal.is-in{ opacity:1; transform:none; }
}

/* ---------- Promo strip (home page only) ---------- */
.promo-strip{ background:var(--k-brand-soft-2); border-bottom:1px solid var(--k-brand-soft); color:var(--k-brand-soft-ink); }
.promo-strip__in{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:4px 10px; min-height:44px; padding-top:8px; padding-bottom:8px; font-size:14px; line-height:1.4; text-align:center; }
.promo-strip__in svg{ flex:none; }
.promo-strip__link{ font-weight:600; color:var(--k-primary); text-decoration:none; white-space:nowrap; }
.promo-strip__link:hover{ text-decoration:underline; }
.promo-strip .promo-reward + .promo-reward::before{ content:", "; }
@media (max-width: 640px){
  .promo-strip__in{ font-size:13px; }
}

/* ---------- Sign-in pages: minimal header/footer (design Login/Signup) ---------- */
.k-auth-head{ background:var(--k-bg); }
.k-auth-head__in{ min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.k-auth-head__help{ display:flex; align-items:center; min-height:44px; font-size:15px; }
.k-auth-head__alt{ gap:6px; color:var(--k-soft); font-size:14px; }
.k-auth-head__alt a{ font-weight:600; text-decoration:none; }
.k-auth-foot{ background:var(--k-bg); }
.k-auth-foot__in{ display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px 16px; padding-top:16px; padding-bottom:24px; font-size:13px; color:var(--k-muted); }
.k-auth-foot__in a{ color:var(--k-muted); text-decoration:none; }
.k-auth-foot__in a:hover{ color:var(--k-ink); }
.k-auth-foot select{ height:44px; padding:0 10px; border:1px solid var(--k-line-2); border-radius:var(--k-r); background:var(--k-surface); color:var(--k-ink); font:inherit; font-size:13px; }

/* Bottom navigation on phones (_tabbar.html). */
.k-tabbar{ display:none; }
@media (max-width: 767px){
  .k-tabbar{
    position:fixed; left:0; right:0; bottom:0; z-index:900; display:grid; grid-template-columns:repeat(4, 1fr);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom)); background:var(--k-surface); border-top:1px solid var(--k-line);
  }
  .k-tabbar__item{ display:flex; flex-direction:column; align-items:center; gap:2px; min-height:52px; padding:4px 2px; font-size:12px; font-weight:500; line-height:1.2; text-align:center; color:var(--k-soft); text-decoration:none; }
  .k-tabbar__item:hover{ color:var(--k-ink); }
  .k-tabbar__ico{ position:relative; display:inline-flex; align-items:center; justify-content:center; width:56px; height:30px; border-radius:999px; }
  .k-tabbar__item[aria-current="page"]{ color:var(--k-primary); font-weight:600; }
  .k-tabbar__item[aria-current="page"] .k-tabbar__ico{ background:var(--k-brand-soft); }
  .k-tabbar__dot{ position:absolute; top:3px; right:14px; width:8px; height:8px; border-radius:50%; background:var(--k-error); border:2px solid var(--k-surface); }
  body:has(.k-tabbar){ padding-bottom:calc(68px + env(safe-area-inset-bottom)); }
  body:has(.k-tabbar) .support-bubble{ bottom:calc(84px + env(safe-area-inset-bottom)); }
}