*, *::before, *::after { box-sizing: border-box; }
	html, body { height: 100%; }
	body {
	  margin: 0;
	  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
	  background: var(--bg);
	  color: var(--text);
	  -webkit-font-smoothing: antialiased;
	  text-rendering: optimizeLegibility;
	  overflow-x: hidden;
	}
	img, svg { display: block; max-width: 100%; }
	a { color: inherit; text-decoration: none; }
	button, input, select, textarea { font: inherit; color: inherit; }
	button { cursor: pointer; }
	:focus-visible { outline: 3px solid color-mix(in oklab, var(--accent-a), white 10%); outline-offset: 2px; border-radius: 12px; }

	/* ---------- Theme tokens ---------- */
	:root {
	  --container: 1120px;
	  --header-container: 1370px; /* header wider than content */
	  --bg: #05060a;
	  --bg-2: #070a10;
	  --bg-elev: rgba(255,255,255,0.04);
	  --card: rgba(255,255,255,0.06);
	  --card-2: rgba(255,255,255,0.045);
	  --text: rgba(255,255,255,0.92);
	  --muted: rgba(255,255,255,0.68);
	  --faint: rgba(255,255,255,0.50);
	  --border: rgba(255,255,255,0.11);
	  --border-2: rgba(255,255,255,0.18);
		
	  --surface: rgba(255,255,255,0.06);
	  --surface-2: rgba(255,255,255,0.04);

	  --accent-a: #6EE7FF;
	  --accent-b: #A78BFA;
	  --accent: #008099;
	  --accent-2: #a78bfa;
	  --accent-3: #22c55e;

	  --ok: #22c55e;
	  --warn: #f59e0b;
	  --bad: #ef4444;

	  --shadow: 0 10px 30px rgba(0,0,0,0.35);
	  --shadow-soft: 0 10px 22px rgba(0,0,0,0.22);
	  --focus: rgba(110, 231, 255, 0.85);

	  --r-md: 14px;
	  --r-lg: 18px;
	  --r-xl: 22px;
	  --r-2xl: 28px;

	  --ease-out: cubic-bezier(.22,.8,.2,1);
	  --ease-in: cubic-bezier(.2,.2,.2,1);
	  --dur-1: 160ms;
	  --dur-2: 240ms;
	  --dur-3: 320ms;
	  
	  --radius-xl: 18px;
	  --radius-2xl: 26px;
	  
	  --ease: cubic-bezier(.2,.8,.2,1);
 	  --ease-out: cubic-bezier(.2,1,.2,1);
	  
	  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	  color-scheme: dark;
	}
	
	
	
	:root[data-theme="light"] {
	  --bg: #f7f9ff;
	  --bg-2: #ffffff;
	  --bg-elev: rgba(10,20,40,0.04);
	
	  --text: rgba(9,18,35,0.92);
		--muted: rgba(9,18,35,0.72);
		--faint: rgba(9,18,35,0.52);
	  
	  --card: rgba(10,20,40,0.05);
	  --card-2: rgba(10,20,40,0.035);
	
	  --surface: rgba(11,14,20,0.05);
	  --surface-2: rgba(11,14,20,0.035);
	
	  --border: rgba(9,18,35,0.12);
		--border-2: rgba(9,18,35,0.10);
	
	  --shadow: 0 28px 70px rgba(10,20,40,0.16);
		--shadow-soft: 0 14px 30px rgba(10,20,40,0.12);
	
	  --focus: rgba(99, 102, 241, 0.70);
	
	  color-scheme: light;
	}


	/* ---------- Background visual (subtle grid + glows) ---------- */
	.bg {
	  position: fixed;
	  inset: 0;
	  pointer-events: none;
	  z-index: -1;
	  background:
		radial-gradient(1200px 700px at 18% -10%, color-mix(in oklab, var(--accent-a), transparent 70%) 0%, transparent 60%),
		radial-gradient(1100px 700px at 88% 0%, color-mix(in oklab, var(--accent-b), transparent 72%) 0%, transparent 60%),
		radial-gradient(900px 600px at 50% 120%, color-mix(in oklab, var(--accent-a), transparent 84%) 0%, transparent 55%);
	  opacity: 0.95;
	  filter: saturate(1.06);
	}
	.bg::after{
	  content:"";
	  position:absolute; inset:0;
	  background-image:
		linear-gradient(to right, rgba(255,255,255,0.055) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(255,255,255,0.055) 1px, transparent 1px);
	  background-size: 56px 56px;
	  opacity: 0.08;
	  mask-image: radial-gradient(60% 45% at 50% 10%, black 0%, transparent 72%);
	}
	html[data-theme="light"] .bg::after{ opacity: 0.11; }
	
	/* ---- Layout helpers ---- */
	.container {
	  max-width: var(--container);
	  margin: 0 auto;
	  padding: 0 24px;
	}
	
	/* header container wider than content */
	header.site-header .container { max-width: var(--header-container); }

	@media (max-width: 520px){
	  .container{ width: min(1120px, calc(100% - 32px)); }
	}

	.small{ font-size: 13px; line-height: 1.45; color: var(--faint); }
	.muted{ color: var(--muted); }
	.mono{ font-family: var(--mono); }

	.divider{
	  height:1px; background: var(--border-2);
	  margin: 14px 0;
	}

	/* ---------- Buttons ---------- */
	.btn{
	  display:inline-flex;
	  align-items:center;
	  justify-content:center;
	  gap: 10px;
	  height: 44px;
	  padding: 0 16px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 18%);
	  box-shadow: 0 0 0 rgba(0,0,0,0);
	  transition: transform var(--dur-1) var(--ease-out), background var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), box-shadow var(--dur-2) var(--ease-out);
	  user-select: none;
	  -webkit-tap-highlight-color: transparent;
	}
	.btn:hover{ transform: translateY(-1px); border-color: color-mix(in oklab, var(--border), white 12%); box-shadow: var(--shadow-soft); }
	.btn:active{ transform: translateY(0px) scale(0.99); }

	.btn-primary{
	  border: 0;
	  background: linear-gradient(135deg,
		color-mix(in oklab, var(--accent-a), transparent 18%),
		color-mix(in oklab, var(--accent-b), transparent 20%));
	  color: rgba(10,14,22,0.92);
	  font-weight: 700;
	  box-shadow: 0 18px 42px rgba(110,231,255,0.18);
	}
	html[data-theme="light"] .btn-primary{ color: rgba(10,14,22,0.92); }

	.btn-secondary{
	  background: transparent;
	  border: 1px solid color-mix(in oklab, var(--border), transparent 0%);
	}

	.btn-ghost{
	  background: transparent;
	  border: 1px solid transparent;
	}
	.btn-ghost:hover{
	  background: color-mix(in oklab, var(--card), transparent 10%);
	  border-color: var(--border-2);
	  box-shadow: none;
	}

	.icon-btn {
	  width: 42px;
	  height: 42px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: var(--surface-2);
	  cursor: pointer;
	  display: inline-grid;
	  place-items: center;
	  transition: transform 180ms var(--ease), background 180ms var(--ease), border-color 180ms var(--ease);
	}
	.icon-btn:hover { transform: translateY(-1px); border-color: var(--border-2); }
	
	
	.theme-ico[hidden] { display: none !important; }
	
	.icon-btn { position: relative; }
	.theme-ico {
	  position: absolute;
	  inset: 0;
	  margin: auto;
	  width: 18px;
	  height: 18px;
	  display: block;
	}

	
	/* =========================================================
	   HEADER / NAV — PILL CAPSULE (как фото 2)
	   ========================================================= */
	.skip-link {
	  position: absolute;
	  left: 12px;
	  top: 12px;
	  padding: 10px 12px;
	  border-radius: 12px;
	  background: var(--bg-2);
	  border: 1px solid var(--border);
	  color: var(--text);
	  transform: translateY(-140%);
	  transition: transform 180ms var(--ease);
	  z-index: 2000;
	}
	.skip-link:focus-visible { transform: translateY(0); }
	
	header.site-header {
	  position: fixed;
	  top: 0;
	  left: 0;
	  right: 0;
	  z-index: 1200;
	  transition: background 220ms var(--ease), border-color 220ms var(--ease), box-shadow 220ms var(--ease);
	  background: transparent;
	  border-bottom: 1px solid transparent;
	  backdrop-filter: blur(0px);
	}
	header.site-header.scrolled {
	  background: color-mix(in oklab, var(--bg), transparent 18%);
	  border-bottom-color: color-mix(in oklab, var(--border), transparent 0%);
	  backdrop-filter: blur(14px);
	  box-shadow: 0 10px 30px rgba(0,0,0,0.16);
	}
	
	header.site-header { font-size: 14px; }
	
	header.site-header .header-actions a.btn,
	header.site-header .header-actions button.btn {
	  display: inline-flex;
	  align-items: center;
	  justify-content: center;
	  height: 42px;
	  padding: 0 16px;
	  line-height: 1;
	  font-size: 14px;
	  white-space: nowrap;
	  flex: 0 0 auto;
	}
	
	header.site-header .header-actions a.btn span,
	header.site-header .header-actions button.btn span {
	  font-size: inherit;
	  line-height: 1;
	}
	
	.header-inner {
	  height: 72px;
	  display: grid;
	  grid-template-columns: auto minmax(0, 1fr) auto;
	  align-items: center;
	  gap: 18px;
	}
	
	.brand {
	  display: inline-flex;
	  align-items: center;
	  gap: 10px;
	  min-width: 140px;
	}
	/* App-icon style badge */
	.brand-mark{
	  width: 42px;
	  height: 42px;
	  border-radius: 14px;
	  padding: 5px;                 /* мозг меньше внутри */
	  display: grid;
	  place-items: center;
	  overflow: hidden;
	  position: relative;
	  isolation: isolate;
	
	  border: 1px solid color-mix(in oklab, var(--border-2), transparent 10%);
	  
	
	  box-shadow:
		0 12px 28px rgba(0,0,0,0.18),
		inset 0 1px 0 rgba(255,255,255,0.10);
	}
	
	/* Glow border (как у iOS/visionOS иконок) */
	.brand-mark::before{
	  content:"";
	  position:absolute;
	  inset:-1px;
	  border-radius: 15px;
	  padding: 1px;
	  background: linear-gradient(135deg,
		rgba(110,231,255,0.55),
		rgba(167,139,250,0.38),
		rgba(34,197,94,0.22)
	  );
	  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	  -webkit-mask-composite: xor;
			  mask-composite: exclude;
	  opacity: 0.55;
	  pointer-events:none;
	  z-index: 0;
	}
	
	/* Gloss overlay */
	.brand-mark::after{
	  content:"";
	  position:absolute;
	  inset:0;
	  border-radius: 14px;
	  background:
		/* верхняя “линза” */
		linear-gradient(180deg,
		  rgba(255,255,255,0.26),
		  rgba(255,255,255,0.10) 22%,
		  rgba(255,255,255,0.00) 55%
		);
	  mix-blend-mode: screen;
	  opacity: 0.55;
	  pointer-events:none;
	  z-index: 1;
	}
	
	/* Logo image */
	.brand-logo{
	  width: 100%;
	  height: 100%;
	  object-fit: contain;
	  display: block;
	  z-index: 2;
	
	  /* “вытащить” мозг на передний план */
	  filter:
		drop-shadow(0 7px 12px rgba(0,0,0,0.40))
		saturate(1.12)
		contrast(1.08);
	}
	
	/* Light theme variant — чище и чуть светлее */
	:root[data-theme="light"] .brand-mark{
	  border: 1px solid rgba(11,14,20,0.14);
	  background:
		radial-gradient(18px 12px at 28% 22%, rgba(255,255,255,0.55), transparent 70%),
		radial-gradient(26px 20px at 70% 30%, rgba(110,231,255,0.22), transparent 72%),
		radial-gradient(28px 22px at 65% 78%, rgba(167,139,250,0.20), transparent 74%),
		linear-gradient(180deg, rgba(11,14,20,0.04), rgba(11,14,20,0.015));
	  box-shadow:
		0 12px 24px rgba(10,18,40,0.10),
		inset 0 1px 0 rgba(255,255,255,0.45);
	}
	
	:root[data-theme="light"] .brand-logo{
	  filter:
		drop-shadow(0 8px 14px rgba(10,18,40,0.16))
		saturate(1.06)
		contrast(1.05);
	}
	.brand-name { font-weight: 650; letter-spacing: -0.02em; }
	
	/* Capsule nav */
	nav.primary-nav {
	  justify-self: center;
	  min-width: 0;
	  display: inline-flex;
	  align-items: center;
	  gap: 6px;
	  height: 42px;
	
	  padding: 8px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--surface), transparent 0%);
	  box-shadow: var(--shadow-soft);
	  backdrop-filter: blur(14px);
	}
	
	:root[data-theme="light"] nav.primary-nav {
	  background: var(--surface-2);
	  border-color: rgba(11,14,20,0.10);
	  box-shadow: 0 10px 22px rgba(10,18,40,0.08);
	}
	
	.nav-link, .nav-btn {
	  appearance: none;
	  border: 0;
	  background: transparent;
	  cursor: pointer;
	
	  display: inline-flex;
	  align-items: center;
	  gap: 8px;
	  
	  height: 38px;
	  padding: 0 14px;
	  border-radius: 999px;
	
	  font-size: 14px;
	  letter-spacing: -0.01em;
	  color: var(--muted);
	  white-space: nowrap;
	
	  transition: background 160ms var(--ease), color 160ms var(--ease), transform 160ms var(--ease), box-shadow 160ms var(--ease);
	}
	
	.nav-link:hover, .nav-btn:hover {
	  background: color-mix(in oklab, var(--surface-2), transparent 0%);
	  color: var(--text);
	  transform: translateY(-0.5px);
	}
	
	/* Active look (если потом будешь ставить aria-current или класс) */
	.nav-link[aria-current="page"],
	.nav-link.is-active,
	.nav-btn.is-active,
	.nav-link.nav-verify {
	  background: color-mix(in oklab, var(--surface), transparent 0%);
	  color: var(--text);
	  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--border-2), transparent 0%);
	}
	
	/* Dropdown inside capsule */
	.dropdown { position: relative; display: inline-flex; align-items: center; }
	.chev { opacity: 0.7; transition: transform 160ms var(--ease); }
	.dropdown.open .chev { transform: rotate(180deg); }
	
	.dropdown-menu {
	  position: absolute;
	  top: calc(100% + 10px);
	  left: 50%;
	  transform: translateX(-50%);
	  min-width: 200px;
	  border-radius: 18px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--bg-2), transparent 10%);
	  backdrop-filter: blur(16px);
	  box-shadow: var(--shadow);
	  padding: 8px;
	  display: none;
	  z-index: 1600;
	}
	.dropdown.open .dropdown-menu { display: block; }
	
	.dropdown-menu a {
	  display: block;
	  padding: 10px 10px;
	  border-radius: 12px;
	  color: var(--muted);
	  font-size: 14px;
	  transition: background 160ms var(--ease), color 160ms var(--ease);
	}
	.dropdown-menu a:hover { background: var(--surface-2); color: var(--text); }
	
	/* Header actions (right) */
	.header-actions {
	  display: inline-flex;
	  align-items: center;
	  gap: 10px;
	  flex-wrap: nowrap;
	  justify-self: end;
	}
	.header-actions > * { flex: 0 0 auto; }
	
	.header-actions .btn { padding: 0 16px; }
	
	
	/* Language switch */
	.lang {
	  display: inline-flex;
	  border: 1px solid var(--border);
	  border-radius: 999px;
	  overflow: hidden;
	  background: var(--surface-2);
	  height: 42px;
	}
	.lang button {
	  border: 0;
	  background: transparent;
	  cursor: pointer;
	  padding: 0 12px;
	  font-size: 13px;
	  color: var(--muted);
	  transition: background 160ms var(--ease), color 160ms var(--ease);
	}
	.lang button[aria-checked="true"] {
	  background: linear-gradient(135deg, rgba(110,231,255,0.18), rgba(167,139,250,0.14));
	  color: var(--text);
	}
	
	/* ===== Language dropdown (replaces .lang pill) ===== */
	.lang-dd { position: relative; }
	
	.lang-dd-btn {
	  height: 42px;
	  padding: 0 12px 0 14px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: var(--surface-2);
	  color: var(--muted);
	  gap: 10px;
	}
	
	.lang-dd-btn:hover {
	  background: color-mix(in oklab, var(--surface-2), transparent 0%);
	  color: var(--text);
	}
	
	.lang-dd-current{
	  font-size: 13px;
	  letter-spacing: 0.02em;
	  color: inherit;
	}
	
	.lang-dd-menu{
	  min-width: 140px;
	  padding: 8px;
	}
	
	/* items inside language menu */
	.lang-dd-item{
	  width: 100%;
	  text-align: left;
	  border: 0;
	  background: transparent;
	  cursor: pointer;
	
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	
	  padding: 10px 10px;
	  border-radius: 12px;
	  font-size: 14px;
	  color: var(--muted);
	  transition: background 160ms var(--ease), color 160ms var(--ease);
	}
	
	.lang-dd-item:hover{
	  background: var(--surface-2);
	  color: var(--text);
	}
	
	.lang-dd-item[aria-checked="true"]{
	  background: linear-gradient(135deg, rgba(110,231,255,0.18), rgba(167,139,250,0.14));
	  color: var(--text);
	}
	
	/* small checkmark for active (optional) */
	.lang-dd-item[aria-checked="true"]::after{
	  content:"✓";
	  color: color-mix(in oklab, var(--text), white 0%);
	  opacity: 0.9;
	}
	
	
	/* Burger */
	.burger {
	  display: none;
	  width: 42px;
	  height: 42px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: var(--surface-2);
	  cursor: pointer;
	  align-items: center;
	  justify-content: center;
	}
	.burger svg { opacity: 0.9; }
	
	/* Early collapse to burger so capsule + right controls never wrap */
	@media (max-width: 1140px) {
	  nav.primary-nav { display: none; }
	  .burger { display: inline-flex; }
	}
	
	/* Extra mobile behavior */
	.label-short { display: none; }
	@media (max-width: 560px) {
	  .label-long { display: none; }
	  .label-short { display: inline; }
	
	  header.site-header .container { padding: 0 1px; }
	  .header-inner { height: 64px; gap: 12px; }
	
	  header.site-header .header-actions .btn { height: 40px; }
	  header.site-header .header-actions .btn-primary { padding: 0 14px; }
	  header.site-header .header-actions .btn-secondary { padding: 0 12px; }
	}
	
	/* Hide language + theme in header on small; keep them in drawer */
	@media (max-width: 768px) {
	  header.site-header .header-actions #langSwitch { display: none; }
	  header.site-header #themeToggle { display: none; }
	  header.site-header .header-actions { justify-content: flex-end; }
	}
	
	@media (max-width: 768px) {
	 
	}
	
	/* Force icon buttons stable sizing */
	.icon-btn, .burger { min-width: 42px; flex-shrink: 0; }
	
	/* ---- Mobile drawer ---- */
	.drawer-backdrop {
	  position: fixed;
	  inset: 0;
	  background: rgba(0,0,0,0.45);
	  backdrop-filter: blur(6px);
	  z-index: 1400;
	  opacity: 0;
	  transition: opacity 200ms var(--ease);
	  pointer-events: none;
	}
	.drawer-backdrop.open { opacity: 1; pointer-events: auto; }
	
	.drawer {
	  position: fixed;
	  top: 0;
	  right: 0;
	  bottom: 0;
	
	  width: min(420px, 100vw);
	  border-radius: 26px 0 0 26px;
	
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--bg-2), transparent 6%);
	  box-shadow: var(--shadow);
	  z-index: 1500;
	
	  transform: translateX(110%);
	  transition: transform 240ms var(--ease-out);
	
	  display: grid;
	  grid-template-rows: auto 1fr auto;
	  overflow: hidden;
	}
	.drawer.open { transform: translateX(0); }
	
	.drawer-top {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	
	  padding: calc(14px + env(safe-area-inset-top)) 14px 10px;
	
	  border-bottom: 1px solid var(--border);
	}
	.drawer-title {
	  display: inline-flex;
	  align-items: center;
	  gap: 10px;
	  font-weight: 650;
	  letter-spacing: -0.02em;
	}
	
	.drawer-title .brand-mark {
	  width: 32px;
	  height: 32px;
	  padding: 4px;
	  border-radius: 12px;
	}
	.drawer-title .brand-logo {
	  width: 100%;
	  height: 100%;
	}
	
	.drawer-body { padding: 14px; overflow: auto; }
	
	.drawer-nav {
	  display: grid;
	  gap: 8px;
	}
	.drawer-nav a {
	  padding: 12px 12px;
	  border-radius: 16px;
	  border: 1px solid var(--border);
	  background: var(--surface-2);
	  color: var(--text);
	  transition: transform 160ms var(--ease), border-color 160ms var(--ease);
	}
	.drawer-nav a:hover { transform: translateY(-1px); border-color: var(--border-2); }
	
	.drawer-foot {
	  padding: 14px;
	  padding-bottom: calc(14px + env(safe-area-inset-bottom));
	  border-top: 1px solid var(--border);
	  display: grid;
	  gap: 10px;
	}
	
	/* ---------- Modal (Enterprise Pilot) ---------- */
	.modal-backdrop{
	  position: fixed;
	  inset: 0;
	  z-index: 1600;
	  background: rgba(0,0,0,0.52);
	  backdrop-filter: blur(10px);
	  -webkit-backdrop-filter: blur(10px);
	  opacity: 0;
	  pointer-events: none;
	  transition: opacity var(--dur-2) var(--ease-out);
	  display:flex;
	  align-items:center;
	  justify-content: center;
	  padding: 20px;
	}
	.modal-backdrop.open{
	  opacity: 1;
	  pointer-events: auto;
	}
	.modal{
	  width: min(560px, 100%);
	  border-radius: 24px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--bg), transparent 6%);
	  box-shadow: var(--shadow);
	  overflow:hidden;
	}
	.modal-head{
	  display:flex;
	  align-items:center;
	  justify-content: space-between;
	  padding: 16px 16px 12px;
	  border-bottom: 1px solid var(--border-2);
	}
	.modal-title{
	  font-weight: 800;
	  letter-spacing: -0.02em;
	  font-size: 16px;
	}
	.modal-body{ padding: 16px; }
	.modal-foot{
	  padding: 14px 16px 16px;
	  border-top: 1px solid var(--border-2);
	  display:flex;
	  gap: 10px;
	  justify-content:flex-end;
	}
	
	/* Archive modal overlay priority */
	#archiveBackdrop.modal-backdrop{ z-index: 1650; }

	/* ---------- Cards / surfaces ---------- */
	.card{
	  border-radius: var(--r-2xl);
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 10%);
	  box-shadow: var(--shadow-soft);
	}
	.card.pad{ padding: 18px; }
	.glow{
	  position: relative;
	  overflow: hidden;
	}
	.glow::before{
	  content:"";
	  position:absolute;
	  inset:-1px;
	  background: radial-gradient(600px 220px at 20% 0%, rgba(110,231,255,0.16), transparent 60%),
				  radial-gradient(520px 220px at 90% 0%, rgba(167,139,250,0.16), transparent 62%);
	  opacity: 0.9;
	  pointer-events:none;
	}
	.glow > *{ position: relative; }

	/* ---------- Reveal animation ---------- */
	.reveal{
	  opacity: 0;
	  transform: translateY(10px);
	  transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out);
	}
	.reveal.is-visible{
	  opacity: 1;
	  transform: translateY(0);
	}
	@media (prefers-reduced-motion: reduce){
	  *{ transition: none !important; scroll-behavior: auto !important; animation: none !important; }
	  .reveal{ opacity: 1; transform: none; }
	}

	/* ---------- Main ---------- */
	main{
	  padding: 24px 0 64px;
	}

	.verify-hero{
	  padding-top: 110px;
	  padding-bottom: 64px;
	}

	.hero-grid{
	  display:grid;
	  grid-template-columns: 1.1fr 0.9fr;
	  gap: 22px;
	  align-items: start;
	}
	@media (max-width: 980px){
	  .hero-grid{
		grid-template-columns: 1fr;
	  }
	
	  /* ВАЖНО: сброс инлайн grid-column:2 */
	  .hero-grid > *{
		grid-column: 1 / -1 !important;
	  }
	}
	
	@media (max-width: 560px){
	  .hero-grid{
		gap: 16px;
	  }
	}
	
	@media (max-width: 560px){
	  .container,
	  .page,
	  .wrap{
		padding-left: 5px;
		padding-right: 5px;
	  }
	}
	
	@media (max-width: 560px){
	  .container,
	  .page,
	  .wrap{
		padding-left: 5px;
		padding-right: 5px;
	  }
	}


	.eyebrow{
	  display:inline-flex;
	  align-items:center;
	  gap: 10px;
	  padding: 10px 14px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 10%);
	  color: var(--muted);
	  font-size: 14px;
	  max-width: 100%;
	}
	.eyebrow .dot{
	  width: 9px; height: 9px; border-radius: 999px;
	  background: linear-gradient(135deg, var(--accent-a), var(--accent-b));
	  box-shadow: 0 0 0 4px color-mix(in oklab, var(--accent-a), transparent 78%);
	}
	.h1{
	  font-size: clamp(34px, 4.1vw, 52px);
	  line-height: 1.02;
	  letter-spacing: -0.03em;
	  margin: 16px 0 10px;
	}
	.lead{
	  color: var(--muted);
	  font-size: 18px;
	  line-height: 1.6;
	  margin: 0 0 14px;
	}

	.hero-actions{
	  display:flex;
	  flex-wrap: wrap;
	  gap: 10px;
	  margin-top: 14px;
	}

	/* Verify form card */
	.verify-card{
	  padding: 18px;
	}
	.card-head{
	  display:flex;
	  align-items:center;
	  justify-content: space-between;
	  gap: 12px;
	  margin-bottom: 12px;
	}
	.card-title{
	  font-weight: 800;
	  letter-spacing: -0.02em;
	  font-size: 16px;
	}
	.pill{
	  display:inline-flex;
	  align-items:center;
	  gap: 8px;
	  padding: 8px 10px;
	  border-radius: 999px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 14%);
	  color: var(--muted);
	  font-size: 12px;
	  white-space: nowrap;
	}
	.pill .dot{
	  width: 8px; height: 8px; border-radius: 999px;
	  background: color-mix(in oklab, var(--accent-a), var(--accent-b) 30%);
	  opacity: 0.95;
	}

	.field{
	  display:grid;
	  gap: 8px;
	  margin-top: 12px;
	}
	label{ font-size: 13px; color: var(--muted); }
	.input, .select, .textarea{
	  width: 100%;
	  border-radius: 18px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 8%);
	  padding: 14px 14px;
	  color: var(--text);
	  outline: none;
	  transition: border-color var(--dur-1) var(--ease-out), background var(--dur-1) var(--ease-out);
	}
	.input:focus, .select:focus, .textarea:focus{
	  border-color: color-mix(in oklab, var(--accent-a), var(--border) 40%);
	  background: color-mix(in oklab, var(--card), transparent 0%);
	}
	.textarea{ min-height: 96px; resize: vertical; }

	.hint{ font-size: 12px; color: var(--faint); line-height: 1.45; }
	.error{ font-size: 12px; color: color-mix(in oklab, var(--bad), white 6%); display:none; }

	/* Range switch */
	.range-switch{
	  display:flex;
	  gap: 8px;
	  padding: 8px;
	  border: 1px solid var(--border-2);
	  border-radius: 20px;
	  background: color-mix(in oklab, var(--card), transparent 14%);
	  flex-wrap: wrap;
	}
	.range-switch button{
	  border: 1px solid transparent;
	  background: transparent;
	  color: var(--muted);
	  border-radius: 16px;
	  padding: 10px 12px;
	  transition: background var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out);
	  flex: 1 1 120px;
	  min-height: 40px;
	}
	.range-switch button.active{
	  background: color-mix(in oklab, var(--card), transparent 0%);
	  border-color: var(--border);
	  color: var(--text);
	}
	.range-grid{
	  display:grid;
	  grid-template-columns: 1fr 1fr;
	  gap: 10px;
	}
	@media (max-width: 520px){
	  .range-grid{ grid-template-columns: 1fr; }
	}

	.row{
	  display:flex;
	  align-items:center;
	  justify-content: space-between;
	  gap: 12px;
	  margin-top: 12px;
	  flex-wrap: wrap;
	}
	.row .btn{ flex: 1 1 220px; height: 52px; }
	.row .btn-secondary{ flex: 1 1 160px; }

	.check{
	  display:flex;
	  gap: 10px;
	  align-items:flex-start;
	  padding: 12px 12px;
	  border-radius: 18px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 16%);
	}
	.check input{ margin-top: 2px; }
	.check b{ font-weight: 750; }
	.checks{ display:grid; gap: 10px; margin-top: 12px; }

	/* Right info card */
	.info-card{
	  padding: 18px;
	  display:grid;
	  gap: 12px;
	}
	.kvs{
	  display:grid;
	  gap: 10px;
	}
	.kv{
	  display:flex;
	  align-items:flex-start;
	  justify-content: space-between;
	  gap: 14px;
	  padding: 10px 12px;
	  border-radius: 16px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 16%);
	}
	.kv .k{ color: var(--muted); font-size: 13px; }
	.kv .v{ color: var(--text); font-size: 13px; text-align:right; }
	
	

	/* ---------- Results section ---------- */
	.results{
	  margin-top: 18px;
	  display:grid;
	  gap: 14px;
	}
	.status-grid{
	  display:grid;
	  grid-template-columns: repeat(4, 1fr);
	  gap: 12px;
	}
	@media (max-width: 980px){
	  .status-grid{ grid-template-columns: repeat(2, 1fr); }
	}
	@media (max-width: 520px){
	  .status-grid{ grid-template-columns: 1fr; }
	}
	.status-card{
	  padding: 14px;
	  border-radius: 20px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 10%);
	  display:grid;
	  gap: 8px;
	  min-height: 104px;
	}
	.status-top{
	  display:flex;
	  align-items:center;
	  justify-content: space-between;
	  gap: 10px;
	}
	.badge{
	  font-size: 12px;
	  padding: 6px 10px;
	  border-radius: 999px;
	  border: 1px solid var(--border-2);
	  color: var(--muted);
	  background: color-mix(in oklab, var(--card), transparent 18%);
	  white-space: nowrap;
	}
	.badge.ok{
	  border-color: color-mix(in oklab, var(--ok), transparent 60%);
	  background: color-mix(in oklab, var(--ok), transparent 88%);
	  color: color-mix(in oklab, var(--ok), white 10%);
	}
	.badge.warn{
	  border-color: color-mix(in oklab, var(--warn), transparent 62%);
	  background: color-mix(in oklab, var(--warn), transparent 90%);
	  color: color-mix(in oklab, var(--warn), black 10%);
	}
	.badge.bad{
	  border-color: color-mix(in oklab, var(--bad), transparent 62%);
	  background: color-mix(in oklab, var(--bad), transparent 92%);
	  color: color-mix(in oklab, var(--bad), white 10%);
	}
	.status-title{
	  font-weight: 780;
	  letter-spacing: -0.01em;
	}
	.status-desc{ color: var(--muted); font-size: 13px; line-height: 1.45; }

	.evidence-grid{
	  display:grid;
	  grid-template-columns: 1.2fr 0.8fr;
	  gap: 12px;
	}
	@media (max-width: 980px){
	  .evidence-grid{ grid-template-columns: 1fr; }
	}

	.codebox{
	  border-radius: 20px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 10%);
	  overflow:hidden;
	}
	.codebox-head{
	  display:flex;
	  align-items:center;
	  justify-content: space-between;
	  padding: 12px 12px;
	  border-bottom: 1px solid var(--border-2);
	}
	.codebox-title{ font-weight: 780; font-size: 13px; color: var(--muted); }
	.codebox pre{
	  margin: 0;
	  padding: 12px;
	  font-family: var(--mono);
	  font-size: 12px;
	  line-height: 1.55;
	  color: color-mix(in oklab, var(--text), transparent 10%);
	  overflow:auto;
	  max-height: 820px;
	  white-space: pre;
	}

	.actions-row{
	  display:flex;
	  flex-wrap: wrap;
	  gap: 10px;
	  margin-top: 12px;
	}
	.actions-row .btn{ height: 46px; }

	.notice{
	  padding: 12px 12px;
	  border-radius: 18px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 14%);
	  color: var(--muted);
	  font-size: 13px;
	  line-height: 1.55;
	}
	.notice b{ color: var(--text); }
	
	/* Mobile safety: grids must stack and children must be shrinkable */
	@media (max-width: 980px){
	  .hero-grid{ grid-template-columns: 1fr !important; }
	  .evidence-grid{ grid-template-columns: 1fr !important; }
	  .hero-grid > *, .evidence-grid > *{ min-width: 0; }
	}
	
	/* Prevent JSON box from forcing horizontal layout */
	.codebox, .card.pad { min-width: 0; }
	
	/* Make long JSON wrap nicely on phones (optional but recommended) */
	@media (max-width: 560px){
	  .codebox pre{
		white-space: pre-wrap;
		word-break: break-word;
		overflow-wrap: anywhere;
		max-height: 520px;
	  }
	}

	/* =========================
	   FOOTER
	   ========================= */
	footer.site-footer {
	  padding: 56px 0 18px;
	  border-top: 1px solid var(--border);
	  background: color-mix(in oklab, var(--bg-2), transparent 0%);
	}
	
	.footer-grid {
	  display: grid;
	  grid-template-columns: 0.95fr 1.05fr;
	  gap: 28px;
	  align-items: start;
	}
	
	@media (max-width: 900px) {
	  .footer-grid { 
		grid-template-columns: 1fr; 
		gap: 18px; 
	  }
	}
	
	/* Left column */
	.footer-left { 
	  min-width: 0; 
	}
	
	.footer-brand {
	  display: flex;
	  align-items: center;
	  gap: 10px;
	}
	
	.footer-brand-name {
	  font-weight: 750;
	  letter-spacing: -0.01em;
	}
	
	.footer-tagline { 
	  margin-top: 10px; 
	}
	
	.footer-note {
	  margin-top: 12px;
	  padding-top: 12px;
	  border-top: 1px dashed color-mix(in oklab, var(--border), transparent 30%);
	}
	
	/* Social buttons */
	.social-row { 
	  display: flex; 
	  gap: 10px; 
	  margin-top: 14px; 
	}
	
	.social {
	  width: 38px;
	  height: 38px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: var(--surface-2);
	  display: grid;
	  place-items: center;
	  transition: transform 160ms var(--ease), border-color 160ms var(--ease), background 160ms var(--ease);
	}
	
	.social:hover {
	  transform: translateY(-1px);
	  border-color: color-mix(in oklab, var(--accent), var(--border-2) 60%);
	  background: color-mix(in oklab, var(--surface), transparent 0%);
	}
	
	/* =========================
	   FOOTER LINKS GRID
	   ========================= */
	.footer-links {
	  display: grid;
	  grid-template-columns: repeat(3, minmax(0, 1fr));
	  gap: 14px 18px;
	  align-content: start;
	}
	
	@media (max-width: 980px) {
	  .footer-links { 
		grid-template-columns: repeat(2, minmax(0, 1fr)); 
	  }
	}
	
	/* Column headers */
	.footer-col { 
	  min-width: 0; 
	}
	
	.footer-h {
	  font-size: 12px;
	  letter-spacing: 0.10em;
	  text-transform: uppercase;
	  color: var(--faint);
	  margin: 4px 0 10px;
	}
	
	/* Link styling */
	.footer-links a {
	  position: relative;
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  gap: 10px;
	  min-height: 38px;
	  padding: 9px 10px;
	  border-radius: 12px;
	  color: color-mix(in oklab, var(--muted), white 8%);
	  transition: background 160ms var(--ease), color 160ms var(--ease), border-color 160ms var(--ease), transform 160ms var(--ease);
	}
	
	/* subtle underline indicator */
	.footer-links a::after {
	  content: "";
	  position: absolute;
	  left: 10px;
	  right: 10px;
	  bottom: 7px;
	  height: 1px;
	  background: transparent;
	  transition: background 160ms var(--ease);
	}
	
	.footer-links a:hover {
	  background: var(--surface-2);
	  color: var(--text);
	  transform: translateY(-0.5px);
	}
	
	.footer-links a:hover::after {
	  background: color-mix(in oklab, var(--accent), transparent 65%);
	}
	
	/* Primary links (Verify/Explorer) */
	.footer-links a.is-primary {
	  color: var(--text);
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--surface), transparent 0%);
	}
	
	.footer-links a.is-primary:hover {
	  border-color: var(--border-2);
	  background: color-mix(in oklab, var(--surface), transparent 0%);
	}
	
	/* Back to top */
	.footer-links a.back-top {
	  margin-top: 6px;
	  border: 1px dashed color-mix(in oklab, var(--border), transparent 20%);
	  color: var(--muted);
	}
	
	.footer-links a.back-top:hover {
	  border-color: color-mix(in oklab, var(--accent), var(--border-2) 60%);
	  color: var(--text);
	}
	
	/* =========================
	   ACCORDION FOR MOBILE (≤768px)
	   ========================= */
	@media (max-width: 768px) {
	  .footer-links {
		display: block;
		grid-template-columns: 1fr;
	  }
	
	  .footer-col {
		border-bottom: 1px solid var(--border);
		margin-bottom: 12px;
	  }
	
	  .footer-col:last-child {
		border-bottom: none;
		margin-bottom: 0;
	  }
	
	  .footer-h {
		font-size: 13px;
		font-weight: 650;
		letter-spacing: 0;
		text-transform: none;
		color: var(--text);
		cursor: pointer;
		padding: 14px 0;
		margin: 0;
		user-select: none;
		display: flex;
		align-items: center;
		justify-content: space-between;
		position: relative;
	  }
	
	  .footer-h::after {
		content: "↓";
		font-size: 12px;
		color: var(--muted);
		transition: transform 220ms var(--ease);
		margin-left: 8px;
		opacity: 0.7;
	  }
	
	  .footer-col.active .footer-h::after {
		transform: rotate(180deg);
		color: var(--accent);
	  }
	
	  /* Ссылки изначально скрыты на мобильных */
	  .footer-links a:not(.back-top) {
		display: none;
		padding: 10px 0;
		color: color-mix(in oklab, var(--muted), white 8%);
		border-top: 1px solid var(--surface-2);
		opacity: 0;
		transform: translateY(-5px);
		transition: opacity 220ms var(--ease), transform 220ms var(--ease);
	  }
	
	  .footer-links a:first-child:not(.back-top) {
		border-top: none;
		margin-top: 4px;
	  }
	
	  /* Когда активен - показываем ссылки с анимацией */
	  .footer-col.active a:not(.back-top) {
		display: flex;
		opacity: 1;
		transform: translateY(0);
	  }
	
	  /* Back to top - всегда виден на мобильных, вне аккордеона */
	  .footer-links a.back-top {
		display: flex !important;
		margin-top: 16px;
		margin-bottom: 8px;
		border: 1px solid var(--border);
		border-radius: 12px;
		padding: 12px 14px;
		width: 100%;
		justify-content: center;
		opacity: 1 !important;
		transform: none !important;
	  }
	
	  /* Задержка для каждой ссылки при появлении */
	  .footer-col.active a:nth-child(2):not(.back-top) { transition-delay: 50ms; }
	  .footer-col.active a:nth-child(3):not(.back-top) { transition-delay: 100ms; }
	  .footer-col.active a:nth-child(4):not(.back-top) { transition-delay: 150ms; }
	  .footer-col.active a:nth-child(5):not(.back-top) { transition-delay: 200ms; }
	
	  .footer-links a:hover:not(.back-top) {
		color: var(--text);
		background: transparent;
	  }
	
	  .footer-links a.back-top:hover {
		border-color: color-mix(in oklab, var(--accent), var(--border-2) 60%);
		background: var(--surface-2);
	  }
	}
	
	/* Back to top на мобильных (вне аккордеона) */
	@media (max-width: 768px) {
	  .back-top.mobile-back-top {
		display: none; /* По умолчанию скрыт */
	  }
	  
	  .footer-links .back-top.mobile-back-top {
		display: flex !important;
		margin-top: 20px;
		margin-bottom: 10px;
		border: 1px solid var(--border);
		border-radius: 12px;
		padding: 14px 16px;
		width: 100%;
		justify-content: center;
		font-weight: 500;
		background: var(--surface-2);
		color: var(--text);
		transition: all 160ms var(--ease);
	  }
	  
	  .footer-links .back-top.mobile-back-top:hover {
		border-color: var(--accent);
		background: color-mix(in oklab, var(--surface), transparent 0%);
		transform: translateY(-1px);
	  }
	  
	  /* Скрываем Back to top внутри Trust колонки на мобильных */
	  .footer-col .back-top:not(.mobile-back-top) {
		display: none !important;
	  }
	}
	
	/* На десктопе показываем обычный Back to top в Trust колонке */
	@media (min-width: 769px) {
	  .back-top.mobile-back-top {
		display: none !important;
	  }
	  
	  .footer-col .back-top:not(.mobile-back-top) {
		display: flex;
	  }
	}
	
	
	
	/* На мобильных показываем mobile-back-top и скрываем desktop-back-top */
	@media (max-width: 768px) {
	  .back-top.desktop-back-top {
		display: none !important;
	  }
	  
	  .back-top.mobile-back-top {
		display: flex !important;
		margin-top: 20px;
		/* остальные стили */
	  }
	}
	
	/* =========================
	   BOTTOM BAR
	   ========================= */
	.footer-bar {
	  margin-top: 18px;
	  padding-top: 14px;
	  border-top: 1px solid var(--border);
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  gap: 12px;
	  flex-wrap: wrap;
	}
	
	.footer-meta {
	  display: flex;
	  gap: 8px;
	  align-items: center;
	}
	
	.footer-mini {
	  padding: 8px 10px;
	  border-radius: 999px;
	  border: 1px solid transparent;
	  color: var(--muted);
	  transition: background 160ms var(--ease), color 160ms var(--ease), border-color 160ms var(--ease);
	}
	
	.footer-mini:hover {
	  background: var(--surface-2);
	  border-color: var(--border);
	  color: var(--text);
	}
	
	/* Mobile tap targets */
	@media (max-width: 560px) {
	  .footer-links a { 
		min-height: 44px; 
		padding: 12px 0; 
	  }
	}
	
	/* Focus styles */
	.footer-links a:focus-visible,
	.footer-mini:focus-visible,
	.social:focus-visible,
	.footer-h:focus-visible {
	  outline: 3px solid var(--focus);
	  outline-offset: 3px;
	  border-radius: 12px;
	}
	
	/* For accessibility - ensure footer-h is focusable on mobile */
	@media (max-width: 768px) {
	  .footer-h {
		outline-offset: 2px;
	  }
	}
	
	/* Reduce motion preferences */
	@media (prefers-reduced-motion: reduce) {
	  .footer-h::after,
	  .footer-links a,
	  .social {
		transition: none;
	  }
	  
	  .footer-col.active a {
		animation: none;
	  }
	  
	  @keyframes footerFadeIn {
		from { opacity: 0; }
		to { opacity: 1; }
	  }
	}
	
	/* Small brand badge sizing */
	.brand-mark--sm {
	  width: 28px;
	  height: 28px;
	  padding: 4px;
	  border-radius: 10px;
	}
	
	.brand-mark--sm::before { 
	  opacity: 0.45; 
	}
	
	.brand-mark--sm::after { 
	  opacity: 0.40; 
	}
	
	.brand-mark--sm{
	  width: 28px;
	  height: 28px;
	  padding: 4px;  
	  border-radius: 10px;
	}
	
	/* на маленьком бейдже уменьшаем тени (чтобы не выглядело “тяжело”) */
	.brand-mark--sm::before{ opacity: 0.45; }
	.brand-mark--sm::after{ opacity: 0.40; }
	
	.social-row { display: flex; gap: 10px; margin-top: 12px; }
	.social {
	  width: 42px;
	  height: 42px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: var(--surface-2);
	  display: grid;
	  place-items: center;
	  transition: transform 160ms var(--ease), border-color 160ms var(--ease);
	}
	.social:hover { transform: translateY(-1px); border-color: var(--border-2); }
	
	/* ---- Reveal animations ---- */
	.reveal {
	  opacity: 0;
	  transform: translateY(10px);
	  filter: blur(2px);
	  transition: opacity 520ms var(--ease-out), transform 520ms var(--ease-out), filter 520ms var(--ease-out);
	  will-change: transform, opacity;
	}
	.reveal.in-view {
	  opacity: 1;
	  transform: translateY(0);
	  filter: blur(0);
	}
	@media (prefers-reduced-motion: reduce) {
	  .reveal { opacity: 1; transform: none; filter: none; }
	}

	/* ---------- Terminal Sidebar ---------- */
	.terminal-backdrop{
	  position: fixed;
	  inset: 0;
	  z-index: 1700;
	  background: rgba(0,0,0,0.28);
	  opacity: 0;
	  pointer-events: none;
	  transition: opacity var(--dur-2) var(--ease-out);
	}
	.terminal-backdrop.open{
	  opacity: 1;
	  pointer-events: auto;
	}

	.terminal-drawer{
	  position: fixed;
	  top: 0;
	  right: 0;
	  bottom: 0;
	  width: min(460px, 100vw);
	  z-index: 1800;
	  background: color-mix(in oklab, var(--bg), transparent 6%);
	  border-left: 1px solid var(--border);
	  box-shadow: var(--shadow);
	  border-radius: 26px 0 0 26px;
	  transform: translateX(110%);
	  transition: transform var(--dur-2) var(--ease-out);
	  display:grid;
	  grid-template-rows: auto 1fr auto;
	  overflow:hidden;
	}
	.terminal-drawer.open{ transform: translateX(0); }

	.terminal-head{
	  padding: calc(14px + env(safe-area-inset-top)) 14px 10px;
	  border-bottom: 1px solid var(--border-2);
	  display:flex;
	  align-items:center;
	  justify-content: space-between;
	  gap: 10px;
	}
	.terminal-title{
	  display:flex;
	  align-items:center;
	  gap: 10px;
	  font-weight: 850;
	  letter-spacing: -0.02em;
	}
	.terminal-sub{
	  font-size: 12px;
	  color: var(--faint);
	  margin-top: 2px;
	  font-weight: 550;
	}
	.terminal-controls{
	  display:flex;
	  align-items:center;
	  gap: 10px;
	}

	.terminal-body{
	  padding: 12px;
	  overflow:auto;
	  font-family: var(--mono);
	  font-size: 12px;
	  line-height: 1.55;
	  color: color-mix(in oklab, var(--text), transparent 10%);
	  background:
		radial-gradient(520px 240px at 10% 0%, rgba(110,231,255,0.10), transparent 60%),
		radial-gradient(520px 240px at 90% 0%, rgba(167,139,250,0.10), transparent 60%);
	}
	.tline{
	  display:flex;
	  gap: 10px;
	  padding: 6px 8px;
	  border-radius: 12px;
	  border: 1px solid transparent;
	  align-items:flex-start;
	}
	.tline:hover{
	  background: color-mix(in oklab, var(--card), transparent 6%);
	  border-color: var(--border-2);
	}
	.t-time{ color: var(--faint); min-width: 84px; }
	.t-level{ min-width: 56px; font-weight: 800; }
	.t-msg{ flex: 1; }
	.t-meta{
	  margin-top: 4px;
	  padding: 8px 10px;
	  border-radius: 14px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 12%);
	  color: var(--muted);
	  white-space: pre-wrap;
	  word-break: break-word;
	}
	.lvl-info{ color: color-mix(in oklab, var(--accent-a), var(--text) 30%); }
	.lvl-ok{ color: color-mix(in oklab, var(--ok), white 12%); }
	.lvl-warn{ color: color-mix(in oklab, var(--warn), white 4%); }
	.lvl-err{ color: color-mix(in oklab, var(--bad), white 10%); }

	.terminal-foot{
	  padding: 12px 14px;
	  padding-bottom: calc(12px + env(safe-area-inset-bottom));
	  border-top: 1px solid var(--border-2);
	  display:flex;
	  gap: 10px;
	  justify-content: space-between;
	  align-items:center;
	}
	.terminal-foot .btn{ height: 40px; }

	/* Floating terminal button */
	.terminal-fab{
	  position: fixed;
	  right: calc(14px + env(safe-area-inset-right));
	  bottom: calc(18px + env(safe-area-inset-bottom));
	  z-index: 1750;
	  display:inline-flex;
	  align-items:center;
	  gap: 10px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--bg), transparent 10%);
	  box-shadow: var(--shadow-soft);
	  padding: 10px 12px;
	  color: var(--text);
	  -webkit-tap-highlight-color: transparent;
	  transition: transform var(--dur-1) var(--ease-out);
	}
	.terminal-fab:hover{ transform: translateY(-1px); }
	.terminal-fab .count{
	  min-width: 26px;
	  height: 22px;
	  border-radius: 999px;
	  background: linear-gradient(135deg, color-mix(in oklab, var(--accent-a), transparent 0%), color-mix(in oklab, var(--accent-b), transparent 0%));
	  color: rgba(10,14,22,0.95);
	  display:grid;
	  place-items:center;
	  font-weight: 900;
	  font-size: 12px;
	}

	/* ---------- Toast ---------- */
	.toast{
	  position: fixed;
	  left: 50%;
	  transform: translateX(-50%);
	  bottom: calc(18px + env(safe-area-inset-bottom));
	  z-index: 2000;
	  padding: 12px 14px;
	  border-radius: 999px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--bg), transparent 10%);
	  box-shadow: var(--shadow-soft);
	  color: var(--text);
	  font-size: 13px;
	  opacity: 0;
	  pointer-events:none;
	  transition: opacity var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-out);
	  transform-origin: center;
	}
	.toast.show{
	  opacity: 1;
	  transform: translateX(-50%) translateY(-2px);
	}

	/* ---------- Utility ---------- */
	.hidden{ display:none !important; }



