:root {
  /* Shared structural tokens (palette comes from yon-dark / yon-light sheets) */
  --r10-light-bg: #f4f8fb;
  --r10-light-surface: #ffffff;
  --r10-light-surface-secondary: #f5f7fa;
  --r10-light-secondary: #f5f7fa;
  --r10-light-hover: #f8fafc;
  --r10-light-active: #f1f5f9;
  --r10-light-border: #e5e9ee;
  --r10-light-text: #2f343b;
  --r10-light-text-secondary: #66717d;
  --r10-light-text-muted: #8b949e;
  --r10-light-muted: #8b949e;
  --r10-light-text-disabled: #aab4c0;
  --r10-light-text-meta: #8b949e;

  --r10-dark-bg: #333649;
  --r10-dark-surface: #3F4257;
  --r10-dark-secondary: #494C62;
  --r10-dark-tertiary: #515365;
  --r10-dark-text: #F5F8FA;
  --r10-dark-text-secondary: #E2E5EE;
  --r10-dark-muted: #C5C9D4;
  --r10-dark-border: rgba(255, 255, 255, 0.08);

  --r10-primary: #2F6FAF;
  --r10-primary-hover: #3B82C4;
  --r10-primary-active: #3A7BC8;
  --r10-success: #35C98A;
  --r10-warning: #F5B84B;
  --r10-warning-strong: #D89522;
  --r10-danger: #F15B5B;
  --r10-info: #4BA8D1;
  --r10-online: #20D889;
  --r10-link-visited: #6B6FA0;
  --nx-catbar: #2F3345;
  --nx-radius: 6px;

  --color-bg: var(--r10-dark-bg);
  --color-bg-secondary: #2b2e40;
  --color-bg-tertiary: #262938;
  --color-surface: var(--r10-dark-surface);
  --color-surface-hover: var(--r10-dark-secondary);
  --color-surface-active: var(--r10-dark-tertiary);
  --color-border: var(--r10-dark-border);
  --color-border-light: rgba(255, 255, 255, 0.05);
  --color-border-dark: rgba(255, 255, 255, 0.12);
  --color-text: var(--r10-dark-text);
  --color-text-secondary: var(--r10-dark-text-secondary);
  --color-text-muted: var(--r10-dark-muted);
  --color-heading: #ffffff;
  --color-primary: var(--r10-primary);
  --color-primary-hover: var(--r10-primary-hover);
  --color-primary-light: rgba(74, 144, 226, 0.16);
  --color-accent: #8B7CF0;
  --color-accent-hover: #9B8EF5;
  --color-accent-light: rgba(139, 124, 240, 0.16);
  --color-success: var(--r10-success);
  --color-success-light: #293f34;
  --color-warning: var(--r10-warning);
  --color-warning-light: #473a2b;
  --color-danger: var(--r10-danger);
  --color-danger-light: #493133;
  --color-info: var(--r10-info);
  --color-info-light: #2d3c51;
  --color-input: #242735;
  --color-input-border: #464b5d;
  --color-input-placeholder: #c5c9d4;
  --color-link: #d4e7ff;
  --color-link-hover: #eef6ff;
  --color-primary-ink: #d4e7ff;
  --color-primary-ink-hover: #eef6ff;
  --color-divider: var(--r10-dark-border);
  --color-shadow: rgba(0, 0, 0, 0.20);

  --color-background: var(--color-bg);
  --color-surface-2: var(--color-bg-secondary);
  --color-elevated: var(--color-surface-hover);
  --color-hover: var(--color-surface-hover);
  --color-active: var(--color-surface-active);
  --color-border-soft: var(--color-border-light);
  --color-muted: var(--color-text-muted);
  --color-disabled: #6f7383;
  --color-primary-active: var(--r10-primary-active);
  --color-warning-strong: var(--color-accent);
  --color-premium: #8b7cf0;
  --color-online: var(--r10-online);
  --color-link-visited: var(--color-link);
  --color-focus-ring: rgba(77, 143, 216, 0.28);
  --color-overlay: rgba(0, 0, 0, 0.55);
  --color-meta: var(--color-text-muted);
  --mast-bg: var(--color-surface);
  --mast-nav: var(--color-bg-secondary);
  --mast-link: var(--color-text-secondary);
  --mast-link-hover: var(--color-heading);
  --mast-link-bg: var(--color-surface-hover);
  --mast-search-bg: var(--color-input);
  --header-line: var(--color-border);
  --mast-shadow: 0 1px 3px var(--color-shadow);
  --mast-active-bg: var(--color-primary-light);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 10px;
  --radius-2xl: 10px;
  --shadow-sm: 0 1px 3px var(--color-shadow);
  --shadow-md: 0 4px 12px var(--color-shadow);
  --shadow-lg: 0 8px 24px var(--color-shadow);
  --shadow-row: var(--shadow-md);
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 14.5px;
  --text-lg: 16px;
  --text-xl: 20px;
  --text-2xl: 26px;
  --text-3xl: 32px;
  --text-page: clamp(1.35rem, 2vw, 1.65rem);
  --text-section: 1.05rem;
  --text-row: 14.5px;
  --text-meta: 12px;
  --header-h: 142px;
  --rail-w: 0px;
  --frame-inner: min(1680px, calc(100% - 20px));
  --ease: 160ms ease;
  --motion-fast: 160ms ease;
  --motion-med: 220ms ease;
  --motion-slow: 300ms ease;
  --surface-tint: transparent;
  --surface-border: var(--color-border);
  --focus-ring: 0 0 0 3px var(--color-primary-light);
  --bg: var(--color-background);
  --bg-soft: var(--color-elevated);
  --card: var(--color-surface);
  --text: var(--color-text);
  --muted: var(--color-muted);
  --line: var(--color-border);
  --accent: var(--color-primary);
  --accent-2: var(--color-primary-hover);
  --danger: var(--color-danger);
  --ok: var(--color-success);
  --shadow: var(--shadow-sm);
  --radius: var(--radius-md);
  --color-placeholder: var(--color-input-placeholder);
  --color-input-bg: var(--color-input);
  --color-soft-primary: var(--color-primary-light);
  --color-soft-success: var(--color-success-light);
  --color-soft-warning: var(--color-warning-light);
  --color-soft-danger: var(--color-danger-light);
  --color-soft-info: var(--color-info-light);
  --color-soft-premium: rgba(139, 124, 240, 0.14);
  --btn-primary-bg: var(--color-primary);
  --color-on-primary: #ffffff;
  --font-ui: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --post-bg: var(--color-surface);
  --post-hover: var(--color-surface-hover);
  color-scheme: dark;
}
[data-theme="light"] {
  --color-bg: #f5f8fa;
  --color-bg-secondary: #ffffff;
  --color-bg-tertiary: #eef2f6;
  --color-surface: #ffffff;
  --color-surface-hover: #f3f7fa;
  --color-surface-active: #eaf3fc;
  --color-border: #e3eaf0;
  --color-border-light: #ecf1f5;
  --color-border-dark: #d5dee7;
  --color-text: #1f2937;
  --color-text-secondary: #4a5968;
  --color-text-muted: #5a6876;
  --color-heading: #1a2332;
  --color-primary: #2274b8;
  --color-primary-hover: #1b64a3;
  --color-primary-ink: #185f9a;
  --color-primary-ink-hover: #124e80;
  --color-primary-light: #eaf4fc;
  --color-accent: #6b5ce0;
  --color-accent-hover: #5a4bd0;
  --color-accent-light: #efedfc;
  --color-success: #15803d;
  --color-success-light: #eaf8f1;
  --color-warning: #b45309;
  --color-warning-light: #fff7e5;
  --color-danger: #c53030;
  --color-danger-light: #fdecec;
  --color-info: #2f80c9;
  --color-info-light: #eaf4fc;
  --color-input: #ffffff;
  --color-input-border: #d5dee7;
  --color-input-placeholder: #5f6e7d;
  --color-link: #185f9a;
  --color-link-hover: #124e80;
  --color-divider: #e3eaf0;
  --color-shadow: rgba(15, 23, 42, 0.08);

  --bg-page: var(--color-bg);
  --bg-page-secondary: var(--color-bg-tertiary);
  --surface: var(--color-surface);
  --surface-secondary: var(--color-bg-tertiary);
  --surface-hover: var(--color-surface-hover);
  --surface-active: var(--color-surface-active);
  --border: var(--color-border);
  --border-light: var(--color-border-light);
  --border-dark: var(--color-border-dark);
  --text-primary: var(--color-text);
  --text-secondary: var(--color-text-secondary);
  --text-muted: var(--color-text-muted);
  --text-disabled: #5f6e7d;
  --text-body: var(--color-text);
  --text-meta: var(--color-text-muted);
  --brand: var(--color-primary);
  --brand-hover: var(--color-primary-hover);
  --brand-active: #1f5f96;
  --brand-soft: var(--color-primary-light);
  --brand-border: #c9e2f5;

  --r10-light-bg: var(--color-bg);
  --r10-light-surface: var(--color-surface);
  --r10-light-surface-secondary: var(--color-bg-tertiary);
  --r10-light-secondary: var(--color-bg-tertiary);
  --r10-light-hover: var(--color-surface-hover);
  --r10-light-active: var(--color-surface-active);
  --r10-light-border: var(--color-border);
  --r10-light-text: var(--color-text);
  --r10-light-text-secondary: var(--color-text-secondary);
  --r10-light-text-muted: var(--color-text-muted);
  --r10-light-muted: var(--color-text-muted);
  --r10-light-text-disabled: #aab4c0;
  --r10-light-text-meta: var(--color-text-muted);

  /* R10: dark chrome on light page */
  --chrome-bg: #2f3345;
  --chrome-nav: #262a3a;
  --chrome-surface: #363b50;
  --chrome-hover: rgba(255, 255, 255, 0.06);
  --chrome-active-bg: rgba(47, 128, 201, 0.18);
  --chrome-text: #cbd5e1;
  --chrome-text-hover: #ffffff;
  --chrome-muted: #d5deea;
  --chrome-border: rgba(255, 255, 255, 0.08);
  --chrome-search: #3a4054;

  --r10-dark-bg: var(--chrome-nav);
  --r10-dark-surface: var(--chrome-bg);
  --r10-dark-secondary: var(--chrome-surface);
  --r10-dark-tertiary: #43485e;
  --r10-dark-text: #f8fafc;
  --r10-dark-text-secondary: var(--chrome-text);
  --r10-dark-muted: var(--chrome-muted);
  --r10-dark-border: var(--chrome-border);

  --r10-primary: var(--color-primary);
  --r10-primary-hover: var(--color-primary-hover);
  --r10-primary-active: #1f5f96;
  --r10-success: var(--color-success);
  --r10-warning: #e8a317;
  --r10-warning-strong: var(--color-warning);
  --r10-danger: var(--color-danger);
  --r10-info: var(--color-info);
  --r10-online: var(--color-success);
  --r10-link-visited: var(--color-link);

  --color-background: var(--color-bg);
  --color-surface-2: var(--color-bg-tertiary);
  --color-elevated: var(--color-bg-tertiary);
  --color-hover: var(--color-surface-hover);
  --color-active: var(--color-surface-active);
  --color-border-soft: var(--color-border-light);
  --color-muted: var(--color-text-muted);
  --color-disabled: #aab4c0;
  --color-placeholder: var(--color-input-placeholder);
  --color-meta: var(--color-text-muted);
  --color-body: var(--color-text);
  --color-primary-active: #1f5f96;
  --color-warning-strong: var(--color-warning);
  --color-premium: var(--color-accent);
  --color-online: var(--color-success);
  --color-link-visited: var(--color-link);
  --color-focus-ring: rgba(47, 128, 201, 0.16);
  --color-overlay: rgba(31, 41, 55, 0.45);
  --color-soft-primary: var(--color-primary-light);
  --color-soft-success: var(--color-success-light);
  --color-soft-warning: var(--color-warning-light);
  --color-soft-danger: var(--color-danger-light);
  --color-soft-info: var(--color-info-light);
  --color-soft-premium: var(--color-accent-light);
  --color-brand-border: var(--brand-border);
  --color-input-bg: var(--color-input);
  --btn-primary-bg: var(--color-primary);
  --color-on-primary: #ffffff;
  --shadow-sm: 0 1px 2px var(--color-shadow);
  --shadow-md: 0 4px 12px var(--color-shadow);
  --shadow-lg: 0 8px 24px var(--color-shadow);
  --accent-2: var(--color-primary-hover);

  --mast-bg: var(--chrome-bg);
  --mast-nav: var(--chrome-nav);
  --mast-link: var(--chrome-text);
  --mast-link-hover: var(--chrome-text-hover);
  --mast-link-bg: var(--chrome-hover);
  --mast-search-bg: var(--chrome-search);
  --header-line: var(--chrome-border);
  --mast-shadow: 0 2px 10px rgba(15, 23, 42, 0.18);
  --mast-active-bg: var(--chrome-active-bg);
  --post-bg: var(--color-surface);
  --post-hover: var(--color-surface-hover);
  --nx-catbar: #2f3345;
  --surface-border: var(--color-border);
  --focus-ring: 0 0 0 3px var(--color-primary-light);
  --bg: var(--color-background);
  --bg-soft: var(--color-elevated);
  --card: var(--color-surface);
  --text: var(--color-text);
  --muted: var(--color-muted);
  --line: var(--color-border);
  --accent: var(--color-primary);
  color-scheme: light;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
html { scroll-behavior: smooth; color-scheme: inherit; }
body {
  font-family: var(--font-ui, Inter, system-ui, "Segoe UI", sans-serif);
  background: var(--color-background);
  color: var(--color-text);
  font-size: var(--text-base);
  line-height: 1.55;
  font-weight: 400;
  transition: background-color .2s ease, color .2s ease;
}
a { color: var(--color-link, var(--color-primary)); text-decoration: none; }
a:hover { color: var(--color-link-hover, var(--color-primary-hover)); }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

h1, h2, h3 { color: var(--color-text); }
.nx-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: 40px; border: 0; border-radius: var(--radius-md); padding: 9px 16px;
  background: var(--btn-primary-bg);
  color: var(--color-on-primary, #fff); font-weight: 600; cursor: pointer;
  transition: background var(--ease), border-color var(--ease), color var(--ease), box-shadow var(--ease);
}
.nx-btn:hover { background: var(--color-primary-hover); color: var(--color-on-primary, #fff); }
.nx-btn:active { background: var(--color-primary-active); }
.nx-btn:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.nx-btn:disabled, .nx-btn.is-disabled, .nx-btn[aria-disabled="true"] {
  background: var(--color-disabled); color: #fff; cursor: not-allowed; pointer-events: none; opacity: .72;
}
.nx-btn--ghost {
  background: var(--color-elevated); color: var(--color-text);
  border: 1px solid var(--color-border);
}
.nx-btn--ghost:hover { background: var(--color-hover); color: var(--color-text); }
.nx-btn--ghost:active { background: var(--color-active); }
.nx-btn--block { width: 100%; }
.nx-iconbtn, .shell-icon, .icon-btn {
  width: 40px; height: 40px; display: inline-grid; place-items: center;
  border: 1px solid var(--color-border); background: var(--color-surface);
  color: var(--color-text); border-radius: var(--radius-md); cursor: pointer;
  position: relative; text-decoration: none;
  transition: background var(--ease), border-color var(--ease);
}
.nx-iconbtn:hover, .icon-btn:hover { background: var(--color-hover); }
.nx-card, .panel, .stat-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}
a.nx-card:hover, a.panel:hover, .forum-card:hover, .shop-card:hover, .thread-row:hover, .trend-card:hover {
  background: var(--color-hover);
}
.nx-card { padding: var(--space-6); }
.nx-muted { color: var(--color-muted); }
.nx-form { display: grid; gap: var(--space-3); }
.nx-form label { display: grid; gap: 6px; font-size: var(--text-sm); color: var(--color-text-secondary, var(--color-muted)); }
.nx-form input, .nx-form select, .nx-form textarea, .nx-search input {
  width: 100%; border: 1px solid var(--color-border); background: var(--color-input-bg);
  color: var(--color-text); border-radius: var(--radius-md); padding: 11px 12px;
  transition: border-color var(--ease), box-shadow var(--ease), background var(--ease);
}
.nx-form input::placeholder, .nx-form textarea::placeholder, .mast-search input::placeholder {
  color: var(--color-placeholder);
}
.nx-form input:focus, .nx-form select:focus, .nx-form textarea:focus, .nx-search input:focus {
  outline: 0; border-color: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.nx-form input:disabled, .nx-form select:disabled, .nx-form textarea:disabled {
  color: var(--color-disabled); background: var(--color-surface-2); cursor: not-allowed;
  border-color: var(--color-border-soft, var(--color-border));
}
.nx-form input.is-err, .nx-form textarea.is-err { border-color: var(--color-danger); }
.nx-form input.is-ok { border-color: var(--color-success); }
.nx-check { display: flex !important; align-items: center; gap: 8px; }
.nx-check input { width: auto; }
.nx-flash { border-radius: var(--radius-md); padding: 10px 12px; margin: 0 0 16px; }
.nx-flash--ok { background: var(--color-soft-success); color: var(--color-text); }
.nx-flash--err { background: var(--color-soft-danger); color: var(--color-text); }

/* Admin → müşteri hesap geçişi şeridi */
.impersonate-bar {
  position: sticky;
  top: 0;
  z-index: 1200;
  background: linear-gradient(90deg, #b45309, #c2410c);
  color: #fff7ed;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.22);
}
.impersonate-bar__inner {
  max-width: min(1560px, calc(100% - 28px));
  margin: 0 auto;
  min-height: 42px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 14px;
  padding: 8px 0;
}
.impersonate-bar p {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
}
.impersonate-bar p strong { font-weight: 800; }
.impersonate-bar p em {
  font-style: normal;
  opacity: .85;
  font-weight: 550;
}
.impersonate-bar__btn {
  appearance: none;
  border: 0;
  border-radius: 8px;
  min-height: 32px;
  padding: 0 12px;
  background: #fff;
  color: #9a3412;
  font-size: 12.5px;
  font-weight: 750;
  cursor: pointer;
  line-height: 1;
}
.impersonate-bar__btn:hover { background: #ffedd5; }
body.is-impersonating .mast--v10 { top: 0; }
.nx-err { color: var(--color-danger); }
.nx-ad, .yon-mark, .nxs-creative {
  display: grid; gap: 4px; border: 1px solid var(--color-border); border-radius: var(--radius-md);
  padding: 14px 16px; margin: 12px 0; background:
    linear-gradient(160deg, color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated)), var(--color-elevated));
  color: var(--color-text); text-decoration: none;
}
.nx-ad:hover, .yon-mark:hover, .nxs-creative:hover { color: var(--color-text); border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border)); }
.yon-mark__kicker, .nx-ad__label, .nxs-creative__label {
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--color-primary-ink, var(--color-primary)); font-weight: 800;
}
.nx-ad__label { font-size: 0; }
.nx-ad__label::after {
  content: "Yön Yazılım";
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--color-primary-ink, var(--color-primary)); font-weight: 800;
}
.yon-mark strong, .nx-ad strong, .nxs-creative strong { font-size: 15px; }
.yon-mark > span:not(.yon-mark__kicker), .nx-ad > span:not(.nx-ad__label), .nxs-creative > span:not(.nxs-creative__label) { color: var(--color-muted); font-size: 13px; }
.nxs-creative--media {
  padding: 0; margin: 0; overflow: hidden; gap: 0;
  background: var(--color-surface);
}
.nxs-creative--media img { display: block; max-width: 100%; height: auto; }
.nxs-creative--cta {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 16px; border-radius: 14px; text-decoration: none; color: #fff;
  background: var(--color-primary);
  border: 1px solid color-mix(in srgb, #93c5fd 35%, transparent);
}
.nxs-creative--cta .nxs-creative__ico {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px;
  background: color-mix(in srgb, #fff 18%, transparent); flex: none;
}
.nxs-creative--cta .nxs-creative__copy { display: grid; gap: 2px; min-width: 0; flex: 1; }
.nxs-creative--cta .nxs-creative__copy strong { font-size: 14.5px; font-weight: 780; color: #fff; }
.nxs-creative--cta .nxs-creative__copy small { color: color-mix(in srgb, #fff 78%, transparent); font-size: 12.5px; }
.nxs-creative--cta .nxs-creative__go {
  flex: none; padding: 7px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 750;
  background: color-mix(in srgb, #000 22%, transparent); color: #fff;
}
.nxs-creative--html { padding: 0; margin: 0; border: 0; background: transparent; }
.yon-mark-dock, .yon-mark-mobile, .yon-mark-mobile--v10, .nx-ad--mobile { display: none; }
.nx-sponsor { color: var(--color-muted); font-size: 13px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.app-root { min-height: 100vh; display: flex; flex-direction: column; }
.topbar {
  height: 64px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px;
  padding: 0 22px; border-bottom: 1px solid var(--color-border); background: var(--color-surface);
}
.topbar__nav { display: flex; justify-content: center; gap: 4px; }
.topbar__nav a { color: var(--color-muted); padding: 8px 12px; border-radius: 999px; font-weight: 500; font-size: 13px; }
.topbar__nav a:hover, .topbar__nav a.is-active { color: var(--color-text); background: var(--color-elevated); }
.yon-ico { display: block; flex: 0 0 auto; }
.mast {
  position: relative; top: auto; z-index: 40; overflow: visible;
  background: var(--mast-bg);
  border-bottom: 1px solid var(--header-line);
}
.mast.is-solid { box-shadow: var(--mast-shadow); }
.mast__top {
  position: relative; z-index: 70;
  background: var(--mast-bg);
  color: var(--mast-link-hover);
}
.mast__inner {
  width: min(1440px, calc(100% - 32px));
  margin: 0 auto; min-height: 68px;
  display: grid; grid-template-columns: auto minmax(280px, 1fr) auto;
  align-items: center; gap: 18px;
  padding: 8px 0;
  color: var(--mast-link-hover);
}
.mast__inner--rich {
  position: relative;
}
.mast-center {
  display: grid; gap: 7px; min-width: 0; justify-items: stretch;
}
.mast-tools {
  display: inline-flex; align-items: center; gap: 2px;
  padding: 3px; border-radius: 14px;
  border: 1px solid var(--header-line);
  background: var(--mast-link-bg);
}
.mast-auth {
  display: inline-flex; align-items: center; gap: 8px;
}
.mast__promo {
  background: color-mix(in srgb, var(--color-primary) 18%, var(--r10-dark-bg));
  color: var(--r10-dark-text);
  border-bottom: 1px solid var(--header-line);
}
.mast__promo-inner {
  width: min(1440px, calc(100% - 32px)); margin: 0 auto;
  min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.mast__promo p { margin: 0; font-size: 13px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--r10-dark-text-secondary); }
.mast__promo strong { margin-right: 8px; color: var(--r10-dark-text); }
.mast__promo button {
  border: 0; background: var(--mast-link-bg); color: var(--r10-dark-text); font-size: 18px; line-height: 1;
  width: 28px; height: 28px; border-radius: 8px; cursor: pointer;
}
.mast__promo[hidden] { display: none !important; }
.apps-wrap { position: relative; z-index: 56; }
.apps-btn .yon-ico { opacity: .92; }
.apps-panel {
  display: none !important; position: absolute !important; left: 0; top: 100%; z-index: 56;
  width: min(420px, 92vw); padding: 10px 0 0; background: transparent; border: 0; box-shadow: none;
}
.apps-wrap.is-open .apps-panel, .apps-wrap:hover .apps-panel { display: grid !important; }
.apps-sheet {
  padding: 14px; background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: 14px; box-shadow: var(--shadow-lg);
}
.apps-panel > strong, .apps-sheet > strong { display: block; margin-bottom: 10px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--color-muted); }
.apps-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.apps-grid a {
  display: grid; justify-items: center; gap: 4px; padding: 10px 6px; border-radius: 12px;
  color: var(--color-text); text-align: center; background: var(--color-elevated); border: 1px solid transparent;
}
.apps-grid a:hover { background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated)); color: var(--color-text); border-color: color-mix(in srgb, var(--color-primary) 22%, var(--color-border)); }
.apps-grid em {
  width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px;
  background: linear-gradient(160deg, var(--color-primary), var(--color-primary-hover)); color: #fff; font-style: normal; font-weight: 800;
}
.apps-grid span { font-size: 12px; font-weight: 700; }
.apps-grid small { color: var(--color-muted); font-size: 10px; }
.topbar__brand-wrap { display: flex; gap: 8px; align-items: center; }
.mast-brand, .topbar__brand {
  display: flex; align-items: center; gap: 10px; color: var(--mast-link-hover); font-weight: 700;
}
.mast-brand:hover { color: var(--mast-link-hover); }
.mast-brand__text { display: grid; line-height: 1.15; }
.mast-brand__text strong { font-size: 15px; letter-spacing: -.02em; }
.mast-brand__text small { color: var(--mast-link); font-size: 11px; font-weight: 500; }
.topbar__mark, .nx-logo__mark, .shell-brand__mark {
  width: 38px; height: 38px; display: grid; place-items: center;
  border-radius: 12px; color: #fff; font-weight: 800;
  background: linear-gradient(160deg, var(--color-primary), var(--color-primary-hover));
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-primary) 32%, transparent);
}
.topbar__tools { display: flex; align-items: center; gap: 8px; position: relative; z-index: 62; overflow: visible; }
.topbar__split { width: 1px; height: 22px; background: var(--header-line); margin: 0 4px; flex: 0 0 auto; }
.mast .nx-btn { height: 38px; padding: 0 14px; border-radius: 11px; font-size: 13px; }
.mast .nx-btn--ghost { background: transparent; border-color: var(--header-line); color: var(--mast-link-hover); }
.icon-btn .yon-ico { pointer-events: none; }
.mast-search {
  justify-self: stretch; width: 100%; max-width: 640px; height: 42px; display: flex;
  align-items: center; gap: 8px;
  padding: 0 12px 0 14px; border: 1px solid var(--header-line); border-radius: 12px;
  background: var(--mast-search-bg); color: var(--mast-link);
  transition: border-color var(--ease), box-shadow var(--ease), background var(--ease);
}
.mast-search:hover {
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--header-line));
}
.mast-search:focus-within {
  border-color: color-mix(in srgb, var(--color-primary) 55%, var(--header-line));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 18%, transparent);
  background: color-mix(in srgb, var(--mast-search-bg) 80%, var(--r10-dark-tertiary));
}
.mast-search__ico { display: grid; opacity: .7; }
.mast-search input {
  flex: 1; border: 0; background: transparent; color: var(--mast-link-hover); outline: none; min-width: 0;
}
.mast-search__cmd {
  border: 0; background: var(--r10-dark-tertiary); color: var(--mast-link); font-size: 11px; cursor: default;
  padding: 4px 7px; border-radius: 7px; border: 1px solid var(--header-line);
  font-family: inherit; line-height: 1;
}
.topbar-search {
  justify-self: center; width: min(420px, 100%); height: 40px; display: flex;
  align-items: center; justify-content: space-between; gap: 12px;
  padding: 0 12px; border: 1px solid var(--color-border); border-radius: 999px;
  background: var(--color-surface); color: var(--color-muted); cursor: pointer;
}
.topbar-search kbd {
  font-size: 11px; padding: 2px 6px; border: 1px solid var(--color-border); border-radius: 6px;
}
.mast .mast-ico, .mast .icon-btn.mast-ico {
  width: 38px; height: 38px; border: 0; background: transparent; border-radius: 11px; color: var(--mast-link-hover);
}
.mast .mast-ico .yon-ico { opacity: .92; }
.mast .mast-ico:hover { background: var(--mast-link-bg); }
.mast .mast-ico:hover .yon-ico { opacity: 1; }
.menu-btn { display: none; }
.menubar {
  position: relative; z-index: 40;
  background: var(--mast-nav);
  border-top: 1px solid var(--header-line);
}
.menubar__inner {
  width: min(1440px, calc(100% - 32px)); margin: 0 auto;
  display: flex; align-items: stretch; gap: 8px; padding: 0;
}
.menubar__links { display: flex; flex-wrap: nowrap; gap: 2px; min-width: 0; overflow: visible; }
.menubar__end { margin-left: auto; display: flex; align-items: center; flex: 0 0 auto; min-height: 44px; }
.menubar__link, .menubar__drop > button {
  border: 0; background: transparent; color: var(--mast-link);
  padding: 12px 13px; border-radius: 0; font-weight: 600; font-size: 13px; cursor: pointer;
  letter-spacing: -.01em; transition: color var(--ease), background var(--ease);
  display: inline-flex; align-items: center; gap: 7px; text-decoration: none;
}
.menubar__link .yon-ico, .menubar__drop > button .yon-ico {
  color: var(--mast-link); opacity: .9; flex: 0 0 auto;
}
.menubar__link:hover .yon-ico, .menubar__link.is-active .yon-ico,
.menubar__drop:hover > button .yon-ico { color: var(--mast-link-hover); }
.menubar__link i {
  display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: 2px;
  border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid currentColor; opacity: .7;
}
.menubar__link:hover, .menubar__link.is-active, .menubar__drop:hover > button, .menubar__drop:focus-within > button {
  color: var(--mast-link-hover); background: var(--mast-link-bg);
}
.menubar__link.is-active { box-shadow: inset 0 -2px 0 var(--color-primary); }
.menubar__drop { position: relative; }
.menubar__menu {
  display: none; position: absolute; top: 100%; left: 0; min-width: 210px;
  background: var(--r10-dark-surface); border: 1px solid var(--r10-dark-border); border-radius: 0 0 12px 12px;
  box-shadow: 0 12px 28px rgba(16, 18, 32, .28); padding: 6px 0; z-index: 45;
  color: var(--r10-dark-text);
}
.menubar__drop::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 4px; }
.menubar__drop:hover .menubar__menu, .menubar__drop:focus-within .menubar__menu, .menubar__drop.is-open .menubar__menu { display: grid; }
.menubar__menu a {
  color: var(--r10-dark-text); padding: 9px 14px; border-radius: 0; font-size: 13px;
}
.menubar__menu a:hover { background: var(--r10-dark-secondary); color: var(--r10-dark-text); }

/* Menubar v10 ? chip links, solid dropdowns, 1560 frame */
.menubar--v10 {
  position: relative;
  z-index: 45;
  overflow: visible;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--r10-dark-secondary) 35%, transparent), transparent 100%),
    var(--mast-nav);
  border-top: 1px solid color-mix(in srgb, var(--header-line) 88%, var(--color-primary));
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 3%, transparent) inset;
}
.menubar--v10 .menubar__inner--v10 {
  width: min(1680px, calc(100% - 20px));
  gap: 10px;
  min-height: 52px;
  padding: 6px 0;
  align-items: center;
}
.menubar--v10 .menubar__links {
  display: flex; flex-wrap: nowrap; gap: 4px; align-items: center;
  min-width: 0; overflow: visible;
}
.menubar--v10 .menubar__link,
.menubar--v10 .menubar__drop > button.menubar__link {
  border: 1px solid transparent;
  background: transparent;
  color: var(--mast-link);
  min-height: 38px;
  padding: 0 12px;
  border-radius: 11px;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  letter-spacing: -.01em;
  transition: color .12s ease, background .12s ease, border-color .12s ease;
  display: inline-flex; align-items: center; gap: 8px; text-decoration: none;
  white-space: nowrap;
}
.menubar--v10 .menubar__link .yon-ico,
.menubar--v10 .menubar__drop > button .yon-ico {
  color: var(--mast-link);
  opacity: .92;
  flex: 0 0 auto;
}
.menubar--v10 .menubar__caret {
  display: inline-block; width: 0; height: 0; margin-left: 2px;
  border-left: 4px solid transparent; border-right: 4px solid transparent;
  border-top: 4px solid currentColor; opacity: .65;
}
.menubar--v10 .menubar__link:hover,
.menubar--v10 .menubar__link.is-active,
.menubar--v10 .menubar__drop:hover > button,
.menubar--v10 .menubar__drop:focus-within > button,
.menubar--v10 .menubar__drop.is-open > button {
  color: var(--mast-link-hover);
  background: var(--mast-link-bg);
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--header-line));
  box-shadow: none;
}
.menubar--v10 .menubar__link.is-active {
  background: var(--mast-active-bg, color-mix(in srgb, var(--color-primary) 14%, transparent));
  box-shadow: inset 0 -2px 0 var(--color-primary);
}
.menubar--v10 .menubar__link:hover .yon-ico,
.menubar--v10 .menubar__link.is-active .yon-ico,
.menubar--v10 .menubar__drop:hover > button .yon-ico {
  color: var(--mast-link-hover);
}
.menubar--v10 .menubar__drop { position: relative; z-index: 1; }
.menubar--v10 .menubar__drop:hover,
.menubar--v10 .menubar__drop:focus-within,
.menubar--v10 .menubar__drop.is-open { z-index: 80; }
.menubar--v10 .menubar__drop::after {
  content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 10px;
}
.menubar--v10 .menubar__menu {
  display: none;
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 90;
  min-width: 240px; max-height: none; overflow: visible;
  padding: 8px;
  border-radius: 14px;
  border: 1px solid var(--r10-dark-border);
  background: var(--r10-dark-surface);
  box-shadow: 0 18px 44px rgba(16, 18, 32, .38);
  gap: 2px;
  color: var(--r10-dark-text);
}
.menubar--v10 .menubar__drop:hover .menubar__menu,
.menubar--v10 .menubar__drop:focus-within .menubar__menu,
.menubar--v10 .menubar__drop.is-open .menubar__menu {
  display: grid;
}
.menubar--v10 .menubar__menu a {
  display: flex; align-items: center; gap: 9px;
  color: var(--r10-dark-text);
  padding: 10px 11px;
  border-radius: 9px;
  font-size: 13.5px;
  font-weight: 650;
  text-decoration: none;
}
.menubar--v10 .menubar__menu a .yon-ico {
  color: var(--r10-primary); flex: none; opacity: .95;
}
.menubar--v10 .menubar__menu a:hover {
  background: var(--r10-dark-secondary);
  color: var(--r10-dark-text);
}
.menubar--v10 .menubar__end--v10 {
  margin-left: auto;
  display: flex; align-items: center; gap: 8px;
  flex: 0 0 auto; min-height: 44px;
  max-width: 100%;
}
.menubar--v10 .menubar__chip {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 34px; padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--header-line);
  background: var(--mast-link-bg);
  color: var(--mast-link); font-size: 12.5px; font-weight: 750; text-decoration: none;
  flex: 0 0 auto; white-space: nowrap;
}
.menubar--v10 .menubar__chip .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.menubar--v10 .menubar__chip:hover {
  background: var(--mast-active-bg, color-mix(in srgb, var(--color-primary) 14%, transparent));
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--header-line));
  color: var(--mast-link-hover);
}
.menubar--v10 .menubar__chip--soft {
  border-color: var(--header-line);
  background: var(--mast-link-bg);
  color: var(--mast-link);
}
.menubar--v10 .menubar__chip--soft:hover { color: var(--mast-link-hover); }
.menubar--v10 .theme-bar {
  min-height: 38px;
  padding: 0 8px 0 12px;
  border-radius: 12px;
  border: 1px solid var(--header-line);
  background: var(--mast-link-bg);
}
.menubar--v10 .theme-bar__label { font-size: 12.5px; font-weight: 700; color: var(--mast-link); }

@media (max-width: 1280px) {
  .menubar--v10 .menubar__link span { font-size: 12.5px; }
  .menubar--v10 .menubar__link,
  .menubar--v10 .menubar__drop > button.menubar__link { padding: 0 10px; }
  .menubar--v10 .theme-bar__label span { display: none; }
  .menubar--v10 .theme-bar { padding: 0 6px; gap: 0; }
  .menubar--v10 .menubar__chip span { display: none; }
  .menubar--v10 .menubar__chip { width: 34px; padding: 0; justify-content: center; }
}
@media (max-width: 1100px) {
  .menubar--v10 a.menubar__link[href="/"] { display: none; }
}

.theme-bar {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 0 4px 0 10px; height: 100%; flex: 0 0 auto;
  position: relative; z-index: 1;
}
.theme-bar__label {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--mast-link); font-size: 13px; font-weight: 600; white-space: nowrap;
}
.theme-bar__label .yon-ico { color: var(--color-primary-ink, var(--color-primary)); opacity: .95; }
.theme-bar form { margin: 0; display: flex; align-items: center; }
.theme-toggle {
  --knob: 22px;
  position: relative; width: 56px; height: 26px; padding: 0; border: 0;
  border-radius: 999px; background: #151821; cursor: pointer; flex: 0 0 auto;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
.theme-toggle__icon {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 22px; height: 22px; display: grid; place-items: center;
  color: #6b7085; pointer-events: none; z-index: 1;
}
.theme-toggle__icon .yon-ico { display: block; }
.theme-toggle__icon--sun { left: 2px; }
.theme-toggle__icon--moon { right: 2px; }
.theme-toggle__knob {
  position: absolute; top: 2px; left: 2px; width: var(--knob); height: var(--knob);
  border-radius: 50%; background: #2c3142; box-shadow: 0 1px 3px rgba(0,0,0,.45);
  transition: transform .2s ease; z-index: 2; pointer-events: none;
}
.theme-toggle.is-dark .theme-toggle__knob { transform: translateX(30px); }
.theme-toggle.is-dark .theme-toggle__icon--moon,
.theme-toggle.is-light .theme-toggle__icon--sun { color: #f5f6fa; z-index: 3; }
.theme-toggle.is-light .theme-toggle__icon--sun { color: #f5c14a; }
.theme-toggle.is-light { background: #d9dee8; }
[data-theme="light"] .theme-toggle { background: #151821; }
[data-theme="light"] .theme-toggle__knob { background: #2c3142; }
[data-theme="light"] .theme-toggle__icon { color: #6b7085; }
[data-theme="light"] .theme-bar__label { color: var(--mast-link); }
.theme-switch-host--mast { display: none !important; }
.mast-search--mob { display: none; }

/* Mast top v10 ? wider bar, CTA, richer search/quick row */
.mast--v10 {
  z-index: 60;
  position: relative;
}
.mast__top--v10 {
  position: relative;
  z-index: 70;
  overflow: visible;
  color: var(--mast-link-hover);
  background:
    linear-gradient(125deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 42%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 7%, transparent), transparent 72%),
    var(--mast-bg);
}
.mast__top--v10 .mast__inner--v10 {
  width: min(1680px, calc(100% - 20px));
  min-height: 76px;
  gap: 20px;
  padding: 12px 0 14px;
  align-items: center;
  color: var(--mast-link-hover);
}
.mast__top-line {
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 12%, transparent) 55%, transparent);
  opacity: .85;
}
.mast-brand--v10 {
  gap: 12px;
  padding: 4px 8px 4px 4px;
  border-radius: 14px;
  border: 1px solid transparent;
  transition: background .14s ease, border-color .14s ease;
}
.mast-brand--v10:hover {
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--header-line));
  background: color-mix(in srgb, var(--mast-link-bg) 55%, transparent);
}
.mast-brand__mark,
.mast__top--v10 .topbar__mark {
  width: 44px; height: 44px; border-radius: 13px; font-size: 18px;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--color-primary) 14%, transparent),
    0 10px 22px color-mix(in srgb, var(--color-primary) 30%, transparent);
}
.mast-brand__logo {
  display: block; height: 40px; width: auto; max-width: min(220px, 48vw);
  object-fit: contain; flex: none; border-radius: 8px;
}
.mast-brand.has-logo { gap: 0; }
.mast-brand.has-logo .brand-logo--dark + .brand-logo--light,
.site-foot__logo .brand-logo--dark + .brand-logo--light,
.nx-logo.has-logo .brand-logo--dark + .brand-logo--light { margin-left: 0; }
.site-foot__logo {
  display: grid; place-items: center; flex: 0 0 auto;
  height: 48px; max-width: 220px; text-decoration: none;
}
.site-foot__logo img,
.site-foot__logo-img {
  display: block; max-height: 48px; max-width: 180px; width: auto; height: auto; object-fit: contain;
}
.nx-logo.has-logo { gap: 0; }
.nx-logo__img { display: block; height: 36px; width: auto; max-width: 200px; object-fit: contain; }

/* Siyah / beyaz temaya uyarlı logo — chrome (mast/menü/footer) her zaman açık silüet */
[data-theme="dark"] .brand-logo--adapt {
  filter: brightness(0) invert(1);
}
[data-theme="light"] .brand-logo--adapt {
  filter: brightness(0);
}
[data-theme="light"] .mast .brand-logo--adapt,
[data-theme="light"] .menubar .brand-logo--adapt {
  filter: brightness(0) invert(1);
}
[data-theme="dark"] .brand-logo--light { display: none !important; }
[data-theme="light"] .brand-logo--dark { display: none !important; }
[data-theme="light"] .brand-logo--light { display: block; }
[data-theme="light"] .mast .brand-logo--dark,
[data-theme="light"] .menubar .brand-logo--dark { display: block !important; }
[data-theme="light"] .mast .brand-logo--light,
[data-theme="light"] .menubar .brand-logo--light { display: none !important; }
.mast__top--v10 .mast-brand__text strong {
  font-size: 16px; letter-spacing: -.025em; font-weight: 800;
}
.mast__top--v10 .mast-brand__text small {
  font-size: 11.5px; font-weight: 600;
}
.mast-center--v10 {
  gap: 0; max-width: 720px; justify-self: center; width: 100%;
  position: relative; z-index: 70;
}
.mast-search--v10 {
  position: relative;
  height: 46px; max-width: none; border-radius: 12px;
  padding: 0 10px 0 14px; gap: 10px;
  border-color: color-mix(in srgb, var(--header-line) 70%, transparent);
  background: color-mix(in srgb, var(--mast-search-bg) 92%, var(--r10-dark-tertiary));
}
.mast-search--v10:focus-within,
.mast-center--v10.is-open .mast-search--v10 {
  border-color: color-mix(in srgb, var(--header-line) 80%, transparent);
  box-shadow: 0 8px 28px color-mix(in srgb, #000 28%, transparent);
  background: color-mix(in srgb, var(--mast-search-bg) 70%, var(--r10-dark-tertiary));
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  z-index: 72;
}
.mast-search--v10 input { font-size: 14.5px; }
.mast-search--v10 .mast-search__cmd { display: none; }
.mast-search__adv {
  display: inline-flex; align-items: center; gap: 5px;
  height: 30px; padding: 0 10px; border-radius: 9px;
  border: 1px solid var(--header-line);
  background: color-mix(in srgb, #fff 6%, transparent);
  color: var(--mast-link); font-size: 12px; font-weight: 700; text-decoration: none; flex: none;
}
.mast-search__adv .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.mast-search__adv:hover {
  color: var(--mast-link-hover);
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--header-line));
  background: var(--mast-link-bg);
}
.mast-center--v10.is-open .mast-search__adv { opacity: .55; }

/* Mast live suggest (SON ARAMALAR / SONUÇLAR) */
.mast-suggest {
  --ms-pad-x: 14px;
  position: absolute;
  left: -1px; right: -1px; top: calc(100% - 1px);
  z-index: 71;
  display: flex; flex-direction: column;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--color-border) 75%, transparent);
  border-top: 0;
  border-radius: 0 0 14px 14px;
  background: color-mix(in srgb, var(--color-elevated) 28%, var(--color-surface));
  box-shadow:
    0 22px 48px color-mix(in srgb, #000 42%, transparent),
    0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  max-height: min(72vh, 560px);
  overflow: hidden;
  overscroll-behavior: contain;
}
.mast-suggest[hidden] { display: none !important; }
.mast-suggest::before {
  content: "";
  position: absolute;
  top: -7px; left: 22px;
  width: 12px; height: 12px;
  background: inherit;
  border-left: 1px solid color-mix(in srgb, var(--color-border) 75%, transparent);
  border-top: 1px solid color-mix(in srgb, var(--color-border) 75%, transparent);
  transform: rotate(45deg);
  z-index: 2;
  box-shadow: -2px -2px 6px color-mix(in srgb, #000 8%, transparent);
}
.mast-suggest__scroll {
  flex: 1; min-height: 0;
  overflow: auto;
  padding: 12px 0 4px;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--color-text) 28%, transparent) transparent;
}
.mast-suggest__scroll::-webkit-scrollbar { width: 6px; }
.mast-suggest__scroll::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--color-text) 28%, transparent);
  border-radius: 99px;
}
.mast-suggest__head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 2px var(--ms-pad-x) 10px;
}
.mast-suggest__head-label {
  font-size: 11px; font-weight: 780; letter-spacing: .08em;
  text-transform: uppercase; color: var(--color-muted);
}
.mast-suggest__head-meta {
  font-size: 11px; font-weight: 650; color: var(--color-muted); opacity: .85;
}
.mast-suggest__section {
  padding: 2px 0 4px;
}
.mast-suggest__section + .mast-suggest__section { margin-top: 2px; }
.mast-suggest__section-title {
  display: flex; align-items: center; gap: 8px;
  padding: 8px var(--ms-pad-x) 6px;
  font-size: 13.5px; font-weight: 800; color: var(--color-text);
}
.mast-suggest__count {
  display: inline-grid; place-items: center;
  min-width: 20px; height: 18px; padding: 0 6px;
  border-radius: 999px;
  font-size: 10.5px; font-weight: 780;
  background: color-mix(in srgb, var(--color-primary) 16%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}
.mast-suggest__list { list-style: none; margin: 0; padding: 0; }
.mast-suggest__item {
  display: flex; align-items: center; gap: 10px;
  min-height: 42px; padding: 6px 10px 6px var(--ms-pad-x);
  color: var(--color-text); text-decoration: none;
  font-size: 14px; font-weight: 550;
  border-radius: 0;
  transition: background .12s ease;
}
.mast-suggest__item:hover,
.mast-suggest__item.is-active {
  background: color-mix(in srgb, var(--color-hover) 88%, transparent);
}
.mast-suggest__item-ico {
  flex: none; display: grid; place-items: center;
  width: 28px; height: 28px; border-radius: 8px;
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
  color: var(--color-muted);
}
.mast-suggest__item-body {
  flex: 1; min-width: 0; display: grid; gap: 2px;
}
.mast-suggest__item-text {
  min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  line-height: 1.25;
}
.mast-suggest__item-meta {
  font-size: 11.5px; font-weight: 600; color: var(--color-muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mast-suggest__mark {
  color: var(--color-warning);
  font-weight: 780;
  background: color-mix(in srgb, var(--color-warning) 16%, transparent);
  border-radius: 3px;
  padding: 0 1px;
}
.mast-suggest__x {
  flex: none; display: grid; place-items: center;
  width: 30px; height: 30px; border: 0; border-radius: 8px;
  background: transparent; color: var(--color-muted); cursor: pointer;
  opacity: .7; transition: opacity .12s ease, background .12s ease, color .12s ease;
}
.mast-suggest__item:hover .mast-suggest__x { opacity: 1; }
.mast-suggest__x:hover {
  color: var(--color-danger);
  background: color-mix(in srgb, var(--color-danger) 12%, transparent);
  opacity: 1;
}
.mast-suggest__user-row {
  display: flex; align-items: center; gap: 2px;
  padding-right: 8px;
}
.mast-suggest__user {
  display: flex; align-items: center; gap: 10px;
  flex: 1; min-width: 0;
  min-height: 46px; padding: 5px 8px 5px var(--ms-pad-x);
  color: var(--color-text); text-decoration: none;
  transition: background .12s ease;
}
.mast-suggest__user:hover,
.mast-suggest__user.is-active,
.mast-suggest__user-row:has(.mast-suggest__user.is-active),
.mast-suggest__user-row:hover .mast-suggest__user {
  background: color-mix(in srgb, var(--color-hover) 88%, transparent);
}
.mast-suggest__av {
  flex: none; width: 30px; height: 30px; border-radius: 7px;
  object-fit: cover; display: grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 22%, var(--color-elevated));
  color: var(--color-text); font-size: 11px; font-weight: 800;
  overflow: hidden;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-border) 70%, transparent);
}
.mast-suggest__av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mast-suggest__uname {
  flex: 1; min-width: 0; font-size: 14px; font-weight: 650;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mast-suggest__uname.is-rank { font-weight: 800; }
.mast-suggest__msg {
  flex: none; display: grid; place-items: center;
  width: 32px; height: 32px; border-radius: 9px;
  color: var(--color-muted); text-decoration: none;
  transition: color .12s ease, background .12s ease;
}
.mast-suggest__msg:hover {
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
}
.mast-suggest__rule {
  position: relative;
  height: 16px; margin: 8px 16px 6px;
  display: flex; align-items: center;
}
.mast-suggest__rule::before {
  content: "";
  flex: 1; height: 2px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--color-text) 8%, transparent),
    color-mix(in srgb, var(--color-text) 55%, transparent) 12%,
    color-mix(in srgb, var(--color-text) 55%, transparent) 88%,
    color-mix(in srgb, var(--color-text) 8%, transparent)
  );
  border-radius: 2px;
}
.mast-suggest__rule::after,
.mast-suggest__rule > i {
  content: "";
  position: absolute; top: 50%;
  width: 0; height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  transform: translateY(-50%);
}
.mast-suggest__rule::after {
  left: 0;
  border-right: 5px solid color-mix(in srgb, var(--color-text) 55%, transparent);
}
.mast-suggest__rule > i {
  right: 0; left: auto;
  border-left: 5px solid color-mix(in srgb, var(--color-text) 55%, transparent);
}
.mast-suggest__footer {
  flex: none;
  padding: 4px 0 10px;
  border-top: 1px solid color-mix(in srgb, var(--color-border) 55%, transparent);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.mast-suggest__clear {
  display: block; width: 100%;
  border: 0; background: transparent; cursor: pointer;
  padding: 10px 16px 4px;
  text-align: center;
  font-size: 13.5px; font-weight: 650;
  color: var(--color-text);
  transition: color .12s ease;
}
.mast-suggest__clear:hover { color: var(--color-danger); }
.mast-suggest__empty {
  display: grid; gap: 8px; place-items: center;
  padding: 22px 18px 16px;
  text-align: center;
}
.mast-suggest__empty-ico {
  display: grid; place-items: center;
  width: 44px; height: 44px; border-radius: 14px;
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}
.mast-suggest__empty strong {
  font-size: 13.5px; font-weight: 750; color: var(--color-text);
}
.mast-suggest__empty span {
  font-size: 12.5px; color: var(--color-muted); line-height: 1.4;
}
.mast-suggest__foot {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  margin: 4px 12px 0; padding: 10px 12px;
  border-radius: 10px;
  text-align: center; font-size: 13px; font-weight: 700;
  color: var(--color-primary-ink, var(--color-primary)); text-decoration: none;
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, transparent);
  transition: background .12s ease, border-color .12s ease;
}
.mast-suggest__foot:hover {
  background: color-mix(in srgb, var(--color-primary) 16%, transparent);
  border-color: color-mix(in srgb, var(--color-primary) 40%, transparent);
  text-decoration: none;
}
.mast-suggest__loading {
  display: grid; gap: 8px; padding: 8px var(--ms-pad-x) 12px;
}
.mast-suggest__skel {
  height: 36px; border-radius: 9px;
  background: linear-gradient(
    90deg,
    color-mix(in srgb, var(--color-text) 5%, transparent) 0%,
    color-mix(in srgb, var(--color-text) 10%, transparent) 45%,
    color-mix(in srgb, var(--color-text) 5%, transparent) 100%
  );
  background-size: 200% 100%;
  animation: mast-skel 1.1s ease-in-out infinite;
}
@keyframes mast-skel {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}
.mast-suggest__tips {
  display: flex; flex-wrap: wrap; gap: 6px;
  justify-content: center;
  padding: 4px 14px 12px;
}
.mast-suggest__chip {
  display: inline-flex; align-items: center; gap: 5px;
  height: 28px; padding: 0 10px; border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
  color: var(--color-text); font-size: 12px; font-weight: 650;
  text-decoration: none; cursor: pointer;
}
.mast-suggest__chip:hover {
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
}

[data-theme="light"] .mast-suggest {
  background: var(--color-surface);
  box-shadow: var(--shadow-md);
}
[data-theme="light"] .mast-suggest::before {
  background: var(--color-surface);
}
[data-theme="light"] .mast-suggest__footer {
  background: var(--color-elevated);
}
[data-theme="light"] .mast-suggest__rule::before {
  background: linear-gradient(
    90deg,
    transparent,
    color-mix(in srgb, var(--color-text) 28%, transparent) 12%,
    color-mix(in srgb, var(--color-text) 28%, transparent) 88%,
    transparent
  );
}
[data-theme="light"] .mast-suggest__rule::after {
  border-right-color: color-mix(in srgb, var(--color-text) 28%, transparent);
}
[data-theme="light"] .mast-suggest__rule > i {
  border-left-color: color-mix(in srgb, var(--color-text) 28%, transparent);
}
[data-theme="light"] .mast-suggest__mark {
  color: var(--color-warning-strong, #D89522);
  background: var(--color-soft-warning);
}
.mast-tools-wrap {
  display: flex; align-items: center; gap: 10px;
  position: relative; z-index: 62; overflow: visible;
}
.mast-cta {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 42px; padding: 0 14px 0 8px;
  border-radius: 12px; border: 1px solid transparent;
  background: var(--color-primary); color: #fff;
  font-size: 13.5px; font-weight: 780; text-decoration: none;
  letter-spacing: .01em; white-space: nowrap;
}
.mast-cta__ico {
  display: grid; place-items: center;
  width: 28px; height: 28px; border-radius: 8px;
  background: color-mix(in srgb, #000 18%, transparent);
}
.mast-cta .yon-ico { color: #fff; }
.mast-cta:hover { filter: brightness(1.06); color: #fff; }
.mast-tools--v10 {
  gap: 3px; padding: 4px; border-radius: 15px;
  background: var(--mast-link-bg);
  border-color: var(--header-line);
}
.mast__top--v10 .mast-ico,
.mast__top--v10 .icon-btn.mast-ico {
  width: 40px; height: 40px; border-radius: 12px;
}
.mast-auth--v10 { gap: 9px; }
.mast-auth--v10 .mast-auth__login {
  min-height: 42px; padding: 0 16px; border-radius: 12px; font-weight: 700;
}
.mast--v10 .mast-drop { position: relative; z-index: 1; }
.mast--v10 .mast-drop.is-open,
.mast--v10 .mast-drop:hover,
.mast--v10 .mast-drop:focus-within { z-index: 80; }
.mast--v10 .mast-drop__panel {
  z-index: 90;
  overflow: visible;
  border-radius: 14px;
  border-color: var(--r10-dark-border);
  box-shadow: 0 20px 48px rgba(16, 18, 32, .40);
  background: var(--r10-dark-surface);
  color: var(--r10-dark-text);
}
.mast--v10 .mast-drop__list {
  max-height: min(360px, 55vh);
  overflow: auto;
  background: var(--r10-dark-surface);
}
.mast--v10 .mast-tools-wrap,
.mast--v10 .mast-tools--v10 {
  overflow: visible;
  position: relative;
  z-index: 75;
}
.mast--v10 .mast__promo-inner {
  width: min(1680px, calc(100% - 20px));
}

@media (max-width: 1280px) {
  .mast-search__adv span { display: none; }
  .mast-search__adv { padding: 0 8px; }
}
@media (max-width: 1180px) {
  .mast__top--v10 .mast-cta span:not(.mast-cta__ico) { display: none; }
  .mast__top--v10 .mast-cta { padding: 0 8px; min-width: 42px; justify-content: center; }
  .mast__top--v10 .mast-cta__ico { width: 28px; height: 28px; }
}
@media (max-width: 980px) {
  .mast__top--v10 .mast__inner--v10 {
    min-height: 64px; padding: 8px 0 10px; gap: 8px;
  }
  .mast__top--v10 .mast-cta { display: none; }
  .mast-brand__mark,
  .mast__top--v10 .topbar__mark { width: 38px; height: 38px; font-size: 15px; }
}

.shop { display: grid; gap: 18px; }
.shop-hero {
  display: flex; justify-content: space-between; gap: 16px; align-items: flex-start;
  padding: 8px 0 4px;
}
.shop-hero h1 { margin: 4px 0 8px; font-size: clamp(1.4rem, 3vw, 2rem); }
.shop-hero__meta { display: grid; justify-items: end; gap: 6px; text-align: right; }
.shop-hero__meta strong { font-size: 18px; }
.shop-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.shop-card {
  display: grid; align-content: start; gap: 10px;
  padding: 18px; border: 1px solid var(--color-border); border-radius: 16px;
  background: var(--color-surface);
}
.shop-card.is-hot { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-primary) 45%, var(--color-border)); }
.shop-card > p, .shop-card small { margin: 0; color: var(--color-muted); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.shop-card h2 { margin: 0; font-size: 18px; }
.shop-card b { font-size: 28px; letter-spacing: -.03em; }
.shop-card ul { margin: 0; padding-left: 18px; color: var(--color-muted); display: grid; gap: 6px; }
.shop-card form, .shop-card .nx-btn { width: 100%; }
.shop-card--wide { grid-column: 1 / -1; }

.verify-bar {
  background: color-mix(in srgb, var(--color-warning) 16%, var(--color-surface-2));
  border-top: 1px solid color-mix(in srgb, var(--color-warning) 28%, var(--color-border));
  color: var(--color-text);
}
.verify-bar__inner {
  width: min(1440px, calc(100% - 32px)); margin: 0 auto;
  min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 0;
}
.verify-bar p { margin: 0; font-size: 13px; color: var(--color-text-secondary, var(--color-muted)); }
.verify-bar strong { color: var(--color-text); margin-right: 6px; }
.verify-bar .nx-btn { min-height: 34px; padding: 6px 12px; font-size: 12px; }

.shell-user, .topbar-user { display: flex; align-items: center; gap: 10px; color: var(--mast-link-hover); }
.shell-avatar, .topbar-user .shell-avatar {
  width: 34px; height: 34px; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; background: var(--color-elevated);
  font-weight: 700; font-size: 13px; overflow: hidden;
}
.shell-avatar--lg { width: 56px; height: 56px; font-size: 18px; }
.dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.yon-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.yon-fieldset {
  border: 1px solid var(--color-border); border-radius: 12px; padding: 14px 16px;
  margin: 0; display: grid; gap: 12px;
}
.yon-fieldset legend { padding: 0 6px; font-size: 13px; font-weight: 700; color: var(--color-muted); }

.acct { position: relative; isolation: isolate; z-index: 80; }
.acct__trigger {
  display: flex; align-items: center; gap: 10px; border: 0;
  background: transparent; color: var(--mast-link-hover); border-radius: 10px; padding: 4px 6px 4px 4px; cursor: pointer;
}
.acct__trigger:hover, .acct:hover .acct__trigger, .acct.is-open .acct__trigger, .acct.is-pinned .acct__trigger { background: var(--mast-link-bg); }
.acct__hello { display: grid; text-align: left; line-height: 1.2; }
.acct__hello small { color: var(--mast-link); font-size: 13px; font-weight: 500; }
.acct__hello strong { font-size: 13px; font-weight: 600; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mast-link-hover); }
.acct__gear { display: grid; place-items: center; color: var(--mast-link); margin-left: 2px; }
.acct__gear .yon-ico { opacity: .9; }
.acct__trigger:hover .acct__gear { color: var(--mast-link-hover); }
.acct__avwrap, .acct__av { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: var(--r10-dark-tertiary); }
.acct__avwrap { position: relative; overflow: hidden; }
.acct__avwrap.is-online { overflow: visible; box-shadow: none; }
.acct__avwrap.is-online::after {
  content: ""; position: absolute; left: -1px; top: 50%; width: 8px; height: 8px;
  border-radius: 50%; background: var(--color-online); border: 2px solid var(--mast-bg);
  transform: translateY(-50%);
}
.acct__panel {
  display: none; position: absolute; right: 0; top: 100%;
  width: min(328px, calc(100vw - 16px)); padding-top: 10px;
  background: transparent; border: 0; box-shadow: none; z-index: 120;
}
.acct:hover .acct__panel, .acct:focus-within .acct__panel, .acct.is-open .acct__panel, .acct.is-pinned .acct__panel { display: block; }
.acct.is-open .acct__panel, .acct.is-pinned .acct__panel { display: block; }
.acct__pass {
  position: relative; display: flex; flex-direction: column;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 28%),
    var(--color-surface);
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  border-radius: 16px;
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset,
    0 18px 40px color-mix(in srgb, #000 28%, transparent);
  overflow: hidden;
  max-height: min(72vh, calc(100vh - 64px));
}
.acct__ribbon {
  position: absolute; left: 0; right: 0; top: 0; z-index: 4; height: 2px;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 42%, #34d399 78%, transparent);
  background-size: 200% 100%;
  animation: corp-ribbon 8s linear infinite;
}
.mast:has(.acct.is-open) .menubar .theme-bar,
.mast:has(.acct.is-pinned) .menubar .theme-bar,
.mast:has(.acct:hover) .menubar .theme-bar,
.mast:has(.acct:focus-within) .menubar .theme-bar {
  opacity: 0; pointer-events: none; visibility: hidden;
}
.acct__hero {
  position: relative; isolation: isolate;
  display: grid; grid-template-columns: 52px minmax(0, 1fr) 32px; gap: 10px; align-items: start;
  padding: 16px 12px 12px; flex: 0 0 auto;
  background: linear-gradient(160deg, color-mix(in srgb, var(--color-primary) 14%, var(--color-surface)), var(--color-surface) 72%);
}
.acct__hero.has-cover::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background-image: var(--cover); background-size: cover; background-position: center;
  opacity: .38; filter: saturate(1.05);
}
.acct__hero.has-cover::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--color-surface) 88%, transparent), transparent 70%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 20%, transparent), var(--color-surface));
}
.acct__hero > * { position: relative; z-index: 2; }
.acct__avring {
  width: 52px; height: 52px; border-radius: 50%; padding: 2px;
  background: linear-gradient(145deg, var(--color-primary), color-mix(in srgb, var(--color-primary-hover) 70%, #111));
  display: grid; place-items: center; overflow: hidden;
  box-shadow: 0 0 0 3px var(--color-surface);
  color: inherit; text-decoration: none; flex: 0 0 auto;
}
.acct__avring:hover { filter: brightness(1.06); }
.acct__avring.is-online { box-shadow: 0 0 0 3px var(--color-surface), 0 0 0 5px var(--color-online); }
.acct__hero-av {
  width: 100%; height: 100%; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; background: var(--color-elevated); font-weight: 800; font-size: 18px;
  border: 2px solid var(--color-surface); box-sizing: border-box;
}
.acct__who { display: grid; align-content: start; gap: 3px; min-width: 0; padding-top: 1px; }
.acct__who-top { display: flex; align-items: center; gap: 6px; min-width: 0; }
.acct__profile-link {
  width: 22px; height: 22px; display: grid; place-items: center; flex: 0 0 auto;
  color: #3b9bff; background: color-mix(in srgb, #3b9bff 14%, transparent); border-radius: 6px;
}
.acct__profile-link:hover { color: #fff; background: #3b9bff; }
.acct__who > strong, .acct__who-top > strong {
  font-size: 14px; font-weight: 750; color: var(--color-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.acct__who > em {
  font-style: normal; font-size: 11.5px; font-weight: 650; color: var(--color-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.acct__badges { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }
.acct__verified {
  width: 16px; height: 16px; display: grid; place-items: center; flex: none;
  color: #3b9bff; background: color-mix(in srgb, #3b9bff 16%, transparent); border-radius: 50%;
}
.acct__chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 7px; border-radius: 999px;
  font-size: 10.5px; font-weight: 750; background: var(--color-elevated); color: var(--color-muted);
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
}
.acct__chip.is-on { color: var(--color-success); background: color-mix(in srgb, var(--color-success) 12%, transparent); border-color: color-mix(in srgb, var(--color-success) 28%, transparent); }
.acct__chip.is-off { color: var(--color-danger); background: color-mix(in srgb, var(--color-danger) 10%, transparent); border-color: color-mix(in srgb, var(--color-danger) 24%, transparent); }
.acct__chip.is-premium {
  color: var(--nick-color, #fbbf24);
  background: color-mix(in srgb, var(--nick-color, #fbbf24) 12%, transparent);
  border-color: color-mix(in srgb, var(--nick-color, #fbbf24) 30%, transparent);
}
.acct__chip.is-trade {
  color: #67e8f9; background: color-mix(in srgb, #67e8f9 10%, transparent);
  border-color: color-mix(in srgb, #67e8f9 26%, transparent);
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.acct__visit {
  display: inline-flex; align-items: center; gap: 5px; margin-top: 3px;
  color: var(--color-muted); font-size: 11px;
}
.acct__visit .yon-ico { flex: 0 0 auto; opacity: .85; }
.acct__logout { margin: 0; }
.acct__logout button {
  width: 30px; height: 30px; display: grid; place-items: center;
  border: 1px solid var(--color-border); border-radius: 9px;
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  color: var(--color-muted); cursor: pointer;
}
.acct__logout button:hover { background: var(--color-hover); color: var(--color-text); }
.acct__quick {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px;
  padding: 0 10px 10px; flex: 0 0 auto;
}
.acct__quick a {
  display: grid; justify-items: center; gap: 4px; padding: 8px 4px;
  border-radius: 11px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); font-size: 10px; font-weight: 750;
}
.acct__quick a:hover {
  color: var(--color-text); border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-elevated));
}
.acct__quick .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.acct__meta {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;
  margin: 0 10px 10px; flex: 0 0 auto;
}
.acct__meta a {
  display: grid; justify-items: center; gap: 1px; padding: 8px 4px;
  border-radius: 11px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 45%, transparent);
  color: var(--color-text); font-size: 10.5px; font-weight: 650;
}
.acct__meta a:hover {
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-elevated));
  border-color: color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
  color: var(--color-text);
}
.acct__meta strong { font-size: 14px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.acct__meta span { color: var(--color-muted); }
.acct__tabs {
  display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 0 10px 8px;
  background: transparent; flex: 0 0 auto;
}
.acct__tabs button {
  height: 36px; border: 1px solid var(--color-border); border-radius: 10px;
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
  color: var(--color-muted); font-size: 12px; font-weight: 750; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  position: relative; z-index: 2; pointer-events: auto;
}
.acct__tabs button + button { border-left: 1px solid var(--color-border); }
.acct__tabs button.is-active {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  box-shadow: inset 0 -2px 0 var(--color-primary);
}
.acct__tabs button .yon-ico { opacity: .85; }
.acct__scroll {
  flex: 1 1 auto; min-height: 0; max-height: 280px; overflow: auto; overscroll-behavior: contain;
  scrollbar-gutter: stable; margin: 0 6px 6px;
  border: 1px solid var(--color-border); border-radius: 12px;
  background: color-mix(in srgb, var(--color-elevated) 28%, transparent);
}
.acct__scroll::-webkit-scrollbar { width: 6px; }
.acct__scroll::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--color-muted) 45%, transparent);
  border-radius: 999px;
}
.acct__list { display: grid; }
.acct__list[hidden],
[data-acct-pane][hidden] {
  display: none !important;
}
.acct__list a {
  display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 8px; align-items: center;
  padding: 9px 10px; color: var(--color-text); font-size: 12.5px; font-weight: 600;
  border-top: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  background: transparent;
}
.acct__list a:first-child { border-top: 0; }
.acct__list a:hover { background: color-mix(in srgb, var(--color-primary) 8%, transparent); color: var(--color-text); }
.acct__list .yon-ico { color: var(--color-muted); }
.acct__list a:hover .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.acct__list span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.acct__list small {
  display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px; font-weight: 750; white-space: nowrap;
}
.acct__list small.is-wait { color: var(--color-muted); }
.acct__list small.is-off { color: var(--color-danger); }
.acct__list small.is-on {
  color: #22c55e;
  font-weight: 800;
}
.acct__list a[href*="/reklam"] .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.acct__foot {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 10px 12px;
  background: transparent; border-top: 0; flex: 0 0 auto;
}
.acct__foot a {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 36px; padding: 0 10px; border-radius: 10px;
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  border: 1px solid var(--color-border);
  color: var(--color-text); font-size: 12px; font-weight: 750;
}
.acct__foot a:hover { color: var(--color-text); border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border)); }
.acct__foot a.is-invite {
  background: var(--color-primary); color: #fff; border-color: transparent;
  box-shadow: 0 8px 16px color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.acct__foot a.is-invite:hover { color: #fff; filter: brightness(1.06); }
.acct__foot b {
  min-width: 18px; height: 18px; padding: 0 6px; display: inline-grid; place-items: center;
  border-radius: 999px; background: rgba(0,0,0,.28); font-size: 11px; font-weight: 800;
}
.acct__foot a.is-invite b { background: rgba(0,0,0,.22); color: #fff; }

.trade-chip {
  display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 700; letter-spacing: .02em;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); border: 1px solid color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
}
.trade-chip--trusted { color: #67e8f9; }
.trade-chip--pro { color: #fbbf24; }
.trade-chip--corporate { color: var(--color-primary-ink-hover, var(--color-link-hover)); }
.trade-chip--elite { color: #fca5a5; }
.trade-tiers { list-style: none; margin: 12px 0; padding: 0; display: grid; gap: 6px; }
.trade-tiers li { display: flex; justify-content: space-between; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: 10px; font-size: 13px; }
.trade-tiers li.is-on { border-color: var(--color-primary); background: color-mix(in srgb, var(--color-primary) 10%, transparent); }
.acct-dash__hero {
  display: flex; justify-content: space-between; gap: 18px; align-items: flex-end; flex-wrap: wrap;
  padding: 28px 22px; margin-bottom: 16px; border: 1px solid var(--color-border); border-radius: var(--radius-xl);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 22%, transparent), var(--color-surface) 70%),
    var(--cover, none);
  background-size: cover;
}
.acct-dash__id { display: flex; gap: 16px; align-items: center; }
.acct-dash__av, .acct-media__av { width: 84px; height: 84px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: var(--color-elevated); border: 3px solid var(--color-surface); }
.acct-dash__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.acct-dash__grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 14px; margin: 14px 0; }
.cp { display: grid; grid-template-columns: 268px minmax(0, 1fr); gap: 20px; align-items: start; }
.cp-nav {
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 16px;
  overflow: hidden; position: sticky; top: 86px; max-height: calc(100vh - 100px); overflow-y: auto;
}
.cp-nav__brand {
  padding: 16px 16px 12px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--color-primary) 22%, var(--color-surface)), var(--color-surface));
  border-bottom: 1px solid var(--color-border);
}
.cp-nav__brand strong { display: block; font-size: 15px; }
.cp-nav__brand small { color: var(--color-muted); font-size: 12px; }
.cp-nav__head {
  padding: 14px 16px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-surface)); color: var(--color-text);
}
.cp-nav__group { padding: 0; border-top: 1px solid var(--color-border); }
.cp-nav__group > p {
  margin: 0 16px 6px; font-size: 10px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--color-muted); font-weight: 800;
}
.cp-nav__toggle {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 11px 16px; border: 0; background: transparent; color: var(--color-text);
  font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; cursor: pointer;
}
.cp-nav__toggle:hover { background: var(--color-elevated); }
.cp-nav__toggle i {
  width: 8px; height: 8px; border-right: 2px solid var(--color-muted); border-bottom: 2px solid var(--color-muted);
  transform: rotate(45deg); transition: transform .18s ease; margin-top: -4px;
}
.cp-nav__group.is-open .cp-nav__toggle i { transform: rotate(-135deg); margin-top: 2px; }
.cp-nav__body { display: none; padding: 0 0 8px; }
.cp-nav__group.is-open .cp-nav__body { display: block; }
.cp-nav__link {
  display: grid; grid-template-columns: 18px 1fr auto; gap: 10px; align-items: center;
  padding: 8px 16px; color: var(--color-text); font-size: 13px;
}
.cp-nav__link:hover { background: var(--color-elevated); color: var(--color-text); }
.cp-nav__link.is-on {
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  box-shadow: inset 3px 0 0 var(--color-primary); font-weight: 700;
}
.cp-nav__link .yon-ico { color: var(--color-muted); }
.cp-nav__link.is-on .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.cp-nav__link em {
  min-width: 18px; text-align: center; font-style: normal; font-size: 11px; font-weight: 700; color: var(--color-muted);
}
.cp-nav__link--freeze {
  margin: 4px 8px 8px; border-radius: 10px;
  background: color-mix(in srgb, var(--color-danger) 18%, var(--color-surface));
  color: var(--color-text); font-weight: 700;
}
.cp-nav__link--freeze .yon-ico { color: var(--color-danger); }
.cp-nav__link--freeze:hover { background: color-mix(in srgb, var(--color-danger) 28%, var(--color-surface)); color: var(--color-text); }
.cp-hero {
  display: flex; justify-content: space-between; gap: 18px; align-items: center; flex-wrap: wrap;
  padding: 20px 22px; margin-bottom: 14px; border-radius: 16px;
  border: 1px solid var(--color-border);
  background:
    radial-gradient(1200px 180px at 10% -40%, color-mix(in srgb, var(--color-primary) 28%, transparent), transparent 60%),
    var(--color-surface);
}
.cp-hero__hello { margin: 0 0 4px; color: var(--color-muted); font-size: 13px; }
.cp-hero h2 { margin: 0 0 6px; font-size: clamp(1.15rem, 2vw, 1.45rem); }
.cp-hero__text p:last-child { margin: 0; color: var(--color-muted); font-size: 13px; max-width: 46ch; }
.cp-health { display: flex; align-items: center; gap: 14px; }
.cp-health--wide { margin-bottom: 14px; padding: 14px 16px; border: 1px solid var(--color-border); border-radius: 14px; background: var(--color-surface); }
.cp-health__ring {
  --score: 0;
  width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center;
  background:
    radial-gradient(circle at center, var(--color-surface) 58%, transparent 59%),
    conic-gradient(var(--color-primary) calc(var(--score) * 1%), color-mix(in srgb, var(--color-border) 80%, transparent) 0);
}
.cp-health__ring strong { font-size: 14px; }
.cp-health em { display: block; font-style: normal; font-weight: 800; }
.cp-health small { color: var(--color-muted); font-size: 12px; }
.cp-alerts { display: grid; gap: 10px; margin-bottom: 14px; }
.cp-alert-card {
  display: flex; justify-content: space-between; gap: 12px; align-items: center; flex-wrap: wrap;
  padding: 14px 16px; border-radius: 12px; border: 1px solid var(--color-border); background: var(--color-surface);
}
.cp-alert-card strong { display: block; font-size: 14px; }
.cp-alert-card p { margin: 4px 0 0; color: var(--color-muted); font-size: 13px; }
.cp-alert-card--warn { border-color: color-mix(in srgb, var(--color-warning) 45%, var(--color-border)); background: color-mix(in srgb, var(--color-warning) 12%, var(--color-surface)); }
.cp-alert-card--info { border-color: color-mix(in srgb, var(--color-info) 40%, var(--color-border)); background: color-mix(in srgb, var(--color-info) 10%, var(--color-surface)); }
.cp-alert-card--ok { border-color: color-mix(in srgb, var(--color-success) 35%, var(--color-border)); background: color-mix(in srgb, var(--color-success) 10%, var(--color-surface)); }
.cp-kpis--rich { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cp-kpis--rich a { display: inline-block; margin-top: 8px; font-size: 12px; font-weight: 700; color: var(--color-primary-ink, var(--color-primary)); }
.cp-quick {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px;
}
.cp-quick a {
  display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 12px;
  border-radius: 12px; border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text); font-size: 13px; font-weight: 650;
}
.cp-quick a:hover { background: var(--color-elevated); color: var(--color-text); border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border)); }
.cp-quick .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.cp-split { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.cp-panel-card {
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 16px; overflow: hidden;
}
.cp-panel-card > header {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 12px 16px; border-bottom: 1px solid var(--color-border); background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface));
}
.cp-panel-card > header h2 { margin: 0; font-size: 14px; }
.cp-panel-card > header a { font-size: 12px; font-weight: 700; }
.cp-soft-list { display: grid; }
.cp-soft-list a {
  display: grid; gap: 2px; padding: 12px 16px; color: var(--color-text);
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
}
.cp-soft-list a:last-child { border-bottom: 0; }
.cp-soft-list a:hover { background: var(--color-elevated); color: var(--color-text); }
.cp-soft-list strong { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-soft-list small { color: var(--color-muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-empty-state {
  padding: 28px 18px; text-align: center; display: grid; gap: 8px; justify-items: center;
}
.cp-empty-state strong { font-size: 15px; }
.cp-empty-state p { margin: 0; color: var(--color-muted); font-size: 13px; max-width: 36ch; }
.cp-bars--compact { height: 88px; margin: 16px; }
.cp-bars--compact span { display: none; }
.cp-row--manage {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 10px 16px; border-bottom: 1px solid var(--color-border);
}
.cp-row--manage > a, .cp-row--manage .cp-row__static {
  display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; color: var(--color-text); min-width: 0;
}
.cp-row--manage:hover { background: color-mix(in srgb, var(--color-primary) 6%, var(--color-elevated)); }
.cp-invite__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.cp-tips { margin: 14px 0 0; padding-left: 18px; color: var(--color-muted); font-size: 13px; display: grid; gap: 6px; }
.cp-box {
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 14px; overflow: hidden; margin-bottom: 14px;
}
.cp-box__head {
  padding: 12px 16px; border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-surface));
}
.cp-box__head h2 { margin: 0; font-size: 15px; }
.cp-box--nested { margin: 14px 16px 16px; }
.cp-form { display: grid; gap: 12px; padding: 16px; }
.cp-feature-list { display: grid; gap: 8px; max-height: 420px; overflow: auto; padding: 2px; }
.cp-feature-row {
  display: grid !important; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start;
  padding: 10px 12px; border: 1px solid var(--color-border); border-radius: 10px;
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
}
.cp-feature-row strong { display: block; color: var(--color-text); font-size: 13.5px; }
.cp-feature-row small { display: block; margin-top: 2px; color: var(--color-muted); font-size: 12px; }
.cp-feature-row em { font-style: normal; color: var(--color-primary-ink, var(--color-primary)); font-weight: 700; }
.cp-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cp-form__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cp-form label { display: grid; gap: 6px; font-size: 13px; color: var(--color-text-secondary); }
.cp-form input, .cp-form textarea, .cp-form select {
  width: 100%; min-height: 40px; padding: 8px 12px; border-radius: 8px;
  border: 1px solid var(--color-border); background: var(--color-input-bg); color: var(--color-text);
}
.cp-form textarea { min-height: 110px; resize: vertical; }
.cp-form__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
.nx-btn--ok { background: #22c55e; border-color: #22c55e; color: #fff; }
.nx-btn--ok:hover { background: #16a34a; color: #fff; }
.cp-btn--freeze { background: color-mix(in srgb, var(--color-danger) 80%, #111); border-color: transparent; color: #fff; }
.cp-btn--freeze:hover { filter: brightness(1.08); color: #fff; }
.cp-check { display: flex !important; align-items: flex-start; gap: 10px; grid-template-columns: none !important; }
.cp-check input { width: auto; min-height: 0; margin-top: 3px; }
.cp-check span { color: var(--color-text); }
.cp-check em { color: var(--color-danger); font-style: normal; }
.cp-fieldset {
  border: 1px solid var(--color-border); border-radius: 12px; padding: 12px 14px; margin: 0; display: grid; gap: 10px;
}
.cp-fieldset legend { padding: 0 6px; font-size: 12px; font-weight: 800; color: var(--color-muted); }
.cp-alert {
  padding: 12px 14px; border-radius: 10px; font-size: 13px; line-height: 1.45;
}
.cp-alert ul { margin: 0; padding-left: 18px; }
.cp-alert--info { background: color-mix(in srgb, var(--color-info) 16%, var(--color-surface)); border: 1px solid color-mix(in srgb, var(--color-info) 35%, var(--color-border)); }
.cp-alert--warn { background: color-mix(in srgb, var(--color-warning) 16%, var(--color-surface)); border: 1px solid color-mix(in srgb, var(--color-warning) 35%, var(--color-border)); }
.cp-alert--ok { background: color-mix(in srgb, var(--color-success) 18%, var(--color-surface)); border: 1px solid color-mix(in srgb, var(--color-success) 40%, var(--color-border)); color: var(--color-success); font-weight: 700; }
.cp-avatar-preview { display: flex; gap: 14px; align-items: center; }
.cp-avatar-preview__img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.cp-preview { border: 1px solid var(--color-border); border-radius: 10px; padding: 12px; background: var(--color-elevated); }
.cp-preview__body { margin-top: 8px; color: var(--color-text); font-size: 13px; }
.cp-rowline {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(140px, 220px); gap: 12px; align-items: center;
  padding: 10px 0; border-bottom: 1px solid var(--color-border); color: var(--color-text); font-size: 13px;
}
.cp-rowline select { min-height: 36px; }
.cp-sub { margin: 14px 0 4px; font-size: 13px; color: var(--color-muted); text-transform: uppercase; letter-spacing: .06em; }
.cp-slug { display: flex; align-items: stretch; border: 1px solid var(--color-border); border-radius: 8px; overflow: hidden; background: var(--color-input-bg); }
.cp-slug em {
  display: grid; place-items: center; padding: 0 10px; font-style: normal; font-size: 12px; color: var(--color-muted);
  background: var(--color-elevated); border-right: 1px solid var(--color-border); white-space: nowrap;
}
.cp-slug input { border: 0; border-radius: 0; background: transparent; }
.cp-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cp-panel-card .cp-checklist { padding: 8px 16px 16px; }
.cp-checklist li { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid var(--color-border); }
.cp-checklist li:last-child { border-bottom: 0; }
.cp-checklist li span { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: var(--color-elevated); color: var(--color-muted); font-size: 12px; }
.cp-checklist li.is-ok span { background: color-mix(in srgb, var(--color-success) 22%, transparent); color: var(--color-success); }
.cp-checklist strong { display: block; font-size: 13px; }
.cp-checklist small { color: var(--color-muted); font-size: 12px; }
.cp-block-row { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--color-border); }
.cp-block-row a { display: flex; gap: 10px; align-items: center; color: var(--color-text); }
.cp-tema-form { display: flex; flex-wrap: wrap; gap: 10px; padding: 16px; }
.cp-head { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
.cp-head h1 { margin: 0; font-size: 22px; }
.cp-head__meta { display: flex; gap: 10px; align-items: center; }
.cp-head__av { width: 42px; height: 42px; border-radius: 50%; }
.cp-head__meta small { display: block; color: var(--color-muted); font-size: 12px; }
.cp-head__profile { margin-left: 4px; }
.cp-board {
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 16px; overflow: hidden;
}
.cp-board__cols {
  display: grid; grid-template-columns: minmax(0, 1fr) 140px 64px 90px 140px; gap: 12px;
  padding: 10px 16px 10px 62px; color: var(--color-muted); font-size: 11px; letter-spacing: .04em; text-transform: uppercase;
  border-bottom: 1px solid var(--color-border); background: var(--color-elevated);
}
.cp-row {
  display: grid; grid-template-columns: 36px minmax(0, 1fr) 140px 64px 90px 140px; gap: 12px; align-items: center;
  padding: 12px 16px; color: var(--color-text); border-bottom: 1px solid var(--color-border);
}
.cp-row:not(:has(b)) { grid-template-columns: 36px minmax(0, 1fr) auto; }
.cp-row:hover { background: color-mix(in srgb, var(--color-primary) 7%, var(--color-elevated)); color: var(--color-text); }
.cp-row .shell-avatar, .cp-row .yon-ico { width: 36px; height: 36px; border-radius: 50%; }
.cp-row__body { min-width: 0; display: grid; gap: 2px; }
.cp-row__body strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-row__body small { color: var(--color-muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-row__emoji {
  width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center;
  font-size: 18px; flex-shrink: 0;
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  border: 1px solid var(--color-border);
}
.cp-row time, .cp-row span { color: var(--color-muted); font-size: 12px; }
.cp-row b { font-weight: 700; font-size: 13px; color: var(--color-muted); }
.cp-empty { margin: 0; padding: 28px 18px; color: var(--color-muted); }
.cp-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.cp-kpis article {
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 14px; padding: 14px;
}
.cp-kpis span { color: var(--color-muted); font-size: 12px; }
.cp-kpis strong { display: block; font-size: 22px; margin-top: 4px; }
.cp-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cp-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }




.cp-people { display: grid; gap: 8px; }
.cp-people a { display: flex; gap: 10px; align-items: center; color: var(--color-text); }
.cp-people a:hover { color: var(--color-text); }
.cp-mini { display: grid; gap: 2px; padding: 8px 0; border-bottom: 1px solid var(--color-border); color: var(--color-text); }
.cp-mini:last-child { border-bottom: 0; }
.cp-mini small { color: var(--color-muted); }
.cp-bars { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 6px; align-items: end; height: 120px; margin-top: 16px; }
.cp-bars i { display: grid; align-items: end; height: 100%; }
.cp-bars b { display: block; background: linear-gradient(180deg, var(--color-primary), var(--color-primary-hover)); border-radius: 6px 6px 2px 2px; min-height: 6px; }
.cp-bars span { display: block; font-size: 9px; color: var(--color-muted); text-align: center; margin-top: 6px; }
.cp-areas { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cp-areas li { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--color-border); }
.cp-badges { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.cp-badges article { padding: 14px; border: 1px solid var(--color-border); border-radius: 14px; background: var(--color-surface); display: grid; gap: 4px; }
.cp-badges time { color: var(--color-muted); font-size: 12px; }
.cp-invite code {
  display: block; margin: 12px 0; padding: 12px; border-radius: 10px; background: var(--color-elevated);
  border: 1px solid var(--color-border); overflow: auto; font-size: 12px;
}
.acct-media { display: grid; grid-template-columns: auto 1fr; gap: 12px; margin: 12px 0; }
.acct-media a { display: block; font-size: 12px; margin-top: 6px; }
.acct-media__cover { height: 72px; border-radius: 12px; background: var(--cover, var(--color-elevated)); background-size: cover; border: 1px solid var(--color-border); }

.app-frame {
  width: min(1440px, calc(100% - 32px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
  padding: 22px 0 96px;
  flex: 1;
}
.app-frame:has(.pro--v6),
.app-frame:has(.pro--v4),
.app-frame:has(.pro--v10),
.app-frame:has(.pro-edit--v4) {
  width: min(1680px, calc(100% - 24px));
}
.app-frame:has(.yon-thread--v4),
.app-frame:has(.yon-thread--v5),
.app-frame:has(.yon-thread--v6),
.app-frame:has(.yon-thread--v7) {
  width: min(1440px, calc(100% - 28px));
}
.app-frame:has(.yon-thread--v10),
.app-frame:has(.forum-show--v8),
.app-frame:has(.forum-show--v9),
.app-frame:has(.forum-show--v10),
.app-frame:has(.hero--v10),
.app-frame:has(.hero--v11),
.app-frame:has(.hero--v12),
.app-frame:has(.hero--v13),
.app-frame:has(.hero--v14),
.app-frame:has(.hero--v15),
.app-frame:has(.sec10--v10),
.app-frame:has(.mem10--v10) {
  width: min(1680px, calc(100% - 20px));
}
.app-frame:has(.hero--v14),
.app-frame:has(.hero--v15) {
  width: min(1600px, calc(100% - 24px));
}
.app-frame--home-hero {
  width: min(1600px, calc(100% - 24px));
  padding-top: 14px;
}
.app-frame.has-rail { grid-template-columns: minmax(0, 1fr); }
.app-main { min-width: 0; }
.app-footer {
  border-top: 0; padding: 0 0 96px; color: var(--color-muted); background: transparent;
}
.app-footer__row, .app-footer__grid {
  width: min(1440px, calc(100% - 32px)); margin: 0 auto;
}
.app-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1.2fr; gap: 24px; }
.app-footer nav { display: flex; gap: 14px; flex-wrap: wrap; }

.site-foot {
  --foot-pad-x: 18px;
  --foot-pad-y: 14px;
  --foot-line: var(--header-line);
  --foot-radius: 14px;
  --foot-bg: color-mix(in srgb, var(--color-surface) 92%, transparent);
  --foot-row-h: 60px;
  box-sizing: border-box;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--color-text);
  background:
    radial-gradient(900px 280px at 8% -10%, color-mix(in srgb, var(--color-primary) 14%, transparent), transparent 60%),
    radial-gradient(700px 240px at 92% 0%, color-mix(in srgb, #22c55e 8%, transparent), transparent 55%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface-2) 88%, #0a0d14), color-mix(in srgb, var(--color-surface-2) 96%, #06080d));
  border-top: 1px solid var(--color-border);
}
.site-foot *,
.site-foot *::before,
.site-foot *::after { box-sizing: border-box; }
.site-foot__glow {
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, #fff 3%, transparent), transparent);
  opacity: .35;
}
.site-foot__inner {
  position: relative; z-index: 1;
  width: min(1440px, calc(100% - 32px));
  margin: 0 auto;
  padding: 28px 0 18px;
  display: grid;
  gap: 12px;
  align-content: start;
}
.site-foot__mast {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: 4px 2px 6px;
}
.site-foot__brand { display: flex; gap: 14px; align-items: center; min-width: 0; }
.site-foot__mark {
  width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; flex: 0 0 auto;
  background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary-hover) 70%, #111));
  color: #fff; font-weight: 800; font-size: 18px;
  box-shadow: 0 10px 28px color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.site-foot__brand-text { min-width: 0; }
.site-foot__eyebrow {
  display: block; margin: 0 0 2px; font-style: normal; font-size: 11px; font-weight: 750;
  letter-spacing: .08em; text-transform: uppercase; color: var(--color-primary-ink, var(--color-primary));
}
.site-foot__brand-text strong { display: block; font-size: 18px; line-height: 1.15; letter-spacing: -.02em; }
.site-foot__brand-text small {
  display: block; color: var(--color-muted); font-size: 13px; line-height: 1.4; margin-top: 3px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 52ch;
}
.site-foot__mast-side {
  display: flex; align-items: center; gap: 12px; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end;
}
.site-foot__cta-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.site-foot__cta {
  display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 10px;
  background: color-mix(in srgb, var(--color-primary) 18%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); font-size: 12.5px; font-weight: 750; white-space: nowrap;
  border: 1px solid color-mix(in srgb, var(--color-primary) 32%, var(--foot-line));
  transition: filter .15s ease, transform .15s ease;
}
.site-foot__cta:hover { color: var(--color-primary-ink-hover, var(--color-link-hover)); filter: brightness(1.05); transform: translateY(-1px); }
.site-foot__cta--ghost {
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent); color: var(--color-text);
  border-color: var(--foot-line);
}
.site-foot__cta--ghost:hover { color: var(--color-text); background: var(--color-elevated); }
.site-foot__soc-list { display: flex; gap: 6px; }
.site-foot__soc {
  width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center;
  color: #fff; font-size: 10px; font-weight: 800;
  transition: transform .15s ease;
}
.site-foot__soc:hover { transform: translateY(-1px); }
.site-foot__soc.is-ig { background: #e1306c; }
.site-foot__soc.is-yt { background: #ff0033; }
.site-foot__soc.is-x { background: #1d9bf0; }
.site-foot__soc.is-tg { background: #2aabee; }
.site-foot__soc.is-in { background: #0a66c2; }
.site-foot__soc.is-fb { background: #1877f2; }

.site-foot__panel {
  border: 1px solid var(--foot-line);
  border-radius: var(--foot-radius);
  background: var(--foot-bg);
  overflow: hidden;
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.site-foot__pulse { position: relative; }
.site-foot__live {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: var(--foot-row-h);
  padding: 12px var(--foot-pad-x);
  border-bottom: 1px solid var(--foot-line);
  background:
    linear-gradient(90deg, color-mix(in srgb, #22c55e 10%, transparent), transparent 55%),
    color-mix(in srgb, #22c55e 4%, transparent);
}
.site-foot__live-main {
  display: flex; align-items: center; gap: 12px; min-width: 0; flex: 1 1 auto;
}
.site-foot__live-dot {
  width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto;
  background: #22c55e;
}
.site-foot__live-text { min-width: 0; }
.site-foot__live-text strong {
  display: block; font-size: 14.5px; line-height: 1.25; color: var(--color-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.site-foot__live-text small {
  display: block; color: var(--color-muted); font-size: 12px; line-height: 1.3; margin-top: 2px;
}
.site-foot__online-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  height: 38px; padding: 0 16px; border-radius: 10px; cursor: pointer; flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--color-primary) 34%, var(--foot-line));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); font-size: 12.5px; font-weight: 750; white-space: nowrap;
}
.site-foot__online-btn:hover { filter: brightness(1.06); }

.site-foot__metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-height: 72px;
}
.site-foot__metric {
  display: flex; align-items: center; gap: 12px; min-width: 0;
  padding: 14px var(--foot-pad-x);
  border-right: 1px solid var(--foot-line);
}
.site-foot__metric:last-child { border-right: 0; }
.site-foot__metric-text { min-width: 0; }
.site-foot__metric-text span {
  display: block; color: var(--color-muted); font-size: 11.5px; line-height: 1.2; font-weight: 650;
  letter-spacing: .02em; text-transform: uppercase;
}
.site-foot__metric-text strong {
  display: block; font-size: 18px; line-height: 1.2; color: var(--color-text); margin-top: 2px;
  font-variant-numeric: tabular-nums; letter-spacing: -.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.site-foot__metric-text a { color: var(--color-primary-ink, var(--color-primary)); }
.site-foot__ico,
.site-foot__mail-ico {
  width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; flex: 0 0 auto;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
  border: 1px solid color-mix(in srgb, var(--color-primary) 18%, transparent);
}

.site-foot__billboard {
  display: grid;
  grid-template-columns: minmax(220px, .9fr) minmax(280px, 1.2fr);
  gap: 0;
  align-items: stretch;
  min-height: 112px;
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 45%),
    var(--foot-bg);
}
.site-foot__billboard-copy {
  padding: 18px var(--foot-pad-x);
  border-right: 1px solid var(--foot-line);
  display: grid; align-content: center; gap: 6px; min-width: 0;
}
.site-foot__billboard-copy em {
  font-style: normal; font-size: 11px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--color-muted);
}
.site-foot__billboard-copy strong { font-size: 16px; line-height: 1.25; }
.site-foot__billboard-copy p {
  margin: 0; color: var(--color-muted); font-size: 12.5px; line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.foot-sponsor {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; width: 100%; min-height: 112px; padding: 18px 20px; text-align: center;
  color: var(--color-text);
  background:
    radial-gradient(420px 120px at 50% 120%, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 70%),
    color-mix(in srgb, var(--color-surface) 55%, transparent);
  transition: background .2s ease, filter .15s ease;
}
.foot-sponsor:hover {
  color: var(--color-text);
  filter: brightness(1.04);
  background:
    radial-gradient(420px 120px at 50% 120%, color-mix(in srgb, var(--color-primary) 18%, transparent), transparent 70%),
    color-mix(in srgb, var(--color-elevated) 70%, transparent);
}
.foot-sponsor.has-logo {
  padding: 0;
  overflow: hidden;
}
.foot-sponsor.has-logo img {
  width: 100%; height: 100%; min-height: 112px; max-height: 140px;
  object-fit: contain; object-position: center; padding: 18px 28px;
  display: block;
}
.foot-sponsor:not(.has-logo) img { max-width: 200px; max-height: 48px; object-fit: contain; }
.foot-sponsor strong { font-size: 15px; line-height: 1.2; }
.foot-sponsor span { color: var(--color-muted); font-size: 12px; line-height: 1.35; }
.foot-sponsor__hint {
  position: absolute; right: 12px; bottom: 10px;
  font-style: normal; font-size: 10px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase;
  color: var(--color-muted); opacity: .7; pointer-events: none;
}
.foot-sponsor.is-empty { opacity: .92; border: 0; border-radius: 0; min-height: 112px; }

.site-foot__corp {
  display: grid;
  gap: 0;
  align-items: stretch;
}
.site-foot__corp--v4 {
  grid-template-columns: 1fr;
  gap: 0;
  padding: 0;
  overflow: hidden;
  background:
    radial-gradient(640px 240px at 8% -30%, color-mix(in srgb, var(--color-primary) 18%, transparent), transparent 62%),
    radial-gradient(480px 180px at 96% 8%, color-mix(in srgb, #34d399 8%, transparent), transparent 50%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 82%, transparent), var(--foot-bg));
}
.site-foot__corp--v4 > * {
  position: relative;
  padding: 0;
  border-right: 0;
  min-width: 0;
}
.site-foot__corp-ribbon {
  height: 3px;
  background: linear-gradient(90deg,
    var(--color-primary),
    #38bdf8 35%,
    #34d399 70%,
    color-mix(in srgb, var(--color-primary) 40%, transparent));
  background-size: 200% 100%;
  animation: corp-ribbon 8s linear infinite;
}
@keyframes corp-ribbon {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}
.site-foot__corp-shell {
  display: grid;
  gap: 12px;
  padding: 14px;
}
.site-foot__corp-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--foot-line);
  background:
    linear-gradient(105deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 48%),
    color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
.site-foot__corp-top-main {
  display: flex; align-items: center; gap: 11px; min-width: 0;
}
.site-foot__corp-top-main > div { min-width: 0; display: grid; gap: 2px; }
.site-foot__corp-top-main h3 {
  margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .05em;
  text-transform: uppercase; color: var(--color-text);
}
.site-foot__corp-top-main small {
  color: var(--color-muted); font-size: 12px; line-height: 1.25;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.site-foot__corp-top-meta {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px;
  color: var(--color-muted); font-size: 12px; font-weight: 650;
}
.site-foot__corp-top-meta > span {
  height: 28px; padding: 0 10px; border-radius: 999px; display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid color-mix(in srgb, #22c55e 30%, var(--foot-line));
  background: color-mix(in srgb, #22c55e 10%, transparent);
  color: #86efac; font-weight: 750;
}
.site-foot__corp-top-meta > span.is-live i {
  width: 7px; height: 7px; border-radius: 50%; background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, .45);
  animation: foot-pulse 1.8s ease-out infinite;
}
.site-foot__corp-top-meta a {
  height: 28px; padding: 0 10px; border-radius: 999px; display: inline-flex; align-items: center;
  border: 1px solid var(--foot-line); color: var(--color-text); font-weight: 700;
  background: color-mix(in srgb, var(--color-surface) 55%, transparent);
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.site-foot__corp-top-meta a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--foot-line));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
}

.site-foot__corp-body {
  display: grid;
  grid-template-columns: minmax(270px, .92fr) minmax(0, 1.85fr);
  gap: 12px;
  min-width: 0;
}
.site-foot__corp-about {
  display: grid;
  align-content: start;
  gap: 14px;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--foot-line));
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 50%),
    color-mix(in srgb, var(--color-elevated) 70%, transparent);
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset,
    0 12px 28px color-mix(in srgb, #000 18%, transparent);
}
.site-foot__corp-about::before { display: none; }
.site-foot__corp-brandline {
  display: flex; align-items: center; gap: 12px;
}
.site-foot__corp-mono {
  width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; flex: 0 0 auto;
  font-size: 19px; font-weight: 800; color: #fff;
  background: linear-gradient(150deg, var(--color-primary), color-mix(in srgb, var(--color-primary-hover) 65%, #10131a));
  box-shadow: 0 12px 26px color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.site-foot__corp-brandline strong {
  display: block; font-size: 17px; line-height: 1.2; letter-spacing: -.015em;
}
.site-foot__corp-brandline small {
  display: block; margin-top: 3px; color: var(--color-muted); font-size: 12px;
}
.site-foot__corp-kicker {
  display: flex; align-items: center; gap: 10px; margin: 0;
}
.site-foot__corp-kicker > div { min-width: 0; display: grid; gap: 2px; flex: 1 1 auto; }
.site-foot__corp-kicker small {
  color: var(--color-muted); font-size: 11.5px; line-height: 1.2;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.site-foot__corp-kicker b {
  margin-left: auto;
  min-width: 24px; height: 24px; padding: 0 7px; border-radius: 999px;
  display: inline-grid; place-items: center;
  font-size: 11px; font-weight: 800; font-variant-numeric: tabular-nums;
  color: var(--corp-accent, var(--color-primary));
  background: color-mix(in srgb, var(--corp-accent, var(--color-primary)) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--corp-accent, var(--color-primary)) 22%, transparent);
}
.site-foot__corp-ico {
  width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; flex: 0 0 auto;
  background: color-mix(in srgb, var(--corp-accent, var(--color-primary)) 14%, var(--color-elevated));
  color: var(--corp-accent, var(--color-primary));
  border: 1px solid color-mix(in srgb, var(--corp-accent, var(--color-primary)) 22%, transparent);
}
.site-foot__corp h3 {
  margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--color-muted);
}
.site-foot__corp-about p {
  margin: 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--foot-line);
  background: color-mix(in srgb, var(--color-surface) 78%, transparent);
  color: var(--color-muted); font-size: 13.5px; line-height: 1.65;
  display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;
}
.site-foot__corp-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.site-foot__corp-stat {
  --corp-accent: var(--color-primary);
  display: grid; gap: 4px; padding: 10px;
  border-radius: 11px; border: 1px solid var(--foot-line);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
}
.site-foot__corp-stat.is-explore { --corp-accent: var(--color-primary); }
.site-foot__corp-stat.is-support { --corp-accent: #38bdf8; }
.site-foot__corp-stat.is-policy { --corp-accent: #34d399; }
.site-foot__corp-stat span {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--color-muted); font-size: 10.5px; font-weight: 750;
  letter-spacing: .04em; text-transform: uppercase;
}
.site-foot__corp-stat span .yon-ico { color: var(--corp-accent); }
.site-foot__corp-stat strong {
  font-size: 20px; line-height: 1; letter-spacing: -.03em;
  color: var(--color-text); font-variant-numeric: tabular-nums;
}
.site-foot__corp-actions {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px;
}
.site-foot__corp-more {
  display: inline-flex; align-items: center; gap: 8px;
  height: 36px; padding: 0 13px 0 14px; border-radius: 11px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 34%, var(--foot-line));
  background: color-mix(in srgb, var(--color-primary) 16%, transparent);
  color: var(--color-primary-ink, var(--color-primary)); font-size: 12.5px; font-weight: 750;
  transition: filter .15s ease, transform .15s ease, background .15s ease;
}
.site-foot__corp-more::after {
  content: ""; width: 6px; height: 6px; border-right: 1.8px solid currentColor; border-top: 1.8px solid currentColor;
  transform: rotate(45deg); margin-left: 2px;
}
.site-foot__corp-more:hover {
  color: var(--color-primary-ink-hover, var(--color-link-hover)); filter: brightness(1.05); transform: translateY(-1px);
  background: color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.site-foot__corp-more--ghost {
  background: transparent; color: var(--color-text);
  border-color: var(--foot-line);
}
.site-foot__corp-more--ghost:hover {
  color: var(--color-text); background: var(--color-elevated);
}

.site-foot__corp-navs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
  background: transparent;
}
.site-foot__col {
  --corp-accent: var(--color-primary);
  display: grid; gap: 0; align-content: start;
  padding: 14px 12px 12px;
  border-radius: 14px;
  border: 1px solid var(--foot-line);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--corp-accent) 8%, transparent), transparent 36%),
    color-mix(in srgb, var(--color-elevated) 62%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.site-foot__col:last-child { border-right: 1px solid var(--foot-line); }
.site-foot__col.is-explore { --corp-accent: var(--color-primary); }
.site-foot__col.is-support { --corp-accent: #38bdf8; }
.site-foot__col.is-policy { --corp-accent: #34d399; }
.site-foot__col:hover {
  border-color: color-mix(in srgb, var(--corp-accent) 34%, var(--foot-line));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--corp-accent) 12%, transparent), transparent 42%),
    color-mix(in srgb, var(--color-elevated) 78%, transparent);
  transform: translateY(-1px);
}
.site-foot__col::before {
  content: "";
  display: block; height: 3px; border-radius: 999px; margin: 0 2px 12px;
  background: linear-gradient(90deg, var(--corp-accent), color-mix(in srgb, var(--corp-accent) 12%, transparent));
}
.site-foot__col .site-foot__corp-kicker {
  margin: 0 2px 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--foot-line);
}
.site-foot__col-list { display: grid; gap: 2px; }
.site-foot__col a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 10px;
  align-items: center; gap: 8px;
  min-height: 34px; padding: 5px 8px; border-radius: 9px;
  color: var(--color-text); font-size: 13.5px; font-weight: 600; line-height: 1.3;
  opacity: .92; transition: color .12s ease, opacity .12s ease, background .12s ease, transform .12s ease;
}
.site-foot__col a span {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.site-foot__col a i {
  width: 6px; height: 6px; flex: 0 0 auto; opacity: 0; justify-self: end;
  border-right: 1.7px solid currentColor; border-top: 1.7px solid currentColor;
  transform: rotate(45deg) translateX(-3px);
  transition: opacity .12s ease, transform .12s ease;
}
.site-foot__col a:hover {
  color: var(--corp-accent); opacity: 1;
  background: color-mix(in srgb, var(--corp-accent) 11%, transparent);
  transform: translateX(1px);
}
.site-foot__col a:hover i {
  opacity: .85; transform: rotate(45deg) translateX(0);
}

.site-foot__trust { display: flex; flex-wrap: wrap; gap: 8px; }
.site-foot__trust--tiles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.site-foot__trust--bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid var(--foot-line);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.site-foot__trust--bar .site-foot__chip {
  min-height: 48px;
  border-radius: 0;
  border: 0;
  border-right: 1px solid var(--foot-line);
  box-shadow: none;
  background: transparent;
  padding: 10px 14px;
}
.site-foot__trust--bar .site-foot__chip:last-child { border-right: 0; }
.site-foot__trust--bar .site-foot__chip b,
.site-foot__trust--pills .site-foot__chip b {
  margin-left: auto;
  width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto;
  background: #22c55e;
  box-shadow: 0 0 0 3px color-mix(in srgb, #22c55e 18%, transparent);
}
.site-foot__trust--pills {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.site-foot__trust--pills .site-foot__chip {
  min-height: 44px;
  border-radius: 12px;
  padding: 8px 12px;
  background: color-mix(in srgb, var(--color-elevated) 58%, transparent);
  transition: border-color .12s ease, transform .12s ease;
}
.site-foot__trust--pills .site-foot__chip:hover {
  border-color: color-mix(in srgb, #22c55e 28%, var(--foot-line));
  transform: translateY(-1px);
}
.site-foot__chip {
  display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 10px;
  border-radius: 11px; border: 1px solid var(--foot-line);
  background: color-mix(in srgb, var(--color-surface) 72%, transparent);
  color: var(--color-muted); font-size: 12px; font-weight: 650;
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.site-foot__chip-ico {
  width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; flex: 0 0 auto;
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.site-foot__chip em { font-style: normal; line-height: 1.25; min-width: 0; }
.site-foot__chip .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }

.site-foot__panel--mail,
.site-foot__mailbox--v4 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  min-height: 0;
  overflow: hidden;
  background:
    radial-gradient(520px 180px at 0% 0%, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 60%),
    var(--foot-bg);
}
.site-foot__mail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border-bottom: 1px solid var(--foot-line);
  background:
    linear-gradient(100deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 50%),
    color-mix(in srgb, var(--color-elevated) 42%, transparent);
}
.site-foot__mail-head-main {
  display: flex; align-items: center; gap: 11px; min-width: 0;
}
.site-foot__mail-head-main > div { min-width: 0; display: grid; gap: 2px; }
.site-foot__mail-head-main h3 {
  margin: 0; font-size: 12.5px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--color-text);
}
.site-foot__mail-head-main small {
  color: var(--color-muted); font-size: 12px; line-height: 1.25;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.site-foot__mail-head-ico {
  width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; flex: 0 0 auto;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.site-foot__mail-head-link {
  height: 30px; padding: 0 12px; border-radius: 999px; display: inline-flex; align-items: center;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--foot-line));
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
  color: var(--color-primary-ink, var(--color-primary)); font-size: 12px; font-weight: 750;
  transition: filter .12s ease, transform .12s ease;
}
.site-foot__mail-head-link:hover {
  color: var(--color-primary-ink-hover, var(--color-link-hover)); filter: brightness(1.05); transform: translateY(-1px);
}
.site-foot__mail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
}
.site-foot__mail {
  --mail-accent: var(--color-primary);
  position: relative;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 14px;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 84px;
  padding: 14px 12px;
  border-radius: 14px;
  border: 1px solid var(--foot-line);
  color: var(--color-text);
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--mail-accent) 10%, transparent), transparent 48%),
    color-mix(in srgb, var(--color-elevated) 58%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.site-foot__mail.is-ads { --mail-accent: var(--color-primary); }
.site-foot__mail.is-kvkk { --mail-accent: #38bdf8; }
.site-foot__mail.is-legal { --mail-accent: #a78bfa; }
.site-foot__mail.is-support { --mail-accent: #34d399; }
.site-foot__mail:last-child { border-right: 1px solid var(--foot-line); }
.site-foot__mail:hover {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--mail-accent) 36%, var(--foot-line));
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--mail-accent) 16%, transparent), transparent 52%),
    color-mix(in srgb, var(--color-elevated) 78%, transparent);
  transform: translateY(-2px);
}
.site-foot__mail-ico {
  width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; flex: 0 0 auto;
  background: color-mix(in srgb, var(--mail-accent) 14%, var(--color-elevated));
  color: var(--mail-accent);
  border: 1px solid color-mix(in srgb, var(--mail-accent) 24%, transparent);
}
.site-foot__mail-text { min-width: 0; display: grid; gap: 3px; }
.site-foot__mail-text em {
  font-style: normal; color: var(--mail-accent); font-size: 11px; font-weight: 800; line-height: 1.2;
  letter-spacing: .05em; text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.site-foot__mail-text strong {
  font-size: 13px; font-weight: 700; line-height: 1.25; color: var(--color-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.site-foot__mail-text small {
  color: var(--color-muted); font-size: 11.5px; line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.site-foot__mail-go {
  width: 7px; height: 7px; opacity: .35; justify-self: end; align-self: center;
  border-right: 1.8px solid currentColor; border-top: 1.8px solid currentColor;
  transform: rotate(45deg);
  transition: opacity .12s ease, transform .12s ease;
}
.site-foot__mail:hover .site-foot__mail-go {
  opacity: .9; color: var(--mail-accent);
  transform: rotate(45deg) translate(1px, -1px);
}

.site-foot__copy,
.site-foot__copy--v4 {
  display: grid;
  grid-template-columns: minmax(220px, auto) minmax(0, 1fr) auto;
  gap: 12px 16px;
  align-items: center;
  min-height: 0;
  padding: 12px 14px;
  border-radius: var(--foot-radius);
  border: 1px solid var(--foot-line);
  color: var(--color-muted);
  font-size: 12px;
  background:
    linear-gradient(105deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 42%),
    color-mix(in srgb, var(--color-elevated) 48%, transparent);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.site-foot__copy-brand {
  display: flex; align-items: center; gap: 11px; min-width: 0;
}
.site-foot__copy-mark {
  width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; flex: 0 0 auto;
  font-size: 14px; font-weight: 800; color: #fff;
  background: linear-gradient(150deg, var(--color-primary), color-mix(in srgb, var(--color-primary-hover) 65%, #10131a));
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.site-foot__copy-text { min-width: 0; display: grid; gap: 2px; }
.site-foot__copy-text strong {
  display: block; color: var(--color-text); font-size: 12.5px; font-weight: 750; line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.site-foot__copy-text small {
  display: block; color: var(--color-muted); font-size: 11.5px; line-height: 1.25;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.site-foot__copy p { margin: 0; white-space: nowrap; }
.site-foot__copy nav,
.site-foot__copy-nav {
  display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; min-width: 0;
}
.site-foot__copy a,
.site-foot__copy-nav a {
  height: 28px; padding: 0 10px; border-radius: 999px; display: inline-flex; align-items: center;
  border: 1px solid var(--foot-line);
  background: color-mix(in srgb, var(--color-surface) 55%, transparent);
  color: var(--color-muted); font-size: 11.5px; font-weight: 700;
  transition: color .12s ease, border-color .12s ease, background .12s ease, transform .12s ease;
}
.site-foot__copy a:hover,
.site-foot__copy-nav a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--foot-line));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
  transform: translateY(-1px);
}
.site-foot__top {
  width: auto; height: 36px; padding: 0 12px 0 10px; border: 0; border-radius: 11px; cursor: pointer;
  justify-self: end; display: inline-flex; align-items: center; gap: 7px;
  background: color-mix(in srgb, var(--color-warning) 88%, #c45a12); color: #fff;
  font-size: 12px; font-weight: 750;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-warning) 28%, transparent);
  transition: filter .12s ease, transform .12s ease;
}
.site-foot__top span { line-height: 1; }
.site-foot__top:hover { filter: brightness(1.06); transform: translateY(-1px); }

.foot-online__pulse {
  width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto; display: inline-block;
  background: #22c55e; box-shadow: 0 0 0 0 rgba(34, 197, 94, .55);
  animation: foot-pulse 1.8s ease-out infinite;
}
@keyframes foot-pulse {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .5); }
  70% { box-shadow: 0 0 0 12px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

.online-dialog {
  border: 0; padding: 0; background: transparent; max-width: min(920px, calc(100vw - 24px));
  width: 100%;
}
.online-dialog::backdrop {
  background: rgba(6, 8, 14, .72); backdrop-filter: blur(4px);
}
.online-dialog__sheet {
  border: 1px solid var(--header-line); border-radius: 16px; overflow: hidden;
  background: var(--color-surface); color: var(--color-text);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
}
.online-dialog__head {
  display: flex; justify-content: space-between; gap: 12px; align-items: center;
  padding: 14px 16px; border-bottom: 1px solid var(--header-line);
  background: color-mix(in srgb, var(--color-surface-2) 70%, var(--color-surface));
}
.online-dialog__head strong { display: block; font-size: 15px; }
.online-dialog__head small { color: var(--color-muted); font-size: 12px; }
.online-dialog__tools { display: flex; align-items: center; gap: 10px; }
.online-dialog__tools a { color: var(--color-primary-ink, var(--color-primary)); font-size: 12.5px; font-weight: 700; }
.online-dialog__tools button {
  width: 34px; height: 34px; border: 0; border-radius: 10px; cursor: pointer;
  background: var(--color-elevated); color: var(--color-text); font-size: 20px; line-height: 1;
}
.online-dialog__body { padding: 16px; max-height: min(62vh, 520px); overflow: auto; }
.online-wall { line-height: 1.85; font-size: 14px; }
.online-wall__name {
  color: var(--u-color, var(--color-primary)); font-weight: 700; text-decoration: none;
}
.online-wall__name:hover { text-decoration: underline; filter: brightness(1.12); }
.online-wall__sep { color: var(--color-muted); font-weight: 500; }

.online-page { display: grid; gap: 16px; }
.online-page__head {
  display: flex; justify-content: space-between; gap: 16px; align-items: flex-end; flex-wrap: wrap;
}
.online-page__head h1 { margin: 4px 0 6px; font-size: clamp(24px, 3vw, 32px); }
.online-page__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.online-page__panel {
  padding: 18px; border-radius: 16px; border: 1px solid var(--header-line);
  background: color-mix(in srgb, var(--color-surface) 88%, transparent);
}
.online-page__meta {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px; color: var(--color-muted); font-size: 13px; font-weight: 650;
}
.dock {
  display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
  background: color-mix(in srgb, var(--color-surface) 94%, transparent);
  backdrop-filter: blur(12px) saturate(1.2);
  border-top: 1px solid var(--color-border);
  justify-content: space-around; align-items: center;
  padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
  min-height: 58px;
}
.dock a,
.dock .dock__item {
  display: grid; justify-items: center; gap: 3px; min-width: 56px;
  color: var(--color-muted); font-size: 10.5px; font-weight: 700;
  text-decoration: none; padding: 6px 4px; border-radius: 10px;
}
.dock a .yon-ico,
.dock .dock__item .yon-ico { opacity: .85; }
.dock a.is-active,
.dock .dock__item.is-active {
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
}
.dock a.is-active .yon-ico,
.dock .dock__item.is-active .yon-ico { opacity: 1; }
.fab {
  display: none; position: fixed; right: 16px; bottom: 76px; z-index: 31;
  width: 52px; height: 52px; border-radius: 50%; background: var(--color-primary); color: #fff;
  place-items: center; font-size: 24px; box-shadow: var(--shadow-md);
}

.hero {
  display: flex; justify-content: space-between; gap: 20px; align-items: flex-start;
  padding: 8px 4px 20px; margin-bottom: 4px;
}
.hero h1 { margin: 0 0 8px; font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 700; letter-spacing: -.02em; }
.hero p { margin: 0; max-width: 46ch; }
.hero__actions { display: flex; gap: 8px; flex-shrink: 0; }
.kicker {
  margin: 0 0 6px; color: var(--color-primary-ink, var(--color-primary)); font-size: 12px; letter-spacing: .08em;
  text-transform: uppercase; font-weight: 600;
}
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 8px 0 18px; }

/* Home hero v10 */
.hero.hero--v10 {
  display: block;
  padding: 0;
  margin: 0 0 18px;
}
.hero10 {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-border) 78%, var(--color-primary));
  background:
    linear-gradient(145deg,
      color-mix(in srgb, var(--color-primary) 10%, var(--color-surface)) 0%,
      var(--color-surface) 42%,
      color-mix(in srgb, var(--color-elevated) 70%, var(--color-surface)) 100%);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
}
.hero10__glow {
  position: absolute;
  inset: -40% auto auto -18%;
  width: min(520px, 70vw);
  height: min(520px, 70vw);
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--color-primary) 28%, transparent) 0%, transparent 68%);
  pointer-events: none;
  animation: hero10-pulse 7s ease-in-out infinite;
}
.hero10__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(240px, .85fr);
  gap: 20px 28px;
  padding: 22px 24px 20px;
  align-items: stretch;
}
.hero10__copy { min-width: 0; display: grid; gap: 0; align-content: start; }
.hero10__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  max-width: 100%;
}
.hero10__logo {
  height: 28px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
  display: block;
}
.hero10__mark {
  flex: none;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: color-mix(in srgb, var(--color-primary) 88%, #000);
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -.02em;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.hero10__site {
  font-size: 13px;
  font-weight: 780;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero.hero--v10 .kicker {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 780;
  letter-spacing: .07em;
}
.hero.hero--v10 h1 {
  margin: 0 0 10px;
  max-width: 22ch;
  font-size: clamp(1.55rem, 3.2vw, 2.35rem);
  font-weight: 820;
  line-height: 1.15;
  letter-spacing: -.03em;
}
.hero10__lead {
  margin: 0 0 16px;
  max-width: 48ch;
  font-size: 14.5px;
  line-height: 1.55;
}
.hero10__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.hero10__actions .mast-cta {
  min-height: 40px;
}
.hero10__actions .nx-btn {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.hero10__aside {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  padding: 14px 14px 12px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 55%, var(--color-surface));
}
.hero10__aside-kicker {
  margin: 0;
  font-size: 10.5px;
  font-weight: 780;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero10__metrics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.hero10__metrics li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 8px;
  row-gap: 1px;
  align-items: center;
  padding: 10px 10px 9px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 88%, transparent);
}
.hero10__metrics li.is-live {
  border-color: color-mix(in srgb, var(--color-online) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-online) 8%, var(--color-surface));
}
.hero10__metric-ico {
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.hero10__metric-ico--live {
  position: relative;
  background: color-mix(in srgb, var(--color-online) 18%, var(--color-elevated));
}
.hero10__metric-ico--live::after {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-online);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-online) 22%, transparent);
  animation: hero10-dot 1.8s ease-in-out infinite;
}
.hero10__metrics strong {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.1;
  color: var(--color-text);
}
.hero10__metrics span:not(.hero10__metric-ico) {
  font-size: 11px;
  font-weight: 650;
  color: var(--color-muted);
}
.hero10__quick {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: auto;
  padding-top: 2px;
}
.hero10__quick a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted);
  font-size: 11.5px;
  font-weight: 720;
  text-decoration: none;
  transition: color .12s ease, border-color .12s ease, background .12s ease;
}
.hero10__quick a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface));
}
@keyframes hero10-pulse {
  0%, 100% { opacity: .55; transform: scale(1); }
  50% { opacity: .9; transform: scale(1.06); }
}
@keyframes hero10-dot {
  0%, 100% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-online) 22%, transparent); }
  50% { box-shadow: 0 0 0 5px color-mix(in srgb, var(--color-online) 10%, transparent); }
}

@media (max-width: 900px) {
  .hero10__grid {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 18px 16px 16px;
  }
  .hero.hero--v10 h1 { max-width: none; }
  .hero10__aside { padding: 12px; }
}
@media (max-width: 560px) {
  .hero10 { border-radius: 14px; }
  .hero10__glow { inset: -30% auto auto -30%; width: 280px; height: 280px; }
  .hero10__brand { margin-bottom: 10px; }
  .hero10__logo { height: 24px; max-width: 120px; }
  .hero10__mark { width: 32px; height: 32px; border-radius: 10px; font-size: 14px; }
  .hero.hero--v10 h1 { font-size: clamp(1.35rem, 6.2vw, 1.75rem); }
  .hero10__lead { font-size: 13.5px; margin-bottom: 14px; }
  .hero10__actions { gap: 7px; }
  .hero10__actions .mast-cta,
  .hero10__actions .nx-btn {
    flex: 1 1 calc(50% - 7px);
    justify-content: center;
    min-height: 38px;
    font-size: 13px;
  }
  .hero10__actions .nx-btn:nth-child(3) {
    flex: 1 1 100%;
  }
  .hero10__metrics {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .hero10__metrics li { padding: 9px 8px 8px; }
  .hero10__metrics strong { font-size: .98rem; }
  .hero10__quick { gap: 5px; }
  .hero10__quick a {
    flex: 1 1 auto;
    justify-content: center;
    min-height: 30px;
    font-size: 11px;
    padding: 0 8px;
  }
}
@media (max-width: 380px) {
  .hero10__metrics { grid-template-columns: 1fr; }
  .hero10__actions .mast-cta,
  .hero10__actions .nx-btn {
    flex: 1 1 100%;
  }
}

/* Home hero v11 — wide corporate strip */
.hero.hero--v11 {
  display: block;
  padding: 0;
  margin: 0 0 22px;
}
.hero11 {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 320px;
  border-radius: 20px;
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, var(--color-primary));
  background:
    linear-gradient(105deg,
      color-mix(in srgb, var(--color-primary) 16%, #0b1220) 0%,
      color-mix(in srgb, var(--color-surface) 92%, #0a1018) 38%,
      color-mix(in srgb, var(--color-elevated) 75%, var(--color-surface)) 100%);
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset,
    0 22px 48px color-mix(in srgb, #000 22%, transparent);
}
.hero11__ribbon {
  height: 3px;
  background: linear-gradient(90deg,
    var(--color-primary),
    #38bdf8 36%,
    #34d399 72%,
    color-mix(in srgb, var(--color-primary) 40%, transparent));
  background-size: 200% 100%;
  animation: hero11-ribbon 10s linear infinite;
}
.hero11__glow {
  position: absolute;
  inset: -20% -10% auto 45%;
  width: min(720px, 80vw);
  height: min(420px, 55vw);
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--color-primary) 26%, transparent) 0%, transparent 70%);
  pointer-events: none;
  opacity: .85;
}
.hero11__inner {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0;
  min-height: 318px;
}
.hero11__top {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(300px, .9fr);
  gap: 28px 36px;
  padding: 28px 32px 24px;
  align-items: stretch;
}
.hero11__copy {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 0;
}
.hero11__brand {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 18px;
  max-width: 100%;
}
.hero11__logo {
  height: 44px;
  width: auto;
  max-width: 220px;
  object-fit: contain;
  display: block;
}
.hero11__mark {
  flex: none;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 55%, #0a0f18));
  color: #fff;
  font-size: 20px;
  font-weight: 850;
  letter-spacing: -.02em;
  box-shadow: 0 14px 28px color-mix(in srgb, var(--color-primary) 32%, transparent);
}
.hero11__brand-text {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.hero11__brand-text em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero11__brand-text strong {
  font-size: 18px;
  font-weight: 820;
  letter-spacing: -.02em;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero.hero--v11 .kicker {
  margin: 0 0 10px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: .09em;
}
.hero.hero--v11 h1 {
  margin: 0 0 14px;
  max-width: 28ch;
  font-size: clamp(1.85rem, 3.8vw, 2.85rem);
  font-weight: 850;
  line-height: 1.12;
  letter-spacing: -.035em;
  color: var(--color-text);
}
.hero11__lead {
  margin: 0 0 22px;
  max-width: 58ch;
  font-size: 15.5px;
  line-height: 1.55;
  color: var(--color-muted);
}
.hero11__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.hero11__actions .mast-cta {
  min-height: 44px;
  padding-inline: 16px;
}
.hero11__actions .nx-btn {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding-inline: 14px;
}
.hero11__panel {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
  padding: 16px 16px 14px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 72%, var(--color-primary));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 70%, transparent), transparent),
    color-mix(in srgb, var(--color-surface) 78%, #0a1018);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.hero11__panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.hero11__panel-head > span {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero11__panel-head em {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-style: normal;
  font-size: 11px;
  font-weight: 750;
  color: #34d399;
}
.hero11__panel-head em i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 3px color-mix(in srgb, #34d399 22%, transparent);
}
.hero11__stats {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.hero11__stats li {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 12px 12px 11px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 82%, transparent);
}
.hero11__stats li.is-live {
  border-color: color-mix(in srgb, #34d399 38%, var(--color-border));
  background: color-mix(in srgb, #34d399 9%, var(--color-surface));
}
.hero11__stat-ico {
  flex: none;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--color-primary) 15%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.hero11__stat-ico.is-live {
  background: color-mix(in srgb, #34d399 18%, var(--color-elevated));
}
.hero11__stat-ico.is-live i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 3px color-mix(in srgb, #34d399 22%, transparent);
  animation: hero11-dot 1.8s ease-in-out infinite;
}
.hero11__stats strong {
  display: block;
  font-size: 1.15rem;
  font-weight: 850;
  letter-spacing: -.02em;
  line-height: 1.1;
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
}
.hero11__stats span:not(.hero11__stat-ico) {
  font-size: 11.5px;
  font-weight: 650;
  color: var(--color-muted);
}
.hero11__links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: auto;
}
.hero11__links a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 30px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 65%, transparent);
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 720;
  text-decoration: none;
  transition: color .12s ease, border-color .12s ease, background .12s ease;
}
.hero11__links a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 9%, var(--color-surface));
}
.hero11__bar {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: 0;
  border-top: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  background: color-mix(in srgb, #000 18%, var(--color-surface));
}
.hero11__bar-item {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 16px 22px;
  border-right: 1px solid var(--color-border);
}
.hero11__bar-item > span {
  flex: none;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.hero11__bar-item em {
  display: block;
  font-style: normal;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.hero11__bar-item strong {
  display: block;
  margin-top: 2px;
  font-size: 13.5px;
  font-weight: 750;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero11__bar-item--cta {
  border-right: 0;
  justify-content: center;
  padding-inline: 18px;
}
.hero11__bar-item--cta a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 16px;
  border-radius: 11px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 16%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}
.hero11__bar-item--cta a:hover { filter: brightness(1.08); }
.hero11__bar-item--cta .yon-ico { transform: rotate(90deg); }
@keyframes hero11-ribbon {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}
@keyframes hero11-dot {
  0%, 100% { box-shadow: 0 0 0 3px color-mix(in srgb, #34d399 22%, transparent); }
  50% { box-shadow: 0 0 0 5px color-mix(in srgb, #34d399 10%, transparent); }
}
@media (max-width: 1100px) {
  .hero11__top {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 22px 20px 18px;
  }
  .hero.hero--v11 h1 { max-width: none; }
  .hero11__bar {
    grid-template-columns: 1fr 1fr;
  }
  .hero11__bar-item:nth-child(2) { border-right: 0; }
  .hero11__bar-item:nth-child(3),
  .hero11__bar-item:nth-child(4) { border-top: 1px solid var(--color-border); }
  .hero11__bar-item--cta { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .hero11 { border-radius: 16px; min-height: 0; }
  .hero11__brand { margin-bottom: 14px; }
  .hero11__logo { height: 34px; max-width: 160px; }
  .hero11__mark { width: 42px; height: 42px; border-radius: 12px; font-size: 17px; }
  .hero.hero--v11 h1 { font-size: clamp(1.45rem, 7vw, 1.9rem); }
  .hero11__lead { font-size: 14px; margin-bottom: 16px; }
  .hero11__actions .mast-cta,
  .hero11__actions .nx-btn {
    flex: 1 1 calc(50% - 10px);
    justify-content: center;
    min-height: 40px;
  }
  .hero11__stats { gap: 6px; }
  .hero11__bar { grid-template-columns: 1fr; }
  .hero11__bar-item {
    border-right: 0;
    border-top: 1px solid var(--color-border);
  }
  .hero11__bar-item:first-child { border-top: 0; }
  .hero11__bar-item--cta a { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .hero11__ribbon { animation: none; }
  .hero11__stat-ico.is-live i { animation: none; }
}


/* Home hero v12 — corporate wide, compact height */
.hero.hero--v12 {
  display: block;
  padding: 0;
  margin: 0 0 16px;
}
.hero12 {
  position: relative;
  overflow: hidden;
  width: 100%;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 72%, var(--color-primary));
  background:
    linear-gradient(115deg,
      color-mix(in srgb, var(--color-primary) 12%, var(--color-surface)) 0%,
      var(--color-surface) 46%,
      color-mix(in srgb, var(--color-elevated) 68%, var(--color-surface)) 100%);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
}
.hero12__ribbon {
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 40%, #34d399 78%, transparent);
}
.hero12__body {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(250px, .78fr);
  gap: 18px 24px;
  padding: 16px 18px 15px;
  align-items: stretch;
}
.hero12__copy { min-width: 0; display: grid; align-content: start; }
.hero12__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
  max-width: 100%;
}
.hero12__logo {
  height: 30px;
  width: auto;
  max-width: 150px;
  object-fit: contain;
  display: block;
}
.hero12__mark {
  flex: none;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 55%, #111));
  color: #fff;
  font-size: 14px;
  font-weight: 850;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-primary) 26%, transparent);
}
.hero12__brand-text { min-width: 0; display: grid; gap: 1px; }
.hero12__brand-text em {
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero12__brand-text strong {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -.01em;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero.hero--v12 .kicker {
  margin: 0 0 6px;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .08em;
}
.hero.hero--v12 h1 {
  margin: 0 0 8px;
  max-width: 24ch;
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
  font-weight: 850;
  line-height: 1.18;
  letter-spacing: -.025em;
}
.hero12__lead {
  margin: 0 0 12px;
  max-width: 52ch;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--color-muted);
}
.hero12__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-bottom: 10px;
}
.hero12__actions .mast-cta { min-height: 36px; }
.hero12__actions .nx-btn {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.hero12__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.hero12__trust span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted);
  font-size: 11px;
  font-weight: 740;
}
.hero12__trust .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.hero12__aside {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 78%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 52%, var(--color-surface));
}
.hero12__aside-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.hero12__aside-head > span {
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero12__aside-head em {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-style: normal;
  font-size: 10.5px;
  font-weight: 750;
  color: #34d399;
}
.hero12__aside-head em i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 2px color-mix(in srgb, #34d399 22%, transparent);
}
.hero12__metrics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.hero12__metrics li {
  display: grid;
  gap: 1px;
  padding: 9px 10px;
  border-radius: 10px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 85%, transparent);
}
.hero12__metrics li.is-live {
  border-color: color-mix(in srgb, #34d399 36%, var(--color-border));
  background: color-mix(in srgb, #34d399 8%, var(--color-surface));
}
.hero12__metrics strong {
  font-size: 1.05rem;
  font-weight: 850;
  letter-spacing: -.02em;
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.hero12__metrics span {
  font-size: 10.5px;
  font-weight: 650;
  color: var(--color-muted);
}
.hero12__links {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: auto;
}
.hero12__links a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 65%, transparent);
  color: var(--color-muted);
  font-size: 11px;
  font-weight: 720;
  text-decoration: none;
}
.hero12__links a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 32%, var(--color-border));
}
@media (max-width: 900px) {
  .hero12__body {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 14px;
  }
  .hero.hero--v12 h1 { max-width: none; }
}
@media (max-width: 560px) {
  .hero12 { border-radius: 14px; }
  .hero12__logo { height: 26px; max-width: 120px; }
  .hero12__mark { width: 30px; height: 30px; border-radius: 9px; font-size: 13px; }
  .hero.hero--v12 h1 { font-size: clamp(1.25rem, 5.8vw, 1.55rem); }
  .hero12__lead { font-size: 13px; }
  .hero12__actions .mast-cta,
  .hero12__actions .nx-btn {
    flex: 1 1 calc(50% - 7px);
    justify-content: center;
    min-height: 34px;
  }
}


/* Home hero v13 — corporate wide strip, dense/compact */
.hero.hero--v13 {
  display: block;
  padding: 0;
  margin: 0 0 14px;
}
.hero13 {
  overflow: hidden;
  width: 100%;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 74%, var(--color-primary));
  background:
    linear-gradient(100deg,
      color-mix(in srgb, var(--color-primary) 11%, var(--color-surface)) 0%,
      var(--color-surface) 52%,
      color-mix(in srgb, var(--color-elevated) 60%, var(--color-surface)) 100%);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.hero13__ribbon {
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 42%, #34d399 80%, transparent);
}
.hero13__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 20px;
  align-items: center;
  padding: 12px 14px;
}
.hero13__main {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
}
.hero13__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.hero13__logo {
  height: 28px;
  width: auto;
  max-width: 132px;
  object-fit: contain;
  display: block;
}
.hero13__mark {
  flex: none;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 55%, #111));
  color: #fff;
  font-size: 13px;
  font-weight: 850;
}
.hero13__titles { min-width: 0; }
.hero13__titles em {
  display: block;
  margin: 0 0 1px;
  font-style: normal;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero.hero--v13 h1,
.hero13__titles h1 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 850;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero13__titles p {
  margin: 2px 0 0;
  font-size: 12px;
  line-height: 1.3;
  color: var(--color-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 42ch;
}
.hero13__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-left: auto;
}
.hero13__actions .mast-cta { min-height: 32px; padding-inline: 11px; font-size: 12.5px; }
.hero13__actions .nx-btn { min-height: 32px; padding-inline: 11px; font-size: 12.5px; }
.hero13__metrics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex: none;
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  overflow: hidden;
  background: color-mix(in srgb, var(--color-elevated) 48%, var(--color-surface));
}
.hero13__metrics li {
  display: grid;
  gap: 1px;
  justify-items: center;
  min-width: 68px;
  padding: 8px 12px;
  border-right: 1px solid var(--color-border);
}
.hero13__metrics li:last-child { border-right: 0; }
.hero13__metrics li.is-live {
  background: color-mix(in srgb, #34d399 10%, transparent);
}
.hero13__metrics strong {
  font-size: 14px;
  font-weight: 850;
  letter-spacing: -.02em;
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.hero13__metrics span {
  font-size: 10px;
  font-weight: 700;
  color: var(--color-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
@media (max-width: 900px) {
  .hero13__row {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 12px;
  }
  .hero13__actions { margin-left: 0; }
  .hero13__metrics { width: 100%; }
  .hero13__metrics li { flex: 1; min-width: 0; }
}
@media (max-width: 560px) {
  .hero13 { border-radius: 12px; }
  .hero13__main { gap: 10px; }
  .hero13__titles p { max-width: 100%; white-space: normal; }
  .hero13__actions { width: 100%; }
  .hero13__actions .mast-cta,
  .hero13__actions .nx-btn { flex: 1; justify-content: center; }
}


/* Home hero v14 — v13 strip + subtle wider/roomier */
.hero.hero--v14 {
  display: block;
  padding: 0;
  margin: 0 0 15px;
}
.hero14 {
  overflow: hidden;
  width: 100%;
  border-radius: 15px;
  border: 1px solid color-mix(in srgb, var(--color-border) 72%, var(--color-primary));
  background:
    linear-gradient(100deg,
      color-mix(in srgb, var(--color-primary) 12%, var(--color-surface)) 0%,
      var(--color-surface) 50%,
      color-mix(in srgb, var(--color-elevated) 62%, var(--color-surface)) 100%);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
}
.hero14__ribbon {
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 42%, #34d399 80%, transparent);
}
.hero14__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 22px;
  align-items: center;
  padding: 14px 16px;
}
.hero14__main {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
}
.hero14__brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}
.hero14__logo {
  height: 32px;
  width: auto;
  max-width: 148px;
  object-fit: contain;
  display: block;
}
.hero14__mark {
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 55%, #111));
  color: #fff;
  font-size: 14px;
  font-weight: 850;
}
.hero14__titles { min-width: 0; }
.hero14__titles em {
  display: block;
  margin: 0 0 2px;
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero.hero--v14 h1,
.hero14__titles h1 {
  margin: 0;
  font-size: 1.14rem;
  font-weight: 850;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero14__titles p {
  margin: 3px 0 0;
  font-size: 12.5px;
  line-height: 1.3;
  color: var(--color-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 48ch;
}
.hero14__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-left: auto;
}
.hero14__actions .mast-cta { min-height: 34px; padding-inline: 12px; font-size: 12.5px; }
.hero14__actions .nx-btn { min-height: 34px; padding-inline: 12px; font-size: 12.5px; }
.hero14__metrics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex: none;
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  overflow: hidden;
  background: color-mix(in srgb, var(--color-elevated) 48%, var(--color-surface));
}
.hero14__metrics li {
  display: grid;
  gap: 2px;
  justify-items: center;
  min-width: 76px;
  padding: 9px 14px;
  border-right: 1px solid var(--color-border);
}
.hero14__metrics li:last-child { border-right: 0; }
.hero14__metrics li.is-live {
  background: color-mix(in srgb, #34d399 10%, transparent);
}
.hero14__metrics strong {
  font-size: 15px;
  font-weight: 850;
  letter-spacing: -.02em;
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.hero14__metrics span {
  font-size: 10px;
  font-weight: 700;
  color: var(--color-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
@media (max-width: 900px) {
  .hero14__row {
    grid-template-columns: 1fr;
    gap: 11px;
    padding: 13px 14px;
  }
  .hero14__actions { margin-left: 0; }
  .hero14__metrics { width: 100%; }
  .hero14__metrics li { flex: 1; min-width: 0; }
}
@media (max-width: 560px) {
  .hero14 { border-radius: 13px; }
  .hero14__main { gap: 10px; }
  .hero14__titles p { max-width: 100%; white-space: normal; }
  .hero14__actions { width: 100%; }
  .hero14__actions .mast-cta,
  .hero14__actions .nx-btn { flex: 1; justify-content: center; }
}

/* Home hero v15 — v14 strip + trust chips, metric icons, quick rail, spotlight */
.hero.hero--v15 {
  display: block;
  padding: 0;
  margin: 0 0 15px;
}
.hero15 {
  overflow: hidden;
  width: 100%;
  border-radius: 15px;
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, var(--color-primary));
  background:
    linear-gradient(102deg,
      color-mix(in srgb, var(--color-primary) 13%, var(--color-surface)) 0%,
      var(--color-surface) 48%,
      color-mix(in srgb, var(--color-elevated) 64%, var(--color-surface)) 100%);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
}
.hero15__ribbon {
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 40%, #34d399 78%, transparent);
  background-size: 200% 100%;
  animation: hero15-ribbon 8s linear infinite;
}
.hero15__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px 20px;
  align-items: center;
  padding: 13px 16px 11px;
}
.hero15__main {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
}
.hero15__brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}
.hero15__logo {
  height: 32px;
  width: auto;
  max-width: 148px;
  object-fit: contain;
  display: block;
}
.hero15__mark {
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 55%, #111));
  color: #fff;
  font-size: 14px;
  font-weight: 850;
}
.hero15__titles { min-width: 0; }
.hero15__titles em {
  display: block;
  margin: 0 0 2px;
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero.hero--v15 h1,
.hero15__titles h1 {
  margin: 0;
  font-size: 1.14rem;
  font-weight: 850;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero15__titles p {
  margin: 3px 0 0;
  font-size: 12.5px;
  line-height: 1.3;
  color: var(--color-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 48ch;
}
.hero15__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 7px;
}
.hero15__trust span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 72%, transparent);
  color: var(--color-muted);
  font-size: 10.5px;
  font-weight: 740;
}
.hero15__trust .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.hero15__trust .is-live {
  color: #34d399;
  border-color: color-mix(in srgb, #34d399 34%, var(--color-border));
  background: color-mix(in srgb, #34d399 8%, transparent);
}
.hero15__trust .is-live i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 2px color-mix(in srgb, #34d399 22%, transparent);
  animation: hero15-dot 1.6s ease-in-out infinite;
}
.hero15__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
  margin-left: auto;
}
.hero15__actions .mast-cta { min-height: 34px; padding-inline: 12px; font-size: 12.5px; }
.hero15__actions .nx-btn { min-height: 34px; padding-inline: 12px; font-size: 12.5px; }
.hero15__metrics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex: none;
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  overflow: hidden;
  background: color-mix(in srgb, var(--color-elevated) 48%, var(--color-surface));
}
.hero15__metrics li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 7px;
  row-gap: 1px;
  align-items: center;
  min-width: 84px;
  padding: 8px 12px;
  border-right: 1px solid var(--color-border);
}
.hero15__metrics li:last-child { border-right: 0; }
.hero15__metrics li.is-live {
  background: color-mix(in srgb, #34d399 10%, transparent);
}
.hero15__metric-ico {
  grid-row: 1 / span 2;
  width: 22px;
  height: 22px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.hero15__metric-ico.is-live {
  background: color-mix(in srgb, #34d399 16%, var(--color-elevated));
}
.hero15__metric-ico.is-live i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 3px color-mix(in srgb, #34d399 22%, transparent);
  animation: hero15-dot 1.6s ease-in-out infinite;
}
.hero15__metrics strong {
  font-size: 14.5px;
  font-weight: 850;
  letter-spacing: -.02em;
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.hero15__metrics span:not(.hero15__metric-ico) {
  font-size: 10px;
  font-weight: 700;
  color: var(--color-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.hero15__rail {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  padding: 9px 14px 11px;
  border-top: 1px solid color-mix(in srgb, var(--color-border) 82%, var(--color-primary));
  background: color-mix(in srgb, #000 14%, var(--color-surface));
}
.hero15__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
  flex: 1;
}
.hero15__chips a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted);
  font-size: 11.5px;
  font-weight: 720;
  text-decoration: none;
  transition: color .12s ease, border-color .12s ease, background .12s ease;
}
.hero15__chips a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 36%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 9%, var(--color-surface));
}
.hero15__spot {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  max-width: min(420px, 100%);
  min-height: 30px;
  padding: 0 12px 0 10px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
  color: var(--color-text);
  text-decoration: none;
}
.hero15__spot:hover { filter: brightness(1.06); }
.hero15__spot--soft {
  border-color: var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.hero15__spot em {
  flex: none;
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero15__spot strong {
  min-width: 0;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero15__spot > span {
  flex: none;
  color: var(--color-primary-ink, var(--color-primary));
  font-weight: 800;
}
@keyframes hero15-ribbon {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}
@keyframes hero15-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .55; transform: scale(.85); }
}
@media (max-width: 980px) {
  .hero15__row {
    grid-template-columns: 1fr;
    gap: 11px;
  }
  .hero15__actions { margin-left: 0; }
  .hero15__metrics { width: 100%; }
  .hero15__metrics li { flex: 1; min-width: 0; }
  .hero15__spot { max-width: 100%; }
}
@media (max-width: 560px) {
  .hero15 { border-radius: 13px; }
  .hero15__row { padding: 12px 13px 10px; }
  .hero15__main { gap: 10px; }
  .hero15__titles p { max-width: 100%; white-space: normal; }
  .hero15__actions { width: 100%; }
  .hero15__actions .mast-cta,
  .hero15__actions .nx-btn { flex: 1; justify-content: center; }
  .hero15__rail { padding: 9px 12px 11px; }
  .hero15__spot { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .hero15__ribbon,
  .hero15__trust .is-live i,
  .hero15__metric-ico.is-live i { animation: none; }
}

/* Home hero v16 — ayrı kart: header’dan ve reklamlardan boşluklu */
.hero.hero--v16 {
  display: block;
  width: min(1600px, calc(100% - 24px));
  margin: 14px auto 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.hero16 {
  position: relative;
  overflow: hidden;
  border-radius: 15px;
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, var(--color-primary));
  background:
    linear-gradient(105deg,
      color-mix(in srgb, var(--color-primary) 13%, var(--color-surface)) 0%,
      var(--color-surface) 48%,
      color-mix(in srgb, var(--color-elevated) 60%, var(--color-surface)) 100%);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
}
.hero16::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 42%, #34d399 78%, transparent);
  pointer-events: none;
  z-index: 1;
}
.hero16__inner {
  width: 100%;
  margin: 0;
  padding: 12px 14px 11px;
}
.hero16__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 18px;
  align-items: center;
}
.hero16__main {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.hero16__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.hero16__logo {
  height: 30px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
  display: block;
}
.hero16__mark {
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 55%, #111));
  color: #fff;
  font-size: 13px;
  font-weight: 850;
}
.hero16__titles { min-width: 0; }
.hero16__titles em {
  display: block;
  margin: 0 0 1px;
  font-style: normal;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero.hero--v16 h1,
.hero16__titles h1 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 850;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero16__titles p {
  margin: 2px 0 0;
  font-size: 12px;
  line-height: 1.3;
  color: var(--color-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 46ch;
}
.hero16__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-left: auto;
}
.hero16__actions .mast-cta { min-height: 32px; padding-inline: 11px; font-size: 12.5px; }
.hero16__actions .nx-btn { min-height: 32px; padding-inline: 11px; font-size: 12.5px; }
.hero16__metrics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex: none;
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: 11px;
  overflow: hidden;
  background: color-mix(in srgb, var(--color-elevated) 46%, var(--color-surface));
}
.hero16__metrics li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 6px;
  row-gap: 1px;
  align-items: center;
  min-width: 78px;
  padding: 7px 11px;
  border-right: 1px solid var(--color-border);
}
.hero16__metrics li:last-child { border-right: 0; }
.hero16__metrics li.is-live {
  background: color-mix(in srgb, #34d399 10%, transparent);
}
.hero16__metric-ico {
  grid-row: 1 / span 2;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.hero16__metric-ico.is-live {
  background: color-mix(in srgb, #34d399 16%, var(--color-elevated));
}
.hero16__metric-ico.is-live i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 2px color-mix(in srgb, #34d399 22%, transparent);
  animation: hero16-dot 1.6s ease-in-out infinite;
}
.hero16__metrics strong {
  font-size: 14px;
  font-weight: 850;
  letter-spacing: -.02em;
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.hero16__metrics span:not(.hero16__metric-ico) {
  font-size: 9.5px;
  font-weight: 700;
  color: var(--color-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.hero16__rail {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-top: 9px;
  padding-top: 9px;
  border-top: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
}
.hero16__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
  flex: 1;
}
.hero16__chips a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 68%, transparent);
  color: var(--color-muted);
  font-size: 11px;
  font-weight: 720;
  text-decoration: none;
  transition: color .12s ease, border-color .12s ease, background .12s ease;
}
.hero16__chips a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 36%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 9%, var(--color-surface));
}
.hero16__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.hero16__trust span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted);
  font-size: 10.5px;
  font-weight: 740;
}
.hero16__trust .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.hero16__trust .is-live {
  color: #34d399;
  border-color: color-mix(in srgb, #34d399 34%, var(--color-border));
  background: color-mix(in srgb, #34d399 8%, transparent);
}
.hero16__trust .is-live i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 2px color-mix(in srgb, #34d399 22%, transparent);
  animation: hero16-dot 1.6s ease-in-out infinite;
}
.hero16__spot {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  max-width: min(360px, 100%);
  min-height: 28px;
  padding: 0 11px 0 9px;
  border-radius: 9px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
  color: var(--color-text);
  text-decoration: none;
  margin-left: auto;
}
.hero16__spot:hover { filter: brightness(1.06); }
.hero16__spot--soft {
  border-color: var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.hero16__spot em {
  flex: none;
  font-style: normal;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.hero16__spot strong {
  min-width: 0;
  font-size: 11.5px;
  font-weight: 750;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero16__spot > span {
  flex: none;
  color: var(--color-primary-ink, var(--color-primary));
  font-weight: 800;
}
@keyframes hero16-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .55; transform: scale(.85); }
}
/* Header → hero → reklam: her blok ayrı, aralarında boşluk */
body:has(.hero--v16) .nxs-stack {
  margin-top: 14px;
  margin-bottom: 10px;
}
body:has(.hero--v16) .nxs-pair {
  margin-top: 10px;
}
body:has(.hero--v16) .app-frame--home-hero {
  padding-top: 16px;
}
@media (max-width: 980px) {
  .hero16__row {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .hero16__actions { margin-left: 0; }
  .hero16__metrics { width: 100%; }
  .hero16__metrics li { flex: 1; min-width: 0; }
  .hero16__spot { max-width: 100%; margin-left: 0; }
}
@media (max-width: 560px) {
  .hero.hero--v16 {
    width: calc(100% - 20px);
    margin-top: 12px;
  }
  .hero16 { border-radius: 13px; }
  .hero16__inner { padding: 11px 12px 10px; }
  .hero16__titles p { max-width: 100%; white-space: normal; }
  .hero16__actions { width: 100%; }
  .hero16__actions .mast-cta,
  .hero16__actions .nx-btn { flex: 1; justify-content: center; }
  .hero16__spot { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .hero16__trust .is-live i,
  .hero16__metric-ico.is-live i { animation: none; }
}

.feed {
  margin: 0 0 22px; background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); overflow: hidden;
}
.feed__nav {
  display: flex; align-items: stretch; gap: 8px;
  background: var(--mast-nav); border-bottom: 1px solid var(--color-border);
}
.feed__tabs {
  display: flex; flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: thin;
}
.feed__tab {
  flex: 0 0 auto; border: 0; background: transparent; color: var(--color-muted);
  padding: 11px 14px; font-size: 12.5px; font-weight: 650; white-space: nowrap; cursor: pointer;
}
.feed__tab:hover { color: var(--color-text); background: color-mix(in srgb, #fff 4%, transparent); }
.feed__tab.is-on {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-surface));
  box-shadow: inset 0 -2px 0 var(--color-primary);
}
.feed__custom-btn {
  flex: 0 0 auto; margin: 8px 10px 8px 0; border: 0; border-radius: 8px;
  background: var(--color-primary); color: #fff; font-size: 12px; font-weight: 700;
  padding: 0 12px; cursor: pointer; letter-spacing: .02em;
}
.feed__custom-btn:hover { background: var(--color-primary-hover); }
.feed__prefs {
  display: none; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px 14px;
  padding: 12px 16px; border-bottom: 1px solid var(--color-border); background: var(--color-elevated);
  font-size: 13px; color: var(--color-muted);
}
.feed__prefs.is-on, .feed__prefs:not([hidden]) { display: grid; }
.feed__prefs[hidden] { display: none !important; }
.feed__prefs label { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.feed__head, .feed__row {
  display: grid; grid-template-columns: minmax(180px, 1.7fr) 150px 150px 140px;
  gap: 10px; align-items: center; padding: 0 16px;
}
.feed__head {
  min-height: 36px; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--color-muted); background: color-mix(in srgb, #000 10%, var(--color-surface));
  border-bottom: 1px solid var(--color-border);
}
.feed__row {
  min-height: 52px; color: inherit; border-bottom: 1px solid color-mix(in srgb, var(--color-border) 75%, transparent);
}
.feed__row:hover { background: var(--color-elevated); color: inherit; }
.feed__topic { display: flex; align-items: center; gap: 10px; min-width: 0; }
.feed__avatar {
  width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0;
  background: var(--color-elevated); color: var(--color-primary-ink, var(--color-primary)); font-size: 12px; font-weight: 700;
  object-fit: cover; border: 1px solid var(--color-border);
}
.feed__topic strong {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 14px; font-weight: 650; color: var(--color-text);
}
.feed__counts { display: flex; align-items: center; gap: 8px; color: var(--color-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.feed__counts em { font-style: normal; min-width: 1.4ch; }
.feed__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--color-primary); display: inline-block; }
.feed__last, .feed__forum { color: var(--color-muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.feed.hide-counts .feed__head span[data-col="counts"],
.feed.hide-counts [data-col="counts"],
.feed.hide-last .feed__head span[data-col="last"],
.feed.hide-last [data-col="last"],
.feed.hide-forum .feed__head span[data-col="forum"],
.feed.hide-forum [data-col="forum"] { display: none; }
.feed.hide-counts { grid-template-columns: unset; }
.feed.hide-counts .feed__head, .feed.hide-counts .feed__row { grid-template-columns: minmax(180px, 1.7fr) 150px 140px; }
.feed.hide-last .feed__head, .feed.hide-last .feed__row { grid-template-columns: minmax(180px, 1.7fr) 150px 140px; }
.feed.hide-forum .feed__head, .feed.hide-forum .feed__row { grid-template-columns: minmax(180px, 1.7fr) 150px 150px; }
.feed.hide-counts.hide-last .feed__head, .feed.hide-counts.hide-last .feed__row { grid-template-columns: minmax(180px, 1fr) 140px; }
.feed.hide-counts.hide-forum .feed__head, .feed.hide-counts.hide-forum .feed__row { grid-template-columns: minmax(180px, 1fr) 150px; }
.feed.hide-last.hide-forum .feed__head, .feed.hide-last.hide-forum .feed__row { grid-template-columns: minmax(180px, 1fr) 150px; }
.feed.hide-counts.hide-last.hide-forum .feed__head, .feed.hide-counts.hide-last.hide-forum .feed__row { grid-template-columns: 1fr; }
.feed__empty { margin: 0; padding: 28px 16px; text-align: center; color: var(--color-muted); }
.feed__foot { display: flex; justify-content: center; align-items: center; gap: 16px; padding: 12px; }
.feed__more {
  border: 0; background: transparent; color: var(--color-text); font-weight: 650; font-size: 13px; cursor: pointer;
}
.feed__more:hover { color: var(--color-primary-ink, var(--color-primary)); }
.feed__all { color: var(--color-muted); font-size: 13px; }
.feed__all:hover { color: var(--color-primary-ink, var(--color-primary)); }

/* Feed v10 � status � topic � last � replies � views */
.feed--v10 {
  margin: 0 0 24px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  background: var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.feed--v10 .feed__nav {
  align-items: center;
  gap: 10px;
  padding: 8px 10px 8px 8px;
  background: color-mix(in srgb, var(--color-elevated) 48%, var(--mast-nav));
  border-bottom: 1px solid var(--color-border);
}
.feed--v10 .feed__tabs { gap: 4px; }
.feed--v10 .feed__tab {
  min-height: 36px; padding: 0 12px; border-radius: 10px;
  font-size: 13px; font-weight: 700;
  box-shadow: none;
}
.feed--v10 .feed__tab.is-on {
  color: #fff;
  background: var(--color-primary);
  box-shadow: none;
}
.feed--v10 .feed__custom-btn {
  display: inline-flex; align-items: center; gap: 7px;
  margin: 0; min-height: 36px; padding: 0 12px; border-radius: 10px;
  font-size: 12.5px;
}
.feed--v10 .feed__custom-btn .yon-ico { color: #fff; }
.feed--v10 .feed__prefs {
  padding: 12px 14px;
  border-radius: 0;
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
.feed--v10 .feed__head,
.feed--v10 .feed__row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1.6fr) minmax(140px, .9fr) 72px 72px;
  gap: 10px;
  align-items: center;
  padding: 0 14px;
}
.feed--v10 .feed__head {
  min-height: 36px;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--color-muted);
  background: color-mix(in srgb, var(--color-elevated) 36%, transparent);
}
.feed--v10 .feed__head-status { width: 28px; }
.feed--v10 .feed__row {
  min-height: 62px;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-text);
  text-decoration: none;
  transition: background .12s ease;
}
.feed--v10 .feed__row:last-child { border-bottom: 0; }
.feed--v10 .feed__row:hover {
  background: color-mix(in srgb, var(--color-elevated) 62%, transparent);
  color: var(--color-text);
}
.feed--v10 .feed__row.is-hot {
  background: color-mix(in srgb, #f59e0b 6%, transparent);
}
.feed--v10 .feed__row.is-fresh {
  box-shadow: inset 3px 0 0 var(--color-primary);
}
.feed--v10 .feed__status {
  display: grid; place-items: center;
}
.feed--v10 .feed__status-ico {
  width: 10px; height: 10px; border-radius: 50%;
  background: color-mix(in srgb, var(--color-muted) 45%, transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-muted) 12%, transparent);
}
.feed--v10 .feed__status-ico.is-fresh {
  background: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.feed--v10 .feed__status-ico.is-hot {
  background: #f59e0b;
  box-shadow: 0 0 0 3px color-mix(in srgb, #f59e0b 22%, transparent);
}
.feed--v10 .feed__topic { gap: 12px; min-width: 0; }
.feed--v10 .feed__avatar {
  width: 36px; height: 36px; font-size: 13px; flex: none;
  border: 2px solid color-mix(in srgb, var(--color-primary) 26%, var(--color-border));
  border-radius: 50%; object-fit: cover;
  display: grid; place-items: center;
  background: var(--color-elevated);
}
.feed--v10 .feed__topic-text {
  display: grid; gap: 3px; min-width: 0;
}
.feed--v10 .feed__topic-text strong {
  font-size: 14.5px; font-weight: 750;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.feed--v10 .feed__meta {
  display: flex; flex-wrap: wrap; gap: 6px 10px;
  color: var(--color-muted); font-size: 12px; font-weight: 600;
}
.feed--v10 .feed__author { color: var(--color-text); }
.feed--v10 .feed__board { color: var(--color-primary-ink, var(--color-primary)); }
.feed--v10 .feed__last {
  display: flex; align-items: center; gap: 8px; min-width: 0;
  color: var(--color-muted); font-size: 12.5px;
}
.feed--v10 .feed__last-ava {
  width: 28px; height: 28px; border-radius: 50%; flex: none;
  object-fit: cover; display: grid; place-items: center;
  background: var(--color-elevated); font-size: 11px; font-weight: 750;
  border: 1px solid var(--color-border);
}
.feed--v10 .feed__last-text {
  display: grid; gap: 1px; min-width: 0;
}
.feed--v10 .feed__last-text em {
  font-style: normal; font-weight: 700; color: var(--color-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.feed--v10 .feed__last-text time {
  font-size: 11px; color: var(--color-muted);
}
.feed--v10 .feed__num {
  display: grid; justify-items: center; gap: 2px;
  font-variant-numeric: tabular-nums;
}
.feed--v10 .feed__num b {
  font-size: 13.5px; font-weight: 800; color: var(--color-text);
}
.feed--v10 .feed__num em {
  font-style: normal; color: var(--color-primary-ink, var(--color-primary)); line-height: 1;
}
.feed--v10.hide-counts .feed__head,
.feed--v10.hide-counts .feed__row {
  grid-template-columns: 28px minmax(0, 1fr) minmax(140px, .9fr);
}
.feed--v10.hide-counts .feed__num,
.feed--v10.hide-counts .feed__head span[data-col="counts"] { display: none; }
.feed--v10.hide-last .feed__head,
.feed--v10.hide-last .feed__row {
  grid-template-columns: 28px minmax(0, 1fr) 72px 72px;
}
.feed--v10.hide-last .feed__last,
.feed--v10.hide-last .feed__head span[data-col="last"] { display: none; }
.feed--v10.hide-forum .feed__board { display: none; }
.feed--v10.hide-counts.hide-last .feed__head,
.feed--v10.hide-counts.hide-last .feed__row {
  grid-template-columns: 28px minmax(0, 1fr);
}
.feed--v10 .feed__foot {
  padding: 14px 16px 16px;
  border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 28%, transparent);
}
.feed--v10 .feed__more {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 0 18px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 32%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-text);
  font-size: 14px; font-weight: 750;
}
.feed--v10 .feed__more .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.feed--v10 .feed__more:hover {
  color: #fff;
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.feed--v10 .feed__more:hover .yon-ico { color: #fff; }
.feed--v10 .feed__more.is-loading {
  opacity: .7; pointer-events: none;
}
.feed--v10 .feed__more[hidden] { display: none !important; }
.feed--v10 .feed__empty { margin: 0; padding: 28px 16px; text-align: center; color: var(--color-muted); }

/* Feed v11 — denser R10 rows + fixed mobile card layout */
.feed--v11 {
  margin: 0 0 22px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-border) 82%, var(--color-primary));
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}
.feed--v11 .feed__nav {
  align-items: center;
  gap: 8px;
  padding: 8px 8px 8px 6px;
  background: color-mix(in srgb, var(--color-elevated) 42%, var(--mast-nav));
  border-bottom: 1px solid var(--color-border);
}
.feed--v11 .feed__tabs {
  gap: 3px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.feed--v11 .feed__tabs::-webkit-scrollbar { display: none; }
.feed--v11 .feed__tab {
  min-height: 34px;
  padding: 0 11px;
  border-radius: 9px;
  font-size: 12.5px;
  font-weight: 720;
  box-shadow: none;
}
.feed--v11 .feed__tab.is-on {
  color: #fff;
  background: var(--color-primary);
  box-shadow: none;
}
.feed--v11 .feed__tab.is-fixed { cursor: pointer; user-select: none; }
.feed--v11 .feed__custom-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  min-height: 34px;
  padding: 0 11px;
  border-radius: 9px;
  font-size: 12px;
  flex: none;
}
.feed--v11 .feed__custom-btn .yon-ico { color: #fff; }
.feed--v11 .feed__head,
.feed--v11 .feed__row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1.55fr) minmax(132px, .85fr) 118px;
  gap: 10px 12px;
  align-items: center;
  padding: 0 12px;
}
.feed--v11 .feed__head {
  min-height: 34px;
  font-size: 10.5px;
  font-weight: 750;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--color-muted);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.feed--v11 .feed__head-status { width: 22px; }
.feed--v11 .feed__head span[data-col="counts"]:last-child { display: none; }
.feed--v11 .feed__row {
  min-height: 58px;
  border-bottom: 1px solid var(--color-border);
  background: #393c51;
  color: var(--color-text);
  text-decoration: none;
  transition: background .12s ease;
}
.feed--v11 .feed__row:last-child { border-bottom: 0; }
.feed--v11 .feed__row:hover {
  background: #393c51;
  color: var(--color-text);
}
.feed--v11 .feed__row.is-hot {
  background: #393c51;
}
.feed--v11 .feed__row.is-fresh {
  box-shadow: inset 3px 0 0 var(--color-primary);
}
.feed--v11 .feed__status { display: grid; place-items: center; }
.feed--v11 .feed__status-ico {
  width: 9px; height: 9px; border-radius: 50%;
  background: color-mix(in srgb, var(--color-muted) 42%, transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-muted) 12%, transparent);
}
.feed--v11 .feed__status-ico.is-fresh {
  background: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.feed--v11 .feed__status-ico.is-hot {
  background: var(--color-warning);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-warning) 22%, transparent);
}
.feed--v11 .feed__topic { gap: 10px; min-width: 0; }
.feed--v11 .feed__avatar {
  width: 34px; height: 34px; font-size: 12.5px; flex: none;
  border: 2px solid color-mix(in srgb, var(--color-primary) 24%, var(--color-border));
  border-radius: 50%; object-fit: cover;
  display: grid; place-items: center;
  background: var(--color-elevated);
}
.feed--v11 .feed__topic-text { display: grid; gap: 2px; min-width: 0; }
.feed--v11 .feed__topic-text strong {
  font-size: 14px; font-weight: 750;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.feed--v11 .feed__meta {
  display: flex; flex-wrap: wrap; gap: 4px 8px;
  color: var(--color-muted); font-size: 11.5px; font-weight: 600;
}
.feed--v11 .feed__author { color: var(--color-text-secondary); }
.feed--v11 .feed__board { color: var(--color-primary-ink, var(--color-primary)); }
.feed--v11 .feed__last {
  display: flex; align-items: center; gap: 8px; min-width: 0;
  color: var(--color-muted); font-size: 12px;
}
.feed--v11 .feed__last-ava {
  width: 26px; height: 26px; border-radius: 50%; flex: none;
  object-fit: cover; display: grid; place-items: center;
  background: var(--color-elevated); font-size: 10.5px; font-weight: 750;
  border: 1px solid var(--color-border);
}
.feed--v11 .feed__last-text { display: grid; gap: 1px; min-width: 0; }
.feed--v11 .feed__last-text em {
  font-style: normal; font-weight: 700; color: var(--color-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.feed--v11 .feed__last-text time { font-size: 10.5px; color: var(--color-muted); }
.feed--v11 .feed__stats {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
}
.feed--v11 .feed__num {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  font-variant-numeric: tabular-nums;
}
.feed--v11 .feed__num b {
  font-size: 12.5px; font-weight: 800; color: var(--color-text);
}
.feed--v11 .feed__num em {
  font-style: normal; color: var(--color-primary-ink, var(--color-primary)); line-height: 1;
  display: inline-flex;
}
.feed--v11.hide-counts .feed__head,
.feed--v11.hide-counts .feed__row {
  grid-template-columns: 22px minmax(0, 1fr) minmax(132px, .85fr);
}
.feed--v11.hide-counts .feed__stats,
.feed--v11.hide-counts .feed__head span[data-col="counts"] { display: none; }
.feed--v11.hide-last .feed__head,
.feed--v11.hide-last .feed__row {
  grid-template-columns: 22px minmax(0, 1fr) 118px;
}
.feed--v11.hide-last .feed__last,
.feed--v11.hide-last .feed__head span[data-col="last"] { display: none; }
.feed--v11.hide-forum .feed__board { display: none; }
.feed--v11.hide-counts.hide-last .feed__head,
.feed--v11.hide-counts.hide-last .feed__row {
  grid-template-columns: 22px minmax(0, 1fr);
}
.feed--v11 .feed__foot {
  padding: 12px 14px 14px;
  border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 30%, transparent);
}
.feed--v11 .feed__more {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 42px; padding: 0 16px;
  border-radius: 11px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  color: var(--color-text);
  font-size: 13.5px; font-weight: 750;
}
.feed--v11 .feed__more .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.feed--v11 .feed__more:hover {
  color: #fff;
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.feed--v11 .feed__more:hover .yon-ico { color: #fff; }
.feed--v11 .feed__more.is-loading { opacity: .7; pointer-events: none; }
.feed--v11 .feed__more[hidden] { display: none !important; }
.feed--v11 .feed__empty { margin: 0; padding: 28px 16px; text-align: center; color: var(--color-muted); }

@media (max-width: 980px) {
  .feed--v11 .feed__head { display: none; }
  .feed--v11 .feed__nav {
    flex-wrap: nowrap;
    gap: 6px;
    padding: 7px 8px;
  }
  .feed--v11 .feed__tab {
    min-height: 32px;
    padding: 0 10px;
    font-size: 12px;
    border-radius: 8px;
  }
  .feed--v11 .feed__custom-btn {
    min-height: 32px;
    padding: 0 9px;
  }
  .feed--v11 .feed__custom-btn span { display: none; }
  .feed--v11 .feed__row,
  .feed--v11.hide-counts .feed__row,
  .feed--v11.hide-last .feed__row,
  .feed--v11.hide-forum .feed__row,
  .feed--v11.hide-counts.hide-last .feed__row,
  .feed--v11.hide-counts.hide-forum .feed__row,
  .feed--v11.hide-last.hide-forum .feed__row,
  .feed--v11.hide-counts.hide-last.hide-forum .feed__row {
    grid-template-columns: 14px minmax(0, 1fr);
    grid-template-areas:
      "st topic"
      ". last"
      ". stats";
    gap: 6px 8px;
    padding: 11px 10px;
    min-height: 0;
    align-items: start;
  }
  .feed--v11 .feed__status { grid-area: st; align-self: start; padding-top: 10px; }
  .feed--v11 .feed__topic { grid-area: topic; }
  .feed--v11 .feed__last { grid-area: last; }
  .feed--v11 .feed__stats {
    grid-area: stats;
    justify-content: flex-start;
    gap: 8px;
    padding-top: 2px;
  }
  .feed--v11 .feed__num {
    min-height: 26px;
    padding: 0 8px;
    border-radius: 8px;
    border: 1px solid var(--color-border);
    background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  }
  .feed--v11 .feed__topic-text strong {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.3;
  }
  .feed--v11 .feed__avatar { width: 32px; height: 32px; font-size: 12px; }
  .feed--v11 .feed__last-ava { width: 22px; height: 22px; font-size: 10px; }
  .feed--v11 .feed__last-text em { max-width: 100%; }
  .feed--v11.hide-last .feed__row {
    grid-template-areas:
      "st topic"
      ". stats";
  }
  .feed--v11.hide-counts .feed__row {
    grid-template-areas:
      "st topic"
      ". last";
  }
  .feed--v11.hide-counts.hide-last .feed__row {
    grid-template-areas: "st topic";
  }
  .feed--v11 .feed__more { width: 100%; }
  .feed--v11 .feed__foot { padding: 10px; }
}
@media (max-width: 560px) {
  .feed--v11 { border-radius: 12px; margin-bottom: 16px; }
  .feed--v11 .feed__meta { font-size: 11px; gap: 3px 6px; }
  .feed--v11 .feed__num b { font-size: 12px; }
}

/* Feed v12 — same footprint, refined R10 visual language */
.feed--v12 {
  --feed12-line: color-mix(in srgb, var(--color-border) 88%, transparent);
  --feed12-rail: color-mix(in srgb, var(--color-elevated) 55%, var(--mast-nav));
  margin: 0 0 22px;
  border-radius: 14px;
  overflow: visible;
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, var(--color-primary));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 4%, transparent), transparent 28px),
    var(--color-surface);
  box-shadow:
    var(--shadow-sm),
    inset 0 1px 0 color-mix(in srgb, #fff 5%, transparent);
}
.feed--v12 .feed__nav {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 8px 8px 6px;
  border-radius: 14px 14px 0 0;
  background: var(--feed12-rail);
  border-bottom: 1px solid var(--feed12-line);
}
.feed--v12 .feed__tabs {
  display: flex;
  flex: 1;
  min-width: 0;
  gap: 3px;
  padding: 2px;
  border-radius: 11px;
  background: color-mix(in srgb, #000 14%, transparent);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.feed--v12 .feed__tabs::-webkit-scrollbar { display: none; }
.feed--v12 .feed__tab {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 11px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--color-muted);
  font-size: 12.5px;
  font-weight: 720;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: none;
  transition: color .12s ease, background .12s ease;
}
.feed--v12 .feed__tab:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-hover) 88%, transparent);
}
.feed--v12 .feed__tab.is-on {
  color: #fff;
  background: var(--color-primary);
  box-shadow: 0 1px 0 color-mix(in srgb, #000 18%, transparent);
}
.feed--v12 .feed__tab.is-fixed { cursor: pointer; user-select: none; }
.feed--v12 .feed__custom-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: none;
  margin: 0;
  min-height: 34px;
  padding: 0 11px;
  border: 0;
  border-radius: 9px;
  background: var(--color-primary);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 1px 0 color-mix(in srgb, #000 18%, transparent);
}
.feed--v12 .feed__custom-btn .yon-ico { color: #fff; }
.feed--v12 .feed__custom-btn:hover { background: var(--color-primary-hover); }
.feed--v12 .feed__body { overflow: hidden; }
.feed--v12 .feed__head,
.feed--v12 .feed__row {
  display: grid;
  grid-template-columns: 20px minmax(0, 1.6fr) minmax(128px, .82fr) 112px;
  gap: 10px 12px;
  align-items: center;
  padding: 0 12px;
}
.feed--v12 .feed__head {
  min-height: 34px;
  font-size: 10.5px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-muted) 88%, var(--color-text));
  background: color-mix(in srgb, var(--color-elevated) 36%, transparent);
  border-bottom: 1px solid var(--feed12-line);
}
.feed--v12 .feed__head-status { width: 20px; }
.feed--v12 .feed__head span[data-col="counts"] { text-align: right; padding-right: 2px; }
.feed--v12 .feed__row {
  min-height: 56px;
  border-bottom: 1px solid var(--feed12-line);
  background: #393c51;
  color: var(--color-text);
  text-decoration: none;
  transition: background .14s ease, box-shadow .14s ease;
}
.feed--v12 .feed__row:nth-child(even) {
  background: #393c51;
}
.feed--v12 .feed__row:last-child { border-bottom: 0; }
.feed--v12 .feed__row:hover {
  background: #393c51;
  color: var(--color-text);
}
.feed--v12 .feed__row:hover .feed__topic-text strong { color: var(--color-primary-ink, var(--color-primary)); }
.feed--v12 .feed__row.is-hot {
  background: #393c51;
}
.feed--v12 .feed__row.is-fresh {
  box-shadow: inset 3px 0 0 var(--color-primary);
}
.feed--v12 .feed__status { display: grid; place-items: center; }
.feed--v12 .feed__status-ico {
  width: 8px; height: 8px; border-radius: 50%;
  background: color-mix(in srgb, var(--color-muted) 48%, transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-muted) 10%, transparent);
}
.feed--v12 .feed__status-ico.is-fresh {
  background: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.feed--v12 .feed__status-ico.is-hot {
  background: var(--color-warning);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-warning) 22%, transparent);
}
.feed--v12 .feed__topic {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.feed--v12 .feed__avatar {
  width: 34px; height: 34px; font-size: 12.5px; flex: none;
  border: 2px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  border-radius: 50%; object-fit: cover;
  display: grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
  font-weight: 800;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-primary) 8%, transparent);
}
.feed--v12 .feed__topic-text { display: grid; gap: 3px; min-width: 0; }
.feed--v12 .feed__topic-text strong {
  font-size: 14px; font-weight: 750;
  letter-spacing: -.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: color .12s ease;
}
.feed--v12 .feed__meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0 0;
  color: var(--color-muted); font-size: 11.5px; font-weight: 600;
}
.feed--v12 .feed__meta > span + span::before {
  content: "·";
  margin: 0 6px;
  color: color-mix(in srgb, var(--color-muted) 70%, transparent);
  font-weight: 700;
}
.feed--v12 .feed__author { color: var(--color-text-secondary); }
.feed--v12 .feed__board {
  color: var(--color-primary-ink, var(--color-primary));
  padding: 1px 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-primary) 18%, transparent);
  font-size: 11px;
  font-weight: 700;
}
.feed--v12 .feed__meta > .feed__board::before { display: none; }
.feed--v12 .feed__meta > span + .feed__board { margin-left: 6px; }
.feed--v12:not(.hide-last) .feed__meta .feed__when { display: none; }
.feed--v12 .feed__last {
  display: flex; align-items: center; gap: 8px; min-width: 0;
  padding: 5px 8px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
  background: color-mix(in srgb, var(--color-elevated) 42%, transparent);
  color: var(--color-muted); font-size: 12px;
  white-space: normal; overflow: visible; text-align: left;
}
.feed--v12 .feed__last-ava {
  width: 26px; height: 26px; border-radius: 50%; flex: none;
  object-fit: cover; display: grid; place-items: center;
  background: var(--color-elevated); font-size: 10.5px; font-weight: 750;
  color: var(--color-primary-ink, var(--color-primary));
  border: 1px solid var(--color-border);
}
.feed--v12 .feed__last-text { display: grid; gap: 1px; min-width: 0; }
.feed--v12 .feed__last-text em {
  font-style: normal; font-weight: 700; color: var(--color-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.feed--v12 .feed__last-text time { font-size: 10.5px; color: var(--color-muted); }
.feed--v12 .feed__stats {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}
.feed--v12 .feed__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 44px;
  min-height: 28px;
  padding: 0 7px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--color-border) 85%, transparent);
  background: color-mix(in srgb, var(--color-elevated) 48%, transparent);
  font-variant-numeric: tabular-nums;
}
.feed--v12 .feed__num b {
  font-size: 12.5px; font-weight: 800; color: var(--color-text);
}
.feed--v12 .feed__num em {
  font-style: normal; color: var(--color-primary-ink, var(--color-primary)); line-height: 1;
  display: inline-flex; opacity: .92;
}
.feed--v12 .feed__row:hover .feed__num {
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-elevated));
}
.feed--v12.hide-counts .feed__head,
.feed--v12.hide-counts .feed__row {
  grid-template-columns: 20px minmax(0, 1fr) minmax(128px, .82fr);
}
.feed--v12.hide-counts .feed__stats,
.feed--v12.hide-counts .feed__head span[data-col="counts"] { display: none; }
.feed--v12.hide-last .feed__head,
.feed--v12.hide-last .feed__row {
  grid-template-columns: 20px minmax(0, 1fr) 112px;
}
.feed--v12.hide-last .feed__last,
.feed--v12.hide-last .feed__head span[data-col="last"] { display: none; }
.feed--v12.hide-forum .feed__board { display: none; }
.feed--v12.hide-counts.hide-last .feed__head,
.feed--v12.hide-counts.hide-last .feed__row {
  grid-template-columns: 20px minmax(0, 1fr);
}
.feed--v12 .feed__foot {
  padding: 12px 14px 14px;
  border-top: 1px solid var(--feed12-line);
  border-radius: 0 0 14px 14px;
  background: color-mix(in srgb, var(--color-elevated) 28%, transparent);
}
.feed--v12 .feed__more {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 42px; padding: 0 16px;
  border-radius: 11px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  color: var(--color-text);
  font-size: 13.5px; font-weight: 750;
  cursor: pointer;
  transition: background .14s ease, color .14s ease, border-color .14s ease;
}
.feed--v12 .feed__more .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.feed--v12 .feed__more:hover {
  color: #fff;
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.feed--v12 .feed__more:hover .yon-ico { color: #fff; }
.feed--v12 .feed__more.is-loading { opacity: .7; pointer-events: none; }
.feed--v12 .feed__more[hidden] { display: none !important; }
.feed--v12 .feed__empty { margin: 0; padding: 28px 16px; text-align: center; color: var(--color-muted); }

@media (max-width: 980px) {
  .feed--v12 .feed__head { display: none; }
  .feed--v12 .feed__nav {
    flex-wrap: nowrap;
    gap: 6px;
    padding: 7px 8px;
    border-radius: 12px 12px 0 0;
  }
  .feed--v12 .feed__tabs { padding: 2px; border-radius: 10px; }
  .feed--v12 .feed__tab {
    min-height: 32px;
    padding: 0 10px;
    font-size: 12px;
    border-radius: 8px;
  }
  .feed--v12 .feed__custom-btn {
    min-height: 32px;
    padding: 0 9px;
  }
  .feed--v12 .feed__custom-btn span { display: none; }
  .feed--v12 .feed__body { border-radius: 0; }
  .feed--v12 .feed__row,
  .feed--v12.hide-counts .feed__row,
  .feed--v12.hide-last .feed__row,
  .feed--v12.hide-forum .feed__row,
  .feed--v12.hide-counts.hide-last .feed__row,
  .feed--v12.hide-counts.hide-forum .feed__row,
  .feed--v12.hide-last.hide-forum .feed__row,
  .feed--v12.hide-counts.hide-last.hide-forum .feed__row {
    grid-template-columns: 12px minmax(0, 1fr) auto;
    grid-template-areas:
      "st topic stats"
      ". last  stats";
    gap: 5px 10px;
    padding: 11px 10px;
    min-height: 0;
    align-items: start;
  }
  .feed--v12 .feed__status { grid-area: st; align-self: start; padding-top: 11px; }
  .feed--v12 .feed__topic { grid-area: topic; align-items: flex-start; }
  .feed--v12 .feed__last {
    grid-area: last;
    min-width: 0;
    padding: 4px 7px;
    border-radius: 9px;
  }
  .feed--v12 .feed__stats {
    grid-area: stats;
    flex-direction: column;
    align-self: stretch;
    justify-content: center;
    align-items: stretch;
    gap: 5px;
    min-width: 52px;
  }
  .feed--v12 .feed__num {
    justify-content: center;
    min-width: 0;
    min-height: 24px;
    padding: 0 7px;
    border-radius: 7px;
  }
  .feed--v12 .feed__num--replies,
  .feed--v12 .feed__num--views { grid-area: unset; }
  .feed--v12 .feed__topic-text strong {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.3;
  }
  .feed--v12 .feed__meta .feed__when { display: none; }
  .feed--v12 .feed__avatar { width: 32px; height: 32px; font-size: 12px; margin-top: 1px; }
  .feed--v12 .feed__last-ava { width: 22px; height: 22px; font-size: 10px; }
  .feed--v12 .feed__last-text em { max-width: 100%; }
  .feed--v12.hide-last .feed__row {
    grid-template-columns: 12px minmax(0, 1fr) auto;
    grid-template-areas: "st topic stats";
    align-items: center;
  }
  .feed--v12.hide-last .feed__status { padding-top: 0; }
  .feed--v12.hide-counts .feed__row {
    grid-template-columns: 12px minmax(0, 1fr);
    grid-template-areas:
      "st topic"
      ". last";
  }
  .feed--v12.hide-counts.hide-last .feed__row {
    grid-template-columns: 12px minmax(0, 1fr);
    grid-template-areas: "st topic";
  }
  .feed--v12 .feed__more { width: 100%; }
  .feed--v12 .feed__foot {
    padding: 10px;
    border-radius: 0 0 12px 12px;
  }
}
@media (max-width: 560px) {
  .feed--v12 { border-radius: 12px; margin-bottom: 16px; }
  .feed--v12 .feed__meta { font-size: 11px; }
  .feed--v12 .feed__num b { font-size: 12px; }
  .feed--v12 .feed__stats { min-width: 48px; }
}

@media (max-width: 900px) {
  .feed--v10 .feed__head { display: none; }
  .feed--v10 .feed__row,
  .feed--v10.hide-counts .feed__row,
  .feed--v10.hide-last .feed__row,
  .feed--v10.hide-counts.hide-last .feed__row {
    grid-template-columns: 18px minmax(0, 1fr) auto;
    grid-template-areas:
      "st topic nums"
      ". last nums";
    gap: 4px 10px;
    padding: 12px;
    min-height: 0;
    align-items: start;
  }
  .feed--v10 .feed__status { grid-area: st; align-self: start; padding-top: 8px; }
  .feed--v10 .feed__topic { grid-area: topic; min-width: 0; }
  .feed--v10 .feed__last { grid-area: last; min-width: 0; }
  .feed--v10 .feed__nums,
  .feed--v10 .feed__num--replies,
  .feed--v10 .feed__num--views { grid-area: nums; }
  .feed--v10 .feed__num--replies,
  .feed--v10 .feed__num--views {
    display: flex; flex-direction: column; align-items: flex-end; gap: 6px;
  }
  .feed--v10 .feed__num--replies { align-self: start; }
  .feed--v10 .feed__num--views {
    align-self: end;
    margin-top: 28px;
  }
  .feed--v10.hide-counts .feed__num { display: none !important; }
  .feed--v10.hide-last .feed__last { display: none !important; }
  .feed--v10.hide-last .feed__row {
    grid-template-areas: "st topic nums";
  }
  .feed--v10.hide-counts .feed__row,
  .feed--v10.hide-counts.hide-last .feed__row {
    grid-template-columns: 18px minmax(0, 1fr);
    grid-template-areas:
      "st topic"
      ". last";
  }
  .feed--v10.hide-counts.hide-last .feed__row {
    grid-template-areas: "st topic";
  }
  .feed--v10 .feed__topic-text strong {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .feed--v10 .feed__avatar { width: 32px; height: 32px; font-size: 12px; }
  .feed--v10 .feed__last-ava { width: 24px; height: 24px; font-size: 10px; }
  .feed--v10 .feed__num b { font-size: 12.5px; }
}
@media (max-width: 560px) {
  .feed--v10 .feed__nav { flex-wrap: nowrap; gap: 6px; padding: 6px 8px; }
  .feed--v10 .feed__tabs { gap: 2px; }
  .feed--v10 .feed__tab { min-height: 32px; padding: 0 10px; font-size: 12px; border-radius: 8px; }
  .feed--v10 .feed__custom-btn { min-height: 32px; padding: 0 10px; }
  .feed--v10 .feed__custom-btn span { display: none; }
  .feed--v10 .feed__last-text em { max-width: 16ch; }
  .feed--v10 .feed__meta { font-size: 11.5px; gap: 4px 8px; }
  .feed--v10 .feed__num--views { margin-top: 22px; }
}

.stat-card { padding: 16px 18px; display: grid; gap: 4px; }
.stat-card strong { font-size: 1.35rem; }
.stat-card span { color: var(--color-muted); font-size: var(--text-sm); }
.section-head { display: flex; justify-content: space-between; align-items: baseline; margin: 8px 0 12px; }
.section-head h2 { margin: 0; font-size: var(--text-lg); font-weight: 650; }
.trend-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 22px; }
.trend-card, .forum-card, .market-card, .user-card {
  display: grid; gap: 8px; padding: 16px; color: var(--color-text);
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); transition: transform var(--ease), border-color var(--ease);
}
.trend-card:hover, .forum-card:hover, .market-card:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border)); color: var(--color-text); }
.trend-card h3, .forum-card h3, .market-card h2 { margin: 0; font-size: var(--text-base); font-weight: 650; }
.meta-row { display: flex; flex-wrap: wrap; gap: 10px; color: var(--color-muted); font-size: var(--text-xs); }
.badge, .yon-chip, .rank-chip {
  display: inline-flex; align-items: center; font-size: 11px; font-weight: 650;
  letter-spacing: .03em; padding: 3px 8px; border-radius: 999px;
  background: var(--color-elevated); color: var(--color-muted); border: 1px solid var(--color-border);
}
.badge--pin { color: var(--color-primary-ink, var(--color-primary)); border-color: color-mix(in srgb, var(--color-primary) 30%, var(--color-border)); }
.badge--lock { color: var(--color-warning); }
.badge--hot { color: var(--color-danger); }
.badge--ok, .yon-badge.is-online { color: #052e16; background: var(--color-success); border-color: var(--color-success); }
.forum-group { margin-bottom: 22px; }
.forum-group h2 { font-size: var(--text-sm); text-transform: uppercase; letter-spacing: .08em; color: var(--color-muted); margin: 0 0 10px; }
.forum-list { display: grid; gap: 10px; }
.forum-card { grid-template-columns: 44px 1fr auto; align-items: center; }
.forum-card p { margin: 0; color: var(--color-muted); font-size: var(--text-sm); }
.thread-row {
  display: grid; grid-template-columns: 40px 1fr auto; gap: 12px; align-items: center;
  padding: 14px 4px; border-bottom: 1px solid var(--color-border); color: var(--color-text);
}
.thread-row:hover { background: color-mix(in srgb, var(--color-elevated) 70%, transparent); }
.thread-row strong { display: block; }
.thread-row small { color: var(--color-muted); }
.dash-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-end; margin-bottom: 18px; }
.dash-head h1 { margin: 0; font-size: clamp(1.4rem, 2.4vw, 1.9rem); }
.dash-kicker { margin: 0 0 6px; }
.dash-alert {
  display: flex; gap: 10px; flex-wrap: wrap; padding: 12px 14px; margin-bottom: 14px;
  border-radius: var(--radius-md); background: var(--color-elevated); border: 1px solid var(--color-border);
}
.panel { overflow: hidden; margin-bottom: 16px; }
.panel__head { padding: 14px 16px; border-bottom: 1px solid var(--color-border); }
.panel__head h2 { margin: 0; font-size: 15px; }
.panel__empty, .empty {
  padding: 28px 18px; text-align: center; color: var(--color-muted);
}
.conv-list { display: grid; }
.conv-row {
  display: grid; grid-template-columns: 40px 1fr auto; gap: 12px; align-items: center;
  padding: 13px 16px; color: var(--color-text); border-bottom: 1px solid var(--color-border);
}
.conv-row:hover, .conv-row.is-pinned { background: var(--color-elevated); }
.conv-row.is-unread { box-shadow: inset 3px 0 0 var(--color-primary); }
.conv-row__body { display: grid; gap: 2px; min-width: 0; }
.conv-row__body strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; }
.conv-row__body small, .conv-row time, .conv-row__meta { color: var(--color-muted); font-size: 12px; }
.conv-row__meta { display: grid; gap: 2px; text-align: right; }
.nav-badge {
  display: inline-grid; place-items: center; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 999px; background: var(--color-primary); color: #fff;
  font-size: 10px; font-style: normal; font-weight: 700;
}
.icon-btn { position: relative; }
.mast-ico .nav-badge, .icon-btn .nav-badge {
  position: absolute; top: 2px; right: 2px; margin: 0;
}
.nav-badge--alert { background: var(--color-danger); }
.home-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
.crumb { display: flex; gap: 8px; color: var(--color-muted); font-size: 13px; margin-bottom: 12px; }
.chip-row { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 0 14px; }
.user-chip { display: inline-flex; gap: 6px; align-items: center; color: var(--color-text); font-size: 13px; padding: 6px 10px; border-radius: 999px; border: 1px solid var(--color-border); }
.user-chip.is-active, .user-chip:hover { border-color: var(--color-primary); color: var(--color-text); }
.user-chip .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--color-online); }
.yon-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.yon-pager { display: flex; gap: 6px; margin-top: 16px; }
.yon-pager a { padding: 6px 10px; border: 1px solid var(--color-border); border-radius: 8px; color: var(--color-text); }
.yon-pager a.is-active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }

.yon-thread__head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; margin-bottom: 16px; }
.yon-thread__head h1 { margin: 0 0 6px; font-size: clamp(1.4rem, 2.5vw, 2rem); }
.thread-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; margin-bottom: 16px; }
.thread-head h1 { margin: 6px 0; font-size: clamp(1.35rem, 2.4vw, 1.9rem); }
.thread-head__meta {
  display: flex; flex-wrap: wrap; gap: 8px; margin: 0;
  color: var(--color-muted); font-size: 13px;
}
.thread-head__meta span + span::before {
  content: "?"; margin-right: 8px; color: var(--color-disabled);
}
.thread-head__tools { display: flex; flex-wrap: wrap; gap: 8px; }
.thread-head__tools .is-on { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.thread-head__meta span + span::before { content: "?"; margin-right: 8px; color: var(--color-disabled); }

/* Thread v4 */
.yon-thread--v4 { display: grid; gap: 14px; max-width: 1080px; margin: 0 auto; }
.crumb--v4 {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  margin: 0; padding: 0 2px; color: var(--color-muted); font-size: 12.5px;
}
.crumb--v4 a { color: var(--color-muted); }
.crumb--v4 a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.crumb--v4 span:last-child {
  color: var(--color-text); font-weight: 650;
  max-width: 42ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.thread-head--v4 {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: start;
  margin: 0; padding: 18px 18px 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  border-radius: 16px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 42%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.thread-head__ribbon {
  position: absolute; left: 0; right: 0; top: 0; height: 2px; z-index: 2;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 40%, #34d399 75%, transparent);
  background-size: 200% 100%;
  animation: corp-ribbon 8s linear infinite;
}
.thread-head--v4 h1 {
  margin: 8px 0 12px; font-size: clamp(1.2rem, 2.1vw, 1.65rem); letter-spacing: -.02em; line-height: 1.25;
}
.thread-head__flags {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.thread-head__forum {
  display: inline-flex; align-items: center; gap: 5px;
  height: 26px; padding: 0 9px; border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 60%, transparent);
  color: var(--color-muted); font-size: 11.5px; font-weight: 700;
}
.thread-pulse {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.thread-pulse > span {
  display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 10px; border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
  color: var(--color-muted); font-size: 12px; font-weight: 650;
}
.thread-pulse strong { color: var(--color-text); font-weight: 800; font-variant-numeric: tabular-nums; }
.thread-pulse .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.thread-head--v4 .thread-head__tools {
  display: flex; flex-direction: column; align-items: stretch; gap: 8px; min-width: 148px;
}
.thread-head--v4 .thread-head__tools .nx-btn {
  width: 100%; justify-content: center; min-height: 36px; border-radius: 10px; gap: 6px;
}
.thread-note--v4 {
  margin: 0; padding: 12px 14px; border-radius: 12px; font-size: 12.5px; line-height: 1.45;
}
.post-list--v4 { gap: 12px; }
.post--v4 {
  grid-template-columns: 156px minmax(0, 1fr);
  align-items: start;
  border-radius: 14px;
  border-color: color-mix(in srgb, var(--color-border) 90%, var(--color-primary));
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 3%, transparent) inset;
}
.post--v4 .post__bar {
  min-height: 36px; padding: 5px 10px; border-radius: 14px 14px 0 0; width: 100%;
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
}
.post--v4 .post__aside {
  padding: 14px 10px; gap: 8px; align-self: stretch;
  border-radius: 0 0 0 14px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 40%),
    var(--color-elevated);
}
.post--v4 .post__main,
.post--v4 .post__react,
.post--v4 .post__foot { align-self: stretch; }
.post--v4 .post__ava, .post--v4 img.post__ava {
  width: 64px; height: 64px; font-size: 20px;
  box-shadow: 0 0 0 3px var(--color-elevated);
}
.post--v4 .post__name a { font-size: 13.5px; }
.post--v4 .post__content {
  padding: 14px 16px 10px; max-height: 520px; font-size: 14.5px; line-height: 1.62;
}
.post--v4 .post__react { padding: 7px 12px; }
.post--v4 .post__foot { padding: 7px 12px 10px; }
.post--v4 .post__sig { margin: 0 16px; }
.post--v4 .post__stats { padding-top: 8px; gap: 5px; }
.post--v4 .post-like { border-radius: 9px; min-height: 32px; font-size: 12px; }
.post--v4 .post-act { min-height: 32px; border-radius: 9px; }
.post-reply--v4 {
  border-radius: 14px; overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.thread-readers--v4 {
  margin: 0; padding: 12px 14px; border-radius: 14px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 50%),
    var(--color-surface);
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
}
.thread-readers__head {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: baseline;
}
.thread-readers__head strong {
  font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--color-muted);
}
.thread-readers__head span { color: var(--color-text); font-size: 12.5px; font-weight: 650; }
.yon-thread--v4 .yon-pager { margin-top: 2px; justify-content: center; }
.yon-thread--v4 .thread-jump a {
  border-radius: 11px;
  box-shadow: 0 8px 18px color-mix(in srgb, #000 18%, transparent);
}

/* Thread v5 */
.yon-thread--v5 {
  display: grid; gap: 12px; max-width: 1120px; margin: 0 auto;
}
.crumb--v5 {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  margin: 0; padding: 0 2px; color: var(--color-muted); font-size: 12.5px;
}
.crumb--v5 a { color: var(--color-muted); }
.crumb--v5 a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.crumb--v5 span:last-child {
  color: var(--color-text); font-weight: 650;
  max-width: min(48ch, 70vw); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.thread-head--v5 {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; gap: 14px; margin: 0; padding: 18px 18px 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  border-radius: 18px;
  background:
    radial-gradient(520px 180px at 12% -20%, color-mix(in srgb, var(--color-primary) 22%, transparent), transparent 70%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 35%, transparent), transparent 48%),
    var(--color-surface);
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset,
    0 14px 34px color-mix(in srgb, #000 16%, transparent);
}
.thread-head__glow {
  position: absolute; inset: auto -10% -40% auto; width: 280px; height: 180px; z-index: 0;
  background: radial-gradient(circle, color-mix(in srgb, #38bdf8 18%, transparent), transparent 70%);
  pointer-events: none;
}
.thread-head--v5 > *:not(.thread-head__ribbon):not(.thread-head__glow) { position: relative; z-index: 1; }
.thread-head--v5 .thread-head__ribbon { z-index: 2; }
.thread-head__top {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center;
}
.thread-head__op {
  display: inline-flex; align-items: center; gap: 10px; min-width: 0; margin-left: auto;
  padding: 6px 10px 6px 6px; border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); text-decoration: none;
}
.thread-head__op:hover { border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border)); color: var(--color-text); }
.thread-head__op-av, img.thread-head__op-av {
  width: 34px; height: 34px; border-radius: 50%; object-fit: cover; display: grid; place-items: center;
  background: var(--color-elevated); font-weight: 800; font-size: 13px;
}
.thread-head__op span { display: grid; min-width: 0; line-height: 1.2; }
.thread-head__op strong {
  font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.thread-head__op small { color: var(--color-muted); font-size: 11px; }
.thread-head--v5 h1 {
  margin: 0; font-size: clamp(1.28rem, 2.3vw, 1.85rem);
  letter-spacing: -.025em; line-height: 1.22; max-width: 36ch;
}
.thread-pulse--v5 { gap: 8px; }
.thread-pulse--v5 > span {
  height: 32px; padding: 0 11px; border-radius: 11px;
  background: color-mix(in srgb, var(--color-elevated) 62%, transparent);
}
.thread-pulse--v5 b { font-size: 13px; }
.thread-pulse--v5 em { font-style: normal; }
.thread-head__tools--v5 {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding-top: 2px; border-top: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
}
.thread-head__tools--v5 form { margin: 0; }
.th-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 36px; padding: 0 12px; border-radius: 11px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); font-size: 12.5px; font-weight: 750; cursor: pointer; text-decoration: none;
}
.th-btn:hover { border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border)); color: var(--color-text); }
.th-btn.is-on {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
}
.th-btn--main {
  background: var(--color-primary); color: #fff; border-color: transparent;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.th-btn--main:hover { color: #fff; filter: brightness(1.05); }
.th-btn.is-static { cursor: default; opacity: .85; }
.thread-note--v5 {
  display: flex; gap: 10px; align-items: flex-start;
  margin: 0; padding: 11px 13px; border-radius: 12px; font-size: 12.5px; line-height: 1.4;
}
.thread-note--v5 .yon-ico { color: var(--color-primary-ink, var(--color-primary)); flex: none; margin-top: 1px; }

.post-list--v5 { gap: 14px; }
.post--v5 {
  display: grid;
  grid-template-columns: 168px minmax(0, 1fr);
  grid-template-areas:
    "bar bar"
    "user body"
    "react react";
  align-items: start;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  background: var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  overflow: hidden;
}
.post--v5.is-best { box-shadow: inset 3px 0 0 var(--color-success), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset; }
.post--v5.is-op { box-shadow: inset 3px 0 0 var(--color-primary), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset; }
.post--v5.is-best.is-op {
  box-shadow: inset 3px 0 0 var(--color-success), inset 6px 0 0 var(--color-primary), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.post--v5 .post__bar {
  grid-area: bar; min-height: 38px; padding: 6px 12px;
  background: color-mix(in srgb, var(--color-elevated) 72%, transparent);
  border-bottom: 1px solid var(--color-border);
}
.post--v5 .post__aside {
  grid-area: user; align-self: stretch; padding: 16px 12px; gap: 9px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 42%),
    var(--color-elevated);
  border-right: 1px solid var(--color-border);
}
.post--v5 .post__main { grid-area: body; min-width: 0; }
.post--v5 .post__react {
  grid-area: react;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 10px 12px; border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 45%, transparent);
}
.post--v5 .post__foot {
  display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; padding: 0; border: 0;
}
.post--v5 .post__ava, .post--v5 img.post__ava {
  width: 68px; height: 68px; font-size: 21px;
  border: 2px solid color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  box-shadow: 0 0 0 3px var(--color-elevated);
}
.post--v5 .post__name a { font-size: 14px; }
.post--v5 .post__kpis {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; width: 100%;
}
.post--v5 .post__kpis span {
  display: grid; justify-items: center; gap: 1px; padding: 6px 2px; border-radius: 9px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 55%, transparent);
}
.post--v5 .post__kpis b { font-size: 12.5px; font-weight: 800; font-variant-numeric: tabular-nums; }
.post--v5 .post__kpis em { font-style: normal; font-size: 9.5px; color: var(--color-muted); font-weight: 700; }
.post--v5 .post__stats-toggle {
  display: block; width: 100%;
}
.post--v5 .post__stats,
.post--v5 .post__pager { display: none; }
.post--v5.is-stats .post__stats { display: grid; }
.post--v5.is-stats .post__pager { display: flex; }
.post--v5 .post__content {
  padding: 16px 18px 12px; max-height: 480px; font-size: 15px; line-height: 1.65;
}
.post--v5 .post-like {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 34px; border-radius: 10px; padding: 0 12px;
}
.post--v5 .post-act { min-height: 32px; border-radius: 9px; }
.post--v5 .post__sig { margin: 0 18px 8px; }

.post-reply--v5 {
  border-radius: 16px; overflow: hidden; padding: 0;
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 40%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.post-reply__head {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: flex-end;
  padding: 14px 16px 12px; border-bottom: 1px solid var(--color-border);
}
.post-reply__head h2 { margin: 0; font-size: 15px; font-weight: 800; }
.post-reply__head p { margin: 4px 0 0; color: var(--color-muted); font-size: 12.5px; }
.post-reply__hint {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--color-muted); font-size: 12px; font-weight: 650;
}
.post-reply--v5 > .nx-muted,
.post-reply--v5 > p { margin: 0; padding: 16px 18px; }
.post-reply__actions {
  display: flex; justify-content: flex-end; padding: 0 12px 12px;
}
.post-reply--v5 .post-reply__quotes { display: inline-flex; padding: 8px 4px; }

.thread-readers--v5 {
  margin: 0; padding: 14px; border-radius: 16px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 50%),
    var(--color-surface);
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
}
.thread-readers__chips {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px;
}
.thread-readers__chips:empty { display: none; margin: 0; }
.thread-readers__chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 10px 5px 5px; border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); font-size: 12.5px; font-weight: 650;
}
.thread-readers__chip:hover {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
}
.thread-readers__chip i,
.thread-readers__chip img {
  width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 18%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); font-style: normal; font-size: 11px; font-weight: 800;
  object-fit: cover; flex: none;
}
.thread-readers__chip img { display: block; padding: 0; background: transparent; }
.yon-pager--v5 { justify-content: center; margin: 2px 0; }
.thread-jump--v5 {
  position: fixed; right: 16px; bottom: 88px; z-index: 32; display: grid; gap: 8px;
}
.thread-jump--v5 a {
  display: grid; justify-items: center; gap: 2px; min-width: 54px; padding: 8px 8px 7px;
  border-radius: 14px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
  color: var(--color-text); font-size: 10.5px; font-weight: 750;
  box-shadow: 0 10px 22px color-mix(in srgb, #000 22%, transparent);
  backdrop-filter: blur(10px);
}
.thread-jump--v5 a:hover { color: var(--color-text); border-color: var(--color-primary); }
.thread-jump--v5 a.is-reply {
  background: var(--color-primary); color: #fff; border-color: transparent;
}
.thread-jump--v5 a.is-reply:hover { color: #fff; filter: brightness(1.05); }
.thread-jump--v5 .yon-ico { opacity: .95; }

/* Thread v6 */
.yon-thread--v6 { display: grid; gap: 10px; max-width: 1040px; margin: 0 auto; }
.crumb--v6 {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  margin: 0; padding: 0 2px; color: var(--color-muted); font-size: 12px;
}
.crumb--v6 a { color: var(--color-muted); }
.crumb--v6 a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.crumb--v6 span:last-child {
  color: var(--color-text); font-weight: 650;
  max-width: min(52ch, 72vw); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.thread-head--v6 {
  position: relative; overflow: hidden; margin: 0; padding: 14px 16px 12px;
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  border-radius: 14px;
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 46%),
    var(--color-surface);
}
.thread-head--v6 .thread-head__ribbon { height: 2px; }
.thread-head__row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: start;
}
.thread-head--v6 h1 {
  margin: 6px 0 6px; font-size: clamp(1.15rem, 2vw, 1.55rem);
  letter-spacing: -.02em; line-height: 1.25;
}
.thread-head__tip {
  display: inline-flex; align-items: center; gap: 6px; margin: 0;
  color: var(--color-muted); font-size: 11.5px; line-height: 1.35;
}
.thread-head__tip .yon-ico { color: var(--color-primary-ink, var(--color-primary)); flex: none; }
.thread-head--v6 .thread-head__op {
  margin: 0; padding: 5px 9px 5px 5px; align-self: start;
}
.thread-head--v6 .thread-head__op-av, .thread-head--v6 img.thread-head__op-av {
  width: 32px; height: 32px; font-size: 12px;
}
.thread-head--v6 .thread-head__op strong { font-size: 12.5px; }
.thread-head--v6 .thread-head__op small { font-size: 10.5px; }
.thread-dock {
  position: sticky; top: 72px; z-index: 28;
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: center;
  padding: 8px 10px; border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 88%, transparent);
  backdrop-filter: blur(12px);
  box-shadow: 0 10px 24px color-mix(in srgb, #000 16%, transparent);
}
.thread-pulse--v6 { display: flex; flex-wrap: wrap; gap: 6px; }
.thread-pulse--v6 > span {
  display: inline-flex; align-items: center; gap: 5px;
  height: 28px; padding: 0 9px; border-radius: 9px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-muted); font-size: 12px; font-weight: 650;
}
.thread-pulse--v6 b { color: var(--color-text); font-weight: 800; font-variant-numeric: tabular-nums; }
.thread-pulse--v6 .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.thread-dock__tools { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.thread-dock__tools form { margin: 0; }
.yon-thread--v6 .th-btn {
  min-height: 32px; padding: 0 10px; border-radius: 9px; font-size: 12px;
}
.yon-thread--v6 .th-btn--main { min-width: 88px; }

.post-list--v6 { gap: 10px; }
.yon-thread--v6 .post--v6 {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  grid-template-areas:
    "bar bar"
    "user body"
    "react react";
  align-items: start;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--color-border) 90%, var(--color-primary));
  background: var(--color-surface);
  overflow: hidden;
}
.post--v6.is-best { box-shadow: inset 3px 0 0 var(--color-success); }
.post--v6.is-op { box-shadow: inset 3px 0 0 var(--color-primary); }
.post--v6.is-best.is-op { box-shadow: inset 3px 0 0 var(--color-success), inset 6px 0 0 var(--color-primary); }
.post--v6 .post__bar {
  grid-area: bar; min-height: 34px; padding: 4px 10px;
  background: color-mix(in srgb, var(--color-elevated) 65%, transparent);
  border-bottom: 1px solid var(--color-border); font-size: 11.5px;
}
.post--v6 .post__aside {
  grid-area: user; align-self: stretch; padding: 12px 8px; gap: 7px;
  background: var(--color-elevated); border-right: 1px solid var(--color-border);
}
.post--v6 .post__main { grid-area: body; min-width: 0; }
.post--v6 .post__react {
  grid-area: react;
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  padding: 8px 10px; border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.post--v6 .post__foot {
  display: flex; flex-wrap: wrap; gap: 5px; margin-left: auto; padding: 0; border: 0;
}
.post--v6 .post__ava, .post--v6 img.post__ava {
  width: 56px; height: 56px; font-size: 18px;
  border: 2px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
}
.post--v6 .post__name a { font-size: 13px; }
.post--v6 .post__handle, .post--v6 .post__title { font-size: 11px; }
.post--v6 .post__kpis {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; width: 100%;
}
.post--v6 .post__kpis span {
  display: grid; justify-items: center; gap: 0; padding: 5px 1px; border-radius: 8px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 60%, transparent);
}
.post--v6 .post__kpis b { font-size: 11.5px; font-weight: 800; font-variant-numeric: tabular-nums; }
.post--v6 .post__kpis em { font-style: normal; font-size: 9px; color: var(--color-muted); font-weight: 700; }
.post--v6 .post__stats-toggle { display: block; width: 100%; padding: 5px 8px; font-size: 11px; }
.post--v6 .post__stats,
.post--v6 .post__pager { display: none; }
.post--v6.is-stats .post__stats { display: grid; }
.post--v6.is-stats .post__pager { display: flex; }
.post--v6 .post__content {
  padding: 12px 14px 8px; max-height: 420px; font-size: 14.5px; line-height: 1.6;
}
.post--v6 .post-like {
  display: inline-flex; align-items: center; gap: 5px;
  min-height: 30px; border-radius: 8px; padding: 0 10px; font-size: 12px;
}
.post--v6 .post-act { min-height: 30px; border-radius: 8px; font-size: 11.5px; padding: 4px 9px; }
.post--v6 .post__sig { margin: 0 14px 6px; font-size: 12px; }
.post--v6 .post__likers { font-size: 12px; }
.post--v6 .rank-mark img { max-width: 110px; max-height: 28px; }

.post-reply--v6 {
  border-radius: 14px; overflow: hidden; padding: 0;
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  background: var(--color-surface);
}
.post-reply--v6 .post-reply__head { padding: 12px 14px 10px; }
.post-reply--v6 .post-reply__head h2 { font-size: 14px; }
.post-reply--v6 .post-reply__head p { font-size: 12px; }
.post-reply--v6 > .nx-muted,
.post-reply--v6 > p { margin: 0; padding: 14px 16px; }

.thread-readers--v6 {
  margin: 0; padding: 12px; border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 35%, var(--color-surface));
}
.yon-pager--v6 { justify-content: center; margin: 0; }
.thread-jump--v6 {
  position: fixed; right: 14px; bottom: 86px; z-index: 32; display: grid; gap: 6px;
}
.thread-jump--v6 a {
  width: 42px; height: 42px; display: grid; place-items: center;
  border-radius: 12px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
  color: var(--color-text);
  box-shadow: 0 10px 20px color-mix(in srgb, #000 20%, transparent);
  backdrop-filter: blur(10px);
}
.thread-jump--v6 a:hover { color: var(--color-text); border-color: var(--color-primary); }
.thread-jump--v6 a.is-reply {
  background: var(--color-primary); color: #fff; border-color: transparent;
}
.thread-jump--v6 a.is-reply:hover { color: #fff; }

/* Thread v7 ? full-height author column, merged head+dock */
.app-frame:has(.yon-thread--v7) {
  width: min(1440px, calc(100% - 28px));
}
.yon-thread--v7 { display: grid; gap: 14px; max-width: 1440px; margin: 0 auto; }
.crumb--v7 {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  margin: 0; padding: 10px 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  border-radius: 14px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 55%),
    color-mix(in srgb, var(--color-surface) 92%, transparent);
  color: var(--color-muted);
  font-size: 13.5px;
  font-weight: 650;
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.crumb--v7 .crumb__link,
.crumb--v7 .crumb__here {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 30px; padding: 0 10px;
  border-radius: 9px;
  text-decoration: none;
  color: var(--color-muted);
  max-width: min(48ch, 70vw);
}
.crumb--v7 .crumb__link span,
.crumb--v7 .crumb__here span {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.crumb--v7 .crumb__link .yon-ico,
.crumb--v7 .crumb__here .yon-ico {
  flex: none; color: var(--color-primary-ink, var(--color-primary)); opacity: .9;
}
.crumb--v7 .crumb__link:hover {
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
}
.crumb--v7 .crumb__home {
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  border: 1px solid var(--color-border);
  color: var(--color-text);
}
.crumb--v7 .crumb__home:hover {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
}
.crumb--v7 .crumb__sep {
  display: inline-grid; place-items: center;
  width: 18px; height: 18px; padding: 0;
  color: color-mix(in srgb, var(--color-muted) 75%, transparent);
  font-size: 15px; font-weight: 700; line-height: 1;
  opacity: .85;
}
.crumb--v7 .crumb__here {
  color: var(--color-text);
  font-weight: 750;
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
}

/* Breadcrumb v10 — denser R10 bar, primary tint */
.crumb--v10 {
  display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
  margin: 0; padding: 8px 10px 8px 8px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 16%, var(--color-border));
  border-radius: 14px;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 42%),
    var(--color-surface);
  color: var(--color-muted);
  font-size: 13px;
  font-weight: 650;
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset,
    0 6px 16px color-mix(in srgb, #000 6%, transparent);
}
.crumb--v10 .crumb__link,
.crumb--v10 .crumb__here {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 30px; padding: 0 10px;
  border-radius: 9px;
  text-decoration: none;
  color: var(--color-muted);
  max-width: min(52ch, 72vw);
  transition: background var(--ease), color var(--ease), border-color var(--ease);
}
.crumb--v10 .crumb__link span,
.crumb--v10 .crumb__here span {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.crumb--v10 .crumb__link .yon-ico,
.crumb--v10 .crumb__here .yon-ico {
  flex: none; color: var(--color-primary-ink, var(--color-primary)); opacity: .92;
}
.crumb--v10 .crumb__link:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-elevated) 80%, transparent);
}
.crumb--v10 .crumb__home {
  background: var(--color-elevated);
  border: 1px solid var(--color-border);
  color: var(--color-text);
  font-weight: 750;
}
.crumb--v10 .crumb__home:hover {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.crumb--v10 .crumb__sep {
  display: inline-grid; place-items: center;
  width: 14px; height: 14px; padding: 0;
  color: color-mix(in srgb, var(--color-muted) 70%, transparent);
  font-size: 13px; font-weight: 700; line-height: 1;
  flex: none;
}
.crumb--v10 .crumb__here {
  color: var(--color-text);
  font-weight: 780;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  border: 1px solid color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
}
.thread-head--v7 {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  border-radius: 16px;
  background:
    linear-gradient(125deg, color-mix(in srgb, var(--color-primary) 11%, transparent), transparent 52%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.thread-head--v7 .thread-head__ribbon {
  flex: none;
  height: 2px;
  border-radius: 0;
  background: linear-gradient(90deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 15%, transparent));
}
.thread-head--v7 .thread-head__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: start;
  padding: 18px 20px 12px;
}
.thread-head--v7 .thread-head__main { min-width: 0; }
.thread-head--v7 .thread-head__flags { margin-bottom: 4px; }
.thread-head--v7 h1 {
  margin: 4px 0 0;
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
  letter-spacing: -.03em;
  line-height: 1.18;
  max-width: 22ch;
}
.thread-head--v7b h1 { max-width: none; }
.thread-head--v7 .thread-head__op {
  display: inline-grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin: 0;
  min-width: 168px;
  padding: 8px 14px 8px 8px;
  align-self: start;
  border-radius: 14px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 72%, transparent);
  text-decoration: none;
  color: var(--color-text);
}
.thread-head--v7 .thread-head__op:hover {
  border-color: color-mix(in srgb, var(--color-primary) 42%, var(--color-border));
  background: color-mix(in srgb, var(--color-elevated) 88%, transparent);
}
.thread-head--v7 .thread-head__op span {
  display: grid;
  gap: 1px;
  min-width: 0;
  line-height: 1.2;
}
.thread-head--v7 .thread-head__op em {
  font-style: normal;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.thread-head--v7 .thread-head__op-av,
.thread-head--v7 img.thread-head__op-av {
  width: 42px;
  height: 42px;
  font-size: 14px;
  border-radius: 50%;
}
.thread-head--v7 .thread-head__op strong { font-size: 13.5px; font-weight: 750; }
.thread-head--v7 .thread-head__op small { font-size: 11.5px; color: var(--color-muted); }
.thread-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; }
.thread-tag {
  display: inline-flex; align-items: center; height: 24px; padding: 0 9px;
  border-radius: 999px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  color: var(--color-muted); font-size: 11.5px; font-weight: 650; text-decoration: none;
}
.thread-tag:hover { color: var(--color-primary-ink, var(--color-primary)); border-color: var(--color-primary); }
.thread-meta--v7 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  margin: 0 16px;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  overflow: hidden;
  background: color-mix(in srgb, var(--color-elevated) 42%, transparent);
}
.thread-meta--v7 > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 12px 14px;
  border: 0;
  border-right: 1px solid var(--color-border);
  border-radius: 0;
  background: transparent;
}
.thread-meta--v7 > div:last-child { border-right: 0; }
.thread-meta--v7 dt {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  color: var(--color-muted);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.thread-meta--v7 dt .yon-ico { color: var(--color-primary-ink, var(--color-primary)); flex: none; }
.thread-meta--v7 dd {
  margin: 0;
  font-size: 15px;
  font-weight: 780;
  font-variant-numeric: tabular-nums;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.thread-meta--v7 a { color: var(--color-text); text-decoration: none; }
.thread-meta--v7 a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.thread-head--v7 > .thread-head__tip {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 10px 20px 14px;
  max-width: none;
  color: var(--color-muted);
  font-size: 11.5px;
  line-height: 1.35;
}
.thread-head--v7 > .thread-head__tip .yon-ico { color: var(--color-primary-ink, var(--color-primary)); flex: none; }
.thread-dock--v7 {
  position: sticky; top: 72px; z-index: 28;
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: center;
  margin: 0; padding: 8px 12px; border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 88%, transparent);
  backdrop-filter: blur(12px);
  box-shadow: 0 10px 24px color-mix(in srgb, #000 16%, transparent);
}
.thread-mod--v7 {
  border: 1px solid var(--color-border); border-radius: 12px;
  background: color-mix(in srgb, var(--color-elevated) 40%, var(--color-surface));
  padding: 0;
}
.thread-mod--v7 > summary {
  cursor: pointer; list-style: none; padding: 10px 14px; font-size: 12.5px; font-weight: 700; color: var(--color-muted);
}
.thread-mod--v7 > summary::-webkit-details-marker { display: none; }
.thread-mod__grid {
  display: grid; gap: 10px; padding: 0 14px 14px;
}
.thread-mod__grid form { display: flex; flex-wrap: wrap; gap: 6px; align-items: end; margin: 0; }
.thread-mod__grid button, .thread-mod__grid select, .thread-mod__grid input[type="text"] {
  min-height: 32px; border-radius: 8px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); padding: 0 10px; font-size: 12px;
}
.thread-mod__grid label { display: grid; gap: 4px; font-size: 11px; color: var(--color-muted); }
.thread-mod__grid label span { font-weight: 700; }
.forum-show__tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* Forum show v8 ? R10-inspired topic list */
.forum-show--v8 {
  display: grid;
  gap: 18px;
  max-width: 1560px;
  margin: 0 auto;
}
.fs8-head {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px; align-items: end;
  padding: 18px 20px;
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  border-radius: 16px;
  background:
    linear-gradient(125deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 52%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.fs8-head h1 {
  margin: 6px 0 0;
  font-size: clamp(1.65rem, 2.8vw, 2.15rem);
  letter-spacing: -.03em;
  line-height: 1.12;
}
.fs8-head .nx-muted { margin: 8px 0 0; font-size: 14.5px; max-width: 62ch; }
.fs8-head__meta {
  display: flex; gap: 10px; flex-wrap: wrap;
  color: var(--color-muted); font-size: 13.5px; font-weight: 650;
}
.fs8-head__meta > span {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 38px; padding: 0 14px;
  border-radius: 11px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 62%, transparent);
}
.fs8-head__meta .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fs8-head__meta b { color: var(--color-text); font-variant-numeric: tabular-nums; font-size: 15px; }
.fs8-ad {
  overflow: hidden; border-radius: 14px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
}
.fs8-ad--inline { margin: 0; border-radius: 0; border-left: 0; border-right: 0; }
.fs8-toolbar {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--color-surface) 88%, transparent);
}
.fs8-toolbar__left, .fs8-toolbar__right {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
}
.fs8-create {
  display: inline-flex; align-items: center; gap: 9px;
  min-height: 44px; padding: 0 18px 0 12px;
  border-radius: 12px; border: 1px solid transparent;
  background: var(--color-primary); color: #fff;
  font-size: 14.5px; font-weight: 750; text-decoration: none;
}
.fs8-create .yon-ico { color: #fff; }
.fs8-create:hover { filter: brightness(1.06); color: #fff; }
.fs8-create.is-disabled {
  opacity: .55; pointer-events: none;
  background: color-mix(in srgb, var(--color-elevated) 80%, transparent);
  border-color: var(--color-border); color: var(--color-muted);
}
.fs8-sort select {
  min-height: 42px; padding: 0 36px 0 14px;
  border-radius: 11px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text);
  font-size: 13.5px; font-weight: 650;
}
.fs8-pager {
  display: flex; flex-wrap: wrap; gap: 5px; align-items: center;
}
.fs8-pager a {
  display: inline-grid; place-items: center;
  min-width: 40px; height: 40px; padding: 0 10px;
  border-radius: 10px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); font-size: 13.5px; font-weight: 750;
  text-decoration: none; font-variant-numeric: tabular-nums;
}
.fs8-pager a.is-active {
  background: #e85d04; border-color: #e85d04; color: #fff;
}
.fs8-pager a:hover:not(.is-active) { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.fs8-pager__last { min-width: auto; padding: 0 12px; }
.fs8-pager--foot { justify-content: center; margin-top: 4px; }
.fs8-menu { position: relative; }
.fs8-menu > summary {
  list-style: none; cursor: pointer;
  display: inline-flex; align-items: center; min-height: 42px; padding: 0 14px;
  border-radius: 11px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-muted); font-size: 13.5px; font-weight: 700;
}
.fs8-menu > summary::-webkit-details-marker { display: none; }
.fs8-menu[open] > summary { color: var(--color-text); border-color: var(--color-primary); }
.fs8-menu__panel {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 40;
  min-width: 240px; padding: 10px;
  border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: 0 16px 40px color-mix(in srgb, #000 28%, transparent);
  display: grid; gap: 2px;
}
.fs8-menu__panel a,
.fs8-menu__panel button {
  display: block; width: 100%; text-align: left;
  padding: 11px 12px; border: 0; border-radius: 9px;
  background: transparent; color: var(--color-text);
  font-size: 14px; font-weight: 650; cursor: pointer; text-decoration: none;
}
.fs8-menu__panel a:hover,
.fs8-menu__panel button:hover { background: var(--color-elevated); color: var(--color-primary-ink, var(--color-primary)); }
.fs8-search { gap: 8px; min-width: 280px; }
.fs8-search input[type="search"] {
  width: 100%; min-height: 40px; padding: 0 12px; box-sizing: border-box;
  border-radius: 9px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text); font-size: 14px;
}
.fs8-search__modes { display: grid; gap: 5px; font-size: 13px; color: var(--color-muted); }
.fs8-search__modes label { display: flex; gap: 7px; align-items: center; }
.fs8-search__go {
  min-height: 40px; border: 0; border-radius: 9px;
  background: #e85d04; color: #fff; font-size: 14px; font-weight: 750; cursor: pointer;
}
.fs8-children {
  border: 1px solid var(--color-border); border-radius: 16px; overflow: hidden;
  background: var(--color-surface);
}
.fs8-children h2 {
  margin: 0; padding: 14px 18px; font-size: 13.5px;
  border-bottom: 1px solid var(--color-border); color: var(--color-muted);
  text-transform: uppercase; letter-spacing: .04em;
}
.fs8-children__grid { display: grid; }
.fs8-child {
  display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 14px; align-items: center;
  padding: 14px 18px; border-bottom: 1px solid var(--color-border);
  color: var(--color-text); text-decoration: none;
}
.fs8-child:last-child { border-bottom: 0; }
.fs8-child:hover { background: color-mix(in srgb, var(--color-elevated) 70%, transparent); }
.fs8-child__ico {
  display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); font-weight: 800; font-size: 16px;
}
.fs8-child__body { min-width: 0; display: grid; gap: 3px; }
.fs8-child__body strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.fs8-child__body small { color: var(--color-muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fs8-child__stat { color: var(--color-muted); font-size: 13px; font-weight: 700; white-space: nowrap; }
.fs8-board {
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  border-radius: 16px; overflow: hidden;
  background: var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.fs8-board__bar {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 48%, transparent);
}
.fs8-board__bar h2 { margin: 0; font-size: 15.5px; font-weight: 750; }
.fs8-board__bar .nx-muted { font-size: 13.5px; font-weight: 650; }
.fs8-empty { padding: 44px 20px; text-align: center; color: var(--color-muted); display: grid; gap: 16px; justify-items: center; font-size: 15px; }
.fs8-list { display: grid; }
.fs8-row {
  display: grid;
  grid-template-columns: 34px 52px minmax(0, 1fr) 128px 196px;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border-bottom: 1px solid var(--color-border);
  min-width: 0;
}
.fs8-row:last-child { border-bottom: 0; }
.fs8-row:hover {
  background: color-mix(in srgb, var(--color-elevated) 62%, transparent);
}
.fs8-row.is-pinned {
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--color-primary) 28%, transparent), color-mix(in srgb, var(--color-primary) 8%, transparent) 42%, transparent);
  border-bottom-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
}
.fs8-row.is-pinned:hover {
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--color-primary) 36%, transparent), color-mix(in srgb, var(--color-primary) 12%, transparent) 42%, color-mix(in srgb, var(--color-elevated) 50%, transparent));
}
.fs8-row__status { display: grid; place-items: center; }
.fs8-ico {
  display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  color: var(--color-muted);
}
.fs8-ico--pin { color: var(--color-primary-ink-hover, var(--color-link-hover)); border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border)); background: color-mix(in srgb, var(--color-primary) 18%, transparent); }
.fs8-ico--lock { color: var(--color-warning); }
.fs8-row__avatar { display: grid; place-items: center; text-decoration: none; }
.fs8-ava, img.fs8-ava {
  width: 48px; height: 48px; border-radius: 50%; font-size: 15px;
  border: 2px solid color-mix(in srgb, var(--color-primary) 25%, var(--color-border));
}
.fs8-row__main { min-width: 0; display: grid; gap: 6px; }
.fs8-row__title {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px 10px;
  color: var(--color-text); text-decoration: none; font-weight: 750; font-size: 16px; line-height: 1.28;
  min-width: 0;
}
.fs8-row__title > span {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
}
.fs8-row__title:hover > span { color: var(--color-primary-ink, var(--color-primary)); }
.fs8-prefix {
  flex: none; font-style: normal; font-size: 12px; font-weight: 800;
  letter-spacing: .03em; text-transform: uppercase; color: #fb7185;
}
.fs8-prefix--lock { color: var(--color-warning); }
.fs8-prefix--hot { color: #f97316; }
.fs8-row__meta {
  display: flex; flex-wrap: wrap; gap: 7px; align-items: center;
  color: var(--color-muted); font-size: 13.5px;
}
.fs8-row__meta a { color: var(--color-muted); text-decoration: none; font-weight: 650; }
.fs8-row__meta a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.fs8-row__rate {
  display: inline-flex; gap: 2px; justify-content: center; color: color-mix(in srgb, var(--color-muted) 70%, transparent);
  font-size: 15px; letter-spacing: -.02em;
}
.fs8-row__rate i { font-style: normal; }
.fs8-row__rate i.is-fill { color: #f59e0b; }
.fs8-row__last {
  display: grid; gap: 4px; justify-items: end; text-align: right; min-width: 0;
}
.fs8-row__last time {
  color: var(--color-muted); font-size: 12.5px; font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fs8-row__last a, .fs8-row__last > span {
  color: var(--color-text); font-size: 14px; font-weight: 700; text-decoration: none;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fs8-row__last a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.fs8-row__counts {
  display: inline-flex; align-items: center; gap: 10px; margin: 0;
  color: var(--color-muted); font-size: 13.5px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.fs8-row__counts span { display: inline-flex; align-items: center; gap: 5px; }
.fs8-row__counts b { color: var(--color-text); font-weight: 800; }
.fs8-row__counts .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fs8-row__counts i {
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--color-primary); display: inline-block;
}
.fs8-foot {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; align-items: center;
  padding: 16px 18px; border-radius: 14px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.fs8-foot strong { display: block; font-size: 15.5px; }
.fs8-foot p { margin: 5px 0 0; font-size: 13.5px; }

@media (max-width: 980px) {
  .fs8-row {
    grid-template-columns: 28px 46px minmax(0, 1fr);
    grid-template-areas:
      "status avatar main"
      "status avatar last"
      "rate rate rate";
  }
  .fs8-row__status { grid-area: status; }
  .fs8-row__avatar { grid-area: avatar; }
  .fs8-row__main { grid-area: main; }
  .fs8-row__rate { grid-area: rate; justify-content: flex-start; padding-left: 88px; }
  .fs8-row__last { grid-area: last; justify-items: start; text-align: left; }
}
@media (max-width: 640px) {
  .crumb--v7 { padding: 8px 10px; gap: 4px; }
  .crumb--v7 .crumb__link,
  .crumb--v7 .crumb__here { padding: 0 8px; min-height: 28px; font-size: 12.5px; }
  .crumb--v10 { padding: 6px 8px; gap: 2px; border-radius: 12px; }
  .crumb--v10 .crumb__link,
  .crumb--v10 .crumb__here { padding: 0 8px; min-height: 28px; font-size: 12.5px; max-width: min(36ch, 78vw); }
  .crumb--v10 .crumb__sep { width: 12px; }
  .fs8-head { padding: 14px; }
  .fs8-toolbar { padding: 10px; }
  .fs8-row { padding: 14px; gap: 10px; }
  .fs8-row__title { font-size: 15px; }
  .fs8-row__title > span { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .fs8-row__last time { font-size: 12px; }
}

/* Forum show v9 ? denser R10 board with announce strip + columns */
.forum-show--v9 {
  display: grid;
  gap: 16px;
  max-width: 1560px;
  margin: 0 auto;
}
.fs9-head {
  position: relative;
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px; align-items: end;
  overflow: hidden;
  padding: 20px 22px;
  border: 1px solid color-mix(in srgb, var(--color-border) 82%, var(--color-primary));
  border-radius: 18px;
  background:
    linear-gradient(125deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 48%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.fs9-head__glow {
  position: absolute; inset: auto -10% -40% 40%;
  height: 140px;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--color-primary) 22%, transparent), transparent 70%);
  pointer-events: none;
}
.fs9-head__main { position: relative; min-width: 0; }
.fs9-head h1 {
  margin: 6px 0 0;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  letter-spacing: -.035em;
  line-height: 1.1;
}
.fs9-head .nx-muted { margin: 10px 0 0; font-size: 14.5px; max-width: 64ch; }
.fs9-head__meta {
  position: relative;
  display: grid; grid-auto-flow: column; gap: 8px;
}
.fs9-head__meta > div {
  min-width: 88px; padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 68%, transparent);
  text-align: center;
}
.fs9-head__meta em {
  display: block; font-style: normal; font-size: 11px; font-weight: 700;
  letter-spacing: .04em; text-transform: uppercase; color: var(--color-muted);
}
.fs9-head__meta strong {
  display: block; margin-top: 4px; font-size: 18px; font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.fs9-ad {
  overflow: hidden; border-radius: 14px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
}
.fs9-ad--inline { margin: 0; border-radius: 0; border-left: 0; border-right: 0; }
.fs9-toolbar {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--color-surface) 90%, transparent);
}
.fs9-toolbar__left, .fs9-toolbar__right {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
}
.fs9-toolbar__hint {
  margin: 0; color: var(--color-muted); font-size: 13px; font-weight: 650;
}
.fs9-create {
  display: inline-flex; align-items: center; gap: 10px;
  min-height: 46px; padding: 0 18px 0 8px;
  border-radius: 12px; border: 1px solid transparent;
  background: var(--color-primary); color: #fff;
  font-size: 14.5px; font-weight: 780; text-decoration: none; text-transform: uppercase;
  letter-spacing: .02em;
}
.fs9-create__ico {
  display: grid; place-items: center;
  width: 32px; height: 32px; border-radius: 9px;
  background: color-mix(in srgb, #000 18%, transparent);
}
.fs9-create .yon-ico { color: #fff; }
.fs9-create:hover { filter: brightness(1.06); color: #fff; }
.fs9-create.is-disabled {
  opacity: .55; pointer-events: none; text-transform: none; letter-spacing: 0;
  background: color-mix(in srgb, var(--color-elevated) 80%, transparent);
  border-color: var(--color-border); color: var(--color-muted);
}
.fs9-sort select {
  min-height: 44px; padding: 0 38px 0 14px;
  border-radius: 11px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text);
  font-size: 13.5px; font-weight: 650;
}
.fs9-pager {
  display: flex; flex-wrap: wrap; gap: 5px; align-items: center;
}
.fs9-pager a {
  display: inline-grid; place-items: center;
  min-width: 40px; height: 40px; padding: 0 10px;
  border-radius: 10px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); font-size: 13.5px; font-weight: 750;
  text-decoration: none; font-variant-numeric: tabular-nums;
}
.fs9-pager a.is-active {
  background: #e85d04; border-color: #e85d04; color: #fff;
}
.fs9-pager a:hover:not(.is-active) { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.fs9-pager__last { min-width: auto; padding: 0 12px; }
.fs9-pager--foot { justify-content: flex-end; }
.fs9-menu { position: relative; }
.fs9-menu > summary {
  list-style: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 40px; padding: 0 14px;
  border-radius: 11px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-muted); font-size: 13.5px; font-weight: 700;
}
.fs9-menu > summary::-webkit-details-marker { display: none; }
.fs9-menu[open] > summary { color: var(--color-text); border-color: var(--color-primary); }
.fs9-menu__panel {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 40;
  min-width: 250px; padding: 10px;
  border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: 0 18px 44px color-mix(in srgb, #000 30%, transparent);
  display: grid; gap: 2px;
}
.fs9-menu__panel a,
.fs9-menu__panel button {
  display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
  padding: 11px 12px; border: 0; border-radius: 9px;
  background: transparent; color: var(--color-text);
  font-size: 14px; font-weight: 650; cursor: pointer; text-decoration: none;
}
.fs9-menu__panel .yon-ico { color: var(--color-primary-ink, var(--color-primary)); flex: none; }
.fs9-menu__panel a:hover,
.fs9-menu__panel button:hover { background: var(--color-elevated); color: var(--color-primary-ink, var(--color-primary)); }
.fs9-search { gap: 8px; min-width: 280px; }
.fs9-search input[type="search"] {
  width: 100%; min-height: 40px; padding: 0 12px; box-sizing: border-box;
  border-radius: 9px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text); font-size: 14px;
}
.fs9-search__modes { display: grid; gap: 5px; font-size: 13px; color: var(--color-muted); }
.fs9-search__modes label { display: flex; gap: 7px; align-items: center; }
.fs9-search__go {
  min-height: 40px; border: 0; border-radius: 9px;
  background: #e85d04; color: #fff; font-size: 14px; font-weight: 750; cursor: pointer;
}
.fs9-children {
  border: 1px solid var(--color-border); border-radius: 16px; overflow: hidden;
  background: var(--color-surface);
}
.fs9-children__bar {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 12px 18px; border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 42%, transparent);
}
.fs9-children__bar h2 { margin: 0; font-size: 14px; font-weight: 750; }
.fs9-children__bar span { color: var(--color-muted); font-size: 13px; font-weight: 650; }
.fs9-children__grid { display: grid; }
.fs9-child {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 14px; align-items: center;
  padding: 14px 18px; border-bottom: 1px solid var(--color-border);
  color: var(--color-text); text-decoration: none;
}
.fs9-child:last-child { border-bottom: 0; }
.fs9-child:hover { background: color-mix(in srgb, var(--color-elevated) 70%, transparent); }
.fs9-child__ico {
  display: grid; place-items: center; width: 48px; height: 48px; border-radius: 13px;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); font-weight: 800; font-size: 17px;
}
.fs9-child__body { min-width: 0; display: grid; gap: 3px; }
.fs9-child__body strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.fs9-child__body small { color: var(--color-muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fs9-child__stat { display: grid; justify-items: end; gap: 2px; color: var(--color-muted); }
.fs9-child__stat b { color: var(--color-text); font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
.fs9-child__stat em { font-style: normal; font-size: 11.5px; font-weight: 700; text-transform: uppercase; }
.fs9-board {
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  border-radius: 16px; overflow: hidden;
  background: var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.fs9-board__bar {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 52%, transparent);
}
.fs9-board__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; }
.fs9-board__title h2 { margin: 0; font-size: 15.5px; font-weight: 750; }
.fs9-board__title span { color: var(--color-muted); font-size: 13px; font-weight: 650; }
.fs9-board__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.fs9-cols {
  display: grid;
  grid-template-columns: 34px 52px minmax(0, 1fr) 132px 200px 72px 78px;
  gap: 12px; align-items: center;
  padding: 9px 16px;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 28%, transparent);
  color: var(--color-muted); font-size: 11.5px; font-weight: 750;
  letter-spacing: .03em; text-transform: uppercase;
}
.fs9-cols__topic { grid-column: 1 / 4; padding-left: 4px; }
.fs9-cols__rate, .fs9-cols__last, .fs9-cols__num { text-align: center; }
.fs9-cols__last { text-align: right; }
.fs9-announce {
  display: grid;
  border-bottom: 1px solid color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: linear-gradient(90deg, var(--color-primary), var(--color-primary) 42%, var(--color-primary-active));
}
.fs9-announce__row {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 14px; align-items: center;
  padding: 14px 16px;
  color: #fff; text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, #fff 12%, transparent);
}
.fs9-announce__row:last-child { border-bottom: 0; }
.fs9-announce__row:hover { background: color-mix(in srgb, #000 10%, transparent); }
.fs9-announce__ico {
  display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%;
  background: #fff; color: var(--color-primary-ink, var(--color-primary));
}
.fs9-announce__ico .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fs9-announce__body { min-width: 0; display: grid; gap: 3px; }
.fs9-announce__body strong {
  font-size: 15.5px; font-weight: 780;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fs9-announce__body small { color: color-mix(in srgb, #fff 78%, transparent); font-size: 13px; }
.fs9-announce__tag {
  flex: none; padding: 6px 10px; border-radius: 999px;
  background: color-mix(in srgb, #000 22%, transparent);
  font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
}
.fs9-list { display: grid; }
.fs9-row {
  display: grid;
  grid-template-columns: 34px 52px minmax(0, 1fr) 132px 200px 72px 78px;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid var(--color-border);
  min-width: 0;
}
.fs9-row:last-child { border-bottom: 0; }
.fs9-row:hover { background: color-mix(in srgb, var(--color-elevated) 58%, transparent); }
.fs9-row.is-fresh {
  box-shadow: inset 3px 0 0 var(--color-primary);
}
.fs9-row.is-hot {
  background: color-mix(in srgb, #f97316 6%, transparent);
}
.fs9-row__status { display: grid; place-items: center; }
.fs9-ico {
  display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  color: var(--color-muted);
}
.fs9-ico--lock { color: var(--color-warning); border-color: color-mix(in srgb, var(--color-warning) 35%, var(--color-border)); }
.fs9-ico--hot { color: #fb923c; border-color: color-mix(in srgb, #f97316 40%, var(--color-border)); background: color-mix(in srgb, #f97316 14%, transparent); }
.fs9-row__avatar { display: grid; place-items: center; text-decoration: none; }
.fs9-ava, img.fs9-ava {
  width: 46px; height: 46px; border-radius: 50%; font-size: 14px;
  border: 2px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
}
.fs9-ava--sm, img.fs9-ava--sm {
  width: 22px; height: 22px; font-size: 10px; border-width: 1px;
}
.fs9-row__main { min-width: 0; display: grid; gap: 5px; }
.fs9-row__title {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px 9px;
  color: var(--color-text); text-decoration: none; font-weight: 750; font-size: 15.5px; line-height: 1.28;
  min-width: 0;
}
.fs9-row__title > span {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
}
.fs9-row__title:hover > span { color: var(--color-primary-ink, var(--color-primary)); }
.fs9-prefix {
  flex: none; font-style: normal; font-size: 11.5px; font-weight: 800;
  letter-spacing: .03em; text-transform: uppercase; color: #fb7185;
}
.fs9-prefix--lock { color: var(--color-warning); }
.fs9-prefix--hot { color: #f97316; }
.fs9-prefix--new { color: #38bdf8; }
.fs9-prefix--ok { color: #34d399; }
.fs9-row__meta {
  display: flex; flex-wrap: wrap; gap: 7px; align-items: center;
  color: var(--color-muted); font-size: 13px;
}
.fs9-row__meta a { color: var(--color-muted); text-decoration: none; font-weight: 650; }
.fs9-row__meta a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.fs9-row__pages {
  display: inline-flex; gap: 3px; margin-left: 4px;
}
.fs9-row__pages a {
  display: inline-grid; place-items: center;
  min-width: 20px; height: 20px; padding: 0 5px;
  border-radius: 5px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 60%, transparent);
  color: var(--color-muted); font-size: 11px; font-weight: 750; text-decoration: none;
}
.fs9-row__pages a:hover { color: var(--color-primary-ink, var(--color-primary)); border-color: var(--color-primary); }
.fs9-row__rate {
  display: inline-flex; gap: 2px; justify-content: center; align-items: center;
  color: color-mix(in srgb, var(--color-muted) 70%, transparent);
  font-size: 14px; letter-spacing: -.02em;
}
.fs9-row__rate i { font-style: normal; }
.fs9-row__rate i.is-fill { color: #f59e0b; }
.fs9-row__clip {
  display: inline-grid; place-items: center; margin-left: 6px;
  color: var(--color-primary-ink, var(--color-primary)); opacity: .85;
}
.fs9-row__last {
  display: grid; gap: 5px; justify-items: end; text-align: right; min-width: 0;
}
.fs9-row__last time {
  color: var(--color-muted); font-size: 12px; font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fs9-row__last-user a,
.fs9-row__last-user > span {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--color-text); font-size: 13.5px; font-weight: 700; text-decoration: none;
  max-width: 100%;
}
.fs9-row__last-user a span {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 12ch;
}
.fs9-row__last-user em { font-style: normal; color: var(--color-primary-ink, var(--color-primary)); }
.fs9-row__last-user a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.fs9-row__num {
  display: grid; justify-items: center; gap: 3px;
  color: var(--color-muted);
}
.fs9-row__num b {
  color: var(--color-text); font-size: 15px; font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.fs9-row__num em { display: inline-flex; font-style: normal; }
.fs9-row__num .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fs9-empty {
  padding: 48px 22px; text-align: center; color: var(--color-muted);
  display: grid; gap: 10px; justify-items: center;
}
.fs9-empty__ico {
  display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); margin-bottom: 4px;
}
.fs9-empty strong { color: var(--color-text); font-size: 17px; }
.fs9-empty p { margin: 0; font-size: 14px; max-width: 40ch; }
.fs9-promo {
  text-align: center; padding: 4px 8px;
}
.fs9-promo a {
  color: var(--color-muted); font-size: 12.5px; font-weight: 650; text-decoration: none;
  border-bottom: 1px dashed color-mix(in srgb, var(--color-muted) 45%, transparent);
}
.fs9-promo a:hover { color: var(--color-primary-ink, var(--color-primary)); border-color: var(--color-primary); }
.fs9-filter {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; align-items: end;
  padding: 14px 16px; border-radius: 14px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 36%, transparent);
}
.fs9-filter__form {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: end;
}
.fs9-filter__form label {
  display: grid; gap: 5px; font-size: 11.5px; font-weight: 700;
  letter-spacing: .03em; text-transform: uppercase; color: var(--color-muted);
}
.fs9-filter__form select,
.fs9-filter__form input[type="number"] {
  min-height: 40px; padding: 0 12px;
  border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text);
  font-size: 13.5px; font-weight: 650; text-transform: none; letter-spacing: 0;
}
.fs9-filter__jump {
  grid-template-columns: auto auto; align-items: end;
}
.fs9-filter__jump span { grid-column: 1 / -1; }
.fs9-filter__jump input { width: 72px; }
.fs9-filter__jump button {
  min-height: 40px; padding: 0 14px; border-radius: 10px; border: 0;
  background: var(--color-primary); color: #fff; font-weight: 750; cursor: pointer;
}
.fs9-foot {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; align-items: center;
  padding: 16px 18px; border-radius: 14px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.fs9-foot__info strong { display: block; font-size: 15.5px; }
.fs9-foot__info p { margin: 5px 0 0; color: var(--color-muted); font-size: 13.5px; }
.fs9-foot__stats {
  display: flex; flex-wrap: wrap; gap: 10px;
}
.fs9-foot__stats span {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 36px; padding: 0 12px; border-radius: 10px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted); font-size: 13px; font-weight: 650;
}
.fs9-foot__stats .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fs9-foot__stats b { color: var(--color-text); font-weight: 800; font-variant-numeric: tabular-nums; }

@media (max-width: 1100px) {
  .fs9-cols,
  .fs9-row {
    grid-template-columns: 30px 46px minmax(0, 1fr) 110px 168px;
  }
  .fs9-cols__num,
  .fs9-row__num { display: none; }
  .fs9-cols__topic { grid-column: 1 / 4; }
}
@media (max-width: 900px) {
  .fs9-cols { display: none; }
  .fs9-row {
    grid-template-columns: 28px 44px minmax(0, 1fr);
    grid-template-areas:
      "status avatar main"
      "status avatar last"
      "rate rate rate";
  }
  .fs9-row__status { grid-area: status; }
  .fs9-row__avatar { grid-area: avatar; }
  .fs9-row__main { grid-area: main; }
  .fs9-row__rate { grid-area: rate; justify-content: flex-start; padding-left: 84px; }
  .fs9-row__last { grid-area: last; justify-items: start; text-align: left; }
  .fs9-head__meta { grid-auto-flow: row; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .fs9-head { padding: 16px; }
  .fs9-toolbar { padding: 10px; }
  .fs9-toolbar__hint { display: none; }
  .fs9-create { text-transform: none; letter-spacing: 0; font-size: 14px; }
  .fs9-row { padding: 12px; gap: 10px; }
  .fs9-row__title { font-size: 14.5px; }
  .fs9-row__title > span { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .fs9-announce__row { grid-template-columns: 40px minmax(0, 1fr); }
  .fs9-announce__tag { display: none; }
  .fs9-filter { padding: 12px; }
  .fs9-foot__stats { width: 100%; }
}

/* Forum show v10 ? fixed menus + shared design system ? denser R10 board with announce strip + columns */
.forum-show--v10 {
  display: grid;
  gap: 16px;
  max-width: 1560px;
  margin: 0 auto;
}
.fs10-head {
  position: relative;
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px; align-items: end;
  overflow: hidden;
  padding: 20px 22px;
  border: 1px solid color-mix(in srgb, var(--color-border) 82%, var(--color-primary));
  border-radius: 18px;
  background:
    linear-gradient(125deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 48%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.fs10-head__glow {
  position: absolute; inset: auto -10% -40% 40%;
  height: 140px;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--color-primary) 22%, transparent), transparent 70%);
  pointer-events: none;
}
.fs10-head__main { position: relative; min-width: 0; }
.fs10-head h1 {
  margin: 6px 0 0;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  letter-spacing: -.035em;
  line-height: 1.1;
}
.fs10-head .nx-muted { margin: 10px 0 0; font-size: 14.5px; max-width: 64ch; }
.fs10-head__meta {
  position: relative;
  display: grid; grid-auto-flow: column; gap: 8px;
}
.fs10-head__meta > div {
  min-width: 88px; padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 68%, transparent);
  text-align: center;
}
.fs10-head__meta em {
  display: block; font-style: normal; font-size: 11px; font-weight: 700;
  letter-spacing: .04em; text-transform: uppercase; color: var(--color-muted);
}
.fs10-head__meta strong {
  display: block; margin-top: 4px; font-size: 18px; font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.fs10-ad {
  overflow: hidden; border-radius: 14px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
}
.fs10-ad--inline { margin: 0; border-radius: 0; border-left: 0; border-right: 0; }
.fs10-toolbar {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--color-surface) 90%, transparent);
}
.fs10-toolbar__left, .fs10-toolbar__right {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
}
.fs10-toolbar__hint {
  margin: 0; color: var(--color-muted); font-size: 13px; font-weight: 650;
}
.fs10-create {
  display: inline-flex; align-items: center; gap: 10px;
  min-height: 46px; padding: 0 18px 0 8px;
  border-radius: 12px; border: 1px solid transparent;
  background: var(--color-primary); color: #fff;
  font-size: 14.5px; font-weight: 780; text-decoration: none; text-transform: uppercase;
  letter-spacing: .02em;
}
.fs10-create__ico {
  display: grid; place-items: center;
  width: 32px; height: 32px; border-radius: 9px;
  background: color-mix(in srgb, #000 18%, transparent);
}
.fs10-create .yon-ico { color: #fff; }
.fs10-create:hover { filter: brightness(1.06); color: #fff; }
.fs10-create.is-disabled {
  opacity: .55; pointer-events: none; text-transform: none; letter-spacing: 0;
  background: color-mix(in srgb, var(--color-elevated) 80%, transparent);
  border-color: var(--color-border); color: var(--color-muted);
}
.fs10-sort select {
  min-height: 44px; padding: 0 38px 0 14px;
  border-radius: 11px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text);
  font-size: 13.5px; font-weight: 650;
}
.fs10-pager {
  display: flex; flex-wrap: wrap; gap: 5px; align-items: center;
}
.fs10-pager a {
  display: inline-grid; place-items: center;
  min-width: 40px; height: 40px; padding: 0 10px;
  border-radius: 10px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); font-size: 13.5px; font-weight: 750;
  text-decoration: none; font-variant-numeric: tabular-nums;
}
.fs10-pager a.is-active {
  background: #e85d04; border-color: #e85d04; color: #fff;
}
.fs10-pager a:hover:not(.is-active) { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.fs10-pager__last { min-width: auto; padding: 0 12px; }
.fs10-pager--foot { justify-content: flex-end; }
.fs10-menu { position: relative; z-index: 1; }
.fs10-menu[open] { z-index: 80; }
.fs10-menu > summary {
  list-style: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 42px; padding: 0 15px;
  border-radius: 11px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-muted); font-size: 13.5px; font-weight: 700;
}
.fs10-menu > summary::-webkit-details-marker { display: none; }
.fs10-menu[open] > summary {
  color: #fff; border-color: var(--color-primary);
  background: var(--color-primary);
}
.fs10-menu[open] > summary .yon-ico { color: #fff; }
.fs10-menu__panel {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 90;
  min-width: 268px; padding: 12px;
  border-radius: 14px; border: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 55%, var(--color-surface));
  box-shadow: 0 20px 48px color-mix(in srgb, #000 42%, transparent);
  display: grid; gap: 3px;
  overflow: visible; max-height: none;
  backdrop-filter: none;
}
.fs10-menu__panel a,
.fs10-menu__panel button {
  display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
  padding: 11px 12px; border: 0; border-radius: 9px;
  background: transparent; color: var(--color-text);
  font-size: 14px; font-weight: 650; cursor: pointer; text-decoration: none;
}
.fs10-menu__panel .yon-ico { color: var(--color-primary-ink, var(--color-primary)); flex: none; }
.fs10-menu__panel a:hover,
.fs10-menu__panel button:hover { background: var(--color-elevated); color: var(--color-primary-ink, var(--color-primary)); }
.fs10-search { gap: 10px; min-width: 300px; padding-bottom: 2px; }
.fs10-search input[type="search"] {
  width: 100%; min-height: 40px; padding: 0 12px; box-sizing: border-box;
  border-radius: 9px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text); font-size: 14px;
}
.fs10-search__modes { display: grid; gap: 5px; font-size: 13px; color: var(--color-muted); }
.fs10-search__modes label { display: flex; gap: 7px; align-items: center; }
.fs10-search__go {
  min-height: 40px; border: 0; border-radius: 9px;
  background: #e85d04; color: #fff; font-size: 14px; font-weight: 750; cursor: pointer;
}
.fs10-children {
  border: 1px solid var(--color-border); border-radius: 16px; overflow: hidden;
  background: var(--color-surface);
}
.fs10-children__bar {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 12px 18px; border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 42%, transparent);
}
.fs10-children__bar h2 { margin: 0; font-size: 14px; font-weight: 750; }
.fs10-children__bar span { color: var(--color-muted); font-size: 13px; font-weight: 650; }
.fs10-children__grid { display: grid; }
.fs10-child {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 14px; align-items: center;
  padding: 14px 18px; border-bottom: 1px solid var(--color-border);
  color: var(--color-text); text-decoration: none;
}
.fs10-child:last-child { border-bottom: 0; }
.fs10-child:hover { background: color-mix(in srgb, var(--color-elevated) 70%, transparent); }
.fs10-child__ico {
  display: grid; place-items: center; width: 48px; height: 48px; border-radius: 13px;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); font-weight: 800; font-size: 17px;
}
.fs10-child__body { min-width: 0; display: grid; gap: 3px; }
.fs10-child__body strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.fs10-child__body small { color: var(--color-muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fs10-child__stat { display: grid; justify-items: end; gap: 2px; color: var(--color-muted); }
.fs10-child__stat b { color: var(--color-text); font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
.fs10-child__stat em { font-style: normal; font-size: 11.5px; font-weight: 700; text-transform: uppercase; }
.fs10-board {
  position: relative;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  border-radius: 18px;
  overflow: visible;
  background: var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.fs10-board__bar {
  position: relative;
  z-index: 50;
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px;
  padding: 14px 18px;
  border-radius: 18px 18px 0 0;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 52%, transparent);
}
.fs10-board__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; }
.fs10-board__title h2 { margin: 0; font-size: 15.5px; font-weight: 750; }
.fs10-board__title span { color: var(--color-muted); font-size: 13px; font-weight: 650; }
.fs10-board__actions { display: flex; flex-wrap: wrap; gap: 8px; position: relative; z-index: 51; }
.fs10-board__body {
  overflow: hidden;
  border-radius: 0 0 18px 18px;
}
.fs10-cols {
  display: grid;
  grid-template-columns: 34px 52px minmax(0, 1fr) 132px 200px 72px 78px;
  gap: 12px; align-items: center;
  padding: 9px 16px;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 28%, transparent);
  color: var(--color-muted); font-size: 11.5px; font-weight: 750;
  letter-spacing: .03em; text-transform: uppercase;
}
.fs10-cols__topic { grid-column: 1 / 4; padding-left: 4px; }
.fs10-cols__rate, .fs10-cols__last, .fs10-cols__num { text-align: center; }
.fs10-cols__last { text-align: right; }
.fs10-announce {
  display: grid;
  border-bottom: 1px solid color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: linear-gradient(90deg, var(--color-primary), var(--color-primary) 42%, var(--color-primary-active));
}
.fs10-announce__row {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 14px; align-items: center;
  padding: 14px 16px;
  color: #fff; text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, #fff 12%, transparent);
}
.fs10-announce__row:last-child { border-bottom: 0; }
.fs10-announce__row:hover { background: color-mix(in srgb, #000 10%, transparent); }
.fs10-announce__ico {
  display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%;
  background: #fff; color: var(--color-primary-ink, var(--color-primary));
}
.fs10-announce__ico .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fs10-announce__body { min-width: 0; display: grid; gap: 3px; }
.fs10-announce__body strong {
  font-size: 15.5px; font-weight: 780;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fs10-announce__body small { color: color-mix(in srgb, #fff 78%, transparent); font-size: 13px; }
.fs10-announce__tag {
  flex: none; padding: 6px 10px; border-radius: 999px;
  background: color-mix(in srgb, #000 22%, transparent);
  font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
}
.fs10-list { display: grid; }
.fs10-row {
  display: grid;
  grid-template-columns: 34px 52px minmax(0, 1fr) 132px 200px 72px 78px;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid var(--color-border);
  min-width: 0;
}
.fs10-row:last-child { border-bottom: 0; }
.fs10-row:hover { background: color-mix(in srgb, var(--color-elevated) 58%, transparent); }
.fs10-row.is-fresh {
  box-shadow: inset 3px 0 0 var(--color-primary);
}
.fs10-row.is-hot {
  background: color-mix(in srgb, #f97316 6%, transparent);
}
.fs10-row__status { display: grid; place-items: center; }
.fs10-ico {
  display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  color: var(--color-muted);
}
.fs10-ico--lock { color: var(--color-warning); border-color: color-mix(in srgb, var(--color-warning) 35%, var(--color-border)); }
.fs10-ico--hot { color: #fb923c; border-color: color-mix(in srgb, #f97316 40%, var(--color-border)); background: color-mix(in srgb, #f97316 14%, transparent); }
.fs10-row__avatar { display: grid; place-items: center; text-decoration: none; }
.fs10-ava, img.fs10-ava {
  width: 46px; height: 46px; border-radius: 50%; font-size: 14px;
  border: 2px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
}
.fs10-ava--sm, img.fs10-ava--sm {
  width: 22px; height: 22px; font-size: 10px; border-width: 1px;
}
.fs10-row__main { min-width: 0; display: grid; gap: 5px; }
.fs10-row__title {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 7px 9px;
  color: var(--color-text); text-decoration: none; font-weight: 750; font-size: 15.5px; line-height: 1.28;
  min-width: 0;
}
.fs10-row__title > span {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
}
.fs10-row__title:hover > span { color: var(--color-primary-ink, var(--color-primary)); }
.fs10-prefix {
  flex: none; font-style: normal; font-size: 11.5px; font-weight: 800;
  letter-spacing: .03em; text-transform: uppercase; color: #fb7185;
}
.fs10-prefix--lock { color: var(--color-warning); }
.fs10-prefix--hot { color: #f97316; }
.fs10-prefix--new { color: #38bdf8; }
.fs10-prefix--ok { color: #34d399; }
.fs10-row__meta {
  display: flex; flex-wrap: wrap; gap: 7px; align-items: center;
  color: var(--color-muted); font-size: 13px;
}
.fs10-row__meta a { color: var(--color-muted); text-decoration: none; font-weight: 650; }
.fs10-row__meta a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.fs10-row__pages {
  display: inline-flex; gap: 3px; margin-left: 4px;
}
.fs10-row__pages a {
  display: inline-grid; place-items: center;
  min-width: 20px; height: 20px; padding: 0 5px;
  border-radius: 5px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 60%, transparent);
  color: var(--color-muted); font-size: 11px; font-weight: 750; text-decoration: none;
}
.fs10-row__pages a:hover { color: var(--color-primary-ink, var(--color-primary)); border-color: var(--color-primary); }
.fs10-row__rate {
  display: inline-flex; gap: 2px; justify-content: center; align-items: center;
  color: color-mix(in srgb, var(--color-muted) 70%, transparent);
  font-size: 14px; letter-spacing: -.02em;
}
.fs10-row__rate i { font-style: normal; }
.fs10-row__rate i.is-fill { color: #f59e0b; }
.fs10-row__clip {
  display: inline-grid; place-items: center; margin-left: 6px;
  color: var(--color-primary-ink, var(--color-primary)); opacity: .85;
}
.fs10-row__last {
  display: grid; gap: 5px; justify-items: end; text-align: right; min-width: 0;
}
.fs10-row__last time {
  color: var(--color-muted); font-size: 12px; font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fs10-row__last-user a,
.fs10-row__last-user > span {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--color-text); font-size: 13.5px; font-weight: 700; text-decoration: none;
  max-width: 100%;
}
.fs10-row__last-user a span {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 12ch;
}
.fs10-row__last-user em { font-style: normal; color: var(--color-primary-ink, var(--color-primary)); }
.fs10-row__last-user a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.fs10-row__num {
  display: grid; justify-items: center; gap: 3px;
  color: var(--color-muted);
}
.fs10-row__num b {
  color: var(--color-text); font-size: 15px; font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.fs10-row__num em { display: inline-flex; font-style: normal; }
.fs10-row__num .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fs10-empty {
  padding: 48px 22px; text-align: center; color: var(--color-muted);
  display: grid; gap: 10px; justify-items: center;
}
.fs10-empty__ico {
  display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); margin-bottom: 4px;
}
.fs10-empty strong { color: var(--color-text); font-size: 17px; }
.fs10-empty p { margin: 0; font-size: 14px; max-width: 40ch; }
.fs10-promo {
  text-align: center; padding: 4px 8px;
}
.fs10-promo a {
  color: var(--color-muted); font-size: 12.5px; font-weight: 650; text-decoration: none;
  border-bottom: 1px dashed color-mix(in srgb, var(--color-muted) 45%, transparent);
}
.fs10-promo a:hover { color: var(--color-primary-ink, var(--color-primary)); border-color: var(--color-primary); }
.fs10-filter {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; align-items: end;
  padding: 14px 16px; border-radius: 14px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 36%, transparent);
}
.fs10-filter__form {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: end;
}
.fs10-filter__form label {
  display: grid; gap: 5px; font-size: 11.5px; font-weight: 700;
  letter-spacing: .03em; text-transform: uppercase; color: var(--color-muted);
}
.fs10-filter__form select,
.fs10-filter__form input[type="number"] {
  min-height: 40px; padding: 0 12px;
  border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text);
  font-size: 13.5px; font-weight: 650; text-transform: none; letter-spacing: 0;
}
.fs10-filter__jump {
  grid-template-columns: auto auto; align-items: end;
}
.fs10-filter__jump span { grid-column: 1 / -1; }
.fs10-filter__jump input { width: 72px; }
.fs10-filter__jump button {
  min-height: 40px; padding: 0 14px; border-radius: 10px; border: 0;
  background: var(--color-primary); color: #fff; font-weight: 750; cursor: pointer;
}
.fs10-foot {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; align-items: center;
  padding: 16px 18px; border-radius: 14px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.fs10-foot__info strong { display: block; font-size: 15.5px; }
.fs10-foot__info p { margin: 5px 0 0; color: var(--color-muted); font-size: 13.5px; }
.fs10-foot__stats {
  display: flex; flex-wrap: wrap; gap: 10px;
}
.fs10-foot__stats span {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 36px; padding: 0 12px; border-radius: 10px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted); font-size: 13px; font-weight: 650;
}
.fs10-foot__stats .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fs10-foot__stats b { color: var(--color-text); font-weight: 800; font-variant-numeric: tabular-nums; }

@media (max-width: 1100px) {
  .fs10-cols,
  .fs10-row {
    grid-template-columns: 30px 46px minmax(0, 1fr) 110px 168px;
  }
  .fs10-cols__num,
  .fs10-row__num { display: none; }
  .fs10-cols__topic { grid-column: 1 / 4; }
}
@media (max-width: 900px) {
  .fs10-cols { display: none; }
  .fs10-row {
    grid-template-columns: 28px 44px minmax(0, 1fr);
    grid-template-areas:
      "status avatar main"
      "status avatar last"
      "rate rate rate";
  }
  .fs10-row__status { grid-area: status; }
  .fs10-row__avatar { grid-area: avatar; }
  .fs10-row__main { grid-area: main; }
  .fs10-row__rate { grid-area: rate; justify-content: flex-start; padding-left: 84px; }
  .fs10-row__last { grid-area: last; justify-items: start; text-align: left; }
  .fs10-head__meta { grid-auto-flow: row; width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .fs10-head { padding: 16px; }
  .fs10-toolbar { padding: 10px; }
  .fs10-toolbar__hint { display: none; }
  .fs10-create { text-transform: none; letter-spacing: 0; font-size: 14px; }
  .fs10-row { padding: 12px; gap: 10px; }
  .fs10-row__title { font-size: 14.5px; }
  .fs10-row__title > span { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .fs10-announce__row { grid-template-columns: 40px minmax(0, 1fr); }
  .fs10-announce__tag { display: none; }
  .fs10-filter { padding: 12px; }
  .fs10-foot__stats { width: 100%; }
}

.forum-children { margin-bottom: 14px; }
.forum-children__title { margin: 0 0 8px; padding: 12px 14px 0; font-size: 14px; }
.thread-pulse--v7 { display: flex; flex-wrap: wrap; gap: 6px; }
.thread-pulse--v7 > span {
  display: inline-flex; align-items: center; gap: 5px;
  height: 28px; padding: 0 9px; border-radius: 9px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted); font-size: 12px; font-weight: 650;
}
.thread-pulse--v7 b { color: var(--color-text); font-weight: 800; font-variant-numeric: tabular-nums; }
.thread-pulse--v7 .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.yon-thread--v7 .th-btn {
  min-height: 32px; padding: 0 10px; border-radius: 9px; font-size: 12px;
}
.yon-thread--v7 .th-btn--main { min-width: 88px; }

.post-list--v7 { display: grid; gap: 14px; }
.yon-thread--v7 .post--v7 {
  --post-aside: 196px;
  display: grid;
  grid-template-columns: var(--post-aside) minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  grid-template-areas:
    "user bar"
    "user body"
    "user react";
  align-items: stretch;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  background:
    linear-gradient(var(--color-elevated), var(--color-elevated)) 0 0 / var(--post-aside) 100% no-repeat,
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  overflow: hidden;
  isolation: isolate;
}
.post--v7.is-best { box-shadow: inset 3px 0 0 var(--color-success), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset; }
.post--v7.is-op { box-shadow: inset 3px 0 0 var(--color-primary), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset; }
.post--v7.is-best.is-op { box-shadow: inset 3px 0 0 var(--color-success), inset 6px 0 0 var(--color-primary), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset; }
.post--v7 .post__bar {
  grid-area: bar;
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px;
  min-height: 42px; padding: 8px 16px;
  background: color-mix(in srgb, var(--color-elevated) 48%, transparent);
  border-bottom: 1px solid var(--color-border); font-size: 12px;
  position: relative; z-index: 3; overflow: visible;
}
.post--v7 .post__when {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px;
  color: var(--color-muted); font-weight: 650;
}
.post--v7 .post__when time { color: var(--color-text); font-variant-numeric: tabular-nums; }
.post--v7 .post__aside {
  grid-area: user;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  align-self: stretch; justify-self: stretch;
  min-height: 100%; height: auto;
  padding: 18px 14px 14px; gap: 9px;
  background: transparent;
  border-right: 1px solid var(--color-border);
}
.post--v7 .post__main {
  grid-area: body; min-width: 0; min-height: 0;
  display: flex; flex-direction: column;
}
.post--v7 .post__react {
  grid-area: react;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 10px 16px 12px; border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 32%, transparent);
}
.post--v7 .post__bar-right {
  display: flex; flex-wrap: wrap; gap: 5px; align-items: center; justify-content: flex-end;
}
.post--v7 .post-tool__txt { display: none; }
.post--v7 .post-drop { position: relative; }
.post--v7 .post-menu {
  z-index: 50;
  max-height: min(70vh, 420px);
  overflow: auto;
}
.post--v7 .post-menu__split {
  display: grid; gap: 6px; padding: 8px; border-top: 1px solid var(--color-border);
}
.post--v7 .post-menu__split input {
  width: 100%; min-height: 30px; border-radius: 8px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); padding: 0 8px;
}
.post--v7 .post__ava, .post--v7 img.post__ava {
  width: 76px; height: 76px; font-size: 24px;
  border: 2px solid color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 12%, transparent);
}
.post--v7 .post__name a { font-size: 14.5px; font-weight: 750; }
.post--v7 .post__handle { margin: 2px 0 0; font-size: 11.5px; color: var(--color-muted); }
.post--v7 .post__title { margin: 4px 0 0; font-size: 11.5px; color: var(--color-muted); }
.post--v7 .post__joined {
  margin: 0; color: var(--color-muted); font-size: 11px; font-weight: 650;
}
.post--v7 .post__chips {
  display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; width: 100%;
  margin-top: 2px;
}
.post--v7 .post__chips .yon-chip,
.post--v7 .post__chips .rank-chip {
  height: 22px; padding: 0 8px; border-radius: 999px; font-size: 10.5px; font-weight: 700;
}
.post--v7 .post__ranks {
  display: flex; flex-direction: column; align-items: center; gap: 5px;
  width: 100%; max-width: 100%; overflow: hidden;
}
.post--v7 .rank-mark,
.post--v7 .rank-mark--post {
  display: flex; justify-content: center; width: 100%; max-width: 160px;
}
.post--v7 .rank-mark img {
  max-width: 100%; max-height: 28px; width: auto; height: auto; object-fit: contain;
}
.post--v7 .post__kpis {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0; width: 100%; margin-top: auto;
  border: 1px solid var(--color-border); border-radius: 12px; overflow: hidden;
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
}
.post--v7 .post__kpis span {
  display: grid; justify-items: center; gap: 1px; padding: 8px 4px;
  border: 0; border-right: 1px solid var(--color-border); border-radius: 0;
  background: transparent;
}
.post--v7 .post__kpis span:last-child { border-right: 0; }
.post--v7 .post__kpis b { font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; }
.post--v7 .post__kpis em {
  font-style: normal; font-size: 9.5px; color: var(--color-muted); font-weight: 700;
  letter-spacing: .02em; text-transform: uppercase;
}
.post--v7 .post__stats-toggle {
  display: block; width: 100%; min-height: 32px; padding: 6px 10px;
  border-radius: 10px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 65%, transparent);
  color: var(--color-muted); font-size: 11.5px; font-weight: 700; cursor: pointer;
}
.post--v7 .post__stats-toggle:hover { color: var(--color-text); border-color: var(--color-primary); }
.post--v7 .post__stats,
.post--v7 .post__pager { display: none; }
.post--v7.is-stats .post__stats { display: grid; gap: 6px; width: 100%; margin: 0; font-size: 11.5px; text-align: left; }
.post--v7.is-stats .post__pager { display: flex; }
.post--v7 .post__content {
  flex: 1 1 auto;
  padding: 18px 20px 14px; max-height: none; min-height: 110px;
  font-size: 15.5px; line-height: 1.72;
}
.post--v7 .post__foot {
  display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; padding: 0; border: 0;
}
.post--v7 .post-like {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 34px; border-radius: 10px; padding: 0 12px; font-size: 12.5px; font-weight: 700;
}
.post--v7 .post-act {
  min-height: 34px; border-radius: 10px; font-size: 12px; font-weight: 650; padding: 5px 11px;
}
.post--v7 .post__sig {
  margin: 0 20px 12px; padding-top: 10px;
  border-top: 1px dashed var(--color-border);
  font-size: 12.5px; color: var(--color-muted);
}
.post--v7 .post__likers { font-size: 12.5px; margin: 0; color: var(--color-muted); }
.post--v7 .post__num {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 28px; padding: 0 8px; border-radius: 8px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted); font-weight: 780; font-variant-numeric: tabular-nums; text-decoration: none;
}
.post--v7 .post__num:hover { color: var(--color-primary-ink, var(--color-primary)); border-color: var(--color-primary); }
.post--v7 .post-tag {
  display: inline-flex; align-items: center; height: 24px; padding: 0 9px;
  border-radius: 999px; font-size: 11px; font-weight: 750; font-style: normal;
}
.post--v7 .post-rate { display: inline-flex; align-items: center; gap: 4px; }
.post--v7 .post__content blockquote,
.post--v7 .post__content .yon-quote {
  margin: 0 0 12px; padding: 12px 14px;
  border-left: 3px solid var(--color-primary);
  border-radius: 0 12px 12px 0;
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
.post--v7 .post__content pre,
.post--v7 .post__content code {
  border-radius: 10px;
}
.post--v7 .post__content img {
  max-width: 100%; height: auto; border-radius: 12px;
}

/* Thread / post-list v10 ? wider canvas, roomy aside, no overflow */
.app-frame:has(.yon-thread--v10) {
  width: min(1560px, calc(100% - 28px));
}
.yon-thread--v10 { display: grid; gap: 16px; max-width: 1560px; margin: 0 auto; }
.yon-thread--v10 .th-btn {
  min-height: 32px; padding: 0 10px; border-radius: 9px; font-size: 12px;
}
.yon-thread--v10 .th-btn--main { min-width: 88px; }

.post-list--v10 { display: grid; gap: 16px; }
.yon-thread--v10 .post--v10 {
  --post-aside: 236px;
  display: grid;
  grid-template-columns: var(--post-aside) minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  grid-template-areas:
    "user bar"
    "user body"
    "user react";
  align-items: stretch;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 14%, var(--color-border));
  background: var(--post-bg, var(--color-surface));
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset,
    0 8px 20px color-mix(in srgb, #000 8%, transparent);
  overflow: visible;
  isolation: isolate;
  transition: background var(--ease), border-color var(--ease), box-shadow var(--ease);
}
.yon-thread--v10 .post--v10:hover {
  background: var(--post-hover, var(--color-elevated));
}
.post--v10.is-best { box-shadow: inset 3px 0 0 var(--color-success), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset; }
.post--v10.is-op { box-shadow: inset 3px 0 0 var(--color-primary), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset; }
.post--v10.is-best.is-op { box-shadow: inset 3px 0 0 var(--color-success), inset 6px 0 0 var(--color-primary), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset; }
.post--v10 .post__bar {
  grid-area: bar;
  display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center; gap: 12px;
  min-height: 42px; padding: 7px 16px 7px 14px;
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  border-bottom: 1px solid var(--color-border); font-size: 12px;
  position: relative; z-index: 3; overflow: visible; min-width: 0;
}
.post--v10 .post__when {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px;
  color: var(--color-muted); font-weight: 650; min-width: 0; flex: 1 1 auto;
}
.post--v10 .post__when time { color: var(--color-text); font-variant-numeric: tabular-nums; font-weight: 750; }
.post--v10 .post__edited {
  max-width: 18ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.post--v10 .post__aside {
  grid-area: user;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  align-self: stretch; justify-self: stretch;
  min-height: 100%; height: auto; min-width: 0;
  padding: 18px 14px 14px; gap: 9px;
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  border-right: 1px solid var(--color-border);
  box-sizing: border-box;
}
.post--v10 .post__main {
  grid-area: body; min-width: 0; min-height: 0;
  display: flex; flex-direction: column;
}
.post--v10 .post__react {
  grid-area: react;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px;
  padding: 12px 18px 14px; border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 32%, transparent);
  min-width: 0;
}
.post--v10 .post__bar-right {
  display: flex; flex-wrap: nowrap; gap: 8px; align-items: center; justify-content: flex-end;
  flex: 0 0 auto;
}
.post--v10 .post-tool {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; min-width: 32px; padding: 0;
  border-radius: 9px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted); font-size: 16px; line-height: 1; cursor: pointer;
}
.post--v10 .post-tool:hover { color: var(--color-text); border-color: var(--color-primary); }
.post--v10 .post-drop { position: relative; }
.post--v10 .post-menu {
  z-index: 50;
  max-height: min(70vh, 440px);
  overflow: auto;
  min-width: 220px;
}
.post--v10 .post-menu__search {
  display: grid; gap: 6px; padding: 8px; border-top: 1px solid var(--color-border);
}
.post--v10 .post-menu__search input {
  width: 100%; min-height: 32px; border-radius: 8px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); padding: 0 10px; font-size: 12.5px;
  box-sizing: border-box;
}
.post--v10 .post-menu__split {
  display: grid; gap: 6px; padding: 8px; border-top: 1px solid var(--color-border);
}
.post--v10 .post-menu__split input {
  width: 100%; min-height: 30px; border-radius: 8px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); padding: 0 8px; box-sizing: border-box;
}
.post--v10 .post__id { width: 100%; min-width: 0; }
.post--v10 .post__ava, .post--v10 img.post__ava {
  width: 84px; height: 84px; font-size: 26px;
  border: 2px solid color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 12%, transparent);
}
.post--v10 .post__name {
  display: flex; align-items: center; justify-content: center; gap: 4px;
  width: 100%; min-width: 0;
}
.post--v10 .post__name a {
  font-size: 15px; font-weight: 750;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.post--v10 .post__name a.yon-nick.is-prem {
  color: var(--nick-color);
  font-weight: 800;
}
.post--v10 .post__name a.yon-nick.is-prem:hover {
  color: var(--nick-color);
  filter: brightness(1.08);
}

/* Premium nick colors by membership tier */
.yon-nick {
  color: inherit;
  font-weight: inherit;
  transition: color .12s ease, filter .12s ease, text-shadow .12s ease;
}
.yon-nick.is-prem {
  color: var(--nick-color, var(--color-primary));
  font-weight: 800;
}
.yon-nick.is-prem-bold {
  font-weight: 850;
  letter-spacing: -.015em;
}
.yon-nick.is-prem-silver {
  text-shadow: 0 0 14px color-mix(in srgb, var(--nick-color) 28%, transparent);
}
.yon-nick.is-prem-gold {
  text-shadow: 0 0 16px color-mix(in srgb, var(--nick-color) 36%, transparent);
}
.yon-nick.is-prem-platin {
  text-shadow: 0 0 18px color-mix(in srgb, var(--nick-color) 40%, transparent);
}
.yon-nick.is-prem-kurumsal {
  text-shadow: 0 0 16px color-mix(in srgb, var(--nick-color) 34%, transparent);
}
.yon-nick.is-prem-kurumsal-plus {
  text-shadow: 0 0 20px color-mix(in srgb, var(--nick-color) 42%, transparent);
}
a.yon-nick.is-prem:hover,
.yon-nick.is-prem:hover {
  color: var(--nick-color, var(--color-primary));
  filter: brightness(1.08);
}

.yon-chip--premium {
  color: var(--nick-color, var(--color-premium));
  background: color-mix(in srgb, var(--nick-color, var(--color-premium)) 14%, transparent);
  border-color: color-mix(in srgb, var(--nick-color, var(--color-premium)) 30%, var(--color-border));
}
.yon-chip--premium.is-silver { --nick-color: #A9C1D6; }
.yon-chip--premium.is-gold { --nick-color: #F0C14B; }
.yon-chip--premium.is-platin { --nick-color: #C3A6FF; }
.yon-chip--premium.is-kurumsal { --nick-color: #FF9B42; }
.yon-chip--premium.is-kurumsal-plus { --nick-color: #FF5F7E; }

.acct__chip.is-premium {
  color: var(--nick-color, var(--color-premium));
  background: color-mix(in srgb, var(--nick-color, var(--color-premium)) 14%, transparent);
  border-color: color-mix(in srgb, var(--nick-color, var(--color-premium)) 28%, var(--color-border));
}
.acct__chip.is-premium.is-silver { --nick-color: #A9C1D6; }
.acct__chip.is-premium.is-gold { --nick-color: #F0C14B; }
.acct__chip.is-premium.is-platin { --nick-color: #C3A6FF; }
.acct__chip.is-premium.is-kurumsal { --nick-color: #FF9B42; }
.acct__chip.is-premium.is-kurumsal-plus { --nick-color: #FF5F7E; }

.acct__who-top .yon-nick.is-prem,
.pro-id__name .yon-nick.is-prem {
  color: var(--nick-color);
}

.post--v10 .post__handle {
  margin: 3px 0 0; font-size: 12px; color: var(--color-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.post--v10 .post__title {
  margin: 5px 0 0; font-size: 12px; color: var(--color-muted); line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.post--v10 .post__joined {
  margin: 0; color: var(--color-muted); font-size: 11.5px; font-weight: 650;
  white-space: nowrap;
}
.post--v10 .post__chips {
  display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; width: 100%;
  margin-top: 2px; max-width: 100%;
}
.post--v10 .post__chips .yon-chip,
.post--v10 .post__chips .rank-chip {
  height: 24px; max-width: 100%; padding: 0 9px; border-radius: 999px;
  font-size: 11px; font-weight: 700;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.post--v10 .post__ranks {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  width: 100%; max-width: 100%; overflow: hidden;
}
.post--v10 .rank-mark,
.post--v10 .rank-mark--post {
  display: flex; justify-content: center; width: 100%; max-width: 180px;
}
.post--v10 .rank-mark img {
  max-width: 100%; max-height: 30px; width: auto; height: auto; object-fit: contain;
}
.post--v10 .post__kpis {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0; width: 100%; margin-top: auto;
  border: 1px solid var(--color-border); border-radius: 12px; overflow: hidden;
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
}
.post--v10 .post__kpis span {
  display: grid; justify-items: center; gap: 2px; padding: 10px 4px;
  border: 0; border-right: 1px solid var(--color-border); border-radius: 0;
  background: transparent; min-width: 0;
}
.post--v10 .post__kpis span:last-child { border-right: 0; }
.post--v10 .post__kpis b {
  font-size: 14px; font-weight: 800; font-variant-numeric: tabular-nums;
}
.post--v10 .post__kpis em {
  font-style: normal; font-size: 9.5px; color: var(--color-muted); font-weight: 700;
  letter-spacing: .01em; text-transform: uppercase; line-height: 1.1;
  white-space: nowrap;
}
.post--v10 .post__stats-toggle {
  display: block; width: 100%; min-height: 34px; padding: 6px 10px;
  border-radius: 10px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 65%, transparent);
  color: var(--color-muted); font-size: 12px; font-weight: 700; cursor: pointer;
  box-sizing: border-box;
}
.post--v10 .post__stats-toggle:hover { color: var(--color-text); border-color: var(--color-primary); }
.post--v10 .post__stats,
.post--v10 .post__pager { display: none; }
.post--v10.is-stats .post__stats {
  display: grid; gap: 6px; width: 100%; margin: 0; font-size: 12px; text-align: left;
}
.post--v10.is-stats .post__stats > div {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: baseline;
}
.post--v10.is-stats .post__stats dt { color: var(--color-muted); font-weight: 650; }
.post--v10.is-stats .post__stats dd {
  margin: 0; font-weight: 700; text-align: right;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 12ch;
}
.post--v10.is-stats .post__pager { display: flex; }
.post--v10 .post__content {
  flex: 1 1 auto;
  padding: 20px 22px 16px; max-height: none; min-height: 128px;
  font-size: 15.5px; line-height: 1.72;
  overflow-wrap: anywhere; word-break: break-word;
}
.post--v10 .post__foot {
  display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; padding: 0; border: 0;
  max-width: 100%;
}
.post--v10 .post-like {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 36px; border-radius: 10px; padding: 0 14px; font-size: 13px; font-weight: 700;
}
.post--v10 .post-act {
  min-height: 36px; border-radius: 10px; font-size: 12.5px; font-weight: 650; padding: 5px 12px;
}
.post--v10 .post__sig {
  margin: 0 22px 14px; padding-top: 10px;
  border-top: 1px dashed var(--color-border);
  font-size: 12.5px; color: var(--color-muted);
  overflow-wrap: anywhere;
}
.post--v10 .post__likers {
  font-size: 12.5px; margin: 0; color: var(--color-muted);
  flex: 1 1 160px; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.post--v10 .post__num {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 40px; height: 32px; padding: 0 10px; border-radius: 9px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted); font-weight: 780; font-variant-numeric: tabular-nums; text-decoration: none;
}
.post--v10 .post__num:hover { color: var(--color-primary-ink, var(--color-primary)); border-color: var(--color-primary); }
.post--v10 .post-tag {
  display: inline-flex; align-items: center; height: 24px; padding: 0 9px;
  border-radius: 999px; font-size: 11px; font-weight: 750; font-style: normal;
}
.post--v10 .post-rate { display: inline-flex; align-items: center; gap: 2px; margin: 0; }
.post--v10 .post-stars {
  display: inline-flex; gap: 1px; padding: 4px 6px; border-radius: 8px;
  border: 1px solid transparent; background: transparent; cursor: pointer; color: var(--color-muted);
}
.post--v10 .post-stars i { font-style: normal; font-size: 13px; line-height: 1; }
.post--v10 .post-stars i.is-fill,
.post--v10 .post-stars.is-on i.is-fill { color: #eab308; }
.post--v10 .post-stars:hover { border-color: var(--color-border); background: color-mix(in srgb, var(--color-surface) 65%, transparent); }
.post--v10 .post__content blockquote,
.post--v10 .post__content .yon-quote {
  margin: 0 0 12px; padding: 12px 14px;
  border-left: 3px solid var(--color-primary);
  border-radius: 0 12px 12px 0;
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
.post--v10 .post__content pre,
.post--v10 .post__content code {
  border-radius: 10px; max-width: 100%; overflow-x: auto;
}
.post--v10 .post__content img {
  max-width: 100%; height: auto; border-radius: 12px;
}
.post--v10 .post__content table {
  display: block; max-width: 100%; overflow-x: auto;
}

/* Post / thread v10 polish */
.thread-head--v10 {
  border-radius: 16px;
  border-color: color-mix(in srgb, var(--color-primary) 16%, var(--color-border));
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.thread-head--v10 .thread-head__ribbon {
  background: linear-gradient(90deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 35%, transparent));
  opacity: .9;
}
.thread-meta--v10 {
  background: color-mix(in srgb, var(--color-elevated) 42%, transparent);
}
.post-reply--v10 {
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 18%, var(--color-border));
  box-shadow: 0 8px 22px color-mix(in srgb, #000 8%, transparent);
}
.post-reply--v10 .post-reply__head {
  background: color-mix(in srgb, var(--color-elevated) 48%, transparent);
  border-bottom: 1px solid var(--color-border);
}
.post--v10.is-op { box-shadow: inset 3px 0 0 var(--color-primary), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset, 0 8px 20px color-mix(in srgb, #000 8%, transparent); }
.post--v10.is-best { box-shadow: inset 3px 0 0 var(--color-success), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset, 0 8px 20px color-mix(in srgb, #000 8%, transparent); }
.post--v10.is-best.is-op { box-shadow: inset 3px 0 0 var(--color-success), inset 6px 0 0 var(--color-primary), 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset, 0 8px 20px color-mix(in srgb, #000 8%, transparent); }
.post--v10 .post-tag--op {
  background: color-mix(in srgb, var(--color-primary) 16%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}
.post--v10 .post-tag--best {
  background: color-mix(in srgb, var(--color-success) 16%, transparent);
  color: var(--color-success);
}
.post--v10 .post__react {
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.post--v10 .post-react {
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 75%, transparent);
  min-height: 32px; padding: 0 10px;
}
.post--v10 .post-react.is-on {
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-surface));
  color: var(--color-primary-ink, var(--color-primary));
}
.post--v10 .post-act--main {
  background: var(--color-primary);
  color: var(--color-on-primary, #fff);
  border-color: var(--color-primary);
}
.post--v10 .post-act--main:hover {
  background: var(--color-primary-hover);
  color: var(--color-on-primary, #fff);
}
.post--v10 .post__ava, .post--v10 img.post__ava {
  width: 80px; height: 80px; font-size: 24px;
  border-radius: 18px;
}
.post--v10 .post__kpis {
  border-radius: 12px;
  background: color-mix(in srgb, var(--color-surface) 80%, transparent);
}
.post--v10 .post__content {
  padding: 18px 20px 14px; min-height: 120px;
  font-size: 15.25px; line-height: 1.7;
}

.post-reply--v7 {
  border-radius: 14px; overflow: hidden; padding: 0;
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  background: var(--color-surface);
}
.post-reply--v7 .post-reply__head { padding: 12px 14px 10px; }
.post-reply--v7 .post-reply__head h2 { font-size: 14px; }
.post-reply--v7 .post-reply__head p { font-size: 12px; }
.post-reply--v7 > .nx-muted,
.post-reply--v7 > p { margin: 0; padding: 14px 16px; }

.thread-readers--v7 {
  margin: 0; padding: 12px; border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 35%, var(--color-surface));
}
.yon-pager--v7 { justify-content: center; margin: 0; }
.thread-jump--v7 {
  position: fixed; right: 14px; bottom: 86px; z-index: 32; display: grid; gap: 6px;
}
.thread-jump--v7 a {
  width: 42px; height: 42px; display: grid; place-items: center;
  border-radius: 12px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
  color: var(--color-text);
  box-shadow: 0 10px 20px color-mix(in srgb, #000 20%, transparent);
  backdrop-filter: blur(10px);
}
.thread-jump--v7 a:hover { color: var(--color-text); border-color: var(--color-primary); }
.thread-jump--v7 a.is-reply {
  background: var(--color-primary); color: #fff; border-color: transparent;
}
.thread-jump--v7 a.is-reply:hover { color: #fff; }

.thread-poll--v7 {
  border: 1px solid color-mix(in srgb, var(--color-border) 86%, var(--color-primary));
  border-radius: 14px; padding: 14px 16px; background: var(--color-surface);
}
.thread-poll__head {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: baseline;
  margin-bottom: 12px;
}
.thread-poll__head h2 { margin: 0; font-size: 1.05rem; }
.thread-poll__head span { color: var(--color-muted); font-size: 12px; font-weight: 650; }
.thread-poll__options { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.thread-poll__options label {
  display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-radius: 10px;
  border: 1px solid var(--color-border); cursor: pointer;
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.thread-poll__results { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 10px; }
.thread-poll__row { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.thread-poll__bar {
  display: block; height: 8px; border-radius: 999px; margin-top: 6px;
  background: color-mix(in srgb, var(--color-border) 70%, transparent);
  position: relative; overflow: hidden;
}
.thread-poll__bar::after {
  content: ''; position: absolute; inset: 0 auto 0 0; width: var(--pct, 0%);
  background: var(--color-primary); border-radius: inherit;
}
.compose-poll {
  border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px;
  background: color-mix(in srgb, var(--color-elevated) 35%, transparent);
}
.compose-poll > summary { cursor: pointer; font-weight: 700; font-size: 13px; }
.compose-poll[open] > summary { margin-bottom: 10px; }
.compose-poll__flags { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }

.post {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  grid-template-areas:
    "bar bar"
    "user body"
    "react react"
    "foot foot";
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: 12px; overflow: visible;
  box-shadow: var(--shadow-sm);
  transition: border-color var(--ease), background var(--ease);
}
.post:hover { border-color: color-mix(in srgb, var(--color-primary) 22%, var(--color-border)); }
.post.is-best { box-shadow: inset 3px 0 0 var(--color-success); }
.post.is-op { box-shadow: inset 3px 0 0 var(--color-primary); }
.post.is-best.is-op { box-shadow: inset 3px 0 0 var(--color-success), inset 6px 0 0 var(--color-primary); }
.post.is-hit { outline: 2px solid color-mix(in srgb, var(--color-primary) 45%, var(--color-border)); outline-offset: -2px; }
.post__bar {
  grid-area: bar;
  display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap;
  min-height: 40px; padding: 6px 12px;
  border-bottom: 1px solid var(--color-border);
  border-radius: 12px 12px 0 0;
  background: var(--color-elevated); color: var(--color-muted); font-size: 12px;
}
.post__aside {
  grid-area: user;
  padding: 16px 14px; background: var(--color-elevated);
  border-right: 1px solid var(--color-border);
  display: grid; justify-items: center; align-content: start; gap: 10px; text-align: center;
}
.post__main { grid-area: body; min-width: 0; display: grid; align-content: start; }
.post__react { grid-area: react; }
.post__foot { grid-area: foot; }
.post__id { display: grid; gap: 4px; justify-items: center; width: 100%; min-width: 0; }
.post__when { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.post__bar-right { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.post__edited { color: var(--color-disabled); }
.post-tool {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 32px; padding: 4px 8px; border: 0; border-radius: 8px;
  background: transparent; color: var(--color-muted); font-weight: 650; font-size: 12px;
  cursor: pointer; text-decoration: none;
  transition: background var(--ease), color var(--ease);
}
.post-tool:hover, .post-tool:focus-visible, .post-drop.is-open > .post-tool {
  background: var(--color-hover); color: var(--color-text);
}
.post-tool--danger { color: var(--color-danger); opacity: .82; }
.post-tool--danger:hover, .post-tool--danger:focus-visible { opacity: 1; background: var(--color-soft-danger, color-mix(in srgb, var(--color-danger) 12%, transparent)); }
.post-tag {
  display: inline-flex; align-items: center; font-size: 11px; font-weight: 700;
  letter-spacing: .02em; padding: 2px 8px; border-radius: 999px;
  border: 1px solid var(--color-border);
}
.post-tag--op {
  color: var(--color-primary-ink, var(--color-primary));
  background: var(--color-soft-primary, color-mix(in srgb, var(--color-primary) 12%, transparent));
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
}
.post-tag--best {
  color: var(--color-success);
  background: var(--color-soft-success, color-mix(in srgb, var(--color-success) 12%, transparent));
  border-color: color-mix(in srgb, var(--color-success) 28%, var(--color-border));
}
.post-drop { position: relative; }
.post-drop > button, .post-rate {
  border: 0; background: transparent; color: var(--color-muted); font-weight: 650; font-size: 12px;
  padding: 4px 8px; cursor: pointer; border-radius: 8px;
  transition: background var(--ease), color var(--ease);
}
.post-drop.is-open > button, .post-drop > button:hover, .post-drop > button:focus-visible {
  background: var(--color-hover); color: var(--color-text);
}
.post-menu {
  display: none; position: absolute; right: 0; top: calc(100% + 4px); min-width: 240px; z-index: 24;
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 10px;
  box-shadow: var(--shadow-md); padding: 6px 0;
}
.post-drop.is-open .post-menu { display: grid; }
.post-menu a, .post-menu button {
  display: block; width: 100%; text-align: left; border: 0; background: transparent;
  color: var(--color-text); padding: 8px 14px; font-size: 13px; cursor: pointer;
}
.post-menu a:hover, .post-menu button:hover, .post-menu a:focus-visible, .post-menu button:focus-visible { background: var(--color-hover); }
.post-menu__label {
  margin: 6px 14px 2px; font-size: 10px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--color-muted);
}
.post-menu--search { padding: 10px; min-width: 240px; }
.post-menu--search input { width: 100%; border: 1px solid var(--color-border); background: var(--color-input-bg, var(--color-elevated)); color: var(--color-text); border-radius: 8px; padding: 8px 10px; }
.post-rate { display: inline-flex; align-items: center; gap: 6px; }
.post-stars { display: inline-flex; gap: 1px; border: 0; background: transparent; cursor: pointer; padding: 0; color: var(--color-disabled); }
.post-stars i { font-style: normal; font-size: 13px; }
.post-stars i.is-fill, .post-stars.is-on i { color: var(--color-warning); }
.post__num {
  display: inline-grid; place-items: center; min-width: 36px; height: 28px; padding: 0 8px;
  background: var(--color-surface); color: var(--color-text-secondary, var(--color-muted));
  border: 1px solid var(--color-border); border-radius: 8px; font-weight: 700; font-size: 12px;
}
.post__num:hover, .post__num:focus-visible { color: var(--color-primary-ink, var(--color-primary)); border-color: var(--color-primary); }
.post__avatar { position: relative; display: grid; }
.post__ava, img.post__ava {
  width: 72px; height: 72px; border-radius: 50%; object-fit: cover; display: grid; place-items: center;
  background: var(--color-surface); font-weight: 700; font-size: 22px; color: var(--color-primary-ink, var(--color-primary));
  border: 2px solid var(--color-border);
  transition: border-color var(--ease), transform var(--ease);
}
.post__avatar:hover .post__ava { border-color: var(--color-primary); }
.post__avatar.is-online .post__ava { border-color: var(--color-online); }
.post__live {
  position: absolute; right: 2px; bottom: 4px; width: 10px; height: 10px; border-radius: 50%;
  background: var(--color-online); border: 2px solid var(--color-elevated);
}
.post__live.is-off { background: var(--color-disabled); }
.post__name { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: center; }
.post__name a { color: var(--color-text); font-weight: 700; font-size: 15px; }
.post__name a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.post__name a.yon-nick.is-prem { color: var(--nick-color); font-weight: 800; }
.post__name a.yon-nick.is-prem:hover { color: var(--nick-color); filter: brightness(1.08); }
.post__handle, .post__title {
  margin: 0; color: var(--color-muted); font-size: 12px; line-height: 1.35;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis;
}
.post__chips { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; }
.post__ranks {
  display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; width: 100%;
  grid-column: 1 / -1;
}
.rank-mark {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 22px; padding: 0; border: 0; border-radius: 0;
  background: transparent;
  color: var(--rank-color, var(--color-primary));
  font-size: 11px; font-weight: 700; line-height: 1.2;
}
.rank-mark img {
  display: block; max-width: 148px; max-height: 44px; width: auto; height: auto;
  border-radius: 6px; object-fit: contain;
}
.rank-mark--profile img { max-width: 180px; max-height: 52px; }
.rank-mark--id img { max-width: 86px; max-height: 20px; }
.rank-mark--admin img { max-width: 120px; max-height: 40px; }
.yon-chip--premium {
  color: var(--color-premium);
  background: var(--color-soft-premium, color-mix(in srgb, var(--color-premium) 12%, transparent));
  border-color: color-mix(in srgb, var(--color-premium) 28%, var(--color-border));
}
.post-medal {
  display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%;
  background: var(--color-soft-primary, color-mix(in srgb, var(--color-primary) 18%, var(--color-elevated)));
  color: var(--color-primary-ink, var(--color-primary)); font-size: 11px; font-style: normal; font-weight: 800;
}
.post__stats-toggle {
  display: none; width: 100%; border: 1px solid var(--color-border); border-radius: 8px;
  background: var(--color-surface); color: var(--color-muted); font-size: 12px; font-weight: 650;
  padding: 7px 10px; cursor: pointer;
}
.post__stats-toggle:hover { background: var(--color-hover); color: var(--color-text); }
.post__stats {
  width: 100%; margin: 4px 0 0; padding: 10px 0 0;
  border-top: 1px solid var(--color-border); display: grid; gap: 6px; text-align: left;
}
.post__stats > div { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.post__stats dt { margin: 0; color: var(--color-muted); font-size: 11px; font-weight: 650; }
.post__stats dd { margin: 0; color: var(--color-text); font-size: 12px; font-weight: 650; text-align: right; max-width: 70%; }
.post__stats .trade-chip { font-size: 10px; padding: 2px 6px; white-space: nowrap; }
.post__pager {
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  color: var(--color-muted); font-size: 12px; padding-top: 4px;
}
.post__pager a, .post__pager span { padding: 2px 8px; border-radius: 6px; color: inherit; }
.post__pager a:hover { background: var(--color-hover); color: var(--color-text); }
.post__pager em { font-style: normal; font-weight: 700; color: var(--color-text-secondary, var(--color-muted)); }
.post__content { padding: 16px 18px 12px; line-height: 1.65; overflow-wrap: anywhere; max-height: 640px; overflow: hidden; color: var(--color-text); }
.post.is-open .post__content { max-height: none; }
.post__content a { color: var(--color-primary-ink, var(--color-primary)); word-break: break-word; }
.post__content a:hover { color: var(--color-primary-ink-hover, var(--color-link-hover)); }
.post__content img, .post__content .yon-embed { max-width: 100%; height: auto; border-radius: 10px; }
.post__content table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; }
.post__content ul, .post__content ol { padding-left: 1.2em; }
.post-video, .yon-video { width: min(560px, 100%); aspect-ratio: 16/9; border: 0; border-radius: 12px; }
.yon-quote { margin: 12px 0; padding: 10px 14px; border-left: 3px solid var(--color-primary); background: var(--color-elevated); border-radius: 0 10px 10px 0; }
.yon-quote cite { display: block; font-style: normal; font-weight: 700; margin-bottom: 6px; }
.yon-code { overflow: auto; max-width: 100%; padding: 12px; border-radius: 10px; background: var(--color-surface-2); border: 1px solid var(--color-border); color: var(--color-text); }
.post__more {
  display: none; margin: 0 18px 12px; border: 0; background: transparent;
  color: var(--color-primary-ink, var(--color-primary)); font-weight: 650; cursor: pointer;
}
.post__more.is-show { display: inline-flex; }
.post__react {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 14px; border-top: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
}
.post-like {
  border: 1px solid var(--color-border); border-radius: 8px; padding: 6px 11px; cursor: pointer; font-weight: 650;
  background: var(--color-surface); color: var(--color-text);
  transition: background var(--ease), border-color var(--ease), color var(--ease);
}
.post-like:hover, .post-like:focus-visible, .post-like.is-on {
  background: var(--color-soft-primary, color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated)));
  color: var(--color-primary-ink, var(--color-primary)); border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
}
.post__likers { margin: 0; color: var(--color-muted); font-size: 12.5px; flex: 1 1 140px; min-width: 120px; }
.post__react .post-tool { margin-left: auto; }
.post-reacts {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.post-reacts form { margin: 0; }
.post-react {
  display: inline-flex; align-items: center; gap: 5px;
  min-height: 32px; padding: 0 10px; border-radius: 999px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text); font: inherit; font-size: 12px; font-weight: 700;
  cursor: pointer; transition: background .12s ease, border-color .12s ease, transform .12s ease;
}
.post-react.is-readonly { cursor: default; }
.post-react:hover:not(.is-readonly) {
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  transform: translateY(-1px);
}
.post-react.is-on {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-surface));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-primary) 12%, transparent);
}
.post-react__emoji { font-size: 15px; line-height: 1; }
.post-react__label { font-size: 12px; font-weight: 700; }
.post-react__n:empty { display: none; }
.post-react__n {
  min-width: 16px; padding: 0 5px; border-radius: 999px;
  background: color-mix(in srgb, var(--color-primary) 18%, transparent);
  font-size: 11px; font-weight: 800; text-align: center;
}
@media (max-width: 720px) {
  .post-react__label { display: none; }
  .post-react { padding: 0 8px; min-height: 34px; }
}
.post__sig {
  margin: 0 18px; padding: 10px 0; border-top: 1px dashed var(--color-border);
  color: var(--color-muted); font-size: 13px;
}
.post__foot {
  display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 6px;
  padding: 8px 14px 12px; border-top: 1px solid var(--color-border);
}
.thread-note {
  margin: 0 0 14px; padding: 10px 14px; border-radius: 10px; font-size: 13px;
  color: var(--color-text-secondary, var(--color-muted));
  background: var(--color-soft-primary, color-mix(in srgb, var(--color-primary) 8%, var(--color-surface)));
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
}
.thread-note strong { color: var(--color-text); font-weight: 700; }
.post-act {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 34px;
  border: 1px solid var(--color-border); border-radius: 8px; padding: 6px 11px; font-size: 12px; font-weight: 650;
  cursor: pointer; color: var(--color-text); text-decoration: none; background: var(--color-surface);
  transition: background var(--ease), border-color var(--ease), color var(--ease);
}
.post-act:hover, .post-act:focus-visible { background: var(--color-hover); color: var(--color-text); border-color: var(--color-primary); }
.post-act.is-on {
  color: var(--color-primary-ink, var(--color-primary)); border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: var(--color-soft-primary, color-mix(in srgb, var(--color-primary) 12%, transparent));
}
.post-act.is-static { cursor: default; }
.post-act--main { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.post-act--main:hover, .post-act--main:focus-visible { background: var(--color-primary-hover); color: #fff; }
.post-reply { padding: 0; overflow: visible; }
.post-reply > .nx-muted, .post-reply > p { margin: 0; padding: 16px 18px; }
.post-reply__form { gap: 0; }
.post-reply__quotes {
  display: inline-flex; border: 0; background: transparent; color: var(--color-muted);
  font-size: 12px; padding: 8px 0; cursor: pointer; text-align: left;
}
.post-reply__actions {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between;
  padding: 8px 14px 14px;
}
.yon-editor.is-quick ~ .post-reply__actions .post-reply__quotes,
.post-reply__form:not(:has(.yon-editor.is-advanced)) .post-reply__quotes { opacity: .85; }
.thread-readers {
  margin: 10px 0 16px; padding: 10px 14px;
  background: var(--color-elevated); border: 1px solid var(--color-border);
  border-radius: var(--radius-md); color: var(--color-muted); font-size: 13px;
}
.thread-readers p { margin: 0; }
.thread-readers__users { margin-top: 6px; }
.thread-readers__users:empty { display: none; margin: 0; }
.thread-readers__users a { color: var(--color-primary-ink, var(--color-primary)); font-weight: 700; }
.thread-readers__users a:hover { color: var(--color-primary-ink-hover, var(--color-link-hover)); text-decoration: underline; }
.quote-tray {
  position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 40;
  display: flex; gap: 10px; align-items: center; padding: 10px 14px;
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: 999px; box-shadow: var(--shadow-lg);
}
.quote-tray[hidden] { display: none !important; }
.quote-tray button { border: 0; background: var(--color-primary); color: #fff; border-radius: 999px; padding: 6px 12px; cursor: pointer; font-weight: 650; }
.thread-jump {
  position: fixed; right: 16px; bottom: 88px; z-index: 32; display: grid; gap: 6px;
}
.thread-jump a {
  display: grid; place-items: center; min-width: 52px; padding: 7px 8px;
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: 10px; color: var(--color-text); font-size: 11px; font-weight: 700;
}
.yon-posts { display: grid; gap: 12px; }
.yon-post {
  display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 0;
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden;
}
.yon-post__author {
  padding: 18px; background: var(--color-elevated); display: grid; justify-items: start; gap: 6px; border-right: 1px solid var(--color-border);
}
.yon-post__author img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.yon-post__body { padding: 18px 20px; }
.yon-post__content { line-height: 1.7; overflow-wrap: anywhere; }
.yon-post__content pre, .yon-post__content code { background: var(--color-elevated); border-radius: 8px; }
.yon-post__sig { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--color-border); color: var(--color-muted); font-size: 13px; }
.report-inline { display: flex; gap: 8px; margin-top: 10px; }
.yon-editor {
  border: 1px solid var(--color-border); border-radius: var(--radius-md);
  background: var(--color-surface); overflow: visible;
}
.post-reply .yon-editor { border: 0; border-radius: 0; }
.yon-editor.is-full {
  position: fixed; inset: 24px; z-index: 70; display: flex; flex-direction: column;
  box-shadow: var(--shadow-lg); overflow: hidden; background: var(--color-surface);
}
.yon-editor.is-full textarea, .yon-editor.is-full .yon-editor__preview { flex: 1; min-height: 0; }
.yon-editor__label {
  padding: 8px 12px; font-size: 12px; font-weight: 700; letter-spacing: .02em;
  color: var(--color-text); background: var(--color-elevated); border-bottom: 1px solid var(--color-border);
}
.yon-editor.is-advanced .yon-editor__label { display: none; }
.yon-editor__head {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  padding: 8px 10px 0; background: var(--color-elevated); border-bottom: 1px solid var(--color-border);
}
.yon-editor.is-quick .yon-editor__head { display: none; }
.yon-editor.is-quick.is-advanced .yon-editor__head { display: flex; }
.yon-editor__modes { display: flex; gap: 2px; }
.yon-editor__modes button, .yon-editor__wide {
  border: 0; background: transparent; color: var(--color-muted); font-weight: 650; font-size: 12px;
  padding: 8px 12px; cursor: pointer; border-radius: 8px 8px 0 0;
}
.yon-editor__modes button.is-on { color: var(--color-text); background: var(--color-surface); }
.ed-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 2px;
  padding: 6px 8px; border-bottom: 1px solid var(--color-border); background: var(--color-elevated);
}
.ed-bar > button, .ed-drop > button, .ed-extra > button {
  border: 0; background: transparent; color: var(--color-text); border-radius: 6px;
  min-width: 28px; height: 28px; padding: 0 7px; cursor: pointer; font-size: 13px; font-weight: 700;
}
.ed-bar > button:hover, .ed-drop > button:hover, .ed-bar > button.is-on, .ed-drop.is-open > button {
  background: var(--color-surface);
}
.ed-ink { text-decoration: underline; text-decoration-color: var(--color-primary-ink, var(--color-primary)); text-underline-offset: 3px; }
.ed-extra { display: inline-flex; align-items: center; gap: 2px; margin-left: 2px; padding-left: 6px; border-left: 1px solid var(--color-border); }
.yon-editor.is-quick:not(.is-advanced) .ed-extra { display: none; }
.ed-drop { position: relative; display: inline-flex; }
.ed-menu {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; z-index: 80;
  min-width: 168px; max-height: 280px; overflow: auto; padding: 6px;
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: 10px; box-shadow: var(--shadow-lg);
}
.ed-drop.is-open > .ed-menu { display: grid; gap: 2px; }
.ed-menu button {
  border: 0; background: transparent; color: var(--color-text); text-align: left;
  padding: 7px 10px; border-radius: 6px; cursor: pointer; font-size: 13px;
}
.ed-menu button:hover { background: var(--color-elevated); }
.ed-menu--narrow { min-width: 72px; }
.ed-menu--narrow button { text-align: center; }
.ed-swatch { grid-template-columns: repeat(4, 28px); gap: 6px; padding: 8px; min-width: 0; }
.ed-swatch button { width: 28px; height: 28px; padding: 0; border-radius: 6px; border: 1px solid var(--color-border); }
.ed-menu--upload { min-width: 240px; padding: 10px; }
.ed-dropzone {
  display: grid; place-items: center; gap: 4px; min-height: 110px; padding: 16px;
  border: 1px dashed var(--color-border); border-radius: 10px; background: var(--color-elevated);
  color: var(--color-muted); cursor: pointer; text-align: center;
}
.ed-dropzone strong { color: var(--color-text); font-size: 14px; }
.ed-dropzone span { font-size: 12px; }
.ed-dropzone.is-over { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.ed-drop--emoji { z-index: 81; }
.ed-emoji { width: min(320px, 86vw); max-height: none; padding: 0; overflow: hidden; }
.ed-emoji__tabs { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--color-border); }
.ed-emoji__tabs button {
  border: 0; background: transparent; color: var(--color-muted); font-weight: 700;
  padding: 8px; border-radius: 0; text-align: center;
}
.ed-emoji__tabs button.is-on { color: var(--color-text); background: color-mix(in srgb, var(--color-primary) 16%, var(--color-surface)); box-shadow: inset 0 -2px 0 var(--color-primary); }
.ed-emoji__grid {
  display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 4px;
  padding: 10px; max-height: 280px; overflow: auto; background: var(--color-elevated);
}
.ed-emoji__grid[hidden] { display: none !important; }
.ed-emoji__grid button { display: grid; place-items: center; padding: 6px; font-size: 18px; text-align: center; }
.yon-editor textarea, .yon-editor__preview {
  width: 100%; border: 0; border-radius: 0; min-height: 200px; padding: 14px 16px;
  background: transparent; color: var(--color-text); resize: vertical;
}
.yon-editor.is-quick textarea { min-height: 148px; }
.yon-editor__preview { min-height: 200px; line-height: 1.7; overflow: auto; }
.ed-actions {
  display: flex; justify-content: flex-end; gap: 8px; padding: 10px 12px;
  background: var(--color-elevated); border-top: 1px solid var(--color-border);
}
.ed-go, .ed-adv {
  border: 0; border-radius: 8px; padding: 8px 14px; font-size: 12px; font-weight: 800;
  letter-spacing: .04em; text-transform: uppercase; cursor: pointer;
}
.ed-go { background: var(--color-primary); color: #fff; }
.ed-go:hover { background: var(--color-primary-hover); }
.ed-adv { background: color-mix(in srgb, var(--color-primary) 28%, var(--color-elevated)); color: var(--color-text); }
.ed-adv:hover { background: color-mix(in srgb, var(--color-primary) 42%, var(--color-elevated)); }
.yon-editor.is-advanced .ed-adv { display: none; }
.yon-note {
  margin: 12px 0; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-elevated); display: grid; gap: 4px;
}
.yon-note strong { font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--color-muted); }
.yon-note--info { border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border)); }
.yon-note--ok { border-color: color-mix(in srgb, var(--color-success) 40%, var(--color-border)); }
.yon-note--warn { border-color: color-mix(in srgb, var(--color-warning) 45%, var(--color-border)); }
.yon-hr { border: 0; border-top: 1px solid var(--color-border); margin: 16px 0; }
.yon-table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 12px 0; }
.yon-table td { border: 1px solid var(--color-border); padding: 8px 10px; }
.yon-mention { font-weight: 650; }
.yon-list { padding-left: 18px; }
.editor-meta { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; color: var(--color-muted); font-size: 12px; padding: 8px 12px; background: var(--color-elevated); border-top: 1px solid var(--color-border); }

.yon-profile-edit { max-width: 760px; }

/* Profile edit studio v4 */
.pro-edit--v4 {
  display: grid; gap: 18px; max-width: 1180px; margin: 0 auto;
}
.pro-edit__head {
  display: flex; justify-content: space-between; gap: 18px; align-items: flex-end; flex-wrap: wrap;
  padding: 8px 2px 4px;
}
.pro-edit__eyebrow {
  margin: 0 0 6px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.pro-edit__head h1 { margin: 0; font-size: clamp(24px, 3vw, 32px); letter-spacing: -.02em; }
.pro-edit__lead { margin: 8px 0 0; max-width: 52ch; color: var(--color-muted); font-size: 14px; line-height: 1.45; }
.pro-edit__head-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.pro-edit__layout {
  display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 18px; align-items: start;
}
.pro-edit__nav {
  position: sticky; top: 88px; display: grid; gap: 4px; padding: 10px;
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 14px;
}
.pro-edit__nav a {
  display: flex; align-items: center; gap: 8px; padding: 9px 11px; border-radius: 10px;
  color: var(--color-text); font-size: 13px; font-weight: 650;
}
.pro-edit__nav a:hover { background: var(--color-elevated); color: var(--color-text); }
.pro-edit__nav a.is-on {
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  box-shadow: inset 3px 0 0 var(--color-primary); color: var(--color-text);
}
.pro-edit__nav .yon-ico { color: var(--color-muted); }
.pro-edit__nav a.is-on .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.pro-edit__form { display: grid; gap: 14px; min-width: 0; }
.pro-edit-card,
.pro-edit-cover {
  scroll-margin-top: 96px;
  background: var(--color-surface);
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  border-radius: 16px;
  padding: 18px 18px 20px;
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.pro-edit-card__head,
.pro-edit-cover__head {
  display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 14px;
}
.pro-edit-card__head h2,
.pro-edit-cover__head h2 {
  margin: 0; font-size: 15px; font-weight: 800; letter-spacing: .02em;
}
.pro-edit-card__head p,
.pro-edit-cover__head p {
  margin: 6px 0 0; color: var(--color-muted); font-size: 13px; line-height: 1.4; max-width: 56ch;
}
.pro-edit-cover__chip {
  flex: none; display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: 999px;
  border: 1px solid var(--color-border); background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--color-muted);
}
.pro-edit-cover__chip.is-new {
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}
.pro-edit-cover__chip.is-off {
  border-color: color-mix(in srgb, #f87171 28%, var(--color-border));
  color: #fca5a5;
}
.pro-edit-cover__stage {
  position: relative; isolation: isolate; min-height: 220px; border-radius: 14px; overflow: hidden;
  border: 1px solid var(--color-border);
  background: linear-gradient(105deg, #0b1f3a 0%, #12355f 48%, #0a2748 100%);
  margin-bottom: 16px;
}
.pro-edit-cover__stage.has-img { background-color: #0b1f3a; background-image: none; }
.pro-edit-cover__stage.has-img::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background-image: var(--cover); background-size: cover; background-position: center;
}
.pro-edit-cover__ribbon {
  position: absolute; left: 0; right: 0; top: 0; z-index: 3; height: 3px;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 40%, #34d399 75%, transparent);
  background-size: 200% 100%;
  animation: corp-ribbon 8s linear infinite;
}
.pro-edit-cover__veil {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, color-mix(in srgb, #061628 62%, transparent), transparent 55%),
    linear-gradient(180deg, transparent 40%, color-mix(in srgb, #061628 72%, transparent));
}
.pro-edit-cover__panel {
  position: absolute; inset: 0; z-index: 2; padding: 22px 24px 78px 24px;
  display: grid; align-content: start;
}
.pro-edit-cover__brand { display: grid; gap: 8px; max-width: 520px; }
.pro-edit-cover__eyebrow {
  font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: color-mix(in srgb, #bfdbfe 85%, #fff);
}
.pro-edit-cover__title {
  margin: 0; font-size: clamp(24px, 3vw, 34px); line-height: 1.1; letter-spacing: -.03em;
  font-weight: 800; color: #fff;
  text-shadow: 0 2px 18px color-mix(in srgb, #000 45%, transparent);
}
.pro-edit-cover__meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pro-edit-cover__badge {
  display: inline-flex; padding: 6px 11px; border-radius: 999px;
  background: color-mix(in srgb, var(--color-primary) 88%, #fff);
  color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
}
.pro-edit-cover__hint {
  display: inline-flex; height: 28px; padding: 0 11px; align-items: center; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #fff 16%, transparent);
  background: color-mix(in srgb, #020617 42%, transparent);
  color: #e2e8f0; font-size: 12px; font-weight: 700; backdrop-filter: blur(8px);
}
.pro-edit-cover__av {
  position: absolute; left: 22px; bottom: 16px; z-index: 3;
  width: 88px; height: 88px; border-radius: 50%; padding: 3px;
  background: linear-gradient(145deg, var(--color-primary), color-mix(in srgb, var(--color-primary-hover) 70%, #111));
  box-shadow: 0 0 0 3px color-mix(in srgb, #061628 80%, transparent), 0 10px 24px color-mix(in srgb, #000 28%, transparent);
}
.pro-edit-cover__av img {
  width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block;
  border: 2px solid color-mix(in srgb, #061628 70%, transparent);
  background: var(--color-elevated);
}
.pro-edit-cover__tools {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 14px; align-items: start;
}
.pro-edit-drop {
  display: grid; justify-items: center; text-align: center; gap: 8px;
  padding: 22px 18px; border-radius: 14px; cursor: pointer;
  border: 1.5px dashed color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 60%),
    color-mix(in srgb, var(--color-elevated) 55%, transparent);
  transition: border-color .15s ease, transform .15s ease, background .15s ease;
}
.pro-edit-drop:hover,
.pro-edit-drop.is-drag {
  border-color: var(--color-primary);
  transform: translateY(-1px);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 14%, transparent), transparent 60%),
    color-mix(in srgb, var(--color-elevated) 70%, transparent);
}
.pro-edit-drop__ico {
  width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.pro-edit-drop strong { font-size: 14px; }
.pro-edit-drop em { font-style: normal; color: var(--color-muted); font-size: 12.5px; }
.pro-edit-drop__btn {
  margin-top: 4px; display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 999px;
  background: var(--color-primary); color: #fff; font-size: 12.5px; font-weight: 800;
}
.pro-edit-tips {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 8px;
}
.pro-edit-tips li {
  padding: 10px 12px; border-radius: 11px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
  color: var(--color-muted); font-size: 12.5px; line-height: 1.4;
}
.pro-edit-tips b { color: var(--color-text); font-weight: 750; }
.pro-edit-cover__file { margin: 12px 0 0; color: var(--color-muted); font-size: 12.5px; line-height: 1.4; }
.pro-edit-check {
  display: flex; align-items: center; gap: 8px; margin-top: 12px;
  font-size: 13px; font-weight: 650; cursor: pointer;
}
.pro-edit-check input { width: 16px; height: 16px; accent-color: var(--color-primary); }
.pro-edit-avatar {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center;
}
.pro-edit-avatar__preview {
  width: 112px; height: 112px; border-radius: 50%; padding: 4px;
  background: linear-gradient(145deg, var(--color-primary), color-mix(in srgb, var(--color-primary-hover) 70%, #111));
  box-shadow: 0 0 0 4px var(--color-surface), 0 12px 28px color-mix(in srgb, #000 18%, transparent);
}
.pro-edit-avatar__preview img {
  width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block;
  border: 3px solid var(--color-surface); background: var(--color-elevated);
}
.pro-edit-avatar__tools { display: grid; gap: 8px; }
.pro-edit-file { display: grid; gap: 6px; }
.pro-edit-file span { font-size: 12.5px; font-weight: 700; color: var(--color-muted); }
.pro-edit__form .yon-form-grid { margin: 0; }
.pro-edit__form .yon-form-grid .is-full { grid-column: 1 / -1; }
.pro-edit__actions {
  display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap;
  padding: 4px 2px 8px;
}
@media (max-width: 980px) {
  .pro-edit__layout { grid-template-columns: 1fr; }
  .pro-edit__nav {
    position: static; display: flex; gap: 6px; overflow-x: auto; padding: 8px;
  }
  .pro-edit__nav a { white-space: nowrap; }
  .pro-edit-cover__tools,
  .pro-edit-avatar { grid-template-columns: 1fr; }
  .pro-edit-cover__stage { min-height: 188px; }
  .pro-edit-cover__panel { padding: 18px 16px 72px; }
}

.pro--v6,
.pro--v4 {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  grid-template-areas:
    "hero hero"
    "col main";
  gap: 20px;
  align-items: start;
}
.pro--v6 > .pro-hero,
.pro--v4 > .pro-hero { grid-area: hero; }
.pro--v6 > .pro-col,
.pro--v4 > .pro-col { grid-area: col; margin-top: -72px; position: relative; z-index: 2; }
.pro--v6 > .pro-main,
.pro--v4 > .pro-main { grid-area: main; min-width: 0; }
.pro--v4 {
  gap: 16px;
}
.pro--v4 > .pro-col {
  margin-top: -78px;
  overflow: visible;
}
.pro--v4 .pro-card,
.pro--v4 .pro-id,
.pro--v4 .pro-block {
  border-radius: 14px;
  border-color: color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 35%, transparent), transparent 28%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.pro--v4 .pro-card h2,
.pro--v4 .pro-block h2 {
  font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--color-muted);
}
.pro--v4 .pro-id {
  overflow: visible;
  background:
    radial-gradient(180px 100px at 50% 0%, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 70%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 45%, transparent), var(--color-surface));
}
.pro--v4 .pro-id__avatar-wrap {
  width: 118px; height: 118px; margin: -62px auto 14px; padding: 4px;
  border-radius: 50%;
  background: linear-gradient(145deg, var(--color-primary), color-mix(in srgb, var(--color-primary-hover) 70%, #111));
  box-shadow:
    0 0 0 4px var(--color-surface),
    0 12px 28px color-mix(in srgb, #000 22%, transparent);
  z-index: 3;
}
.pro--v4 .pro-id__avatar-wrap.is-online {
  box-shadow:
    0 0 0 4px var(--color-surface),
    0 0 0 6px var(--color-success),
    0 12px 28px color-mix(in srgb, #000 22%, transparent);
}
.pro--v4 .pro-id__avatar {
  border: 3px solid var(--color-surface);
  box-sizing: border-box;
}
.pro--v4 .pro-id__name { font-size: 20px; letter-spacing: -.02em; }
.pro--v4 .pro-id__status {
  margin: 10px auto 0; width: fit-content; max-width: calc(100% - 28px);
  height: 28px; padding: 0 10px; border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
}
.pro--v4 .pro-id__status.is-on {
  border-color: color-mix(in srgb, #22c55e 30%, var(--color-border));
  background: color-mix(in srgb, #22c55e 10%, transparent);
  color: #86efac;
}
.pro--v4 .pro-id__stats {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px;
  margin: 14px 14px 0; padding-top: 14px; border-top: 1px solid var(--color-border);
}
.pro--v4 .pro-id__stats a {
  display: grid; gap: 2px; justify-items: center; padding: 8px 4px; border-radius: 11px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); transition: border-color .12s ease, transform .12s ease;
}
.pro--v4 .pro-id__stats a:hover {
  border-color: color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
  transform: translateY(-1px); color: var(--color-text);
}
.pro--v4 .pro-id__stats strong { font-size: 16px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.pro--v4 .pro-id__stats span { color: var(--color-muted); font-size: 11px; font-weight: 700; }
.pro--v4 .pro-id__cta {
  border-radius: 11px; min-height: 42px;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.pro--v4 .pro-id__cta--ghost { box-shadow: none; }
.pro--v4 .pro-find a {
  border-radius: 11px; min-height: 40px;
  background: color-mix(in srgb, var(--color-elevated) 60%, transparent);
}
.pro--v4 .pro-kvx li {
  padding: 9px 0;
}
.pro--v4 .pro-kvx .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.pro-col { display: grid; gap: 12px; }
.pro-card, .pro-id, .pro-block {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 12px;
}
.pro-card, .pro-block { padding: 16px 18px; }
.pro-card h2, .pro-block h2 {
  margin: 0 0 10px; font-size: 14px; font-weight: 700; letter-spacing: 0;
  text-transform: none; color: var(--color-text);
}
.pro-card__head, .pro-block__head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.pro-card__head h2, .pro-block__head h2 { margin: 0; }
.pro-card__head a, .pro-block__head a, .pro-block__head span { color: var(--color-muted); font-size: 13px; font-weight: 650; display: inline-flex; align-items: center; gap: 4px; }
.pro-card__sub { margin: 10px 0 8px; color: var(--color-muted); font-size: 13px; }
.pro-id {
  overflow: visible; padding: 0 0 16px;
  text-align: center;
}
.pro-id__avatar-wrap {
  width: 112px; height: 112px; margin: -56px auto 12px; border-radius: 50%;
  padding: 4px; background: var(--color-surface); position: relative;
  box-shadow: 0 0 0 3px var(--color-surface), 0 12px 28px color-mix(in srgb, #000 16%, transparent);
}
.pro-id__avatar-wrap.is-online { box-shadow: 0 0 0 3px var(--color-surface), 0 0 0 5px var(--color-success), 0 12px 28px color-mix(in srgb, #000 16%, transparent); }
.pro-id__avatar { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; background: var(--color-elevated); }
.pro-id__av-edit {
  position: absolute; right: 2px; bottom: 4px; width: 28px; height: 28px;
  display: grid; place-items: center; border-radius: 50%;
  background: var(--color-primary); color: #fff; box-shadow: 0 0 0 2px var(--color-surface);
}
.pro-id__who { padding: 0 14px; }
.pro-id__name {
  margin: 0; font-size: 18px; letter-spacing: -.01em;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap;
}
.pro-id__ok { color: var(--color-info, #38bdf8); font-style: normal; font-size: 13px; }
.pro-id__handle { margin: 4px 0 0; color: var(--color-muted); font-size: 13px; }
.pro-id__status {
  margin: 8px 0 0; color: var(--color-muted); font-size: 12.5px;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}
.pro-id__status.is-on { color: var(--color-success); font-weight: 650; }
.pro-id__title { margin: 8px 0 0; color: var(--color-text); font-size: 13px; font-weight: 650; }
.pro-id__roleline { margin: 4px 0 0; color: var(--color-muted); font-size: 12.5px; }
.pro-id .pro-ranks { justify-content: center; margin: 10px 0 0; gap: 6px; }
.pro-id__btns { display: grid; gap: 8px; padding: 14px 14px 0; }
.pro-id__cta {
  display: grid; place-items: center; min-height: 40px; padding: 9px 12px;
  background: var(--color-primary); color: #fff; border-radius: 10px;
  font-size: 13.5px; font-weight: 700; text-decoration: none; border: 0;
}
.pro-id__cta:hover { color: #fff; background: var(--color-primary-hover, var(--color-primary)); }
.pro-id__cta--ghost {
  background: var(--color-elevated); color: var(--color-text);
  border: 1px solid var(--color-border);
}
.pro-id__cta--ghost:hover { color: var(--color-text); background: var(--color-hover, var(--color-elevated)); border-color: var(--color-primary); }
.pro-id__actions {
  display: grid; gap: 8px;
  padding: 10px 14px 0;
}
.pro-id__actions form { margin: 0; display: grid; }
.pro-id__actions .nx-btn { width: 100%; padding-inline: 8px; }
.pro-id__more { font-size: 13px; text-align: left; }
.pro-id__more summary { cursor: pointer; color: var(--color-muted); font-weight: 650; }
.pro-id__more a, .pro-id__more button {
  display: block; width: 100%; text-align: left; background: none; border: 0;
  color: var(--color-text); padding: 7px 0; font: inherit; cursor: pointer;
}
.pro-main { display: grid; gap: 14px; min-width: 0; }
.pro-hero {
  position: relative; isolation: isolate; min-height: 248px; border-radius: 12px; overflow: hidden;
  border: 1px solid var(--color-border);
  background:
    linear-gradient(105deg, #0b1f3a 0%, #12355f 48%, #0a2748 100%);
}
.pro--v4 .pro-hero {
  min-height: 248px; border-radius: 16px;
  box-shadow: 0 18px 40px color-mix(in srgb, #000 22%, transparent);
}
.pro-hero__ribbon {
  position: absolute; left: 0; right: 0; top: 0; z-index: 3; height: 3px;
  background: linear-gradient(90deg, var(--color-primary), #38bdf8 40%, #34d399 75%, transparent);
  background-size: 200% 100%;
  animation: corp-ribbon 8s linear infinite;
}
.pro--v4 .pro-hero__panel {
  align-items: start;
  /* Keep brand/contact clear of the overlapping avatar column (300px + gap). */
  padding: 22px 28px 28px calc(300px + 16px + 12px);
  grid-template-columns: minmax(0, 1fr) minmax(220px, .72fr);
}
.pro--v4 .pro-hero__panel.is-solo {
  grid-template-columns: minmax(0, 1fr);
}
.pro--v4 .pro-hero__brand {
  display: grid; gap: 10px; align-content: start;
  justify-content: start;
  height: auto;
  padding-right: 16px;
  max-width: 520px;
}
.pro--v4 .pro-hero__eyebrow {
  display: inline-flex; width: fit-content;
  font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: color-mix(in srgb, #bfdbfe 85%, #fff);
}
.pro--v4 .pro-hero__title {
  display: block; margin: 0; max-width: 100%;
  font-size: clamp(26px, 3.4vw, 40px); line-height: 1.1; letter-spacing: -.03em;
  font-weight: 800; color: #fff;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  text-shadow: 0 2px 18px color-mix(in srgb, #000 45%, transparent);
}
.pro--v4 .pro-hero__meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px;
}
.pro--v4 .pro-hero__badge {
  display: inline-flex; align-items: center; max-width: 100%;
  padding: 7px 12px; border-radius: 999px;
  background: color-mix(in srgb, var(--color-primary) 88%, #fff);
  color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.pro--v4 .pro-hero__visits {
  display: inline-flex; align-items: center; gap: 6px; width: fit-content; margin-top: 0 !important;
  height: 30px; padding: 0 12px; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #fff 18%, transparent);
  background: color-mix(in srgb, #020617 45%, transparent);
  backdrop-filter: blur(8px);
}
.pro--v4 .pro-hero__contact {
  gap: 8px; align-content: start; padding-top: 4px;
}
.pro--v4 .pro-hero__row {
  min-height: 40px; padding: 8px 12px; border-radius: 11px;
  border: 1px solid color-mix(in srgb, #fff 14%, transparent);
  background: color-mix(in srgb, #020617 28%, transparent);
  backdrop-filter: blur(8px);
}
.pro--v4 .pro-hero__cam {
  border-radius: 12px; width: 40px; height: 40px;
}
.pro-hero.has-img {
  background-image: none;
  background-color: #0b1f3a;
}
.pro-hero.has-img::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background-image: var(--cover);
  background-size: cover; background-position: center;
}
.pro-hero__veil {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(90deg, color-mix(in srgb, #061628 72%, transparent), transparent 52%),
    linear-gradient(180deg, transparent 42%, color-mix(in srgb, #061628 78%, transparent));
}
.pro-hero.has-img .pro-hero__veil {
  background:
    linear-gradient(90deg, color-mix(in srgb, #061628 58%, transparent), transparent 56%),
    linear-gradient(180deg, transparent 36%, color-mix(in srgb, #061628 74%, transparent));
}
.pro-hero__panel {
  position: absolute; inset: 0; z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, .85fr);
  gap: 0;
  padding: 28px 36px 26px;
  align-items: stretch;
}
.pro-hero__panel.is-solo { grid-template-columns: 1fr; }
.pro-hero__brand {
  display: flex; flex-direction: column; justify-content: space-between;
  align-items: flex-start; min-width: 0; padding-right: 28px;
}
.pro-hero__badge {
  display: inline-flex; align-items: center; max-width: 100%;
  padding: 8px 14px; border-radius: 6px;
  background: var(--color-primary); color: #fff;
  font-size: 13px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pro-hero__visits {
  display: inline-flex; align-items: center; margin-top: auto;
  padding: 7px 14px; border-radius: 999px;
  background: color-mix(in srgb, #020617 58%, transparent); color: #e8eef7;
  font-size: 13px; font-weight: 700; backdrop-filter: blur(8px);
  border: 1px solid color-mix(in srgb, #93c5fd 28%, transparent);
}
.pro-hero__contact {
  display: grid; align-content: center; gap: 14px;
  padding-left: 28px;
  border-left: 1px solid color-mix(in srgb, #93c5fd 55%, transparent);
  min-width: 0;
}
.pro-hero__row {
  display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: center;
  color: #f1f5f9; text-decoration: none; font-size: 15px; font-weight: 600;
  letter-spacing: .01em; line-height: 1.25;
}
.pro-hero__row:hover { color: #fff; }
.pro-hero__row .yon-ico { color: #bfdbfe; flex: none; }
.pro-hero__row span {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pro-hero__cam {
  position: absolute; right: 16px; top: 16px; z-index: 3; width: 42px; height: 42px; border-radius: 50%;
  display: grid; place-items: center;
  background: color-mix(in srgb, #020617 48%, transparent); color: #fff;
  backdrop-filter: blur(8px);
}
.pro-hero__cam:hover { color: #fff; background: color-mix(in srgb, #020617 72%, transparent); }
.pro-dot {
  width: 8px; height: 8px; border-radius: 50%; background: var(--color-success);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-success) 22%, transparent);
}
.pro-dot.is-off {
  background: var(--color-muted);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-muted) 18%, transparent);
}
.pro-chip {
  display: inline-flex; align-items: center; padding: 4px 9px; border-radius: 999px;
  border: 1px solid var(--color-border); background: var(--color-elevated); color: var(--color-muted);
  font-size: 12px; font-weight: 650;
}
.pro-chip.is-online, .pro-chip--ok { color: #052e16; background: var(--color-success); border-color: var(--color-success); }
.pro-mini2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
  margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--color-border);
}
.pro-mini2 span { display: block; color: var(--color-muted); font-size: 12px; }
.pro-mini2 strong { display: block; font-size: 13px; font-weight: 650; margin-top: 3px; word-break: break-word; }
.pro-kvx { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.pro-kvx li {
  display: grid; grid-template-columns: 18px minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 10px; align-items: center;
  padding: 8px 0; border-bottom: 1px solid var(--color-border); font-size: 13px;
}
.pro-kvx li:last-child { border-bottom: 0; }
.pro-kvx .yon-ico { color: var(--color-muted); flex: none; }
.pro-kvx span { color: var(--color-muted); }
.pro-kvx b { font-weight: 650; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-find { display: grid; gap: 8px; }
.pro-find a {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 12px; border: 1px solid var(--color-border); border-radius: 10px;
  background: var(--color-surface); color: var(--color-muted); font-size: 13px; font-weight: 600;
}
.pro-find a:hover { color: var(--color-text); border-color: var(--color-primary); }
.pro-pulse {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px;
}
.pro-pulse > a, .pro-pulse > span {
  display: grid; gap: 4px; padding: 14px 12px; border-radius: 14px; text-align: center; justify-items: center;
  background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-muted); font-size: 12px;
  transition: border-color .12s ease, transform .12s ease, background .12s ease;
}
.pro-pulse > a:hover { border-color: var(--color-primary); color: var(--color-text); transform: translateY(-1px); }
.pro-pulse strong { color: var(--color-text); font-size: 1.35rem; letter-spacing: -.02em; }
.pro-pulse em { font-style: normal; font-size: 12px; color: inherit; }
.pro-pulse__ico {
  width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center;
  background: color-mix(in srgb, var(--pulse-accent, var(--color-primary)) 18%, var(--color-elevated));
  color: var(--pulse-accent, var(--color-primary));
  border: 1px solid color-mix(in srgb, var(--pulse-accent, var(--color-primary)) 28%, transparent);
  opacity: 1;
}
.pro-pulse .is-threads { --pulse-accent: var(--color-primary); }
.pro-pulse .is-posts { --pulse-accent: #38bdf8; }
.pro-pulse .is-likes { --pulse-accent: #f472b6; }
.pro-pulse .is-followers { --pulse-accent: #a78bfa; }
.pro-pulse .is-visits { --pulse-accent: #34d399; }
.pro-pulse .is-trade { --pulse-accent: #fbbf24; }
.pro--v4 .pro-pulse > a,
.pro--v4 .pro-pulse > span {
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--pulse-accent, var(--color-primary)) 10%, transparent), transparent 55%),
    color-mix(in srgb, var(--color-elevated) 45%, var(--color-surface));
}
.pro-block--note {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-warning, #f59e0b) 10%, var(--color-surface)), var(--color-surface));
}
.pro-note {
  margin: 0; padding: 14px 16px; border-radius: 10px;
  background: color-mix(in srgb, var(--color-warning, #f59e0b) 12%, var(--color-elevated));
  border: 1px dashed color-mix(in srgb, var(--color-warning, #f59e0b) 35%, var(--color-border));
  color: var(--color-text); font-size: 14px; line-height: 1.6;
}
.pro-kv { margin: 0; display: grid; gap: 0; }
.pro-kv > div {
  display: flex; justify-content: space-between; gap: 12px; align-items: baseline;
  padding: 8px 0; border-bottom: 1px solid var(--color-border); font-size: 13px;
}
.pro-kv > div:last-child { border-bottom: 0; }
.pro-kv dt { color: var(--color-muted); }
.pro-kv dd { margin: 0; font-weight: 650; text-align: right; }
.pro-about, .pro-sign { margin: 0; color: var(--color-text); font-size: 14px; line-height: 1.6; }
.pro-sign { padding: 12px 14px; border-left: 3px solid var(--color-primary); background: var(--color-elevated); border-radius: 0 10px 10px 0; }
.pro-tags, .pro-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.pro-ranks { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 10px 0 4px; }
.pro-ranks--card { justify-content: flex-start; margin: 0; display: grid; gap: 10px; }
.pro-rank { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: center; }
.pro-rank strong { display: block; font-size: 14px; }
.pro-rank small { display: block; color: var(--color-muted); font-size: 12.5px; }
.pro-badge {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border-radius: 10px;
  background: var(--color-elevated); border: 1px solid var(--color-border); font-size: 13px;
}
.pro-skills { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.pro-skills li { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; font-size: 13px; }
.pro-skills em { color: var(--color-muted); font-style: normal; }
.pro-skills i {
  grid-column: 1 / -1; display: block; height: 8px; border-radius: 999px;
  background: var(--color-elevated); overflow: hidden;
}
.pro-skills i::after {
  content: ""; display: block; width: var(--pct, 0%); height: 100%;
  background: linear-gradient(90deg, var(--color-primary), var(--accent-2));
}
.pro-people { display: grid; gap: 8px; }
.pro-people a { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; align-items: center; color: var(--color-text); font-size: 13px; }
.pro-people strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-people small { display: block; color: var(--color-muted); font-size: 12px; }
.pro-people__av { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: var(--color-elevated); font-size: 12px; font-weight: 700; }
.pro-visitors { display: grid; gap: 4px; }
.pro-visitors a {
  display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; align-items: center;
  color: var(--color-text); padding: 6px 4px; border-radius: 8px;
}
.pro-visitors a:hover { background: var(--color-elevated); }
.pro-visitors strong { font-size: 13px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13px; word-break: break-all; }
.pro-tabs {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
  gap: 0; margin: 0; position: relative;
  border: 1px solid var(--color-border); border-radius: 12px;
  background: var(--color-surface); overflow: visible;
}
.pro--v4 .pro-tabs {
  gap: 6px; padding: 8px;
  border-radius: 14px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 50%, transparent), transparent 70%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.pro-tabs > a {
  color: var(--color-muted); padding: 12px 8px; font-size: 13px; font-weight: 600;
  text-align: center; border-right: 1px solid var(--color-border); white-space: nowrap;
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
}
.pro--v4 .pro-tabs > a {
  border-right: 0; border-radius: 10px; padding: 10px 8px;
  transition: background .12s ease, color .12s ease;
}
.pro-tabs > a .yon-ico { opacity: .75; flex: none; }
.pro-tabs > a:hover { color: var(--color-text); }
.pro--v4 .pro-tabs > a:hover {
  background: color-mix(in srgb, var(--color-primary) 8%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}
.pro-tabs > a.is-active {
  color: var(--color-text); background: var(--color-elevated);
  box-shadow: inset 0 -2px 0 var(--color-primary);
}
.pro--v4 .pro-tabs > a.is-active {
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  box-shadow: none;
  border: 1px solid color-mix(in srgb, var(--color-primary) 26%, var(--color-border));
}
.pro-tabs > a.is-active .yon-ico { opacity: 1; color: var(--color-primary-ink, var(--color-primary)); }
.pro-tabs__more { position: relative; }
.pro--v4 .pro-tabs__more summary {
  border-radius: 10px; padding: 10px 14px;
}
.pro-tabs__more summary {
  list-style: none; padding: 12px 16px; cursor: pointer;
  color: var(--color-muted); font-size: 13px; font-weight: 600; white-space: nowrap;
}
.pro-tabs__more summary::-webkit-details-marker { display: none; }
.pro-tabs__more summary.is-active, .pro-tabs__more.is-open summary {
  color: var(--color-text); background: var(--color-elevated);
  box-shadow: inset 0 -2px 0 var(--color-primary);
}
.pro--v4 .pro-tabs__more summary.is-active,
.pro--v4 .pro-tabs__more.is-open summary {
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  box-shadow: none;
  border: 1px solid color-mix(in srgb, var(--color-primary) 26%, var(--color-border));
}
.pro-tabs__more div {
  position: absolute; right: 0; top: calc(100% + 4px); z-index: 12;
  min-width: 188px; display: grid; gap: 2px; padding: 6px;
  background: var(--color-surface); border: 1px solid var(--color-border);
  border-radius: 8px; box-shadow: var(--shadow-md);
}
.pro-tabs__more a {
  padding: 8px 10px; border: 0; border-radius: 6px; text-align: left; color: var(--color-text);
}
.pro-tabs__more a.is-active { color: var(--color-primary-ink, var(--color-primary)); background: var(--color-elevated); }
.pro-panel { display: grid; gap: 14px; min-width: 0; }
.pro-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0; }
.pro-kpi {
  padding: 16px; border: 1px solid var(--color-border); border-radius: 12px;
  background: var(--color-elevated); display: grid; gap: 4px;
}
.pro-kpi span, .pro-kpi small { color: var(--color-muted); font-size: 13px; }
.pro-kpi strong { font-size: 1.45rem; letter-spacing: -.02em; }
.pro-block { margin: 0; overflow: hidden; }
.pro-memo,
.pro-memo--v10 {
  margin: 16px 0 0 !important;
  border-radius: 16px !important;
  border: 1px solid color-mix(in srgb, #c4a574 40%, var(--color-border)) !important;
  background: linear-gradient(165deg, #f7eedc 0%, #efe4cc 48%, #e8d9b8 100%) !important;
  color: #3f3428 !important;
  overflow: hidden !important;
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 55%, transparent) inset,
    0 10px 28px color-mix(in srgb, #000 12%, transparent) !important;
}
.pro-memo__form { display: grid; gap: 0; margin: 0; }
.pro-memo__head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 12px 14px !important;
  border-bottom: 1px dashed color-mix(in srgb, #8b7355 40%, transparent) !important;
  background: color-mix(in srgb, #fff 28%, transparent);
}
.pro-memo__title {
  display: inline-flex; align-items: center; gap: 8px; min-width: 0;
}
.pro-memo__ico {
  display: grid; place-items: center;
  width: 28px; height: 28px; border-radius: 9px; flex: none;
  background: color-mix(in srgb, #c2410c 16%, #fff);
  color: #c2410c;
}
.pro-memo__title strong {
  margin: 0 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em;
  color: #2f281f !important;
}
.pro-memo__save {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 36px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: #c2410c !important;
  color: #fff !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  letter-spacing: .03em;
  text-transform: uppercase;
  cursor: pointer !important;
  box-shadow: 0 8px 18px color-mix(in srgb, #c2410c 28%, transparent);
  white-space: nowrap;
}
.pro-memo__save:hover { filter: brightness(1.06); color: #fff !important; }
.pro-memo__save-ico,
.pro-memo__save .yon-ico { color: #fff !important; flex: none; }
.pro-memo__label {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); border: 0;
}
.pro-memo__pad {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 148px !important;
  margin: 0 !important;
  padding: 16px 16px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  resize: vertical;
  background:
    repeating-linear-gradient(
      transparent,
      transparent 27px,
      color-mix(in srgb, #8b7355 20%, transparent) 28px
    ) !important;
  color: #3f3428 !important;
  font-size: 15px !important;
  line-height: 28px !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  outline: none !important;
  box-shadow: none !important;
}
.pro-memo__pad::placeholder {
  color: color-mix(in srgb, #3f3428 48%, transparent) !important;
  font-style: italic;
}
.pro-memo__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 14px 12px !important;
  font-size: 12px !important;
  font-weight: 650;
  color: color-mix(in srgb, #3f3428 62%, transparent) !important;
}
.pro-memo__count { font-variant-numeric: tabular-nums; opacity: .85; }
[data-theme="dark"] .pro-memo,
[data-theme="dark"] .pro-memo--v10 {
  background: linear-gradient(165deg, #2e2920 0%, #231f18 55%, #1b1813 100%) !important;
  border-color: color-mix(in srgb, #c4a574 32%, var(--color-border)) !important;
  color: #e8dcc6 !important;
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset,
    0 12px 28px color-mix(in srgb, #000 28%, transparent) !important;
}
[data-theme="dark"] .pro-memo__head {
  background: color-mix(in srgb, #c4a574 8%, transparent);
  border-bottom-color: color-mix(in srgb, #c4a574 28%, transparent) !important;
}
[data-theme="dark"] .pro-memo__ico {
  background: color-mix(in srgb, #c4a574 18%, transparent);
  color: #e8c48a;
}
[data-theme="dark"] .pro-memo__title strong { color: #f3e8d4 !important; }
[data-theme="dark"] .pro-memo__pad {
  background:
    repeating-linear-gradient(
      transparent,
      transparent 27px,
      color-mix(in srgb, #c4a574 18%, transparent) 28px
    ) !important;
  color: #e8dcc6 !important;
}
[data-theme="dark"] .pro-memo__pad::placeholder {
  color: color-mix(in srgb, #e8dcc6 42%, transparent) !important;
}
[data-theme="dark"] .pro-memo__foot {
  color: color-mix(in srgb, #e8dcc6 55%, transparent) !important;
}
@media (max-width: 560px) {
  .pro-memo__head { padding: 10px 12px !important; }
  .pro-memo__save { min-height: 34px !important; padding: 0 12px !important; font-size: 11.5px !important; }
  .pro-memo__pad { min-height: 128px !important; padding: 14px 12px 10px !important; }
}
.pro-rankline { margin: 0 0 10px; font-size: 14px; }
.pro-empty { padding: 36px 16px; text-align: center; color: var(--color-muted); display: grid; justify-items: center; gap: 10px; }
.pro-empty span { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: var(--color-elevated); color: var(--color-primary-ink, var(--color-primary)); font-size: 22px; }
.pro-empty p { margin: 0; max-width: 42ch; font-size: 14px; }
.pro .nx-muted { font-size: 13.5px; }
.pro .rank-bar { height: 9px; border-radius: 999px; background: var(--color-elevated); overflow: hidden; margin: 8px 0 4px; }
.pro-chart {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 8px;
  height: 180px; align-items: end; padding: 8px 2px 0;
}
.pro-chart__col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; gap: 6px; }
.pro-chart__bar {
  width: 100%; max-width: 18px; min-height: 4px;
  background: linear-gradient(180deg, var(--accent-2), var(--color-primary));
  border-radius: 6px 6px 2px 2px;
}
.pro-chart small { color: var(--color-muted); font-size: 10px; }
.nx-stats { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.rank-bar { height: 7px; border-radius: 999px; background: var(--color-elevated); overflow: hidden; margin: 8px 0 16px; }
.rank-bar > i { display: block; height: 100%; background: var(--color-primary); }
.rank-chip--9, .rank-chip--10 { background: var(--color-warning); color: #111; border: 0; }

.market-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.market-card { min-height: 180px; }
.chat-panel { padding: 0; }
.chat-list { display: grid; gap: 12px; padding: 16px; max-height: 62vh; overflow: auto; }
.chat-bubble { display: grid; grid-template-columns: 36px 1fr; gap: 10px; align-items: start; }
.chat-bubble.is-mine { grid-template-columns: 1fr 36px; }
.chat-bubble.is-mine .shell-avatar { order: 2; }
.chat-bubble.is-mine > div { order: 1; background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated)); border-radius: 14px 14px 4px 14px; padding: 10px 12px; }
.chat-bubble:not(.is-mine) > div { background: var(--color-elevated); border-radius: 14px 14px 14px 4px; padding: 10px 12px; }
.chat-form { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; padding: 12px 16px; border-top: 1px solid var(--color-border); }
.member-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.member-card { display: grid; justify-items: center; text-align: center; gap: 6px; padding: 18px 12px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); color: var(--color-text); }

.cmd-palette {
  width: min(680px, 92vw); border: 1px solid var(--color-border); border-radius: var(--radius-xl); padding: 0;
  background: var(--color-surface); color: var(--color-text); position: fixed; inset: 12vh auto auto 50%;
  transform: translateX(-50%); box-shadow: var(--shadow-lg);
}
.cmd-palette::backdrop { background: rgba(8,10,14,.45); }
.cmd-palette input { width: 100%; border: 0; background: transparent; color: var(--color-text); padding: 16px; font-size: 16px; }
.cmd-palette__list { max-height: 420px; overflow: auto; }
.cmd-palette__group { padding: 8px 14px 4px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--color-muted); }
.cmd-palette__list a, .notify-drop a { display: grid; padding: 10px 14px; color: var(--color-text); border-top: 1px solid var(--color-border); }
.cmd-palette__list a.is-active, .cmd-palette__list a:hover { background: var(--color-elevated); }
.notify-wrap { position: relative; }
.mast-drop { position: relative; }
.mast-drop__panel {
  display: none; position: absolute; right: 0; top: calc(100% - 2px); width: min(380px, 94vw);
  background: var(--r10-dark-surface); border: 1px solid var(--r10-dark-border); border-radius: 12px;
  box-shadow: 0 12px 28px rgba(16, 18, 32, .28); z-index: 54; overflow: hidden;
  color: var(--r10-dark-text);
}
.mast-drop::after { content: ""; position: absolute; right: 0; top: 100%; width: 56px; height: 10px; }
.mast-drop:hover .mast-drop__panel, .mast-drop:focus-within .mast-drop__panel, .mast-drop.is-open .mast-drop__panel,
.notify-wrap:hover .mast-drop__panel, .notify-wrap:focus-within .mast-drop__panel, .notify-wrap.is-open .mast-drop__panel { display: block; }
.mast-drop__head {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  padding: 10px 14px; border-bottom: 1px solid var(--r10-dark-border); background: var(--r10-dark-bg);
}
.mast-drop__head strong { font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--r10-dark-text); }
.mast-drop__head a { font-size: 12px; font-weight: 700; color: var(--r10-primary); }
.mast-drop__head--notify {
  padding: 11px 12px 11px 14px;
  gap: 12px;
}
.mast-drop__head--notify strong {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .06em;
}
.notify-acts {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.notify-acts form { margin: 0; display: inline-flex; }
.notify-acts__btn {
  width: 30px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--r10-dark-border, var(--color-border)) 90%, transparent);
  background: color-mix(in srgb, var(--r10-dark-secondary, var(--color-surface)) 80%, transparent);
  color: var(--r10-dark-muted, var(--color-muted));
  cursor: pointer;
  text-decoration: none;
  padding: 0;
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.notify-acts__btn:hover {
  color: var(--r10-dark-text, var(--color-text));
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
}
.notify-acts--compact .notify-acts__btn {
  width: 28px;
  height: 28px;
  border-radius: 7px;
}
.notify__title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.notify__title-row h1 { margin: 0; }
.notify__title-row .notify-acts__btn {
  border-color: var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted);
}
.notify__title-row .notify-acts__btn:hover {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
}
.mast-drop__list { max-height: 360px; overflow: auto; }
.mast-drop__list .empty { margin: 0; padding: 18px 14px; color: var(--r10-dark-muted); font-size: 13px; }
.mast-drop__item {
  display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 10px 14px; color: var(--r10-dark-text); border-bottom: 1px solid var(--r10-dark-border);
}
.mast-drop__item:hover { background: var(--r10-dark-secondary); color: var(--r10-dark-text); }
.mast-drop__item.is-unread { box-shadow: inset 3px 0 0 var(--color-primary); }
.mast-drop__item img, .mast-drop__item span {
  width: 36px; height: 36px; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; background: var(--r10-dark-secondary); font-weight: 700;
}
.mast-drop__item strong { display: block; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mast-drop__item small { display: block; color: var(--r10-dark-muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mast-drop__item time { color: var(--r10-dark-muted); font-size: 11px; white-space: nowrap; }
.mast-drop__all {
  display: block; text-align: center; padding: 11px 14px; font-weight: 800; font-size: 12px;
  letter-spacing: .04em; text-transform: uppercase;
  background: var(--color-primary); color: #fff;
}
.mast-drop__all:hover { background: var(--color-primary-hover); color: #fff; }
.blog-list { display: grid; gap: 12px; padding: 16px; }
.blog-card { display: grid; gap: 8px; }
.blog-card time { color: var(--color-muted); font-size: 12px; }
.blog-card h2 { margin: 0; font-size: 18px; }
.blog-card p { margin: 0; color: var(--color-muted); }
.nx-toast { position: fixed; right: 16px; bottom: 80px; z-index: 60; }
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.acp-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 16px; }
.acp-tabs a { padding: 7px 12px; border-radius: 999px; border: 1px solid var(--color-border); color: var(--color-muted); }
.acp-tabs a.is-active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.acp-table, .acp-plugin-grid { display: grid; gap: 10px; }
.acp-rank-form, .acp-rankrow { display: grid; gap: 12px; }
.acp-rankrow {
  padding: 14px; border: 1px solid var(--color-border); border-radius: 12px;
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.acp-rankrow__preview { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.acp-rankrow__flags { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }
.acp-rankrow__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.acp-rank-forums {
  margin: 0; padding: 12px; border: 1px solid var(--color-border); border-radius: 10px;
}
.acp-rank-forums legend { padding: 0 6px; font-size: 12.5px; font-weight: 700; }
.acp-rank-forums__grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 6px 10px;
}
.yon-form-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) {
  .yon-form-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.acp-userrow, .acp-table__row {
  display: grid; grid-template-columns: 1.4fr .7fr .7fr auto; gap: 12px; align-items: center;
  padding: 12px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px;
}
.acp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 16px 0; }
.acp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.acp-nav {
  display: flex; gap: 6px; overflow: auto; padding: 10px 22px; border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
}
.acp-nav a { white-space: nowrap; color: var(--color-muted); padding: 6px 10px; border-radius: 8px; font-size: 13px; }
.acp-nav a.is-active { color: var(--color-text); background: var(--color-elevated); }

.trade-form { max-width: 760px; margin: 0 auto; padding: 22px; }
.trade-form h1 { margin: 0 0 16px; font-size: 1.35rem; }
.trade-form__crumb { margin: 0 0 10px; }
.trade-form__crumb a { color: var(--color-muted); font-size: 13px; }
.trade-form small { color: var(--color-muted); }
.trade-form__warn { margin: 4px 0 0; text-align: center; color: var(--color-muted); font-size: 13px; }
.trade-ov {
  display: grid; gap: 14px; padding: 16px 16px 14px;
  border: 1px solid var(--color-border); border-radius: 18px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 8%, var(--color-surface)) 0 72px, var(--color-surface) 72px);
}
.trade-ov__head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.trade-ov__head h2 { margin: 0; font-size: 1.08rem; display: flex; align-items: center; gap: 8px; }
.trade-ov__head p { margin: 4px 0 0; color: var(--color-muted); font-size: 13px; }
.trade-ov__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.trade-trust {
  display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 800; letter-spacing: .02em; font-style: normal;
  border: 1px solid var(--color-border); color: var(--color-muted);
}
.trade-trust--trusted { color: var(--color-success); border-color: color-mix(in srgb, var(--color-success) 40%, var(--color-border)); }
.trade-trust--good { color: var(--color-primary-ink, var(--color-primary)); border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border)); }
.trade-trust--warn { color: var(--color-danger); border-color: color-mix(in srgb, var(--color-danger) 40%, var(--color-border)); }
.trade-trust--new, .trade-trust--mid { color: var(--color-text); }
.trade-ov__hero {
  display: grid; grid-template-columns: auto minmax(0, 1.1fr) minmax(180px, .9fr);
  gap: 16px; align-items: center; padding: 14px;
  border-radius: 14px; background: var(--color-elevated); border: 1px solid var(--color-border);
}
.trade-ov--card .trade-ov__hero {
  grid-template-columns: auto minmax(0, 1fr) minmax(160px, .85fr);
  gap: 14px;
}
.trade-ov--card .trade-ov__score strong { font-size: 1.55rem; }
.trade-ov--card .trade-tiles {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.trade-ov--card .trade-board {
  grid-template-columns: minmax(180px, .9fr) minmax(0, 1.3fr);
  align-items: start;
}
@media (max-width: 1180px) {
  .trade-ov--card .trade-board { grid-template-columns: 1fr; }
}
.trade-ring {
  --pct: 0; width: 92px; height: 92px; border-radius: 50%;
  background: conic-gradient(var(--color-success) calc(var(--pct) * 1%), color-mix(in srgb, var(--color-border) 80%, transparent) 0);
  display: grid; place-items: center; flex: 0 0 auto;
}
.trade-ring span {
  width: 70px; height: 70px; border-radius: 50%; background: var(--color-surface);
  display: grid; place-items: center; font-weight: 800; font-size: 1.08rem; letter-spacing: -.03em;
}
.trade-ov__score { display: grid; gap: 2px; min-width: 0; }
.trade-ov__score strong { font-size: 1.9rem; letter-spacing: -.04em; line-height: 1; }
.trade-ov__score em { font-style: normal; font-weight: 700; color: var(--color-text); }
.trade-ov__score small { color: var(--color-muted); font-size: 12px; }
.trade-ov__bar { margin: 8px 0 0; max-width: 240px; }
.trade-stack {
  display: flex; height: 8px; border-radius: 999px; overflow: hidden; margin-top: 10px; max-width: 240px;
  background: color-mix(in srgb, var(--color-border) 70%, transparent);
}
.trade-stack i { display: block; height: 100%; }
.trade-stack .is-pos { background: var(--color-success); }
.trade-stack .is-neu { background: var(--color-info, #38bdf8); }
.trade-stack .is-neg { background: var(--color-danger); }
.trade-ov__pills { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.trade-pill {
  display: grid; gap: 2px; justify-items: center; padding: 10px 6px;
  border-radius: 12px; border: 1px solid var(--color-border); background: var(--color-surface);
}
.trade-pill span { font-size: 11px; font-weight: 700; color: var(--color-muted); }
.trade-pill strong { font-size: 1.15rem; }
.trade-pill--pos { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-success) 28%, transparent); }
.trade-pill--pos span { color: var(--color-success); }
.trade-pill--neu { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-info, #38bdf8) 28%, transparent); }
.trade-pill--neu span { color: var(--color-info, #38bdf8); }
.trade-pill--neg { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-danger) 28%, transparent); }
.trade-pill--neg span { color: var(--color-danger); }
.trade-tiles {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px;
}
.trade-ov:not(.trade-ov--card) .trade-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.trade-tiles div {
  padding: 10px 12px; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-elevated); display: grid; gap: 2px;
}
.trade-tiles span { color: var(--color-muted); font-size: 11px; font-weight: 700; }
.trade-tiles strong { font-size: 1.05rem; }
.trade-ov__list-head {
  margin: 2px 0 0; font-size: 12px; font-weight: 700; color: var(--color-muted);
  letter-spacing: .04em; text-transform: uppercase;
  display: flex; justify-content: space-between; align-items: center;
}
.trade-ov__list-head a { font-size: 12px; letter-spacing: 0; text-transform: none; }
.trade-empty {
  padding: 18px 14px; border-radius: 14px; border: 1px dashed var(--color-border);
  background: var(--color-elevated); display: grid; gap: 8px; justify-items: start;
}
.trade-empty p { margin: 0; color: var(--color-text); font-weight: 650; }
.trade-empty ul { margin: 0; padding-left: 18px; color: var(--color-muted); font-size: 13px; display: grid; gap: 4px; }
.trade-board {
  display: grid; grid-template-columns: minmax(200px, .85fr) minmax(0, 1.4fr);
  gap: 14px; padding: 12px 14px; border: 1px solid var(--color-border);
  border-radius: 14px; background: var(--color-elevated);
}
.trade-kv { margin: 0; display: grid; gap: 8px; }
.trade-kv div { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; }
.trade-kv dt { color: var(--color-muted); }
.trade-kv dd { margin: 0; font-weight: 700; }
.trade-periods { display: flex; gap: 10px; margin: 0 0 10px; }
.trade-periods button {
  border: 0; background: transparent; color: var(--color-muted); font: inherit; font-size: 12px; font-weight: 700;
  padding: 4px 0; cursor: pointer; border-bottom: 2px solid transparent;
}
.trade-periods button.is-on { color: var(--color-primary-ink, var(--color-primary)); border-bottom-color: var(--color-primary); }
.trade-period { display: none; gap: 8px; }
.trade-period.is-on { display: grid; }
.trade-meter { display: grid; grid-template-columns: 78px minmax(0, 1fr) 28px; gap: 8px; align-items: center; font-size: 12px; }
.trade-meter em { font-style: normal; color: var(--color-muted); text-align: right; }
.trade-meter__track { height: 8px; border-radius: 999px; background: color-mix(in srgb, var(--color-border) 80%, transparent); overflow: hidden; }
.trade-meter__track i { display: block; height: 100%; border-radius: inherit; background: var(--color-muted); }
.trade-meter__lab--pos { color: var(--color-success); }
.trade-meter__lab--neu { color: var(--color-info, #7dd3fc); }
.trade-meter__lab--neg { color: var(--color-danger); }
.trade-meter:has(.trade-meter__lab--pos) .trade-meter__track i { background: var(--color-success); }
.trade-meter:has(.trade-meter__lab--neu) .trade-meter__track i { background: var(--color-info, #38bdf8); }
.trade-meter:has(.trade-meter__lab--neg) .trade-meter__track i { background: var(--color-danger); }
.trade-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.trade-filters a {
  padding: 6px 10px; border-radius: 999px; border: 1px solid var(--color-border);
  color: var(--color-muted); font-size: 12px; font-weight: 650;
}
.trade-filters a.is-on { color: var(--color-text); background: var(--color-elevated); border-color: var(--color-primary); }
.trade-filters__sep { width: 1px; height: 16px; background: var(--color-border); }
.trade-list { display: grid; gap: 8px; }
.trade-row {
  display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 10px 12px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-elevated);
}
.trade-row__av, img.trade-row__av {
  width: 36px; height: 36px; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; background: var(--color-surface); font-weight: 700; font-size: 13px;
}
.trade-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 4px; vertical-align: middle; background: var(--color-muted); }
.trade-dot--pos { background: var(--color-success); }
.trade-dot--neu { background: var(--color-info, #38bdf8); }
.trade-dot--neg { background: var(--color-danger); }
.trade-tag {
  display: inline-flex; padding: 1px 7px; border-radius: 999px; font-size: 10px; font-weight: 800;
  border: 1px solid var(--color-border);
}
.trade-tag--pos { color: var(--color-success); }
.trade-tag--neu { color: var(--color-info, #38bdf8); }
.trade-tag--neg { color: var(--color-danger); }
.trade-row__body { display: grid; gap: 3px; min-width: 0; }
.trade-row__body strong { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trade-row__body small, .trade-row__body p { margin: 0; color: var(--color-muted); font-size: 12px; }
.trade-row__url { font-size: 12px; }
.trade-row__meta { display: grid; justify-items: end; gap: 4px; font-size: 12px; color: var(--color-muted); }
.trade-row__meta form { display: inline; }
.trade-row__act {
  width: 22px; height: 22px; border-radius: 6px; border: 1px solid var(--color-border);
  background: transparent; color: var(--color-muted); cursor: pointer;
}

.nx-auth-body, .nx-install-body { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: var(--color-background); }
.nx-auth-shell, .nx-install { width: min(440px, 100%); }
.nx-auth-card { margin-top: 18px; }
.nx-logo { display: flex; gap: 10px; align-items: center; color: var(--color-text); font-weight: 700; }
.error-page { max-width: 520px; margin: 48px auto; text-align: center; padding: 32px; }
.error-page h1 { margin: 0 0 8px; font-size: 2rem; }
.skel { background: linear-gradient(90deg, var(--color-elevated), var(--color-border), var(--color-elevated)); background-size: 200% 100%; animation: skel 1.2s linear infinite; border-radius: 8px; height: 14px; }
@keyframes skel { to { background-position: -200% 0; } }

.shell-body { margin: 0; min-height: 100vh; background: var(--color-background); }
.drawer-bg { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 45; }

@media (max-width: 1280px) {
  .menubar__link, .menubar__drop > button { padding: 13px 10px; font-size: 12.5px; }
}
@media (max-width: 1100px) {
  .theme-bar__label span { display: none; }
  .post { grid-template-columns: 168px minmax(0, 1fr); }
  .thread-meta--v7 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .thread-meta--v7 > div { border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
  .thread-meta--v7 > div:nth-child(3n) { border-right: 0; }
  .thread-meta--v7 > div:nth-last-child(-n+3) { border-bottom: 0; }
}
@media (max-width: 1199px) {
  .rail-right, .home-grid, .acct-dash__grid, .app-footer__grid { grid-template-columns: 1fr; }
  .site-foot__metrics { grid-template-columns: 1fr 1fr; }
  .site-foot__metric:nth-child(2n) { border-right: 0; }
  .site-foot__metric:nth-child(-n+2) { border-bottom: 1px solid var(--foot-line); }
  .site-foot__billboard { grid-template-columns: 1fr; }
  .site-foot__billboard-copy { border-right: 0; border-bottom: 1px solid var(--foot-line); }
  .site-foot__corp,
  .site-foot__corp--v2,
  .site-foot__corp--v3,
  .site-foot__corp--v4 { grid-template-columns: 1fr; }
  .site-foot__corp > * { border-right: 0; border-bottom: 0; }
  .site-foot__corp > *:nth-child(2n) { border-left: 0; }
  .site-foot__corp-about { grid-column: auto; border-right: 0; border-bottom: 0; }
  .site-foot__corp-body { grid-template-columns: 1fr; }
  .site-foot__corp-navs { grid-template-columns: 1fr 1fr; }
  .site-foot__col:nth-child(2) { border-right: 1px solid var(--foot-line); }
  .site-foot__col.is-policy { grid-column: 1 / -1; }
  .site-foot__col:last-child { border-right: 1px solid var(--foot-line); }
  .site-foot__trust--bar,
  .site-foot__trust--pills { grid-template-columns: 1fr 1fr; }
  .site-foot__trust--bar .site-foot__chip:nth-child(2n) { border-right: 0; }
  .site-foot__trust--bar .site-foot__chip:nth-child(-n+2) { border-bottom: 1px solid var(--foot-line); }
  .site-foot__corp-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .site-foot__panel--mail { grid-template-columns: 1fr; }
  .site-foot__mail-grid { grid-template-columns: 1fr 1fr; }
  .site-foot__mail:nth-child(2n) { border-right: 1px solid var(--foot-line); }
  .site-foot__mail:nth-child(-n+2) { border-bottom: 0; }
  .site-foot__mast { flex-wrap: wrap; }
  .home-side { display: none; }
  .pro-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pro-pulse { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .trade-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .shop-grid { grid-template-columns: 1fr 1fr; }
  .yon-mark-mobile,
  .yon-mark-mobile--v10,
  .nx-ad--mobile { display: none !important; }
}
@media (max-width: 980px) {
  .acct__hello { display: none; }
  .theme-switch-host--mast { display: flex; align-items: center; }
  .mast:has(.acct) .theme-switch-host--mast { display: none !important; }
  .mast-search--desk { display: none !important; }
  .mast-center { display: none !important; }
  .mast-search--mob {
    display: grid; place-items: center; justify-self: end;
    width: 38px; height: 38px; border-radius: 11px; color: var(--mast-link-hover);
    background: transparent;
  }
  .mast-search--mob:hover { background: var(--mast-link-bg); }
  .mast__inner,
  .mast__inner--rich { grid-template-columns: auto 1fr auto; gap: 8px; padding: 4px 0; min-height: 60px; }
  .mast-tools { padding: 2px; border-radius: 12px; }
  .menu-btn { display: inline-grid; }
  .apps-wrap { display: none; }
  .topbar__split { display: none; }
  .mast .nx-btn--ghost { display: none; }
  .mast-brand__text strong { font-size: 13px; }
  .shop-hero, .dash-head { flex-direction: column; }
  .shop-hero__meta { justify-items: start; text-align: left; }
  .shop-grid, .cp-kpis, .cp-cards, .cp-cards--3 { grid-template-columns: 1fr; }




  .yon-mark-dock { display: block; padding: 0 12px; }
  .menubar__end {
    display: flex; width: 100%; margin-left: 0; margin-top: 10px;
    padding: 14px 4px 4px; border-top: 1px solid var(--color-border);
  }
  .menubar .theme-bar {
    width: 100%; justify-content: space-between; padding: 8px 4px;
  }
  .acct__panel {
    position: fixed; top: 64px; left: auto; right: 8px; width: min(328px, calc(100vw - 16px)); padding-top: 0;
  }
  .acct__pass {
    max-height: min(78vh, calc(100vh - 80px));
  }
  .acct__scroll { max-height: 240px; }
  .acct__list span { overflow-wrap: anywhere; white-space: normal; }
  .acct__meta { margin: 0 10px 10px; }
  .acct__gear { display: none; }
  .yon-form-grid { grid-template-columns: 1fr; }
  .cp { grid-template-columns: 1fr; }
  .cp-nav { position: static; max-height: none; }
  .cp-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cp-split, .cp-kpis--rich { grid-template-columns: 1fr; }
  .cp-hero { padding: 16px; }
  .cp-form__grid, .cp-form__grid--3 { grid-template-columns: 1fr; }
  .cp-rowline { grid-template-columns: 1fr; gap: 6px; }
  .cp-slug { flex-wrap: wrap; }
  .cp-slug em { width: 100%; border-right: 0; border-bottom: 1px solid var(--color-border); justify-content: start; }
  .cp-block-row { flex-direction: column; align-items: stretch; }
  .cp-form__actions .nx-btn { flex: 1; justify-content: center; }
  .cp-board__cols { display: none; }
  .cp-row { grid-template-columns: 36px minmax(0, 1fr) auto; }
  .cp-row time { display: none; }
  .cp-row b { display: none; }
  .cp-kpis, .cp-cards, .cp-cards--3 { grid-template-columns: 1fr 1fr; }




  .app-frame, .app-frame.has-rail { grid-template-columns: 1fr; width: calc(100% - 24px); }
  .drawer-bg {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(16, 18, 32, .52);
    z-index: 190;
    -webkit-tap-highlight-color: transparent;
    opacity: 0;
    transition: opacity .22s ease;
  }
  .drawer-bg.is-on { display: block; opacity: 1; }
  .menubar {
    display: flex;
    flex-direction: column;
    visibility: hidden;
    pointer-events: none;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 200;
    width: min(320px, calc(100vw - 48px));
    max-width: 100%;
    margin: 0;
    padding: 0 0 env(safe-area-inset-bottom, 0);
    padding-left: env(safe-area-inset-left, 0);
    background: var(--color-surface);
    border: 0;
    border-right: 1px solid var(--color-border);
    box-shadow: 16px 0 48px rgba(16, 18, 32, .35);
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    transform: translateX(-104%);
    transition: transform .28s cubic-bezier(.22, 1, .36, 1), visibility 0s linear .28s;
    will-change: transform;
  }
  .menubar.is-open {
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition: transform .28s cubic-bezier(.22, 1, .36, 1), visibility 0s linear 0s;
  }
  .menubar__drawer-head {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    position: sticky; top: 0; z-index: 2;
    margin: 0; padding: 12px 12px 12px max(12px, env(safe-area-inset-left, 0px));
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    flex: none;
  }
  .menubar__drawer-brand {
    display: flex; align-items: center; gap: 10px; min-width: 0;
  }
  .menubar__drawer-logo {
    height: 28px; width: auto; max-width: 120px; object-fit: contain; display: block;
  }
  .menubar__drawer-mark {
    flex: none; width: 34px; height: 34px; border-radius: 10px;
    display: grid; place-items: center;
    background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 55%, #111));
    color: #fff; font-size: 14px; font-weight: 850;
  }
  .menubar__drawer-titles { min-width: 0; display: grid; gap: 1px; }
  .menubar__drawer-titles strong {
    font-size: 14px; font-weight: 800; letter-spacing: -.02em;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .menubar__drawer-titles small {
    font-size: 11px; font-weight: 650; color: var(--color-muted);
  }
  .menubar__close {
    width: 36px; height: 36px; border-radius: 10px; border: 1px solid var(--color-border);
    background: var(--color-elevated); color: var(--color-text);
    display: grid; place-items: center; cursor: pointer; flex: none;
  }
  .menubar__close:hover { background: var(--color-hover); }
  .menubar__inner { width: auto; display: grid; padding: 10px 12px 16px; flex: 1; min-height: 0; }
  .menubar__links { display: grid; overflow: visible; gap: 4px; }
  .menubar__menu { position: static; box-shadow: none; border: 0; }
  .menubar--v10.is-open,
  .menubar--v11.is-open {
    background: var(--color-surface);
  }
  .menubar--v10 .menubar__inner--v10 { width: auto; display: grid; gap: 14px; padding: 10px 12px 16px; min-height: 0; }
  .menubar--v10 .menubar__links { display: grid; gap: 4px; }
  .menubar--v10 .menubar__link,
  .menubar--v10 .menubar__drop > button.menubar__link {
    width: 100%; justify-content: flex-start; min-height: 44px; border-radius: 12px;
  }
  .menubar--v10 .menubar__drop { width: 100%; }
  .menubar--v10 .menubar__menu,
  .menubar--v11 .menubar__menu--v11 {
    position: static !important;
    display: none !important;
    box-shadow: none !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 12px !important;
    padding: 0 !important;
    background: color-mix(in srgb, var(--color-elevated) 45%, transparent) !important;
    min-width: 0 !important;
    margin: 4px 0 8px;
  }
  .menubar--v10 .menubar__drop.is-open > .menubar__menu,
  .menubar--v11 .menubar__drop.is-open > .menubar__menu--v11 {
    display: grid !important;
  }
  .menubar--v10 .menubar__drop.is-open > button,
  .menubar--v11 .menubar__drop.is-open > button {
    border-color: color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
    background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  }
  .menubar--v11 .menubar__menu-grid { grid-template-columns: 1fr !important; }
  .menubar--v10 .menubar__end--v10 {
    margin: 4px 0 0; flex-wrap: wrap; justify-content: flex-start; gap: 8px;
    padding-top: 12px; border-top: 1px solid var(--color-border);
  }
  .menubar--v10 .menubar__chip span { display: inline; }
  .menubar--v10 .menubar__chip { width: auto; padding: 0 12px; min-height: 36px; }
  .menubar--v10 .theme-bar {
    width: 100%; justify-content: space-between; padding: 8px 10px; margin-top: 4px;
  }
  .menubar--v10 .theme-bar__label span { display: inline; }
  body.rail-open {
    overflow: hidden;
    touch-action: none;
  }
  body.rail-open .mast,
  body.rail-open .nxs-top,
  body.rail-open .nxs,
  body.rail-open .yon-mark-mobile,
  body.rail-open .dock,
  body.rail-open .fab {
    pointer-events: none;
  }
  body.rail-open .nxs-x { visibility: hidden; }
  .yon-mark-mobile,
  .yon-mark-mobile--v10,
  .nx-ad--mobile {
    display: none !important;
  }
  .dock { display: flex; }
  .fab { display: grid; }
  .app-frame { padding-bottom: 72px; }
  .app-footer { padding-bottom: 64px; }
  .yon-post { grid-template-columns: 1fr; }
  .yon-post__author { grid-auto-flow: column; grid-template-columns: auto 1fr; border-right: 0; border-bottom: 1px solid var(--color-border); }
  .post {
    grid-template-columns: 1fr;
    grid-template-areas:
      "bar"
      "user"
      "body"
      "react"
      "foot";
  }
  .post__aside {
    grid-template-columns: auto minmax(0, 1fr); justify-items: start; text-align: left;
    border-right: 0; border-bottom: 1px solid var(--color-border); gap: 12px 14px;
  }
  .post__id { justify-items: start; text-align: left; }
  .post__name, .post__chips { justify-content: flex-start; }
  .post__ranks { justify-content: flex-start; }
  .post__stats-toggle { display: block; grid-column: 1 / -1; }
  .post__stats, .post__pager { display: none; grid-column: 1 / -1; }
  .post.is-stats .post__stats { display: grid; }
  .post.is-stats .post__pager { display: flex; }
  .thread-head { flex-direction: column; }
  .thread-head--v4,
  .thread-head--v5,
  .thread-head--v6,
  .thread-head--v7 {
    grid-template-columns: 1fr; gap: 0; padding: 0;
  }
  .thread-head--v7 .thread-head__row {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 14px;
  }
  .thread-head--v7 .thread-head__op { justify-self: start; min-width: 0; }
  .thread-meta--v7 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0 12px;
    gap: 0;
  }
  .thread-meta--v7 > div {
    border-right: 0;
    border-bottom: 1px solid var(--color-border);
  }
  .thread-meta--v7 > div:nth-child(odd) {
    border-right: 1px solid var(--color-border);
  }
  .thread-meta--v7 > div:nth-last-child(-n+2) { border-bottom: 0; }
  .thread-head--v7 > .thread-head__tip { padding: 10px 14px 12px; }
  .thread-dock--v7,
  .thread-dock:not(.thread-dock--v10) {
    position: static; top: auto;
    flex-direction: column; align-items: stretch;
  }
  .thread-dock--v10 {
    position: sticky !important;
    top: 0 !important;
    flex-direction: row;
    align-items: center;
  }
  .thread-dock__tools .th-btn { flex: 1 1 calc(50% - 4px); justify-content: center; }
  .thread-dock__tools { width: 100%; }
  .thread-dock--v10 .thread-dock__tools { width: auto; flex: 1 1 auto; justify-content: flex-end; }
  .thread-head--v4 .thread-head__tools {
    flex-direction: row; flex-wrap: wrap; min-width: 0;
  }
  .thread-head--v4 .thread-head__tools .nx-btn,
  .thread-head__tools--v5 .th-btn { width: auto; flex: 1 1 calc(50% - 4px); }
  .thread-head--v5 h1 { max-width: none; }
  .thread-jump { display: none; }
  .post--v4,
  .post--v5,
  .post--v6,
  .post--v7,
  .post--v10 { grid-template-columns: 1fr; }
  .post--v5,
  .post--v6,
  .post--v7,
  .post--v10 {
    grid-template-areas:
      "bar"
      "user"
      "body"
      "react";
    grid-template-rows: auto;
  }
  .post--v5 .post__aside,
  .post--v6 .post__aside,
  .post--v7 .post__aside,
  .post--v10 .post__aside { border-right: 0; border-bottom: 1px solid var(--color-border); min-height: 0; height: auto; }
  .post--v5 .post__foot,
  .post--v6 .post__foot,
  .post--v7 .post__foot,
  .post--v10 .post__foot { margin-left: 0; width: 100%; }
  .post--v5 .post__kpis,
  .post--v6 .post__kpis,
  .post--v7 .post__kpis,
  .post--v10 .post__kpis { max-width: 320px; margin-top: 0; }
  .post--v10 .post__bar { flex-wrap: wrap; }
  .post--v10 .post__likers { white-space: normal; }

  /* �� post-list v10 mobile polish �� */
  .app-frame:has(.yon-thread--v10) {
    width: min(100% - 16px, 1560px);
  }
  .yon-thread--v10 { gap: 12px; max-width: none; }
  .post-list--v10 { gap: 12px; }
  .yon-thread--v10 .post--v10 {
    --post-aside: 0px;
    grid-template-columns: 1fr;
    grid-template-areas:
      "bar"
      "user"
      "body"
      "react";
    background: var(--color-surface);
    border-radius: 14px;
    overflow: visible;
  }
  .yon-thread--v10 .post--v10 .post__aside {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: start;
    justify-items: start;
    text-align: left;
    padding: 12px;
    gap: 6px 12px;
    background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  }
  .yon-thread--v10 .post--v10 .post__avatar {
    grid-column: 1; grid-row: 1;
    position: relative; width: 52px; height: 52px; flex: none;
  }
  .yon-thread--v10 .post--v10 .post__id {
    grid-column: 2; grid-row: 1;
    justify-items: start; text-align: left; width: auto; min-width: 0;
  }
  .yon-thread--v10 .post--v10 .post__ava,
  .yon-thread--v10 .post--v10 img.post__ava {
    width: 52px; height: 52px; font-size: 18px;
    box-shadow: none;
  }
  .yon-thread--v10 .post--v10 .post__name { justify-content: flex-start; }
  .yon-thread--v10 .post--v10 .post__name a { font-size: 14px; }
  .yon-thread--v10 .post--v10 .post__handle { margin: 2px 0 0; font-size: 11.5px; }
  .yon-thread--v10 .post--v10 .post__title { -webkit-line-clamp: 1; text-align: left; }
  .yon-thread--v10 .post--v10 .post__chips {
    justify-content: flex-start; margin-top: 2px;
  }
  .yon-thread--v10 .post--v10 .post__joined {
    white-space: normal; text-align: left;
  }
  .yon-thread--v10 .post--v10 .post__ranks,
  .yon-thread--v10 .post--v10 .post__badges,
  .yon-thread--v10 .post--v10 .post__kpis,
  .yon-thread--v10 .post--v10 .post__stats-toggle,
  .yon-thread--v10 .post--v10 .post__stats,
  .yon-thread--v10 .post--v10 .post__pager {
    grid-column: 1 / -1;
  }
  .yon-thread--v10 .post--v10 .post__ranks {
    flex-direction: row; flex-wrap: wrap;
    justify-content: flex-start; align-items: center; gap: 6px;
    overflow: visible;
  }
  .yon-thread--v10 .post--v10 .rank-mark,
  .yon-thread--v10 .post--v10 .rank-mark--post { width: auto; max-width: 42%; }
  .yon-thread--v10 .post--v10 .post__badges {
    display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-start;
  }
  .yon-thread--v10 .post--v10 .post__kpis {
    max-width: none; width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .yon-thread--v10 .post--v10 .post__kpis span { padding: 8px 4px; }
  .yon-thread--v10 .post--v10 .post__kpis b { font-size: 13px; }
  .yon-thread--v10 .post--v10 .post__bar {
    flex-wrap: wrap; gap: 8px; padding: 8px 12px; min-height: 0;
  }
  .yon-thread--v10 .post--v10 .post__bar-right {
    flex-wrap: wrap; justify-content: flex-start; flex: 1 1 auto; gap: 6px;
    width: 100%;
  }
  .yon-thread--v10 .post--v10 .post__when { flex: 1 1 100%; }
  .yon-thread--v10 .post--v10 .post-rate { order: 1; }
  .yon-thread--v10 .post--v10 .post__num { order: 2; min-width: 36px; height: 30px; }
  .yon-thread--v10 .post--v10 .post-tool { width: 30px; height: 30px; min-width: 30px; }
  .yon-thread--v10 .post--v10 .post__content {
    padding: 14px 14px 12px; min-height: 0; font-size: 15px; line-height: 1.65;
  }
  .yon-thread--v10 .post--v10 .post__sig { margin: 0 14px 12px; }
  .yon-thread--v10 .post--v10 .post__react {
    padding: 10px 12px 12px; gap: 8px;
  }
  .yon-thread--v10 .post--v10 .post__likers {
    flex: 1 1 100%; white-space: normal;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  }
  .yon-thread--v10 .post--v10 .post__foot {
    width: 100%; gap: 6px; justify-content: stretch;
  }
  .yon-thread--v10 .post--v10 .post-like,
  .yon-thread--v10 .post--v10 .post-act {
    min-height: 34px; font-size: 12px; padding: 0 10px;
  }
  .yon-thread--v10 .post--v10 .post-menu {
    right: 0; left: auto; max-width: min(92vw, 280px);
  }
  .yon-thread--v10 .thread-jump--v7 { display: none; }
  .yon-thread--v10 .post-reply--v7 { border-radius: 12px; }
  .feed__row, .feed.hide-counts .feed__row, .feed.hide-last .feed__row, .feed.hide-forum .feed__row,
  .feed.hide-counts.hide-last .feed__row, .feed.hide-counts.hide-forum .feed__row,
  .feed.hide-last.hide-forum .feed__row, .feed.hide-counts.hide-last.hide-forum .feed__row {
    grid-template-columns: 1fr auto; padding: 12px 14px;
  }
  .yon-profile__layout, .pro, .pro--v6, .pro--v4, .pro-kpis, .stat-grid, .trend-grid, .acp-grid, .acp-userrow, .trade-board, .trade-ov__hero, .trade-row { grid-template-columns: 1fr; }
  .pro--v6, .pro--v4 { grid-template-areas: "hero" "col" "main"; }
  .pro--v6 > .pro-col, .pro--v4 > .pro-col { margin-top: -52px; overflow: visible; }
  .pro-pulse { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pro-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pro--v4 .pro-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; }
  .pro-tabs > a span { display: none; }
  .pro-hero { min-height: 200px; }
  .pro--v4 .pro-hero { min-height: 200px; }
  .pro--v4 .pro-hero__title { font-size: clamp(22px, 6vw, 30px); white-space: normal; }
  .pro--v4 .pro-hero__panel,
  .pro--v4 .pro-hero__panel.is-solo {
    grid-template-columns: 1fr; gap: 14px; padding: 18px 16px 72px;
  }
  .pro-hero__panel {
    grid-template-columns: 1fr; gap: 16px; padding: 20px 18px 18px;
  }
  .pro-hero__brand { padding-right: 0; gap: 14px; }
  .pro-hero__contact {
    border-left: 0; padding-left: 0; padding-top: 14px;
    border-top: 1px solid color-mix(in srgb, #93c5fd 45%, transparent);
    gap: 12px;
  }
  .pro-hero__row { font-size: 14px; }
  .trade-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trade-ov--card .trade-ov__hero { grid-template-columns: auto minmax(0, 1fr); }
  .trade-ov--card .trade-ov__pills { grid-column: 1 / -1; }
  .pro-chart { height: 140px; }
  .hero, .acct-dash__hero { flex-direction: column; align-items: flex-start; }
  .feed__head { display: none; }
  .feed__row, .feed.hide-counts .feed__row, .feed.hide-last .feed__row, .feed.hide-forum .feed__row,
  .feed.hide-counts.hide-last .feed__row, .feed.hide-counts.hide-forum .feed__row,
  .feed.hide-last.hide-forum .feed__row, .feed.hide-counts.hide-last.hide-forum .feed__row {
    grid-template-columns: 1fr auto; padding: 12px 14px;
  }
  .feed__counts, .feed__forum { display: none !important; }
  .feed__last { text-align: right; }
  .feed--v10 .feed__row,
  .feed--v10.hide-counts .feed__row,
  .feed--v10.hide-last .feed__row,
  .feed--v10.hide-forum .feed__row,
  .feed--v10.hide-counts.hide-last .feed__row,
  .feed--v10.hide-counts.hide-forum .feed__row,
  .feed--v10.hide-last.hide-forum .feed__row,
  .feed--v10.hide-counts.hide-last.hide-forum .feed__row {
    grid-template-columns: 18px minmax(0, 1fr) auto;
    grid-template-areas:
      "st topic nums"
      ". last nums";
    gap: 4px 10px;
    padding: 12px;
    min-height: 0;
    align-items: start;
  }
  .feed--v10 .feed__status { grid-area: st; padding-top: 8px; }
  .feed--v10 .feed__topic { grid-area: topic; }
  .feed--v10 .feed__last { grid-area: last; }
  .feed--v10 .feed__num--replies,
  .feed--v10 .feed__num--views { grid-area: nums; }
  .feed--v10 .feed__custom-btn span { display: none; }
  .feed--v10 .feed__more { width: 100%; }

  /* feed--v11 wins over generic .feed mobile (1fr auto) */
  .feed.feed--v11 .feed__row,
  .feed.feed--v11.hide-counts .feed__row,
  .feed.feed--v11.hide-last .feed__row,
  .feed.feed--v11.hide-forum .feed__row,
  .feed.feed--v11.hide-counts.hide-last .feed__row,
  .feed.feed--v11.hide-counts.hide-forum .feed__row,
  .feed.feed--v11.hide-last.hide-forum .feed__row,
  .feed.feed--v11.hide-counts.hide-last.hide-forum .feed__row {
    grid-template-columns: 14px minmax(0, 1fr);
    grid-template-areas:
      "st topic"
      ". last"
      ". stats";
    gap: 6px 8px;
    padding: 11px 10px;
    min-height: 0;
    align-items: start;
  }
  .feed.feed--v11 .feed__status { grid-area: st; align-self: start; padding-top: 10px; }
  .feed.feed--v11 .feed__topic { grid-area: topic; }
  .feed.feed--v11 .feed__last { grid-area: last; text-align: left; white-space: normal; overflow: visible; }
  .feed.feed--v11 .feed__stats {
    grid-area: stats;
    display: flex;
    justify-content: flex-start;
    gap: 8px;
    padding-top: 2px;
  }
  .feed.feed--v11 .feed__num--replies,
  .feed.feed--v11 .feed__num--views { grid-area: unset; }
  .feed.feed--v11.hide-last .feed__row {
    grid-template-areas:
      "st topic"
      ". stats";
  }
  .feed.feed--v11.hide-counts .feed__row {
    grid-template-areas:
      "st topic"
      ". last";
  }
  .feed.feed--v11.hide-counts.hide-last .feed__row {
    grid-template-areas: "st topic";
  }
  .feed.feed--v11 .feed__custom-btn span { display: none; }
  .feed.feed--v11 .feed__more { width: 100%; }

  /* feed--v12 wins over generic .feed mobile (1fr auto) */
  .feed.feed--v12 .feed__row,
  .feed.feed--v12.hide-counts .feed__row,
  .feed.feed--v12.hide-last .feed__row,
  .feed.feed--v12.hide-forum .feed__row,
  .feed.feed--v12.hide-counts.hide-last .feed__row,
  .feed.feed--v12.hide-counts.hide-forum .feed__row,
  .feed.feed--v12.hide-last.hide-forum .feed__row,
  .feed.feed--v12.hide-counts.hide-last.hide-forum .feed__row {
    grid-template-columns: 12px minmax(0, 1fr) auto;
    grid-template-areas:
      "st topic stats"
      ". last  stats";
    gap: 5px 10px;
    padding: 11px 10px;
    min-height: 0;
    align-items: start;
  }
  .feed.feed--v12 .feed__status { grid-area: st; align-self: start; padding-top: 11px; }
  .feed.feed--v12 .feed__topic { grid-area: topic; }
  .feed.feed--v12 .feed__last { grid-area: last; text-align: left; white-space: normal; overflow: visible; }
  .feed.feed--v12 .feed__stats {
    grid-area: stats;
    display: flex;
    flex-direction: column;
    align-self: stretch;
    justify-content: center;
    align-items: stretch;
    gap: 5px;
    min-width: 52px;
  }
  .feed.feed--v12 .feed__num--replies,
  .feed.feed--v12 .feed__num--views { grid-area: unset; }
  .feed.feed--v12.hide-last .feed__row {
    grid-template-columns: 12px minmax(0, 1fr) auto;
    grid-template-areas: "st topic stats";
    align-items: center;
  }
  .feed.feed--v12.hide-counts .feed__row {
    grid-template-columns: 12px minmax(0, 1fr);
    grid-template-areas:
      "st topic"
      ". last";
  }
  .feed.feed--v12.hide-counts.hide-last .feed__row {
    grid-template-columns: 12px minmax(0, 1fr);
    grid-template-areas: "st topic";
  }
  .feed.feed--v12 .feed__custom-btn span { display: none; }
  .feed.feed--v12 .feed__more { width: 100%; }
}
@media (max-width: 767px) {
  .forum-card { grid-template-columns: 1fr; }
  .post__ava, img.post__ava { width: 56px; height: 56px; font-size: 18px; }
  .yon-thread--v10 .post--v10 .post__ava,
  .yon-thread--v10 .post--v10 img.post__ava,
  .yon-thread--v10 .post--v10 .post__avatar {
    width: 48px; height: 48px; font-size: 16px;
  }
  .yon-thread--v10 .post--v10 .post__aside {
    grid-template-columns: 48px minmax(0, 1fr);
    padding: 10px;
  }
  .yon-thread--v10 .post--v10 .post-stars i { font-size: 12px; }
  .yon-thread--v10 .post--v10 .post__content { padding: 12px; font-size: 14.5px; }
  .yon-thread--v10 .th-btn { flex: 1 1 calc(50% - 4px); justify-content: center; }
  .post__foot { justify-content: flex-start; }
  .post__foot .post-act--main { flex: 1; }
  .post-rate .post-tool__txt { display: none; }
  .post__content { padding: 12px 14px; }
  .post__bar { padding: 6px 10px; }
  .verify-bar__inner { flex-direction: column; align-items: flex-start; padding: 10px 0; }
  .verify-bar .nx-btn { width: 100%; }
  .shop-grid, .cp-kpis, .cp-cards, .cp-cards--3 { grid-template-columns: 1fr; }




  .mast-brand__text small { display: none; }
  .acct__hero {
    grid-template-columns: 48px minmax(0, 1fr) 30px; gap: 8px; padding: 14px 10px 10px;
  }
  .acct__avring { width: 48px; height: 48px; }
  .acct__who > strong { font-size: 13.5px; }
  .acct__visit { font-size: 10.5px; flex-wrap: wrap; }
  .acct__list a { padding: 8px 10px; font-size: 12px; }
  .acct__tabs button { height: 32px; font-size: 11.5px; }
  .acct__foot { gap: 6px; padding: 0 10px 10px; }
  .acct__foot a { min-height: 34px; font-size: 11.5px; padding: 0 8px; }
  .acct__pass {
    max-height: min(76vh, calc(100vh - 72px));
  }
  .acct__meta { grid-template-columns: repeat(3, 1fr); }
  .acct__meta a { padding: 7px 3px; font-size: 10px; }
  .acct__meta strong { font-size: 13px; }
  .acct__quick { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; padding: 0 8px 8px; }
  .acct__quick a { padding: 7px 2px; font-size: 9.5px; }
  .app-footer { padding-bottom: 112px; }
  .apps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-foot__inner { width: min(1440px, calc(100% - 24px)); padding-top: 20px; }
  .site-foot__live { flex-wrap: wrap; }
  .site-foot__online-btn { width: 100%; }
  .site-foot__metrics { grid-template-columns: 1fr 1fr; }
  .site-foot__panel--mail { grid-template-columns: 1fr; }
  .site-foot__mail-grid { grid-template-columns: 1fr; padding: 10px; gap: 8px; }
  .site-foot__mail { border-right: 1px solid var(--foot-line); border-bottom: 0; min-height: 76px; }
  .site-foot__mail:last-child { border-bottom: 0; }
  .site-foot__mail-head-main small { white-space: normal; }
  .site-foot__copy,
  .site-foot__copy--v4 { grid-template-columns: 1fr auto; gap: 10px; }
  .site-foot__copy nav,
  .site-foot__copy-nav { grid-column: 1 / -1; justify-content: flex-start; }
  .site-foot__copy-text small { white-space: normal; }
  .site-foot__top span { display: none; }
  .site-foot__top { width: 36px; height: 36px; padding: 0; justify-content: center; }
  .site-foot__brand-text small { white-space: normal; }
  .site-foot__corp,
  .site-foot__corp--v2,
  .site-foot__corp--v3,
  .site-foot__corp--v4 { grid-template-columns: 1fr; }
  .site-foot__corp > *:nth-child(2n) { border-left: 0; }
  .site-foot__corp-shell { padding: 12px; gap: 10px; }
  .site-foot__corp-navs { grid-template-columns: 1fr; }
  .site-foot__col { border-right: 1px solid var(--foot-line); }
  .site-foot__col:last-child { border-right: 1px solid var(--foot-line); }
  .site-foot__col.is-policy { grid-column: auto; border-top: 0; }
  .site-foot__trust--bar,
  .site-foot__trust--pills { grid-template-columns: 1fr; }
  .site-foot__trust--bar .site-foot__chip { border-right: 0; border-bottom: 1px solid var(--foot-line); }
  .site-foot__trust--bar .site-foot__chip:last-child { border-bottom: 0; }
  .site-foot__trust--tiles { grid-template-columns: 1fr 1fr; }
  .site-foot__corp-top-meta { width: 100%; }
  .site-foot__corp-stats { grid-template-columns: 1fr; }
  .foot-sponsor.has-logo img { min-height: 96px; padding: 16px; }
  .online-page__head { align-items: flex-start; }
}
@media (max-width: 420px) {
  .acct__foot { grid-template-columns: 1fr; }
  .acct__who > em { font-size: 11px; }
  .theme-bar__label span { display: none; }
}

:where([data-theme="light"]) :where(h1, h2, h3) { color: var(--color-text); }
[data-theme="light"] .nx-muted,
[data-theme="light"] .forum-card p,
[data-theme="light"] .meta-row { color: var(--color-muted); }
:where([data-theme="light"]) :where(time) { color: var(--color-muted); }
[data-theme="light"] .nx-form label { color: var(--color-text-secondary); }
[data-theme="light"] .nx-form input:focus,
[data-theme="light"] .nx-form select:focus,
[data-theme="light"] .nx-form textarea:focus,
[data-theme="light"] .nx-search input:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-focus-ring);
}
[data-theme="light"] .nx-btn {
  background: var(--btn-primary-bg);
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .nx-btn:hover { background: var(--color-primary-hover); color: var(--color-on-primary, #fff); }
[data-theme="light"] .nx-btn:active { background: var(--color-primary-active); }
[data-theme="light"] .nx-btn--ghost {
  background: var(--color-surface); color: #334155;
  border-color: var(--color-border-dark, var(--color-border)); box-shadow: none;
}
[data-theme="light"] .nx-btn--ghost:hover { background: var(--color-hover); color: var(--color-text); }
[data-theme="light"] .nx-btn--ghost:active { background: var(--color-active); }
[data-theme="light"] .nx-btn:disabled,
[data-theme="light"] .nx-btn.is-disabled,
[data-theme="light"] .nx-btn[aria-disabled="true"] {
  background: var(--color-surface-2); color: var(--color-disabled);
  border: 1px solid var(--color-border-soft); box-shadow: none; opacity: 1;
}
[data-theme="light"] .nx-form input:hover,
[data-theme="light"] .nx-form select:hover,
[data-theme="light"] .nx-form textarea:hover,
[data-theme="light"] .nx-search input:hover {
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--color-border-dark, var(--color-border)));
}
[data-theme="light"] .mast .nx-btn--ghost {
  background: transparent;
  border-color: var(--header-line);
  color: var(--mast-link-hover);
}
[data-theme="light"] .mast .nx-btn--ghost:hover {
  background: var(--mast-link-bg);
  color: var(--mast-link-hover);
}
[data-theme="light"] .topbar__mark,
[data-theme="light"] .nx-logo__mark,
[data-theme="light"] .shell-brand__mark {
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .mast__promo {
  background: color-mix(in srgb, var(--color-primary) 16%, var(--mast-nav));
  color: var(--mast-link);
}
[data-theme="light"] .verify-bar { background: var(--color-soft-warning); color: var(--color-warning-strong); }
[data-theme="light"] .feed__tab:hover { background: var(--color-hover); }
[data-theme="light"] .feed__tab.is-on {
  background: var(--color-active); color: var(--color-primary-ink, var(--color-primary));
  border-color: var(--color-brand-border, var(--color-border));
}
[data-theme="light"] .feed__head { background: var(--color-elevated); }
[data-theme="light"] .feed__row { border-bottom-color: var(--color-border-soft); }
[data-theme="light"] .feed__row:hover { background: var(--color-hover); }
[data-theme="light"] .post { background: var(--post-bg); border-color: var(--color-border); }
[data-theme="light"] .post:hover { background: var(--post-hover); }
[data-theme="light"] .post__aside { background: var(--color-elevated); }
[data-theme="light"] .post__bar, [data-theme="light"] .post__react { background: var(--color-elevated); }
/* R10 v11 posts keep dark bar — do not wash with elevated */
[data-theme="light"] .yon-thread--v11 .post__bar {
  background: var(--nx-catbar, #2f3345);
  color: rgba(255, 255, 255, 0.78);
}
/* light R10 aside tokens live in theme-balance.css */
[data-theme="light"] .yon-thread--v11 .post__react { background: var(--color-bg-tertiary); }
[data-theme="light"] .post__bar .post__like,
[data-theme="light"] .post__react [data-react="like"] { color: var(--color-primary-ink, var(--color-primary)); }
[data-theme="light"] .post__bar .post__quote,
[data-theme="light"] .post__react [data-react="quote"] { color: var(--color-text-secondary); }
[data-theme="light"] .post__bar .post__reply,
[data-theme="light"] .post-reply { color: var(--color-primary-ink, var(--color-primary)); }
[data-theme="light"] .post__bar .post-rpt__btn,
[data-theme="light"] .post__bar [data-report] { color: var(--color-danger); }
[data-theme="light"] .yon-thread--v11 .post__bar .post-rpt__btn { color: #fff; }
[data-theme="light"] .cp-nav {
  background: var(--color-surface);
  border-color: var(--color-border);
  color: var(--color-text);
}
[data-theme="light"] .cp-nav__head {
  background: var(--color-elevated);
  color: var(--color-text-secondary);
}
[data-theme="light"] .cp-nav__link:hover { background: var(--color-hover); color: var(--color-text); }
[data-theme="light"] .cp-nav__link.is-on {
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}
[data-theme="light"] .badge--pin {
  background: var(--color-soft-primary); color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
}
[data-theme="light"] .badge--lock {
  background: var(--color-soft-warning); color: var(--color-warning-strong, var(--color-warning));
  border-color: color-mix(in srgb, var(--color-warning) 28%, var(--color-border));
}
[data-theme="light"] .badge--hot {
  background: var(--color-soft-danger); color: var(--color-danger);
  border-color: color-mix(in srgb, var(--color-danger) 28%, var(--color-border));
}
[data-theme="light"] .badge--ok,
[data-theme="light"] .yon-badge.is-online,
[data-theme="light"] .pro-chip.is-online,
[data-theme="light"] .pro-chip--ok {
  color: var(--success-text, #18865A); background: var(--color-soft-success);
  border-color: #BFE8D2;
}
[data-theme="light"] .trade-chip--trusted {
  color: var(--color-info); background: var(--color-soft-info);
  border-color: color-mix(in srgb, var(--color-info) 28%, var(--color-border));
}
[data-theme="light"] .trade-chip--pro {
  color: var(--color-warning-strong, var(--color-warning)); background: var(--color-soft-warning);
  border-color: color-mix(in srgb, var(--color-warning) 28%, var(--color-border));
}
[data-theme="light"] .trade-chip--corporate {
  color: var(--color-premium); background: var(--color-soft-premium);
  border-color: color-mix(in srgb, var(--color-premium) 28%, var(--color-border));
}
[data-theme="light"] .trade-chip--elite {
  color: var(--color-danger); background: var(--color-soft-danger);
  border-color: color-mix(in srgb, var(--color-danger) 28%, var(--color-border));
}
[data-theme="light"] .pro-id__cover-edit {
  background: var(--color-overlay); color: #fff;
}
[data-theme="light"] .acp-nav a:hover,
[data-theme="light"] .acp-tabs a:hover { background: var(--color-hover); color: var(--color-text); }
[data-theme="light"] .acp-nav a.is-active {
  background: var(--color-active); color: var(--color-primary-ink, var(--color-primary));
}
[data-theme="light"] .yon-pager a {
  background: var(--color-surface);
  border-color: var(--color-border);
  color: var(--color-text-secondary);
}
[data-theme="light"] .yon-pager a:hover { background: var(--color-hover); color: var(--color-text); }
[data-theme="light"] .yon-pager a.is-active {
  background: var(--color-primary); color: #fff; border-color: var(--color-primary);
}
[data-theme="light"] .forum-card:hover,
[data-theme="light"] .trend-card:hover,
[data-theme="light"] .market-card:hover,
[data-theme="light"] .thread-row:hover { background: var(--color-hover); }
[data-theme="light"] .nx-card,
[data-theme="light"] .panel,
[data-theme="light"] .stat-card,
[data-theme="light"] .feed,
[data-theme="light"] .forum-card,
[data-theme="light"] .trend-card,
[data-theme="light"] .market-card,
[data-theme="light"] .user-card,
[data-theme="light"] .cp-board,
[data-theme="light"] .apps-sheet,
[data-theme="light"] .auth-modal__sheet {
  background: var(--color-surface);
  border-color: var(--color-border);
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .auth-modal__sheet,
[data-theme="light"] .apps-sheet {
  box-shadow: var(--shadow-md);
}
[data-theme="light"] .auth-modal::backdrop,
[data-theme="light"] .feed-modal--v10::backdrop,
[data-theme="light"] .drawer-bg {
  background: var(--color-overlay);
}
[data-theme="light"] .app-footer {
  background: transparent; border-top: 0;
}
[data-theme="light"] .site-foot,
[data-theme="light"] .site-foot--v12 {
  --sf12-card: #ffffff;
  --sf12-line: #e3eaf0;
  --sf12-inset: none;
  background:
    radial-gradient(720px 180px at 12% -8%, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 62%),
    linear-gradient(180deg, #eef2f6, var(--color-bg));
  color: var(--color-text-muted);
  border-top: 1px solid var(--color-border);
}
[data-theme="light"] .menubar--v10 {
  background: var(--mast-nav);
  border-top-color: var(--header-line);
  color: var(--mast-link);
}
[data-theme="light"] .menubar__inner--v10 {
  color: var(--mast-link);
}
[data-theme="light"] .mast__top--v10 {
  background: var(--mast-bg);
  color: var(--mast-link-hover);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
[data-theme="light"] .menubar__link:hover,
[data-theme="light"] .menubar__drop:hover > button,
[data-theme="light"] .menubar__drop:focus-within > button,
[data-theme="light"] .menubar__drop.is-open > button {
  background: var(--mast-link-bg);
  color: var(--mast-link-hover);
}
[data-theme="light"] .menubar__link.is-active {
  background: var(--mast-active-bg, rgba(47, 128, 201, .14));
  color: var(--mast-link-hover);
  box-shadow: inset 0 -2px 0 var(--color-primary);
}
[data-theme="light"] .acct__list a:hover { background: var(--color-hover); }
[data-theme="light"] .acct__pass,
[data-theme="light"] .acct--v10 .acct__pass {
  background: var(--color-surface);
  color: var(--color-text);
}
[data-theme="light"] .acct__scroll,
[data-theme="light"] .acct--v10 .acct__scroll { background: var(--color-elevated); }
[data-theme="light"] .acct__foot a:not(.is-invite) { background: var(--color-elevated); }
[data-theme="light"] .mast .acct--v10 .acct__trigger:hover,
[data-theme="light"] .mast .acct--v10.is-open .acct__trigger,
[data-theme="light"] .mast .acct--v10.is-pinned .acct__trigger {
  background: var(--mast-link-bg);
  border-color: var(--header-line);
}
[data-theme="light"] .mast .acct--v10 .acct__hello small,
[data-theme="light"] .mast .acct--v10 .acct__gear {
  color: var(--mast-link);
  background: var(--mast-link-bg);
}
[data-theme="light"] .mast .acct--v10 .acct__hello strong {
  color: var(--mast-link-hover);
}
[data-theme="light"] .menubar__menu a:hover { background: var(--r10-dark-secondary); color: var(--r10-dark-text); }
[data-theme="light"] .mast-drop__item:hover { background: var(--r10-dark-secondary); }
[data-theme="light"] .post-menu a:hover,
[data-theme="light"] .post-menu button:hover { background: var(--color-hover); }
[data-theme="light"] .nx-iconbtn:hover,
[data-theme="light"] .icon-btn:hover { background: var(--color-hover); }
[data-theme="light"] .mast .mast-ico:hover,
[data-theme="light"] .mast .icon-btn.mast-ico:hover { background: var(--mast-link-bg); }
[data-theme="light"] .cp-board__cols { background: var(--color-elevated); }
[data-theme="light"] .acp-userrow:hover,
[data-theme="light"] .acp-table__row:hover { background: var(--color-hover); }
[data-theme="light"] .acp-table thead,
[data-theme="light"] .acp-table__head,
[data-theme="light"] table thead {
  background: var(--color-elevated);
}
[data-theme="light"] .shell-avatar,
[data-theme="light"] .yon-avatar {
  border-color: var(--color-border);
}

@media print {
  .mast, .menubar, .dock, .fab, .thread-jump, .quote-tray, .app-footer,
  .post__bar-right, .post__react, .post__foot, .post-reply, .thread-head__tools,
  .yon-mark, .mast__promo, .verify-bar { display: none !important; }
  .post { break-inside: avoid; box-shadow: none; grid-template-columns: 1fr; }
  .post__content { max-height: none; }
}

/* Auth + notifications v10 */
.auth10 {
  width: min(560px, 100%);
  margin: 0 auto 28px;
}
.auth10--register { width: min(720px, 100%); }
.auth10-card {
  margin-top: 14px;
  padding: 22px 22px 20px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  background: var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.auth10-card--wide { padding: 24px; }
.auth10-card__head {
  display: flex; align-items: flex-start; gap: 14px;
  margin: 0 0 18px;
}
.auth10-card__mark {
  display: grid; place-items: center;
  width: 48px; height: 48px; border-radius: 14px; flex: none;
  background: color-mix(in srgb, var(--color-primary) 22%, var(--color-elevated));
  border: 1px solid color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  color: #fff; font-size: 20px; font-weight: 800;
}
.auth10-card__head .kicker { margin: 0 0 4px; }
.auth10-card__head h1 { margin: 0; font-size: 24px; font-weight: 800; letter-spacing: -.02em; }
.auth10-card__head .nx-muted { margin: 6px 0 0; font-size: 13.5px; }
.auth10-form { display: grid; gap: 12px; }
.auth10-form--grid {
  grid-template-columns: 1fr 1fr;
  gap: 12px 14px;
}
.auth10-field { display: grid; gap: 6px; }
.auth10-field span {
  font-size: 12.5px; font-weight: 700; color: var(--color-text-secondary);
}
.auth10-field input {
  min-height: 44px; padding: 0 14px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  color: var(--color-text);
  font-size: 14px;
}
.auth10-field input:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--color-primary) 55%, var(--color-border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 18%, transparent);
}
.auth10-field input.is-invalid,
.auth10-field select.is-invalid,
.auth10-birth select.is-invalid {
  border-color: color-mix(in srgb, var(--color-danger) 55%, var(--color-border));
}
.auth10-alert[hidden] { display: none !important; }
.nx-err[hidden] { display: none !important; }
.auth10-field--full { grid-column: 1 / -1; }
.auth10--register { width: min(760px, 100%); }
.auth10-sec {
  margin: 0; padding: 14px 0 2px; border: 0;
  border-top: 1px solid var(--color-border);
}
.auth10-form > .auth10-sec:first-of-type { border-top: 0; padding-top: 0; }
.auth10-sec legend {
  padding: 0 0 10px; font-size: 12.5px; font-weight: 800;
  letter-spacing: .05em; text-transform: uppercase; color: var(--color-muted);
}
.auth10-birth {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px;
}
.auth10-birth select,
.auth10-field select,
.auth10-field textarea {
  width: 100%; min-height: 44px; padding: 0 12px;
  border-radius: 12px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  color: var(--color-text); font: inherit; font-size: 14px;
}
.auth10-field textarea {
  min-height: 110px; padding: 12px; resize: vertical; line-height: 1.45;
}
.auth10-field select:focus,
.auth10-field textarea:focus {
  outline: none;
  border-color: color-mix(in srgb, var(--color-primary) 55%, var(--color-border));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 18%, transparent);
}
.auth10-count {
  display: block; margin-top: 4px; text-align: right;
  font-size: 11.5px; font-style: normal; font-weight: 650; color: var(--color-muted);
}
.yon-chip--banned {
  display: inline-flex; align-items: center; gap: 5px;
  background: color-mix(in srgb, var(--color-danger) 88%, #111);
  border: 1px solid color-mix(in srgb, var(--color-danger) 40%, transparent);
  color: #fff;
}
.post__ban {
  display: grid; gap: 2px; margin: 6px 0 0; padding: 8px 10px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--color-danger) 16%, var(--color-surface));
  border: 1px solid color-mix(in srgb, var(--color-danger) 35%, var(--color-border));
  font-size: 11.5px; line-height: 1.35; color: var(--color-text);
}
.post__ban strong { color: var(--color-danger); font-size: 12px; }
.post__ban span, .post__ban em { color: var(--color-muted); font-style: normal; }
.pro-ban {
  display: grid; gap: 4px; margin-top: 10px; padding: 10px 12px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--color-danger) 14%, var(--color-surface));
  border: 1px solid color-mix(in srgb, var(--color-danger) 32%, var(--color-border));
  color: var(--color-text);
}
.pro-ban strong {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--color-danger); font-size: 13px;
}
.pro-ban p { margin: 0; font-size: 12.5px; }
.pro-ban small { color: var(--color-muted); font-size: 11.5px; }

.pro-hist {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 0;
  min-height: 280px;
  border: 1px solid color-mix(in srgb, var(--color-border) 85%, var(--color-primary));
  border-radius: 16px;
  overflow: hidden;
  background: color-mix(in srgb, var(--color-elevated) 55%, var(--color-surface));
}
.pro-hist__list {
  display: grid;
  gap: 12px;
  padding: 14px;
  align-content: start;
  border-right: 1px solid var(--color-border);
}
.pro-hist__side {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 40%, transparent), transparent 40%),
    color-mix(in srgb, var(--color-surface) 88%, #000);
  min-height: 100%;
}
.pro-hist__card {
  position: relative;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 70%, var(--color-surface));
  box-shadow: 0 8px 22px color-mix(in srgb, #000 18%, transparent);
}
.pro-hist__card::after {
  content: "";
  position: absolute;
  top: 18px; right: -7px;
  width: 12px; height: 12px;
  background: inherit;
  border-right: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  border-top: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  transform: rotate(45deg);
}
.pro-hist__card.is-active {
  border-color: color-mix(in srgb, var(--color-danger) 45%, var(--color-border));
}
.pro-hist__card h3 {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 750;
  color: var(--color-text);
}
.pro-hist__card p {
  margin: 0 0 4px;
  font-size: 12.5px;
  color: var(--color-muted);
}
.pro-hist__card p span { color: var(--color-text-secondary); }
.pro-hist__card p strong { color: var(--color-text); font-weight: 700; }
.pro-hist__meta { margin-top: 6px !important; font-size: 11.5px !important; }
.pro-hist__meta.is-on { color: var(--color-danger) !important; font-weight: 700; }
@media (max-width: 860px) {
  .pro-hist { grid-template-columns: 1fr; }
  .pro-hist__side { display: none; }
  .pro-hist__list { border-right: 0; }
  .pro-hist__card::after { display: none; }
}

.auth10-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  flex-wrap: wrap;
}
.auth10-check {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; color: var(--color-text-secondary);
  cursor: pointer;
}
.auth10-check input { width: 16px; height: 16px; accent-color: var(--color-primary); }
.auth10-link {
  font-size: 13px; font-weight: 700; color: var(--color-primary-ink, var(--color-primary)); text-decoration: none;
}
.auth10-link:hover { text-decoration: underline; }
.auth10-submit {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; width: 100%; padding: 0 16px;
  border: 0; border-radius: 12px;
  background: var(--color-primary); color: #fff;
  font-size: 14.5px; font-weight: 780; cursor: pointer;
}
.auth10-submit__ico {
  display: grid; place-items: center;
  width: 28px; height: 28px; border-radius: 8px;
  background: color-mix(in srgb, #000 18%, transparent);
}
.auth10-submit .yon-ico { color: #fff; }
.auth10-submit:hover { filter: brightness(1.06); }
.auth10-alert {
  padding: 10px 12px; border-radius: 12px;
  background: color-mix(in srgb, var(--color-danger) 16%, var(--color-surface));
  border: 1px solid color-mix(in srgb, var(--color-danger) 35%, var(--color-border));
  color: var(--color-text); font-size: 13.5px; font-weight: 650;
}
.auth10-foot {
  margin: 16px 0 0; text-align: center;
  font-size: 13.5px; color: var(--color-muted);
}
.auth10-foot a { color: var(--color-primary-ink, var(--color-primary)); font-weight: 750; text-decoration: none; }
.auth10-foot a:hover { text-decoration: underline; }

.auth-modal {
  padding: 0; border: 0; background: transparent;
  max-width: calc(100vw - 28px);
}
.auth-modal::backdrop {
  background: color-mix(in srgb, #12131c 72%, transparent);
  backdrop-filter: blur(4px);
}
.auth-modal__sheet {
  width: min(440px, 100%);
  margin: auto;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 28%, var(--color-surface));
  box-shadow: 0 28px 64px color-mix(in srgb, #000 48%, transparent);
  overflow: hidden;
}
.auth-modal__head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.auth-modal__brand {
  display: flex; align-items: center; gap: 12px; min-width: 0;
}
.auth-modal__mark {
  display: grid; place-items: center;
  width: 42px; height: 42px; border-radius: 12px; flex: none;
  background: color-mix(in srgb, var(--color-primary) 24%, var(--color-elevated));
  border: 1px solid color-mix(in srgb, var(--color-primary) 38%, var(--color-border));
  color: #fff; font-size: 18px; font-weight: 800;
}
.auth-modal__brand strong {
  display: block; font-size: 16px; font-weight: 800; color: var(--color-text);
}
.auth-modal__brand small {
  display: block; margin-top: 2px;
  font-size: 12.5px; color: var(--color-muted); font-weight: 600;
}
.auth-modal__close {
  width: 36px; height: 36px; border-radius: 10px; flex: none;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-muted); font-size: 22px; line-height: 1; cursor: pointer;
}
.auth-modal__close:hover {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
}
.auth-modal__body { padding: 16px 16px 18px; }
.auth-modal .auth10-form { gap: 11px; }
.auth-modal .auth10-foot { margin-top: 14px; }

.notify--v10 {
  width: min(980px, 100%);
  margin: 0 auto 28px;
}
.notify__head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 16px;
  margin: 12px 0 14px; flex-wrap: wrap;
}
.notify__head .kicker { margin: 0 0 4px; }
.notify__head h1 { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.notify__head .nx-muted { margin: 6px 0 0; max-width: 48ch; }
.notify__head-meta {
  display: flex; gap: 8px;
}
.notify__head-meta > div {
  min-width: 88px; padding: 10px 12px; border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 45%, transparent);
  text-align: center;
}
.notify__head-meta > div.is-hot {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-surface));
}
.notify__head-meta em {
  display: block; font-style: normal; font-size: 11px; font-weight: 700;
  color: var(--color-muted); text-transform: uppercase; letter-spacing: .04em;
}
.notify__head-meta strong {
  display: block; margin-top: 2px; font-size: 18px; font-weight: 800;
}
.notify__toolbar {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  margin: 0 0 10px; flex-wrap: wrap;
}
.notify__filters {
  display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 280px;
}
.notify__filter {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 34px; padding: 0 11px; border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
  color: var(--color-muted); font-size: 12.5px; font-weight: 700;
  text-decoration: none;
}
.notify__filter .yon-ico { opacity: .85; }
.notify__filter em {
  font-style: normal; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; display: inline-grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 22%, transparent);
  color: var(--color-text); font-size: 10.5px; font-weight: 800;
}
.notify__filter.is-on,
.notify__filter:hover {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-surface));
}
.notify__chip {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 34px; padding: 0 12px; border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--color-border) 85%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
  color: var(--color-text-secondary); font-size: 12.5px; font-weight: 700;
}
.notify__chip .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.notify__mark {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 36px; padding: 0 12px; border-radius: 10px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-text); font-size: 12.5px; font-weight: 700; cursor: pointer;
}
.notify__mark:hover {
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  color: var(--color-primary-ink, var(--color-primary));
}
.notify__legend {
  display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 0 0 12px;
  color: var(--color-muted); font-size: 11.5px; font-weight: 650;
}
.notify__legend span { display: inline-flex; align-items: center; gap: 5px; }
.notify__board {
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  background: var(--color-surface);
  overflow: hidden;
}
.notify__empty {
  display: grid; place-items: center; gap: 8px;
  padding: 48px 20px; text-align: center;
}
.notify__empty-ico {
  display: grid; place-items: center;
  width: 56px; height: 56px; border-radius: 16px; margin-bottom: 4px;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
}
.notify__empty-ico .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.notify__empty strong { font-size: 16px; }
.notify__empty p { margin: 0 0 8px; color: var(--color-muted); font-size: 13.5px; max-width: 340px; }
.notify__empty-samples {
  display: grid; gap: 6px; width: min(420px, 100%); margin: 4px 0 12px; text-align: left;
}
.notify__empty-samples span {
  display: block; padding: 8px 12px; border-radius: 10px;
  border: 1px dashed color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 35%, transparent);
  color: var(--color-muted); font-size: 12.5px; font-weight: 650;
}
.notify__list { display: grid; }
.notify__row {
  display: grid;
  grid-template-columns: 16px 34px 40px minmax(0, 1fr) auto 18px;
  align-items: center; gap: 10px 12px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-text); text-decoration: none;
  transition: background .12s ease;
}
.notify__row:last-child { border-bottom: 0; }
.notify__row:hover {
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
.notify__row.is-unread {
  background: color-mix(in srgb, var(--color-primary) 8%, transparent);
}
.notify__status {
  display: grid; place-items: center; color: var(--color-muted);
}
.notify__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.notify__type {
  width: 34px; height: 34px; border-radius: 11px;
  display: grid; place-items: center;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-muted);
}
.notify__row--rose .notify__type { color: #fb7185; border-color: color-mix(in srgb, #fb7185 35%, var(--color-border)); background: color-mix(in srgb, #fb7185 12%, transparent); }
.notify__row--blue .notify__type { color: #60a5fa; border-color: color-mix(in srgb, #60a5fa 35%, var(--color-border)); background: color-mix(in srgb, #60a5fa 12%, transparent); }
.notify__row--cyan .notify__type { color: #22d3ee; border-color: color-mix(in srgb, #22d3ee 35%, var(--color-border)); background: color-mix(in srgb, #22d3ee 12%, transparent); }
.notify__row--violet .notify__type { color: #a78bfa; border-color: color-mix(in srgb, #a78bfa 35%, var(--color-border)); background: color-mix(in srgb, #a78bfa 12%, transparent); }
.notify__row--green .notify__type { color: #4ade80; border-color: color-mix(in srgb, #4ade80 35%, var(--color-border)); background: color-mix(in srgb, #4ade80 12%, transparent); }
.notify__row--amber .notify__type { color: #fbbf24; border-color: color-mix(in srgb, #fbbf24 35%, var(--color-border)); background: color-mix(in srgb, #fbbf24 12%, transparent); }
.notify__row--orange .notify__type { color: #fb923c; border-color: color-mix(in srgb, #fb923c 35%, var(--color-border)); background: color-mix(in srgb, #fb923c 12%, transparent); }
.notify__row--indigo .notify__type { color: #818cf8; border-color: color-mix(in srgb, #818cf8 35%, var(--color-border)); background: color-mix(in srgb, #818cf8 12%, transparent); }
.notify__row--red .notify__type { color: #f87171; border-color: color-mix(in srgb, #f87171 35%, var(--color-border)); background: color-mix(in srgb, #f87171 12%, transparent); }
.notify__ava {
  width: 40px; height: 40px; border-radius: 12px; font-size: 14px;
  border: 2px solid color-mix(in srgb, var(--color-primary) 24%, var(--color-border));
}
.notify__body { min-width: 0; display: grid; gap: 2px; }
.notify__body strong {
  font-size: 14px; font-weight: 750;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.notify__body small {
  color: var(--color-muted); font-size: 12px; font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.notify__kind {
  font-style: normal; font-weight: 750;
  color: color-mix(in srgb, var(--color-text) 70%, var(--color-muted));
}
.notify__row time {
  font-size: 12px; font-weight: 650; color: var(--color-muted); white-space: nowrap;
}
.notify__go {
  color: var(--color-muted); font-size: 18px; font-weight: 700;
}
.mast-drop__kind {
  font-style: normal; font-weight: 750;
  color: color-mix(in srgb, var(--color-primary) 70%, var(--color-muted));
}
.mast-drop__ico {
  display: grid; place-items: center; width: 100%; height: 100%;
  font-weight: 800; font-size: 13px;
}

@media (max-width: 720px) {
  .auth10-form--grid { grid-template-columns: 1fr; }
  .auth10-birth { grid-template-columns: 1fr; }
  .auth10-card, .auth-modal__body { padding-left: 14px; padding-right: 14px; }
  .notify__row {
    grid-template-columns: 12px 30px 36px minmax(0, 1fr) 14px;
  }
  .notify__row time { display: none; }
  .notify__head-meta > div { min-width: 76px; padding: 8px 10px; }
  .notify__legend { display: none; }
}

.app-frame:has(.auth10),
.app-frame:has(.notify--v10) {
  width: min(1560px, calc(100% - 28px));
  margin-inline: auto;
}

/* Forum list v10 */
.forum-list--v10 {
  display: grid;
  gap: 16px;
  margin: 0 0 8px;
}
.fl10-group {
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  background: var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  overflow: hidden;
}
.fl10-group__bar {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 48%, transparent);
}
.fl10-group__title { min-width: 0; }
.fl10-group__title h2 {
  margin: 0; font-size: 15.5px; font-weight: 780; letter-spacing: -.01em;
  text-transform: none; color: var(--color-text);
}
.fl10-group__title p {
  margin: 4px 0 0; color: var(--color-muted); font-size: 12.5px; font-weight: 600;
}
.fl10-group__meta {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.fl10-group__meta span {
  display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px;
  border-radius: 999px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-muted); font-size: 11.5px; font-weight: 700;
}
.fl10-cols {
  display: grid;
  grid-template-columns: 28px 44px minmax(0, 1.5fr) 96px 68px 68px minmax(170px, 1fr) 22px;
  gap: 10px; align-items: center;
  padding: 8px 16px;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 28%, transparent);
  color: var(--color-muted); font-size: 11px; font-weight: 750;
  letter-spacing: .04em; text-transform: uppercase;
}
.fl10-cols__forum { grid-column: 1 / 4; padding-left: 4px; }
.fl10-cols__logo { text-align: center; }
.fl10-cols__num { text-align: center; flex-shrink: 0; }
.fl10-cols__last { text-align: right; }
.fl10-body { display: grid; }
.fl10-empty {
  padding: 28px 16px; text-align: center; color: var(--color-muted); font-size: 13.5px;
}
.fl10-row {
  display: grid;
  grid-template-columns: 28px 44px minmax(0, 1.5fr) 96px 68px 68px minmax(170px, 1fr) 22px;
  gap: 10px; align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid var(--color-border);
  transition: background .12s ease;
}
.fl10-row:last-child { border-bottom: 0; }
.fl10-row:hover {
  background: color-mix(in srgb, var(--color-elevated) 58%, transparent);
}
.fl10-row.is-fresh {
  box-shadow: inset 3px 0 0 var(--color-primary);
}
.fl10-row.is-hot:not(.fl10-row--announce) {
  background: color-mix(in srgb, var(--color-warning) 6%, transparent);
}
.fl10-row--announce {
  background: linear-gradient(90deg, var(--color-primary), var(--color-primary) 42%, var(--color-primary-active));
  border-bottom-color: color-mix(in srgb, #fff 12%, transparent);
  color: #fff;
}
.fl10-row--announce:hover { background: linear-gradient(90deg, var(--color-primary-active), var(--color-primary) 42%, #4c1d95); }
.fl10-row--announce .fl10-row__desc,
.fl10-row--announce .fl10-row__num em,
.fl10-row--announce .fl10-row__last-empty,
.fl10-row--announce time,
.fl10-row--announce .fl10-row__go { color: color-mix(in srgb, #fff 72%, transparent); }
.fl10-row--announce .fl10-row__title strong,
.fl10-row--announce .fl10-row__num b,
.fl10-row--announce .fl10-row__last-topic,
.fl10-row--announce .fl10-row__last-meta a { color: #fff; }
.fl10-row--announce .fl10-row__mark {
  background: #fff; color: var(--color-primary-ink, var(--color-primary));
  border-color: transparent;
}
.fl10-row--announce .fl10-row__status .yon-ico { color: #fff; }
.fl10-row__status {
  display: grid; place-items: center; color: var(--color-muted);
}
.fl10-row__status .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fl10-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.fl10-row__mark {
  display: grid; place-items: center;
  width: 44px; height: 44px; border-radius: 13px; flex-shrink: 0;
  border: 2px solid color-mix(in srgb, var(--color-primary) 26%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); font-size: 16px; font-weight: 800; text-decoration: none;
}
.fl10-row__main { min-width: 0; display: grid; gap: 4px; }
.fl10-row__logo {
  display: grid; place-items: center; justify-self: center;
  width: 96px; min-height: 34px; flex-shrink: 0;
}
.fl10-logo {
  display: inline-grid; place-items: center;
  width: 88px; height: 32px; padding: 0 6px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  overflow: hidden; text-decoration: none;
  transition: border-color .12s ease, filter .12s ease;
}
.fl10-logo:hover {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  filter: brightness(1.06);
}
.fl10-logo img {
  display: block; max-width: 76px; max-height: 24px;
  width: auto; height: auto; object-fit: contain;
}
.fl10-logo--text {
  color: var(--color-muted); font-size: 10.5px; font-weight: 780;
  letter-spacing: .02em; text-align: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.fl10-row--announce .fl10-logo {
  border-color: color-mix(in srgb, #fff 28%, transparent);
  background: color-mix(in srgb, #000 18%, transparent);
}
.fl10-row__title {
  display: inline-flex; align-items: center; gap: 8px; min-width: 0;
  color: var(--color-text); text-decoration: none;
}
.fl10-row__title strong {
  font-size: 15px; font-weight: 780;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fl10-row__title:hover strong { color: var(--color-primary-ink, var(--color-primary)); }
.fl10-tag {
  display: inline-flex; align-items: center; height: 20px; padding: 0 7px;
  border-radius: 999px; flex: none;
  background: color-mix(in srgb, #fff 18%, transparent);
  color: inherit; font-size: 10.5px; font-weight: 780; font-style: normal;
  letter-spacing: .02em; text-transform: uppercase;
}
.fl10-tag--hot {
  background: color-mix(in srgb, var(--color-warning) 22%, transparent);
  color: var(--color-warning);
}
.fl10-row__desc {
  margin: 0; color: var(--color-muted); font-size: 12.5px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fl10-subs {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px;
}
.fl10-subs a {
  display: inline-flex; align-items: center; min-height: 24px; padding: 0 9px;
  border-radius: 8px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
  color: var(--color-text-secondary); font-size: 11.5px; font-weight: 700; text-decoration: none;
}
.fl10-subs a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
}
.fl10-row--announce .fl10-subs a {
  border-color: color-mix(in srgb, #fff 22%, transparent);
  background: color-mix(in srgb, #000 14%, transparent);
  color: #fff;
}
.fl10-row__num {
  display: grid; justify-items: center; gap: 2px; flex-shrink: 0;
}
.fl10-row__num b {
  font-size: 14.5px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--color-text);
}
.fl10-row__num em { display: inline-flex; font-style: normal; }
.fl10-row__num .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.fl10-row__last {
  min-width: 0; display: grid; gap: 4px; justify-items: end; text-align: right;
}
.fl10-row__last-topic {
  max-width: 100%;
  color: var(--color-text); font-size: 13px; font-weight: 700; text-decoration: none;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fl10-row__last-topic:hover { color: var(--color-primary-ink, var(--color-primary)); }
.fl10-row__last-meta {
  display: inline-flex; align-items: center; gap: 7px; max-width: 100%;
}
.fl10-row__last-meta > span {
  display: grid; gap: 1px; min-width: 0; text-align: right;
}
.fl10-row__last-meta a {
  color: var(--color-text-secondary); font-size: 12px; font-weight: 700; text-decoration: none;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fl10-row__last-meta a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.fl10-row__last-meta time {
  color: var(--color-muted); font-size: 11.5px; font-weight: 650;
}
.fl10-mini {
  width: 24px; height: 24px; border-radius: 8px; font-size: 10px; flex: none;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
}
img.fl10-mini,
img.hs10-row__ava,
img.yon-av,
img.fs10-ava,
img.feed__avatar,
img.feed__last-ava,
img.notify__ava,
img.post__ava,
img.shell-avatar,
img.pm11-ava,
img.mem10-ava,
img.co-people__av,
img.acct__av,
img.acct__hero-av,
.thread-readers__chip img {
  display: block !important;
  object-fit: cover !important;
  object-position: center;
  background: var(--color-elevated, #1a2233);
}
span.fl10-mini,
span.hs10-row__ava,
span.yon-av--fallback {
  display: grid !important;
  place-items: center;
  font-weight: 800;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
}
.fl10-row__last-empty {
  color: var(--color-muted); font-size: 12.5px; font-weight: 650;
}
.fl10-row__go {
  display: grid; place-items: center;
  color: var(--color-muted); font-size: 18px; font-weight: 700; text-decoration: none;
}
.fl10-row__go:hover { color: var(--color-primary-ink, var(--color-primary)); }

@media (max-width: 1100px) {
  .fl10-cols,
  .fl10-row {
    grid-template-columns: 24px 40px minmax(0, 1fr) 88px minmax(150px, .85fr) 18px;
  }
  .fl10-cols__num,
  .fl10-row__num { display: none; }
  .fl10-cols__forum { grid-column: 1 / 4; }
}
@media (max-width: 720px) {
  .fl10-cols { display: none; }
  .fl10-row {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 10px; padding: 12px 12px;
  }
  .fl10-row__status,
  .fl10-row__num,
  .fl10-row__logo,
  .fl10-row__go { display: none; }
  .fl10-row__mark { width: 36px; height: 36px; border-radius: 11px; font-size: 14px; }
  .fl10-row__last {
    grid-column: 2; justify-items: start; text-align: left; margin-top: 2px;
  }
  .fl10-row__last-meta { flex-direction: row; }
  .fl10-group__bar { padding: 12px; }
  .fl10-group__meta span:nth-child(3) { display: none; }
}


/* Home sidebar v10 */
.home-grid--v10 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  align-items: start;
}
.home-grid--v10.home-grid--solo {
  grid-template-columns: minmax(0, 1fr);
}
.home-grid--v10.home-grid--solo .home-main,
.home-grid--v10.home-grid--solo .forum-list--v10,
.home-grid--v10.home-grid--solo .agenda--v10 {
  width: 100%;
  max-width: none;
}
.home-grid--v10.home-grid--solo .agenda__grid {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.home-grid--v10.home-grid--solo .home-side--v10 {
  display: none !important;
}
.home-main { min-width: 0; }
.home-side--v10 {
  position: sticky;
  top: 88px;
  display: block;
  width: 100%;
  max-width: 320px;
  min-width: 0;
  overflow: hidden;
}
.hs10-stack {
  display: grid;
  gap: 12px;
  min-width: 0;
  width: 100%;
}
.hs10-card {
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  background: var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  overflow: hidden;
}
.hs10-card__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 48%, transparent);
}
.hs10-card__head .kicker {
  margin: 0 0 2px;
  font-size: 10.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
  font-weight: 780;
}
.hs10-card__head h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 780;
  color: var(--color-text);
  text-transform: none;
  letter-spacing: -.01em;
}
.hs10-card__more {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 750;
  text-decoration: none;
}
.hs10-card__more:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
}
.hs10-list { display: grid; }
.hs10-row {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 16px;
  gap: 10px;
  align-items: center;
  padding: 11px 14px;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-text);
  text-decoration: none;
  transition: background .12s ease;
}
.hs10-row:has(.hs10-rank) {
  grid-template-columns: 22px 36px minmax(0, 1fr) 16px;
}
.hs10-row:last-child { border-bottom: 0; }
.hs10-row:hover {
  background: color-mix(in srgb, var(--color-elevated) 58%, transparent);
}
.hs10-rank {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
  font-size: 11px;
  font-weight: 800;
}
.hs10-row__ava,
img.hs10-row__ava,
span.hs10-row__ava {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  border-radius: 11px;
  flex: none;
  font-size: 12px;
  font-weight: 800;
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  border: 2px solid color-mix(in srgb, var(--color-primary) 24%, var(--color-border));
  object-fit: cover !important;
  overflow: hidden;
}
img.hs10-row__ava {
  display: block !important;
  place-items: unset;
  color: transparent;
  font-size: 0;
}
span.hs10-row__ava {
  display: grid !important;
  place-items: center;
}
.hs10-row__body {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.hs10-row__body strong {
  font-size: 13.5px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hs10-row__body small {
  color: var(--color-muted);
  font-size: 11.5px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hs10-row__go {
  color: var(--color-muted);
  font-size: 16px;
  font-weight: 700;
}
.hs10-empty {
  display: grid;
  gap: 6px;
  place-items: center;
  padding: 22px 16px;
  text-align: center;
}
.hs10-empty strong { font-size: 14px; }
.hs10-empty p {
  margin: 0 0 6px;
  color: var(--color-muted);
  font-size: 12.5px;
}
.hs10-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 12px 14px 14px;
}
.hs10-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
  color: var(--color-text);
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: none;
}
.hs10-chip:hover {
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  color: var(--color-primary-ink, var(--color-primary));
}
.hs10-chip__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-online);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-online) 22%, transparent);
}

@media (max-width: 1100px) {
  .home-grid--v10 {
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 14px;
  }
}
@media (max-width: 980px) {
  .home-grid--v10 {
    grid-template-columns: 1fr;
  }
  .home-side--v10 {
    position: static;
    display: none;
  }
  .home-grid--v10.home-grid--solo .home-side--v10 {
    display: none;
  }
}


.home-side--v10 .yon-mark,
.home-side--v10 .nx-ad {
  margin: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.home-side--v10 .yon-mark img,
.home-side--v10 .nx-ad img {
  max-width: 100%;
  height: auto;
  display: block;
}
.home-side--v10 .hs10-row {
  min-width: 0;
}
.home-side--v10 .trade-chip {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}


/* Agenda / Gundem v10 */
.agenda--v10 {
  margin: 0 0 20px;
}
.agenda__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
}
.agenda__head .kicker {
  margin: 0 0 4px;
  color: var(--color-primary-ink, var(--color-primary));
  font-size: 11px;
  font-weight: 780;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.agenda__head h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.02em;
}
.agenda__more {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
  color: var(--color-muted);
  font-size: 12.5px;
  font-weight: 750;
  text-decoration: none;
}
.agenda__more:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
}
.agenda__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.agenda__card {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 0;
  min-height: 118px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  background: var(--color-surface);
  color: var(--color-text);
  text-decoration: none;
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  transition: border-color .12s ease, transform .12s ease, background .12s ease;
}
.agenda__card:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  color: var(--color-text);
}
.agenda__media {
  position: relative;
  display: block;
  min-height: 118px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--color-primary) 28%, var(--color-elevated)), var(--color-elevated));
  overflow: hidden;
}
.agenda__media img {
  width: 100%;
  height: 100%;
  min-height: 118px;
  object-fit: cover;
  display: block;
}
.agenda__ph {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 34px;
  font-weight: 800;
  color: color-mix(in srgb, #fff 82%, var(--color-primary));
  letter-spacing: -.04em;
}
.agenda__body {
  display: grid;
  align-content: center;
  gap: 8px;
  padding: 14px 14px 14px 14px;
  min-width: 0;
}
.agenda__badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 60%, transparent);
  color: var(--color-muted);
  font-size: 11.5px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.agenda__title {
  font-size: 16px;
  font-weight: 780;
  line-height: 1.25;
  letter-spacing: -.015em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.agenda__card:hover .agenda__title { color: var(--color-primary-ink, var(--color-primary)); }
.agenda__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 650;
}
.agenda__meta > span + span::before {
  content: "?";
  margin-right: 10px;
  color: var(--color-disabled);
}

@media (max-width: 900px) {
  .agenda__grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .agenda__card {
    grid-template-columns: 88px minmax(0, 1fr);
    min-height: 96px;
  }
  .agenda__media,
  .agenda__media img { min-height: 96px; }
  .agenda__title { font-size: 14.5px; }
  .agenda__body { padding: 12px; gap: 6px; }
}

/* Home dash-alert v10 */
.dash-alerts--v10 {
  display: grid;
  gap: 10px;
  margin: 0 0 18px;
}
.dash-alert--v10 {
  position: relative;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 0;
  align-items: stretch;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--da-accent, var(--color-primary)));
  background:
    linear-gradient(105deg, color-mix(in srgb, var(--da-accent, var(--color-primary)) 14%, transparent), transparent 46%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  --da-accent: #38bdf8;
}
.dash-alert--v10.dash-alert--primary { --da-accent: var(--color-primary, #29c4f0); }
.dash-alert--v10.dash-alert--success { --da-accent: #22c55e; }
.dash-alert--v10.dash-alert--warn { --da-accent: #f59e0b; }
.dash-alert--v10.dash-alert--accent { --da-accent: var(--color-primary); }
.dash-alert--v10.dash-alert--info { --da-accent: #38bdf8; }
.dash-alert--v10.is-hidden { display: none; }
.dash-alert__media {
  display: grid;
  place-items: center;
  min-height: 100%;
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--da-accent) 42%, var(--color-elevated)), var(--color-elevated));
  overflow: hidden;
}
.dash-alert__media img {
  width: 100%;
  height: 100%;
  min-height: 96px;
  object-fit: cover;
  display: block;
}
.dash-alert__ico {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: color-mix(in srgb, #fff 92%, transparent);
  color: color-mix(in srgb, var(--da-accent) 80%, #0f172a);
  box-shadow: 0 6px 18px color-mix(in srgb, #000 18%, transparent);
}
.dash-alert__ico .yon-ico { color: inherit; }
.dash-alert__body {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  min-width: 0;
  align-content: center;
}
.dash-alert__top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.dash-alert__badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--da-accent) 18%, transparent);
  border: 1px solid color-mix(in srgb, var(--da-accent) 35%, transparent);
  color: color-mix(in srgb, var(--da-accent) 70%, var(--color-text));
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.dash-alert__when {
  color: var(--color-muted);
  font-size: 12px;
}
.dash-alert__title {
  margin: 0;
  font-size: 15.5px;
  font-weight: 800;
  letter-spacing: -.01em;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dash-alert__text {
  margin: 0;
  color: var(--color-muted);
  font-size: 13.5px;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.dash-alert__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  margin-top: 2px;
  color: color-mix(in srgb, var(--da-accent) 55%, var(--color-text));
  font-size: 13px;
  font-weight: 750;
  text-decoration: none;
}
.dash-alert__cta:hover { color: var(--da-accent); }
.dash-alert__close {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin: 10px 10px 0 0;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--color-muted);
  cursor: pointer;
  flex: none;
  align-self: start;
}
.dash-alert__close:hover {
  background: var(--color-elevated);
  color: var(--color-text);
}
@media (max-width: 640px) {
  .dash-alert--v10 {
    grid-template-columns: 64px minmax(0, 1fr);
  }
  .dash-alert__close {
    position: absolute;
    top: 6px;
    right: 6px;
    margin: 0;
  }
  .dash-alert__body { padding-right: 42px; }
}

/* Home ads v10 */
.nx-ad-cta-wrap { margin: 0 0 14px; }
.nx-ad--v10.nx-ad--cta {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 16px; border-radius: 14px; text-decoration: none; color: #fff;
  background: var(--color-primary);
  border: 1px solid color-mix(in srgb, #93c5fd 35%, transparent);
}
.nx-ad--cta .nx-ad__ico {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px;
  background: color-mix(in srgb, #fff 18%, transparent); flex: none;
}
.nx-ad--cta .nx-ad__copy { display: grid; gap: 2px; min-width: 0; flex: 1; }
.nx-ad--cta .nx-ad__copy strong { font-size: 14.5px; font-weight: 780; }
.nx-ad--cta .nx-ad__copy small { color: color-mix(in srgb, #fff 78%, transparent); font-size: 12.5px; }
.nx-ad--cta .nx-ad__go {
  flex: none; padding: 7px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 750;
  background: color-mix(in srgb, #000 22%, transparent); color: #fff;
}
.fl10-adstrip {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  width: 100%; margin-top: 6px; padding-top: 10px;
  border-top: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
}
.fl10-adstrip__item {
  display: inline-grid; place-items: center; height: 32px; padding: 0 10px;
  border-radius: 9px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 78%, transparent);
  overflow: hidden;
  transition: border-color .12s ease, filter .12s ease;
}
.fl10-adstrip__item:hover {
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  filter: brightness(1.05);
}
.fl10-adstrip__item img { height: 20px; width: auto; max-width: 96px; object-fit: contain; display: block; }
.fl10-adstrip__item--text {
  color: var(--color-muted); font-size: 11px; font-weight: 750; text-decoration: none;
}
.nx-ad-bottom--v10 {
  margin: 20px 0 8px; padding: 14px 16px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--color-primary));
  background: var(--color-surface);
  min-height: 120px;
}
.nx-ad-bottom__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px;
}
.nx-ad-bottom__head strong { font-size: 14px; font-weight: 800; }
.nx-ad-bottom__head a { color: var(--color-primary-ink, var(--color-primary)); font-size: 12.5px; font-weight: 750; text-decoration: none; }
.nx-ad-bottom__grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: 12px; align-items: stretch;
}
.nx-ad-bottom__leaders, .nx-ad-bottom__sides { display: grid; gap: 10px; }
.nx-ad--leader, .nx-ad--module {
  display: grid; place-items: center; text-decoration: none; color: var(--color-text);
  border-radius: 12px; border: 1px solid var(--color-border); overflow: hidden;
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  min-height: 90px;
}
.nx-ad--leader.nx-ad--media, .nx-ad--module.nx-ad--media { padding: 0; }
.nx-ad--leader img, .nx-ad--module img {
  width: 100%; height: 100%; min-height: 90px; object-fit: cover; display: block;
}
.nx-ad--ph {
  padding: 16px; text-align: center; gap: 4px;
}
.nx-ad--ph strong { font-size: 13.5px; font-weight: 780; }
.nx-ad--ph span { color: var(--color-muted); font-size: 12px; }
@media (max-width: 900px) {
  .nx-ad-bottom__grid { grid-template-columns: 1fr; }
}

/* Forum menubar v11 */
.menubar--v11 .menubar__menu--v11 {
  min-width: min(420px, 92vw); padding: 0; overflow: visible;
  background: var(--r10-dark-surface);
  border-color: var(--r10-dark-border);
  color: var(--r10-dark-text);
}
.menubar--v11 .menubar__menu-head {
  display: flex; justify-content: space-between; gap: 10px; align-items: center;
  padding: 10px 12px; border-bottom: 1px solid var(--r10-dark-border);
  background: var(--r10-dark-bg);
  border-radius: 14px 14px 0 0;
}
.menubar--v11 .menubar__menu-head strong { font-size: 12.5px; font-weight: 800; color: var(--r10-dark-text); }
.menubar--v11 .menubar__menu-head span { color: var(--r10-dark-muted); font-size: 11px; font-weight: 650; }
.menubar--v11 .menubar__menu-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 8px;
}
.menubar--v11 .menubar__menu--v11 a {
  display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 8px; align-items: center;
  padding: 9px 10px; border-radius: 11px; color: var(--r10-dark-text); text-decoration: none;
}
.menubar--v11 .menubar__menu-ico {
  display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px;
  border: 1px solid var(--r10-dark-border); background: var(--r10-dark-secondary); color: var(--r10-primary);
}
.menubar--v11 .menubar__menu-copy { display: grid; gap: 1px; min-width: 0; }
.menubar--v11 .menubar__menu-copy strong {
  font-size: 12.5px; font-weight: 780; color: var(--r10-dark-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.menubar--v11 .menubar__menu-copy small {
  color: var(--r10-dark-muted); font-size: 11px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.menubar--v11 .menubar__menu--v11 a:hover {
  background: var(--r10-dark-secondary); color: var(--r10-dark-text);
}
.menubar--v11 .menubar__chip--admin {
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}
.menubar__drawer-head { display: none; }
.menubar__drawer-brand,
.menubar__drawer-titles,
.menubar__drawer-mark,
.menubar__drawer-logo { display: none; }

/* JS otomatik telefon algılama (981–1100 dokunmatik / hover:none) */
html.is-phone-nav .menu-btn { display: inline-grid !important; }
html.is-phone-nav .mast-center,
html.is-phone-nav .mast-search--desk,
html.is-phone-nav .apps-wrap { display: none !important; }
html.is-phone-nav .mast-search--mob {
  display: grid !important; place-items: center; justify-self: end;
  width: 38px; height: 38px; border-radius: 11px; color: var(--color-text);
}
html.is-phone-nav .menubar:not(.is-open) {
  display: flex !important;
  flex-direction: column;
  visibility: hidden;
  pointer-events: none;
  position: fixed;
  transform: translateX(-104%);
}
html.is-phone-nav .menubar.is-open {
  display: flex !important;
  flex-direction: column;
  visibility: visible;
  pointer-events: auto;
  position: fixed;
  top: 0; left: 0; bottom: 0;
  z-index: 200;
  width: min(320px, calc(100vw - 48px));
  background: var(--color-surface);
  border-right: 1px solid var(--color-border);
  box-shadow: 16px 0 48px rgba(16, 18, 32, .35);
  transform: translateX(0);
  overflow: auto;
  overscroll-behavior: contain;
}
html.is-phone-nav .menubar__drawer-head {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  position: sticky; top: 0; z-index: 2;
  padding: 12px;
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
}
html.is-phone-nav .menubar__drawer-brand,
html.is-phone-nav .menubar__drawer-titles { display: flex; }
html.is-phone-nav .menubar__drawer-titles { display: grid; gap: 1px; min-width: 0; }
html.is-phone-nav .menubar__drawer-mark { display: grid; }
html.is-phone-nav .menubar__drawer-logo { display: block; height: 28px; width: auto; max-width: 120px; }
html.is-phone-nav .menubar__drawer-titles strong {
  font-size: 14px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
html.is-phone-nav .menubar__drawer-titles small { font-size: 11px; color: var(--color-muted); font-weight: 650; }
html.is-phone-nav .menubar__close {
  display: grid !important; place-items: center;
  width: 36px; height: 36px; border-radius: 10px;
  border: 1px solid var(--color-border); background: var(--color-elevated);
}
html.is-phone-nav .menubar__inner--v10 {
  width: auto !important; display: grid !important; gap: 14px;
  padding: 10px 12px 16px !important;
}
html.is-phone-nav .menubar__links { display: grid !important; gap: 4px; }
html.is-phone-nav .menubar__link,
html.is-phone-nav .menubar__drop > button.menubar__link {
  width: 100%; justify-content: flex-start; min-height: 44px; border-radius: 12px;
}
html.is-phone-nav .menubar__menu,
html.is-phone-nav .menubar__menu--v11 {
  position: static !important;
  display: none !important;
  box-shadow: none !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 12px !important;
  min-width: 0 !important;
  margin: 4px 0 8px;
}
html.is-phone-nav .menubar__drop.is-open > .menubar__menu,
html.is-phone-nav .menubar__drop.is-open > .menubar__menu--v11 {
  display: grid !important;
}
html.is-phone-nav .menubar__menu-grid { grid-template-columns: 1fr !important; }
html.is-phone-nav .menubar__end--v10 {
  margin: 4px 0 0; flex-wrap: wrap; justify-content: flex-start; gap: 8px;
  padding-top: 12px; border-top: 1px solid var(--color-border);
  width: 100%;
}
html.is-phone-nav .menubar__chip span,
html.is-phone-nav .theme-bar__label span { display: inline !important; }
html.is-phone-nav .menubar__chip { width: auto; padding: 0 12px; min-height: 36px; }
html.is-phone-nav .theme-bar {
  width: 100%; justify-content: space-between; padding: 8px 10px; margin-top: 4px;
}
html.is-phone-nav .drawer-bg.is-on {
  display: block !important;
  position: fixed; inset: 0; z-index: 190;
  background: rgba(16, 18, 32, .52);
}
html.is-phone-nav body.rail-open,
html.is-phone-nav.rail-open,
body.is-phone-nav.rail-open {
  overflow: hidden;
  touch-action: none;
}
@media (max-width: 980px) {
  .menubar__drawer-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
  .menubar__drawer-titles { display: grid; gap: 1px; min-width: 0; }
  .menubar__drawer-mark { display: grid; }
  .menubar__drawer-logo { display: block; }
}
@media (max-width: 1100px) {
  .menubar--v11 .menubar__menu-grid { grid-template-columns: 1fr; }
}

.app-frame:has(.pm11),
.app-frame:has(.pm11-wrap) {
  width: min(1560px, calc(100% - 28px));
  max-width: none;
}

.pm11-wrap--v11 {
  display: grid; gap: 14px; margin: 0 0 28px;
}
.pm11-hero {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  gap: 18px; align-items: stretch;
  padding: 18px 20px; border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-border) 78%, var(--color-primary));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 42%),
    color-mix(in srgb, var(--color-elevated) 50%, var(--color-surface));
}
.pm11-hero__glow {
  position: absolute; inset: -40% auto auto -10%; width: 55%; height: 140%;
  background: radial-gradient(circle, color-mix(in srgb, var(--color-primary) 22%, transparent), transparent 68%);
  pointer-events: none;
}
.pm11-hero__main { position: relative; z-index: 1; min-width: 0; }
.pm11-hero__main h1 {
  margin: 0; font-size: clamp(1.45rem, 2.4vw, 1.9rem); font-weight: 850; letter-spacing: -.03em;
}
.pm11-hero__lead {
  margin: 8px 0 0; max-width: 52ch; color: var(--color-muted); font-size: 13.5px; line-height: 1.45;
}
.pm11-hero__actions {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px;
}
.pm11-cta {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px;
  border-radius: 12px; border: 0; text-decoration: none; font-weight: 800; font-size: 13.5px;
  color: #fff; background: var(--color-primary);
}
.pm11-cta__ico {
  display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px;
  background: color-mix(in srgb, #000 18%, transparent);
}
.pm11-cta:hover { filter: brightness(1.06); color: #fff; }
.pm11-ghost {
  min-height: 40px; padding: 0 12px; border-radius: 12px; cursor: pointer;
  border: 1px solid var(--color-border); background: var(--color-surface);
  color: var(--color-text); font: inherit; font-size: 13px; font-weight: 750;
}
.pm11-ghost:hover:not(:disabled) { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.pm11-ghost:disabled { opacity: .45; cursor: not-allowed; }
.pm11-ghost--warn {
  border-color: color-mix(in srgb, #f97316 40%, var(--color-border));
  color: #fb923c;
}
.pm11-hero__quota {
  position: relative; z-index: 1;
  display: grid; gap: 12px; padding: 14px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--pm-rank, var(--color-primary)) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface) 88%, var(--pm-rank, var(--color-primary)));
}
.pm11-hero__quota-top {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.pm11-hero__quota-top small { color: var(--color-muted); font-size: 11px; font-weight: 700; }
.pm11-meta__badge {
  display: inline-flex; align-items: center; width: fit-content;
  padding: 4px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 800;
  color: #fff; background: var(--pm-rank, var(--color-primary));
}
.pm11-meta__label {
  color: var(--color-muted); font-size: 10.5px; font-weight: 800;
  letter-spacing: .05em; text-transform: uppercase;
}
.pm11-gauge { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: center; }
.pm11-gauge__ring {
  --pm-pct: 0;
  width: 64px; height: 64px; border-radius: 50%;
  display: grid; place-items: center;
  background:
    radial-gradient(circle at center, var(--color-surface) 58%, transparent 59%),
    conic-gradient(var(--color-primary) calc(var(--pm-pct) * 1%), color-mix(in srgb, var(--color-border) 70%, transparent) 0);
}
.pm11-gauge.is-warn .pm11-gauge__ring {
  background:
    radial-gradient(circle at center, var(--color-surface) 58%, transparent 59%),
    conic-gradient(#f59e0b calc(var(--pm-pct) * 1%), color-mix(in srgb, var(--color-border) 70%, transparent) 0);
}
.pm11-gauge.is-crit .pm11-gauge__ring {
  background:
    radial-gradient(circle at center, var(--color-surface) 58%, transparent 59%),
    conic-gradient(#ef4444 calc(var(--pm-pct) * 1%), color-mix(in srgb, var(--color-border) 70%, transparent) 0);
}
.pm11-gauge__ring strong { font-size: 13px; font-weight: 850; }
.pm11-gauge__copy { display: grid; gap: 2px; min-width: 0; }
.pm11-gauge__copy span { color: var(--color-muted); font-size: 11px; font-weight: 700; }
.pm11-gauge__copy b { font-size: 18px; font-weight: 850; letter-spacing: -.02em; }
.pm11-gauge__copy small { color: var(--color-muted); font-size: 11.5px; }
.pm11-hero__daily {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px;
  padding-top: 8px; border-top: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  font-size: 12.5px;
}
.pm11-hero__daily span { color: var(--color-muted); font-weight: 700; }
.pm11-hero__daily strong { font-weight: 850; }
.pm11-hero__daily em { color: var(--color-primary-ink, var(--color-primary)); font-style: normal; font-weight: 750; }

.pm11-board {
  display: grid; gap: 10px;
  padding: 12px; border-radius: 16px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 35%, var(--color-surface));
}
.pm11-folders { display: flex; flex-wrap: wrap; gap: 8px; }
.pm11-folder {
  display: inline-flex; align-items: center; gap: 7px;
  min-height: 36px; padding: 0 12px; border-radius: 999px;
  border: 1px solid var(--color-border); background: var(--color-surface);
  color: var(--color-text); text-decoration: none; font-size: 12.5px; font-weight: 750;
}
.pm11-folder em {
  min-width: 18px; padding: 1px 6px; border-radius: 999px; font-style: normal; font-size: 11px; font-weight: 800;
  background: color-mix(in srgb, var(--color-primary) 16%, transparent); color: var(--color-primary-ink, var(--color-primary));
}
.pm11-folder:hover, .pm11-folder.is-active {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-surface));
  color: var(--color-primary-ink, var(--color-primary));
}
.pm11-tiles {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px;
}
.pm11-tile {
  display: grid; gap: 4px; padding: 10px 12px; border-radius: 12px;
  border: 1px solid var(--color-border); background: var(--color-surface);
}
.pm11-tile strong { font-size: 15px; font-weight: 850; letter-spacing: -.02em; }
.pm11-tile.is-hot strong { color: #fb923c; }
.pm11-tile--tip {
  border-color: color-mix(in srgb, var(--color-primary) 30%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface));
}
.pm11-tile--tip strong { font-size: 12.5px; font-weight: 750; line-height: 1.3; color: var(--color-primary-ink, var(--color-primary)); }

@media (max-width: 1100px) {
  .pm11-hero { grid-template-columns: 1fr; }
  .pm11-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .pm11-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pm11-hero { padding: 14px; }
}

/* Private messages v11 ? 3 column chat */
.pm11 {
  --pm-h: min(78vh, 820px);
  --pm-accent: var(--color-primary);
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr) 260px;
  gap: 0;
  min-height: var(--pm-h);
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 84%, var(--pm-accent));
  background: var(--color-surface);
  overflow: hidden;
  margin: 0;
  box-shadow: 0 10px 28px color-mix(in srgb, #000 18%, transparent);
}
.pm11-kicker {
  margin: 0 0 2px; color: var(--color-primary-ink, var(--color-primary)); font-size: 10.5px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase;
}
.pm11-side, .pm11-profile {
  display: flex; flex-direction: column; min-height: 0;
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
}
.pm11-side { border-right: 1px solid var(--color-border); }
.pm11-profile { border-left: 1px solid var(--color-border); }
.pm11-side__head, .pm11-chat__head {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 14px 14px 10px; border-bottom: 1px solid var(--color-border);
}
.pm11-side__head h1, .pm11-chat__head h2 { margin: 0; font-size: 16px; font-weight: 800; }
.pm11-ico-btn {
  display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px;
  border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-primary-ink, var(--color-primary));
}
.pm11-search {
  display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 8px; padding: 10px 12px;
  border-bottom: 1px solid var(--color-border);
}
.pm11-search select, .pm11-search input {
  min-height: 34px; border-radius: 9px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); font: inherit; font-size: 12.5px;
}
.pm11-search__field { position: relative; display: block; }
.pm11-search__ico { position: absolute; left: 8px; top: 50%; transform: translateY(-50%); color: var(--color-muted); }
.pm11-search__field input { width: 100%; padding-left: 28px; }
.pm11-list { flex: 1; overflow: auto; }
.pm11-item {
  display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 10px 12px; color: var(--color-text); text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 60%, transparent);
}
.pm11-item:hover, .pm11-item.is-active { background: color-mix(in srgb, var(--color-primary) 10%, transparent); }
.pm11-item.is-unread strong { color: var(--color-primary-ink, var(--color-primary)); }
.pm11-item__badge {
  display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; font-size: 10px; font-weight: 850;
  background: var(--color-primary); color: #fff;
}
.pm11-item__ava { position: relative; }
.pm11-ava, .pm11 img.pm11-ava, span.pm11-ava {
  width: 40px; height: 40px; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; background: var(--color-elevated); font-weight: 800; font-size: 13px;
}
.pm11-ava--lg, img.pm11-ava--lg, span.pm11-ava--lg { width: 72px; height: 72px; font-size: 22px; }
.pm11-ava--ph { background: color-mix(in srgb, var(--color-primary) 22%, var(--color-elevated)); }
.pm11-dot {
  position: absolute; right: 0; bottom: 0; width: 10px; height: 10px; border-radius: 50%;
  background: #22c55e; border: 2px solid var(--color-surface);
}
.pm11-item__body { min-width: 0; display: grid; gap: 2px; }
.pm11-item__body strong, .pm11-item__body small {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pm11-item__body small { color: var(--color-muted); font-size: 12px; }
.pm11-item time { color: var(--color-muted); font-size: 11px; }
.pm11-empty { padding: 24px 16px; color: var(--color-muted); font-size: 13px; text-align: center; }
.pm11-side__foot {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  padding: 10px 12px; border-top: 1px solid var(--color-border); font-size: 12px;
}
.pm11-side__foot a { color: var(--pm-accent); font-weight: 750; text-decoration: none; display: inline-flex; gap: 6px; align-items: center; }
.pm11-side__count { color: var(--color-muted); }
.pm11-chat { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: var(--color-surface); }
.pm11-chat__empty {
  flex: 1; display: grid; place-content: center; gap: 8px; text-align: center; padding: 32px;
  color: var(--color-muted);
}
.pm11-typing { color: var(--color-primary-ink, var(--color-primary)); font-size: 12px; font-weight: 700; }
.pm11-thread {
  flex: 1; overflow: auto; padding: 14px; display: grid; gap: 10px; align-content: start;
}
.pm11-bubble {
  display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; max-width: 86%;
}
.pm11-bubble.is-mine { margin-left: auto; grid-template-columns: minmax(0, 1fr) 36px; }
.pm11-bubble.is-mine .pm11-ava { order: 2; }
.pm11-bubble__body {
  padding: 10px 12px; border-radius: 14px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
.pm11-bubble.is-mine .pm11-bubble__body {
  background: color-mix(in srgb, var(--pm-accent) 14%, var(--color-elevated));
  border-color: color-mix(in srgb, var(--pm-accent) 28%, var(--color-border));
}
.pm11-tools {
  display: flex; flex-wrap: wrap; gap: 4px;
}
.pm11-tools button {
  width: 32px; height: 28px; border-radius: 8px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); font: inherit; font-size: 12px; cursor: pointer;
}
.pm11-tools button:hover { border-color: var(--pm-accent); color: var(--pm-accent); }
.pm11-bubble__meta { display: flex; gap: 8px; align-items: baseline; margin-bottom: 4px; }
.pm11-bubble__meta strong { font-size: 12.5px; }
.pm11-bubble__meta time { color: var(--color-muted); font-size: 11px; }
.pm11-bubble__body p { margin: 0; font-size: 13.5px; line-height: 1.45; white-space: pre-wrap; }
.pm11-bubble__del { color: var(--color-muted); font-style: italic; }
.pm11-compose {
  border-top: 1px solid var(--color-border); padding: 12px; display: grid; gap: 8px;
  background: color-mix(in srgb, var(--color-elevated) 30%, transparent);
}
.pm11-compose textarea {
  width: 100%; min-height: 72px; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); padding: 10px 12px; font: inherit; resize: vertical;
}
.pm11-compose__bar { display: flex; gap: 8px; flex-wrap: wrap; }
.pm11-send { background: #16a34a !important; border-color: #16a34a !important; }
.pm11-profile { padding: 14px; gap: 12px; overflow: auto; }
.pm11-profile__hero { display: grid; justify-items: center; gap: 6px; text-align: center; }
.pm11-profile__hero a { color: var(--color-muted); font-size: 13px; }
.pm11-online { color: #22c55e; font-size: 12px; font-style: normal; font-weight: 750; }
.pm11-stats { margin: 0; display: grid; gap: 8px; }
.pm11-stats > div {
  display: flex; justify-content: space-between; gap: 8px;
  padding: 8px 10px; border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-surface); font-size: 12.5px;
}
.pm11-stats dt { color: var(--color-muted); }
.pm11-stats dd { margin: 0; font-weight: 750; }
.pm11-actions { display: grid; gap: 8px; }
.pm11-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
  min-height: 40px; padding: 0 12px; border-radius: 11px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); font: inherit; font-size: 13px; font-weight: 750;
  text-decoration: none; cursor: pointer;
}
.pm11-btn:hover { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.pm11-btn--warn {
  background: color-mix(in srgb, #f97316 18%, transparent);
  border-color: color-mix(in srgb, #f97316 45%, var(--color-border));
  color: #fb923c;
}
.pm11-btn--danger {
  background: color-mix(in srgb, #ef4444 14%, transparent);
  border-color: color-mix(in srgb, #ef4444 40%, var(--color-border));
  color: #f87171;
}
.pm11-report { display: grid; gap: 8px; }
.pm11-report label span { display: block; margin-bottom: 4px; font-size: 12px; color: var(--color-muted); font-weight: 700; }
.pm11-report select, .pm11-report textarea {
  width: 100%; border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); font: inherit; padding: 8px 10px;
}
@media (max-width: 1100px) {
  .pm11 { grid-template-columns: 260px minmax(0, 1fr); }
  .pm11-profile { display: none; }
}
@media (max-width: 760px) {
  .pm11 { grid-template-columns: 1fr; min-height: auto; }
  .pm11-side { max-height: 280px; }
}
@media print {
  .pm11-side, .pm11-profile, .pm11-compose, .menubar, .mast, .site-foot { display: none !important; }
  .pm11 { border: 0; display: block; }
}

/* Compose page v11 */
.pm11-ava--sm, img.pm11-ava--sm, span.pm11-ava--sm { width: 22px; height: 22px; font-size: 10px; }
.pm11-compose-page .pm11-hero--compose { margin-bottom: 0; }
.pm11-compose-quota {
  display: grid; gap: 10px;
}
.pm11-compose-quota > div { display: grid; gap: 2px; }
.pm11-compose-quota strong { font-size: 15px; font-weight: 850; }
.pm11-compose-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); gap: 14px; align-items: start;
}
.pm11-compose-card {
  display: grid; gap: 14px; padding: 16px 18px; border-radius: 16px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 40%, var(--color-surface));
}
.pm11-compose-card--warn {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--color-border));
  background: color-mix(in srgb, #f59e0b 10%, var(--color-surface));
}
.pm11-compose-card__head h2, .pm11-compose-card h3 {
  margin: 0; font-size: 16px; font-weight: 850;
}
.pm11-compose-card__head p, .pm11-compose-tip {
  margin: 4px 0 0; color: var(--color-muted); font-size: 13px; line-height: 1.45;
}
.pm11-field { display: grid; gap: 6px; }
.pm11-field > span { font-size: 12.5px; font-weight: 750; }
.pm11-field > span em { color: var(--color-muted); font-style: normal; font-weight: 600; }
.pm11-field input, .pm11-field textarea {
  width: 100%; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); font: inherit; padding: 10px 12px;
}
.pm11-field textarea { resize: vertical; min-height: 160px; line-height: 1.45; }
.pm11-field__hint, .pm11-field__foot {
  color: var(--color-muted); font-size: 11.5px;
}
.pm11-field__foot { display: flex; justify-content: space-between; gap: 8px; }
.pm11-recent { display: grid; gap: 8px; }
.pm11-recent__row, .pm11-templates__row {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.pm11-recent__chip, .pm11-tpl {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 34px; padding: 0 10px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--color-border); background: var(--color-surface);
  color: var(--color-text); font: inherit; font-size: 12.5px; font-weight: 750;
}
.pm11-recent__chip:hover, .pm11-tpl:hover {
  border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary));
}
.pm11-templates { display: grid; gap: 8px; }
.pm11-compose-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pm11-feature-list {
  margin: 0; padding: 0; list-style: none; display: grid; gap: 10px;
}
.pm11-feature-list li {
  padding: 10px 12px; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-surface); font-size: 13px; line-height: 1.4; color: var(--color-muted);
}
.pm11-feature-list strong { display: block; color: var(--color-text); margin-bottom: 2px; }
.pm11-compose-side { display: grid; gap: 12px; }
@media (max-width: 960px) {
  .pm11-compose-grid { grid-template-columns: 1fr; }
}

/* Compose v12 */
.app-frame:has(.pm12-wrap) {
  width: min(1560px, calc(100% - 28px));
  max-width: none;
}
.pm12-wrap { display: grid; gap: 14px; margin: 0 0 28px; }
.pm12-hero {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  gap: 16px; padding: 18px 20px; border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-border) 75%, var(--color-primary));
  background:
    linear-gradient(140deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 46%),
    color-mix(in srgb, var(--color-elevated) 48%, var(--color-surface));
}
.pm12-hero__glow {
  position: absolute; inset: -50% auto auto -20%; width: 60%; height: 160%; pointer-events: none;
  background: radial-gradient(circle, color-mix(in srgb, var(--color-primary) 20%, transparent), transparent 70%);
}
.pm12-hero__main { position: relative; z-index: 1; }
.pm12-kicker {
  margin: 0 0 4px; color: var(--color-primary-ink, var(--color-primary)); font-size: 10.5px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase;
}
.pm12-hero h1 {
  margin: 0; font-size: clamp(1.4rem, 2.3vw, 1.85rem); font-weight: 850; letter-spacing: -.03em;
}
.pm12-lead { margin: 8px 0 0; max-width: 52ch; color: var(--color-muted); font-size: 13.5px; line-height: 1.45; }
.pm12-hero__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.pm12-quota {
  position: relative; z-index: 1; display: grid; gap: 12px; padding: 14px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--pm-rank, var(--color-primary)) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface) 88%, var(--pm-rank, var(--color-primary)));
}
.pm12-quota__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.pm12-quota__top small { color: var(--color-muted); font-size: 11px; font-weight: 700; }
.pm12-badge {
  display: inline-flex; padding: 4px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 800;
  color: #fff; background: var(--pm-rank, var(--color-primary));
}
.pm12-quota__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pm12-quota__grid span { display: block; color: var(--color-muted); font-size: 10.5px; font-weight: 750; text-transform: uppercase; }
.pm12-quota__grid strong { font-size: 14px; font-weight: 850; }
.pm12-layout {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 300px); gap: 14px; align-items: start;
}
.pm12-card {
  display: grid; gap: 14px; padding: 16px 18px; border-radius: 16px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 42%, var(--color-surface));
}
.pm12-card--warn {
  border-color: color-mix(in srgb, #f59e0b 42%, var(--color-border));
  background: color-mix(in srgb, #f59e0b 10%, var(--color-surface));
}
.pm12-form__head h2, .pm12-card h3 { margin: 0; font-size: 16px; font-weight: 850; }
.pm12-form__head p, .pm12-tip { margin: 4px 0 0; color: var(--color-muted); font-size: 13px; line-height: 1.45; }
.pm12-form__head code {
  padding: 1px 6px; border-radius: 6px; font-size: 12px;
  background: color-mix(in srgb, var(--color-primary) 12%, transparent); color: var(--color-primary-ink, var(--color-primary));
}
.pm12-label {
  display: block; margin-bottom: 6px; color: var(--color-muted);
  font-size: 10.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
}
.pm12-field { display: grid; gap: 6px; position: relative; }
.pm12-field > label { font-size: 12.5px; font-weight: 750; }
.pm12-field > label em { color: var(--color-muted); font-style: normal; font-weight: 600; }
.pm12-field input, .pm12-field textarea {
  width: 100%; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); font: inherit; padding: 10px 12px;
}
.pm12-field textarea { min-height: 180px; resize: vertical; line-height: 1.45; }
.pm12-hint, .pm12-field__foot { color: var(--color-muted); font-size: 11.5px; }
.pm12-field__foot { display: flex; justify-content: space-between; gap: 8px; }
.pm12-suggest { position: relative; }
.pm12-suggest__ico {
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: var(--color-primary-ink, var(--color-primary)); font-weight: 850; z-index: 1; pointer-events: none;
}
.pm12-suggest input { padding-left: 32px; }
.pm12-suggest__panel {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 40;
  max-height: 260px; overflow: auto; padding: 6px; border-radius: 12px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: 0 12px 28px color-mix(in srgb, #000 22%, transparent);
}
.pm12-suggest__panel--mention { top: auto; bottom: calc(100% + 6px); }
.pm12-bodybox { position: relative; }
.pm12-suggest__empty { padding: 12px; color: var(--color-muted); font-size: 13px; text-align: center; }
.pm12-suggest__item {
  display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; align-items: center;
  width: 100%; padding: 8px 10px; border: 0; border-radius: 10px; cursor: pointer; text-align: left;
  background: transparent; color: var(--color-text); font: inherit;
}
.pm12-suggest__item:hover, .pm12-suggest__item:focus {
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
}
.pm12-suggest__item strong { display: block; font-size: 13px; }
.pm12-suggest__item small { color: var(--color-muted); font-size: 12px; }
.pm12-ava, img.pm12-ava, span.pm12-ava {
  width: 32px; height: 32px; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; background: var(--color-elevated); font-size: 12px; font-weight: 800;
}
.pm12-picked {
  display: inline-flex; align-items: center; gap: 8px; width: fit-content;
  padding: 6px 8px 6px 12px; border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-surface));
  color: var(--color-primary-ink, var(--color-primary)); font-size: 13px; font-weight: 750;
}
.pm12-picked button {
  width: 24px; height: 24px; border: 0; border-radius: 50%; cursor: pointer;
  background: color-mix(in srgb, var(--color-primary) 18%, transparent); color: inherit; font: inherit;
}
.pm12-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.pm12-chip {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 34px; padding: 0 11px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--color-border); background: var(--color-surface);
  color: var(--color-text); font: inherit; font-size: 12.5px; font-weight: 750;
}
.pm12-chip:hover, .pm12-chip--tpl:hover {
  border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary));
}
.pm12-chip .pm12-ava { width: 22px; height: 22px; font-size: 10px; }
.pm12-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.pm12-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 40px; padding: 0 14px; border-radius: 12px; font: inherit; font-size: 13.5px; font-weight: 800;
  text-decoration: none; cursor: pointer;
}
.pm12-btn--primary { border: 0; color: #fff; background: var(--color-primary); }
.pm12-btn--primary:hover { filter: brightness(1.06); color: #fff; }
.pm12-btn--ghost {
  border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text);
}
.pm12-btn--ghost:hover { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.pm12-side { display: grid; gap: 12px; }
.pm12-features { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.pm12-features li {
  padding: 10px 12px; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-muted); font-size: 13px; line-height: 1.4;
}
.pm12-features strong { display: block; color: var(--color-text); margin-bottom: 2px; }
.trade-ov--v10 .trade-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.trade-ov--v10.trade-ov--card .trade-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.trade-tiles strong small { font-weight: 650; color: var(--color-muted); font-size: 12px; }
.trade-stars { display: inline-flex; gap: 1px; letter-spacing: 0; line-height: 1; }
.trade-stars i { font-style: normal; font-size: 15px; color: color-mix(in srgb, var(--color-border) 80%, #94a3b8); }
.trade-stars i.is-on { color: #f59e0b; text-shadow: 0 0 10px color-mix(in srgb, #f59e0b 35%, transparent); }
.trade-cards { display: grid; gap: 10px; }
.trade-card {
  display: grid; gap: 10px; padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 18%, var(--color-border));
  border-radius: 16px; background: var(--color-elevated);
}
.trade-card--pos { border-color: color-mix(in srgb, var(--color-success) 35%, var(--color-border)); }
.trade-card--neu { border-color: color-mix(in srgb, var(--color-info, #38bdf8) 30%, var(--color-border)); }
.trade-card--neg { border-color: color-mix(in srgb, var(--color-danger) 35%, var(--color-border)); }
.trade-card.is-disputed { box-shadow: inset 3px 0 0 var(--color-danger); }
.trade-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.trade-card__badge { font-size: 14px; font-weight: 800; letter-spacing: -.01em; }
.trade-card--pos .trade-card__badge { color: var(--color-success); }
.trade-card--neu .trade-card__badge { color: var(--color-info, #38bdf8); }
.trade-card--neg .trade-card__badge { color: var(--color-danger); }
.trade-card__dispute {
  margin: 0; font-style: normal; font-size: 11px; font-weight: 800;
  padding: 2px 8px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--color-danger) 40%, var(--color-border));
  color: var(--color-danger);
}
.trade-card__dispute.is-ok {
  border-color: color-mix(in srgb, var(--color-success) 40%, var(--color-border));
  color: var(--color-success);
}
.trade-card__meta {
  margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px;
}
.trade-card__meta div { display: grid; gap: 2px; min-width: 0; }
.trade-card__meta dt {
  color: var(--color-muted); font-size: 11px; font-weight: 750;
  text-transform: uppercase; letter-spacing: .04em;
}
.trade-card__meta dd { margin: 0; font-size: 14px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trade-card__meta a { color: inherit; }
.trade-card__meta a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.trade-card__desc { margin: 0; font-size: 13px; color: var(--color-text); line-height: 1.45; }
.trade-card__desc span {
  display: block; margin-bottom: 4px; color: var(--color-muted);
  font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em;
}
.trade-card__foot {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
  padding-top: 8px; border-top: 1px solid var(--color-border);
  font-size: 12px; color: var(--color-muted);
}
.trade-card__foot a { color: var(--color-primary-ink, var(--color-primary)); font-weight: 650; }
.trade-card__proof { font-weight: 750 !important; }
.trade-card__dispute-form { margin-left: auto; }
.trade-card__dispute-form summary {
  cursor: pointer; list-style: none; font-weight: 700; color: var(--color-danger);
}
.trade-card__dispute-form summary::-webkit-details-marker { display: none; }
.trade-card__dispute-form form {
  margin-top: 8px; display: grid; gap: 8px; min-width: min(320px, 100%);
  padding: 10px; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-surface);
}
.trade-card__dispute-form textarea {
  width: 100%; min-height: 72px; resize: vertical; font: inherit;
  border-radius: 10px; border: 1px solid var(--color-border); padding: 8px 10px;
  background: var(--color-elevated); color: var(--color-text);
}
.trade-card__resolve { display: inline; }

/* iTrader form v10 */
.itrade--v10 { display: grid; gap: 16px; max-width: 820px; margin: 0 auto; padding: 8px 0 28px; }
.itrade__head {
  display: flex; justify-content: space-between; gap: 16px; align-items: flex-start;
  padding: 18px 20px; border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 55%),
    var(--color-elevated);
}
.itrade__head .kicker {
  margin: 0 0 6px; font-size: 11px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--color-primary-ink, var(--color-primary));
}
.itrade__head h1 { margin: 0 0 6px; font-size: 1.35rem; letter-spacing: -.02em; }
.itrade__preview {
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
  padding: 10px 12px; border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-surface);
}
.itrade__preview strong { display: block; font-size: 13px; }
.itrade__preview small { color: var(--color-muted); }
.itrade__ava, img.itrade__ava {
  width: 42px; height: 42px; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; background: var(--color-elevated); font-weight: 800;
}
.itrade-form { display: grid; gap: 14px; padding: 18px; border-radius: 18px; }
.itrade-block { margin: 0; padding: 0; border: 0; display: grid; gap: 10px; }
.itrade-block legend { font-size: 13px; font-weight: 800; margin-bottom: 2px; }
.itrade-roles { display: flex; flex-wrap: wrap; gap: 8px; }
.itrade-role {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px;
  border-radius: 12px; border: 1px solid var(--color-border); background: var(--color-surface);
  cursor: pointer; font-weight: 700; font-size: 13px;
}
.itrade-role:has(input:checked) {
  border-color: var(--color-primary);
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-surface));
  color: var(--color-primary-ink, var(--color-primary));
}
.itrade-role input { accent-color: var(--color-primary); }
.itrade-hint, .itrade-warn { margin: 0; color: var(--color-muted); font-size: 12.5px; }
.itrade-warn { display: flex; align-items: flex-start; gap: 8px; }
.itrade-stars { display: grid; gap: 8px; }
.itrade-star {
  display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; align-items: center;
  padding: 10px 12px; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-surface); cursor: pointer;
}
.itrade-star:has(input:checked) {
  border-color: #f59e0b;
  background: color-mix(in srgb, #f59e0b 10%, var(--color-surface));
}
.itrade-star input { grid-row: span 2; accent-color: #f59e0b; }
.itrade-star span { font-size: 15px; letter-spacing: 1px; color: #f59e0b; }
.itrade-star em { grid-column: 2; font-style: normal; font-size: 12px; color: var(--color-muted); }
.itrade-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.itrade-field { display: grid; gap: 6px; font-size: 13px; font-weight: 700; }
.itrade-field small { font-weight: 550; color: var(--color-muted); }
.itrade-field input, .itrade-field textarea {
  font: inherit; font-weight: 550; border-radius: 12px; border: 1px solid var(--color-border);
  padding: 10px 12px; background: var(--color-surface); color: var(--color-text);
}
.itrade-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
@media (max-width: 720px) {
  .itrade__head { flex-direction: column; }
  .itrade-grid, .trade-card__meta { grid-template-columns: 1fr; }
  .trade-ov--v10 .trade-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .trade-ov--v10:not(.trade-ov--card) .trade-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Freelancer v10 */
.flr--v10 { display: grid; gap: 18px; padding: 8px 0 32px; max-width: min(1560px, 100%); margin: 0 auto; }
.flr-hero {
  display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; flex-wrap: wrap;
  padding: 20px 22px; border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 20%, var(--color-border));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 50%),
    var(--color-elevated);
}
.flr-hero--compact { padding: 16px 18px; }
.flr-hero .kicker, .flr-profile .kicker {
  margin: 0 0 6px; font-size: 11px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--color-primary-ink, var(--color-primary));
}
.flr-hero h1, .flr-profile h1, .flr-svc-head h1 { margin: 0 0 6px; font-size: 1.45rem; letter-spacing: -.02em; }
.flr-hero__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.flr-search {
  display: grid; grid-template-columns: minmax(0, 1fr) 200px auto; gap: 10px;
  padding: 12px; border-radius: 14px; border: 1px solid var(--color-border); background: var(--color-surface);
}
.flr-search input, .flr-search select, .flr-field input, .flr-field select, .flr-field textarea,
.flr-order__acts textarea, .flr-order__acts input, .flr-order__acts select,
.flr-pkg-edit input {
  font: inherit; border-radius: 12px; border: 1px solid var(--color-border);
  padding: 10px 12px; background: var(--color-elevated); color: var(--color-text); width: 100%;
}
.flr-tabs { display: flex; gap: 8px; }
.flr-tabs a {
  padding: 8px 14px; border-radius: 999px; border: 1px solid var(--color-border);
  font-size: 13px; font-weight: 700; color: var(--color-muted);
}
.flr-tabs a.is-on { color: var(--color-text); border-color: var(--color-primary); background: color-mix(in srgb, var(--color-primary) 12%, transparent); }
.flr-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.flr-card {
  display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 12px; align-items: start;
  padding: 14px 16px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 16%, var(--color-border));
  background: var(--color-elevated); color: inherit; text-decoration: none;
}
.flr-card:hover { border-color: var(--color-primary); }
.flr-card__ava, img.flr-card__ava, .flr-profile__ava, img.flr-profile__ava {
  width: 56px; height: 56px; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; background: var(--color-surface); font-weight: 800;
}
.flr-profile__ava, img.flr-profile__ava { width: 72px; height: 72px; }
.flr-card__body { display: grid; gap: 4px; min-width: 0; }
.flr-card__body h2 { margin: 0; font-size: 1.05rem; letter-spacing: -.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flr-card__name { color: var(--color-muted); font-size: 13px; }
.flr-card__body em { font-style: normal; font-size: 12.5px; font-weight: 700; color: var(--color-text); }
.flr-card__body small { color: var(--color-muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flr-card__new {
  display: inline-flex; width: fit-content; padding: 1px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 800; border: 1px solid var(--color-border); color: var(--color-muted);
}
.flr-empty {
  padding: 28px 18px; border-radius: 16px; border: 1px dashed var(--color-border);
  background: var(--color-elevated); text-align: center; display: grid; gap: 10px; justify-items: center;
}
.flr-jobs-preview header, .flr-block > h2 { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.flr-jobs-preview h2, .flr-block h2, .flr-bio h2, .flr-pkg-aside h2, .flr-form h2 { margin: 0 0 10px; font-size: 1.05rem; }
.flr-job-list { display: grid; gap: 8px; }
.flr-job {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center;
  padding: 12px 14px; border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: inherit; text-decoration: none;
}
.flr-job strong { display: block; font-size: 14px; }
.flr-job small, .flr-job span, .flr-job em { color: var(--color-muted); font-size: 12.5px; font-style: normal; }
.flr-job--row { grid-template-columns: minmax(0, 1.4fr) minmax(120px, .6fr) auto; }
.flr-profile {
  display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap;
  padding: 18px 20px; border-radius: 18px; border: 1px solid var(--color-border); background: var(--color-elevated);
}
.flr-profile__meta { margin: 0; color: var(--color-muted); font-size: 13px; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
.flr-skills, .flr-rate { margin: 8px 0 0; font-size: 13px; }
.flr-rate { font-weight: 800; color: var(--color-primary-ink, var(--color-primary)); }
.flr-bio { padding: 16px 18px; border-radius: 16px; }
.flr-bio p { margin: 0; line-height: 1.55; white-space: pre-wrap; }
.flr-svc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.flr-svc {
  display: flex; justify-content: space-between; gap: 10px; padding: 12px 14px;
  border-radius: 14px; border: 1px solid var(--color-border); background: var(--color-elevated); color: inherit; text-decoration: none;
}
.flr-reviews { display: grid; gap: 10px; }
.flr-review { padding: 12px 14px; border-radius: 14px; border: 1px solid var(--color-border); background: var(--color-surface); }
.flr-review p { margin: 6px 0; font-size: 13px; }
.flr-review small { color: var(--color-muted); }
.flr-form { display: grid; gap: 12px; padding: 18px; border-radius: 18px; }
.flr-field { display: grid; gap: 6px; font-size: 13px; font-weight: 700; }
.flr-field--full { grid-column: 1 / -1; }
.flr-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.flr-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.flr-packages-edit { display: grid; gap: 12px; }
.flr-pkg-edit {
  margin: 0; padding: 12px; border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-surface); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;
}
.flr-pkg-edit legend { font-weight: 800; padding: 0 4px; }
.flr-pkg-edit label { display: grid; gap: 4px; font-size: 12px; font-weight: 700; }
.flr-svc-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .9fr); gap: 14px; align-items: start; }
.flr-pkg-grid { display: grid; gap: 10px; }
.flr-pkg {
  display: grid; gap: 8px; padding: 14px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background: var(--color-elevated);
}
.flr-pkg em { font-style: normal; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--color-primary-ink, var(--color-primary)); }
.flr-pkg strong { font-size: 15px; }
.flr-pkg b { font-size: 1.25rem; letter-spacing: -.02em; }
.flr-pkg ul { margin: 0; padding-left: 18px; color: var(--color-muted); font-size: 13px; }
.flr-pkg p { margin: 0; font-size: 12.5px; color: var(--color-muted); }
.flr-bids { display: grid; gap: 10px; }
.flr-bid { padding: 12px 14px; border-radius: 14px; border: 1px solid var(--color-border); background: var(--color-elevated); }
.flr-bid header { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin-bottom: 6px; }
.flr-bid__acts { display: flex; gap: 8px; margin-top: 8px; }
.flr-orders { display: grid; gap: 12px; }
.flr-order { display: grid; gap: 10px; padding: 14px 16px; border-radius: 16px; }
.flr-order header { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; align-items: center; }
.flr-order__st { font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--color-border); }
.flr-order__st--delivered, .flr-order__st--completed { color: var(--color-success); border-color: color-mix(in srgb, var(--color-success) 40%, var(--color-border)); }
.flr-order__st--revision { color: var(--color-danger); border-color: color-mix(in srgb, var(--color-danger) 40%, var(--color-border)); }
.flr-order__st--in_progress { color: var(--color-primary-ink, var(--color-primary)); border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border)); }
.flr-delivery { padding: 10px 12px; border-radius: 12px; background: var(--color-surface); border: 1px solid var(--color-border); }
.flr-delivery p { margin: 4px 0 0; font-size: 13px; }
.flr-rev-note { margin: 0; font-size: 13px; color: var(--color-danger); }
.flr-order__acts { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-start; }
.flr-order__acts details {
  min-width: min(280px, 100%); padding: 10px; border-radius: 12px; border: 1px solid var(--color-border); background: var(--color-surface);
}
.flr-order__acts summary { cursor: pointer; font-weight: 700; font-size: 13px; }
.flr-order__acts form { display: grid; gap: 8px; margin-top: 8px; }
.flr-side-list ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.flr-side-list li {
  display: flex; justify-content: space-between; gap: 10px; padding: 10px 12px;
  border-radius: 12px; border: 1px solid var(--color-border); background: var(--color-elevated);
}
.flr-chips { margin: 0; }
@media (max-width: 1100px) {
  .flr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flr-svc-layout { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .flr-grid, .flr-svc-grid, .flr-grid-2, .flr-pkg-edit, .flr-search { grid-template-columns: 1fr; }
  .flr-job, .flr-job--row { grid-template-columns: 1fr; }
}

/* ===== Profile v10 layout fix ===== */
.pro--v10 {
  gap: 16px;
}
.pro-locked {
  display: grid; justify-items: center; gap: 10px; text-align: center;
  padding: 28px 18px;
}
.pro-locked .yon-ico { color: var(--color-muted); opacity: .9; }
.pro-locked strong { font-size: 16px; font-weight: 800; color: var(--color-text); }
.pro-locked p { margin: 0; max-width: 36ch; color: var(--color-muted); font-size: 13.5px; }
.pro-card--locked { padding: 8px; }
.pro--locked > .pro-main .pro-panel { min-height: 220px; }
.pro--v10 > .pro-col {
  margin-top: -78px !important;
  overflow: visible;
  position: relative;
  z-index: 2;
}
.pro--v10 > .pro-hero.pro-hero--v10 {
  min-height: 248px;
  border-radius: 16px;
  display: block;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 18px 40px color-mix(in srgb, #000 22%, transparent);
}
.pro--v10 .pro-hero--v10 .pro-hero__veil {
  z-index: 1;
  background:
    linear-gradient(90deg, color-mix(in srgb, #061628 58%, transparent), transparent 56%),
    linear-gradient(180deg, transparent 36%, color-mix(in srgb, #061628 74%, transparent));
}
.pro--v10 .pro-hero--v10.has-img .pro-hero__veil {
  background:
    linear-gradient(90deg, color-mix(in srgb, #061628 48%, transparent), transparent 58%),
    linear-gradient(180deg, transparent 40%, color-mix(in srgb, #061628 70%, transparent));
}
.pro--v10 .pro-hero__cam {
  z-index: 4;
  top: 14px;
  right: 14px;
}
.pro--v10 .pro-id--compact {
  position: relative;
  padding: 0 14px 16px;
  text-align: center;
  overflow: visible;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 82%, var(--color-primary));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 55%, transparent), transparent 42%),
    var(--color-surface);
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset,
    0 14px 32px color-mix(in srgb, #000 16%, transparent);
}
.pro--v10 .pro-id--compact .pro-id__glow {
  position: absolute;
  inset: 0 0 auto;
  height: 96px;
  border-radius: 16px 16px 0 0;
  pointer-events: none;
  background:
    radial-gradient(120px 70px at 50% 0%, color-mix(in srgb, var(--color-primary) 28%, transparent), transparent 72%);
}
.pro--v10 .pro-id--compact .pro-id__avatar-wrap {
  width: 122px;
  height: 122px;
  margin: -64px auto 14px;
  padding: 4px;
  border-radius: 50%;
  background: linear-gradient(145deg, var(--color-primary), color-mix(in srgb, var(--color-primary-hover, var(--color-primary)) 65%, #0b1220));
  box-shadow:
    0 0 0 4px var(--color-surface),
    0 14px 30px color-mix(in srgb, #000 26%, transparent);
  position: relative;
  z-index: 2;
}
.pro--v10 .pro-id--compact .pro-id__avatar-wrap.is-online {
  box-shadow:
    0 0 0 4px var(--color-surface),
    0 0 0 7px color-mix(in srgb, var(--color-success) 55%, transparent),
    0 14px 30px color-mix(in srgb, #000 26%, transparent);
}
.pro--v10 .pro-id--compact .pro-id__avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  background: var(--color-elevated);
  border: 3px solid var(--color-surface);
  box-sizing: border-box;
}
.pro--v10 .pro-id--compact .pro-id__presence {
  position: absolute;
  left: 10px;
  bottom: 10px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--color-muted);
  border: 2.5px solid var(--color-surface);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-muted) 35%, transparent);
  z-index: 3;
}
.pro--v10 .pro-id--compact .pro-id__presence.is-on {
  background: var(--color-success);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--color-success) 40%, transparent),
    0 0 10px color-mix(in srgb, var(--color-success) 55%, transparent);
}
.pro--v10 .pro-id--compact .pro-id__av-edit {
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--color-surface);
  color: var(--color-text);
  border: 1px solid var(--color-border);
  z-index: 4;
  transition: border-color .12s ease, color .12s ease;
}
.pro--v10 .pro-id--compact .pro-id__av-edit:hover {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border));
  color: var(--color-primary-ink, var(--color-primary));
}
.pro--v10 .pro-id--compact .pro-id__who {
  position: relative;
  z-index: 1;
  text-align: center;
  display: grid;
  gap: 5px;
  margin-bottom: 12px;
  justify-items: center;
}
.pro--v10 .pro-id--compact .pro-id__name {
  margin: 0;
  font-size: 1.28rem;
  line-height: 1.2;
  letter-spacing: -.025em;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
}
.pro--v10 .pro-id--compact .pro-id__ok {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  font-size: 11px;
  font-style: normal;
  color: #04101f;
  background: #38bdf8;
  box-shadow: 0 0 0 2px color-mix(in srgb, #38bdf8 25%, transparent);
}
.pro--v10 .pro-id--compact .pro-id__handle {
  margin: 0;
  color: var(--color-muted);
  font-size: 13px;
  font-weight: 650;
}
.pro--v10 .pro-id--compact .pro-id__title {
  margin: 0;
  max-width: 100%;
  color: var(--color-text);
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1.35;
  opacity: .88;
}
.pro--v10 .pro-id--compact .pro-id__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin-top: 6px;
}
.pro--v10 .pro-id--compact .pro-id__rank {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  color: #fde68a;
  border: 1px solid color-mix(in srgb, #f59e0b 35%, var(--color-border));
  background: color-mix(in srgb, #f59e0b 12%, var(--color-elevated));
}
.pro--v10 .pro-id--compact .pro-id__rank svg {
  flex: 0 0 auto;
  color: #fbbf24;
}
.pro--v10 .pro-id--compact .pro-id__status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  color: var(--color-muted);
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 72%, transparent);
}
.pro--v10 .pro-id--compact .pro-id__status.is-on {
  color: #86efac;
  border-color: color-mix(in srgb, #22c55e 32%, var(--color-border));
  background: color-mix(in srgb, #22c55e 12%, transparent);
}
.pro--v10 .pro-id--compact .pro-ranks {
  justify-content: center;
  margin-top: 8px;
  gap: 6px;
}
.pro--v10 .pro-id--compact .pro-id__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  margin: 0 0 12px;
  padding: 8px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--color-border) 90%, var(--color-primary));
  background: color-mix(in srgb, var(--color-elevated) 42%, transparent);
}
.pro--v10 .pro-id--compact .pro-id__stats a {
  display: grid;
  gap: 2px;
  justify-items: center;
  padding: 8px 4px;
  border-radius: 10px;
  border: 1px solid transparent;
  background: transparent;
  color: inherit;
  text-decoration: none;
  transition: background .12s ease, border-color .12s ease, transform .12s ease;
}
.pro--v10 .pro-id--compact .pro-id__stats a:hover {
  color: inherit;
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  transform: translateY(-1px);
}
.pro--v10 .pro-id--compact .pro-id__stats strong {
  font-size: 15.5px;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  font-weight: 800;
}
.pro--v10 .pro-id--compact .pro-id__stats span {
  color: var(--color-muted);
  font-size: 10.5px;
  font-weight: 750;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.pro--v10 .pro-id--compact .pro-id__btns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.pro--v10 .pro-id--compact .pro-id__btns form {
  display: grid;
  min-width: 0;
}
.pro--v10 .pro-id--compact .pro-id__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 40px;
  padding: 0 12px;
  border-radius: 11px;
  border: 0;
  font: inherit;
  font-size: 12.5px;
  font-weight: 800;
  cursor: pointer;
  text-decoration: none;
  color: #fff;
  background: linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 92%, #fff), var(--color-primary));
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-primary) 24%, transparent);
  transition: filter .12s ease, transform .12s ease, background .12s ease;
}
.pro--v10 .pro-id--compact .pro-id__cta:hover {
  color: #fff;
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.pro--v10 .pro-id--compact .pro-id__cta--ghost {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-elevated) 78%, transparent);
  border: 1px solid var(--color-border);
  box-shadow: none;
}
.pro--v10 .pro-id--compact .pro-id__cta--ghost:hover {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-hover, var(--color-elevated)) 85%, transparent);
  filter: none;
}
.pro--v10 .pro-id--compact .pro-id__cta--wide {
  grid-column: 1 / -1;
}
.pro--v10 .pro-id--compact .pro-id__actions {
  margin-top: 10px;
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 5;
}
.pro--v10 .pro-id--compact .pro-id__more {
  width: 100%;
  position: relative;
  font-size: 12.5px;
  text-align: center;
}
.pro--v10 .pro-id--compact .pro-id__more summary {
  list-style: none;
  cursor: pointer;
  color: var(--color-muted);
  font-weight: 700;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border-radius: 9px;
  transition: color .12s ease, background .12s ease;
}
.pro--v10 .pro-id--compact .pro-id__more summary::-webkit-details-marker { display: none; }
.pro--v10 .pro-id--compact .pro-id__more summary:hover,
.pro--v10 .pro-id--compact .pro-id__more[open] summary {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
}
.pro--v10 .pro-id--compact .pro-id__more-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  z-index: 20;
  display: grid;
  gap: 2px;
  padding: 8px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: 0 16px 36px color-mix(in srgb, #000 28%, transparent);
  text-align: left;
}
.pro--v10 .pro-id--compact .pro-id__more-panel form { margin: 0; }
.pro--v10 .pro-id--compact .pro-id__more-panel button {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  border-radius: 8px;
  color: var(--color-text);
  padding: 9px 10px;
  font: inherit;
  font-size: 12.5px;
  font-weight: 650;
  cursor: pointer;
}
.pro--v10 .pro-id--compact .pro-id__more-panel button:hover {
  background: color-mix(in srgb, var(--color-elevated) 80%, transparent);
}
.pro--v10 .pro-id--compact .pro-id__more-panel button.is-danger {
  color: #fca5a5;
}
.pro--v10 .pro-id--compact .pro-id__more-panel button.is-danger:hover {
  background: color-mix(in srgb, #ef4444 12%, transparent);
}
.pro--v10 .pro-tabs {
  display: flex !important;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  grid-template-columns: none;
  overflow: visible;
}
.pro--v10 .pro-tabs > a {
  flex: 0 0 auto;
  border-right: 0;
  border-radius: 10px;
  padding: 9px 11px;
  font-size: 12.5px;
}
.pro--v10 .pro-tabs__more {
  margin-left: auto;
}
.pro--v10 .pro-tabs__more summary {
  border-radius: 10px;
  padding: 9px 12px;
}
.pro--v10 .pro-tabs__more:not([open]) > div {
  display: none;
}
.pro--v10 .pro-card--about-side {
  display: none;
}
@media (max-width: 980px) {
  .pro--v10 > .pro-col {
    margin-top: -52px !important;
  }
  .pro--v10 > .pro-hero.pro-hero--v10 {
    min-height: 200px;
  }
}
.pro-feed-hint { margin: 0 0 10px; }
.pro-feed-hint a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  font-size: 13px;
}
.pro-people-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-right: 10px !important;
}
.pro-people-row__link {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  flex: 1;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
.flw--v10 {
  display: grid;
  gap: 16px;
  padding: 8px 0 32px;
  max-width: min(1100px, 100%);
  margin: 0 auto;
}
.flw-hero {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  align-items: flex-start;
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 20%, var(--color-border));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 55%),
    var(--color-elevated);
}
.flw-hero .kicker {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.flw-hero h1 { margin: 0 0 6px; font-size: 1.4rem; }
.flw-hero__acts { display: flex; flex-wrap: wrap; gap: 8px; }
.flw-people { display: flex; flex-wrap: wrap; gap: 8px; }
.flw-people a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 6px;
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: inherit;
  text-decoration: none;
  font-size: 12.5px;
  font-weight: 700;
}
.flw-people__av, img.flw-people__av,
.flw-row__av, img.flw-row__av {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  background: var(--color-elevated);
}
.flw-row__av, img.flw-row__av { width: 40px; height: 40px; }
.flw-list { display: grid; gap: 8px; }
.flw-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--color-border);
  background: var(--color-elevated);
  color: inherit;
  text-decoration: none;
}
.flw-row__body { display: grid; gap: 2px; min-width: 0; }
.flw-row__body strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.flw-row__body small,
.flw-row time { color: var(--color-muted); font-size: 12.5px; }
.flw-empty {
  padding: 28px 16px;
  border-radius: 16px;
  border: 1px dashed var(--color-border);
  background: var(--color-elevated);
  text-align: center;
  display: grid;
  gap: 10px;
  justify-items: center;
}
@media (max-width: 980px) {
  .pro--v10 > .pro-col { margin-top: 0 !important; }
  .pro--v10 > .pro-hero.pro-hero--v10 { min-height: 280px; }
}
@media (max-width: 720px) {
  .pro-hero__ava-wrap,
  .pro-hero__ava { width: 88px; height: 88px; }
  .pro-hero__name { font-size: 1.35rem; }
  .pro--v10 .pro-tabs > a span { /* keep labels on mobile */ }
  .flw-row { grid-template-columns: 40px minmax(0, 1fr); }
  .flw-row time { grid-column: 2; }
}
/* ===== Tags v10 + post badges ===== */
.tag-index--v10, .tag-show--v10 { display: grid; gap: 16px; }
.tg10-head { display: flex; gap: 16px; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; }
.tg10-head h1, .tg10-hero h1 { margin: 0; font-size: 1.55rem; letter-spacing: -.02em; }
.tg10-eyebrow { margin: 0 0 4px; color: var(--color-muted); font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.tg10-lead, .tg10-desc { margin: 8px 0 0; color: var(--color-muted); max-width: 62ch; line-height: 1.45; }
.tg10-desc--muted { opacity: .75; }
.tg10-sort { display: flex; gap: 6px; flex-wrap: wrap; }
.tg10-sort__link {
  display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border-radius: 10px;
  border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-muted);
  font-size: 12.5px; font-weight: 800; text-decoration: none;
}
.tg10-sort__link:hover { color: var(--color-text); border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border)); }
.tg10-sort__link.is-active {
  color: #fff; border-color: transparent;
  background: color-mix(in srgb, var(--color-primary) 88%, #1e3a5f);
}
.tg10-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.tg10-chip {
  display: grid; gap: 4px; padding: 14px 14px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 85%, var(--color-primary));
  background: var(--color-surface); color: inherit; text-decoration: none;
  transition: border-color .12s ease, transform .12s ease;
}
.tg10-chip:hover { border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border)); transform: translateY(-1px); color: inherit; }
.tg10-chip strong { font-size: 15px; }
.tg10-chip span { color: var(--color-muted); font-size: 12px; font-weight: 700; }
.tg10-hero {
  padding: 18px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 85%, var(--color-primary));
  background:
    radial-gradient(220px 100px at 0% 0%, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 70%),
    var(--color-surface);
}
.tg10-hero__row { display: flex; gap: 16px; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; margin-top: 10px; }
.tg10-stats { display: flex; gap: 14px; margin-top: 12px; flex-wrap: wrap; color: var(--color-muted); font-size: 13px; }
.tg10-stats strong { color: var(--color-text); margin-right: 4px; }
.tg10-hero__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.tg10-cta {
  display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0 14px;
  border-radius: 11px; border: 0; font: inherit; font-size: 13px; font-weight: 800; cursor: pointer;
  text-decoration: none; color: #fff; background: var(--color-primary);
}
.tg10-cta--ghost {
  color: var(--color-text); background: var(--color-elevated); border: 1px solid var(--color-border);
}
.tg10-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; align-items: start; }
.tg10-panel {
  border-radius: 14px; border: 1px solid var(--color-border); background: var(--color-surface); overflow: hidden;
}
.tg10-panel__head {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 12px 14px; border-bottom: 1px solid var(--color-border);
}
.tg10-panel__head h2 { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--color-muted); }
.tg10-panel__head span { color: var(--color-muted); font-size: 12px; font-weight: 700; }
.tg10-list { list-style: none; margin: 0; padding: 0; }
.tg10-row {
  display: grid; gap: 4px; padding: 12px 14px; border-bottom: 1px solid var(--color-border);
  color: inherit; text-decoration: none;
}
.tg10-row:hover { background: color-mix(in srgb, var(--color-elevated) 55%, transparent); color: inherit; }
.tg10-row span { color: var(--color-muted); font-size: 12.5px; }
.tg10-popular { list-style: none; margin: 0; padding: 8px 0; counter-reset: pop; }
.tg10-popular li { border-bottom: 1px solid var(--color-border); }
.tg10-popular a {
  display: grid; gap: 4px; padding: 10px 14px; color: inherit; text-decoration: none;
}
.tg10-popular a:hover { background: color-mix(in srgb, var(--color-elevated) 55%, transparent); color: inherit; }
.tg10-popular small { color: var(--color-muted); font-size: 12px; }
.tg10-empty { margin: 0; padding: 18px 14px; color: var(--color-muted); }
.tg10-pager { display: flex; gap: 12px; align-items: center; justify-content: center; padding: 12px; }
.tg10-pager a { font-weight: 700; }
.post__badges { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0 0; }
.post-badge {
  display: inline-flex; align-items: center; gap: 4px; min-height: 22px; padding: 0 8px;
  border-radius: 999px; border: 1px solid var(--color-border); background: var(--color-elevated);
  color: var(--color-muted); font-size: 11px; font-weight: 700;
}
.acp-tagrow { display: grid !important; gap: 8px; padding: 14px; border-bottom: 1px solid var(--color-border); }
.acp-tagrow__top { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
@media (max-width: 980px) {
  .tg10-layout { grid-template-columns: 1fr; }
}
/* ===== User stats v10 ===== */
.ustats--v10 { display: grid; gap: 16px; }
.ustats__section {
  padding: 14px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 40%, transparent), transparent 40%),
    var(--color-surface);
}
.ustats__head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  margin-bottom: 10px;
}
.ustats__head h3 {
  margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--color-muted);
}
.ustats__head span { color: var(--color-muted); font-size: 11.5px; font-weight: 650; }
.ustats__grid {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px;
}
.ustats__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ustats__card {
  display: grid; gap: 4px; padding: 12px 12px;
  border-radius: 12px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
.ustats__card--muted { opacity: .92; }
.ustats__card span {
  color: var(--color-muted); font-size: 11.5px; font-weight: 750;
}
.ustats__card strong {
  font-size: 1.2rem; letter-spacing: -.02em; font-variant-numeric: tabular-nums;
}
.ustats__card small {
  color: var(--color-muted); font-size: 11.5px; line-height: 1.35;
}
.ustats__bars {
  display: grid; grid-template-columns: repeat(14, minmax(0, 1fr));
  gap: 4px; align-items: end; min-height: 110px; padding-top: 6px;
}
.ustats__bars i {
  display: grid; grid-template-rows: 1fr auto; justify-items: center; gap: 4px;
  min-height: 100px; color: var(--color-muted); font-style: normal; font-size: 9.5px;
}
.ustats__bars b {
  display: block; width: 100%; max-width: 18px; align-self: end; justify-self: center;
  border-radius: 6px 6px 3px 3px;
  background: linear-gradient(180deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 55%, #0b1220));
  min-height: 6px;
}
@media (max-width: 980px) {
  .ustats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ustats__bars { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .ustats__bars i:nth-child(n+8) { display: none; }
}
@media (max-width: 560px) {
  .ustats__grid--2 { grid-template-columns: 1fr; }
}
/* Ads system v10 ? layout / sponsor / popup */
.mast-ad--v10 {
  max-width: min(1560px, calc(100% - 32px));
  margin: 10px auto 12px;
  padding: 0;
  max-height: 72px;
  overflow: hidden;
}
.mast-ad--v10 .nx-ad--header,
.mast-ad--v10 .yon-mark--header {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; max-height: 64px; padding: 8px 14px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface) 92%, var(--color-primary));
  text-decoration: none; color: var(--color-text);
  box-sizing: border-box;
}
.mast-ad--v10 .nx-ad--media img { max-height: 72px; width: auto; max-width: 100%; object-fit: contain; border-radius: 8px; }
.app-ad--banner, .app-ad--footer {
  max-width: min(1560px, calc(100% - 32px));
  margin: 12px auto;
}
.app-ad--banner .nx-ad, .app-ad--footer .nx-ad {
  display: grid; place-items: center; min-height: 90px; padding: 12px;
  border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-surface); text-decoration: none; color: var(--color-text);
}
.app-ad--banner .nx-ad--media img, .app-ad--footer .nx-ad--media img {
  width: 100%; max-height: 120px; object-fit: cover; border-radius: 10px;
}

/* Fixed left/right skyscraper rails */
.nx-rail {
  display: none;
  position: fixed;
  top: 120px;
  z-index: 35;
  width: 160px;
  max-height: calc(100vh - 140px);
  overflow: auto;
  padding: 0;
}
.nx-rail--left { left: max(8px, calc(50% - 780px - 176px)); }
.nx-rail--right { right: max(8px, calc(50% - 780px - 176px)); }
.nx-rail .nx-ad,
.nx-rail .nx-ad--rail {
  display: block;
  width: 160px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
  background: var(--color-surface);
  text-decoration: none;
  color: var(--color-text);
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.nx-rail .nx-ad--media img {
  display: block;
  width: 160px;
  height: auto;
  max-height: 600px;
  object-fit: contain;
  background: var(--color-surface);
}
.nx-rail .nx-ad--html { padding: 0; width: 160px; }
@media (min-width: 1280px) {
  .nx-rail { display: block; }
  .app-frame--rail-left { padding-left: 0; }
  .app-frame--rail-right { padding-right: 0; }
}
@media (max-width: 1279px) {
  .nx-rail { display: none !important; }
}

.yon-mark-mobile--v10 {
  display: none !important;
}
.yon-mark-mobile--v10 .nx-ad,
.yon-mark-mobile--v10 .yon-mark {
  display: none !important;
}
.nx-sponsor--v10 {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px;
  border-radius: 14px; text-decoration: none; color: var(--color-text);
  border: 1px solid color-mix(in srgb, #f59e0b 35%, var(--color-border));
  background: linear-gradient(135deg, color-mix(in srgb, #f59e0b 12%, var(--color-surface)), var(--color-surface));
}
.nx-sponsor__img, .nx-sponsor__mark {
  width: 44px; height: 44px; border-radius: 12px; flex: none;
  object-fit: cover; display: grid; place-items: center;
  background: color-mix(in srgb, #f59e0b 18%, var(--color-elevated));
  color: #f59e0b;
}
.nx-sponsor__body { display: grid; gap: 2px; min-width: 0; }
.nx-sponsor__body em {
  font-style: normal; font-size: 11px; font-weight: 780; letter-spacing: .04em;
  text-transform: uppercase; color: #d97706;
}
.nx-sponsor__body strong { font-size: 14px; font-weight: 780; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nx-sponsor__body small { color: var(--color-muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fs10-ad--sponsor, .hs10-sponsor, .pro-sponsor, .nx-ad-slot--sponsor { margin: 0 0 12px; }
.nx-ad-popup {
  position: fixed; inset: 0; z-index: 120; display: grid; place-items: center;
  padding: 20px; background: color-mix(in srgb, #000 55%, transparent);
}
.nx-ad-popup[hidden] { display: none !important; }
.nx-ad-popup__card {
  position: relative; width: min(440px, 100%); border-radius: 18px; overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-primary) 25%, var(--color-border));
  background: var(--color-surface); box-shadow: 0 24px 60px color-mix(in srgb, #000 40%, transparent);
}
.nx-ad-popup__close {
  position: absolute; top: 8px; right: 8px; z-index: 2;
  width: 34px; height: 34px; border-radius: 999px; border: 0;
  background: color-mix(in srgb, #000 45%, transparent); color: #fff;
  font-size: 22px; line-height: 1; cursor: pointer;
}
.nx-ad-popup__media img { display: block; width: 100%; max-height: 220px; object-fit: cover; }
.nx-ad-popup__copy { display: grid; gap: 10px; padding: 16px 18px 18px; }
.nx-ad-popup__copy strong { font-size: 16px; font-weight: 800; }
.nx-ad-popup__copy p { margin: 0; color: var(--color-muted); font-size: 13.5px; line-height: 1.45; }
.nx-ad--list, .nx-ad--thread, .nx-ad--header, .nx-ad--footer, .nx-ad--mobile, .nx-ad--banner {
  display: flex; flex-direction: column; gap: 4px; padding: 12px 14px;
  border-radius: 14px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent);
  text-decoration: none; color: var(--color-text);
}

/* Premium tiers shop v10 */
.shop--premium .shop-grid--tiers {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.shop-card--tier {
  border-color: color-mix(in srgb, var(--tier, var(--color-primary)) 28%, var(--color-border));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--tier, var(--color-primary)) 10%, transparent), transparent 42%),
    var(--color-surface);
}
.shop-card--tier.is-current {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tier) 55%, var(--color-border));
}
.shop-card--tier .shop-card__badge {
  display: inline-block; font-size: 13px; font-weight: 800;
  color: var(--tier); letter-spacing: .02em;
}
.shop-card--tier b small {
  display: block; font-size: 11px; font-weight: 700; color: var(--color-muted);
  text-transform: uppercase; letter-spacing: .04em; margin-bottom: 2px;
}
.shop-card__skus { display: grid; gap: 8px; width: 100%; }
.shop-card__skus .nx-btn { width: 100%; }
@media (max-width: 980px) {
  .shop--premium .shop-grid--tiers { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .shop--premium .shop-grid--tiers { grid-template-columns: 1fr; }
}

/* Company / corporate profile v10 */
.co--v10 { display: grid; gap: 16px; }
.co-hero {
  position: relative; overflow: hidden; border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background:
    radial-gradient(1200px 280px at 10% -20%, color-mix(in srgb, var(--color-primary) 28%, transparent), transparent 60%),
    var(--color-surface);
  min-height: 280px;
}
.co-hero.has-cover {
  background-image: linear-gradient(180deg, color-mix(in srgb, #000 35%, transparent), color-mix(in srgb, #000 72%, transparent)), var(--co-cover);
  background-size: cover; background-position: center;
}
.co-hero__inner {
  position: relative; z-index: 1;
  display: grid; gap: 16px;
  padding: 22px 22px 20px;
  max-width: min(1560px, 100%);
}
.co-brand { display: flex; gap: 16px; align-items: flex-end; flex-wrap: wrap; }
.co-brand__logo {
  width: 88px; height: 88px; border-radius: 18px; object-fit: cover; flex: none;
  border: 2px solid color-mix(in srgb, #fff 55%, transparent);
  background: var(--color-elevated);
  box-shadow: 0 12px 28px color-mix(in srgb, #000 28%, transparent);
}
.co-brand__copy { min-width: 0; display: grid; gap: 4px; }
.co-brand__copy h1 {
  margin: 0; font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 860; letter-spacing: -.03em;
  color: #fff; text-shadow: 0 1px 12px color-mix(in srgb, #000 35%, transparent);
}
.co-hero:not(.has-cover) .co-brand__copy h1 { color: var(--color-text); text-shadow: none; }
.co-brand__tag { margin: 0; color: color-mix(in srgb, #fff 82%, transparent); font-size: 14px; }
.co-hero:not(.has-cover) .co-brand__tag { color: var(--color-muted); }
.co-verified {
  display: inline-flex; align-items: center; gap: 6px; width: fit-content;
  padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 780;
  color: #052e16; background: #86efac; border: 1px solid #4ade80;
}
.co-tags {
  display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0;
}
.co-tags li {
  padding: 6px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 750;
  color: #fff; background: color-mix(in srgb, #000 28%, transparent);
  border: 1px solid color-mix(in srgb, #fff 22%, transparent);
}
.co-hero:not(.has-cover) .co-tags li {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-elevated) 80%, transparent);
  border-color: var(--color-border);
}
.co-stats { display: flex; flex-wrap: wrap; gap: 10px; }
.co-stat {
  display: grid; gap: 2px; min-width: 120px; padding: 10px 14px; border-radius: 14px;
  background: color-mix(in srgb, #000 32%, transparent);
  border: 1px solid color-mix(in srgb, #fff 16%, transparent);
  color: #fff;
}
.co-hero:not(.has-cover) .co-stat {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-elevated) 75%, transparent);
  border-color: var(--color-border);
}
.co-stat strong { font-size: 18px; font-weight: 820; letter-spacing: -.02em; }
.co-stat span { font-size: 12px; opacity: .85; }
.co-cta { display: flex; flex-wrap: wrap; gap: 8px; }
.co-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start;
}
.co-main, .co-side, .co-edit__grid { display: grid; gap: 14px; }
.co-edit__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.co-card {
  padding: 16px 18px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-border) 88%, var(--color-primary));
  background: var(--color-surface);
}
.co-card > header {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin: 0 0 12px;
}
.co-card > header h2 { margin: 0; font-size: 15px; font-weight: 820; }
.co-card > header a { color: var(--color-primary-ink, var(--color-primary)); font-size: 12.5px; font-weight: 750; text-decoration: none; }
.co-prose { color: var(--color-muted); font-size: 14px; line-height: 1.55; }
.co-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.co-product {
  display: grid; gap: 4px; padding: 12px 14px; border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 60%, transparent);
}
.co-product strong { font-size: 13.5px; }
.co-product span { color: var(--color-muted); font-size: 12.5px; }
.co-list { display: grid; gap: 6px; }
.co-list__row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 12px; border-radius: 12px; text-decoration: none; color: var(--color-text);
  border: 1px solid transparent;
}
.co-list__row:hover { border-color: var(--color-border); background: color-mix(in srgb, var(--color-elevated) 50%, transparent); }
.co-list__row span { color: var(--color-muted); font-size: 12.5px; flex: none; }
.co-people { display: grid; gap: 8px; }
.co-people__item { display: flex; align-items: center; gap: 10px; }
.co-people__av {
  width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; flex: none;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary)); font-weight: 800; font-size: 12px;
  object-fit: cover;
}
img.co-people__av { padding: 0; background: transparent; display: block; }
.co-people__item strong { display: block; font-size: 13.5px; }
.co-people__item small { color: var(--color-muted); font-size: 12px; }
.co-dl { display: grid; gap: 10px; margin: 0; }
.co-dl > div { display: grid; gap: 2px; }
.co-dl dt { font-size: 11px; font-weight: 780; letter-spacing: .04em; text-transform: uppercase; color: var(--color-muted); }
.co-dl dd { margin: 0; font-size: 13.5px; }
.co-social { display: flex; flex-wrap: wrap; gap: 8px; }
.co-social a {
  padding: 7px 11px; border-radius: 999px; text-decoration: none; font-size: 12.5px; font-weight: 750;
  color: var(--color-text); border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
@media (max-width: 980px) {
  .co-grid, .co-edit__grid, .co-product-grid { grid-template-columns: 1fr; }
}

/* Verification badges + panel v10 */
.pro-badge--blue, .post-badge--blue { color: #93c5fd; border-color: color-mix(in srgb, #3b82f6 40%, var(--color-border)); background: color-mix(in srgb, #3b82f6 12%, transparent); }
.pro-badge--green, .post-badge--green { color: #86efac; border-color: color-mix(in srgb, #22c55e 40%, var(--color-border)); background: color-mix(in srgb, #22c55e 12%, transparent); }
.pro-badge--purple, .post-badge--purple { color: #d8b4fe; border-color: color-mix(in srgb, #a855f7 40%, var(--color-border)); background: color-mix(in srgb, #a855f7 12%, transparent); }
.pro-badge--gold, .post-badge--gold { color: #fde68a; border-color: color-mix(in srgb, #eab308 45%, var(--color-border)); background: color-mix(in srgb, #eab308 14%, transparent); }
.pro-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 750;
  border: 1px solid var(--color-border);
}
.vx--v10 { display: grid; gap: 16px; }
.vx-lead { margin: 0; font-size: 13.5px; line-height: 1.5; max-width: 64ch; color: var(--color-muted); }
.vx-top {
  display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 16px; align-items: center;
  padding: 16px 18px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 24%, var(--color-border));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--color-primary) 14%, var(--color-surface)), var(--color-surface));
}
.vx-progress { margin: 0; }
.vx-progress__bar {
  height: 9px; border-radius: 999px; overflow: hidden;
  background: color-mix(in srgb, var(--color-border) 70%, transparent);
  margin-bottom: 8px;
}
.vx-progress__bar i {
  display: block; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, #3b82f6, #22c55e 55%, #a855f7);
}
.vx-progress p { margin: 0; color: var(--color-muted); font-size: 13px; }
.vx-progress strong { color: var(--color-text); font-variant-numeric: tabular-nums; }
.vx-badges { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.vx-badge {
  padding: 6px 11px; border-radius: 999px; font-size: 12px; font-weight: 780;
  border: 1px dashed var(--color-border); color: var(--color-muted); opacity: .55;
}
.vx-badge.is-on { opacity: 1; border-style: solid; }
.vx-badge--blue.is-on { color: #93c5fd; background: color-mix(in srgb, #3b82f6 18%, transparent); border-color: #3b82f6; }
.vx-badge--green.is-on { color: #86efac; background: color-mix(in srgb, #22c55e 16%, transparent); border-color: #22c55e; }
.vx-badge--purple.is-on { color: #d8b4fe; background: color-mix(in srgb, #a855f7 16%, transparent); border-color: #a855f7; }
.vx-badge--gold.is-on { color: #fde68a; background: color-mix(in srgb, #eab308 16%, transparent); border-color: #eab308; }
.vx-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start;
}
.vx-card {
  margin: 0; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 14%, var(--color-border));
  background: var(--color-surface);
}
.vx-card--wide { grid-column: 1 / -1; }
.vx-checklist { padding: 4px 16px 14px; margin: 0; list-style: none; }
.vx-checklist li {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 10px 0; border-top: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
}
.vx-checklist li:first-child { border-top: 0; }
.vx-checklist li span {
  flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center; font-size: 12px; font-weight: 800;
  background: var(--color-elevated); color: var(--color-muted);
}
.vx-checklist li.is-ok span {
  background: color-mix(in srgb, #22c55e 22%, transparent); color: #86efac;
}
.vx-checklist li.is-wait span {
  background: color-mix(in srgb, #f59e0b 22%, transparent); color: #fbbf24;
}
.vx-checklist strong { display: block; font-size: 13.5px; }
.vx-checklist small { color: var(--color-muted); font-size: 12px; }
.cp-box.vx-card > .cp-box__head { margin: 0; padding: 14px 16px 0; border: 0; }
.cp-box.vx-card > .cp-box__head h2 { margin: 0; font-size: 15px; font-weight: 800; }
.cp:has(.vx--v10) { gap: 24px; }
.cp:has(.vx--v10) .cp-head { margin-bottom: 18px; }
.cp:has(.vx--v10) .cp-head h1 { font-size: 24px; letter-spacing: -.02em; }
@media (max-width: 900px) {
  .vx-top { grid-template-columns: 1fr; }
  .vx-badges { justify-content: flex-start; }
  .vx-grid { grid-template-columns: 1fr; }
  .vx-card--wide { grid-column: auto; }
}

/* Report / ?ikayet v10 ? orange bar btn + centered notify popup */
.post--v10 .post__bar-right .post__num + .post-rpt__btn { margin-left: -8px; }
.post-rpt__btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; padding: 0; margin: 0;
  border: 0; border-radius: 0 8px 8px 0; cursor: pointer;
  background: #f97316; color: #fff;
  text-decoration: none; flex: none;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, #ea580c 55%, transparent);
  position: relative;
}
.post-rpt__btn:hover { background: #ea580c; color: #fff; }
.post-rpt__btn .yon-ico { display: block; }
.post--v10 .post__num {
  border-radius: 8px 0 0 8px;
  margin-right: 0;
}
.post--v10 .post__bar-right:has(.post-rpt__btn) .post__num { border-right: 0; }
.post-rpt__btn:hover::after {
  content: attr(title);
  position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%);
  z-index: 50; white-space: nowrap;
  padding: 6px 10px; border-radius: 6px;
  background: #0b1220; color: #fff;
  font-size: 12px; font-weight: 650; line-height: 1.2;
  pointer-events: none;
  box-shadow: 0 8px 20px color-mix(in srgb, #000 40%, transparent);
}
.post-rpt__btn:hover::before {
  content: '';
  position: absolute; top: calc(100% + 2px); left: 50%; transform: translateX(-50%);
  border: 6px solid transparent; border-bottom-color: #0b1220;
  z-index: 51; pointer-events: none;
}

.rpt-dialog {
  border: 0; padding: 0; background: transparent;
  max-width: min(420px, calc(100vw - 28px));
  width: 100%;
  margin: auto;
}
.rpt-dialog::backdrop {
  background: rgba(6, 8, 14, .68);
  backdrop-filter: blur(5px);
}
.rpt-dialog__sheet {
  margin: 0; border: 1px solid color-mix(in srgb, #f97316 28%, var(--color-border));
  border-radius: 16px; overflow: hidden;
  background: var(--color-surface); color: var(--color-text);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .5);
  display: grid;
}
.rpt-dialog__head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--color-border);
  background:
    linear-gradient(145deg, color-mix(in srgb, #f97316 14%, var(--color-surface)), var(--color-surface));
}
.rpt-dialog__kicker {
  margin: 0 0 2px; font-size: 10px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: #fb923c;
}
.rpt-dialog__head strong { display: block; font-size: 15px; font-weight: 800; }
.rpt-dialog__close {
  width: 34px; height: 34px; border: 0; border-radius: 10px; cursor: pointer; flex: none;
  background: var(--color-elevated); color: var(--color-text); font-size: 22px; line-height: 1;
}
.rpt-dialog__close:hover { color: var(--color-primary-ink, var(--color-primary)); }
.rpt-dialog__body { padding: 14px 16px 8px; display: grid; gap: 12px; }
.rpt-dialog__lead { margin: 0; font-size: 13px; color: var(--color-muted); }
.rpt-dialog__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
}
.rpt-dialog__opt {
  display: flex; align-items: center; gap: 8px; margin: 0;
  padding: 10px 11px; border-radius: 12px; cursor: pointer;
  border: 1px solid var(--color-border);
  background: var(--color-elevated);
  font-size: 12.5px; font-weight: 700;
}
.rpt-dialog__opt:has(input:checked) {
  border-color: #f97316;
  background: color-mix(in srgb, #f97316 14%, var(--color-elevated));
  color: #fdba74;
}
.rpt-dialog__opt input {
  width: 15px; height: 15px; accent-color: #f97316; flex: none; margin: 0;
}
.rpt-dialog__note { display: grid; gap: 5px; margin: 0; }
.rpt-dialog__note span { font-size: 11px; font-weight: 700; color: var(--color-muted); }
.rpt-dialog__note textarea {
  width: 100%; resize: vertical; min-height: 68px;
  border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text);
  padding: 10px 12px; font: inherit; font-size: 13px;
}
.rpt-dialog__foot {
  display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap;
  padding: 12px 16px 16px; border-top: 1px solid var(--color-border);
}
@media (max-width: 560px) {
  .rpt-dialog__grid { grid-template-columns: 1fr; }
}

.rpt-admin--v10 { display: grid; gap: 16px; }
.rpt-admin__layout {
  display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; align-items: start;
}
.rpt-admin__queue { display: grid; gap: 12px; }
.rpt-card {
  border-radius: 16px; padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 16%, var(--color-border));
  background: var(--color-surface);
}
.rpt-card.is-review {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--color-border));
  background: color-mix(in srgb, #f59e0b 6%, var(--color-surface));
}
.rpt-card__head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-bottom: 10px;
}
.rpt-card__head strong { font-size: 15px; font-weight: 800; }
.rpt-card__status {
  font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 999px; border: 1px solid var(--color-border);
  color: var(--color-muted);
}
.rpt-card__status--open { color: #93c5fd; border-color: #3b82f6; background: color-mix(in srgb, #3b82f6 14%, transparent); }
.rpt-card__status--reviewing { color: #fde68a; border-color: #f59e0b; background: color-mix(in srgb, #f59e0b 14%, transparent); }
.rpt-card__status--resolved { color: #86efac; border-color: #22c55e; background: color-mix(in srgb, #22c55e 14%, transparent); }
.rpt-card__status--rejected { color: #fca5a5; border-color: #ef4444; background: color-mix(in srgb, #ef4444 14%, transparent); }
.rpt-card__meta {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 14px;
  margin: 0 0 12px;
}
.rpt-card__meta div { min-width: 0; }
.rpt-card__meta dt {
  margin: 0 0 2px; font-size: 10px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--color-muted);
}
.rpt-card__meta dd { margin: 0; font-size: 13.5px; font-weight: 700; }
.rpt-card__meta a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.rpt-card__note, .rpt-card__thread {
  margin: 0 0 10px; font-size: 13px; color: var(--color-muted);
  padding: 8px 10px; border-radius: 10px; background: var(--color-elevated);
}
.rpt-card__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.rpt-card__actions form { margin: 0; }
.rpt-admin__side .nx-form { display: grid; gap: 10px; }
@media (max-width: 980px) {
  .rpt-admin__layout { grid-template-columns: 1fr; }
  .rpt-card__meta { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .rpt-card__meta { grid-template-columns: 1fr; }
}

/* Moderation ACP v10 */
.mod-page--v10 { display: grid; gap: 16px; }
.mod-kpis {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;
}
.mod-kpis article {
  padding: 14px 16px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 16%, var(--color-border));
  background: var(--color-surface);
}
.mod-kpis span { display: block; color: var(--color-muted); font-size: 12px; font-weight: 700; margin-bottom: 4px; }
.mod-kpis strong { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; }
.mod-tools {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px;
}
.mod-tool {
  border-radius: 14px; padding: 14px;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  display: grid; gap: 10px; align-content: start;
}
.mod-tool header strong { display: block; font-size: 14px; font-weight: 800; }
.mod-tool header small { color: var(--color-muted); font-size: 12px; }
.mod-tool .nx-form { display: grid; gap: 8px; }
.mod-tool label { display: grid; gap: 4px; margin: 0; font-size: 12px; font-weight: 700; color: var(--color-muted); }
.mod-tool input, .mod-tool textarea {
  width: 100%; border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text);
  padding: 8px 10px; font: inherit; font-size: 13px; font-weight: 600;
}
.mod-lists { display: grid; gap: 14px; }
.mod-row {
  display: flex; gap: 12px; align-items: center; justify-content: space-between;
  padding: 10px 0; border-bottom: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
}
.mod-row:last-child { border-bottom: 0; }
.mod-row strong { display: block; font-size: 13.5px; }
.mod-row small { color: var(--color-muted); font-size: 12px; }
.mod-row form { margin: 0; flex: none; }
@media (max-width: 900px) {
  .mod-kpis { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .mod-kpis { grid-template-columns: 1fr; }
  .mod-row { flex-direction: column; align-items: flex-start; }
}

/* ===== Mobil Sistem v10 / PWA ===== */
.mast-cta--mob { display: none; }
.dock__item {
  position: relative;
  display: grid; justify-items: center; gap: 3px; min-width: 56px;
  color: var(--color-muted); font-size: 10.5px; font-weight: 700;
  text-decoration: none; padding: 6px 4px; border-radius: 10px;
  background: transparent; border: 0; cursor: pointer; font: inherit;
}
.dock__item .yon-ico { opacity: .85; }
.dock__item.is-active {
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
}
.dock__item.is-active .yon-ico { opacity: 1; }
.dock__compose {
  width: 48px; height: 48px; margin-top: -18px; border-radius: 16px;
  border: 0; background: var(--color-primary); color: #fff;
  display: grid; place-items: center; box-shadow: 0 8px 22px color-mix(in srgb, var(--color-primary) 45%, transparent);
  cursor: pointer; flex: 0 0 auto;
}
.dock__compose:active { transform: scale(.96); }
.dock__more { position: relative; }
.dock .nav-badge {
  position: absolute; top: 2px; right: 10px; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 999px; font-size: 10px; line-height: 16px;
}

.mob-sheet {
  width: min(100vw, 520px); max-width: 100%; margin: auto 0 0;
  border: 0; border-radius: 18px 18px 0 0; padding: 0 0 calc(12px + env(safe-area-inset-bottom));
  background: var(--color-surface); color: var(--color-text);
  box-shadow: 0 -12px 40px rgba(0,0,0,.35);
}
.mob-sheet::backdrop { background: rgba(8,12,20,.55); backdrop-filter: blur(4px); }
.mob-sheet__grab { margin: 0; padding: 10px 0 4px; display: grid; place-items: center; }
.mob-sheet__grab button {
  width: 42px; height: 5px; border: 0; border-radius: 999px;
  background: color-mix(in srgb, var(--color-muted) 45%, transparent); cursor: pointer;
}
.mob-sheet__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 4px 16px 10px; gap: 10px;
}
.mob-sheet__head strong { font-size: 16px; font-weight: 800; }
.mob-sheet__hint { margin: 0 16px 10px; color: var(--color-muted); font-size: 13px; }
.mob-sheet__search { padding: 0 16px 10px; }
.mob-sheet__search input {
  width: 100%; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text);
  padding: 11px 14px; font: inherit; font-size: 14px; font-weight: 600;
}
.mob-sheet__list {
  max-height: min(52vh, 420px); overflow: auto; padding: 0 8px 8px;
  display: grid; gap: 4px;
}
.mob-sheet__list a {
  display: grid; gap: 2px; padding: 11px 12px; border-radius: 12px;
  text-decoration: none; color: var(--color-text);
}
.mob-sheet__list a:hover, .mob-sheet__list a:focus-visible {
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
}
.mob-sheet__list strong { font-size: 14px; font-weight: 750; }
.mob-sheet__list small { color: var(--color-muted); font-size: 12px; }
.mob-sheet__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 4px 14px 10px;
}
.mob-sheet__grid a, .mob-sheet__grid button {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px;
  padding: 12px 12px; border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text); text-decoration: none;
  font: inherit; font-size: 13px; font-weight: 700; text-align: left; cursor: pointer;
}
.mob-sheet__grid a:hover, .mob-sheet__grid button:hover {
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-elevated));
}

.mob-toast {
  position: fixed; left: 12px; right: 12px; bottom: calc(72px + env(safe-area-inset-bottom));
  z-index: 40; display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center;
  padding: 12px 14px; border-radius: 16px; border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 94%, transparent);
  backdrop-filter: blur(12px); box-shadow: var(--shadow-md);
}
.mob-toast[hidden] { display: none !important; }
.mob-toast strong { display: block; font-size: 13.5px; font-weight: 800; }
.mob-toast p { margin: 2px 0 0; color: var(--color-muted); font-size: 12px; }
.mob-toast--install {
  border-color: color-mix(in srgb, #22c55e 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface) 90%, #22c55e);
}
.mob-toast--ios {
  border-color: color-mix(in srgb, #38bdf8 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-surface) 90%, #38bdf8);
}
.mob-toast--ios em { font-style: normal; font-weight: 750; color: var(--color-text); }

.pwa-offline {
  min-height: 70vh; display: grid; place-items: center; padding: 32px 16px;
}
.pwa-offline__card {
  max-width: 420px; text-align: center; display: grid; gap: 10px; justify-items: center;
  padding: 28px 24px; border-radius: 18px; border: 1px solid var(--color-border); background: var(--color-surface);
}
.pwa-offline__mark {
  width: 64px; height: 64px; border-radius: 16px; display: grid; place-items: center;
  font-style: normal; font-size: 28px; font-weight: 800; color: #fff; background: var(--color-primary);
}
.pwa-offline h1 { margin: 0; font-size: 22px; }
.pwa-offline p { margin: 0; color: var(--color-muted); }
.pwa-offline__acts { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }

.notify__push {
  display: flex; justify-content: space-between; gap: 12px; align-items: center; flex-wrap: wrap;
  padding: 14px 16px; margin-bottom: 14px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface));
}
.notify__push strong { display: block; font-size: 14px; }
.notify__push p { margin: 4px 0 0; color: var(--color-muted); font-size: 12.5px; }
.notify__push em { font-style: normal; font-weight: 750; color: var(--color-muted); }
.notify__push em.is-on { color: #4ade80; }
.notify__push-acts { display: flex; gap: 8px; }

html.pwa-standalone .app-root {
  padding-top: env(safe-area-inset-top);
}
html.pwa-standalone .dock {
  padding-bottom: calc(6px + env(safe-area-inset-bottom));
}

.yon-compose--v10 .compose-card--v10 { border-radius: 16px; padding: 18px; }
.yon-actions--sticky {
  position: sticky; bottom: 0; display: flex; gap: 8px; justify-content: flex-end;
  padding: 12px 0 4px; background: linear-gradient(transparent, var(--color-surface) 30%);
}

@media (max-width: 980px) {
  .mast-cta--desk { display: none !important; }
  .mast-cta--mob { display: inline-flex !important; align-items: center; gap: 6px; }
  .fab { display: none !important; }
  .dock { gap: 2px; padding-inline: 6px; }
  .notify--v10 .notify__head { flex-direction: column; align-items: stretch; gap: 12px; }
  .notify--v10 .notify__filters { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .notify--v10 .notify__filter { flex: 0 0 auto; }
  .pm11-wrap--v11 { padding-bottom: 8px; }
  .yon-compose--v10 .compose-card--v10 { padding: 14px; border-radius: 14px; }
  .yon-compose--v10 h1 { font-size: 1.25rem; }
  .yon-actions--sticky {
    position: sticky; bottom: calc(58px + env(safe-area-inset-bottom));
    margin: 0 -14px; padding: 12px 14px; border-top: 1px solid var(--color-border);
    background: var(--color-surface);
  }
  .itrade--v10, .market-page, .shop-grid { padding-bottom: 8px; }
  .pro--v10 .pro-hero--v10 { border-radius: 0 0 16px 16px; }
  .pro--v10 .pro-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .app-frame { padding-bottom: 78px; }
  .mast-drop__panel {
    position: fixed !important; left: 8px !important; right: 8px !important; top: 64px !important;
    width: auto !important; max-width: none !important;
  }
}
@media (min-width: 981px) {
  .mob-sheet, .dock__compose { display: none !important; }
  .mob-toast:not(.mob-toast--install) { display: none !important; }
  .mob-toast--install:not([hidden]) {
    display: grid; left: auto; right: 20px; bottom: 20px; width: min(360px, calc(100% - 40px));
  }
}

/* ===== Medya Sistemi v10 ===== */
.ed-menu--media { min-width: min(360px, 92vw); padding: 10px; }
.ed-media--v10 { display: grid; gap: 8px; }
.ed-media--v10 .ed-dropzone {
  display: grid; gap: 4px; padding: 14px 12px; border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-elevated) 88%, transparent);
  cursor: pointer; text-align: center;
}
.ed-media--v10 .ed-dropzone--video {
  border-color: color-mix(in srgb, #f59e0b 40%, var(--color-border));
}
.ed-media--v10 .ed-dropzone--file {
  border-color: color-mix(in srgb, #22c55e 35%, var(--color-border));
}
.ed-media__embeds {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px;
}
.ed-media__embeds button {
  border: 1px solid var(--color-border); border-radius: 10px;
  background: var(--color-surface); color: var(--color-text);
  font: inherit; font-size: 11px; font-weight: 750; padding: 8px 4px; cursor: pointer;
}
.ed-media__embeds button:hover {
  border-color: var(--color-primary);
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-surface));
}
.ed-media__paste {
  display: grid; grid-template-columns: 1fr auto; gap: 6px;
}
.ed-media__paste input {
  width: 100%; border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text);
  padding: 8px 10px; font: inherit; font-size: 12px;
}
.ed-media__paste button {
  border: 0; border-radius: 10px; background: var(--color-primary); color: #fff;
  font: inherit; font-size: 12px; font-weight: 750; padding: 0 12px; cursor: pointer;
}
.yon-embed-wrap {
  margin: 10px 0; max-width: min(640px, 100%);
  border-radius: 14px; overflow: hidden;
  border: 1px solid var(--color-border);
  background: #000;
}
.yon-embed-wrap--tiktok, .yon-embed-wrap--ig { max-width: min(420px, 100%); }
.yon-video--tiktok, .yon-video--ig { aspect-ratio: 9/16; width: 100%; min-height: 420px; }
.yon-video-file {
  display: block; width: min(640px, 100%); max-height: 420px; margin: 10px 0;
  border-radius: 12px; background: #000; border: 1px solid var(--color-border);
}
.yon-file {
  display: inline-flex; align-items: center; gap: 8px; margin: 6px 0;
  padding: 10px 12px; border-radius: 12px; text-decoration: none;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 90%, transparent);
  color: var(--color-text); font-weight: 700; font-size: 13px;
}
.yon-file:hover {
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-elevated));
}
.yon-file__ico { opacity: .85; }
.post__content .yon-embed-wrap iframe { display: block; width: 100%; }
@media (max-width: 720px) {
  .ed-media__embeds { grid-template-columns: 1fr 1fr; }
  .ed-menu--media { position: fixed; left: 8px; right: 8px; top: auto; bottom: 72px; min-width: 0; z-index: 50; }
}

/* ===== SEO ===== */
.seo-related--v10 {
  margin: 18px 0; padding: 16px 18px; border-radius: 16px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
}
.seo-related--v10 h2 { margin: 0 0 10px; font-size: 15px; font-weight: 800; }
.seo-related--v10 ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.seo-related--v10 li { display: grid; gap: 2px; }
.seo-related--v10 a {
  color: var(--color-text); text-decoration: none; font-weight: 700; font-size: 13.5px;
}
.seo-related--v10 a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.seo-related--v10 small { color: var(--color-muted); font-size: 12px; }
.error-page--v10 { text-align: center; padding: 28px 20px; }
.error-suggest { margin-top: 22px; text-align: left; }
.error-suggest h2 { font-size: 14px; margin: 0 0 8px; }
.error-suggest ul { margin: 0; padding-left: 18px; }
.error-suggest a { color: var(--color-primary-ink, var(--color-primary)); font-weight: 650; }

/* AI: �zet / benzer / moderasyon */
.ai-summary { margin-top: 12px; }
.ai-summary__box {
  margin-top: 10px; padding: 14px 16px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface));
  font-size: 13.5px; line-height: 1.55;
}
.ai-summary__box ul { margin: 8px 0 0; padding-left: 18px; }
.ai-similar {
  margin: 0 0 12px; padding: 12px 14px; border-radius: 12px;
  border: 1px solid var(--color-border); background: var(--color-elevated);
}
.ai-similar__head { margin: 0 0 8px; font-size: 13px; font-weight: 750; color: var(--color-text); }
.ai-similar__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ai-similar__list a { color: var(--color-primary-ink, var(--color-primary)); font-weight: 650; font-size: 13px; text-decoration: none; }
.ai-similar__list small { display: block; color: var(--color-muted); font-size: 11.5px; }
.ai-mod {
  margin: 0 0 12px; padding: 10px 12px; border-radius: 12px;
  border: 1px solid var(--color-border); background: var(--color-surface);
  font-size: 12.5px;
}
.ai-mod__risk { margin: 0 0 6px; }
.ai-mod__bars { display: flex; flex-wrap: wrap; gap: 10px 16px; color: var(--color-muted); }
.ai-mod__bars b { color: var(--color-text); }

/* Forum i�i moderasyon paneli */
.modp--v10 { display: grid; gap: 16px; }
.modp__hero {
  display: flex; justify-content: space-between; gap: 16px; align-items: flex-start;
  padding: 18px 20px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background:
    radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 55%),
    var(--color-surface);
}
.modp__kicker { margin: 0 0 4px; font-size: 12px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; color: var(--color-muted); }
.modp__hero h1 { margin: 0 0 6px; font-size: clamp(22px, 2.4vw, 28px); }
.modp__hero p { margin: 0; color: var(--color-muted); max-width: 52ch; }
.modp__hero-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.modp__badge {
  display: inline-flex; align-items: center; padding: 6px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 800; font-style: normal;
  border: 1px solid var(--color-border); background: var(--color-elevated);
}
.modp__badge--forum { color: #38bdf8; border-color: color-mix(in srgb, #38bdf8 40%, var(--color-border)); }
.modp__badge--mod { color: #60a5fa; border-color: color-mix(in srgb, #60a5fa 40%, var(--color-border)); }
.modp__badge--super { color: #818cf8; border-color: color-mix(in srgb, #818cf8 40%, var(--color-border)); }
.modp__badge--admin { color: #f87171; border-color: color-mix(in srgb, #f87171 40%, var(--color-border)); }
.modp__kpis {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px;
}
.modp__kpis--sm { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 12px 0; }
.modp__filter select {
  min-height: 34px; border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text); padding: 0 10px; font-size: 12.5px;
}
.modp__sub { margin: 16px 0 10px; font-size: 13px; font-weight: 800; color: var(--color-muted); }
.modp__lookup-form { display: flex; gap: 10px; align-items: end; margin-bottom: 14px; flex-wrap: wrap; }
.modp__lookup-form label { flex: 1; min-width: 180px; }
.modp__dossier { display: grid; gap: 12px; }
.modp__dossier-head { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.modp__dossier-av, img.modp__dossier-av { width: 56px; height: 56px; border-radius: 14px; object-fit: cover; }
.modp__dossier-head strong { display: block; font-size: 16px; }
.modp__dossier-head p { margin: 2px 0 6px; color: var(--color-muted); font-size: 13px; }
.modp__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.modp__chips em {
  font-style: normal; font-size: 11.5px; font-weight: 750; padding: 3px 8px; border-radius: 999px;
  border: 1px solid var(--color-border); background: var(--color-elevated);
}
.modp__chips em.is-bad { color: #fca5a5; border-color: color-mix(in srgb, #ef4444 40%, var(--color-border)); }
.modp__kv { display: grid; gap: 6px; margin: 0; }
.modp__kv > div { display: grid; grid-template-columns: 110px 1fr; gap: 8px; font-size: 13px; }
.modp__kv dt { color: var(--color-muted); margin: 0; }
.modp__kv dd { margin: 0; }
.modp__perms { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.modp__perms li {
  display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 650;
  color: var(--color-text); padding: 6px 8px; border-radius: 8px; background: var(--color-elevated);
}
.modp__perms li svg { color: #4ade80; flex: none; }
.modp__threads--actions li { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.modp__thread-acts { display: flex; flex-wrap: wrap; gap: 4px; }
.modp__mini {
  appearance: none; border: 1px solid var(--color-border); background: var(--color-elevated);
  color: var(--color-muted); border-radius: 8px; padding: 4px 8px; font-size: 11.5px; font-weight: 700; cursor: pointer;
}
.modp__mini:hover { color: var(--color-text); border-color: var(--color-primary); }
.modp__card h3 { margin: 14px 0 8px; font-size: 13px; }
.modp__kpis article {
  padding: 12px 14px; border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-surface); display: grid; gap: 4px;
}
.modp__kpis span { font-size: 12px; color: var(--color-muted); font-weight: 650; }
.modp__kpis strong { font-size: 20px; font-weight: 800; }
.modp__jump { display: flex; flex-wrap: wrap; gap: 8px; }
.modp__jump a {
  padding: 6px 10px; border-radius: 999px; border: 1px solid var(--color-border);
  color: var(--color-muted); font-size: 13px; font-weight: 650; text-decoration: none;
}
.modp__jump a:hover { color: var(--color-text); border-color: var(--color-primary); }
.modp__grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(280px, .9fr); gap: 14px; align-items: start; }
.modp__main, .modp__side { display: grid; gap: 14px; }
.modp__card { padding: 16px; border-radius: 16px; }
.modp__card-head { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; margin-bottom: 12px; }
.modp__card-head h2 { margin: 0; font-size: 16px; }
.modp__card-head span { color: var(--color-muted); font-size: 12px; font-weight: 650; }
.modp__reports, .modp__threads, .modp__forums, .modp__notes { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.modp__reports li {
  display: grid; gap: 10px; padding: 12px 0; border-top: 1px solid var(--color-border);
}
.modp__reports li:first-child { border-top: 0; padding-top: 0; }
.modp__rep-main { display: grid; gap: 4px; }
.modp__rep-main strong { font-size: 14px; }
.modp__rep-main small, .modp__threads small, .modp__forums small, .modp__notes small { color: var(--color-muted); }
.modp__rep-main p, .modp__notes p { margin: 0; font-size: 13px; }
.modp__rep-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.modp__tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.modp__tool {
  padding: 12px; border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-elevated); display: grid; gap: 10px;
}
.modp__tool header { display: grid; gap: 2px; }
.modp__tool strong { font-size: 14px; }
.modp__tool small { color: var(--color-muted); font-size: 12px; }
.modp__threads a, .modp__forums a, .modp__rep-main a { color: var(--color-text); font-weight: 700; text-decoration: none; }
.modp__threads a:hover, .modp__forums a:hover, .modp__rep-main a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.modp__notes li { padding: 10px 0; border-top: 1px solid var(--color-border); display: grid; gap: 4px; }
.modp__notes li:first-child { border-top: 0; padding-top: 0; }
.menubar__chip--mod {
  position: relative;
  background: color-mix(in srgb, #3b82f6 18%, var(--color-elevated));
  border-color: color-mix(in srgb, #3b82f6 40%, var(--color-border));
  color: #93c5fd;
}
.menubar__chip-badge {
  position: absolute; top: -6px; right: -6px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 999px; background: #ef4444; color: #fff; font-size: 10px; font-weight: 800;
  display: grid; place-items: center; font-style: normal;
}
@media (max-width: 980px) {
  .modp__grid { grid-template-columns: 1fr; }
  .modp__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .modp__tools { grid-template-columns: 1fr; }
  .modp__hero { flex-direction: column; }
}

/* Moderasyon paneli v2 */
.modp--v2 { display: grid; gap: 16px; }
.modp2-hero {
  display: flex; justify-content: space-between; gap: 16px; align-items: flex-start;
  padding: 20px 22px; border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 24%, var(--color-border));
  background:
    radial-gradient(90% 120% at 100% 0%, color-mix(in srgb, #f59e0b 14%, transparent), transparent 50%),
    radial-gradient(110% 90% at 0% 0%, color-mix(in srgb, var(--color-primary) 18%, transparent), transparent 55%),
    var(--color-surface);
}
.modp2-hero__kicker {
  margin: 0 0 4px; font-size: 11.5px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--color-muted);
}
.modp2-hero h1 { margin: 0 0 6px; font-size: clamp(22px, 2.5vw, 30px); letter-spacing: -.02em; }
.modp2-hero p { margin: 0; color: var(--color-muted); max-width: 54ch; line-height: 1.45; }
.modp2-hero__aside { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.modp2-hero__count {
  font-size: 12px; font-weight: 750; color: var(--color-muted);
  padding: 6px 10px; border-radius: 999px; border: 1px solid var(--color-border); background: var(--color-elevated);
}
.modp2-badge {
  display: inline-flex; align-items: center; padding: 6px 11px; border-radius: 999px;
  font-size: 12px; font-weight: 800; font-style: normal;
  border: 1px solid var(--color-border); background: var(--color-elevated);
}
.modp2-badge--forum { color: #38bdf8; border-color: color-mix(in srgb, #38bdf8 40%, var(--color-border)); }
.modp2-badge--mod { color: #60a5fa; border-color: color-mix(in srgb, #60a5fa 40%, var(--color-border)); }
.modp2-badge--super { color: #a78bfa; border-color: color-mix(in srgb, #a78bfa 40%, var(--color-border)); }
.modp2-badge--admin { color: #f87171; border-color: color-mix(in srgb, #f87171 40%, var(--color-border)); }

.modp2-kpis {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px;
}
.modp2-kpis--sm { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 12px 0; }
.modp2-kpi {
  appearance: none; text-align: left; cursor: pointer;
  padding: 12px 14px; border-radius: 14px;
  border: 1px solid var(--color-border); background: var(--color-surface);
  display: grid; gap: 4px; color: inherit; font: inherit;
  transition: border-color .15s ease, transform .15s ease;
}
button.modp2-kpi:hover { border-color: var(--color-primary); transform: translateY(-1px); }
.modp2-kpi span { font-size: 12px; color: var(--color-muted); font-weight: 650; }
.modp2-kpi strong { font-size: 20px; font-weight: 800; }

.modp2-shell {
  display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 14px; align-items: start;
}
.modp2-tabs {
  display: grid; gap: 4px; padding: 10px; border-radius: 16px;
  border: 1px solid var(--color-border); background: var(--color-surface);
  position: sticky; top: 72px;
}
.modp2-tab {
  appearance: none; display: flex; align-items: center; gap: 8px;
  width: 100%; padding: 9px 11px; border-radius: 11px; border: 0;
  background: transparent; color: var(--color-muted); font: inherit; font-size: 13px; font-weight: 700;
  cursor: pointer; text-align: left;
}
.modp2-tab svg { flex: none; opacity: .85; }
.modp2-tab i {
  margin-left: auto; font-style: normal; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; background: #ef4444; color: #fff; font-size: 10px; font-weight: 800;
  display: grid; place-items: center;
}
.modp2-tab:hover { color: var(--color-text); background: var(--color-elevated); }
.modp2-tab.is-active {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-primary) 28%, transparent);
}

.modp2-panels { min-width: 0; }
.modp2-panel { display: none; gap: 14px; }
.modp2-panel.is-active { display: grid; }
.modp2-card {
  padding: 16px 18px; border-radius: 16px;
  border: 1px solid var(--color-border); background: var(--color-surface);
}
.modp2-card__head {
  display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 12px;
}
.modp2-card__head h2 { margin: 0; font-size: 16px; }
.modp2-card__head span { color: var(--color-muted); font-size: 12px; font-weight: 650; }
.modp2-card h3 { margin: 16px 0 8px; font-size: 13px; }
.modp2-sub { margin: 16px 0 10px; font-size: 13px; font-weight: 800; color: var(--color-muted); }
.modp2-link {
  appearance: none; border: 0; background: none; color: var(--color-primary-ink, var(--color-primary));
  font: inherit; font-size: 12.5px; font-weight: 750; cursor: pointer; padding: 0;
}
.modp2-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }

.modp2-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.modp2-bars__meta { display: flex; justify-content: space-between; gap: 8px; font-size: 12.5px; margin-bottom: 4px; }
.modp2-bars__meta span { color: var(--color-muted); font-weight: 650; }
.modp2-bars__track {
  height: 6px; border-radius: 999px; background: var(--color-elevated); overflow: hidden;
}
.modp2-bars__track i {
  display: block; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, var(--color-primary), color-mix(in srgb, #f59e0b 70%, var(--color-primary)));
}

.modp2-quick { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.modp2-quick__btn {
  appearance: none; display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; border-radius: 12px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text); font: inherit; font-size: 12.5px; font-weight: 700;
  cursor: pointer; text-align: left;
}
.modp2-quick__btn:hover { border-color: var(--color-primary); }

.modp2-inline {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
.modp2-inline input {
  flex: 1; min-width: 160px; min-height: 38px; border-radius: 10px;
  border: 1px solid var(--color-border); background: var(--color-elevated);
  color: var(--color-text); padding: 0 12px; font: inherit;
}
.modp2-inline--wide { margin-bottom: 14px; }
.modp2-filter select {
  min-height: 34px; border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text); padding: 0 10px; font-size: 12.5px;
}

.modp2-bulk { margin-bottom: 12px; }
.modp2-bulk__bar {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding: 10px 12px; border-radius: 12px;
  border: 1px dashed color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 6%, var(--color-elevated));
}
.modp2-bulk__bar select {
  min-height: 34px; border-radius: 8px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-text); padding: 0 8px;
}
.modp2-check { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 650; color: var(--color-muted); cursor: pointer; }
.modp2-check input { accent-color: var(--color-primary); }

.modp2-reports, .modp2-rows, .modp2-notes, .modp2-perms, .modp2-threadlist {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 10px;
}
.modp2-reports li {
  display: grid; gap: 10px; padding: 12px 0; border-top: 1px solid var(--color-border);
}
.modp2-reports li:first-child { border-top: 0; padding-top: 0; }
.modp2-rep__top { display: flex; gap: 10px; align-items: flex-start; }
.modp2-rep__main { display: grid; gap: 4px; min-width: 0; flex: 1; }
.modp2-rep__main strong { font-size: 14px; }
.modp2-rep__main small, .modp2-rows small, .modp2-notes small, .modp2-threadlist small { color: var(--color-muted); }
.modp2-rep__main p, .modp2-notes p { margin: 0; font-size: 13px; }
.modp2-rep__acts { display: flex; flex-wrap: wrap; gap: 6px; }
.modp2-danger { color: #fca5a5 !important; border-color: color-mix(in srgb, #ef4444 40%, var(--color-border)) !important; }

.modp2-rows li, .modp2-threadlist li {
  display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; flex-wrap: wrap;
  padding: 8px 0; border-top: 1px solid var(--color-border);
}
.modp2-rows li:first-child, .modp2-threadlist li:first-child { border-top: 0; padding-top: 0; }
.modp2-rows a, .modp2-threadlist a, .modp2-rep__main a { color: var(--color-text); font-weight: 700; text-decoration: none; }
.modp2-rows a:hover, .modp2-threadlist a:hover, .modp2-rep__main a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.modp2-rows--dense li { flex-direction: column; align-items: stretch; gap: 2px; }
.modp2-thread-acts { display: flex; flex-wrap: wrap; gap: 4px; }
.modp2-mini {
  appearance: none; border: 1px solid var(--color-border); background: var(--color-elevated);
  color: var(--color-muted); border-radius: 8px; padding: 4px 8px; font-size: 11.5px; font-weight: 700; cursor: pointer;
}
.modp2-mini:hover { color: var(--color-text); border-color: var(--color-primary); }

.modp2-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.modp2-tool {
  padding: 12px; border-radius: 14px; border: 1px solid var(--color-border);
  background: var(--color-elevated); display: grid; gap: 10px;
}
.modp2-tool header { display: grid; gap: 2px; }
.modp2-tool strong { font-size: 14px; }
.modp2-tool small { color: var(--color-muted); font-size: 12px; }

.modp2-dossier { display: grid; gap: 12px; }
.modp2-dossier__head { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.modp2-dossier__av, img.modp2-dossier__av { width: 56px; height: 56px; border-radius: 14px; object-fit: cover; }
.modp2-dossier__head strong { display: block; font-size: 16px; }
.modp2-dossier__head p { margin: 2px 0 6px; color: var(--color-muted); font-size: 13px; }
.modp2-dossier__links { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.modp2-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.modp2-chips em {
  font-style: normal; font-size: 11.5px; font-weight: 750; padding: 3px 8px; border-radius: 999px;
  border: 1px solid var(--color-border); background: var(--color-elevated);
}
.modp2-chips em.is-bad { color: #fca5a5; border-color: color-mix(in srgb, #ef4444 40%, var(--color-border)); }
.modp2-kv { display: grid; gap: 6px; margin: 0; }
.modp2-kv > div { display: grid; grid-template-columns: 110px 1fr; gap: 8px; font-size: 13px; }
.modp2-kv dt { color: var(--color-muted); margin: 0; }
.modp2-kv dd { margin: 0; }
.modp2-ip-label { margin: 0 0 12px; font-size: 13px; }
.modp2-ip-label code {
  font-weight: 800; padding: 2px 8px; border-radius: 8px;
  background: var(--color-elevated); border: 1px solid var(--color-border);
}
.modp2-banip { display: grid; gap: 10px; margin-top: 14px; max-width: 420px; }
.modp2-notes li { padding: 10px 0; border-top: 1px solid var(--color-border); display: grid; gap: 4px; }
.modp2-notes li:first-child { border-top: 0; padding-top: 0; }
.modp2-perms { gap: 6px; }
.modp2-perms li {
  display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 650;
  color: var(--color-text); padding: 6px 8px; border-radius: 8px; background: var(--color-elevated);
}
.modp2-perms li svg { color: #4ade80; flex: none; }

@media (max-width: 980px) {
  .modp2-shell { grid-template-columns: 1fr; }
  .modp2-tabs {
    position: static; display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto;
    padding: 8px; -webkit-overflow-scrolling: touch;
  }
  .modp2-tab { width: auto; flex: none; white-space: nowrap; }
  .modp2-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .modp2-split, .modp2-tools, .modp2-quick { grid-template-columns: 1fr; }
  .modp2-hero { flex-direction: column; }
}


/* Ak?ll? arama v10 */
.search--v10 { display: grid; gap: 16px; }
.search10-hero {
  display: flex; justify-content: space-between; gap: 16px; align-items: flex-start;
  padding: 18px 20px; border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background:
    radial-gradient(100% 80% at 100% 0%, color-mix(in srgb, #22c55e 10%, transparent), transparent 50%),
    radial-gradient(90% 80% at 0% 0%, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 55%),
    var(--color-surface);
}
.search10-kicker { margin: 0 0 4px; font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--color-muted); }
.search10-hero h1 { margin: 0 0 6px; font-size: clamp(22px, 2.4vw, 28px); }
.search10-hero p { margin: 0; color: var(--color-muted); max-width: 54ch; }
.search10-hero code { font-size: 12px; padding: 1px 6px; border-radius: 6px; background: var(--color-elevated); }
.search10-hero__stat { text-align: right; }
.search10-hero__stat strong { display: block; font-size: 28px; font-weight: 800; }
.search10-hero__stat span { color: var(--color-muted); font-size: 12px; }

.search10-form {
  display: grid; gap: 12px; padding: 14px; border-radius: 16px;
  border: 1px solid var(--color-border); background: var(--color-surface);
}
.search10-main { position: relative; display: flex; align-items: center; gap: 10px; }
.search10-main__ico { color: var(--color-muted); flex: none; }
.search10-main input {
  flex: 1; min-height: 46px; border: 1px solid var(--color-border); border-radius: 12px;
  background: var(--color-elevated); color: var(--color-text); padding: 0 14px; font: inherit; font-size: 15px;
}
.search10-main input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 18%, transparent); }
.search10-suggest {
  position: absolute; left: 28px; right: 0; top: calc(100% + 6px); z-index: 30;
  border-radius: 12px; border: 1px solid var(--color-border); background: var(--color-surface);
  box-shadow: var(--shadow-md); max-height: 280px; overflow: auto; display: grid;
}
.search10-suggest[hidden] { display: none !important; }
.search10-suggest a {
  display: grid; gap: 2px; padding: 10px 12px; color: var(--color-text); text-decoration: none;
  border-top: 1px solid var(--color-border); font-size: 13.5px; font-weight: 700;
}
.search10-suggest a:first-child { border-top: 0; }
.search10-suggest a:hover { background: var(--color-elevated); }
.search10-suggest small { color: var(--color-muted); font-weight: 550; }
.search10-adv summary {
  cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: 6px;
  color: var(--color-muted); font-size: 13px; font-weight: 700;
}
.search10-adv__grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; margin-top: 12px;
}
.search10-adv label { display: grid; gap: 4px; font-size: 12px; color: var(--color-muted); font-weight: 650; }
.search10-adv input, .search10-adv select {
  min-height: 38px; border-radius: 10px; border: 1px solid var(--color-border);
  background: var(--color-elevated); color: var(--color-text); padding: 0 10px; font: inherit;
}
.search10-submit { justify-self: start; }

.search10-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.search10-tab {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 999px;
  border: 1px solid var(--color-border); color: var(--color-muted); text-decoration: none;
  font-size: 12.5px; font-weight: 700; background: var(--color-surface);
}
.search10-tab em { font-style: normal; font-size: 11px; opacity: .8; }
.search10-tab.is-on, .search10-tab:hover {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
}
.search10-card {
  padding: 14px 16px; border-radius: 16px; border: 1px solid var(--color-border); background: var(--color-surface);
}
.search10-card__head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.search10-card__head h2 { margin: 0; font-size: 15px; }
.search10-card__head span { color: var(--color-muted); font-size: 12px; font-weight: 650; }
.search10-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.search10-chips a {
  display: inline-flex; padding: 6px 10px; border-radius: 999px; border: 1px solid var(--color-border);
  color: var(--color-text); text-decoration: none; font-size: 12.5px; font-weight: 650; background: var(--color-elevated);
}
.search10-chips a:hover { border-color: var(--color-primary); color: var(--color-primary-ink, var(--color-primary)); }
.search10-hint ul { margin: 0; padding-left: 18px; color: var(--color-muted); font-size: 13.5px; display: grid; gap: 6px; }
.search10-meta { margin: 0; color: var(--color-muted); font-size: 12.5px; }
.search10-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.search10-list li { border-top: 1px solid var(--color-border); }
.search10-list li:first-child { border-top: 0; }
.search10-list a {
  display: grid; gap: 4px; padding: 12px 2px; color: var(--color-text); text-decoration: none;
}
.search10-list a:hover .search10-list__title { color: var(--color-primary-ink, var(--color-primary)); }
.search10-list__title { font-size: 14.5px; font-weight: 750; display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.search10-list__sum { color: var(--color-muted); font-size: 13px; line-height: 1.4; }
.search10-list__meta { color: var(--color-muted); font-size: 12px; }
.search10-fuzzy {
  font-style: normal; font-size: 10.5px; font-weight: 800; padding: 2px 7px; border-radius: 999px;
  color: #fbbf24; border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--color-border));
  background: color-mix(in srgb, #f59e0b 12%, var(--color-elevated));
}
.search10-mention {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; text-decoration: none;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-surface)); color: var(--color-text);
}
.search10-mention__av, img.search10-mention__av { width: 48px; height: 48px; border-radius: 14px; object-fit: cover; }
.search10-mention strong { display: block; font-size: 15px; }
.search10-mention small { color: var(--color-muted); font-size: 12.5px; }
.search10-mention .nx-btn { margin-left: auto; }
.search10-similar { border-color: color-mix(in srgb, #22c55e 28%, var(--color-border)); }
@media (max-width: 720px) {
  .search10-hero { flex-direction: column; }
  .search10-hero__stat { text-align: left; }
  .search10-mention { flex-wrap: wrap; }
  .search10-mention .nx-btn { margin-left: 0; }
}

/* Security center v10 (/guvenlik) */
.sec10 { display: grid; gap: 18px; }
.sec10-hero {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; align-items: stretch;
  padding: 22px 24px; border-radius: 18px;
  background:
    radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--color-primary) 18%, transparent), transparent 55%),
    linear-gradient(165deg, color-mix(in srgb, var(--color-surface-2) 92%, #0b1220), var(--color-surface));
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
}
.sec10-hero__copy h1 { margin: 4px 0 8px; font-size: clamp(1.45rem, 2.2vw, 1.85rem); letter-spacing: -0.02em; }
.sec10-hero__copy > .nx-muted { margin: 0 0 14px; max-width: 46ch; }
.sec10-jump { display: flex; flex-wrap: wrap; gap: 8px; }
.sec10-jump a {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
  color: var(--color-text); text-decoration: none;
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  border: 1px solid var(--color-border);
}
.sec10-jump a:hover { border-color: color-mix(in srgb, var(--color-primary) 45%, var(--color-border)); color: var(--color-primary-ink, var(--color-primary)); }
.sec10-score {
  display: flex; align-items: center; gap: 16px; min-width: 260px;
  padding: 14px 16px; border-radius: 16px;
  background: color-mix(in srgb, var(--color-surface) 88%, transparent);
  border: 1px solid var(--color-border);
}
.sec10-score__ring {
  --sec-score: 0;
  width: 88px; height: 88px; flex-shrink: 0; border-radius: 50%;
  display: grid; place-items: center; position: relative;
  background:
    conic-gradient(var(--sec-ring) calc(var(--sec-score) * 1%), color-mix(in srgb, var(--color-border) 70%, transparent) 0);
}
.sec10-score__ring::before {
  content: ""; position: absolute; inset: 8px; border-radius: 50%;
  background: var(--color-surface);
}
.sec10-score__ring strong,
.sec10-score__ring span { position: relative; z-index: 1; line-height: 1; }
.sec10-score__ring strong { font-size: 1.35rem; font-variant-numeric: tabular-nums; }
.sec10-score__ring span { font-size: 11px; color: var(--color-muted); margin-top: 2px; }
.sec10-score__ring { grid-template-rows: auto auto; }
.sec10-score--ok { --sec-ring: #22c55e; }
.sec10-score--mid { --sec-ring: #f59e0b; }
.sec10-score--low { --sec-ring: #ef4444; }
.sec10-score__meta em { display: block; font-style: normal; font-weight: 700; font-size: 15px; margin-bottom: 6px; }
.sec10-score__meta ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; }
.sec10-score__meta li { font-size: 12px; color: var(--color-muted); }
.sec10-score__meta li.is-on { color: #22c55e; }
.sec10-score__meta li.is-off { color: #f59e0b; }
.sec10-score__meta li.is-warn { color: #ef4444; }

.sec10-checks {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;
}
.sec10-check {
  display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center;
  padding: 14px 14px; border-radius: 14px;
  background: var(--color-surface);
  border: 1px solid color-mix(in srgb, var(--color-primary) 14%, var(--color-border));
}
.sec10-check.is-on { border-color: color-mix(in srgb, #22c55e 35%, var(--color-border)); }
.sec10-check.is-warn { border-color: color-mix(in srgb, #f59e0b 40%, var(--color-border)); }
.sec10-check__ico {
  width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}
.sec10-check.is-on .sec10-check__ico { background: color-mix(in srgb, #22c55e 18%, transparent); color: #22c55e; }
.sec10-check strong { display: block; font-size: 13.5px; }
.sec10-check small { display: block; color: var(--color-muted); font-size: 11.5px; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 18ch; }
.sec10-check a {
  font-size: 12px; font-weight: 700; color: var(--color-primary-ink, var(--color-primary)); text-decoration: none; white-space: nowrap;
}
.sec10-check a:hover { text-decoration: underline; }

.sec10-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px;
}
.sec10-card {
  display: flex; flex-direction: column; min-width: 0;
  border-radius: 16px; overflow: hidden;
  background: var(--color-surface);
  border: 1px solid color-mix(in srgb, var(--color-primary) 14%, var(--color-border));
}
.sec10-card--wide { grid-column: 1 / -1; }
.sec10-card__head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 16px 18px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
}
.sec10-card__head h2 { margin: 2px 0 0; font-size: 1.05rem; letter-spacing: -0.01em; }
.sec10-card__head .kicker { margin: 0; }
.sec10-card__body { padding: 16px 18px 18px; display: grid; gap: 14px; flex: 1; }
.sec10-pill {
  display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px;
  font-size: 11.5px; font-weight: 700; flex-shrink: 0;
  background: color-mix(in srgb, var(--color-muted) 16%, transparent);
  color: var(--color-muted); border: 1px solid var(--color-border);
}
.sec10-pill.is-on { background: color-mix(in srgb, #22c55e 16%, transparent); color: #22c55e; border-color: color-mix(in srgb, #22c55e 35%, transparent); }
.sec10-pill.is-off { background: color-mix(in srgb, #f59e0b 14%, transparent); color: #f59e0b; border-color: color-mix(in srgb, #f59e0b 35%, transparent); }
.sec10-lead { margin: 0; color: var(--color-muted); font-size: 13.5px; line-height: 1.45; }
.sec10-link { font-size: 12.5px; font-weight: 700; color: var(--color-primary-ink, var(--color-primary)); text-decoration: none; white-space: nowrap; }
.sec10-link:hover { text-decoration: underline; }

.sec10-form { display: grid; gap: 10px; max-width: 420px; }
.sec10-form label { display: grid; gap: 5px; }
.sec10-form label > span { font-size: 12px; font-weight: 600; color: var(--color-muted); }
.sec10-form input {
  height: 40px; padding: 0 12px; border-radius: 10px;
  border: 1px solid var(--color-border); background: var(--color-bg);
  color: var(--color-text); font: inherit;
}
.sec10-form input:focus { outline: none; border-color: color-mix(in srgb, var(--color-primary) 55%, var(--color-border)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 18%, transparent); }

.sec10-setup { display: grid; gap: 14px; padding: 14px; border-radius: 14px; background: color-mix(in srgb, var(--color-bg) 70%, transparent); border: 1px dashed color-mix(in srgb, var(--color-primary) 28%, var(--color-border)); }
.sec10-steps { margin: 0; padding-left: 1.2em; display: grid; gap: 4px; font-size: 13px; color: var(--color-muted); }
.sec10-setup__row { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.sec10-qr {
  margin: 0; padding: 10px; border-radius: 12px; background: #fff;
  border: 1px solid var(--color-border); line-height: 0;
}
.sec10-qr img { display: block; width: 160px; height: 160px; }
.sec10-secret { display: grid; gap: 8px; min-width: 0; }
.sec10-secret > span { font-size: 12px; font-weight: 600; color: var(--color-muted); }
.sec10-secret code {
  display: block; padding: 10px 12px; border-radius: 10px; font-size: 13px; word-break: break-all;
  background: var(--color-surface); border: 1px solid var(--color-border); font-variant-numeric: tabular-nums;
}
.sec10-backup { display: grid; gap: 8px; padding-top: 4px; }
.sec10-backup h3 { margin: 0; font-size: 14px; }
.sec10-backup ul {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px;
}
.sec10-backup li code {
  display: block; text-align: center; padding: 8px; border-radius: 8px; font-size: 12.5px;
  background: color-mix(in srgb, var(--color-bg) 80%, transparent); border: 1px solid var(--color-border);
}

.sec10-id {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px;
}
.sec10-id > div {
  padding: 12px 14px; border-radius: 12px;
  background: color-mix(in srgb, var(--color-bg) 65%, transparent);
  border: 1px solid var(--color-border);
}
.sec10-id span { display: block; font-size: 11.5px; color: var(--color-muted); margin-bottom: 4px; }
.sec10-id strong { font-size: 14px; word-break: break-all; }

.sec10-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sec10-item {
  display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center;
  padding: 11px 12px; border-radius: 12px;
  background: color-mix(in srgb, var(--color-bg) 55%, transparent);
  border: 1px solid var(--color-border);
}
.sec10-item.is-current { border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border)); background: color-mix(in srgb, var(--color-primary) 8%, transparent); }
.sec10-item.is-ok .sec10-item__ico { color: #22c55e; }
.sec10-item.is-fail .sec10-item__ico { color: #ef4444; }
.sec10-item__ico {
  width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; flex-shrink: 0;
  background: color-mix(in srgb, var(--color-primary) 12%, transparent); color: var(--color-primary-ink, var(--color-primary));
}
.sec10-item__body { min-width: 0; }
.sec10-item__body strong { display: block; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sec10-item__body small { display: block; font-size: 11.5px; color: var(--color-muted); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sec10-item time { font-size: 11.5px; color: var(--color-muted); white-space: nowrap; flex-shrink: 0; }
.sec10-tag {
  font-style: normal; font-size: 11px; font-weight: 700; padding: 4px 8px; border-radius: 999px;
  background: color-mix(in srgb, var(--color-primary) 14%, transparent); color: var(--color-primary-ink, var(--color-primary));
}
.sec10-empty { text-align: center; padding: 22px 12px; color: var(--color-muted); }
.sec10-empty strong { display: block; color: var(--color-text); margin-bottom: 4px; }
.sec10-empty p { margin: 0; font-size: 13px; }

.sec10-feats {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px;
}
.sec10-feat {
  padding: 12px 14px; border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-bg) 50%, transparent);
}
.sec10-feat.is-on { border-color: color-mix(in srgb, #22c55e 32%, var(--color-border)); }
.sec10-feat strong { display: block; font-size: 13.5px; margin-bottom: 4px; }
.sec10-feat small { color: var(--color-muted); font-size: 12px; line-height: 1.35; }

@media (max-width: 980px) {
  .sec10-hero { grid-template-columns: 1fr; }
  .sec10-score { min-width: 0; }
  .sec10-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sec10-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .sec10-hero { padding: 16px; gap: 14px; }
  .sec10-checks { grid-template-columns: 1fr; }
  .sec10-id { grid-template-columns: 1fr; }
  .sec10-card__head { flex-wrap: wrap; padding: 14px; }
  .sec10-card__body { padding: 14px; }
  .sec10-item { grid-template-columns: auto 1fr; }
  .sec10-item form,
  .sec10-item .sec10-tag,
  .sec10-item time { grid-column: 2; justify-self: start; }
  .sec10-jump a { padding: 6px 10px; }
  .sec10-qr img { width: 140px; height: 140px; }
}

/* Feed customize modal v10 */
.feed-modal--v10 {
  border: 0; padding: 0; max-width: min(520px, calc(100vw - 24px));
  width: 100%; background: transparent; color: var(--color-text);
}
.feed-modal--v10::backdrop {
  background: color-mix(in srgb, #000 58%, transparent);
  backdrop-filter: blur(2px);
}
.feed-modal__panel {
  display: grid; gap: 14px;
  padding: 16px 16px 14px;
  border-radius: 16px;
  background: color-mix(in srgb, var(--color-elevated) 88%, #12141c);
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  box-shadow: 0 24px 60px color-mix(in srgb, #000 42%, transparent);
}
.feed-modal__head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.feed-modal__head strong { font-size: 1.05rem; letter-spacing: -.01em; }
.feed-modal__alert {
  display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start;
  padding: 12px 14px; border-radius: 12px;
  background: #2f80ed; color: #fff;
}
.feed-modal__alert-ico {
  width: 22px; height: 22px; border-radius: 50%;
  display: grid; place-items: center;
  background: color-mix(in srgb, #fff 22%, transparent);
  font-size: 12px; font-weight: 800; font-style: normal;
}
.feed-modal__alert p { margin: 0 0 4px; font-size: 12.5px; line-height: 1.4; }
.feed-modal__alert p:last-child { margin-bottom: 0; }
.feed-modal__alert b { font-weight: 800; }
.feed-modal__cols {
  display: flex; flex-wrap: wrap; gap: 8px 14px;
  padding: 0 2px; font-size: 12.5px; color: var(--color-muted);
}
.feed-modal__cols label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.feed-modal__field { display: grid; gap: 8px; }
.feed-modal__label-row {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  font-size: 13px; font-weight: 700;
}
.feed-modal__counter {
  border: 0; background: transparent; color: var(--color-muted);
  font: inherit; font-weight: 650; cursor: default; padding: 0;
}
.feed-modal__search {
  height: 40px; padding: 0 12px; border-radius: 10px;
  border: 1px solid color-mix(in srgb, #2f80ed 55%, var(--color-border));
  background: var(--color-bg); color: var(--color-text); font: inherit;
}
.feed-modal__search:focus {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, #2f80ed 22%, transparent);
}
.feed-modal__list {
  max-height: min(42vh, 360px); overflow: auto;
  border: 1px solid var(--color-border); border-radius: 12px;
  background: color-mix(in srgb, var(--color-bg) 70%, transparent);
  scrollbar-width: thin;
}
.feed-modal__group-title {
  padding: 10px 12px 6px; font-size: 12px; font-weight: 750;
  color: var(--color-muted); letter-spacing: .02em;
}
.feed-modal__opt {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 11px 14px; border: 0; border-top: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  background: transparent; color: var(--color-text); text-align: left;
  font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
}
.feed-modal__group .feed-modal__opt:first-of-type { border-top: 0; }
.feed-modal__opt:hover { background: color-mix(in srgb, var(--color-elevated) 55%, transparent); }
.feed-modal__opt.is-on { color: #4da3ff; }
.feed-modal__check {
  display: none; color: #4da3ff; line-height: 0; font-style: normal;
}
.feed-modal__opt.is-on .feed-modal__check { display: grid; }
.feed-modal__foot {
  display: flex; justify-content: flex-end; gap: 8px; padding-top: 2px;
}
.feed-modal__opt.is-fixed {
  cursor: default; opacity: .92; color: var(--color-muted);
}
.feed-modal__opt.is-fixed.is-on { color: var(--color-muted); }
.feed-modal__lock {
  font-style: normal; font-size: 11px; font-weight: 750;
  padding: 3px 8px; border-radius: 999px;
  background: color-mix(in srgb, var(--color-muted) 16%, transparent);
  color: var(--color-muted);
}
.feed--v10 .feed__tab.is-fixed { cursor: pointer; }
.feed--v10 .feed__tab[data-feed-fixed] { user-select: none; }


/* Mobile: hide sticky ads (drawer conflict) */
@media (max-width: 980px) {
  .mast-ad--v10,
  .app-ad--banner,
  .app-ad--footer,
  .nx-ad-bottom--v10,
  .fl10-adstrip,
  .yon-mark-mobile,
  .yon-mark-mobile--v10,
  .nx-ad--mobile {
    display: none !important;
  }
}
@media (max-width: 560px) {
  .feed-modal__panel { padding: 14px 12px 12px; border-radius: 14px; }
  .feed-modal__list { max-height: min(48vh, 320px); }
}


/* �� R10 color alignment (structure preserved) �� */
.nx-btn, .mast-cta, .feed__custom-btn {
  background-image: none !important;
  box-shadow: none;
}
.mast-cta {
  background: var(--color-primary) !important;
  color: var(--color-on-primary, #fff) !important;
}
.mast-cta__ico { color: inherit !important; }
.hero10__glow { display: none !important; }
.hero10 {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border) !important;
  box-shadow: none !important;
}
.feed--v10 .feed__tab.is-on {
  color: #fff !important;
  background: var(--color-primary) !important;
  border-bottom-color: transparent !important;
}
.feed--v10 .feed__custom-btn {
  background: var(--color-primary) !important;
  color: var(--color-on-primary, #fff) !important;
}
.feed--v10 .feed__custom-btn .yon-ico { color: inherit !important; }

/* Posts � R10 surface / hover */
.yon-thread--v10 .post--v10,
.post--v10,
.post--v7,
.post {
  background: var(--post-bg, var(--color-surface)) !important;
}
.yon-thread--v10 .post--v10:hover,
.post--v10:hover {
  background: var(--post-hover, var(--color-elevated)) !important;
}
.post--v10 .post__aside {
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  border-color: var(--color-border);
}
.post-menu, .menubar--v10 .menubar__menu, .acct__sheet, .apps-sheet {
  background: var(--color-surface) !important;
  border-color: var(--color-border) !important;
  box-shadow: var(--shadow-md) !important;
}

/* Purple announce � primary (R10 blue) */
.fs10-announce,
.fs8-announce {
  background: color-mix(in srgb, var(--color-primary) 18%, var(--color-surface)) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--color-primary) 35%, var(--color-border)) !important;
  background-image: none !important;
  border-left: 4px solid var(--color-primary);
}
.fs10-announce__ico {
  background: #fff !important;
  border-radius: 10px !important;
}
.fs10-announce__ico .yon-ico { color: var(--color-primary-ink, var(--color-primary)) !important; }
.fs10-announce__body strong,
.fs10-announce__body small { color: var(--color-text) !important; }
.fs10-announce__tag {
  background: var(--color-primary) !important;
  color: #fff !important;
}
.dash-alert--v10.dash-alert--accent { --da-accent: var(--color-primary); }

/* Inputs — content forms only (mast search uses chrome tokens) */
.nx-form input, .nx-form select, .nx-form textarea,
.feed-modal__search {
  background: var(--color-input-bg);
  border-color: var(--color-border-dark, var(--color-border));
  color: var(--color-text);
}
.nx-form input:focus, .nx-form select:focus, .nx-form textarea:focus,
.feed-modal__search:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-focus-ring);
}
.mast-search,
.mast .mast-search,
.mast-search--v10 {
  background: var(--mast-search-bg);
  border-color: var(--header-line);
  color: var(--mast-link);
}
.mast-search input,
.mast .mast-search input {
  color: var(--mast-link-hover);
  background: transparent;
}
.mast-search:focus-within,
.mast-search--v10:focus-within,
.mast-center--v10.is-open .mast-search--v10 {
  border-color: color-mix(in srgb, var(--color-primary) 45%, var(--header-line));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 14%, transparent);
  background: color-mix(in srgb, var(--mast-search-bg) 78%, var(--r10-dark-tertiary, #43485E));
}
.mast-search--mob {
  background: transparent;
  border: 0;
  color: var(--mast-link-hover);
}
.mast-search--mob:hover {
  background: var(--mast-link-bg);
  color: var(--mast-link-hover);
}

/* Online badge */
.yon-badge.is-online, .badge--ok, [data-online="1"] {
  color: #052e16;
  background: var(--color-online);
  border-color: var(--color-online);
}

/* Header / body separation */
.mast__top {
  background: var(--mast-bg);
  border-bottom: 1px solid var(--header-line);
}
.menubar--v10, .menubar--v11 {
  background: var(--mast-nav);
  border-bottom: 1px solid var(--header-line);
}

/* Sidebar */
.home-side--v10, .hs10-card, .rail, .app-rail {
  background: var(--color-surface);
}
.home-side--v10 a:hover, .hs10-card:hover {
  background: var(--color-hover);
}

/* Sec10 score ring uses primary */
.sec10-score--ok { --sec-ring: var(--color-success); }
.sec10-score--mid { --sec-ring: var(--color-warning); }
.sec10-score--low { --sec-ring: var(--color-danger); }
.sec10-jump a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.feed-modal__alert {
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-surface)) !important;
  color: var(--color-text) !important;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  border-left: 3px solid var(--color-primary);
}
.feed-modal__alert-ico {
  background: var(--color-primary) !important;
  color: #fff !important;
}
.feed-modal__opt.is-on { color: var(--color-primary-ink, var(--color-primary)) !important; }
.site-foot__glow { display: none !important; }
/* �� Members directory v10 (/uyeler) �� */
.mem10 { display: grid; gap: 16px; }
.mem10-hero {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: start;
  padding: 20px 22px; border-radius: var(--radius-xl);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-primary);
}
.mem10-hero__copy h1 { margin: 4px 0 8px; font-size: clamp(1.45rem, 2.2vw, 1.9rem); letter-spacing: -.02em; }
.mem10-hero__copy > .nx-muted { margin: 0 0 14px; max-width: 52ch; }
.mem10-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mem10-stats article {
  display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: center;
  padding: 10px 12px; border-radius: var(--radius-md);
  background: var(--color-elevated); border: 1px solid var(--color-border);
}
.mem10-stats__ico {
  width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center;
  background: var(--color-soft-primary); color: var(--color-primary-ink, var(--color-primary));
}
.mem10-stats__ico.is-online { background: var(--color-soft-success); color: var(--color-online); }
.mem10-stats strong { display: block; font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.mem10-stats small { color: var(--color-muted); font-size: 11.5px; }
.mem10-hero__actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.mem10-hero__actions .nx-btn { gap: 7px; }

.mem10-toolbar {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center;
}
.mem10-search {
  display: flex; align-items: center; gap: 8px; min-width: 0;
  padding: 6px 6px 6px 12px; border-radius: var(--radius-md);
  background: var(--color-surface); border: 1px solid var(--color-border);
}
.mem10-search__ico { color: var(--color-muted); flex: none; display: grid; place-items: center; }
.mem10-search input {
  flex: 1; min-width: 0; height: 36px; border: 0; background: transparent;
  color: var(--color-text); font: inherit; outline: none;
}
.mem10-search__clear {
  width: 32px; height: 32px; border-radius: 8px; display: grid; place-items: center;
  color: var(--color-muted); border: 1px solid transparent;
}
.mem10-search__clear:hover { color: var(--color-text); background: var(--color-hover); }
.mem10-search .nx-btn { flex: none; min-height: 36px; padding: 0 14px; gap: 6px; }
.mem10-search:focus-within { border-color: var(--color-primary); box-shadow: 0 0 0 3px var(--color-soft-primary); }
.mem10-sort { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.mem10-sort__btn {
  display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px;
  border-radius: 999px; border: 1px solid var(--color-border);
  background: var(--color-surface); color: var(--color-muted);
  font-size: 12.5px; font-weight: 700; text-decoration: none;
}
.mem10-sort__btn:hover { color: var(--color-text); border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border)); }
.mem10-sort__btn.is-on {
  color: #fff; background: var(--color-primary); border-color: var(--color-primary);
}
.mem10-result {
  margin: 0; padding: 10px 14px; border-radius: var(--radius-md);
  background: var(--color-soft-primary); color: var(--color-text-secondary); font-size: 13.5px;
  display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center;
}
.mem10-result a { font-weight: 700; }

.mem10-cols {
  display: grid;
  grid-template-columns: minmax(220px, 1.6fr) 120px 170px 120px minmax(120px, .9fr) auto;
  gap: 12px; align-items: center; padding: 0 16px;
  min-height: 34px; font-size: 11px; font-weight: 750; letter-spacing: .04em;
  text-transform: uppercase; color: var(--color-muted);
}
.mem10-list {
  display: grid; gap: 8px;
}
.mem10-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.6fr) 120px 170px 120px minmax(120px, .9fr) auto;
  gap: 12px; align-items: center;
  padding: 12px 14px; border-radius: var(--radius-lg);
  background: var(--color-surface); border: 1px solid var(--color-border);
  transition: background var(--ease), border-color var(--ease);
}
.mem10-row:hover {
  background: var(--color-hover);
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
}
.mem10-row.is-online {
  box-shadow: inset 3px 0 0 var(--color-online);
}
.mem10-user {
  display: flex; align-items: center; gap: 12px; min-width: 0;
  color: var(--color-text); text-decoration: none;
}
.mem10-ava-wrap { position: relative; flex: none; }
.mem10-ava, .mem10-ava.shell-avatar {
  width: 44px; height: 44px; border-radius: 50%; object-fit: cover;
  display: grid; place-items: center; font-weight: 800; font-size: 15px;
  background: var(--color-elevated); border: 2px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  color: var(--color-primary-ink, var(--color-primary));
}
.mem10-dot {
  position: absolute; right: 0; bottom: 1px; width: 11px; height: 11px; border-radius: 50%;
  background: var(--color-online); border: 2px solid var(--color-surface);
}
.mem10-user__text { min-width: 0; display: grid; gap: 2px; }
.mem10-user__text strong {
  display: inline-flex; align-items: center; gap: 6px; font-size: 14.5px; font-weight: 750;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mem10-user__text small {
  color: var(--color-muted); font-size: 12px; font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mem10-verified {
  display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 50%;
  background: var(--color-primary); color: #fff; font-style: normal; flex: none;
}
.mem10-badge {
  display: inline-flex; align-items: center; max-width: 100%;
  padding: 4px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 750;
  background: var(--color-elevated); border: 1px solid var(--color-border); color: var(--color-text-secondary);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mem10-metrics {
  display: flex; flex-wrap: wrap; gap: 8px; color: var(--color-muted); font-size: 12.5px; font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.mem10-metrics span { display: inline-flex; align-items: center; gap: 4px; }
.mem10-metrics .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.mem10-trade { min-width: 0; }
.mem10-status { min-width: 0; font-size: 12.5px; font-weight: 650; }
.mem10-status__on {
  display: inline-flex; align-items: center; gap: 5px; color: var(--color-online);
}
.mem10-status__off {
  display: inline-flex; align-items: center; gap: 5px; color: var(--color-muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
.mem10-actions {
  display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-shrink: 0;
}
.mem10-ico {
  width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center;
  border: 1px solid var(--color-border); background: var(--color-elevated); color: var(--color-text);
  text-decoration: none; transition: background var(--ease), border-color var(--ease), color var(--ease);
}
.mem10-ico:hover {
  color: var(--color-primary-ink, var(--color-primary)); border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: var(--color-soft-primary);
}
.mem10-cta { min-height: 36px; padding: 0 12px; font-size: 12.5px; }

.mem10-empty {
  display: grid; justify-items: center; gap: 8px; text-align: center;
  padding: 48px 20px; border-radius: var(--radius-xl);
  background: var(--color-surface); border: 1px dashed var(--color-border);
}
.mem10-empty__ico {
  width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center;
  background: var(--color-soft-primary); color: var(--color-primary-ink, var(--color-primary)); margin-bottom: 4px;
}
.mem10-pager {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: center;
  margin-top: 4px; padding-top: 4px;
}
.mem10-pager a {
  min-width: 36px; min-height: 36px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; border: 1px solid var(--color-border); background: var(--color-surface);
  color: var(--color-text); font-weight: 700; text-decoration: none;
}
.mem10-pager a:hover { border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border)); }
.mem10-pager a.is-active {
  background: var(--color-primary); color: #fff; border-color: var(--color-primary);
}
.mem10-pager__nav { gap: 6px; }
.mem10-pager__gap { color: var(--color-muted); padding: 0 4px; }

@media (max-width: 1100px) {
  .mem10-cols { display: none; }
  .mem10-row {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "user actions"
      "role actions"
      "metrics metrics"
      "trade status";
    gap: 10px 12px;
  }
  .mem10-user { grid-area: user; }
  .mem10-role { grid-area: role; }
  .mem10-metrics { grid-area: metrics; }
  .mem10-trade { grid-area: trade; }
  .mem10-status { grid-area: status; justify-self: end; }
  .mem10-actions { grid-area: actions; align-self: start; }
}
@media (max-width: 720px) {
  .mem10-hero { grid-template-columns: 1fr; padding: 16px; }
  .mem10-hero__actions { justify-content: stretch; }
  .mem10-hero__actions .nx-btn { flex: 1; justify-content: center; }
  .mem10-stats { grid-template-columns: 1fr; }
  .mem10-toolbar { grid-template-columns: 1fr; }
  .mem10-sort { justify-content: flex-start; }
  .mem10-search .nx-btn span { display: none; }
  .mem10-cta { display: none; }
  .mem10-row {
    grid-template-areas:
      "user actions"
      "role role"
      "metrics metrics"
      "trade status";
  }
}

/* �� Thread dock v10 (sticky) �� */
.thread-dock--v10 {
  position: sticky;
  top: 0;
  z-index: 55;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px 14px;
  margin: 0;
  padding: 8px 12px 8px 10px;
  border-radius: var(--radius-lg, 14px);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-primary);
  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
  backdrop-filter: blur(16px) saturate(1.2);
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset,
    0 8px 22px color-mix(in srgb, #000 14%, transparent);
}
.thread-pulse--v10 {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}
.thread-pulse--v10 > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 10px;
  border-radius: 10px;
  border: 1px solid var(--color-border);
  background: var(--color-elevated);
  color: var(--color-muted);
  font-size: 12.5px;
  font-weight: 650;
}
.thread-pulse--v10 b {
  color: var(--color-text);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.thread-pulse--v10 em {
  font-style: normal;
  font-size: 11px;
  font-weight: 600;
  color: var(--color-muted);
  opacity: .9;
}
.thread-pulse--v10 .yon-ico { color: var(--color-primary-ink, var(--color-primary)); flex: none; }
.thread-dock--v10 .thread-dock__tools {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  margin-left: auto;
}
.thread-dock--v10 .thread-dock__tools form { margin: 0; }
.yon-thread--v10 .thread-dock--v10 .th-btn {
  min-height: 34px;
  padding: 0 11px;
  border-radius: 10px;
  font-size: 12.5px;
  background: var(--color-elevated);
}
.yon-thread--v10 .thread-dock--v10 .th-btn.is-on {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 42%, var(--color-border));
  background: var(--color-soft-primary);
}
.yon-thread--v10 .thread-dock--v10 .th-btn--main {
  min-width: 108px;
  background: var(--color-primary);
  color: var(--color-on-primary, #fff);
  border-color: var(--color-primary);
  box-shadow: none;
}
.yon-thread--v10 .thread-dock--v10 .th-btn--main:hover {
  background: var(--color-primary-hover);
  color: var(--color-on-primary, #fff);
  filter: none;
}
.yon-thread--v10 .thread-dock--v10 .th-btn.is-static {
  opacity: .8;
}

@media (max-width: 900px) {
  .thread-dock--v10 {
    position: sticky !important;
    top: 0 !important;
    z-index: 55;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 12px;
  }
  .thread-pulse--v10 > span em { display: none; }
  .thread-dock--v10 .thread-dock__tools {
    width: 100%;
    margin-left: 0;
    justify-content: stretch;
  }
  .thread-dock--v10 .thread-dock__tools .th-btn,
  .thread-dock--v10 .thread-dock__tools form {
    flex: 1 1 calc(33.33% - 4px);
  }
  .thread-dock--v10 .thread-dock__tools .th-btn--main {
    flex: 1 1 100%;
    min-width: 0;
  }
  .thread-dock--v10 .th-btn span { font-size: 12px; }
}
@media (max-width: 560px) {
  .thread-dock--v10 .th-btn span { display: none; }
  .thread-dock--v10 .th-btn--main span { display: inline; }
  .thread-dock--v10 .thread-dock__tools .th-btn {
    flex: 1 1 calc(25% - 4px);
    min-width: 40px;
    padding: 0 8px;
  }
  .thread-dock--v10 .thread-dock__tools .th-btn--main {
    flex: 1 1 calc(50% - 4px);
  }
  .thread-pulse--v10 > span { min-height: 30px; padding: 0 8px; font-size: 12px; }
}

/* —— Partner shelf (nxs) — R10 palette, blocker-safe names —— */
.nxs { position: relative; }
.nxs-mark {
  flex: none; width: 34px; height: 34px; border-radius: 9px;
  display: grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 22%, var(--color-elevated));
  color: var(--color-text); font-weight: 800; font-size: 14px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.nxs-mark--lg { width: 44px; height: 44px; font-size: 17px; border-radius: 11px; }
.nxs-cta {
  margin-left: auto; flex: none;
  font-size: 12px; font-weight: 750;
  padding: 6px 11px; border-radius: 8px;
  background: color-mix(in srgb, var(--color-primary) 18%, transparent);
  color: var(--color-text); border: 1px solid color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.nxs-cta--block { margin: 6px 0 0; display: inline-flex; }
.nxs-x {
  position: absolute; top: 50%; right: 8px; transform: translateY(-50%);
  width: 28px; height: 28px; border: 0; border-radius: 8px;
  display: grid; place-items: center; cursor: pointer;
  background: color-mix(in srgb, var(--color-text) 8%, transparent);
  color: var(--color-muted);
}
.nxs-x:hover { background: color-mix(in srgb, var(--color-text) 14%, transparent); color: var(--color-text); }
.nxs-x--soft { top: 10px; transform: none; }
.nxs-x--sm { width: 22px; height: 22px; position: static; transform: none; }
.nxs-chip {
  display: inline-flex; width: fit-content;
  padding: 2px 8px; border-radius: 999px;
  font-size: 10.5px; font-weight: 780; letter-spacing: .04em; text-transform: uppercase;
  background: color-mix(in srgb, var(--color-primary) 16%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
}

.nxs-top {
  position: relative;
  display: flex; align-items: center;
  min-height: 46px;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-surface));
  border-bottom: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
}
.nxs-top__link {
  flex: 1; min-width: 0;
  display: flex; align-items: center; justify-content: center; gap: 12px;
  padding: 8px 48px 8px 16px;
  color: var(--color-text); text-decoration: none;
  max-width: min(1560px, calc(100% - 28px));
  margin-inline: auto; width: 100%;
}
.nxs-top__copy {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px;
  min-width: 0; justify-content: center; text-align: center;
}
.nxs-top__copy strong { font-size: 13.5px; font-weight: 780; }
.nxs-top__copy small { font-size: 12px; color: var(--color-muted); }
.nxs-top .nxs-x { right: max(10px, calc((100vw - 1560px) / 2 + 10px)); }

.nxs-stack {
  display: grid; gap: 8px;
  max-width: min(1560px, calc(100% - 28px));
  margin: 12px auto 8px;
}
.nxs-row {
  position: relative;
  display: flex; align-items: stretch;
  min-height: 58px;
  border-radius: 12px;
  overflow: hidden;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent);
}
.nxs-row::before {
  content: ""; position: absolute; inset: 0 auto 0 0; width: 3px;
  background: var(--color-primary);
}
.nxs-row--a::before { background: var(--color-primary); }
.nxs-row--b::before { background: var(--color-danger); }
.nxs-row--c::before { background: var(--color-success); }
.nxs-row--a { background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface)); border-color: color-mix(in srgb, var(--color-primary) 18%, var(--color-border)); }
.nxs-row--b { background: color-mix(in srgb, var(--color-danger) 7%, var(--color-surface)); border-color: color-mix(in srgb, var(--color-danger) 16%, var(--color-border)); }
.nxs-row--c { background: color-mix(in srgb, var(--color-success) 7%, var(--color-surface)); border-color: color-mix(in srgb, var(--color-success) 16%, var(--color-border)); }
.nxs-row__link {
  flex: 1; min-width: 0;
  display: flex; align-items: center; gap: 12px;
  padding: 10px 44px 10px 16px;
  color: var(--color-text); text-decoration: none;
}
.nxs-row__copy { display: grid; gap: 1px; min-width: 0; }
.nxs-row__copy em {
  font-style: normal; font-size: 10.5px; font-weight: 750;
  letter-spacing: .05em; text-transform: uppercase; color: var(--color-muted);
}
.nxs-row__copy strong {
  font-size: 14px; font-weight: 780;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.nxs-row__copy small {
  font-size: 12px; color: var(--color-muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.nxs-pair {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
  max-width: min(1560px, calc(100% - 28px));
  margin: 0 auto 14px;
}
.nxs-tile {
  position: relative;
  min-height: 96px; border-radius: 12px; overflow: hidden;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
}
.nxs-tile--soft {
  background: color-mix(in srgb, var(--color-primary) 10%, var(--color-surface));
  border-color: color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
}
.nxs-tile--warm {
  background: color-mix(in srgb, var(--color-warning) 10%, var(--color-surface));
  border-color: color-mix(in srgb, var(--color-warning) 22%, var(--color-border));
}
.nxs-tile__link {
  display: grid; gap: 4px; align-content: center;
  min-height: 96px; padding: 14px 42px 14px 16px;
  color: var(--color-text); text-decoration: none;
}
.nxs-tile__link strong { font-size: 14.5px; font-weight: 780; }
.nxs-tile__link small { font-size: 12.5px; color: var(--color-muted); }
.nxs-tile--warm .nxs-chip {
  background: color-mix(in srgb, var(--color-warning) 18%, transparent);
  color: color-mix(in srgb, var(--color-warning) 70%, var(--color-text));
}

.nxs-rail {
  position: fixed;
  top: 140px;
  left: 0;
  z-index: 5;
  width: 160px;
  max-height: 600px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-border) 78%, var(--color-primary));
  background: var(--color-surface);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .24);
  display: none;
  flex-direction: column;
  visibility: hidden;
  pointer-events: none;
}
.nxs-rail.is-on {
  display: flex;
  visibility: visible;
  pointer-events: auto;
}
.nxs-rail[hidden] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.nxs-rail--frame {
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, var(--color-primary));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 55%, transparent), transparent 40%),
    var(--color-surface);
  box-shadow:
    0 0 0 1px color-mix(in srgb, #fff 4%, transparent) inset,
    0 12px 30px rgba(0, 0, 0, .26);
}
.nxs-rail__head {
  display: flex; align-items: center; justify-content: space-between;
  flex: none;
  min-height: 30px; padding: 0 6px 0 10px;
  background: color-mix(in srgb, var(--color-elevated) 88%, transparent);
  color: var(--color-muted); font-size: 11px; font-weight: 750;
  border-bottom: 1px solid var(--color-border);
  letter-spacing: .02em;
}
.nxs-rail__head .nxs-x--sm {
  width: 26px; height: 26px; border-radius: 7px;
  display: grid; place-items: center;
  border: 0; background: transparent; color: var(--color-muted);
  cursor: pointer;
}
.nxs-rail__head .nxs-x--sm:hover {
  background: color-mix(in srgb, var(--color-danger) 18%, transparent);
  color: var(--color-text);
}
.nxs-rail__body {
  flex: 1;
  display: grid; gap: 10px; place-content: center; place-items: center; text-align: center;
  min-height: 0; padding: 22px 12px;
  color: var(--color-text); text-decoration: none;
}
.nxs-rail--cool .nxs-rail__body {
  background: linear-gradient(165deg,
    color-mix(in srgb, var(--color-primary) 16%, var(--color-surface)),
    var(--color-elevated));
}
.nxs-rail--mist .nxs-rail__body {
  background: linear-gradient(165deg,
    color-mix(in srgb, var(--color-primary) 8%, var(--color-elevated)),
    color-mix(in srgb, var(--color-success) 8%, var(--color-surface)));
}
.nxs-rail__body strong { font-size: 12.5px; font-weight: 780; line-height: 1.35; }
.nxs-rail__body small { font-size: 11px; color: var(--color-muted); line-height: 1.35; }
.nxs-rail--filled {
  height: auto;
  max-height: 600px;
  padding: 0;
}
.nxs-rail--filled .nxs-rail__slot {
  display: block;
  width: 100%;
  line-height: 0;
  background: #0b1220;
}
.nxs-rail--filled .nxs-creative,
.nxs-rail--filled .nxs-creative--rail,
.nxs-rail--filled .nxs-creative--media {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0;
  overflow: hidden;
  background: transparent;
  box-shadow: none !important;
  text-decoration: none;
  gap: 0 !important;
}
.nxs-rail--filled .nxs-creative--media img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: 560px;
  object-fit: contain;
  object-position: top center;
  background: #0b1220;
}
.nxs-rail:not(.nxs-rail--filled) {
  height: 600px;
}
.nxs-row--filled {
  padding: 0;
  overflow: hidden;
}
.nxs-row--filled .nxs-row__slot {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: stretch;
}
.nxs-row--filled .nxs-row__slot .nxs-creative,
.nxs-row--filled .nxs-row__slot .yon-mark {
  flex: 1;
  width: 100%;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  min-height: 56px;
}
.nxs-row--filled .nxs-creative--media img {
  width: 100%;
  max-height: 90px;
  object-fit: contain;
  display: block;
}
.nxs-tile--filled {
  padding: 0;
  overflow: hidden;
}
.nxs-tile--filled .nxs-tile__slot .nxs-creative,
.nxs-tile--filled .nxs-tile__slot .yon-mark {
  width: 100%;
  border: 0;
  border-radius: 0;
  min-height: 72px;
}
.nxs-tile--filled .nxs-creative--media img {
  width: 100%;
  max-height: 120px;
  object-fit: contain;
  display: block;
}
[data-nxs-id][hidden] { display: none !important; }
@media (max-width: 900px) {
  .nxs-stack, .nxs-pair { max-width: calc(100% - 20px); margin-inline: auto; }
  .nxs-pair { grid-template-columns: 1fr; }
  .nxs-cta:not(.nxs-cta--block) { display: none; }
  .nxs-row__copy small { display: none; }
}
@media (max-width: 560px) {
  .nxs-row { min-height: 50px; border-radius: 10px; }
  .nxs-mark { width: 30px; height: 30px; font-size: 13px; }
  .nxs-row__copy strong { font-size: 13px; }
}

/* —— Shop ads /reklam v11 (spon11) —— */
.spon11 {
  --ads-line: color-mix(in srgb, var(--color-border) 88%, transparent);
  --ads-card: color-mix(in srgb, var(--color-elevated) 48%, var(--color-surface));
  --ads-accent: #38bdf8;
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  gap: 18px;
  max-width: 1560px;
  margin: 0 auto;
  min-height: 320px;
  width: 100%;
  color: var(--color-text);
}
.app-frame:has(.spon11),
.app-main:has(.spon11) {
  min-width: 0;
  width: 100%;
}
.app-main:has(.spon11) {
  padding-top: 8px;
  padding-bottom: 28px;
}

.spon11-kicker {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--ads-accent);
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.spon11-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(240px, .7fr);
  gap: 16px;
  padding: 22px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--ads-accent) 26%, var(--color-border));
  background:
    radial-gradient(520px 180px at 6% -18%, color-mix(in srgb, var(--ads-accent) 18%, transparent), transparent 60%),
    radial-gradient(420px 160px at 94% 0%, color-mix(in srgb, var(--color-primary) 14%, transparent), transparent 55%),
    linear-gradient(160deg, color-mix(in srgb, var(--ads-accent) 10%, transparent), transparent 50%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
}
.spon11-hero__copy { min-width: 0; display: grid; gap: 10px; align-content: start; }
.spon11-hero h1 {
  margin: 0;
  font-size: clamp(1.55rem, 3.2vw, 2.2rem);
  letter-spacing: -.02em;
  line-height: 1.15;
}
.spon11-lead {
  margin: 0;
  max-width: 64ch;
  color: var(--color-muted);
  font-size: 14.5px;
  line-height: 1.55;
}
.spon11-hero__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.spon11-trust {
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.spon11-trust li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid var(--ads-line);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 650;
}
.spon11-status {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid var(--ads-line);
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--ads-accent) 14%, transparent), transparent 55%),
    var(--ads-card);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.spon11-status em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.spon11-status strong {
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -.02em;
}
.spon11-status strong.is-disc { color: var(--ads-accent); }
.spon11-status span { color: var(--color-muted); font-size: 13px; line-height: 1.4; }
.spon11-status__link {
  color: var(--ads-accent);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.spon11-status__link:hover { text-decoration: underline; }
.spon11-status .nx-btn { justify-self: start; margin-top: 4px; }

.spon11-jump {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  border-radius: 14px;
  border: 1px solid var(--ads-line);
  background: var(--ads-card);
  position: sticky;
  top: 8px;
  z-index: 8;
}
.spon11-jump a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  color: var(--color-muted);
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid transparent;
}
.spon11-jump a:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--ads-accent) 12%, transparent);
  border-color: color-mix(in srgb, var(--ads-accent) 24%, transparent);
}

.spon11-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.spon11-step {
  display: grid;
  gap: 6px;
  padding: 16px;
  border-radius: 14px;
  border: 1px solid var(--ads-line);
  background: var(--color-surface);
}
.spon11-step > span {
  width: fit-content;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  color: var(--ads-accent);
}
.spon11-step strong { font-size: 15px; }
.spon11-step p { margin: 0; color: var(--color-muted); font-size: 13px; line-height: 1.45; }

.spon11-highlights {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.spon11-hl {
  display: grid;
  gap: 7px;
  padding: 16px;
  border-radius: 14px;
  border: 1px solid var(--ads-line);
  background: var(--ads-card);
}
.spon11-hl__ico {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--ads-accent) 14%, transparent);
  color: var(--ads-accent);
  border: 1px solid color-mix(in srgb, var(--ads-accent) 22%, transparent);
}
.spon11-hl strong { font-size: 14.5px; }
.spon11-hl p { margin: 0; color: var(--color-muted); font-size: 12.5px; line-height: 1.4; }

.spon11-sec__head {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.spon11-sec__head h2 { margin: 0; font-size: 1.2rem; }
.spon11-sec__head .nx-muted { margin: 4px 0 0; }
.spon11-disc-pill {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 780;
  color: var(--ads-accent);
  background: color-mix(in srgb, var(--ads-accent) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--ads-accent) 28%, transparent);
}
.spon11-disc-link {
  font-size: 13px;
  font-weight: 700;
  color: var(--color-primary-ink, var(--color-primary));
  text-decoration: none;
}
.spon11-disc-link:hover { text-decoration: underline; }

.spon11-places__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.spon11-place {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid var(--ads-line);
  background: var(--color-surface);
  transition: border-color .14s ease;
}
.spon11-place:hover {
  border-color: color-mix(in srgb, var(--ads-accent) 36%, var(--color-border));
}
.spon11-place__preview {
  height: 88px;
  border-radius: 12px;
  padding: 12px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--ads-accent) 8%, transparent), transparent),
    color-mix(in srgb, var(--color-elevated) 70%, transparent);
  border: 1px dashed color-mix(in srgb, var(--ads-accent) 28%, var(--color-border));
  display: grid;
  place-items: center;
}
.spon11-place__frame {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
}
.spon11-place__mock {
  display: block;
  border-radius: 7px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--ads-accent) 55%, #fff), color-mix(in srgb, var(--color-primary) 50%, var(--ads-accent)));
  box-shadow: 0 6px 16px color-mix(in srgb, var(--ads-accent) 18%, transparent);
}
.spon11-place--top .spon11-place__mock { width: 94%; height: 18px; }
.spon11-place--strip .spon11-place__mock { width: 90%; height: 24px; }
.spon11-place--mid .spon11-place__mock { width: 72%; height: 30px; }
.spon11-place--rail .spon11-place__mock { width: 26px; height: 58px; }
.spon11-place--thread .spon11-place__mock { width: 82%; height: 20px; }
.spon11-place--home .spon11-place__mock { width: 58%; height: 40px; border-radius: 10px; }
.spon11-place__meta { display: grid; gap: 3px; }
.spon11-place strong { font-size: 14.5px; }
.spon11-place em {
  font-style: normal;
  color: var(--ads-accent);
  font-size: 12.5px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.spon11-place small { color: var(--color-muted); font-size: 12px; line-height: 1.4; }

.spon11-tiers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.spon11-card {
  --tone: var(--ads-accent);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 100%;
  padding: 18px 16px 16px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--tone) 24%, var(--color-border));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--tone) 10%, transparent), transparent 72px),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  overflow: hidden;
}
.spon11-card::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--tone);
}
.spon11-card--strip { --tone: #34d399; }
.spon11-card--mid { --tone: #38bdf8; }
.spon11-card--rail { --tone: var(--color-primary); }
.spon11-card--spot { --tone: #a78bfa; }
.spon11-card--comm { --tone: #fb923c; }
.spon11-card--launch { --tone: #fbbf24; }
.spon11-card.is-hot {
  border-color: color-mix(in srgb, var(--tone) 48%, var(--color-border));
  box-shadow: 0 14px 30px color-mix(in srgb, var(--tone) 14%, transparent);
}
.spon11-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.spon11-card__tone {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tone);
}
.spon11-card__ribbon {
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--tone);
  color: #0b1220;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.spon11-card__period {
  margin: 0;
  color: var(--color-muted);
  font-size: 12.5px;
  font-weight: 650;
}
.spon11-card h2 { margin: 0; font-size: 1.25rem; font-weight: 800; }
.spon11-card__price {
  font-size: 1.55rem;
  font-weight: 800;
  letter-spacing: -.03em;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
}
.spon11-card__price s {
  font-size: 13px;
  font-weight: 650;
  color: var(--color-muted);
}
.spon11-card__place {
  color: var(--color-muted);
  font-size: 12.5px;
}
.spon11-card ul {
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 7px;
  flex: 1;
}
.spon11-card ul li {
  position: relative;
  padding-left: 18px;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 1.4;
}
.spon11-card ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .45em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--tone) 75%, transparent);
}
.spon11-card__foot { margin-top: auto; padding-top: 6px; }
.spon11-card__foot .nx-btn,
.spon11-card__foot form { width: 100%; }
.spon11-card__foot .nx-btn { justify-content: center; }

.spon11-specs__row {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.spon11-specs__row > div {
  display: grid;
  gap: 4px;
  padding: 14px 12px;
  border-radius: 14px;
  text-align: center;
  border: 1px solid var(--ads-line);
  background: var(--ads-card);
}
.spon11-specs__row strong {
  font-size: 14px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--ads-accent);
}
.spon11-specs__row span { color: var(--color-muted); font-size: 12px; }

.spon11-faq__list { display: grid; gap: 8px; }
.spon11-faq__item {
  border-radius: 14px;
  border: 1px solid var(--ads-line);
  background: var(--ads-card);
  padding: 0 16px;
}
.spon11-faq__item summary {
  cursor: pointer;
  list-style: none;
  padding: 14px 0;
  font-weight: 750;
  font-size: 14px;
}
.spon11-faq__item summary::-webkit-details-marker { display: none; }
.spon11-faq__item p {
  margin: 0 0 14px;
  color: var(--color-muted);
  font-size: 13.5px;
  line-height: 1.5;
}

.spon11-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 20px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--ads-accent) 28%, var(--color-border));
  background:
    linear-gradient(115deg, color-mix(in srgb, var(--ads-accent) 14%, transparent), transparent 50%),
    var(--color-surface);
}
.spon11-cta strong { display: block; font-size: 15px; }
.spon11-cta p {
  margin: 4px 0 0;
  color: var(--color-muted);
  font-size: 13.5px;
  line-height: 1.45;
  max-width: 62ch;
}
.spon11-cta__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.spon11-orders { margin: 0; }

@media (max-width: 1100px) {
  .spon11-hero { grid-template-columns: 1fr; }
  .spon11-steps { grid-template-columns: 1fr 1fr; }
  .spon11-highlights { grid-template-columns: 1fr 1fr; }
  .spon11-places__grid { grid-template-columns: 1fr 1fr; }
  .spon11-tiers { grid-template-columns: 1fr 1fr; }
  .spon11-specs__row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .spon11-steps,
  .spon11-highlights,
  .spon11-places__grid,
  .spon11-tiers,
  .spon11-specs__row { grid-template-columns: 1fr; }
  .spon11-jump { top: 0; border-radius: 12px; }
  .spon11-cta { align-items: stretch; }
  .spon11-cta__actions { width: 100%; }
  .spon11-cta__actions .nx-btn { flex: 1; justify-content: center; }
}

/* legacy shop-hero--ads kept for old cache fragments */
.shop-hero--ads { display: none; }


/* —— Account menu v10 —— */
.acct--v10 .acct__trigger {
  gap: 8px; padding: 3px 8px 3px 3px; border-radius: 12px;
  border: 1px solid transparent;
  transition: background var(--ease), border-color var(--ease);
}
.acct--v10 .acct__trigger:hover,
.acct--v10.is-open .acct__trigger,
.acct--v10.is-pinned .acct__trigger {
  background: var(--mast-link-bg);
  border-color: var(--header-line);
}
.acct--v10 .acct__avwrap,
.acct--v10 .acct__av {
  width: 34px; height: 34px; border-radius: 10px;
}
.acct--v10 .acct__hello small {
  color: var(--mast-link); font-size: 11px; font-weight: 650;
}
.acct--v10 .acct__hello strong {
  font-size: 13px; font-weight: 780; max-width: 120px;
  color: var(--mast-link-hover);
}
.acct--v10 .acct__gear {
  width: 28px; height: 28px; border-radius: 8px;
  background: var(--mast-link-bg);
  color: var(--mast-link);
}
.acct--v10 .acct__trigger:hover .acct__gear,
.acct--v10.is-open .acct__gear,
.acct--v10.is-pinned .acct__gear {
  color: var(--mast-link-hover);
}
.acct--v10 .acct__panel { width: min(340px, calc(100vw - 16px)); padding-top: 8px; }
.acct--v10 .acct__pass {
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 18%, var(--color-border));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 32%),
    var(--color-surface);
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset,
    0 16px 36px color-mix(in srgb, #000 24%, transparent);
}
.acct--v10 .acct__ribbon {
  height: 3px;
  background: linear-gradient(90deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 40%, #38bdf8) 55%, transparent);
  animation: none;
}
.acct--v10 .acct__hero {
  grid-template-columns: 56px minmax(0, 1fr) 34px;
  gap: 11px; padding: 16px 12px 12px;
  background: color-mix(in srgb, var(--color-elevated) 35%, transparent);
  border-bottom: 1px solid var(--color-border);
}
.acct--v10 .acct__avring {
  width: 56px; height: 56px; border-radius: 16px; padding: 2px;
  background: linear-gradient(145deg, var(--color-primary), var(--color-primary-active));
}
.acct--v10 .acct__hero-av {
  border-radius: 14px; font-size: 17px;
}
.acct--v10 .acct__who-top > strong { font-size: 15px; font-weight: 800; }
.acct--v10 .acct__profile-link {
  margin-left: auto;
  width: 24px; height: 24px; border-radius: 8px;
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-primary) 24%, transparent);
}
.acct--v10 .acct__profile-link:hover {
  color: var(--color-on-primary, #fff);
  background: var(--color-primary);
  border-color: transparent;
}
.acct--v10 .acct__verified {
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 16%, transparent);
}
.acct--v10 .acct__chip {
  font-size: 10.5px; padding: 3px 8px;
  background: var(--color-elevated);
}
.acct--v10 .acct__logout button {
  width: 32px; height: 32px; border-radius: 10px;
}
.acct--v10 .acct__quick { padding: 10px 10px 8px; gap: 7px; }
.acct--v10 .acct__quick a {
  border-radius: 12px; padding: 9px 4px;
  background: color-mix(in srgb, var(--color-elevated) 60%, transparent);
}
.acct--v10 .acct__meta { margin: 0 10px 10px; gap: 7px; }
.acct--v10 .acct__meta a { border-radius: 12px; padding: 9px 4px; }
.acct--v10 .acct__tabs {
  padding: 0 10px 8px; gap: 6px;
  background: transparent;
}
.acct--v10 .acct__tabs button {
  height: 34px; border-radius: 10px; font-size: 12.5px;
}
.acct--v10 .acct__tabs button + button { border-left: 1px solid var(--color-border); }
.acct--v10 .acct__tabs button.is-active {
  color: var(--color-on-primary, #fff);
  background: var(--color-primary);
  border-color: var(--color-primary);
  box-shadow: none;
}
.acct--v10 .acct__tabs button.is-active .yon-ico { color: inherit; opacity: 1; }
.acct--v10 .acct__scroll {
  max-height: 260px; margin: 0 8px 8px; border-radius: 12px;
  background: color-mix(in srgb, var(--color-elevated) 22%, transparent);
}
.acct--v10 .acct__list a {
  padding: 10px 11px; font-size: 13px; font-weight: 650;
  border-top-color: color-mix(in srgb, var(--color-border) 65%, transparent);
}
.acct--v10 .acct__list a:hover {
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
}
.acct--v10 .acct__foot {
  gap: 8px; padding: 0 10px 12px;
}
.acct--v10 .acct__foot a {
  min-height: 38px; border-radius: 11px; font-size: 12.5px;
}
.acct--v10 .acct__foot a.is-invite {
  box-shadow: 0 8px 18px color-mix(in srgb, var(--color-primary) 26%, transparent);
}
@media (max-width: 720px) {
  .acct--v10 .acct__panel { width: min(100vw - 12px, 340px); right: -4px; }
  .acct--v10 .acct__pass { max-height: min(78vh, calc(100vh - 56px)); border-radius: 14px; }
  .acct--v10 .acct__hero { padding: 14px 10px 10px; gap: 9px; }
  .acct--v10 .acct__avring { width: 48px; height: 48px; border-radius: 14px; }
  .acct--v10 .acct__hero-av { border-radius: 12px; }
  .acct--v10 .acct__scroll { max-height: 220px; }
}

/* —— Mast tools + acct mobile fix (overflow / kayık avatar) —— */
@media (max-width: 980px) {
  .mast__top--v10 .mast__inner--v10 {
    width: min(100% - 12px, 1560px);
    min-height: 56px;
    gap: 4px;
    padding: 6px 0 8px;
    min-width: 0;
    grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
  }
  .mast__top--v10 .mast-brand-wrap {
    min-width: 0;
    max-width: min(42vw, 168px);
    gap: 4px;
  }
  .mast__top--v10 .mast-brand--v10 { padding: 2px; gap: 8px; min-width: 0; }
  .mast__top--v10 .mast-brand__text { min-width: 0; }
  .mast__top--v10 .mast-brand__text small { display: none; }
  .mast__top--v10 .mast-brand__text strong {
    font-size: 13px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mast__top--v10 .mast-brand__logo {
    height: 28px;
    max-width: min(120px, 34vw);
  }
  .mast__top--v10 .mast-search--mob {
    width: 34px; height: 34px; border-radius: 10px; justify-self: end;
  }
  .mast__top--v10 .mast-tools-wrap {
    gap: 3px;
    min-width: 0;
    max-width: 100%;
    justify-self: end;
    justify-content: flex-end;
    flex-wrap: nowrap;
  }
  .mast__top--v10 .mast-cta--mob {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 34px; min-width: 34px; height: 34px; min-height: 34px;
    padding: 0 !important;
    border-radius: 10px;
    flex: 0 0 auto;
  }
  .mast__top--v10 .mast-cta--mob span:not(.mast-cta__ico) { display: none !important; }
  .mast__top--v10 .mast-cta--mob .mast-cta__ico {
    width: 34px; height: 34px; border-radius: 10px;
    background: color-mix(in srgb, #000 14%, transparent);
  }
  .mast__top--v10 .mast-tools--v10 {
    gap: 0;
    padding: 1px;
    border-radius: 12px;
    flex: 0 1 auto;
    min-width: 0;
  }
  .mast__top--v10 .mast-tools--v10 .mast-ico,
  .mast__top--v10 .mast-tools--v10 .icon-btn.mast-ico {
    width: 34px; height: 34px; border-radius: 10px;
  }
  .mast__top--v10 .acct--v10 {
    flex: 0 0 auto;
    max-width: 36px;
  }
  .mast__top--v10 .acct--v10 .acct__trigger {
    padding: 0 !important;
    gap: 0 !important;
    border: 0 !important;
    background: transparent !important;
    min-width: 34px;
    min-height: 34px;
  }
  .mast__top--v10 .acct--v10 .acct__hello,
  .mast__top--v10 .acct--v10 .acct__gear {
    display: none !important;
  }
  .mast__top--v10 .acct--v10 .acct__avwrap,
  .mast__top--v10 .acct--v10 .acct__av {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
  }
  .mast__top--v10 .acct--v10 .acct__avwrap {
    overflow: visible;
  }
  .mast__top--v10 .acct--v10 .acct__avwrap.is-online::after {
    left: auto;
    right: -1px;
    top: auto;
    bottom: -1px;
    transform: none;
    width: 9px;
    height: 9px;
    border-width: 2px;
  }
}
@media (max-width: 400px) {
  .mast__top--v10 .mast-brand__text { display: none; }
  .mast__top--v10 .mast-tools--v10 .mast-ico[href*='panel'],
  .mast__top--v10 .mast-tools--v10 a.mast-ico[href*='/panel'] {
    display: none;
  }
}

/* Premium adblock add-on card */
.shop-card--adblock {
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 50%),
    var(--color-surface);
}
.shop-card--adblock .shop-card__skus { margin-top: 4px; }
/* —— Premium shop v11 (prem11) —— */
.prem11 {
  --prem-line: color-mix(in srgb, var(--color-border) 88%, transparent);
  --prem-card: color-mix(in srgb, var(--color-elevated) 48%, var(--color-surface));
  display: grid;
  gap: 18px;
  max-width: 1560px;
  margin: 0 auto;
}
.prem11-kicker {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--color-primary-ink, var(--color-primary));
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.prem11-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(240px, .7fr);
  gap: 16px;
  padding: 22px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, var(--color-border));
  background:
    radial-gradient(520px 180px at 8% -20%, color-mix(in srgb, var(--color-warning) 14%, transparent), transparent 60%),
    radial-gradient(420px 160px at 92% 0%, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 55%),
    linear-gradient(160deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 50%),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
}
.prem11-hero__copy { min-width: 0; display: grid; gap: 10px; align-content: start; }
.prem11-hero h1 {
  margin: 0;
  font-size: clamp(1.55rem, 3.2vw, 2.2rem);
  letter-spacing: -.02em;
  line-height: 1.15;
}
.prem11-lead {
  margin: 0;
  max-width: 62ch;
  color: var(--color-muted);
  font-size: 14.5px;
  line-height: 1.55;
}
.prem11-hero__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.prem11-trust {
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.prem11-trust li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid var(--prem-line);
  background: color-mix(in srgb, var(--color-elevated) 40%, transparent);
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 650;
}
.prem11-status {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 16px;
  border-radius: 16px;
  border: 1px solid var(--prem-line);
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 55%),
    var(--prem-card);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
}
.prem11-status em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.prem11-status strong {
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -.02em;
  color: var(--prem-tone, var(--color-text));
}
.prem11-status span { color: var(--color-muted); font-size: 13px; line-height: 1.4; }
.prem11-status__link {
  color: var(--color-primary-ink, var(--color-primary));
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.prem11-status__link:hover { text-decoration: underline; }
.prem11-status .nx-btn { justify-self: start; margin-top: 4px; }

.prem11-jump {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  border-radius: 14px;
  border: 1px solid var(--prem-line);
  background: var(--prem-card);
  position: sticky;
  top: 8px;
  z-index: 8;
}
.prem11-jump a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  color: var(--color-muted);
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid transparent;
}
.prem11-jump a:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
  border-color: color-mix(in srgb, var(--color-primary) 22%, transparent);
}

.prem11-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.prem11-step {
  display: grid;
  gap: 6px;
  padding: 16px;
  border-radius: 14px;
  border: 1px solid var(--prem-line);
  background: var(--color-surface);
}
.prem11-step > span {
  width: fit-content;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  color: var(--color-primary-ink, var(--color-primary));
}
.prem11-step strong { font-size: 15px; }
.prem11-step p { margin: 0; color: var(--color-muted); font-size: 13px; line-height: 1.45; }

.prem11-highlights {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.prem11-hl {
  display: grid;
  gap: 7px;
  padding: 16px;
  border-radius: 14px;
  border: 1px solid var(--prem-line);
  background: var(--prem-card);
}
.prem11-hl__ico {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  color: var(--color-primary-ink, var(--color-primary));
  border: 1px solid color-mix(in srgb, var(--color-primary) 20%, transparent);
}
.prem11-hl strong { font-size: 14.5px; }
.prem11-hl p { margin: 0; color: var(--color-muted); font-size: 12.5px; line-height: 1.4; }

.prem11-sec__head {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.prem11-sec__head h2 { margin: 0; font-size: 1.2rem; }
.prem11-sec__head .nx-muted { margin: 4px 0 0; }

.prem11-billing {
  display: inline-flex;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid var(--prem-line);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  gap: 2px;
}
.prem11-billing button {
  min-height: 34px;
  padding: 0 14px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--color-muted);
  font: inherit;
  font-size: 12.5px;
  font-weight: 750;
  cursor: pointer;
}
.prem11-billing button.is-on {
  background: var(--color-primary);
  color: #fff;
}

.prem11-adblock {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, .75fr);
  gap: 18px;
  align-items: center;
  padding: 20px 22px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 14%, transparent), transparent 55%),
    var(--color-surface);
}
.prem11-adblock h2 { margin: 6px 0 8px; font-size: 1.35rem; }
.prem11-pill {
  display: inline-flex;
  width: fit-content;
  margin: 0 0 8px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 780;
}
.prem11-pill.is-on {
  background: color-mix(in srgb, var(--color-success) 16%, transparent);
  color: var(--color-success);
}
.prem11-pill.is-off {
  background: color-mix(in srgb, var(--color-warning) 16%, transparent);
  color: var(--color-warning);
}
.prem11-adblock__perks {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.prem11-adblock__perks li {
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 650;
  border: 1px solid var(--prem-line);
  background: color-mix(in srgb, var(--color-elevated) 50%, transparent);
  color: var(--color-muted);
}
.prem11-adblock__buy { display: grid; gap: 8px; }
.prem11-adblock__btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  padding: 0 14px;
  border-radius: 12px;
  cursor: pointer;
  border: 1px solid var(--color-border);
  background: var(--color-elevated);
  color: var(--color-text);
  font: inherit;
  text-align: left;
}
.prem11-adblock__btn strong { display: block; font-size: 18px; font-weight: 800; }
.prem11-adblock__btn small { color: var(--color-muted); font-size: 12.5px; font-weight: 650; }
.prem11-adblock__btn em {
  font-style: normal;
  font-size: 12.5px;
  font-weight: 780;
  color: var(--color-primary-ink, var(--color-primary));
}
.prem11-adblock__btn.is-main {
  background: var(--color-primary);
  color: #fff;
  border-color: transparent;
}
.prem11-adblock__btn.is-main small,
.prem11-adblock__btn.is-main em { color: color-mix(in srgb, #fff 82%, transparent); }
.prem11-adblock__btn:hover { filter: brightness(1.05); }

.prem11-tiers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.prem11-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 100%;
  padding: 18px 16px 16px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--tier, var(--color-primary)) 24%, var(--color-border));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--tier, var(--color-primary)) 8%, transparent), transparent 72px),
    var(--color-surface);
  box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
  overflow: hidden;
}
.prem11-card::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: var(--tier, var(--color-primary));
}
.prem11-card.is-hot {
  border-color: color-mix(in srgb, var(--tier, var(--color-primary)) 48%, var(--color-border));
  box-shadow: 0 14px 30px color-mix(in srgb, var(--tier, var(--color-primary)) 14%, transparent);
}
.prem11-card.is-current {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--tier, var(--color-primary)) 14%, transparent), transparent 80px),
    color-mix(in srgb, var(--tier, var(--color-primary)) 6%, var(--color-surface));
}
.prem11-card__head {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-height: 36px;
}
.prem11-card__head > p {
  margin: 0;
  flex: 1;
  min-width: 0;
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.35;
}
.prem11-card__dot {
  flex: none;
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--tier, var(--color-primary));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tier, var(--color-primary)) 22%, transparent);
}
.prem11-card__ribbon {
  flex: none;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--tier, var(--color-primary));
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  font-style: normal;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.prem11-card__ribbon.is-current {
  background: color-mix(in srgb, var(--color-success) 85%, #000);
}
.prem11-card h2 { margin: 0; font-size: 1.25rem; font-weight: 800; }
.prem11-card__price {
  font-size: 1.55rem;
  font-weight: 800;
  letter-spacing: -.03em;
  color: var(--color-text);
}
.prem11-card__price small {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--color-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.prem11-card__save {
  display: inline-flex;
  width: fit-content;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 780;
  color: var(--color-success);
  background: color-mix(in srgb, var(--color-success) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-success) 22%, transparent);
}
.prem11-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 7px;
  flex: 1;
}
.prem11-card ul li {
  position: relative;
  padding-left: 18px;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 1.4;
}
.prem11-card ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .45em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--tier, var(--color-primary)) 70%, transparent);
}
.prem11-card__foot { margin-top: auto; padding-top: 4px; }
.prem11-skus { display: grid; gap: 7px; }
.prem11-skus .nx-btn,
.prem11-card__foot > .nx-btn { width: 100%; }

.prem11-compare__wrap {
  overflow-x: auto;
  border-radius: 16px;
  border: 1px solid var(--prem-line);
  background: var(--color-surface);
}
.prem11-table {
  width: 100%;
  min-width: 780px;
  border-collapse: collapse;
  font-size: 13px;
}
.prem11-table th,
.prem11-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--prem-line);
  text-align: center;
  white-space: nowrap;
}
.prem11-table thead th {
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
  font-size: 12px;
  font-weight: 800;
  color: var(--color-text);
}
.prem11-table tbody th {
  text-align: left;
  font-weight: 700;
  color: var(--color-text);
  white-space: normal;
  min-width: 160px;
}
.prem11-table tbody tr:last-child th,
.prem11-table tbody tr:last-child td { border-bottom: 0; }
.prem11-table td.is-yes { color: var(--color-success); font-weight: 800; }
.prem11-table td.is-no { color: var(--color-muted); }

.prem11-faq__list { display: grid; gap: 8px; }
.prem11-faq__item {
  border-radius: 14px;
  border: 1px solid var(--prem-line);
  background: var(--prem-card);
  padding: 0 16px;
}
.prem11-faq__item summary {
  cursor: pointer;
  list-style: none;
  padding: 14px 0;
  font-weight: 750;
  font-size: 14px;
}
.prem11-faq__item summary::-webkit-details-marker { display: none; }
.prem11-faq__item p {
  margin: 0 0 14px;
  color: var(--color-muted);
  font-size: 13.5px;
  line-height: 1.5;
}

.prem11-cta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 20px;
  border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 24%, var(--color-border));
  background:
    linear-gradient(115deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 50%),
    var(--color-surface);
}
.prem11-cta strong { display: block; font-size: 15px; }
.prem11-cta p { margin: 4px 0 0; color: var(--color-muted); font-size: 13.5px; line-height: 1.45; max-width: 62ch; }
.prem11-cta__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.prem11-orders { margin: 0; }

@media (max-width: 1100px) {
  .prem11-hero { grid-template-columns: 1fr; }
  .prem11-highlights { grid-template-columns: 1fr 1fr; }
  .prem11-tiers { grid-template-columns: 1fr 1fr; }
  .prem11-adblock { grid-template-columns: 1fr; }
  .prem11-steps { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .prem11-highlights,
  .prem11-tiers { grid-template-columns: 1fr; }
  .prem11-jump { top: 0; border-radius: 12px; }
  .prem11-cta { align-items: stretch; }
  .prem11-cta__actions { width: 100%; }
  .prem11-cta__actions .nx-btn { flex: 1; justify-content: center; }
}

/* legacy prem10 hooks kept for cache safety */
.shop--premium .shop-grid--tiers { gap: 14px; }
.shop--premium .shop-card--adblock { margin-bottom: 4px; }


/* Footer v12 — same footprint, refined visual language */
.site-foot--v12 {
  --sf12-line: color-mix(in srgb, var(--color-border) 86%, transparent);
  --sf12-card: color-mix(in srgb, var(--color-elevated) 48%, var(--color-surface));
  --sf12-inset: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
  background:
    radial-gradient(720px 220px at 12% -8%, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 62%),
    radial-gradient(520px 180px at 92% 0%, color-mix(in srgb, #34d399 8%, transparent), transparent 55%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 110px),
    var(--color-surface);
  border-top: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  color: var(--color-muted);
  overflow: visible;
}
.app-footer:has(.site-foot--v12) { padding-bottom: 0; }
.site-foot--v12 .sf12 {
  width: min(1560px, calc(100% - 32px));
  margin: 0 auto;
  padding: 8px 0 10px;
  display: grid;
  gap: 8px;
}
.sf12-ribbon {
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg,
    var(--color-primary),
    #38bdf8 34%,
    #34d399 68%,
    color-mix(in srgb, var(--color-primary) 40%, transparent));
  background-size: 200% 100%;
  animation: sf12-ribbon 9s linear infinite;
  box-shadow: 0 0 12px color-mix(in srgb, var(--color-primary) 28%, transparent);
}
@keyframes sf12-ribbon {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}
.sf12-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid color-mix(in srgb, var(--color-border) 72%, var(--color-primary));
  border-radius: 14px;
  overflow: hidden;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 58%, transparent), transparent 70%),
    var(--sf12-card);
  box-shadow:
    var(--sf12-inset),
    0 8px 20px color-mix(in srgb, #000 10%, transparent);
}
.sf12-stat {
  position: relative;
  min-width: 0;
  padding: 9px 12px;
  border-right: 1px solid var(--sf12-line);
  display: flex;
  align-items: center;
  gap: 8px;
  transition: background .14s ease;
}
.sf12-stat::before {
  content: "";
  position: absolute;
  left: 16px; right: 16px; top: 0;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: color-mix(in srgb, var(--color-primary) 55%, transparent);
  opacity: 0;
  transition: opacity .14s ease;
}
.sf12-stat:hover { background: color-mix(in srgb, var(--color-primary) 9%, transparent); }
.sf12-stat:hover::before { opacity: 1; }
.sf12-stat:last-child { border-right: 0; }
.sf12-stat__ico {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  flex: none;
  background: color-mix(in srgb, var(--color-primary) 15%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
  border: 1px solid color-mix(in srgb, var(--color-primary) 24%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-primary) 6%, transparent);
}
.sf12-stat__ico.is-live {
  background: color-mix(in srgb, #22c55e 15%, var(--color-elevated));
  border-color: color-mix(in srgb, #22c55e 30%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, #22c55e 8%, transparent);
}
.sf12-stat__copy { min-width: 0; display: grid; gap: 2px; }
.sf12-stat__copy > span {
  font-size: 10px;
  font-weight: 780;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.sf12-stat__copy > span em {
  font-style: normal;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
  opacity: .72;
}
.sf12-stat__copy strong {
  font-size: 15px;
  font-weight: 800;
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sf12-stat__copy strong a { color: var(--color-primary-ink, var(--color-primary)); text-decoration: none; }
.sf12-stat__copy strong a:hover { text-decoration: underline; }
.sf12-stat--live .sf12-stat__copy strong { display: flex; align-items: center; gap: 8px; }
.sf12-stat--live::before {
  opacity: 1;
  background: color-mix(in srgb, #22c55e 70%, transparent);
}
.sf12-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 color-mix(in srgb, #22c55e 45%, transparent);
  display: block;
  animation: sf12-pulse 1.8s ease-out infinite;
}
@keyframes sf12-pulse {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, #22c55e 45%, transparent); }
  70% { box-shadow: 0 0 0 8px color-mix(in srgb, #22c55e 0%, transparent); }
  100% { box-shadow: 0 0 0 0 color-mix(in srgb, #22c55e 0%, transparent); }
}
.sf12-stat--live button {
  margin-left: auto;
  height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 32%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
  font-size: 11px;
  font-weight: 780;
  cursor: pointer;
}
.sf12-stat--live button:hover { filter: brightness(1.08); }

.sf12-main {
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}
.sf12-brand {
  min-width: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, var(--color-primary));
  background:
    linear-gradient(155deg, color-mix(in srgb, var(--color-primary) 14%, transparent), transparent 54%),
    linear-gradient(180deg, color-mix(in srgb, var(--color-elevated) 62%, transparent), transparent),
    var(--sf12-card);
  box-shadow: var(--sf12-inset), 0 12px 28px color-mix(in srgb, #000 10%, transparent);
}
.sf12-brand .sf12-trust { margin-top: auto; }
.sf12-brand__eyebrow {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  font-style: normal;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary-ink, var(--color-primary));
}
.sf12-brand__eyebrow::before {
  content: "";
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.sf12-logo { display: inline-flex; align-items: center; text-decoration: none; color: var(--color-text); }
.sf12-logo__img, .sf12-logo img {
  display: block; height: 32px; width: auto; max-width: 168px; object-fit: contain;
}
.sf12-logo--text { gap: 9px; }
.sf12-logo--text span {
  width: 32px; height: 32px; border-radius: 10px;
  display: grid; place-items: center;
  background: linear-gradient(155deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 65%, #111));
  color: #fff; font-weight: 800; font-size: 14px;
  box-shadow: 0 8px 16px color-mix(in srgb, var(--color-primary) 28%, transparent);
}
.sf12-logo--text strong { font-size: 15px; font-weight: 800; letter-spacing: -.02em; }
.sf12-tag, .sf12-legal {
  margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--color-muted); max-width: 38ch;
}
.sf12-legal {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--sf12-line);
  background: color-mix(in srgb, var(--color-surface) 72%, transparent);
}
.sf12-cta { display: flex; flex-wrap: wrap; gap: 7px; }
.sf12-cta a {
  display: inline-flex; align-items: center; gap: 6px;
  height: 28px; padding: 0 10px; border-radius: 9px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 34%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  color: var(--color-primary-ink, var(--color-primary)); font-size: 12px; font-weight: 780; text-decoration: none;
  transition: filter .12s ease, transform .12s ease, background .12s ease;
}
.sf12-cta a:hover { filter: brightness(1.06); transform: translateY(-1px); }
.sf12-cta a.is-ghost {
  background: color-mix(in srgb, var(--color-surface) 55%, transparent);
  color: var(--color-text);
  border-color: var(--color-border);
}
.sf12-cta a.is-ghost:hover {
  border-color: color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  color: var(--color-text);
}
.sf12-soc { display: flex; flex-wrap: wrap; gap: 6px; }
.sf12-soc a {
  min-width: 30px; height: 26px; padding: 0 8px;
  display: grid; place-items: center; border-radius: 8px;
  border: 1px solid var(--sf12-line);
  background: color-mix(in srgb, var(--color-surface) 70%, transparent);
  color: var(--color-muted); font-size: 11px; font-weight: 800; text-decoration: none;
  transition: border-color .12s ease, color .12s ease, transform .12s ease, background .12s ease;
}
.sf12-soc a:hover {
  color: var(--color-text);
  border-color: color-mix(in srgb, var(--color-primary) 40%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
  transform: translateY(-1px);
}
.sf12-soc a.is-instagram { color: #f472b6; }
.sf12-soc a.is-youtube { color: #fb7185; }
.sf12-soc a.is-twitter { color: #7dd3fc; }
.sf12-soc a.is-telegram { color: #38bdf8; }
.sf12-soc a.is-linkedin { color: #60a5fa; }
.sf12-soc a.is-facebook { color: #93c5fd; }
.sf12-trust { display: flex; flex-wrap: wrap; gap: 6px; }
.sf12-trust span {
  display: inline-flex; align-items: center; gap: 5px;
  min-height: 22px; padding: 0 8px; border-radius: 999px;
  border: 1px solid var(--sf12-line);
  background: color-mix(in srgb, var(--color-surface) 65%, transparent);
  color: var(--color-muted); font-size: 11px; font-weight: 750;
}
.sf12-trust .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }

.sf12-tools {
  display: grid;
  grid-template-columns: minmax(200px, .85fr) minmax(0, 1.4fr);
  gap: 8px;
  align-items: stretch;
}
.sf12-search {
  display: flex; align-items: center; gap: 8px;
  min-height: 38px; padding: 4px 6px 4px 10px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--color-border) 72%, var(--color-primary));
  background: var(--sf12-card);
  box-shadow: var(--sf12-inset);
}
.sf12-search__ico { color: var(--color-primary-ink, var(--color-primary)); display: grid; place-items: center; flex: none; }
.sf12-search input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: transparent;
  color: var(--color-text); font-size: 13px; font-weight: 650;
}
.sf12-search input::placeholder { color: var(--color-muted); }
.sf12-search button {
  height: 28px; padding: 0 12px; border-radius: 9px; border: 0; cursor: pointer;
  background: var(--color-primary); color: #fff; font-size: 12px; font-weight: 780;
}
.sf12-search button:hover { background: var(--color-primary-hover); }
.sf12-quick {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  padding: 6px 8px;
  border-radius: 12px;
  border: 1px solid var(--sf12-line);
  background: var(--sf12-card);
  box-shadow: var(--sf12-inset);
}
.sf12-quick a {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 26px; padding: 0 9px; border-radius: 999px;
  border: 1px solid var(--sf12-line);
  background: color-mix(in srgb, var(--color-surface) 60%, transparent);
  color: var(--color-text); font-size: 12px; font-weight: 750; text-decoration: none;
  transition: border-color .12s ease, background .12s ease, color .12s ease, transform .12s ease;
}
.sf12-quick a .yon-ico { color: var(--color-primary-ink, var(--color-primary)); }
.sf12-quick a:hover {
  color: var(--color-primary-ink, var(--color-primary));
  border-color: color-mix(in srgb, var(--color-primary) 34%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
  transform: translateY(-1px);
}

.sf12-hot {
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 72%, var(--color-primary));
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 42%),
    var(--sf12-card);
  box-shadow: var(--sf12-inset);
  overflow: hidden;
}
.sf12-hot__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--sf12-line);
}
.sf12-hot__head em {
  display: block; font-style: normal; font-size: 10.5px; font-weight: 800;
  letter-spacing: .08em; text-transform: uppercase; color: var(--color-primary-ink, var(--color-primary));
}
.sf12-hot__head strong { display: block; margin-top: 1px; font-size: 13px; color: var(--color-text); }
.sf12-hot__head a {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 26px; padding: 0 10px; border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--color-primary) 28%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 12%, transparent);
  color: var(--color-primary-ink, var(--color-primary)); font-size: 12px; font-weight: 780; text-decoration: none;
}
.sf12-hot__head a .yon-ico { transform: rotate(90deg); }
.sf12-hot__head a:hover { filter: brightness(1.08); }
.sf12-hot__list {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.sf12-hot__item {
  display: flex; align-items: flex-start; gap: 10px;
  min-width: 0; padding: 8px 11px 9px;
  border-right: 1px solid var(--sf12-line);
  color: inherit; text-decoration: none;
  transition: background .12s ease;
}
.sf12-hot__item:last-child { border-right: 0; }
.sf12-hot__item:hover { background: color-mix(in srgb, var(--color-primary) 8%, transparent); }
.sf12-hot__item > b {
  width: 22px; height: 22px; border-radius: 8px; flex: none;
  display: grid; place-items: center;
  font-size: 11px; font-weight: 850; color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.sf12-hot__copy { min-width: 0; display: grid; gap: 4px; }
.sf12-hot__copy strong {
  font-size: 12.5px; font-weight: 750; color: var(--color-text); line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.sf12-hot__item:hover .sf12-hot__copy strong { color: var(--color-primary-ink, var(--color-primary)); }
.sf12-hot__copy small {
  display: flex; flex-wrap: wrap; gap: 4px 8px;
  color: var(--color-muted); font-size: 11px; font-weight: 650;
}
.sf12-hot__copy small em {
  font-style: normal; color: var(--color-primary-ink, var(--color-primary)); font-weight: 750;
}

.sf12-stat__ava {
  width: 100%; height: 100%; border-radius: 10px; object-fit: cover; display: block;
}
.sf12-stat--member .sf12-stat__ico { padding: 0; overflow: hidden; }

.sf12-col__list > a {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  flex: 1 1 0;
  min-height: 30px;
  padding: 0 6px;
  color: var(--color-muted);
  font-size: 12.5px;
  font-weight: 650;
  text-decoration: none;
  line-height: 1.25;
  border-radius: 10px;
  transition: color .12s ease, background .12s ease, border-color .12s ease;
}
.sf12-col__list > a::before { display: none !important; content: none !important; }
.sf12-col__list > a > i {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  flex: none;
  display: grid;
  place-items: center;
  font-style: normal;
  background: color-mix(in srgb, var(--sf12-accent) 12%, transparent);
  color: var(--sf12-accent);
  border: 1px solid color-mix(in srgb, var(--sf12-accent) 18%, transparent);
}
.sf12-col__list > a > i .yon-ico { display: block; }
.sf12-col__list > a > span {
  min-width: 0;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sf12-col__list > a:hover {
  color: var(--color-text);
  background: color-mix(in srgb, var(--sf12-accent) 11%, transparent);
}
.sf12-col__list > a:hover > i {
  background: color-mix(in srgb, var(--sf12-accent) 18%, transparent);
  border-color: color-mix(in srgb, var(--sf12-accent) 32%, transparent);
}
.sf12-col__foot {
  margin-top: auto;
  flex: none;
  padding-top: 8px;
  border-top: 1px solid var(--sf12-line);
}
.sf12-col__mail,
.sf12-col__more {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  min-height: 36px;
  padding: 5px 7px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--sf12-accent) 28%, var(--color-border));
  background: color-mix(in srgb, var(--sf12-accent) 10%, transparent);
  color: var(--color-text);
  font-weight: 700;
  text-decoration: none;
  line-height: 1.25;
  transition: border-color .12s ease, background .12s ease;
}
.sf12-col__mail > i,
.sf12-col__more > i {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  flex: none;
  display: grid;
  place-items: center;
  font-style: normal;
  background: color-mix(in srgb, var(--sf12-accent) 16%, transparent);
  color: var(--sf12-accent);
  border: 1px solid color-mix(in srgb, var(--sf12-accent) 24%, transparent);
}
.sf12-col__mail > span,
.sf12-col__more > span {
  display: grid;
  gap: 1px;
  min-width: 0;
  flex: 1;
}
.sf12-col__mail em,
.sf12-col__more em {
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-muted);
}
.sf12-col__mail strong,
.sf12-col__more strong {
  display: block;
  font-size: 12px;
  font-weight: 750;
  color: var(--color-primary-ink, var(--color-primary));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sf12-col__mail:hover,
.sf12-col__more:hover {
  border-color: color-mix(in srgb, var(--sf12-accent) 44%, var(--color-border));
  background: color-mix(in srgb, var(--sf12-accent) 14%, transparent);
}

.sf12-mails {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.sf12-mails a {
  display: flex; align-items: center; gap: 8px; min-width: 0;
  padding: 8px 10px; border-radius: 12px;
  border: 1px solid var(--sf12-line);
  background: var(--sf12-card);
  box-shadow: var(--sf12-inset);
  color: inherit; text-decoration: none;
  transition: border-color .12s ease, transform .12s ease, background .12s ease;
}
.sf12-mails a:hover {
  border-color: color-mix(in srgb, var(--color-primary) 36%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 8%, var(--sf12-card));
  transform: translateY(-1px);
}
.sf12-mails__ico {
  width: 28px; height: 28px; border-radius: 9px; flex: none;
  display: grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 14%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
  border: 1px solid color-mix(in srgb, var(--color-primary) 22%, transparent);
}
.sf12-mails__copy { min-width: 0; display: grid; gap: 2px; }
.sf12-mails__copy em {
  font-style: normal; font-size: 10.5px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase; color: var(--color-muted);
}
.sf12-mails__copy strong {
  font-size: 12.5px; font-weight: 750; color: var(--color-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.sf12-promo {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.sf12-promo__card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 12px;
  border-radius: 14px;
  border: 1px solid var(--sf12-line);
  background: var(--sf12-card);
  box-shadow: var(--sf12-inset);
}
.sf12-promo__card.is-prem {
  border-color: color-mix(in srgb, var(--color-primary) 34%, var(--color-border));
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--color-primary) 16%, transparent), transparent 55%),
    var(--sf12-card);
}
.sf12-promo__card.is-ads {
  border-color: color-mix(in srgb, #38bdf8 34%, var(--color-border));
  background:
    linear-gradient(120deg, color-mix(in srgb, #38bdf8 14%, transparent), transparent 55%),
    var(--sf12-card);
}
.sf12-promo__ico {
  width: 32px; height: 32px; border-radius: 10px; flex: none;
  display: grid; place-items: center;
  background: color-mix(in srgb, var(--color-primary) 16%, var(--color-elevated));
  color: var(--color-primary-ink, var(--color-primary));
  border: 1px solid color-mix(in srgb, var(--color-primary) 24%, transparent);
}
.sf12-promo__card.is-ads .sf12-promo__ico {
  background: color-mix(in srgb, #38bdf8 16%, var(--color-elevated));
  color: #38bdf8;
  border-color: color-mix(in srgb, #38bdf8 28%, transparent);
}
.sf12-promo__card strong { display: block; font-size: 13.5px; color: var(--color-text); }
.sf12-promo__card p { margin: 2px 0 0; font-size: 12px; line-height: 1.35; color: var(--color-muted); }
.sf12-promo__card a {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 28px; padding: 0 12px; border-radius: 9px;
  background: var(--color-primary); color: #fff;
  font-size: 12.5px; font-weight: 780; text-decoration: none; white-space: nowrap;
}
.sf12-promo__card.is-ads a { background: #0369a1; color: #fff; }
.sf12-promo__card a:hover { filter: brightness(1.06); }

.sf12-col {
  --sf12-accent: var(--color-primary);
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  height: 100%;
  min-height: 0;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid var(--sf12-line);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--sf12-accent) 7%, transparent), transparent 56px),
    var(--sf12-card);
  box-shadow: var(--sf12-inset);
  transition: border-color .14s ease;
}
.sf12-col:hover {
  border-color: color-mix(in srgb, var(--sf12-accent) 32%, var(--color-border));
}
.sf12-col:nth-child(2) { --sf12-accent: var(--color-primary); }
.sf12-col:nth-child(3) { --sf12-accent: #38bdf8; }
.sf12-col:nth-child(4) { --sf12-accent: #34d399; }
.sf12-col__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex: none;
  margin: 0 0 6px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--sf12-line);
}
.sf12-col__head h3 {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--color-text);
}
.sf12-col__head h3::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--sf12-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--sf12-accent) 22%, transparent);
}
.sf12-col__head b {
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  color: var(--sf12-accent);
  background: color-mix(in srgb, var(--sf12-accent) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--sf12-accent) 22%, transparent);
}
.sf12-col__list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1 1 auto;
  min-height: 0;
}

.sf12-sponsor {
  display: grid; justify-items: center; gap: 8px;
  padding: 10px 14px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--color-border) 72%, var(--color-primary));
  background:
    radial-gradient(420px 100px at 50% 120%, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 70%),
    var(--sf12-card);
  text-decoration: none;
  box-shadow: var(--sf12-inset);
  transition: border-color .12s ease, filter .12s ease, transform .12s ease;
}
.sf12-sponsor:hover {
  border-color: color-mix(in srgb, var(--color-primary) 44%, var(--color-border));
  filter: brightness(1.04);
  transform: translateY(-1px);
}
.sf12-sponsor__label {
  font-size: 10.5px; font-weight: 800; letter-spacing: .07em;
  text-transform: uppercase; color: var(--color-muted);
}
.sf12-sponsor img {
  display: block; max-height: 36px; max-width: min(420px, 100%); width: auto; object-fit: contain;
}

.sf12-bar {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 12px; border-radius: 14px;
  border: 1px solid var(--sf12-line);
  background: var(--sf12-card);
  box-shadow: var(--sf12-inset);
}
.sf12-bar p { margin: 0; font-size: 12px; font-weight: 650; color: var(--color-muted); }
.sf12-bar nav { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-left: auto; }
.sf12-bar nav a {
  color: var(--color-muted); font-size: 12.5px; font-weight: 700; text-decoration: none;
  transition: color .12s ease;
}
.sf12-bar nav a:hover { color: var(--color-primary-ink, var(--color-primary)); }
.sf12-top {
  width: 30px; height: 30px; border-radius: 9px;
  border: 1px solid var(--sf12-line);
  background: color-mix(in srgb, var(--color-elevated) 70%, var(--color-surface));
  color: var(--color-text);
  cursor: pointer; display: grid; place-items: center;
  transition: border-color .12s ease, color .12s ease, transform .12s ease, background .12s ease;
}
.sf12-top:hover {
  border-color: var(--color-primary);
  color: var(--color-primary-ink, var(--color-primary));
  background: color-mix(in srgb, var(--color-primary) 12%, var(--color-elevated));
  transform: translateY(-1px);
}

@media (max-width: 980px) {
  .sf12-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sf12-stat:nth-child(3) { border-right: 0; }
  .sf12-stat:nth-child(4),
  .sf12-stat:nth-child(5) { border-top: 1px solid var(--sf12-line); }
  .sf12-tools { grid-template-columns: 1fr; }
  .sf12-hot__list { grid-template-columns: 1fr 1fr; }
  .sf12-hot__item:nth-child(2n) { border-right: 0; }
  .sf12-hot__item:nth-child(n+3) { border-top: 1px solid var(--sf12-line); }
  .sf12-mails { grid-template-columns: 1fr 1fr; }
  .sf12-promo { grid-template-columns: 1fr; }
  .sf12-main { grid-template-columns: 1fr 1fr; }
  .sf12-brand { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .app-footer:has(.site-foot--v12) { padding-bottom: 78px; }
}
@media (max-width: 640px) {
  .site-foot--v12 .sf12 { width: calc(100% - 20px); }
  .sf12-stats { grid-template-columns: 1fr 1fr; }
  .sf12-stat { border-right: 1px solid var(--sf12-line); border-top: 1px solid var(--sf12-line); }
  .sf12-stat:nth-child(-n+2) { border-top: 0; }
  .sf12-stat:nth-child(2n) { border-right: 0; }
  .sf12-stat:last-child { grid-column: 1 / -1; border-right: 0; }
  .sf12-hot__list { grid-template-columns: 1fr; }
  .sf12-hot__item { border-right: 0; border-top: 1px solid var(--sf12-line); }
  .sf12-hot__item:first-child { border-top: 0; }
  .sf12-mails { grid-template-columns: 1fr; }
  .sf12-promo__card { grid-template-columns: auto minmax(0, 1fr); }
  .sf12-promo__card a { grid-column: 1 / -1; width: 100%; }
  .sf12-main { grid-template-columns: 1fr; }
  .sf12-bar { flex-wrap: wrap; }
  .sf12-bar nav { margin-left: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .sf12-ribbon { animation: none; }
  .sf12-dot { animation: none; }
  .sf12-ring__val { transition: none; }
}

/* Control panel — Premium Üyelik & Reklam (R10) */
.cp-prem { display: grid; gap: 14px; }
.cp-prem__sec {
  border: 1px solid var(--color-border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--color-elevated) 42%, var(--color-surface));
  overflow: hidden;
}
.cp-prem__sec-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 16px; border-bottom: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-elevated) 55%, transparent);
}
.cp-prem__sec-head h2 { margin: 0; font-size: 14px; font-weight: 800; color: var(--color-text); }
.cp-prem__sec-head a { font-size: 12px; font-weight: 750; color: var(--color-primary-ink, var(--color-primary)); text-decoration: none; }
.cp-prem__sec-head a:hover { text-decoration: underline; }
.cp-prem__card {
  display: grid; grid-template-columns: minmax(0, 1.15fr) auto; gap: 16px 20px;
  align-items: center; padding: 16px 18px;
}
.cp-prem__who { display: flex; align-items: center; gap: 14px; min-width: 0; }
.cp-prem__badge {
  width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; flex: none; color: #fff;
  background:
    radial-gradient(circle at 30% 28%, color-mix(in srgb, #fff 28%, transparent), transparent 46%),
    linear-gradient(155deg, var(--prem, #EAB308), color-mix(in srgb, var(--prem, #EAB308) 55%, #111));
  box-shadow: 0 10px 22px color-mix(in srgb, var(--prem, #EAB308) 28%, transparent);
  border: 2px solid color-mix(in srgb, #fff 18%, transparent);
}
.cp-prem__meta { min-width: 0; display: grid; gap: 6px; }
.cp-prem__name { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 800; }
.cp-prem__name em {
  font-style: normal; font-size: 10px; font-weight: 850; letter-spacing: .06em;
  padding: 3px 7px; border-radius: 6px;
  background: color-mix(in srgb, currentColor 16%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 28%, transparent);
}
.cp-prem__meta dl { margin: 0; display: grid; gap: 2px; }
.cp-prem__meta dl > div { display: flex; flex-wrap: wrap; gap: 6px 10px; font-size: 12.5px; }
.cp-prem__meta dt { margin: 0; color: var(--color-muted); font-weight: 700; }
.cp-prem__meta dd { margin: 0; color: var(--color-text); font-weight: 700; font-variant-numeric: tabular-nums; }
.cp-prem__rings { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px 14px; padding-right: 4px; }
.cp-prem__ring { width: 72px; display: grid; justify-items: center; gap: 2px; position: relative; }
.cp-prem__ring svg { width: 56px; height: 56px; transform: rotate(-90deg); }
.cp-prem__ring-track { fill: none; stroke: color-mix(in srgb, var(--color-border) 80%, transparent); stroke-width: 3.5; }
.cp-prem__ring-val { fill: none; stroke-width: 3.5; stroke-linecap: round; transition: stroke-dashoffset .4s ease; }
.cp-prem__ring--day .cp-prem__ring-val { stroke: #34d399; }
.cp-prem__ring--hour .cp-prem__ring-val { stroke: #38bdf8; }
.cp-prem__ring--min .cp-prem__ring-val { stroke: #60a5fa; }
.cp-prem__ring--sec .cp-prem__ring-val { stroke: #fbbf24; }
.cp-prem__ring strong {
  position: absolute; top: 18px; font-size: 15px; font-weight: 850;
  color: var(--color-text); font-variant-numeric: tabular-nums; line-height: 1;
}
.cp-prem__ring span { font-size: 10.5px; font-weight: 750; color: var(--color-muted); }
.cp-prem__empty { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 18px; }
.cp-prem__empty strong { display: block; color: var(--color-text); font-size: 14px; font-weight: 800; margin-bottom: 3px; }
.cp-prem__empty p { margin: 0; font-size: 13px; line-height: 1.45; color: var(--color-muted); }
.cp-prem__cta {
  flex: none; display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 999px;
  border: 1px solid color-mix(in srgb, #EAB308 50%, var(--color-border));
  background: color-mix(in srgb, #EAB308 12%, transparent); color: #EAB308;
  font-size: 12.5px; font-weight: 800; text-decoration: none;
}
.cp-prem__cta:hover { filter: brightness(1.08); }
.cp-prem__rows { list-style: none; margin: 0; padding: 0; display: grid; }
.cp-prem__rows li {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px 14px;
  align-items: center; padding: 12px 16px; border-top: 1px solid var(--color-border);
}
.cp-prem__rows li:first-child { border-top: 0; }
.cp-prem__rows-copy { min-width: 0; display: grid; gap: 2px; }
.cp-prem__rows-copy strong {
  color: var(--color-text); font-size: 13.5px; font-weight: 750;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cp-prem__rows-copy small { color: var(--color-muted); font-size: 12px; font-weight: 650; }
.cp-prem__rows em { font-style: normal; font-size: 12.5px; font-weight: 800; text-align: center; min-width: 7rem; }
.cp-prem__rows em.is-done { color: #f87171; }
.cp-prem__rows em.is-on { color: #34d399; }
.cp-prem__rows b { font-size: 14px; font-weight: 850; color: var(--color-text); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cp-prem__btn {
  display: inline-flex; align-items: center; justify-content: center; height: 30px; padding: 0 12px;
  border-radius: 999px; border: 1px solid color-mix(in srgb, #EAB308 45%, var(--color-border));
  background: color-mix(in srgb, var(--color-elevated) 70%, transparent); color: #EAB308;
  font-size: 11px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; flex: none;
}
.cp-prem__btn:hover { filter: brightness(1.08); }
.cp-nav__group[data-acc="uyelik"] .cp-nav__link.is-on { color: #EAB308; }
.cp-nav__group[data-acc="uyelik"] .cp-nav__link.is-on .yon-ico { color: #EAB308; }
#premium-uyelikler, #cp-prem-uyelik, #cp-reklamlar, #cp-faturalar { scroll-margin-top: 24px; }
.acct__list a[href*="bolum=premium"] .yon-ico { color: color-mix(in srgb, var(--color-text) 55%, transparent); }
@media (max-width: 900px) {
  .cp-prem__card { grid-template-columns: 1fr; }
  .cp-prem__rings { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .cp-prem__rows li {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "copy copy" "status action";
  }
  .cp-prem__rows-copy { grid-area: copy; }
  .cp-prem__rows em, .cp-prem__rows b { grid-area: status; justify-self: start; text-align: left; min-width: 0; }
  .cp-prem__btn { grid-area: action; justify-self: end; }
  .cp-prem__empty { flex-direction: column; align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .cp-prem__ring-val { transition: none; }
}

.cp-prem__unlimited {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 4px;
  min-width: 140px;
  padding: 10px 16px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, #EAB308 35%, var(--color-border));
  background: color-mix(in srgb, #EAB308 10%, transparent);
  text-align: center;
}
.cp-prem__unlimited strong {
  font-size: 28px;
  line-height: 1;
  color: #EAB308;
  font-weight: 850;
}
.cp-prem__unlimited span {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #EAB308;
}
.cp-prem__unlimited small {
  font-size: 11px;
  color: var(--color-muted);
  line-height: 1.35;
  max-width: 18ch;
}

/* —— Wallet v11 (/cuzdan) —— */
.wal11 { display: grid; gap: 18px; margin: 0 auto 40px; max-width: min(1100px, calc(100% - 28px)); }
.wal11-kicker {
  margin: 0;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-primary, #29c4f0);
}
.wal11-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(220px, .7fr);
  gap: 18px;
  align-items: stretch;
  padding: 22px 24px;
  border-radius: 18px;
  border: 1px solid color-mix(in srgb, var(--color-primary, #29c4f0) 22%, var(--color-border));
  background:
    radial-gradient(900px 240px at 12% -20%, color-mix(in srgb, var(--color-primary) 18%, transparent), transparent 60%),
    color-mix(in srgb, var(--color-surface, #121826) 92%, #000);
}
.wal11-hero--compact { grid-template-columns: 1fr; }
.wal11-hero__copy { display: grid; gap: 10px; align-content: start; }
.wal11-hero h1 {
  margin: 0;
  font-size: clamp(2rem, 4vw, 2.75rem);
  line-height: 1.05;
  letter-spacing: -.03em;
  font-weight: 850;
}
.wal11-hero h1 small { font-size: .45em; font-weight: 700; opacity: .7; margin-left: 4px; }
.wal11-lead { margin: 0; color: var(--color-muted); max-width: 52ch; line-height: 1.55; }
.wal11-hero__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.wal11-hero__stats {
  display: grid;
  gap: 10px;
  align-content: center;
}
.wal11-hero__stats > div {
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-bg, #0b1220) 70%, transparent);
}
.wal11-hero__stats em {
  display: block;
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-muted);
  margin-bottom: 4px;
}
.wal11-hero__stats strong { font-size: 1.15rem; font-weight: 800; }
.wal11-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.wal11-card {
  padding: 18px 18px 16px;
  border-radius: 16px;
  border: 1px solid var(--color-border);
  background: var(--color-surface, #121826);
}
.wal11-card--wide { grid-column: 1 / -1; }
.wal11-card__head { margin-bottom: 14px; }
.wal11-card__head h2 { margin: 0 0 4px; font-size: 1.15rem; font-weight: 800; }
.wal11-card__head p { margin: 0; color: var(--color-muted); font-size: 13px; }
.wal11-form { display: grid; gap: 12px; }
.wal11-form label { display: grid; gap: 6px; }
.wal11-form label > span { font-size: 12px; font-weight: 700; color: var(--color-muted); }
.wal11-form input {
  width: 100%;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-bg) 80%, transparent);
  color: inherit;
  padding: 11px 12px;
  font: inherit;
}
.wal11-providers {
  margin: 0;
  padding: 0;
  border: 0;
  display: grid;
  gap: 8px;
}
.wal11-providers legend {
  font-size: 12px;
  font-weight: 700;
  color: var(--color-muted);
  margin-bottom: 4px;
}
.wal11-provider {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 10px;
  align-items: start;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.wal11-provider.is-on,
.wal11-provider:has(input:checked) {
  border-color: color-mix(in srgb, var(--color-primary) 55%, var(--color-border));
  background: color-mix(in srgb, var(--color-primary) 10%, transparent);
}
.wal11-provider input { margin-top: 3px; }
.wal11-provider strong { display: block; font-size: 14px; }
.wal11-provider em { display: block; font-style: normal; font-size: 12px; color: var(--color-muted); margin-top: 2px; }
.wal11-quick { display: flex; flex-wrap: wrap; gap: 6px; }
.wal11-quick button {
  border-radius: 999px;
  border: 1px solid var(--color-border);
  background: transparent;
  color: inherit;
  padding: 6px 12px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.wal11-quick button:hover {
  border-color: var(--color-primary);
  color: var(--color-primary-ink, var(--color-primary));
}
.wal11-note { margin: 0; font-size: 12px; }
.wal11-list { display: grid; gap: 0; }
.wal11-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 12px 2px;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
}
.wal11-row:last-child { border-bottom: 0; }
.wal11-row strong { display: block; font-size: 14px; }
.wal11-row small { color: var(--color-muted); font-size: 12px; }
.wal11-row b { font-variant-numeric: tabular-nums; white-space: nowrap; }
.wal11-row b.is-plus { color: #22c55e; }
.wal11-row b.is-minus { color: #f87171; }
.wal11-row__end { display: flex; align-items: center; gap: 10px; }
.wal11-badge {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--color-border));
  color: #f59e0b;
}
.wal11-empty { padding: 18px 4px; color: var(--color-muted); }
.wal11-iframe {
  width: 100%;
  min-height: 640px;
  border: 0;
  border-radius: 14px;
  background: #0b1220;
}
.wal11-payframe { padding: 12px; }
@media (max-width: 860px) {
  .wal11-hero, .wal11-grid { grid-template-columns: 1fr; }
}

/* —— App / Touch header v10 —— */
.touch-header__chips { display: none; }
.app-header.touch-header {
  --touch-bar-h: 56px;
  --touch-chip-h: 38px;
}
.app-header.touch-header .touch-header__accent {
  height: 2px;
  opacity: .9;
  background: linear-gradient(90deg, var(--color-primary), color-mix(in srgb, var(--color-primary) 18%, transparent) 58%, transparent);
  transform-origin: left center;
  transition: opacity .2s ease, transform .2s ease;
}
.app-header.touch-header.is-scrolled .touch-header__accent {
  opacity: 1;
  transform: scaleX(1);
}

@media (max-width: 980px) {
  .app-header.touch-header {
    position: sticky;
    top: 0;
    z-index: 90;
    padding-top: env(safe-area-inset-top);
    background:
      linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 70%),
      color-mix(in srgb, var(--mast-bg) 88%, transparent);
    backdrop-filter: blur(16px) saturate(1.25);
    -webkit-backdrop-filter: blur(16px) saturate(1.25);
    border-bottom: 1px solid color-mix(in srgb, var(--header-line) 80%, transparent);
    transition: transform .28s cubic-bezier(.22, 1, .36, 1), box-shadow .2s ease, background .2s ease;
    will-change: transform;
  }
  .app-header.touch-header.is-solid,
  .app-header.touch-header.is-scrolled {
    box-shadow:
      0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset,
      0 10px 28px color-mix(in srgb, #000 22%, transparent);
    background:
      linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 62%),
      color-mix(in srgb, var(--mast-bg) 94%, transparent);
  }
  .app-header.touch-header.is-hide-touch {
    transform: translateY(calc(-100% + env(safe-area-inset-top)));
  }
  .app-header.touch-header.is-compact .touch-header__chips {
    max-height: 0;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-bottom-width: 0;
    pointer-events: none;
  }
  .app-header.touch-header .mast__top--v10 {
    background: transparent;
  }
  .app-header.touch-header .touch-header__inner {
    min-height: var(--touch-bar-h);
    width: min(100% - 16px, 1560px);
    gap: 6px;
    padding: 8px 0;
  }
  .app-header.touch-header .touch-header__menu,
  .app-header.touch-header .touch-header__search,
  .app-header.touch-header .mast-tools--v10 .mast-ico,
  .app-header.touch-header .mast-tools--v10 .icon-btn.mast-ico,
  .app-header.touch-header .mast-cta--mob {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    border-radius: 13px !important;
  }
  .app-header.touch-header .touch-header__menu,
  .app-header.touch-header .touch-header__search {
    background: color-mix(in srgb, var(--mast-link-bg) 80%, transparent);
    border: 1px solid color-mix(in srgb, var(--header-line) 70%, transparent);
  }
  .app-header.touch-header .touch-header__search:active,
  .app-header.touch-header .touch-header__menu:active,
  .app-header.touch-header .mast-tools--v10 .mast-ico:active {
    transform: scale(.96);
    background: color-mix(in srgb, var(--color-primary) 16%, var(--mast-link-bg));
  }
  .app-header.touch-header .mast-brand__mark,
  .app-header.touch-header .topbar__mark {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    font-size: 16px;
  }
  .app-header.touch-header .mast-cta--mob .mast-cta__ico {
    width: 42px !important;
    height: 42px !important;
    border-radius: 13px !important;
    background: color-mix(in srgb, var(--color-primary) 88%, #000);
    color: #fff;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--color-primary) 38%, transparent);
  }
  .app-header.touch-header .mast-tools--v10 {
    gap: 2px;
    padding: 3px;
    border-radius: 14px;
    border-color: color-mix(in srgb, var(--header-line) 75%, transparent);
    background: color-mix(in srgb, var(--mast-link-bg) 70%, transparent);
  }
  .app-header.touch-header .mast-auth--v10 {
    gap: 6px;
  }
  .app-header.touch-header .mast-auth--v10 .mast-cta {
    min-height: 40px;
    padding: 0 12px;
    border-radius: 12px;
    font-size: 13px;
  }
  .app-header.touch-header .mast-auth--v10 .mast-auth__login {
    display: inline-flex !important;
    min-height: 40px;
    padding: 0 12px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 700;
  }

  .touch-header__chips {
    display: flex;
    align-items: center;
    gap: 7px;
    width: min(100% - 16px, 1560px);
    margin: 0 auto;
    padding: 0 0 10px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    max-height: 56px;
    opacity: 1;
    border-bottom: 1px solid transparent;
    transition: max-height .28s ease, opacity .22s ease, padding .22s ease;
  }
  .touch-header__chips::-webkit-scrollbar { display: none; }
  .touch-chip {
    position: relative;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: var(--touch-chip-h);
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--header-line) 78%, transparent);
    background: color-mix(in srgb, var(--mast-link-bg) 72%, transparent);
    color: var(--mast-link-hover);
    text-decoration: none;
    font-size: 12.5px;
    font-weight: 750;
    letter-spacing: -.01em;
    white-space: nowrap;
    transition: background .14s ease, border-color .14s ease, color .14s ease, transform .12s ease;
  }
  .touch-chip .yon-ico {
    opacity: .88;
    color: var(--color-primary-ink, var(--color-primary));
  }
  .touch-chip:active { transform: scale(.97); }
  .touch-chip.is-active,
  .touch-chip:hover {
    border-color: color-mix(in srgb, var(--color-primary) 40%, var(--header-line));
    background: color-mix(in srgb, var(--color-primary) 14%, var(--mast-link-bg));
    color: var(--color-text);
  }
  .touch-chip--cta {
    border-color: color-mix(in srgb, var(--color-primary) 45%, transparent);
    background: color-mix(in srgb, var(--color-primary) 88%, #000);
    color: #fff;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--color-primary) 32%, transparent);
  }
  .touch-chip--cta .yon-ico { color: #fff; opacity: 1; }
  .touch-chip .nav-badge {
    position: static;
    margin-left: 2px;
    min-width: 16px;
    height: 16px;
    line-height: 16px;
    padding: 0 5px;
    font-size: 10px;
  }

  /* Dropdown panels clear sticky header + chips */
  .app-header.touch-header .mast-drop__panel {
    top: calc(var(--touch-bar-h) + env(safe-area-inset-top) + 8px) !important;
  }
  .app-header.touch-header:not(.is-compact) .mast-drop__panel {
    top: calc(var(--touch-bar-h) + var(--touch-chip-h) + env(safe-area-inset-top) + 18px) !important;
  }

  .dock.dock--v10 {
    gap: 2px;
    background: color-mix(in srgb, var(--color-surface) 92%, transparent);
    backdrop-filter: blur(16px) saturate(1.2);
    -webkit-backdrop-filter: blur(16px) saturate(1.2);
    border-top: 1px solid color-mix(in srgb, var(--color-border) 80%, var(--color-primary));
    box-shadow: 0 -8px 28px color-mix(in srgb, #000 18%, transparent);
    min-height: 62px;
    padding: 8px 6px calc(8px + env(safe-area-inset-bottom));
  }
  .dock.dock--v10 .dock__item {
    min-width: 58px;
    min-height: 44px;
    border-radius: 12px;
    font-size: 10.5px;
  }
  .dock.dock--v10 .dock__compose {
    width: 52px;
    height: 52px;
    margin-top: -20px;
    border-radius: 18px;
    box-shadow:
      0 0 0 4px color-mix(in srgb, var(--color-surface) 90%, transparent),
      0 10px 24px color-mix(in srgb, var(--color-primary) 42%, transparent);
  }
}

/* Telefon / tablet phone-nav: aynı touch header */
html.is-phone-nav .app-header.touch-header {
  position: sticky;
  top: 0;
  z-index: 90;
  padding-top: env(safe-area-inset-top);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 10%, transparent), transparent 70%),
    color-mix(in srgb, var(--mast-bg) 88%, transparent);
  backdrop-filter: blur(16px) saturate(1.25);
  -webkit-backdrop-filter: blur(16px) saturate(1.25);
}
html.is-phone-nav .touch-header__chips { display: flex; }
html.is-phone-nav .app-header.touch-header.is-hide-touch {
  transform: translateY(calc(-100% + env(safe-area-inset-top)));
}

@media (min-width: 981px) {
  .touch-header__chips { display: none !important; }
  html.is-phone-nav .touch-header__chips { display: flex !important; }
}

@media (max-width: 400px) {
  .touch-chip span { font-size: 12px; }
  .app-header.touch-header .mast-brand__text { display: none; }
}
