/* Account area: auth cards, settings, security, profile dashboard,
   saved items, support, checkout. Tokens only (kits.css). */

.acc [hidden]{ display:none !important; }
.acc ul.errorlist{ margin:0; padding:0; list-style:none; }
.acc .k-alert ul.errorlist li + li{ margin-top:4px; }
.acc-sr{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.acc-ico-tile{
  flex:none; width:48px; height:48px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:var(--k-brand-soft); color:var(--k-primary);
}
.acc-ico-tile--sm{ width:40px; height:40px; border-radius:10px; }
.acc-ico-tile--neutral{ background:var(--k-surface-2); color:var(--k-ink-2); }
.acc-ico-tile--error{ background:var(--k-error-bg); color:var(--k-error); }

/* ---------- Auth cards (login, signup, codes, reset) ---------- */
.acc-auth{ display:flex; justify-content:center; align-items:flex-start; padding:32px var(--k-gutter) 64px; background:var(--k-bg); }
.acc-auth__card{
  width:100%; max-width:440px; box-sizing:border-box; display:flex; flex-direction:column; gap:24px;
  background:var(--k-surface); border:1px solid var(--k-line); border-radius:var(--k-r-panel); padding:clamp(24px, 4vw, 40px);
}
.acc-auth__head{ display:flex; flex-direction:column; gap:8px; }
.acc-auth__title{ margin:0; font-size:28px; line-height:1.2; letter-spacing:-.02em; font-weight:700; }
.acc-auth__head p{ margin:0; color:var(--k-soft); }
.acc-auth__head strong{ color:var(--k-ink); font-weight:600; }
.acc-auth__foot{ margin:0; padding-top:20px; border-top:1px solid var(--k-line); text-align:center; font-size:15px; color:var(--k-soft); }
.acc-auth__foot--split{ display:flex; justify-content:space-between; align-items:center; gap:8px 16px; flex-wrap:wrap; text-align:left; font-size:14px; }
.acc-auth__foot a, .acc-inline-link{ display:inline-flex; align-items:center; gap:6px; min-height:44px; font-weight:600; text-decoration:none; }
.acc-auth__foot a:hover, .acc-inline-link:hover{ text-decoration:underline; }
.acc-auth__foot form{ display:inline; }
.acc-linkbtn{
  display:inline-flex; align-items:center; min-height:44px; padding:0; border:0; background:none; cursor:pointer;
  font:inherit; font-weight:600; color:var(--k-primary);
}
.acc-linkbtn:hover{ color:var(--k-primary-hover); text-decoration:underline; }

.acc-oauth{ display:flex; flex-direction:column; gap:12px; }
.acc-divider{ display:flex; align-items:center; gap:12px; font-size:13px; color:var(--k-muted); }
.acc-divider::before, .acc-divider::after{ content:""; flex:1 1 0; height:1px; background:var(--k-line); }

.acc-form{ display:flex; flex-direction:column; gap:20px; }
.acc-form--tight{ gap:16px; }
.acc-field-top{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
.acc-field-top a{ display:inline-flex; align-items:center; min-height:32px; font-size:14px; font-weight:600; text-decoration:none; }
.acc-field-top a:hover{ text-decoration:underline; }
.acc-pass{ position:relative; }
.acc-pass input{ padding-right:52px !important; }
.acc-pass__toggle{ position:absolute; top:2px; right:2px; border-radius:10px; }
.acc-pass__toggle .acc-eye-off{ display:none; }
.acc-pass__toggle[aria-pressed="true"] .acc-eye-on{ display:none; }
.acc-pass__toggle[aria-pressed="true"] .acc-eye-off{ display:block; }
.acc-code input{
  height:60px; text-align:center; font-size:24px !important; font-weight:600; letter-spacing:.3em;
  font-variant-numeric:tabular-nums; font-family:ui-monospace, SFMono-Regular, Menlo, monospace !important;
}
.acc-code--left input{ text-align:left; }
.acc-note{ display:flex; gap:10px; align-items:flex-start; padding:14px 16px; border-radius:var(--k-r); background:var(--k-bg); font-size:14px; color:var(--k-soft); }
.acc-note svg{ flex:none; margin-top:1px; }

/* The sign-in pages fill the window: the grey ground runs to the bottom and
   the small footer sits there, however short the card is. */
body:has(.acc-auth){ min-height:100vh; min-height:100dvh; display:flex; flex-direction:column; background:var(--k-bg); }
body:has(.acc-auth) > main{ flex:1 0 auto; }
.acc-auth{ padding-top:clamp(24px, 5vh, 56px); }

/* Six-box code entry (auth.js). The original input stays in the form and is
   what submits; with the boxes on it is visually hidden. */
.acc-otp{ display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); gap:8px; }
.acc-otp__box{
  width:100%; min-width:0; height:56px; box-sizing:border-box; padding:0; text-align:center;
  font-size:22px; font-weight:600; font-variant-numeric:tabular-nums; color:var(--k-ink);
  border:1px solid var(--k-line-2); border-radius:var(--k-r); background:var(--k-surface);
}
.acc-otp__box:focus{ outline:none; border-color:var(--k-brand); box-shadow:var(--k-focus); }
.acc-otp-on > input{ position:absolute !important; width:1px; height:1px; opacity:0; pointer-events:none; }
.acc-otp-on.acc-otp-plain > input{ position:static !important; width:100%; height:60px; opacity:1; pointer-events:auto; }
.acc-otp-on.acc-otp-plain .acc-otp{ display:none; }
.acc-otp-switch{ align-self:center; margin-top:-8px; }
.has-error .acc-otp__box{ border-color:var(--k-error); }

/* Password checklist and the match line (auth.js) */
.acc-rules{ margin:8px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:4px; font-size:13px; color:var(--k-muted); }
.acc-rules li, .acc-rules--match{ position:relative; padding-left:22px; line-height:1.45; }
.acc-rules li::before, .acc-rules--match::before{
  content:""; position:absolute; left:0; top:2px; width:14px; height:14px; border-radius:50%;
  background:var(--k-surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/10px no-repeat;
}
.acc-rules li.is-ok, .acc-rules--match.is-ok{ color:var(--k-ink-2); }
.acc-rules li.is-ok::before, .acc-rules--match.is-ok::before{
  background:var(--k-brand-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315803D' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/10px no-repeat;
}
.acc-rules li.acc-rules__tip::before{ background:var(--k-surface-2); background-image:radial-gradient(circle, var(--k-line-3) 0 2px, transparent 2.5px); }
.acc-rules--match{ margin:8px 0 0; font-size:13px; color:var(--k-muted); }

.acc-hint{ display:flex; gap:8px; align-items:flex-start; margin:8px 0 0; font-size:13px; line-height:1.45; color:var(--k-muted); }
.acc-hint svg{ flex:none; margin-top:2px; }

/* Sign-up: the early-member gift, and the legal line under the button */
.acc-early{ 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); }
.acc-early svg{ flex:none; margin-top:1px; }
.acc-early p{ margin:0; font-size:14px; line-height:1.45; }
.acc-legal{ margin:-4px 0 0; font-size:13px; line-height:1.5; color:var(--k-muted); }
.acc-legal a{ font-weight:600; text-decoration:none; }
.acc-legal a:hover{ text-decoration:underline; }

/* Signup role cards */
.acc-roles{ margin:0; padding:0; border:0; min-width:0; display:flex; flex-direction:column; gap:12px; }
.acc-roles legend{ padding:0; margin-bottom:12px; font-size:14px; font-weight:600; color:var(--k-ink); }
.acc-roles__grid{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
.acc-role{
  position:relative; display:flex; flex-direction:column; gap:10px; padding:16px; border-radius:var(--k-r-card);
  border:1px solid var(--k-line-2); background:var(--k-surface); cursor:pointer;
  transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.acc-role:hover{ border-color:var(--k-line-3); }
.acc-role:has(input:checked){ border-color:var(--k-primary); box-shadow:inset 0 0 0 1px var(--k-primary); background:var(--k-brand-soft-2); }
.acc-role:has(input:focus-visible){ outline:2px solid var(--k-brand); outline-offset:2px; }
.acc-role__top{ display:flex; justify-content:space-between; align-items:center; }
.acc-role__ico{ width:36px; height:36px; border-radius:10px; background:var(--k-brand-soft); color:var(--k-primary); display:flex; align-items:center; justify-content:center; }
.acc-role input{ width:18px; height:18px; margin:0; accent-color:var(--k-primary); }
.acc-role__title{ font-size:15px; font-weight:600; color:var(--k-ink); }
@media (max-width: 420px){ .acc-roles__grid{ grid-template-columns:1fr; } }

/* ---------- Page shell (settings, security, profile, saved, pay) ---------- */
.acc-head{ display:flex; flex-direction:column; gap:8px; margin-bottom:32px; }
.acc-head p{ margin:0; color:var(--k-soft); max-width:68ch; }
.acc-crumbs svg{ color:var(--k-line-3); }
.acc-layout{ display:flex; flex-wrap:wrap; gap:40px; align-items:flex-start; }
.acc-side{ flex:1 1 220px; max-width:280px; display:flex; flex-direction:column; gap:4px; position:sticky; top:92px; }
.acc-side__link{
  display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; padding:0 14px; border-radius:var(--k-r);
  font-size:15px; font-weight:500; color:var(--k-soft); text-decoration:none;
}
.acc-side__link > span{ display:flex; align-items:center; gap:12px; }
.acc-side__link:hover{ background:var(--k-surface-2); color:var(--k-ink); }
.acc-side__link[aria-current="page"]{ background:var(--k-surface-2); color:var(--k-ink); font-weight:600; }
.acc-side__sep{ height:1px; margin:8px 14px; background:var(--k-line); }
.acc-content{ flex:999 1 560px; min-width:0; display:flex; flex-direction:column; gap:24px; }
@media (max-width: 900px){
  .acc-side{ position:static; max-width:none; flex-basis:100%; flex-direction:row; overflow-x:auto; scrollbar-width:none; gap:4px; }
  .acc-side::-webkit-scrollbar{ display:none; }
  .acc-side__link{ flex:none; white-space:nowrap; }
  .acc-side__link > svg:last-child{ display:none; }
  .acc-side__sep{ width:1px; height:auto; margin:8px 4px; }
}

.acc-section{
  display:flex; flex-direction:column; gap:20px; padding:24px; box-sizing:border-box;
  border:1px solid var(--k-line); border-radius:var(--k-r-card); background:var(--k-surface); scroll-margin-top:96px;
}
.acc-section--rows{ gap:0; padding:8px 24px; }
.acc-section__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.acc-section__head > div{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.acc-section--rows .acc-section__head{ padding:16px 0 8px; }
.acc-section__title{ margin:0; font-size:20px; line-height:1.3; letter-spacing:-.01em; font-weight:600; }
.acc-section__sub{ margin:0; font-size:14px; color:var(--k-soft); max-width:62ch; }
.acc-grid2{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap:16px; }
.acc-actions{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding-top:24px; border-top:1px solid var(--k-line); }
.acc-actions .k-btn--primary{ padding:0 28px; }

/* Rows inside a section (security, linked accounts) */
.acc-row{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 16px; padding:16px 0; border-bottom:1px solid var(--k-line); }
.acc-row:last-child{ border-bottom:0; }
.acc-row__body{ flex:1 1 220px; min-width:0; display:flex; flex-direction:column; }
.acc-row__title{ font-size:15px; font-weight:600; color:var(--k-ink); overflow-wrap:anywhere; }
.acc-row__sub{ font-size:13px; color:var(--k-muted); }
.acc-row form{ margin:0; }

/* Photo editor (settings) */
.acc-photos{ position:relative; padding-bottom:48px; }
.acc-cover{
  position:relative; height:168px; box-sizing:border-box; border:1px dashed var(--k-line-2); border-radius:var(--k-r-card);
  background-color:var(--k-bg); background-size:cover; background-position:center;
  display:flex; align-items:center; justify-content:center;
}
.acc-cover__remove{ position:absolute; top:8px; right:8px; background:var(--k-surface); border:1px solid var(--k-line-2); }
.acc-avatar-edit{ position:absolute; left:24px; bottom:0; width:96px; height:96px; }
.acc-avatar-edit__circle{
  width:96px; height:96px; border-radius:50%; overflow:hidden; display:flex; align-items:center; justify-content:center;
  background:var(--k-dark-btn); color:var(--k-on-dark-btn); font-size:30px; font-weight:600; box-shadow:0 0 0 4px var(--k-surface);
}
.acc-avatar-edit__circle img{ width:100%; height:100%; object-fit:cover; }
.acc-avatar-edit__pick{
  position:absolute; right:-4px; bottom:-2px; width:36px; height:36px; padding:0; border-radius:50%;
  border:1px solid var(--k-line-2); background:var(--k-surface); color:var(--k-ink);
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.acc-avatar-edit__pick:hover{ background:var(--k-bg); border-color:var(--k-line-3); }
.acc-avatar-remove{ position:absolute; left:136px; bottom:4px; }
.acc-photo-errors{ display:flex; flex-direction:column; gap:4px; }

/* Theme choice (appearance partial) */
.acc-themes{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; max-width:560px; }
.acc-theme{
  display:flex; flex-direction:column; gap:10px; padding:12px; border-radius:14px; text-align:left; cursor:pointer;
  border:1px solid var(--k-line); background:var(--k-surface); color:var(--k-ink); font:inherit;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.acc-theme:hover{ border-color:var(--k-line-2); }
.acc-theme[aria-checked="true"]{ border-color:var(--k-primary); box-shadow:inset 0 0 0 1px var(--k-primary); }
.acc-theme__swatch{ display:flex; height:56px; border-radius:10px; overflow:hidden; border:1px solid var(--k-line); }
.acc-theme__swatch span{ flex:1 1 0; }
/* Swatch colours are fixed previews of each theme, not themed tokens. */
.acc-theme__swatch .sw-light-a{ background:#FFFFFF; } .acc-theme__swatch .sw-light-b{ background:#F1F5F9; }
.acc-theme__swatch .sw-dark-a{ background:#0B1210; } .acc-theme__swatch .sw-dark-b{ background:#16201C; }
.acc-theme__label{ display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:14px; font-weight:600; }
.acc-theme__dot{ flex:none; width:18px; height:18px; box-sizing:border-box; border-radius:50%; border:1.5px solid var(--k-line-3); background:var(--k-surface); }
.acc-theme[aria-checked="true"] .acc-theme__dot{ border-color:var(--k-primary); box-shadow:inset 0 0 0 4px var(--k-primary); }
@media (max-width: 480px){ .acc-themes{ grid-template-columns:1fr; } .acc-theme{ flex-direction:row; align-items:center; } .acc-theme__swatch{ width:72px; height:40px; flex:none; } .acc-theme__label{ flex:1; } }

/* Security */
.acc-steps{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:10px; font-size:15px; color:var(--k-ink-2); counter-reset:accstep; }
.acc-steps li{ display:flex; gap:12px; align-items:flex-start; counter-increment:accstep; }
.acc-steps li::before{
  content:counter(accstep); flex:none; width:24px; height:24px; border-radius:50%; background:var(--k-dark-btn); color:var(--k-on-dark-btn);
  font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center;
}
.acc-setup{ display:flex; flex-direction:column; gap:20px; padding:20px; border-radius:var(--k-r-card); background:var(--k-bg); border:1px solid var(--k-line); }
.acc-setup__grid{ display:flex; flex-wrap:wrap; gap:24px; align-items:flex-start; }
.acc-qr{ flex:none; width:168px; height:168px; box-sizing:border-box; padding:10px; border-radius:var(--k-r-card); background:#FFFFFF; border:1px solid var(--k-line); display:flex; align-items:center; justify-content:center; }
.acc-qr svg, .acc-qr img{ width:100%; height:100%; }
.acc-mono{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; }
.acc-secret{ display:inline-block; padding:8px 12px; border-radius:10px; background:var(--k-surface); border:1px solid var(--k-line); font-size:15px; letter-spacing:.04em; overflow-wrap:anywhere; }
.acc-codes{ display:flex; flex-direction:column; gap:14px; padding:20px; border-radius:var(--k-r-card); background:var(--k-warn-bg); border:1px solid var(--k-line-2); }
.acc-codes p{ margin:0; font-size:14px; line-height:1.6; color:var(--k-warn); }
.acc-codes ol{
  margin:0; padding:16px 20px; list-style:none; display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:8px 24px;
  border-radius:var(--k-r); background:var(--k-surface); border:1px solid var(--k-line); font-size:15px; color:var(--k-ink);
}
.acc-codes code{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; }
.acc-2fa-indent{ padding-left:56px; }
.acc-inline-form{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; }
.acc-inline-form .k-field{ flex:1 1 240px; }
.acc-code-input{ max-width:220px; }
.acc-code-input input{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace !important; font-size:22px !important; letter-spacing:.3em; height:52px; }
@media (max-width: 560px){ .acc-2fa-indent{ padding-left:0; } }

/* ---------- Profile dashboard ---------- */
.acc-dash{ display:flex; flex-direction:column; gap:32px; }
.acc-cover-band{ height:160px; border-radius:var(--k-r-panel); background-size:cover; background-position:center; background-color:var(--k-surface-2); }
.acc-overview{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; }
.acc-overview__who{ display:flex; align-items:center; gap:20px; min-width:0; }
.acc-overview__avatar{ width:72px; height:72px; font-size:24px; }
.acc-overview__info{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.acc-overview__name{ margin:0; font-size:clamp(28px, 4vw, 40px); line-height:1.1; letter-spacing:-.03em; font-weight:700; overflow-wrap:anywhere; }
.acc-overview__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; font-size:14px; color:var(--k-soft); }
.acc-overview__meta a{ font-weight:600; text-decoration:none; min-height:32px; display:inline-flex; align-items:center; }
.acc-overview__meta a:hover{ text-decoration:underline; }
.acc-overview__sep{ width:1px; height:16px; background:var(--k-line-2); }
.acc-overview__actions{ display:flex; flex-wrap:wrap; gap:10px; }
.acc-social{ display:flex; flex-wrap:wrap; gap:4px; }
.acc-social .k-icon-btn{ width:40px; height:40px; }

.acc-stats{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap:16px; }
.acc-stat{ display:flex; flex-direction:column; gap:6px; padding:20px; border:1px solid var(--k-line); border-radius:var(--k-r-card); background:var(--k-surface); }
.acc-stat__label{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--k-muted); }
.acc-stat__num{ font-size:28px; line-height:1.2; font-weight:700; letter-spacing:-.02em; color:var(--k-ink); font-variant-numeric:tabular-nums; }

.acc-banner{ display:flex; flex-wrap:wrap; align-items:flex-start; gap:12px 14px; padding:14px 18px; border-radius:var(--k-r-card); background:var(--k-warn-bg); color:var(--k-warn); border:1px solid var(--k-line-2); font-size:14px; }
.acc-banner svg{ flex:none; margin-top:1px; }
.acc-banner > div{ flex:1 1 320px; display:flex; flex-direction:column; gap:2px; }
.acc-banner--row{ align-items:center; }
.acc-banner--row p{ flex:1 1 320px; margin:0; }
.acc-banner--row .k-btn{ flex:none; background:var(--k-surface); }
.acc-banner--info{ background:var(--k-info-bg); color:var(--k-info); }
.acc-stat__hint{ font-size:13px; line-height:1.5; color:var(--k-muted); }
.acc-stat__link{ display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; text-decoration:none; }
.acc-stat__link:hover{ text-decoration:underline; }
.acc-overview__rating{ display:inline-flex; align-items:center; gap:4px; }
.acc-overview__rating svg{ color:var(--k-star); }
.acc-overview__rating strong{ color:var(--k-ink); font-weight:600; }
.acc-overview__actions form{ margin:0; display:flex; }
.acc-item__note{ font-size:13px; line-height:1.5; color:var(--k-soft); }
.acc-item__note.is-danger{ color:var(--k-error); font-weight:600; }

.acc-dash__body{ display:flex; flex-wrap:wrap; gap:40px; align-items:flex-start; }
.acc-dash__main{ flex:999 1 620px; min-width:0; display:flex; flex-direction:column; gap:24px; }
.acc-dash__aside{ flex:1 1 280px; min-width:0; max-width:100%; display:flex; flex-direction:column; gap:16px; }

.acc-tabs{ display:flex; gap:28px; border-bottom:1px solid var(--k-line); overflow-x:auto; scrollbar-width:none; }
.acc-tabs::-webkit-scrollbar{ display:none; }
.acc-tabs form{ margin:0; display:flex; }
.acc-tab{
  display:flex; align-items:center; gap:8px; height:52px; padding:0 2px; border:0; background:transparent; cursor:pointer; white-space:nowrap;
  font:inherit; font-size:15px; font-weight:500; color:var(--k-soft); box-shadow:inset 0 -2px 0 transparent; text-decoration:none;
}
.acc-tab:hover{ color:var(--k-ink); }
.acc-tab[aria-current="page"], .acc-tab.active{ color:var(--k-ink); font-weight:600; box-shadow:inset 0 -2px 0 var(--k-brand); }
.acc-tab__count{ padding:1px 8px; border-radius:999px; background:var(--k-surface-2); color:var(--k-ink-2); font-size:12px; font-weight:600; }

.acc-list-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.acc-list{ display:flex; flex-direction:column; border:1px solid var(--k-line); border-radius:var(--k-r-card); overflow:hidden; background:var(--k-surface); }
.acc-item{ display:flex; flex-wrap:wrap; gap:16px 20px; align-items:center; padding:18px 20px; border-bottom:1px solid var(--k-line); }
.acc-item:last-child{ border-bottom:0; }
.acc-item.is-expired{ background:var(--k-warn-bg); }
.acc-item__thumb{
  position:relative; flex:none; width:88px; height:66px; border-radius:var(--k-r); overflow:hidden;
  background:var(--k-surface-2); color:var(--k-primary); display:flex; align-items:center; justify-content:center;
}
.acc-item__thumb img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.acc-item__thumb--job{ width:56px; height:56px; background:var(--k-brand-soft-2); }
.acc-item__body{ flex:1 1 300px; min-width:0; display:flex; flex-direction:column; gap:6px; }
.acc-item__title{ font-size:16px; font-weight:600; color:var(--k-ink); text-decoration:none; overflow-wrap:anywhere; }
.acc-item__title:hover{ color:var(--k-ink); text-decoration:underline; }
.acc-item__meta{ font-size:13px; color:var(--k-muted); }
.acc-item__meta strong{ color:var(--k-ink); font-weight:600; }
.acc-item__status{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; font-size:13px; color:var(--k-soft); }
.acc-item__status > span{ display:inline-flex; align-items:center; gap:4px; }
.acc-item__status .is-warn{ color:var(--k-warn); font-weight:600; }
.acc-item__status .is-danger{ color:var(--k-error); font-weight:600; }
.acc-item__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.acc-item__actions form{ margin:0; display:flex; }
.acc-item__actions .k-icon-btn{ width:40px; height:40px; color:var(--k-error); }
@media (max-width: 767px){
  .acc-item{ padding:16px; }
  .acc-item__actions{ width:100%; }
}

.acc-aside-card{ display:flex; flex-direction:column; gap:12px; padding:20px; border:1px solid var(--k-line); border-radius:var(--k-r-card); background:var(--k-surface); }
.acc-aside-card h2{ margin:0; font-size:15px; font-weight:600; color:var(--k-ink); }
.acc-aside-card p{ margin:0; font-size:14px; color:var(--k-soft); line-height:1.6; }
.acc-tags{ display:flex; flex-wrap:wrap; gap:6px; }
.acc-tag{ padding:4px 10px; border-radius:var(--k-r-sm); background:var(--k-surface-2); color:var(--k-ink-2); font-size:13px; }
.acc-dl{ margin:0; display:flex; flex-direction:column; gap:8px; font-size:14px; }
.acc-dl > div{ display:flex; justify-content:space-between; gap:12px; }
.acc-dl dt{ font-weight:600; color:var(--k-ink); }
.acc-dl dd{ margin:0; color:var(--k-soft); text-align:right; }

/* Dialogs (boosts, add listing) */
.acc-dialog{
  width:min(460px, calc(100% - 32px)); box-sizing:border-box; padding:0; border:1px solid var(--k-line); border-radius:var(--k-r-panel);
  background:var(--k-surface); color:var(--k-ink); box-shadow:var(--k-shadow-pop);
}
.acc-dialog::backdrop{ background:var(--k-scrim); }
.acc-dialog__in{ display:flex; flex-direction:column; gap:16px; padding:clamp(20px, 4vw, 28px); }
.acc-dialog__title{ margin:0; font-size:20px; line-height:1.3; font-weight:600; }
.acc-dialog__in p{ margin:0; color:var(--k-soft); }
.acc-dialog__price{ font-size:28px; font-weight:700; letter-spacing:-.02em; color:var(--k-ink) !important; }
.acc-dialog__price .price-approx{ font-size:14px; font-weight:400; color:var(--k-muted); }
.acc-dialog__actions{ display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; padding-top:4px; }
.acc-boost-opts{ display:flex; flex-direction:column; gap:8px; }
.acc-boost-opt{
  display:flex; align-items:center; gap:12px; min-height:56px; padding:10px 14px; box-sizing:border-box; border-radius:var(--k-r);
  border:1px solid var(--k-line-2); background:var(--k-surface); color:var(--k-ink); text-decoration:none; font-weight:600;
  transition:border-color .15s ease, background-color .15s ease;
}
.acc-boost-opt:hover{ border-color:var(--k-primary); background:var(--k-brand-soft-2); color:var(--k-ink); }
.acc-boost-opt__name{ flex:1 1 auto; display:flex; flex-direction:column; gap:4px; }
.acc-boost-opt__price{ font-variant-numeric:tabular-nums; white-space:nowrap; }
.acc-boost-opt svg{ color:var(--k-muted); flex:none; }

/* ---------- Saved searches, favorites ---------- */
.acc-saved{ display:flex; flex-direction:column; gap:12px; }
.acc-saved__item{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; padding:16px 20px; border:1px solid var(--k-line); border-radius:var(--k-r-card); background:var(--k-surface); }
.acc-saved__body{ flex:999 1 280px; min-width:0; display:flex; flex-direction:column; gap:6px; }
.acc-saved__title{ font-size:17px; font-weight:600; color:var(--k-ink); text-decoration:none; overflow-wrap:anywhere; }
.acc-saved__title:hover{ color:var(--k-ink); text-decoration:underline; }
.acc-saved__actions{ display:flex; flex-wrap:wrap; gap:8px; }
.acc-saved__actions form{ margin:0; }
.acc-btn-on{ color:var(--k-primary) !important; }

/* ---------- Support ---------- */
.acc-hero{ background:var(--k-bg); border-bottom:1px solid var(--k-line); }
.acc-hero__in{ max-width:760px; margin:0 auto; padding:clamp(40px, 6vw, 64px) var(--k-gutter); display:flex; flex-direction:column; align-items:center; text-align:center; gap:16px; }
.acc-hero__in p{ margin:0; color:var(--k-soft); font-size:17px; }
.acc-topics{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap:16px; }
.acc-topic{ display:flex; flex-direction:column; gap:14px; padding:24px; }
.acc-topic__title{ margin:0; font-size:17px; line-height:1.4; font-weight:600; color:var(--k-ink); }
.acc-topic p{ margin:0; font-size:14px; color:var(--k-muted); }
.acc-topic__more{ display:flex; align-items:center; gap:6px; margin-top:auto; font-size:15px; font-weight:600; color:var(--k-primary); }
.acc-contact{ background:var(--k-bg); border-top:1px solid var(--k-line); }
.acc-contact__in{ display:flex; flex-direction:column; gap:32px; padding-top:clamp(48px, 6vw, 80px); padding-bottom:clamp(48px, 6vw, 80px); }
.acc-contact__grid{ display:flex; flex-wrap:wrap; gap:24px; align-items:flex-start; }
.acc-contact__chat{ flex:1 1 300px; min-width:0; display:flex; flex-direction:column; gap:16px; }
.acc-contact__form{ flex:999 1 520px; min-width:0; display:flex; flex-direction:column; gap:24px; }
.acc-tickets{ display:flex; flex-direction:column; border:1px solid var(--k-line); border-radius:var(--k-r-card); overflow:hidden; }
.acc-ticket{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; min-height:56px; padding:12px 16px; border-bottom:1px solid var(--k-line); color:var(--k-ink); text-decoration:none; }
.acc-ticket:last-child{ border-bottom:0; }
.acc-ticket:hover{ background:var(--k-bg); color:var(--k-ink); }
.acc-ticket__subject{ flex:1 1 220px; min-width:0; font-weight:600; overflow-wrap:anywhere; }
.acc-ticket__date{ font-size:13px; color:var(--k-muted); font-variant-numeric:tabular-nums; }
.ticket-status-open{ background:var(--k-info-bg); color:var(--k-info); }
.ticket-status-answered{ background:var(--k-brand-soft); color:var(--k-brand-soft-ink); }
.ticket-status-closed{ background:var(--k-surface-2); color:var(--k-ink-2); }
.acc-honeypot{ position:absolute; left:-9999px; }

/* Ticket thread */
.acc-thread{ display:flex; flex-direction:column; gap:12px; }
.acc-msg{ display:flex; flex-direction:column; gap:8px; padding:16px 18px; border:1px solid var(--k-line); border-radius:var(--k-r-card); background:var(--k-surface); max-width:680px; }
.acc-msg--staff{ background:var(--k-brand-soft-2); border-color:var(--k-brand-soft); align-self:flex-end; }
.acc-msg__meta{ font-size:13px; color:var(--k-muted); }
.acc-msg__meta strong{ color:var(--k-ink); font-weight:600; }
.acc-msg__body{ margin:0; color:var(--k-ink-2); white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.6; }
.acc-narrow{ max-width:760px; }

/* ---------- Checkout ---------- */
.acc-pay-band{ background:var(--k-bg); border-bottom:1px solid var(--k-line); }
.acc-pay-band .k-container{ padding-top:28px; padding-bottom:28px; display:flex; flex-direction:column; gap:20px; }
.acc-pay{ display:flex; flex-wrap:wrap; gap:24px; align-items:flex-start; }
.acc-pay__summary{ flex:999 1 480px; min-width:0; display:flex; flex-direction:column; gap:24px; }
.acc-pay__pay{ flex:1 1 340px; min-width:0; position:sticky; top:92px; display:flex; flex-direction:column; gap:16px; }
.acc-pay__item{ display:flex; gap:14px; align-items:flex-start; }
.acc-pay__item > span:last-child{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.acc-pay__item-title{ font-size:16px; font-weight:600; color:var(--k-ink); }
.acc-pay__item a{ font-size:14px; color:var(--k-soft); overflow-wrap:anywhere; }
.acc-sum{ margin:0; display:flex; flex-direction:column; gap:12px; padding-top:20px; border-top:1px solid var(--k-line); font-size:15px; }
.acc-sum > div{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
.acc-sum dt{ display:flex; align-items:center; gap:8px; color:var(--k-soft); }
.acc-sum dd{ margin:0; font-variant-numeric:tabular-nums; }
.acc-sum .is-total{ align-items:baseline; padding-top:12px; border-top:1px solid var(--k-line); }
.acc-sum .is-total dt{ color:var(--k-ink); font-weight:600; }
.acc-sum .is-total dd{ font-size:24px; font-weight:700; letter-spacing:-.02em; }
.acc-sum .is-total dd small{ font-size:14px; font-weight:500; color:var(--k-muted); }
.acc-sum .acc-sum__discount{ color:var(--k-brand-soft-ink); }
.acc-sum__approx{ justify-content:flex-end !important; font-size:13px; color:var(--k-muted); text-align:right; }
.acc-bonus-pay{ display:flex; flex-direction:column; gap:12px; padding:16px; border-radius:var(--k-r); background:var(--k-brand-soft-2); border:1px solid var(--k-brand-soft); }
.acc-bonus-pay p{ margin:0; display:flex; gap:10px; align-items:flex-start; font-size:14px; color:var(--k-brand-soft-ink); }
.acc-bonus-pay svg{ flex:none; margin-top:2px; }
#paypal-button-container{ min-height:48px; }
.acc-pay__links{ display:flex; flex-direction:column; gap:4px; padding-top:16px; border-top:1px solid var(--k-line); }
.acc-pay__links a{ display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:44px; font-size:14px; font-weight:600; text-decoration:none; }
.acc-pay__links a:hover{ text-decoration:underline; }
@media (max-width: 767px){ .acc-pay__pay{ position:static; } }


/* ---------- Design fidelity pass ---------- */
.acc-verify-actions form{ margin:0; }
.acc-sum > .is-total:first-child{ padding-top:0; border-top:0; }
.acc-next{ display:flex; flex-direction:column; gap:12px; padding-top:20px; border-top:1px solid var(--k-line); }
.acc-next__title{ margin:0; font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--k-muted); }
.acc-next ol{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:12px; font-size:14px; color:var(--k-soft); }
.acc-next li{ display:flex; gap:12px; align-items:flex-start; }
.acc-next li > span:first-child{
  flex:none; width:24px; height:24px; border-radius:50%; background:var(--k-surface-2); color:var(--k-ink);
  font-size:12px; font-weight:600; display:flex; align-items:center; justify-content:center;
}
.acc-resend-row{ margin:0; display:flex; justify-content:space-between; align-items:center; gap:8px 16px; flex-wrap:wrap; font-size:14px; color:var(--k-soft); }
.acc-side__link[aria-current="location"]{ background:var(--k-surface-2); color:var(--k-ink); font-weight:600; }
.acc-themes{ max-width:none; }
.acc-faq{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:32px; padding-bottom:clamp(40px, 6vw, 72px); }
.acc-faq__list{ border:1px solid var(--k-line); border-radius:var(--k-r-card); background:var(--k-surface); overflow:hidden; }
.acc-faq__item + .acc-faq__item{ border-top:1px solid var(--k-line); }
.acc-faq__item summary{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:56px; padding:12px 20px; font-size:15px; font-weight:600; color:var(--k-ink); cursor:pointer; list-style:none; }
.acc-faq__item summary::-webkit-details-marker{ display:none; }
.acc-faq__item summary svg{ flex:none; color:var(--k-muted); transition:transform .15s ease; }
.acc-faq__item[open] summary svg{ transform:rotate(180deg); }
.acc-faq__item p{ margin:0; padding:0 20px 18px; font-size:14px; line-height:1.6; color:var(--k-soft); }
@media (max-width: 767px){ .acc-faq{ grid-template-columns:1fr; gap:16px; } }

/* Settings: the "I offer services" switch and the line editors over the
   seller's skills, languages and links (settings.js). */
.acc-section__body{ display:flex; flex-direction:column; gap:20px; }
.acc-section__body[hidden], .acc-chips[hidden], .acc-langs[hidden], .acc-links[hidden], [data-lines-fallback][hidden]{ display:none; }
.acc-self-start{ align-self:flex-start; }
.acc-switch{ flex:none; display:inline-flex; align-items:center; gap:10px; min-height:44px; font-size:14px; font-weight:600; color:var(--k-ink); cursor:pointer; position:relative; }
.acc-switch input{ position:absolute; opacity:0; width:44px; height:24px; right:0; margin:0; cursor:inherit; }
.acc-switch__track{ width:44px; height:24px; border-radius:999px; background:var(--k-line-2); position:relative; transition:background .15s; }
.acc-switch__track::after{ content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:var(--k-surface); box-shadow:0 1px 2px rgba(0,0,0,.2); transition:transform .15s; }
.acc-switch input:checked + .acc-switch__track{ background:var(--k-brand); }
.acc-switch input:checked + .acc-switch__track::after{ transform:translateX(20px); }
.acc-switch input:focus-visible + .acc-switch__track{ outline:2px solid var(--k-brand); outline-offset:2px; }
.acc-switch input:disabled{ cursor:default; }
.acc-switch:has(input:disabled){ cursor:default; }
@media (prefers-reduced-motion: reduce){ .acc-switch__track, .acc-switch__track::after{ transition:none; } }

.acc-chips{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; min-height:44px; padding:6px 8px; border:1px solid var(--k-line-2); border-radius:var(--k-r); background:var(--k-surface); cursor:text; }
.acc-chips:focus-within{ border-color:var(--k-brand); box-shadow:0 0 0 3px var(--k-brand-soft); }
.acc-chip{ display:inline-flex; align-items:center; gap:2px; padding:2px 2px 2px 10px; border-radius:var(--k-r-sm); background:var(--k-surface-2); color:var(--k-ink-2); font-size:13px; }
.acc-chip .acc-row-remove{ width:24px; height:24px; }
.acc-chips .acc-chips__input{ flex:1 1 160px; box-shadow:none; height:auto; min-height:0; min-width:120px; border:0; outline:0; background:transparent; font:inherit; font-size:14px; color:var(--k-ink); padding:6px 4px; }

.acc-row-remove{ flex:none; display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border:0; border-radius:var(--k-r-sm); background:transparent; color:var(--k-muted); cursor:pointer; }
.acc-row-remove:hover{ background:var(--k-surface-2); color:var(--k-ink); }
.acc-row-remove.is-idle{ visibility:hidden; }

.acc-langs{ display:flex; flex-direction:column; gap:10px; }
.acc-langs__rows{ display:flex; flex-direction:column; gap:10px; }
.acc-langs__row{ display:grid; grid-template-columns:1fr 1fr auto; gap:8px; align-items:center; }
.acc-add-link{ align-self:flex-start; display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:0 8px; border:0; background:transparent; font:inherit; font-size:14px; font-weight:600; color:var(--k-primary); cursor:pointer; }
.acc-add-link:hover{ text-decoration:underline; }

.acc-links{ display:flex; flex-direction:column; gap:10px; }
.acc-links__row{ display:grid; grid-template-columns:44px 1fr auto; gap:8px; align-items:center; }
.acc-links__icon{ display:inline-flex; align-items:center; justify-content:center; height:44px; border:1px solid var(--k-line-2); border-radius:var(--k-r); color:var(--k-soft); background:var(--k-surface-2); }
@media (max-width: 479px){ .acc-langs__row{ grid-template-columns:1fr auto; } .acc-langs__row select:nth-child(2){ grid-column:1; } .acc-langs__row .acc-row-remove{ grid-row:1 / span 2; grid-column:2; } }

.acc-row--card{ padding:20px 24px; }

/* Help center: search, popular links and topic cards. */
.acc-help-search{ position:relative; display:flex; align-items:center; gap:8px; width:100%; max-width:560px; padding:6px 6px 6px 16px; border:1px solid var(--k-line-2); border-radius:var(--k-r); background:var(--k-surface); box-shadow:var(--k-shadow-sm, none); }
.acc-help-search svg{ flex:none; color:var(--k-muted); }
.acc-help-search input{ flex:1 1 auto; min-width:0; min-height:40px; border:0; outline:0; background:transparent; font:inherit; font-size:15px; color:var(--k-ink); }
.acc-help-search:focus-within{ border-color:var(--k-brand); box-shadow:0 0 0 3px var(--k-brand-soft); }
.acc-help-empty{ font-size:14px; }
.acc-help-popular{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; font-size:13px; color:var(--k-muted); }
.acc-help-topics{ padding-top:clamp(40px, 6vw, 72px); padding-bottom:clamp(40px, 6vw, 64px); display:flex; flex-direction:column; gap:24px; }
.acc-help-head{ display:flex; flex-direction:column; gap:6px; }
.acc-topics--3{ grid-template-columns:repeat(auto-fill, minmax(min(280px, 100%), 1fr)); }
@media (min-width: 900px){ .acc-topics--3{ grid-template-columns:repeat(3, minmax(0, 1fr)); } }
.acc-topic__links{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:6px; font-size:14px; }
.acc-topic__links a{ text-decoration:none; font-weight:500; }
.acc-topic__links a:hover{ text-decoration:underline; }
.acc-topic--muted{ background:var(--k-surface-2); }
.acc-faq__head{ display:flex; flex-direction:column; gap:6px; }
[data-help-item][hidden]{ display:none; }

/* ---------- Profile: friends tab (accounts/_friends_tab.html) ---------- */
.acc-tab__new{ padding:1px 7px; border-radius:999px; background:var(--k-primary); color:var(--k-on-primary); font-size:11px; font-weight:700; }
.acc-fr{ display:flex; flex-direction:column; gap:20px; }
.acc-fr__bar{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 16px; }
.acc-fr__lists{ display:inline-flex; flex-wrap:wrap; gap:4px; padding:4px; background:var(--k-surface); border:1px solid var(--k-line); border-radius:14px; }
.acc-fr__list{ display:inline-flex; align-items:center; gap:8px; min-height:40px; padding:0 14px; border-radius:10px; color:var(--k-soft); font-size:14px; font-weight:600; text-decoration:none; }
.acc-fr__list:hover{ color:var(--k-ink); }
.acc-fr__list.is-on{ background:var(--k-surface-2); color:var(--k-ink); }
.acc-fr__dot{ min-width:20px; height:20px; padding:0 6px; box-sizing:border-box; border-radius:999px; background:var(--k-primary); color:var(--k-on-primary); font-size:11px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.acc-fr__search{ flex:1 1 240px; max-width:340px; display:flex; align-items:center; gap:8px; height:44px; padding:0 12px; box-sizing:border-box; background:var(--k-surface); border:1px solid var(--k-line-2); border-radius:var(--k-r); color:var(--k-soft); }
.acc-fr__search:focus-within{ border-color:var(--k-primary); }
.acc-fr__search input{ flex:1; min-width:0; height:40px; border:0; background:transparent; color:var(--k-ink); font:inherit; font-size:15px; outline:none; }
.acc-fr__grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap:16px; }
.acc-fr__sub{ margin:8px 0 0; font-size:16px; font-weight:600; color:var(--k-ink); }
.acc-fr__empty{ display:flex; flex-direction:column; align-items:center; gap:8px; padding:48px 16px; text-align:center; border:1px dashed var(--k-line-2); border-radius:var(--k-r-card); background:var(--k-surface); }
.acc-fr__empty-title{ margin:0; font-size:17px; font-weight:600; color:var(--k-ink); }
.acc-fr__empty-hint{ margin:0; max-width:380px; font-size:15px; color:var(--k-soft); }
.acc-fr-card{ display:flex; flex-direction:column; gap:14px; padding:20px; background:var(--k-surface); border:1px solid var(--k-line); border-radius:var(--k-r-card); transition:border-color .2s; }
.acc-fr-card:hover{ border-color:var(--k-line-2); }
.acc-fr-card__who{ display:flex; align-items:center; gap:14px; min-width:0; }
.acc-fr-card__text{ flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.acc-fr-card__name{ font-size:17px; font-weight:600; color:var(--k-ink); text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.acc-fr-card__name:hover{ text-decoration:underline; }
.acc-fr-card__role{ font-size:14px; color:var(--k-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.acc-fr-card__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.acc-fr-card__note{ font-size:13px; color:var(--k-soft); }
.acc-fr-card__actions{ display:flex; align-items:center; gap:8px; margin:auto 0 0; }
.acc-fr-card__actions form{ margin:0; display:flex; }
.acc-fr-card__grow{ flex:1; }
.acc-fr-card__status{ flex:1; font-size:14px; color:var(--k-soft); }
.acc-fr-card__icon{ width:40px; height:40px; border:1px solid var(--k-line-2); }
.acc-fr-av{ display:inline-flex; align-items:center; justify-content:center; flex:none; width:56px; height:56px; border-radius:999px; overflow:hidden; font-size:17px; font-weight:700; }
.acc-fr-av img{ width:100%; height:100%; object-fit:cover; }
.acc-fr-av--sm{ width:40px; height:40px; font-size:14px; }
.acc-fr-av--green{ background:var(--k-brand-soft); color:var(--k-brand-soft-ink); }
.acc-fr-av--blue{ background:var(--k-info-bg); color:var(--k-info); }
.acc-fr-av--amber{ background:var(--k-sponsor-bg); color:var(--k-sponsor-ink); }
.acc-fr-av--slate{ background:var(--k-surface-2); color:var(--k-ink-2); }
.acc-fr-av--ink{ background:var(--k-dark-btn); color:var(--k-on-dark-accent); }
.acc-know{ display:flex; align-items:center; gap:12px; }
.acc-know form{ margin:0; }
.acc-know__text{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.acc-know__name{ font-size:15px; font-weight:600; color:var(--k-ink); text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.acc-know__name:hover{ text-decoration:underline; }
.acc-know__note{ font-size:13px; color:var(--k-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.acc-know__add{ width:40px; height:40px; background:var(--k-brand-soft); color:var(--k-brand-soft-ink); }
.acc-fr-av{ position:relative; overflow:visible; }
.acc-fr-av img{ border-radius:999px; }
.acc-fr-av__online{ position:absolute; right:1px; bottom:1px; width:14px; height:14px; box-sizing:border-box; border-radius:999px; background:var(--k-primary); border:3px solid var(--k-surface); }

/* "How your status grows" card on the own profile */
.acc-status{ padding:16px 20px; margin-bottom:20px; }
.acc-status__head{ display:flex; align-items:center; gap:10px; cursor:pointer; font-weight:600; color:var(--k-ink); list-style:none; }
.acc-status__head::-webkit-details-marker{ display:none; }
.acc-status__head .k-badge{ margin-left:auto; }
.acc-status__intro{ margin:14px 0 0; color:var(--k-soft); font-size:14px; }
.acc-status__grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:16px; margin-top:16px; }
.acc-status__col{ border:1px solid var(--k-line); border-radius:var(--k-r-card); padding:14px 16px; }
.acc-status__title{ margin:0 0 6px; font-size:15px; font-weight:600; color:var(--k-ink); }
.acc-status__now{ margin:0 0 8px; font-size:14px; color:var(--k-ink); }
.acc-status__rules{ margin:0 0 8px; padding-left:18px; font-size:13px; color:var(--k-muted); }
.acc-status__next{ margin:0; font-size:13px; color:var(--k-soft); }