/* ============ Verify Tool Block ============ */
	.vtool-grid{
	  display:grid;
	  grid-template-columns: 1fr 1fr;
	  gap: 12px;
	  align-items:start;
	}
	@media (max-width: 980px){ .vtool-grid{ grid-template-columns: 1fr; } }
	
	.vtool-pane{
	  border-radius: 22px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 10%);
	  box-shadow: var(--shadow-soft);
	  overflow: hidden;
	}
	.vtool-paneHead{
	  display:flex; align-items:center; justify-content:space-between;
	  gap:12px; padding: 14px;
	  border-bottom: 1px solid var(--border-2);
	  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
	}
	html[data-theme="light"] .vtool-paneHead{
	  background: linear-gradient(180deg, rgba(9,18,35,0.03), rgba(9,18,35,0.01));
	}
	.vtool-paneTitle{ font-weight: 850; letter-spacing: -0.02em; }
	.vtool-mini{
	  display:inline-flex; align-items:center; gap:8px;
	  padding: 7px 10px; border-radius: 999px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 14%);
	  color: var(--muted); font-size: 12px; white-space:nowrap;
	}
	.vfield{ padding: 14px; display:grid; gap: 8px; }
	.vlabel{ font-size: 13px; color: var(--muted); }
	.vhint{ font-size: 12px; color: var(--faint); line-height: 1.45; }
	.verr{ font-size: 12px; color: color-mix(in oklab, var(--bad), white 6%); display:none; }
	.verr.show{ display:block; }
	.mono{ font-family: var(--mono); }
	
	.vinput {
	  width: 100%;
	  border-radius: 18px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 8%);
	  padding: 14px 14px;
	  color: var(--text);
	  outline: none;
	  transition: border-color var(--dur-1) var(--ease-out), background var(--dur-1) var(--ease-out);
	}
	.vinput:focus, .vselect:focus{
	  border-color: color-mix(in oklab, var(--accent-a), var(--border) 40%);
	  background: color-mix(in oklab, var(--card), transparent 0%);
	}
	
	
	.vinput[aria-invalid="true"]{
	  border-color: rgba(239,68,68,0.65);
	  box-shadow: 0 0 0 3px rgba(239,68,68,0.14);
	}
	
	@media (max-width: 560px){
	  .vinput{
		width: 90%;

	  }
	}
	
	/* ===== Fancy native select (pill) ===== */
	.vselect-wrap{
	  position: relative;
	}
	
	.vselect{
	  -webkit-appearance: none;
	  appearance: none;
	  width: 100%;
	  border-radius: 999px;           /* как кнопка */
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 8%);
	  padding: 14px 44px 14px 14px;   /* место под chevron */
	  color: var(--text);
	  outline: none;
	  line-height: 1.2;
	  cursor: pointer;
	  transition: border-color var(--dur-1) var(--ease-out),
				  background var(--dur-1) var(--ease-out),
				  transform var(--dur-1) var(--ease-out);
	}
	
	.vselect:hover{
	  border-color: color-mix(in oklab, var(--border), white 12%);
	  background: color-mix(in oklab, var(--card), transparent 0%);
	  transform: translateY(-0.5px);
	}
	
	.vselect:focus{
	  border-color: color-mix(in oklab, var(--accent-a), var(--border) 40%);
	  box-shadow: 0 0 0 4px color-mix(in oklab, var(--accent-a), transparent 84%);
	}
	
	/* Custom chevron */
	.vselect-wrap::after{
	  content:"";
	  position:absolute;
	  top: 50%;
	  right: 14px;
	  width: 10px;
	  height: 10px;
	  transform: translateY(-50%) rotate(45deg);
	  border-right: 2px solid color-mix(in oklab, var(--muted), white 8%);
	  border-bottom: 2px solid color-mix(in oklab, var(--muted), white 8%);
	  pointer-events: none;
	  opacity: .9;
	}
	
	/* macOS Safari fix: prevent inner text clipping */
	.vselect{
	  background-clip: padding-box;
	}
	
	/* Optional: make option list nicer where supported */
	.vselect option{
	  color: #111; /* системное меню чаще светлое */
	}
	html[data-theme="dark"] .vselect option{
	  color: #111;
	}
	
	/* Network select */
	.netSel{ position: relative; }
	.netBtn{
	  width: 100%; display:flex; align-items:center; justify-content:space-between; gap:12px;
	  padding: 12px 12px; border-radius: 18px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 8%);
	}
	.netBtn:hover{ border-color: color-mix(in oklab, var(--border), white 10%); }
	.netMain{ display:flex; align-items:center; gap:10px; min-width:0; }
	.netIcon{
	  width: 34px; height: 34px; border-radius: 14px;
	  display:grid; place-items:center;
	  border: 1px solid var(--border-2);
	  background: linear-gradient(135deg,
		color-mix(in oklab, var(--accent-a), transparent 78%),
		color-mix(in oklab, var(--accent-b), transparent 78%));
	}
	.netText{ min-width:0; }
	.netName{ font-weight: 850; line-height:1.1; }
	.netSub{ font-size:12px; color: var(--faint); display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
	.okDot{ width: 7px; height:7px; border-radius:999px; background: var(--ok); box-shadow: 0 0 0 4px rgba(34,197,94,0.10); }
	.netState{ color: var(--muted); }
	.netChevron{ opacity:.75; }
	
	.netMenu{
	  position:absolute; left:0; right:0;
	  top: calc(100% + 10px);
	  border-radius: 18px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--bg), transparent 8%);
	  box-shadow: var(--shadow);
	  padding: 8px;
	  display:none;
	  z-index: 50;
	}
	.netSel.open .netMenu{ display:block; }
	.netItem{
	  width:100%;
	  display:flex; align-items:center; justify-content:space-between; gap:12px;
	  padding: 10px; border-radius: 14px; border: 1px solid transparent;
	  background: transparent; color: var(--text);
	}
	.netItem:hover{ background: color-mix(in oklab, var(--card), transparent 6%); border-color: var(--border-2); }
	.netItemSub{ display:block; font-size:12px; color: var(--faint); }
	.netSep{ height:1px; background: var(--border-2); margin: 8px 0; }
	.netFootBtn{
	  width:100%;
	  display:flex; align-items:center; justify-content:space-between;
	  padding: 10px; border-radius: 14px;
	  border: 1px dashed color-mix(in oklab, var(--border), transparent 0%);
	  background: transparent; color: var(--muted);
	}
	.netFootBtn:hover{
	  background: color-mix(in oklab, var(--card), transparent 10%);
	  color: var(--text);
	  border-color: color-mix(in oklab, var(--accent-a), var(--border) 50%);
	}
	
	/* Scope tabs */
	.scopeTabs{
	  display:grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
	  padding: 8px; border-radius: 18px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 14%);
	}
	.scopeTab{
	  border: 1px solid transparent; background: transparent;
	  border-radius: 14px; padding: 10px;
	  color: var(--muted);
	  transition: background var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out);
	}
	.scopeTab.active{
	  background: color-mix(in oklab, var(--card), transparent 0%);
	  border-color: var(--border);
	  color: var(--text);
	}
	.scopeBody{ display:none; gap: 10px; }
	.scopeBody.show{ display:grid; }
	.vrow2{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; }
	@media (max-width: 560px){ .vrow2{ grid-template-columns: 1fr; } }
	.vrow2-tight{ grid-template-columns: 1fr auto; align-items:center; }
	.w100{ width:100%; }
	
	/* Summary strip */
	.scopeSummary{
	  padding: 10px 12px;
	  border-radius: 16px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 16%);
	  color: var(--muted);
	  font-size: 12px;
	  display:flex; flex-wrap:wrap; gap:10px;
	}
	.scopeSummary .chip{
	  display:inline-flex; align-items:center; gap: 8px;
	  padding: 7px 9px;
	  border-radius: 999px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 18%);
	  color: var(--faint);
	}
	.scopeSummary .chip strong{ color: var(--text); font-weight: 800; }
	
	/* Options */
	/* ===== Pretty checkbox cards (optCard) ===== */
	.optCard{
	  position: relative;
	  display:flex;
	  align-items:flex-start;
	  gap: 12px;
	  padding: 12px 12px;
	  border-radius: 18px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 16%);
	  transition: transform var(--dur-1) var(--ease-out),
				  border-color var(--dur-1) var(--ease-out),
				  background var(--dur-1) var(--ease-out),
				  box-shadow var(--dur-2) var(--ease-out);
	}
	.optCard:hover{
	  border-color: color-mix(in oklab, var(--border), white 14%);
	  background: color-mix(in oklab, var(--card), transparent 8%);
	  transform: translateY(-0.5px);
	}
	
	/* hide native checkbox, keep accessible */
	.optCard input[type="checkbox"]{
	  position: absolute;
	  opacity: 0;
	  pointer-events: none;
	}
	
	/* custom square */
	.optCard input[type="checkbox"] + span{
	  position: relative;
	  padding-left: 38px; /* space for custom box */
	  min-width: 0;
	}
	.optCard input[type="checkbox"] + span::before{
	  content:"";
	  position:absolute;
	  left: 0;
	  top: 2px;
	  width: 22px;
	  height: 22px;
	  border-radius: 8px;
	  border: 1px solid var(--border);
	  background: color-mix(in oklab, var(--card), transparent 10%);
	  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
	  transition: border-color var(--dur-1) var(--ease-out),
				  background var(--dur-1) var(--ease-out),
				  box-shadow var(--dur-1) var(--ease-out),
				  transform var(--dur-1) var(--ease-out);
	}
	
	/* checkmark */
	.optCard input[type="checkbox"] + span::after{
	  content:"";
	  position:absolute;
	  left: 6px;
	  top: 8px;
	  width: 10px;
	  height: 6px;
	  border-left: 2.5px solid rgba(10,14,22,0.92);
	  border-bottom: 2.5px solid rgba(10,14,22,0.92);
	  transform: rotate(-45deg) scale(0.6);
	  opacity: 0;
	  transition: opacity 120ms var(--ease-out), transform 160ms var(--ease-out);
	}
	
	/* checked state: gradient fill + glow */
	.optCard input[type="checkbox"]:checked + span::before{
	  border-color: transparent;
	  background: linear-gradient(135deg, var(--accent-a), var(--accent-b));
	  box-shadow:
		0 10px 26px rgba(110,231,255,0.10),
		0 10px 26px rgba(167,139,250,0.10);
	  transform: translateY(-0.2px);
	}
	.optCard input[type="checkbox"]:checked + span::after{
	  opacity: 1;
	  transform: rotate(-45deg) scale(1);
	}
	
	/* focus-visible outline on the whole card */
	.optCard:has(input[type="checkbox"]:focus-visible){
	  outline: 3px solid color-mix(in oklab, var(--accent-a), white 10%);
	  outline-offset: 3px;
	}
	
	/* disabled */
	.optCard input[type="checkbox"]:disabled + span{
	  opacity: 0.55;
	}
	.optCard:has(input[type="checkbox"]:disabled){
	  filter: grayscale(0.15);
	  cursor: not-allowed;
	}
	
	/* titles inside optCard */
	.optCard b{
	  font-weight: 850;
	  letter-spacing: -0.01em;
	}
	.optCard .sub{
	  margin-top: 2px;
	  font-size: 12px;
	  color: var(--faint);
	  line-height: 1.45;
	}
	
	/* Actions + progress */
	.vactionsWrap{ padding: 14px; display:grid; gap: 10px; }
	.vactions{ display:grid; grid-template-columns: 1fr 0.75fr; gap:10px; align-items:center; }
	@media (max-width: 560px){ .vactions{ grid-template-columns: 1fr; } }
	.vprogress{
	  display:none;
	  gap: 8px;
	  padding: 10px 12px;
	  border-radius: 16px;
	  border: 1px solid var(--border-2);
	  background: color-mix(in oklab, var(--card), transparent 16%);
	}
	.vprogress.show{ display:grid; }
	.pmeta{ display:flex; justify-content:space-between; gap:12px; }
	.plabel{ font-size:12px; color: var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
	.ppct{ font-size:12px; font-weight:900; color: var(--text); font-variant-numeric: tabular-nums; }
	.pbar{ height:8px; border-radius:999px; overflow:hidden; border:1px solid var(--border-2); background: color-mix(in oklab, var(--card), transparent 0%); }
	.pfill{ height:100%; width:0%; border-radius:999px; background: linear-gradient(135deg, var(--accent-a), var(--accent-b)); transition: width 220ms var(--ease-out); }
	
	.vmicro{ font-size:12px; color: var(--faint); line-height:1.5; }
	.vmicro b{ color: var(--text); }
	
	
	
	/* =========================================================
	   FIX: Evidence summary layout (ONLY inside #summaryKVs)
	   - doesn’t touch "What gets verified" info-card
	   ========================================================= */
	
	#summaryKVs { min-width: 0; }
	
	/* Use grid for stable two-column layout */
	#summaryKVs .kv{
	  display: grid;
	  grid-template-columns: minmax(140px, 0.95fr) minmax(0, 1.25fr);
	  align-items: center;
	  gap: 14px;
	  min-width: 0;
	}
	
	/* Key: stay on one line, ellipsis if needed */
	#summaryKVs .kv .k{
	  min-width: 0;
	  white-space: nowrap;
	  overflow: hidden;
	  text-overflow: ellipsis;
	}
	
	/* Value: allow long hashes but never overflow outside card */
	#summaryKVs .kv .v{
	  min-width: 0;
	  text-align: right;
	  overflow: hidden;
	  text-overflow: ellipsis;
	  white-space: nowrap;
	}
	
	/* Mobile: stack key/value */
	@media (max-width: 520px){
	  #summaryKVs .kv{
		grid-template-columns: 1fr;
		gap: 6px;
		align-items: start;
	  }
	  #summaryKVs .kv .v{
		text-align: left;
		white-space: normal;
		overflow: visible;
		text-overflow: clip;
		overflow-wrap: anywhere;
	  }
	  #summaryKVs .kv .k{
		white-space: normal;
	  }
	}
	

	/* =========================================================
	   DESKTOP: Evidence grid equal columns (Proof == Summary)
	   ========================================================= */
	
	/* Always allow shrink */
	.evidence-grid > * { min-width: 0; }
	
	/* 50/50 on desktop */
	@media (min-width: 981px){
	  .evidence-grid{
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: start;
	  }
	}
	
	/* Optional: make Proof feel less "empty wide" by limiting line length */
	@media (min-width: 981px){
	  .codebox pre{
		max-width: 100%;
		/* keeps JSON readable without feeling like a huge empty panel */
		line-height: 1.55;
	  }
	}
	
	/* If advancedBox hidden → summary takes full width (keep your behavior) */
	#advancedBox[style*="display:none"] + .card{
	  grid-column: 1 / -1;
	}
	
	/* Make JSON safe on phones */
	@media (max-width: 560px){
	  .codebox pre{
		white-space: pre-wrap;
		overflow-wrap: anywhere;
		word-break: break-word;
		max-height: 520px;
	  }
	}