:root {
  --ink: #f5f7fb;
  --ink-soft: #c8ccd8;
  --muted: #8f96a8;
  --void: #05060a;
  --surface: #0a0d14;
  --surface-2: #10141e;
  --surface-3: #151b27;
  --line: rgba(255, 255, 255, 0.09);
  --line-strong: rgba(255, 255, 255, 0.16);
  --lime: #b4ff72;
  --cyan: #59ddff;
  --violet: #9a82ff;
  --coral: #ff8f72;
  --amber: #ffc867;
  --danger: #ff6f86;
  --success: #82f6b4;
  --radius-xs: 10px;
  --radius-sm: 15px;
  --radius-md: 22px;
  --radius-lg: 32px;
  --shadow: 0 28px 90px rgba(0, 0, 0, 0.42);
  --max: 1240px;
  --header: 76px;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scrollbar-color: #323846 var(--void); }

body {
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  background:
    radial-gradient(circle at 14% -12%, rgba(154, 130, 255, 0.16), transparent 29rem),
    radial-gradient(circle at 94% 4%, rgba(89, 221, 255, 0.11), transparent 31rem),
    linear-gradient(180deg, #07090f 0%, var(--void) 58%, #07090d 100%);
  font-family: Vazirmatn, IRANSansX, Tahoma, Arial, sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

body::before {
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  content: '';
  opacity: 0.22;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(to bottom, black, transparent 74%);
}

::selection { color: #071008; background: var(--lime); }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { color: inherit; font: inherit; }
button { cursor: pointer; }
img, svg { max-width: 100%; }
p { color: var(--ink-soft); line-height: 1.95; }
h1, h2, h3, h4 { margin-top: 0; text-wrap: balance; }

.skip-link {
  position: fixed;
  z-index: 999;
  top: 10px;
  right: 10px;
  padding: 10px 14px;
  border-radius: 10px;
  color: #081008;
  background: var(--lime);
  transform: translateY(-150%);
}
.skip-link:focus { transform: none; }

:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }

.container { width: min(calc(100% - 40px), var(--max)); margin-inline: auto; }
.page-shell { min-height: calc(100vh - var(--header)); padding: 42px 0 90px; }
.section { padding: 96px 0; }
.section--tight { padding: 54px 0; }
.stack { display: grid; gap: 16px; }
.cluster { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.muted { color: var(--muted); }
.ltr { direction: ltr; unicode-bidi: isolate; }
.text-preserve { white-space: pre-line; }
.filter-toggle { display: none; }
details { margin-top: 18px; }
summary { width: fit-content; color: var(--cyan); cursor: pointer; font-size: 11px; font-weight: 800; }
details[open] summary { margin-bottom: 12px; }

.site-header {
  position: sticky;
  z-index: 80;
  top: 0;
  border-bottom: 1px solid var(--line);
  background: rgba(6, 8, 13, 0.77);
  backdrop-filter: blur(22px) saturate(130%);
}

.nav-shell { display: flex; align-items: center; min-height: var(--header); gap: 30px; }
.brand { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 11px; }
.brand-symbol {
  position: relative;
  display: grid;
  width: 43px;
  height: 43px;
  overflow: hidden;
  border: 1px solid rgba(180,255,114,.32);
  border-radius: 14px;
  background: linear-gradient(145deg, #161c28, #090b11);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 10px 30px rgba(89,221,255,.1);
  place-items: center;
}
.brand-symbol::before { width: 19px; height: 12px; border: 4px solid var(--lime); border-left: 0; border-radius: 2px 8px 8px 2px; content: ''; transform: translateX(-1px); }
.brand-symbol::after { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 14px var(--cyan); content: ''; transform: translate(11px,-10px); }
.brand-copy { display: grid; gap: 1px; line-height: 1; }
.brand-copy strong { font-size: 15px; letter-spacing: -.2px; }
.brand-copy small { color: var(--muted); font-size: 9px; letter-spacing: .4px; }
.desktop-nav { display: flex; align-items: center; gap: 4px; }
.desktop-nav a { padding: 10px 12px; border-radius: 10px; color: var(--ink-soft); font-size: 12px; transition: color .2s, background .2s; }
.desktop-nav a:hover, .desktop-nav a[aria-current="page"] { color: var(--ink); background: rgba(255,255,255,.055); }
.nav-actions { display: flex; align-items: center; margin-right: auto; gap: 8px; }

.btn {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  border: 1px solid var(--line-strong);
  border-radius: 13px;
  gap: 8px;
  color: var(--ink);
  background: rgba(255,255,255,.035);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  font-size: 12px;
  font-weight: 700;
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.btn:hover { border-color: rgba(255,255,255,.27); background: rgba(255,255,255,.075); transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(.98); }
.btn:disabled { cursor: not-allowed; opacity: .45; transform: none; }
.btn--primary { border-color: transparent; color: #071009; background: linear-gradient(135deg, #cbff96, var(--lime) 48%, #80ed9f); box-shadow: 0 12px 32px rgba(180,255,114,.17); }
.btn--primary:hover { border-color: transparent; background: linear-gradient(135deg, #dbffb8, #b9ff7c); box-shadow: 0 16px 38px rgba(180,255,114,.24); }
.btn--violet { border-color: rgba(154,130,255,.25); background: rgba(154,130,255,.11); }
.btn--danger { border-color: rgba(255,111,134,.28); color: #ffd6dc; background: rgba(255,111,134,.08); }
.btn--compact { min-height: 36px; padding: 7px 11px; border-radius: 10px; font-size: 10px; }
.btn--icon { width: 44px; padding: 0; }

.eyebrow, .chip, .source-chip, .status-chip {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  gap: 7px;
  color: var(--ink-soft);
  background: rgba(255,255,255,.035);
  font-size: 10px;
  line-height: 1;
}
.eyebrow { border-color: rgba(180,255,114,.2); color: var(--lime); background: rgba(180,255,114,.055); letter-spacing: .25px; }
.eyebrow::before { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px currentColor; content: ''; }
.source-chip[data-source="pubmed"] { color: #7fe6ff; }
.source-chip[data-source="openalex"] { color: #c0afff; }
.source-chip[data-source="doaj"] { color: #c6ff99; }
.status-chip--open { color: var(--success); }
.status-chip--paid { color: var(--amber); }
.status-chip--danger { color: var(--danger); }

.surface {
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045);
}
.surface--raised { box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.06); }

.hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr); align-items: center; min-height: 720px; padding: 70px 0 88px; gap: 50px; }
.hero-copy { position: relative; z-index: 2; }
.hero h1 { max-width: 760px; margin: 20px 0 22px; font-size: clamp(48px, 6.4vw, 86px); line-height: 1.13; letter-spacing: -4.8px; }
.hero h1 em { color: transparent; background: linear-gradient(112deg, var(--lime) 8%, #d9ffbc 38%, var(--cyan) 72%, var(--violet)); background-clip: text; -webkit-background-clip: text; font-style: normal; }
.hero-lead { max-width: 660px; margin: 0; color: #b8bdca; font-size: 17px; line-height: 2; }

.search-command { position: relative; display: flex; max-width: 720px; padding: 7px; margin-top: 30px; border: 1px solid rgba(255,255,255,.14); border-radius: 20px; background: rgba(12,15,23,.84); box-shadow: 0 22px 70px rgba(0,0,0,.32), 0 0 0 6px rgba(255,255,255,.018); backdrop-filter: blur(16px); }
.search-command:focus-within { border-color: rgba(180,255,114,.45); box-shadow: 0 24px 70px rgba(0,0,0,.4), 0 0 0 5px rgba(180,255,114,.05); }
.search-command input { min-width: 0; flex: 1; padding: 13px 16px; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 14px; }
.search-command input::placeholder { color: #6f7585; }
.search-command .btn { min-width: 116px; }
.source-strip { display: flex; flex-wrap: wrap; margin-top: 18px; gap: 8px; color: var(--muted); font-size: 10px; }
.source-dot { display: inline-flex; align-items: center; gap: 5px; }
.source-dot::before { width: 5px; height: 5px; border-radius: 50%; background: var(--violet); content: ''; }
.source-dot:nth-of-type(2)::before { background: var(--cyan); }
.source-dot:nth-of-type(3)::before { background: var(--lime); }

.orbit-scene { position: relative; min-height: 570px; perspective: 1100px; transform-style: preserve-3d; }
.orbit-core { position: absolute; top: 50%; left: 50%; width: 170px; height: 170px; border: 1px solid rgba(180,255,114,.22); border-radius: 50%; background: radial-gradient(circle at 38% 32%, rgba(255,255,255,.15), transparent 18%), radial-gradient(circle, rgba(180,255,114,.22), rgba(89,221,255,.06) 42%, rgba(9,12,18,.86) 70%); box-shadow: inset -24px -24px 60px rgba(0,0,0,.5), 0 0 80px rgba(180,255,114,.12); transform: translate(-50%,-50%) translateZ(50px); }
.orbit-core::before, .orbit-core::after { position: absolute; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; content: ''; }
.orbit-core::before { inset: 22px; }
.orbit-core::after { inset: 52px; border-color: var(--lime); box-shadow: 0 0 20px rgba(180,255,114,.3); }
.orbit-ring { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; transform-style: preserve-3d; }
.orbit-ring--one { width: 360px; height: 360px; animation: orbit-a 18s linear infinite; transform: translate(-50%,-50%) rotateX(68deg) rotateZ(10deg); }
.orbit-ring--two { width: 470px; height: 470px; border-color: rgba(154,130,255,.16); animation: orbit-b 26s linear infinite; transform: translate(-50%,-50%) rotateX(56deg) rotateY(12deg) rotateZ(-28deg); }
.orbit-ring--three { width: 290px; height: 290px; border-color: rgba(89,221,255,.2); animation: orbit-c 14s linear infinite; transform: translate(-50%,-50%) rotateX(74deg) rotateY(-12deg); }
.orbit-node { position: absolute; z-index: 3; width: 190px; padding: 15px; border: 1px solid var(--line-strong); border-radius: 17px; background: rgba(13,17,26,.78); box-shadow: 0 22px 60px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter: blur(14px); transform-style: preserve-3d; transition: transform .2s ease; }
.orbit-node strong { display: block; margin: 7px 0 4px; font-size: 13px; }
.orbit-node small { color: var(--muted); font-size: 9px; line-height: 1.7; }
.orbit-node--a { top: 10%; right: 1%; transform: translateZ(70px) rotateY(-8deg); }
.orbit-node--b { bottom: 9%; left: 0; transform: translateZ(100px) rotateY(9deg); }
.orbit-node--c { right: 5%; bottom: 12%; width: 150px; transform: translateZ(20px) rotateY(-6deg); }
.node-meter { height: 4px; overflow: hidden; margin-top: 11px; border-radius: 4px; background: rgba(255,255,255,.08); }
.node-meter::after { display: block; width: 74%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--violet), var(--cyan), var(--lime)); content: ''; }
.scene-glow { position: absolute; top: 50%; left: 50%; width: 470px; height: 470px; border-radius: 50%; background: radial-gradient(circle, rgba(154,130,255,.13), transparent 63%); filter: blur(16px); transform: translate(-50%,-50%); }

.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 30px; gap: 24px; }
.section-heading > div { max-width: 700px; }
.section-heading h2 { margin: 11px 0 8px; font-size: clamp(30px, 4vw, 48px); letter-spacing: -2px; }
.section-heading p { margin: 0; color: var(--muted); }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.feature-card { position: relative; min-height: 250px; overflow: hidden; padding: 25px; transition: transform .25s ease, border-color .25s; }
.feature-card:hover { border-color: rgba(255,255,255,.19); transform: translateY(-5px); }
.feature-card::after { position: absolute; right: -35px; bottom: -55px; width: 160px; height: 160px; border: 1px solid rgba(154,130,255,.18); border-radius: 50%; content: ''; }
.feature-card:nth-child(2)::after { border-color: rgba(89,221,255,.22); }
.feature-card:nth-child(3)::after { border-color: rgba(180,255,114,.22); }
.feature-index { color: var(--violet); font-size: 11px; font-weight: 900; letter-spacing: 2px; }
.feature-card:nth-child(2) .feature-index { color: var(--cyan); }
.feature-card:nth-child(3) .feature-index { color: var(--lime); }
.feature-card h3 { max-width: 280px; margin: 44px 0 10px; font-size: 21px; }
.feature-card p { max-width: 330px; margin: 0; color: var(--muted); font-size: 12px; }

.live-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 16px; }
.feed-panel, .myth-promo { padding: 26px; }
.feed-item { display: grid; padding: 18px 0; border-bottom: 1px solid var(--line); gap: 7px; }
.feed-item:last-child { border: 0; }
.feed-item h3 { margin: 0; font-size: 14px; line-height: 1.8; }
.feed-meta, .article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; color: var(--muted); font-size: 10px; }
.myth-promo { position: relative; overflow: hidden; background: radial-gradient(circle at 100% 0, rgba(154,130,255,.17), transparent 45%), linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)); }
.myth-promo h3 { max-width: 420px; margin: 18px 0 11px; font-size: 30px; }
.myth-answer { display: inline-flex; margin-top: 22px; padding: 12px 14px; border: 1px solid rgba(180,255,114,.2); border-radius: 13px; color: var(--lime); background: rgba(180,255,114,.06); font-weight: 800; }

.page-head { display: flex; align-items: end; justify-content: space-between; margin-bottom: 28px; gap: 24px; }
.page-head h1 { margin: 10px 0 8px; font-size: clamp(36px, 5vw, 62px); letter-spacing: -3px; }
.page-head p { max-width: 730px; margin: 0; color: var(--muted); }

.discover-toolbar { position: sticky; z-index: 45; top: calc(var(--header) + 10px); display: flex; padding: 8px; margin-bottom: 18px; border: 1px solid var(--line); border-radius: 18px; gap: 8px; background: rgba(8,10,16,.9); box-shadow: 0 16px 48px rgba(0,0,0,.25); backdrop-filter: blur(18px); }
.discover-toolbar input { min-width: 0; flex: 1; padding: 11px 13px; border: 0; outline: 0; background: transparent; }
.discover-layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); align-items: start; gap: 18px; }
.filter-panel { position: sticky; top: calc(var(--header) + 92px); max-height: calc(100vh - var(--header) - 112px); overflow: auto; padding: 18px; }
.filter-panel h2 { margin-bottom: 18px; font-size: 16px; }
.filter-group { padding: 15px 0; border-top: 1px solid var(--line); }
.filter-group:first-of-type { padding-top: 0; border-top: 0; }
.filter-label { display: block; margin-bottom: 10px; color: var(--ink-soft); font-size: 10px; font-weight: 800; }
.check-list { display: grid; gap: 8px; }
.check-row { display: flex; min-height: 38px; align-items: center; padding: 6px 8px; border-radius: 9px; gap: 9px; color: var(--muted); cursor: pointer; font-size: 10px; }
.check-row:hover { color: var(--ink); background: rgba(255,255,255,.035); }
.check-row input { width: 16px; height: 16px; accent-color: var(--lime); }
.range-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.field { display: grid; gap: 7px; }
.field label { color: var(--ink-soft); font-size: 10px; font-weight: 700; }
.input, .select, .textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  outline: 0;
  color: var(--ink);
  background: rgba(255,255,255,.035);
  font-size: 11px;
  transition: border-color .2s, background .2s;
}
.textarea { min-height: 130px; resize: vertical; line-height: 1.8; }
.input:focus, .select:focus, .textarea:focus { border-color: rgba(180,255,114,.45); background: rgba(255,255,255,.055); }
.select option { color: var(--ink); background: var(--surface-2); }
.results-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; gap: 12px; }
.results-head h2 { margin: 0; font-size: 17px; }
.results-count { color: var(--muted); font-size: 10px; }
.source-health { display: flex; flex-wrap: wrap; margin-bottom: 12px; gap: 7px; }
.health-item { display: inline-flex; align-items: center; padding: 6px 9px; border: 1px solid var(--line); border-radius: 999px; gap: 6px; color: var(--muted); background: rgba(255,255,255,.025); font-size: 9px; }
.health-item::before { width: 6px; height: 6px; border-radius: 50%; background: var(--success); content: ''; }
.health-item.is-error::before { background: var(--danger); }

.article-card { position: relative; display: grid; padding: 22px; overflow: hidden; gap: 12px; transition: border-color .22s ease, transform .22s ease, background .22s ease; }
.article-card + .article-card { margin-top: 12px; }
.article-card:hover { border-color: rgba(255,255,255,.18); background: linear-gradient(145deg, rgba(255,255,255,.072), rgba(255,255,255,.022)); transform: translateY(-2px); }
.article-card::before { position: absolute; top: 0; right: 0; width: 4px; height: 100%; background: linear-gradient(var(--violet), var(--cyan)); content: ''; opacity: .7; }
.article-card[data-access="open"]::before { background: linear-gradient(var(--lime), var(--cyan)); }
.article-card[data-retracted="true"] { border-color: rgba(255,111,134,.28); }
.article-top { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.article-card h3 { max-width: 880px; margin: 0; font-size: 18px; line-height: 1.75; letter-spacing: -.3px; }
.article-card h3 a:hover { color: var(--lime); }
.article-abstract { display: -webkit-box; margin: 0; overflow: hidden; color: #aeb4c2; font-size: 12px; line-height: 2; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.article-actions { display: flex; flex-wrap: wrap; align-items: center; padding-top: 4px; gap: 7px; }
.citation-count { margin-right: auto; color: var(--muted); font-size: 9px; }
.external-note { padding: 10px 12px; border-radius: 10px; color: #aaa0d0; background: rgba(154,130,255,.06); font-size: 9px; }

.skeleton { position: relative; height: 190px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-md); background: rgba(255,255,255,.025); }
.skeleton + .skeleton { margin-top: 12px; }
.skeleton::after { position: absolute; inset: 0; background: linear-gradient(100deg, transparent 20%, rgba(255,255,255,.06) 45%, transparent 70%); content: ''; animation: shimmer 1.4s infinite; transform: translateX(-100%); }
.empty-state { display: grid; min-height: 260px; padding: 36px; place-items: center; text-align: center; }
.empty-state strong { display: block; margin-bottom: 8px; font-size: 18px; }
.empty-state p { max-width: 430px; margin: 0; color: var(--muted); font-size: 11px; }

.article-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; align-items: start; gap: 18px; }
.article-main { padding: clamp(22px, 4vw, 46px); }
.article-main h1 { margin: 18px 0; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(31px, 4.2vw, 54px); line-height: 1.45; letter-spacing: -1px; }
.article-main h2 { margin: 38px 0 13px; font-size: 21px; }
.article-main p, .prose { color: #bdc2cf; font-size: 13px; line-height: 2.2; }
.article-aside { position: sticky; top: calc(var(--header) + 18px); display: grid; gap: 12px; }
.aside-card { padding: 18px; }
.aside-card h2 { margin-bottom: 14px; font-size: 14px; }
.fact-list { display: grid; margin: 0; gap: 12px; }
.fact-row { display: grid; padding-bottom: 10px; border-bottom: 1px solid var(--line); gap: 4px; }
.fact-row:last-child { padding: 0; border: 0; }
.fact-row dt { color: var(--muted); font-size: 9px; }
.fact-row dd { margin: 0; overflow-wrap: anywhere; color: var(--ink-soft); font-size: 10px; line-height: 1.7; }
.fulltext-box { padding: 18px; border: 1px solid rgba(180,255,114,.15); border-radius: 16px; background: rgba(180,255,114,.035); }
.fulltext-box[data-mode="purchase"] { border-color: rgba(255,200,103,.2); background: rgba(255,200,103,.035); }
.fulltext-copy { max-height: 70vh; overflow: auto; padding: 20px; border-radius: 16px; background: rgba(0,0,0,.22); white-space: pre-wrap; }

.audio-dock { display: grid; grid-template-columns: auto 1fr auto; align-items: center; padding: 12px; margin: 22px 0; border: 1px solid rgba(89,221,255,.18); border-radius: 16px; gap: 12px; background: rgba(89,221,255,.045); }
.audio-copy { min-width: 0; }
.audio-copy strong, .audio-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.audio-copy strong { font-size: 11px; }
.audio-copy small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.audio-wave { display: flex; height: 24px; align-items: center; gap: 2px; }
.audio-wave i { width: 2px; height: 30%; border-radius: 3px; background: var(--cyan); animation: wave .8s ease-in-out infinite alternate; animation-play-state: paused; }
.audio-dock.is-playing .audio-wave i { animation-play-state: running; }
.audio-wave i:nth-child(2n) { height: 70%; animation-delay: -.2s; }
.audio-wave i:nth-child(3n) { height: 45%; animation-delay: -.45s; }

.summary-shell { display: grid; gap: 17px; }
.summary-hero { padding: 28px; background: radial-gradient(circle at 0 0, rgba(154,130,255,.12), transparent 38%), linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.018)); }
.summary-hero h1 { margin: 15px 0; font-size: clamp(28px, 4vw, 46px); line-height: 1.6; }
.summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.summary-block { padding: 23px; }
.summary-block--wide { grid-column: 1 / -1; }
.summary-block h2 { margin-bottom: 15px; font-size: 17px; }
.summary-block p, .summary-block li { color: #bac0cc; font-size: 12px; line-height: 2.1; }
.summary-block li + li { margin-top: 7px; }
.keyword-cloud { display: flex; flex-wrap: wrap; gap: 7px; }

.auth-layout { display: grid; min-height: calc(100vh - var(--header)); grid-template-columns: 1fr minmax(380px, .72fr); align-items: center; gap: 70px; }
.auth-story h1 { margin: 20px 0; font-size: clamp(44px, 6vw, 76px); letter-spacing: -4px; }
.auth-card { padding: 28px; }
.tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; margin-bottom: 20px; border-radius: 12px; background: rgba(255,255,255,.045); }
.tabs button { min-height: 40px; border: 0; border-radius: 9px; color: var(--muted); background: transparent; }
.tabs button.is-active { color: var(--ink); background: rgba(255,255,255,.08); }
.form-grid { display: grid; gap: 13px; }
.form-note { margin: 0; color: var(--muted); font-size: 9px; }

.guideline-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.guideline-card { display: grid; min-height: 310px; padding: 23px; grid-template-rows: auto auto 1fr auto; gap: 12px; }
.guideline-card h2 { margin: 0; font-size: 20px; line-height: 1.7; }
.guideline-card p { margin: 0; color: var(--muted); font-size: 11px; }
.guideline-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.lesson-card { padding: clamp(22px, 4vw, 40px); }
.lesson-number { display: inline-grid; width: 52px; height: 52px; border: 1px solid rgba(180,255,114,.24); border-radius: 16px; color: var(--lime); background: rgba(180,255,114,.05); font-size: 17px; font-weight: 900; place-items: center; }
.lesson-card h2 { margin: 18px 0 10px; font-size: 28px; }
.lesson-callout { padding: 16px; margin-top: 17px; border-right: 3px solid var(--cyan); border-radius: 10px; background: rgba(89,221,255,.045); }
.lesson-callout--danger { border-color: var(--coral); background: rgba(255,143,114,.045); }
.progress-track { height: 7px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.075); }
.progress-track > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--violet), var(--cyan), var(--lime)); }

.claim-stage { display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: center; min-height: 560px; gap: 50px; }
.claim-stage h1 { margin: 18px 0; font-size: clamp(52px, 8vw, 104px); line-height: 1.02; letter-spacing: -6px; }
.claim-form { display: flex; padding: 7px; border: 1px solid var(--line-strong); border-radius: 18px; background: rgba(255,255,255,.035); }
.claim-form input { min-width: 0; flex: 1; padding: 12px; border: 0; outline: 0; background: transparent; }
.claim-result { min-height: 350px; padding: 28px; background: radial-gradient(circle at 100% 0, rgba(180,255,114,.12), transparent 45%), rgba(255,255,255,.03); }
.verdict-word { margin: 35px 0 16px; color: var(--lime); font-size: 50px; font-weight: 950; letter-spacing: -3px; }
.verdict-word[data-verdict="supported"] { color: var(--cyan); }
.verdict-word[data-verdict="mixed"] { color: var(--amber); }
.verdict-word[data-verdict="unknown"] { color: var(--muted); }
.reference-list { display: grid; padding: 0; list-style: none; gap: 8px; }
.reference-list a { display: block; padding: 11px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink-soft); font-size: 10px; }
.reference-list a:hover { border-color: rgba(89,221,255,.3); color: var(--cyan); }

.modal-backdrop { position: fixed; z-index: 120; display: grid; inset: 0; padding: 20px; background: rgba(1,2,5,.76); backdrop-filter: blur(12px); place-items: center; }
.modal { width: min(560px, 100%); max-height: calc(100vh - 40px); overflow: auto; padding: 25px; border: 1px solid var(--line-strong); border-radius: 24px; background: #10141e; box-shadow: var(--shadow); }
.modal-head { display: flex; align-items: start; justify-content: space-between; margin-bottom: 20px; gap: 16px; }
.modal-head h2 { margin: 0; font-size: 20px; }
.toast-stack { position: fixed; z-index: 160; bottom: 22px; left: 22px; display: grid; width: min(360px, calc(100% - 32px)); gap: 8px; }
.toast { padding: 13px 15px; border: 1px solid var(--line-strong); border-radius: 13px; color: var(--ink-soft); background: rgba(17,21,31,.94); box-shadow: 0 18px 50px rgba(0,0,0,.35); font-size: 11px; animation: toast-in .25s ease both; }
.toast.is-error { border-color: rgba(255,111,134,.32); }

.site-footer { padding: 40px 0 96px; border-top: 1px solid var(--line); }
.footer-grid { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 24px; }
.footer-copy { color: var(--muted); font-size: 10px; line-height: 1.9; }
.footer-nav { display: flex; flex-wrap: wrap; gap: 14px; color: var(--muted); font-size: 10px; }
.footer-nav a:hover { color: var(--ink); }
.mobile-nav { display: none; }

@keyframes orbit-a { to { transform: translate(-50%,-50%) rotateX(68deg) rotateZ(370deg); } }
@keyframes orbit-b { to { transform: translate(-50%,-50%) rotateX(56deg) rotateY(12deg) rotateZ(-388deg); } }
@keyframes orbit-c { to { transform: translate(-50%,-50%) rotateX(74deg) rotateY(-12deg) rotateZ(360deg); } }
@keyframes shimmer { to { transform: translateX(100%); } }
@keyframes wave { to { height: 95%; } }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }

@media (max-width: 1040px) {
  .hero { grid-template-columns: 1fr; padding-top: 80px; }
  .hero-copy { max-width: 820px; }
  .orbit-scene { min-height: 520px; }
  .feature-grid, .guideline-grid { grid-template-columns: repeat(2, 1fr); }
  .article-layout { grid-template-columns: minmax(0, 1fr) 270px; }
}

@media (max-width: 820px) {
  :root { --header: 68px; }
  .container { width: min(calc(100% - 28px), var(--max)); }
  .desktop-nav, .nav-actions .btn:not(.btn--primary), .brand-copy small { display: none; }
  .nav-actions .btn--primary { min-height: 38px; padding: 8px 11px; }
  .hero { min-height: auto; padding: 58px 0 35px; gap: 5px; }
  .hero h1 { font-size: clamp(43px, 11vw, 70px); letter-spacing: -3.5px; }
  .orbit-scene { min-height: 440px; transform: scale(.88); }
  .section { padding: 70px 0; }
  .live-grid, .article-layout, .claim-stage, .auth-layout { grid-template-columns: 1fr; }
  .article-aside { position: static; grid-template-columns: 1fr 1fr; }
  .discover-layout { grid-template-columns: 1fr; }
  .filter-panel { position: fixed; z-index: 110; top: 0; right: 0; width: min(340px, 88vw); max-height: 100vh; min-height: 100vh; border-radius: 0; background: #10141e; transform: translateX(110%); transition: transform .25s ease; }
  .filter-panel.is-open { transform: none; box-shadow: -20px 0 70px rgba(0,0,0,.45); }
  .filter-toggle { display: inline-flex !important; }
  .claim-stage { padding-top: 35px; }
  .claim-stage h1 { font-size: 66px; letter-spacing: -4px; }
  .summary-grid { grid-template-columns: 1fr; }
  .summary-block--wide { grid-column: auto; }
}

@media (max-width: 590px) {
  body { padding-bottom: 70px; }
  .container { width: min(calc(100% - 20px), var(--max)); }
  .brand-symbol { width: 39px; height: 39px; }
  .brand-copy strong { font-size: 13px; }
  .nav-shell { gap: 12px; }
  .hero { padding-top: 44px; }
  .hero h1 { margin-top: 16px; font-size: 43px; line-height: 1.2; letter-spacing: -2.8px; }
  .hero-lead { font-size: 13px; }
  .search-command { display: grid; margin-top: 22px; }
  .search-command input { min-height: 50px; }
  .search-command .btn { width: 100%; }
  .orbit-scene { min-height: 390px; margin-inline: -36px; transform: scale(.78); }
  .orbit-node--a { right: 4%; }
  .orbit-node--b { left: 5%; }
  .section { padding: 58px 0; }
  .section-heading, .page-head { align-items: start; flex-direction: column; }
  .section-heading h2 { font-size: 32px; }
  .feature-grid, .guideline-grid, .article-aside { grid-template-columns: 1fr; }
  .feature-card { min-height: 220px; }
  .feature-card h3 { margin-top: 32px; }
  .feed-panel, .myth-promo { padding: 19px; }
  .discover-toolbar { top: calc(var(--header) + 6px); }
  .discover-toolbar .btn span { display: none; }
  .article-card { padding: 18px 16px; }
  .article-card h3 { font-size: 15px; }
  .article-abstract { font-size: 11px; -webkit-line-clamp: 4; }
  .article-main { padding: 20px 16px; }
  .article-main h1 { font-size: 29px; }
  .audio-dock { grid-template-columns: auto 1fr; }
  .audio-wave { display: none; }
  .claim-stage h1 { font-size: 50px; }
  .claim-form { display: grid; }
  .claim-result { min-height: 300px; padding: 20px; }
  .verdict-word { font-size: 42px; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-nav { display: none; }
  .site-footer { padding-bottom: 30px; }
  .mobile-nav { position: fixed; z-index: 75; bottom: max(8px, env(safe-area-inset-bottom)); left: 10px; right: 10px; display: grid; grid-template-columns: repeat(4, 1fr); min-height: 58px; padding: 5px; border: 1px solid var(--line-strong); border-radius: 18px; background: rgba(12,15,23,.91); box-shadow: 0 18px 50px rgba(0,0,0,.45); backdrop-filter: blur(18px); }
  .mobile-nav a { display: grid; min-width: 0; border-radius: 13px; color: var(--muted); font-size: 8px; place-items: center; }
  .mobile-nav a::before { width: 7px; height: 7px; border: 1px solid currentColor; border-radius: 50%; content: ''; }
  .mobile-nav a:hover, .mobile-nav a.is-active { color: var(--lime); background: rgba(180,255,114,.055); }
  .toast-stack { right: 16px; bottom: 84px; left: 16px; width: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* --------------------------------------------------------------------------
   Cinema home / v3
   The home page uses a real, locally hosted video loop. All supporting motion
   is CSS/transform based and progressively disabled for reduced motion/data.
   -------------------------------------------------------------------------- */

.home-app {
  --home-cyan: #66e4ff;
  --home-violet: #9d8cff;
  --home-lime: #b9ff7a;
  --home-panel: rgba(8, 12, 21, .72);
  position: relative;
  overflow: clip;
  background: #03050a;
}

.home-main { overflow: clip; }

.home-app > .site-header {
  position: absolute;
  width: 100%;
  border-bottom-color: rgba(255, 255, 255, .065);
  background: linear-gradient(180deg, rgba(2, 4, 9, .78), rgba(2, 4, 9, .24));
  backdrop-filter: blur(12px) saturate(120%);
}

.home-app > .site-header::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  width: 34%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(102, 228, 255, .45), transparent);
  content: '';
}

.home-app .nav-shell { min-height: 82px; }
.home-app .brand-symbol { background: rgba(7, 11, 18, .52); backdrop-filter: blur(14px); }
.home-app .desktop-nav a { color: rgba(235, 240, 250, .7); }

.cinema-hero {
  position: relative;
  min-height: max(720px, 100svh);
  overflow: hidden;
  isolation: isolate;
  background: #03050a;
}

.cinema-media,
.cinema-video,
.cinema-shade,
.cinema-grain,
.cinema-particles { position: absolute; inset: 0; }

.cinema-media { z-index: -2; overflow: hidden; }

.cinema-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  opacity: .8;
  filter: saturate(.91) contrast(1.08) brightness(.76);
  transform: scale(1.015);
}

.cinema-shade {
  background:
    linear-gradient(90deg, rgba(2, 4, 9, .28) 0%, rgba(2, 4, 9, .03) 42%, rgba(2, 4, 9, .58) 74%, rgba(2, 4, 9, .94) 100%),
    linear-gradient(180deg, rgba(3, 5, 10, .17) 0%, transparent 44%, rgba(3, 5, 10, .86) 100%),
    radial-gradient(circle at 31% 48%, transparent 0 18%, rgba(3, 5, 10, .08) 48%, rgba(3, 5, 10, .42) 100%);
}

.cinema-grain {
  opacity: .13;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.45) 0 .55px, transparent .7px),
    radial-gradient(circle at 75% 40%, rgba(255,255,255,.3) 0 .45px, transparent .65px);
  background-position: 0 0, 7px 11px;
  background-size: 13px 13px, 17px 17px;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.cinema-particles { pointer-events: none; }
.cinema-particles i {
  position: absolute;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--home-cyan);
  box-shadow: 0 0 17px 4px rgba(102, 228, 255, .42);
  opacity: 0;
  animation: particle-rise 8s ease-in-out infinite;
}
.cinema-particles i:nth-child(1) { right: 17%; bottom: 13%; animation-delay: -1s; }
.cinema-particles i:nth-child(2) { right: 38%; bottom: 6%; background: var(--home-lime); animation-delay: -5s; }
.cinema-particles i:nth-child(3) { right: 54%; bottom: 16%; animation-delay: -3s; }
.cinema-particles i:nth-child(4) { right: 67%; bottom: 10%; background: var(--home-violet); animation-delay: -6.4s; }
.cinema-particles i:nth-child(5) { right: 80%; bottom: 18%; animation-delay: -2.2s; }
.cinema-particles i:nth-child(6) { right: 27%; bottom: 32%; background: var(--home-lime); animation-delay: -7s; }
.cinema-particles i:nth-child(7) { right: 48%; bottom: 40%; background: var(--home-violet); animation-delay: -4.2s; }
.cinema-particles i:nth-child(8) { right: 73%; bottom: 36%; animation-delay: -.2s; }

.cinema-layout {
  position: relative;
  display: grid;
  min-height: max(720px, 100svh);
  padding-top: 122px;
  padding-bottom: 104px;
  grid-template-columns: minmax(0, 1fr) minmax(300px, .56fr);
  align-items: center;
  gap: clamp(42px, 8vw, 126px);
}

.cinema-copy {
  position: relative;
  z-index: 2;
  max-width: 680px;
  padding-block: 48px;
}

.signal-label {
  display: flex;
  width: fit-content;
  align-items: center;
  direction: ltr;
  gap: 8px;
  color: rgba(230, 238, 250, .62);
  font: 700 9px/1 Arial, sans-serif;
  letter-spacing: 1.6px;
}

.signal-label span {
  padding: 6px 8px;
  border: 1px solid rgba(185, 255, 122, .28);
  border-radius: 999px;
  color: var(--home-lime);
  background: rgba(185, 255, 122, .07);
  letter-spacing: 1px;
}

.signal-label i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--home-lime);
  box-shadow: 0 0 16px var(--home-lime);
  animation: signal-pulse 1.8s ease-out infinite;
}

.cinema-copy h1 {
  display: grid;
  margin: 25px 0 14px;
  gap: 5px;
  font-size: clamp(45px, 5.2vw, 72px);
  line-height: 1.03;
  letter-spacing: -4.4px;
}

.cinema-copy h1 span { color: rgba(250, 252, 255, .98); font-weight: 760; }
.cinema-copy h1 strong {
  width: fit-content;
  color: transparent;
  background: linear-gradient(103deg, #f4fff0 4%, var(--home-lime) 31%, var(--home-cyan) 67%, #c0b6ff 100%);
  background-clip: text;
  -webkit-background-clip: text;
  font-weight: 900;
}

.cinema-copy > p {
  margin: 0;
  color: rgba(224, 231, 243, .7);
  font-size: 13px;
  letter-spacing: -.15px;
}

.cinema-search {
  position: relative;
  display: flex;
  max-width: 650px;
  min-height: 66px;
  align-items: center;
  padding: 7px 8px 7px 17px;
  margin-top: 30px;
  border: 1px solid rgba(255, 255, 255, .17);
  border-radius: 20px;
  gap: 10px;
  background: linear-gradient(110deg, rgba(11, 16, 27, .9), rgba(8, 12, 21, .66));
  box-shadow: 0 24px 70px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .07), 0 0 0 6px rgba(255,255,255,.018);
  backdrop-filter: blur(22px) saturate(135%);
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.cinema-search:focus-within {
  border-color: rgba(102, 228, 255, .43);
  box-shadow: 0 27px 80px rgba(0, 0, 0, .44), inset 0 1px 0 rgba(255, 255, 255, .1), 0 0 0 5px rgba(102, 228, 255, .055);
  transform: translateY(-2px);
}

.search-lens {
  position: relative;
  flex: 0 0 auto;
  width: 19px;
  height: 19px;
  border: 1.5px solid rgba(234, 241, 252, .72);
  border-radius: 50%;
}
.search-lens::after {
  position: absolute;
  right: -5px;
  bottom: -3px;
  width: 7px;
  height: 1.5px;
  border-radius: 2px;
  background: rgba(234, 241, 252, .72);
  content: '';
  transform: rotate(46deg);
}

.cinema-search input {
  min-width: 0;
  flex: 1;
  padding: 0 4px;
  border: 0;
  outline: 0;
  color: #f7f9fd;
  background: transparent;
  font-size: 13px;
}
.cinema-search input::placeholder { color: rgba(207, 214, 228, .48); }

.cinema-search button {
  display: inline-flex;
  min-width: 112px;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  border: 0;
  border-radius: 14px;
  gap: 14px;
  color: #061008;
  background: linear-gradient(135deg, #d8ffb5, var(--home-lime) 46%, #6ce6b5);
  box-shadow: 0 14px 38px rgba(137, 255, 133, .18), inset 0 1px 0 rgba(255,255,255,.55);
  font-size: 11px;
  font-weight: 900;
  transition: transform .2s ease, box-shadow .2s ease;
}
.cinema-search button:hover { box-shadow: 0 17px 45px rgba(137, 255, 133, .27); transform: translateY(-2px); }
.cinema-search button i { font-size: 17px; font-style: normal; }

.query-sparks {
  display: flex;
  max-width: 650px;
  flex-wrap: wrap;
  margin-top: 12px;
  gap: 7px;
}
.query-sparks button {
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid rgba(255, 255, 255, .085);
  border-radius: 999px;
  color: rgba(218, 225, 237, .59);
  background: rgba(6, 9, 15, .38);
  backdrop-filter: blur(10px);
  font-size: 9px;
  transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.query-sparks button:hover { border-color: rgba(102, 228, 255, .25); color: #fff; background: rgba(102, 228, 255, .06); }

.evidence-console {
  position: relative;
  z-index: 2;
  width: min(100%, 354px);
  justify-self: end;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 22px;
  direction: ltr;
  background: linear-gradient(145deg, rgba(13, 19, 31, .74), rgba(4, 7, 13, .64));
  box-shadow: 0 36px 100px rgba(0, 0, 0, .52), inset 0 1px 0 rgba(255, 255, 255, .08), -1px 0 40px rgba(96, 96, 255, .06);
  backdrop-filter: blur(22px) saturate(135%);
  transform: perspective(1000px) rotateY(4deg) rotateX(-1deg);
  animation: console-float 7s ease-in-out infinite;
}

.evidence-console > header,
.frame-bar {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  padding: 0 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  color: rgba(225,232,243,.52);
  font: 700 8px/1 Arial, sans-serif;
  letter-spacing: 1px;
}
.evidence-console > header b { display: flex; align-items: center; gap: 5px; color: var(--home-lime); font-size: 7px; }
.evidence-console > header b i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px currentColor; }
.console-lights, .frame-bar > div { display: flex; gap: 5px; }
.console-lights i, .frame-bar > div i { width: 6px; height: 6px; border-radius: 50%; background: #ff765f; }
.console-lights i:nth-child(2), .frame-bar > div i:nth-child(2) { background: #ffc867; }
.console-lights i:nth-child(3), .frame-bar > div i:nth-child(3) { background: var(--home-lime); }

.console-query { position: relative; padding: 24px 20px 20px; overflow: hidden; }
.console-query > span { color: rgba(102, 228, 255, .66); font: 700 7px/1 Arial, sans-serif; letter-spacing: 1.4px; }
.console-query > strong { display: block; margin-top: 11px; color: #f6f8fc; font: 700 23px/1.1 Arial, sans-serif; letter-spacing: -.7px; }
.scan-line {
  position: absolute;
  right: 20px;
  bottom: 0;
  left: 20px;
  height: 1px;
  overflow: visible;
  background: rgba(255,255,255,.07);
}
.scan-line::after {
  position: absolute;
  top: -1px;
  width: 28%;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--home-cyan), transparent);
  box-shadow: 0 0 13px var(--home-cyan);
  content: '';
  animation: console-scan 3.4s ease-in-out infinite;
}

.console-results { display: grid; padding: 8px 12px 15px; gap: 3px; }
.console-results article {
  display: grid;
  min-height: 62px;
  padding: 11px 9px;
  border: 1px solid transparent;
  border-radius: 13px;
  grid-template-columns: 7px 1fr auto;
  align-items: center;
  gap: 11px;
  transition: border-color .2s, background .2s, transform .2s;
}
.console-results article:hover { border-color: rgba(255,255,255,.08); background: rgba(255,255,255,.035); transform: translateX(2px); }
.console-results article > i { width: 6px; height: 26px; border-radius: 4px; background: var(--home-cyan); box-shadow: 0 0 15px rgba(102, 228, 255, .3); }
[data-tone="violet"] { --tone: var(--home-violet); }
[data-tone="lime"] { --tone: var(--home-lime); }
[data-tone="cyan"] { --tone: var(--home-cyan); }
.console-results article > i[data-tone] { background: var(--tone); box-shadow: 0 0 15px color-mix(in srgb, var(--tone) 40%, transparent); }
.console-results article div { display: grid; gap: 5px; }
.console-results article b { color: rgba(248,250,254,.88); font: 700 10px/1 Arial, sans-serif; }
.console-results article span { color: rgba(220,226,238,.42); font: 400 8px/1 Arial, sans-serif; }
.console-results article > strong { color: rgba(236,241,249,.6); font: 700 9px/1 Arial, sans-serif; }
.evidence-console > footer { display: flex; min-height: 42px; align-items: center; justify-content: center; border-top: 1px solid rgba(255,255,255,.07); gap: 10px; color: rgba(222,229,241,.42); direction: rtl; font-size: 8px; }
.evidence-console > footer i { width: 20px; height: 1px; background: linear-gradient(90deg, var(--home-violet), var(--home-cyan)); }

.cinema-foot {
  position: absolute;
  right: 0;
  bottom: 28px;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid rgba(255,255,255,.075);
  padding-top: 18px;
}

.source-beacons { display: flex; direction: ltr; gap: 17px; }
.source-beacons span { display: inline-flex; align-items: center; gap: 6px; color: rgba(225,231,241,.48); font: 700 8px/1 Arial, sans-serif; }
.source-beacons i { width: 5px; height: 5px; border-radius: 50%; background: var(--tone); box-shadow: 0 0 11px var(--tone); }
.hero-controls { display: flex; align-items: center; gap: 24px; }
.motion-toggle {
  display: inline-flex;
  align-items: center;
  padding: 6px;
  border: 0;
  gap: 7px;
  color: rgba(227,233,243,.45);
  background: transparent;
  font-size: 8px;
}
.motion-toggle i {
  width: 9px;
  height: 10px;
  border: 0 solid currentColor;
  border-width: 0 3px;
}
.motion-toggle[aria-pressed="true"] i { width: 0; height: 0; border: 5px solid transparent; border-right: 0; border-left: 8px solid currentColor; }
.scroll-cue { display: inline-flex; align-items: center; gap: 8px; color: rgba(227,233,243,.45); font-size: 8px; }
.scroll-cue i { position: relative; width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; }
.scroll-cue i::before { position: absolute; top: 8px; left: 50%; width: 4px; height: 4px; border-right: 1px solid var(--home-cyan); border-bottom: 1px solid var(--home-cyan); content: ''; transform: translateX(-50%) rotate(45deg); animation: scroll-drop 1.8s ease-in-out infinite; }

.flow-section {
  position: relative;
  padding: 132px 0 150px;
  background:
    radial-gradient(circle at 15% 22%, rgba(157, 140, 255, .1), transparent 25rem),
    radial-gradient(circle at 89% 78%, rgba(102, 228, 255, .075), transparent 28rem),
    #05070c;
}
.flow-section::before { position: absolute; top: 0; right: 50%; width: 1px; height: 95px; background: linear-gradient(transparent, rgba(102,228,255,.5)); content: ''; }

.flow-heading, .now-heading, .field-shell > header { margin-bottom: 42px; }
.flow-heading > span, .now-heading > div > span, .field-shell > header > span {
  color: rgba(102, 228, 255, .7);
  font: 800 9px/1 Arial, sans-serif;
  letter-spacing: 2px;
}
.flow-heading h2, .now-heading h2, .field-shell h2 {
  margin: 12px 0 0;
  font-size: clamp(36px, 4.7vw, 62px);
  line-height: 1.12;
  letter-spacing: -3.5px;
}

.flow-experience { display: grid; grid-template-columns: 104px minmax(0, 1fr); align-items: stretch; gap: 18px; }
.story-rail { display: grid; padding: 7px; border: 1px solid rgba(255,255,255,.09); border-radius: 22px; gap: 5px; background: rgba(255,255,255,.025); }
.story-rail button {
  position: relative;
  display: grid;
  min-height: 108px;
  padding: 13px 8px;
  border: 1px solid transparent;
  border-radius: 16px;
  justify-items: center;
  align-content: center;
  gap: 8px;
  color: rgba(222,228,240,.4);
  background: transparent;
  transition: color .25s ease, border-color .25s ease, background .25s ease, transform .25s ease;
}
.story-rail button:hover { color: rgba(245,248,253,.75); }
.story-rail button.is-active { border-color: rgba(102,228,255,.16); color: #f6f8fd; background: linear-gradient(145deg, rgba(102,228,255,.075), rgba(157,140,255,.04)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); transform: translateX(-3px); }
.story-rail button::after { position: absolute; top: 50%; left: -9px; width: 2px; height: 0; border-radius: 4px; background: var(--home-cyan); box-shadow: 0 0 13px var(--home-cyan); content: ''; transition: height .25s ease, transform .25s ease; transform: translateY(-50%); }
.story-rail button.is-active::after { height: 38px; }
.story-rail button span { font-size: 10px; font-weight: 800; }
.story-rail button b { position: absolute; top: 9px; left: 10px; color: rgba(229,235,246,.24); font: 700 7px/1 Arial, sans-serif; }
.story-icon { position: relative; width: 26px; height: 26px; color: currentColor; }
.story-icon--discover { border: 1.5px solid currentColor; border-radius: 50%; }
.story-icon--discover::after { position: absolute; right: -4px; bottom: 0; width: 9px; height: 1.5px; background: currentColor; content: ''; transform: rotate(45deg); }
.story-icon--read { border: 1.5px solid currentColor; border-radius: 3px; transform: rotate(-6deg); }
.story-icon--read::before, .story-icon--read::after { position: absolute; right: 5px; left: 5px; height: 1px; background: currentColor; content: ''; }
.story-icon--read::before { top: 8px; }.story-icon--read::after { top: 14px; }
.story-icon--listen::before, .story-icon--listen::after { position: absolute; top: 50%; width: 4px; border-radius: 5px; background: currentColor; content: ''; transform: translateY(-50%); }
.story-icon--listen::before { right: 6px; height: 16px; box-shadow: 7px 4px 0 -1px currentColor, 14px -2px 0 -1px currentColor; }
.story-icon--learn { border: 1.5px solid currentColor; border-radius: 50%; }
.story-icon--learn::before { position: absolute; inset: 5px; border: 1px solid currentColor; border-radius: 50%; content: ''; }
.story-icon--learn::after { position: absolute; top: 50%; left: 50%; width: 4px; height: 4px; border-radius: 50%; background: currentColor; content: ''; transform: translate(-50%,-50%); }

.product-frame {
  position: relative;
  min-width: 0;
  min-height: 590px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 28px;
  direction: ltr;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(145deg, rgba(15,21,33,.94), rgba(5,8,15,.98));
  background-size: 44px 44px, 44px 44px, auto;
  box-shadow: 0 55px 120px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.055);
}
.product-frame::before { position: absolute; top: -25%; left: 18%; width: 48%; height: 70%; border-radius: 50%; background: rgba(102,228,255,.075); filter: blur(80px); content: ''; pointer-events: none; }

.frame-bar { position: relative; z-index: 3; min-height: 54px; background: rgba(5,8,14,.55); }
.frame-bar > span { color: rgba(229,235,246,.4); }
.frame-bar > b { color: var(--home-lime); font-size: 7px; letter-spacing: 1px; }
.frame-body { position: relative; height: 470px; overflow: hidden; }

.story-scene {
  position: absolute;
  display: grid;
  inset: 0;
  padding: clamp(30px, 5vw, 66px);
  opacity: 0;
  pointer-events: none;
  transform: translateY(18px) scale(.985);
  transition: opacity .55s ease, transform .65s cubic-bezier(.2,.8,.2,1);
  place-items: center;
}
.story-scene.is-active { z-index: 2; opacity: 1; pointer-events: auto; transform: none; }

.scene-search {
  display: grid;
  width: min(760px, 86%);
  min-height: 60px;
  align-items: center;
  padding: 10px 15px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 16px;
  grid-template-columns: 18px 1fr auto;
  gap: 12px;
  background: rgba(8,12,20,.77);
  box-shadow: 0 22px 55px rgba(0,0,0,.25), 0 0 35px rgba(102,228,255,.035);
}
.scene-search > i { position: relative; width: 15px; height: 15px; border: 1px solid rgba(225,233,244,.6); border-radius: 50%; }
.scene-search > i::after { position: absolute; right: -4px; bottom: -2px; width: 6px; height: 1px; background: currentColor; content: ''; transform: rotate(45deg); }
.scene-search span { color: rgba(241,245,251,.75); font: 500 11px/1 Arial, sans-serif; }
.scene-search b { padding: 6px 8px; border: 1px solid rgba(255,255,255,.08); border-radius: 7px; color: rgba(225,232,243,.35); font: 700 7px/1 Arial, sans-serif; }
.story-scene[data-story-scene="0"] { align-content: center; }
.scene-filter-row { display: flex; width: min(760px, 86%); margin: 10px 0 15px; gap: 6px; }
.scene-filter-row span { padding: 6px 9px; border: 1px solid rgba(255,255,255,.07); border-radius: 999px; color: rgba(222,229,241,.4); background: rgba(255,255,255,.02); font: 700 7px/1 Arial, sans-serif; }
.scene-result-stack { display: grid; width: min(760px, 86%); gap: 7px; }
.scene-result-stack article { display: grid; min-height: 72px; align-items: center; padding: 11px 14px; border: 1px solid rgba(255,255,255,.075); border-radius: 13px; grid-template-columns: 75px 1fr auto; gap: 15px; background: rgba(255,255,255,.024); opacity: 0; transform: translateY(14px); }
.story-scene.is-active .scene-result-stack article { animation: result-enter .5s ease forwards; }
.story-scene.is-active .scene-result-stack article:nth-child(2) { animation-delay: .12s; }
.story-scene.is-active .scene-result-stack article:nth-child(3) { animation-delay: .24s; }
.result-source { color: var(--tone); font: 800 7px/1 Arial, sans-serif; letter-spacing: .7px; }
.scene-result-stack article div { display: grid; gap: 7px; }
.scene-result-stack article div > * { display: block; height: 4px; border-radius: 4px; background: rgba(225,232,243,.12); }
.scene-result-stack article div b { width: min(72%, 390px); height: 7px; background: rgba(235,240,248,.36); }
.scene-result-stack article div i:nth-child(2) { width: 88%; }.scene-result-stack article div i:nth-child(3) { width: 54%; }
.scene-result-stack article > strong { color: rgba(228,234,244,.36); font: 700 8px/1 Arial, sans-serif; }

.paper-visual { position: relative; width: min(760px, 87%); height: 340px; border: 1px solid rgba(255,255,255,.09); border-radius: 20px; background: rgba(255,255,255,.026); box-shadow: 0 30px 75px rgba(0,0,0,.25); }
.paper-copy { display: grid; position: absolute; top: 38px; right: 36px; bottom: 38px; left: 42%; align-content: start; gap: 14px; }
.paper-copy span { height: 5px; border-radius: 5px; background: rgba(231,237,247,.13); }
.paper-copy span:nth-child(1) { width: 74%; height: 11px; background: rgba(242,246,251,.44); }
.paper-copy span:nth-child(2) { width: 42%; margin-bottom: 13px; background: rgba(102,228,255,.35); }
.paper-copy span:nth-child(3) { width: 94%; }.paper-copy span:nth-child(4) { width: 88%; }.paper-copy span:nth-child(5) { width: 96%; }.paper-copy span:nth-child(6) { width: 61%; }
.evidence-focus { position: absolute; top: 42px; bottom: 42px; left: 35px; display: grid; width: 34%; padding: 24px; overflow: hidden; border: 1px solid rgba(185,255,122,.15); border-radius: 16px; align-content: center; gap: 10px; background: radial-gradient(circle at 20% 10%, rgba(185,255,122,.11), transparent 55%), rgba(7,12,16,.64); }
.evidence-focus > i { position: absolute; top: -25px; right: -25px; width: 120px; height: 120px; border: 1px solid rgba(185,255,122,.15); border-radius: 50%; }
.evidence-focus strong { color: var(--home-lime); font: 800 7px/1 Arial, sans-serif; letter-spacing: 1px; }
.evidence-focus span { color: #f3f7fb; font: 750 25px/1.2 Arial, sans-serif; }
.evidence-focus b { width: fit-content; padding: 6px 8px; border-radius: 999px; color: rgba(220,255,192,.7); background: rgba(185,255,122,.065); font: 700 7px/1 Arial, sans-serif; }
.paper-map { position: absolute; right: 36px; bottom: 42px; left: 42%; display: flex; height: 35px; align-items: end; gap: 8px; }
.paper-map i { flex: 1; border-radius: 3px 3px 1px 1px; background: linear-gradient(var(--home-cyan), rgba(102,228,255,.12)); animation: map-level 1.8s ease-in-out infinite alternate; }
.paper-map i:nth-child(1) { height: 35%; animation-delay: -.7s; }.paper-map i:nth-child(2) { height: 80%; animation-delay: -1.2s; }.paper-map i:nth-child(3) { height: 55%; animation-delay: -.2s; }.paper-map i:nth-child(4) { height: 100%; animation-delay: -1.6s; }

.audio-visual { display: grid; width: min(720px, 88%); justify-items: center; }
.audio-orb { position: relative; display: grid; width: 180px; height: 180px; border: 1px solid rgba(102,228,255,.2); border-radius: 50%; background: radial-gradient(circle, rgba(102,228,255,.22), rgba(157,140,255,.08) 38%, transparent 68%); box-shadow: 0 0 75px rgba(102,228,255,.08); place-items: center; }
.audio-orb::before { width: 74px; height: 74px; border: 1px solid rgba(185,255,122,.36); border-radius: 50%; box-shadow: 0 0 28px rgba(185,255,122,.12), inset 0 0 22px rgba(185,255,122,.07); content: ''; }
.audio-orb i { position: absolute; inset: -22px; border: 1px solid rgba(157,140,255,.12); border-radius: 50%; animation: audio-ring 2.8s ease-out infinite; }
.audio-orb i:nth-child(2) { animation-delay: -.9s; }.audio-orb i:nth-child(3) { animation-delay: -1.8s; }
.audio-time { display: flex; width: min(520px, 90%); align-items: center; justify-content: space-between; margin-top: 24px; color: rgba(221,228,240,.38); font: 700 8px/1 Arial, sans-serif; }
.audio-time b { color: rgba(244,247,252,.7); direction: rtl; font-family: inherit; font-size: 10px; }
.audio-bars { display: flex; width: min(520px, 90%); height: 48px; align-items: center; justify-content: center; margin-top: 12px; gap: 5px; }
.audio-bars i { width: 3px; height: 18%; border-radius: 3px; background: linear-gradient(var(--home-cyan), var(--home-violet)); animation: cinema-wave .8s ease-in-out infinite alternate; }
.audio-bars i:nth-child(2n) { height: 62%; animation-delay: -.35s; }.audio-bars i:nth-child(3n) { height: 92%; animation-delay: -.62s; }.audio-bars i:nth-child(5n) { height: 44%; animation-delay: -.12s; }
.audio-progress { width: min(520px, 90%); height: 3px; overflow: hidden; border-radius: 4px; background: rgba(255,255,255,.08); }
.audio-progress i { display: block; width: 43%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--home-violet), var(--home-cyan), var(--home-lime)); animation: audio-progress 5s linear infinite; }

.lesson-visual { display: grid; width: min(720px, 88%); grid-template-columns: 180px 1fr; align-items: center; gap: clamp(30px,6vw,80px); }
.lesson-ring { position: relative; display: grid; width: 174px; height: 174px; border: 1px solid rgba(185,255,122,.2); border-radius: 50%; background: conic-gradient(var(--home-lime) 0 72%, rgba(255,255,255,.055) 72%); box-shadow: 0 0 55px rgba(185,255,122,.07); place-content: center; }
.lesson-ring::before { position: absolute; inset: 7px; border-radius: 50%; background: #090d15; content: ''; }
.lesson-ring span, .lesson-ring small { position: relative; z-index: 1; text-align: center; }
.lesson-ring span { color: #f4f8fc; font: 800 47px/1 Arial, sans-serif; }
.lesson-ring small { margin-top: 7px; color: rgba(185,255,122,.6); font: 700 7px/1 Arial, sans-serif; letter-spacing: 1px; }
.lesson-card-mini { display: grid; min-height: 280px; padding: 30px; border: 1px solid rgba(255,255,255,.1); border-radius: 20px; align-content: center; gap: 14px; background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.015)); box-shadow: 0 30px 70px rgba(0,0,0,.25); direction: rtl; }
.lesson-card-mini > span { color: var(--home-cyan); font-size: 9px; }.lesson-card-mini > strong { color: #f6f8fc; font-size: 21px; }
.lesson-card-mini > div { display: grid; gap: 8px; }.lesson-card-mini > div i { width: 100%; height: 5px; border-radius: 5px; background: rgba(229,235,246,.13); }.lesson-card-mini > div i:nth-child(2) { width: 84%; }.lesson-card-mini > div i:nth-child(3) { width: 56%; }
.lesson-card-mini button { width: fit-content; min-height: 38px; padding: 8px 13px; border: 0; border-radius: 10px; color: #071008; background: var(--home-lime); font-size: 9px; font-weight: 900; }
.review-dots { position: absolute; bottom: 28px; left: 50%; display: flex; gap: 8px; transform: translateX(-50%); }
.review-dots span { display: grid; width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.09); border-radius: 50%; color: rgba(228,234,244,.38); font: 700 7px/1 Arial, sans-serif; place-items: center; }
.review-dots span.is-done { border-color: rgba(185,255,122,.18); color: var(--home-lime); background: rgba(185,255,122,.05); }

.frame-caption { position: relative; z-index: 3; display: grid; min-height: 66px; align-items: center; padding: 0 22px; border-top: 1px solid rgba(255,255,255,.08); grid-template-columns: auto auto 1fr; gap: 14px; background: rgba(5,8,14,.6); }
.frame-caption span { color: var(--home-cyan); font: 800 7px/1 Arial, sans-serif; letter-spacing: 1px; }
.frame-caption strong { color: rgba(243,246,252,.82); direction: rtl; font-size: 11px; }
.frame-caption i { height: 1px; background: linear-gradient(90deg, rgba(102,228,255,.38), transparent); }

.now-section { padding: 126px 0 116px; background: linear-gradient(180deg, #03050a, #060810); }
.now-heading { display: flex; align-items: end; justify-content: space-between; }
.now-heading a { display: inline-flex; align-items: center; gap: 10px; color: rgba(233,238,247,.58); font-size: 10px; }
.now-heading a i { display: grid; width: 35px; height: 35px; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; font-size: 15px; font-style: normal; place-items: center; transition: border-color .2s, transform .2s; }
.now-heading a:hover i { border-color: rgba(102,228,255,.4); transform: translateX(-4px); }

.evidence-reel { display: grid; overflow-x: auto; padding: 3px 1px 20px; grid-auto-columns: minmax(280px, 31%); grid-auto-flow: column; gap: 12px; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scrollbar-color: rgba(102,228,255,.28) transparent; scrollbar-width: thin; }
.reel-card { position: relative; display: grid; min-height: 300px; overflow: hidden; padding: 24px; border: 1px solid rgba(255,255,255,.095); border-radius: 21px; grid-template-rows: auto 1fr auto; gap: 24px; background: linear-gradient(145deg, rgba(255,255,255,.047), rgba(255,255,255,.014)); scroll-snap-align: start; transition: transform .3s ease, border-color .3s ease, background .3s ease; }
.reel-card::before { position: absolute; top: -45px; left: -45px; width: 130px; height: 130px; border: 1px solid rgba(157,140,255,.16); border-radius: 50%; content: ''; transition: transform .5s ease; }
.reel-card:nth-child(2n)::before { border-color: rgba(102,228,255,.18); }.reel-card:nth-child(3n)::before { border-color: rgba(185,255,122,.16); }
.reel-card:hover { border-color: rgba(255,255,255,.18); background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.02)); transform: translateY(-5px); }
.reel-card:hover::before { transform: scale(1.16); }
.reel-card > div, .reel-card footer { display: flex; align-items: center; justify-content: space-between; gap: 9px; }
.reel-source { color: var(--home-cyan); font: 800 8px/1 Arial, sans-serif; letter-spacing: .6px; }.reel-source[data-source="openalex"] { color: var(--home-violet); }.reel-source[data-source="doaj"] { color: var(--home-lime); }
.reel-card time, .reel-card footer span { color: rgba(221,228,240,.36); font-size: 8px; }.reel-card h3 { margin: 0; font-size: 16px; line-height: 1.9; letter-spacing: -.2px; }.reel-card h3 a:hover { color: var(--home-cyan); }
.reel-card footer { padding-top: 15px; border-top: 1px solid rgba(255,255,255,.075); }.reel-card footer span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.reel-card footer a { display: grid; flex: 0 0 30px; width: 30px; height: 30px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; color: rgba(238,242,249,.62); font-size: 13px; place-items: center; }
.reel-card--empty { align-content: center; grid-template-rows: auto; }.reel-card--empty > span { color: var(--home-cyan); font-size: 9px; }.reel-card--empty > a { color: var(--home-lime); font-size: 10px; }

.dual-experience { padding: 32px 0 132px; background: #060810; }
.experience-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 14px; }
.experience-card { position: relative; display: grid; min-height: 410px; overflow: hidden; padding: clamp(25px,4vw,44px); border: 1px solid rgba(255,255,255,.1); border-radius: 28px; align-items: end; isolation: isolate; background: #0a0e17; transition: border-color .3s ease, transform .35s ease; }
.experience-card:hover { border-color: rgba(255,255,255,.2); transform: translateY(-5px); }
.experience-card--daily { background: radial-gradient(circle at 22% 28%, rgba(185,255,122,.13), transparent 30%), radial-gradient(circle at 86% 85%, rgba(102,228,255,.09), transparent 35%), #0a0e16; }
.experience-card--myth { background: radial-gradient(circle at 68% 22%, rgba(157,140,255,.2), transparent 32%), radial-gradient(circle at 15% 90%, rgba(102,228,255,.08), transparent 33%), #0a0c16; }
.experience-copy { position: relative; z-index: 3; max-width: 390px; }.experience-copy > span { color: var(--home-cyan); font: 800 8px/1 Arial,sans-serif; letter-spacing: 1.5px; }.experience-card--daily .experience-copy > span { color: var(--home-lime); }.experience-copy h2 { margin: 11px 0 19px; font-size: clamp(29px,3.3vw,44px); line-height: 1.25; letter-spacing: -2px; }.experience-copy b { color: rgba(235,240,248,.58); font-size: 10px; }
.daily-visual { position: absolute; top: 35px; left: 8%; display: grid; width: 210px; height: 210px; border: 1px solid rgba(185,255,122,.15); border-radius: 50%; place-items: center; }.daily-visual::before { position: absolute; inset: 25px; border: 1px solid rgba(102,228,255,.14); border-radius: 50%; content: ''; }.daily-visual > span { color: rgba(247,250,253,.9); font: 800 54px/1 Arial,sans-serif; text-shadow: 0 0 30px rgba(185,255,122,.2); }.daily-orbit { position: absolute; inset: -18px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; animation: slow-spin 15s linear infinite; }.daily-orbit i { position: absolute; top: 50%; left: -4px; width: 7px; height: 7px; border-radius: 50%; background: var(--home-lime); box-shadow: 0 0 16px var(--home-lime); }.daily-orbit i:nth-child(2) { top: 7%; left: 70%; background: var(--home-cyan); }.daily-orbit i:nth-child(3) { top: 88%; left: 72%; background: var(--home-violet); }.daily-streak { position: absolute; bottom: -43px; display: flex; padding: 8px; border: 1px solid rgba(255,255,255,.08); border-radius: 999px; gap: 5px; background: rgba(7,10,16,.65); backdrop-filter: blur(10px); }.daily-streak i { width: 7px; height: 20px; border-radius: 6px; background: rgba(255,255,255,.08); }.daily-streak i:nth-child(-n+5) { background: linear-gradient(var(--home-lime), rgba(185,255,122,.25)); }
.myth-visual { position: absolute; top: 25px; left: 8%; display: grid; width: 230px; height: 230px; border: 1px solid rgba(157,140,255,.17); border-radius: 50%; place-items: center; }.myth-visual::before, .myth-visual::after { position: absolute; border: 1px solid rgba(102,228,255,.1); border-radius: 50%; content: ''; animation: myth-ring 6s ease-in-out infinite; }.myth-visual::before { inset: 28px; }.myth-visual::after { inset: 58px; animation-delay: -3s; }.myth-visual span { color: rgba(245,247,252,.9); font-size: 96px; font-weight: 200; line-height: 1; text-shadow: 0 0 42px rgba(157,140,255,.3); }.myth-visual i { position: absolute; right: 20px; bottom: 38px; width: 10px; height: 10px; border-radius: 50%; background: var(--home-lime); box-shadow: 0 0 20px var(--home-lime); }.myth-visual b { position: absolute; right: -8px; bottom: 9px; padding: 8px 12px; border: 1px solid rgba(185,255,122,.17); border-radius: 999px; color: var(--home-lime); background: rgba(7,11,17,.72); font-size: 9px; backdrop-filter: blur(10px); }

.field-section { padding: 122px 0 138px; border-top: 1px solid rgba(255,255,255,.06); background: radial-gradient(circle at 50% 110%, rgba(102,228,255,.075), transparent 34rem), #03050a; }
.field-shell { display: grid; grid-template-columns: minmax(230px,.45fr) 1fr; align-items: start; gap: clamp(50px,9vw,140px); }.field-shell > header { margin: 15px 0 0; }.field-shell h2 { font-size: clamp(40px,5vw,64px); }
.field-cloud { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }.field-cloud a { display: grid; min-height: 84px; align-items: center; padding: 16px 18px; border: 1px solid rgba(255,255,255,.08); border-radius: 16px; grid-template-columns: 8px 1fr auto; gap: 12px; color: rgba(237,241,248,.72); background: rgba(255,255,255,.018); transition: border-color .25s, color .25s, transform .25s, background .25s; }.field-cloud a:hover { border-color: rgba(102,228,255,.24); color: #fff; background: rgba(102,228,255,.035); transform: translateX(-4px); }.field-cloud a > i { width: 6px; height: 6px; border-radius: 50%; background: var(--home-cyan); box-shadow: 0 0 12px rgba(102,228,255,.65); }.field-cloud a:nth-child(3n+2) > i { background: var(--home-violet); box-shadow: 0 0 12px rgba(157,140,255,.65); }.field-cloud a:nth-child(3n) > i { background: var(--home-lime); box-shadow: 0 0 12px rgba(185,255,122,.65); }.field-cloud a span { font-size: 13px; font-weight: 750; }.field-cloud a b { color: rgba(225,232,243,.22); font: 700 8px/1 Arial,sans-serif; }

body.motion-ready [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .75s ease, transform .85s cubic-bezier(.2,.75,.2,1); }
body.motion-ready [data-reveal].is-visible { opacity: 1; transform: none; }
body.motion-ready .evidence-console[data-reveal] { transform: perspective(1000px) rotateY(4deg) rotateX(-1deg) translateY(24px); }
body.motion-ready .evidence-console[data-reveal].is-visible { transform: perspective(1000px) rotateY(4deg) rotateX(-1deg); }

body.data-saver .cinema-video { display: none; }
body.data-saver .cinema-media { background: #03050a url("../media/evidence-cinema-poster.cf65168935fd.webp") center/cover no-repeat; }
body.data-saver .cinema-particles { display: none; }
body.data-saver .audio-bars i,
body.data-saver .audio-orb i,
body.data-saver .daily-orbit,
body.data-saver .myth-visual::before,
body.data-saver .myth-visual::after { animation: none; }

@keyframes particle-rise { 0% { opacity: 0; transform: translate3d(0,30px,0) scale(.4); } 28% { opacity: .72; } 75% { opacity: .25; } 100% { opacity: 0; transform: translate3d(22px,-130px,0) scale(1.15); } }
@keyframes signal-pulse { 0% { box-shadow: 0 0 0 0 rgba(185,255,122,.6); } 70%, 100% { box-shadow: 0 0 0 8px rgba(185,255,122,0); } }
@keyframes console-float { 0%,100% { translate: 0 0; } 50% { translate: 0 -9px; } }
@keyframes console-scan { 0% { left: -30%; } 100% { left: 105%; } }
@keyframes scroll-drop { 0% { opacity: 0; transform: translate(-50%,-3px) rotate(45deg); } 45% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%,7px) rotate(45deg); } }
@keyframes result-enter { to { opacity: 1; transform: none; } }
@keyframes map-level { to { height: 25%; opacity: .45; } }
@keyframes audio-ring { 0% { opacity: .58; transform: scale(.72); } 100% { opacity: 0; transform: scale(1.18); } }
@keyframes cinema-wave { to { height: 100%; filter: brightness(1.35); } }
@keyframes audio-progress { 0% { width: 7%; } 100% { width: 92%; } }
@keyframes slow-spin { to { transform: rotate(360deg); } }
@keyframes myth-ring { 0%,100% { opacity: .5; transform: scale(.94); } 50% { opacity: 1; transform: scale(1.04); } }

@media (max-width: 1100px) {
  .cinema-layout { grid-template-columns: minmax(0, 1fr) minmax(270px, .48fr); gap: 42px; }
  .cinema-copy h1 { font-size: clamp(45px,5.5vw,64px); }
  .evidence-console { width: 300px; }
  .flow-experience { grid-template-columns: 92px minmax(0,1fr); }
  .story-rail button { min-height: 100px; }
  .product-frame { min-height: 560px; }.frame-body { height: 440px; }
}

@media (max-width: 900px) {
  .cinema-hero, .cinema-layout { min-height: max(700px,100svh); }
  .cinema-layout { display: flex; align-items: center; padding-top: 118px; padding-bottom: 110px; }
  .cinema-copy { width: min(76%, 650px); }
  .evidence-console { display: none; }
  .cinema-shade { background: linear-gradient(90deg, rgba(2,4,9,.2), rgba(2,4,9,.04) 42%, rgba(2,4,9,.78) 78%, rgba(2,4,9,.96)), linear-gradient(180deg, rgba(3,5,10,.12), transparent 40%, rgba(3,5,10,.88)); }
  .flow-experience { grid-template-columns: 1fr; }
  .story-rail { display: flex; overflow-x: auto; padding: 6px; }
  .story-rail button { min-width: 118px; min-height: 76px; grid-template-columns: 25px 1fr; justify-items: start; text-align: right; }
  .story-rail button b { top: 8px; left: 8px; }.story-rail button::after { top: auto; right: 50%; bottom: -7px; left: auto; width: 0; height: 2px !important; transform: translateX(50%); }.story-rail button.is-active::after { width: 40px; }
  .product-frame { min-height: 550px; }.frame-body { height: 430px; }
  .experience-grid { grid-template-columns: 1fr; }
  .experience-card { min-height: 390px; }
  .field-shell { grid-template-columns: 1fr; gap: 28px; }
  .field-shell > header { margin: 0; }
  .evidence-reel { grid-auto-columns: minmax(285px,48%); }
}

@media (max-width: 660px) {
  .home-app .nav-shell { min-height: 68px; }
  .home-app > .site-header { background: linear-gradient(180deg, rgba(2,4,9,.88), transparent); backdrop-filter: none; }
  .home-app .nav-actions .btn--primary { border-color: rgba(255,255,255,.13); color: rgba(246,249,253,.9); background: rgba(8,12,20,.48); box-shadow: none; backdrop-filter: blur(12px); }
  .cinema-hero, .cinema-layout { min-height: max(680px,100svh); }
  .cinema-layout { align-items: end; padding-top: 118px; padding-bottom: 116px; }
  .cinema-video { object-position: 45% center; opacity: .78; filter: saturate(.88) contrast(1.08) brightness(.72); }
  .cinema-shade { background: linear-gradient(180deg, rgba(2,4,9,.08) 0%, rgba(2,4,9,.12) 30%, rgba(2,4,9,.72) 59%, rgba(2,4,9,.98) 93%), radial-gradient(circle at 35% 30%, transparent, rgba(2,4,9,.18) 55%); }
  .cinema-grain { opacity: .09; }
  .cinema-particles { display: none; }
  .cinema-copy { width: 100%; max-width: none; padding: 0; }
  .signal-label { font-size: 7px; letter-spacing: 1.1px; }
  .signal-label span { padding: 5px 7px; }
  .cinema-copy h1 { margin: 18px 0 11px; font-size: clamp(39px,12vw,54px); line-height: 1.04; letter-spacing: -3px; }
  .cinema-copy > p { font-size: 11px; }
  .cinema-search { min-height: 59px; padding: 6px 7px 6px 14px; margin-top: 22px; border-radius: 17px; }
  .cinema-search button { min-width: 94px; min-height: 45px; border-radius: 12px; }
  .query-sparks { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
  .query-sparks::-webkit-scrollbar { display: none; }
  .query-sparks button { flex: 0 0 auto; }
  .cinema-foot { bottom: 18px; padding-top: 13px; }
  .source-beacons { gap: 10px; }.source-beacons span { font-size: 7px; }
  .motion-toggle span, .scroll-cue { display: none; }
  .motion-toggle { width: 30px; height: 30px; justify-content: center; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; }

  .flow-section { padding: 94px 0 100px; }.flow-section::before { height: 62px; }
  .flow-heading, .now-heading, .field-shell > header { margin-bottom: 27px; }
  .flow-heading h2, .now-heading h2, .field-shell h2 { margin-top: 9px; font-size: 35px; letter-spacing: -2.2px; }
  .story-rail { margin-inline: -2px; }
  .story-rail button { min-width: 101px; min-height: 68px; padding: 9px; gap: 7px; }.story-rail button span { font-size: 9px; }.story-icon { width: 21px; height: 21px; }
  .product-frame { min-height: 482px; border-radius: 21px; }.frame-bar { min-height: 45px; padding-inline: 11px; }.frame-bar > span { display: none; }.frame-body { height: 378px; }
  .story-scene { padding: 20px 13px; }
  .scene-search, .scene-filter-row, .scene-result-stack { width: 100%; }.scene-filter-row { overflow: hidden; }.scene-filter-row span { flex: 0 0 auto; }.scene-filter-row span:nth-child(n+4) { display: none; }
  .scene-result-stack article { min-height: 68px; padding: 10px; grid-template-columns: 59px 1fr auto; gap: 9px; }.scene-result-stack article:nth-child(3) { display: none; }
  .paper-visual { width: 100%; height: 305px; }.paper-copy { top: 29px; right: 22px; bottom: 29px; left: 36%; }.evidence-focus { top: 28px; bottom: 28px; left: 19px; width: 31%; padding: 13px; }.evidence-focus span { font-size: 17px; }.paper-map { right: 22px; bottom: 31px; left: 36%; }
  .audio-visual { width: 100%; }.audio-orb { width: 142px; height: 142px; }.audio-bars, .audio-time, .audio-progress { width: 92%; }
  .lesson-visual { width: 100%; grid-template-columns: 105px 1fr; gap: 14px; }.lesson-ring { width: 105px; height: 105px; }.lesson-ring span { font-size: 29px; }.lesson-ring small { font-size: 5px; }.lesson-card-mini { min-height: 260px; padding: 17px; }.lesson-card-mini > strong { font-size: 15px; }.review-dots { bottom: 13px; }.review-dots span { width: 24px; height: 24px; }
  .frame-caption { min-height: 58px; padding-inline: 14px; gap: 8px; }.frame-caption strong { font-size: 9px; }

  .now-section { padding: 88px 0 78px; }.now-heading { align-items: center; }.now-heading a { font-size: 0; }.evidence-reel { grid-auto-columns: minmax(274px,86%); margin-inline: -1px; }.reel-card { min-height: 270px; padding: 20px; }
  .dual-experience { padding: 16px 0 90px; }.experience-card { min-height: 355px; padding: 25px; border-radius: 22px; }.experience-copy h2 { font-size: 30px; }.daily-visual, .myth-visual { top: 23px; left: 7%; transform: scale(.77); transform-origin: top left; }
  .field-section { padding: 88px 0 105px; }.field-cloud { grid-template-columns: 1fr; }.field-cloud a { min-height: 67px; }
}

@media (max-width: 390px) {
  .cinema-copy h1 { font-size: 38px; }
  .cinema-search button { min-width: 48px; width: 48px; padding: 0; }.cinema-search button span { display: none; }.cinema-search button i { font-size: 18px; }
  .query-sparks button:nth-child(3) { display: none; }
  .source-beacons span:nth-child(2) { display: none; }
  .story-rail button { min-width: 92px; }
  .lesson-visual { grid-template-columns: 82px 1fr; }.lesson-ring { width: 82px; height: 82px; }.lesson-ring span { font-size: 24px; }
  .evidence-focus { width: 37%; }.paper-copy, .paper-map { left: 43%; }
}

@media (prefers-reduced-motion: reduce) {
  .cinema-video { display: none; }
  .cinema-media { background: #03050a url("../media/evidence-cinema-poster.cf65168935fd.webp") center/cover no-repeat; }
  body.motion-ready [data-reveal] { opacity: 1; transform: none; }
}

@media (prefers-contrast: more) {
  .cinema-shade { background: linear-gradient(90deg, rgba(2,4,9,.45), rgba(2,4,9,.25) 45%, #020409 100%), linear-gradient(180deg, transparent, rgba(2,4,9,.9)); }
  .cinema-copy > p, .source-beacons span, .query-sparks button { color: #e7ecf5; }
  .cinema-search, .product-frame, .experience-card, .reel-card { border-color: rgba(255,255,255,.32); }
}

/* 2026 immersive UI upgrade: Persian type, scroll depth, interactive evidence flow, custom menus. */
body {
  font-family: 'Vazirmatn', Tahoma, Arial, sans-serif;
}
button, input, select, textarea { font-family: inherit; }
.brand-copy strong, .desktop-nav a, .btn, .cinema-copy h1, .flow-heading h2, .now-heading h2, .field-shell h2 { font-family: 'Vazirmatn', Tahoma, Arial, sans-serif; }

.cinema-hero {
  --hero-pan-x: 0px;
  --hero-pan-y: 0px;
  --hero-tilt-x: 0deg;
  --hero-tilt-y: 0deg;
  --hero-scroll-shift: 0px;
  --hero-scroll-scale: 1.075;
  --hero-depth-fade: 1;
  perspective: 1400px;
}
.cinema-media {
  inset: -6%;
  opacity: var(--hero-depth-fade);
  transform: perspective(1400px) translate3d(var(--hero-pan-x), calc(var(--hero-pan-y) + var(--hero-scroll-shift)), -38px) rotateX(var(--hero-tilt-x)) rotateY(var(--hero-tilt-y)) scale(var(--hero-scroll-scale));
  transform-origin: 50% 42%;
  transform-style: preserve-3d;
  transition: transform .14s linear, opacity .2s linear;
  will-change: transform, opacity;
}
.cinema-video { transform: scale(1.025) translateZ(0); }
.cinema-shade { transform: translateZ(36px) scale(.99); }
.cinema-grain { transform: translateZ(55px); }
.cinema-particles { transform: translate3d(var(--hero-pan-x), var(--hero-pan-y), 92px); }
.cinema-depth-field {
  position: absolute;
  inset: -12%;
  overflow: hidden;
  opacity: .42;
  pointer-events: none;
  transform: translate3d(var(--hero-pan-x), var(--hero-pan-y), 120px) rotateZ(-8deg);
  transform-style: preserve-3d;
  mix-blend-mode: screen;
}
.cinema-depth-field i,
.cinema-depth-field b {
  position: absolute;
  display: block;
  border: 1px solid rgba(102, 228, 255, .13);
  border-radius: 50%;
  box-shadow: 0 0 55px rgba(102, 228, 255, .035), inset 0 0 45px rgba(157, 140, 255, .03);
}
.cinema-depth-field i:nth-child(1) { top: 16%; right: 9%; width: 36vw; height: 36vw; min-width: 380px; min-height: 380px; transform: rotateX(68deg) rotateZ(18deg); }
.cinema-depth-field i:nth-child(2) { bottom: 4%; left: 12%; width: 29vw; height: 29vw; min-width: 310px; min-height: 310px; border-color: rgba(185, 255, 122, .1); transform: rotateX(71deg) rotateZ(-24deg); }
.cinema-depth-field i:nth-child(3) { top: 39%; left: 39%; width: 18vw; height: 18vw; min-width: 210px; min-height: 210px; border-color: rgba(157, 140, 255, .13); transform: rotateY(68deg) rotateZ(8deg); }
.cinema-depth-field b { width: 5px; height: 5px; border: 0; background: var(--home-cyan); box-shadow: 0 0 28px 7px rgba(102, 228, 255, .32); }
.cinema-depth-field b:nth-of-type(1) { top: 28%; left: 18%; }
.cinema-depth-field b:nth-of-type(2) { right: 19%; bottom: 21%; background: var(--home-lime); box-shadow: 0 0 28px 7px rgba(185, 255, 122, .25); }

[data-tilt-surface] {
  --surface-tilt-x: 0deg;
  --surface-tilt-y: 0deg;
  --surface-glow-x: 50%;
  --surface-glow-y: 50%;
  transform-style: preserve-3d;
  transition: transform .28s cubic-bezier(.2,.8,.2,1), border-color .25s ease;
  will-change: transform;
}
.product-frame[data-tilt-surface] {
  transform: perspective(1350px) rotateX(var(--surface-tilt-x)) rotateY(var(--surface-tilt-y));
}
.product-frame[data-tilt-surface]::before {
  top: calc(var(--surface-glow-y) - 42%);
  left: calc(var(--surface-glow-x) - 30%);
  transition: top .18s linear, left .18s linear;
}
.evidence-console[data-tilt-surface]::after {
  position: absolute;
  z-index: -1;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: rgba(102,228,255,.08);
  filter: blur(45px);
  content: '';
  pointer-events: none;
  top: calc(var(--surface-glow-y) - 90px);
  left: calc(var(--surface-glow-x) - 90px);
}
body:not(.motion-ready) .evidence-console[data-tilt-surface],
body.motion-ready .evidence-console[data-reveal].is-visible {
  transform: perspective(1100px) rotateY(calc(4deg + var(--surface-tilt-y))) rotateX(calc(-1deg + var(--surface-tilt-x)));
}
body.motion-ready .evidence-console[data-reveal]:not(.is-visible) {
  transform: perspective(1100px) rotateY(calc(4deg + var(--surface-tilt-y))) rotateX(calc(-1deg + var(--surface-tilt-x))) translateY(24px);
}

.scene-search--interactive input {
  min-width: 0;
  border: 0;
  outline: 0;
  color: rgba(244,247,252,.84);
  background: transparent;
  font: 600 11px/1.3 'Vazirmatn', Tahoma, Arial, sans-serif;
}
.scene-search--interactive button {
  min-width: 54px;
  min-height: 31px;
  padding: 6px 10px;
  border: 1px solid rgba(185,255,122,.17);
  border-radius: 9px;
  color: var(--home-lime);
  background: rgba(185,255,122,.055);
  font: 800 7px/1 'Vazirmatn', Tahoma, Arial, sans-serif;
  letter-spacing: .8px;
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.scene-search--interactive button:hover { background: rgba(185,255,122,.11); box-shadow: 0 0 24px rgba(185,255,122,.08); transform: translateY(-1px); }
.scene-filter-row button {
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 999px;
  color: rgba(222,229,241,.42);
  background: rgba(255,255,255,.02);
  font: 700 7px/1 'Vazirmatn', Tahoma, Arial, sans-serif;
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}
.scene-filter-row button:hover { color: rgba(245,248,253,.8); transform: translateY(-1px); }
.scene-filter-row button.is-active { border-color: rgba(102,228,255,.2); color: var(--home-cyan); background: rgba(102,228,255,.065); }
.scene-result-stack article { position: relative; cursor: pointer; transition: border-color .22s ease, background .22s ease, transform .22s ease, opacity .22s ease; }
.scene-result-stack article:hover,
.scene-result-stack article.is-selected { border-color: rgba(102,228,255,.24); background: linear-gradient(100deg, rgba(102,228,255,.07), rgba(157,140,255,.025)); transform: translateX(-4px); }
.scene-result-stack article.is-selected::after { position: absolute; top: 10px; right: 10px; width: 6px; height: 6px; border-radius: 50%; background: var(--home-lime); box-shadow: 0 0 12px var(--home-lime); content: ''; }
.scene-result-stack.is-searching article { opacity: .22 !important; transform: translateY(5px) scale(.985) !important; animation: none !important; }
.scene-result-stack.is-searching::before { position: absolute; z-index: 3; top: 50%; left: 50%; width: 25px; height: 25px; border: 2px solid rgba(102,228,255,.14); border-top-color: var(--home-cyan); border-radius: 50%; content: ''; animation: spin .65s linear infinite; transform: translate(-50%,-50%); }
.scene-result-stack { position: relative; }

.evidence-switcher {
  position: absolute;
  right: 36px;
  bottom: 24px;
  left: 42%;
  display: flex;
  justify-content: flex-start;
  gap: 6px;
}
.evidence-switcher button {
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  color: rgba(226,232,243,.45);
  background: rgba(5,9,15,.72);
  font-size: 8px;
  font-weight: 700;
  backdrop-filter: blur(10px);
}
.evidence-switcher button:hover { color: #fff; }
.evidence-switcher button.is-active { border-color: rgba(185,255,122,.2); color: var(--home-lime); background: rgba(185,255,122,.065); }
[data-evidence-demo].is-updated .evidence-focus { animation: evidence-pop .45s cubic-bezier(.2,.8,.2,1); }

.audio-orb {
  padding: 0;
  border: 1px solid rgba(102,228,255,.2);
  color: inherit;
  cursor: pointer;
}
.audio-orb::before { transition: transform .25s ease, border-color .25s ease; }
.audio-orb:hover::before { border-color: rgba(185,255,122,.62); transform: scale(1.08); }
.audio-play-icon {
  position: absolute;
  z-index: 2;
  width: 0;
  height: 0;
  margin-left: 5px;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 16px solid rgba(239,255,226,.88);
  filter: drop-shadow(0 0 10px rgba(185,255,122,.35));
}
.audio-visual.is-playing .audio-play-icon { width: 15px; height: 18px; margin: 0; border: 0; border-right: 4px solid rgba(239,255,226,.88); border-left: 4px solid rgba(239,255,226,.88); }
.audio-bars i { animation-play-state: paused; }
.audio-visual.is-playing .audio-bars i { animation-play-state: running; }
.audio-progress {
  display: block;
  width: min(520px, 90%);
  height: 9px;
  padding: 3px 0;
  overflow: visible;
  border: 0;
  border-radius: 6px;
  background: transparent;
}
.audio-progress::before { position: absolute; right: 0; left: 0; height: 3px; border-radius: 4px; background: rgba(255,255,255,.08); content: ''; }
.audio-progress { position: relative; }
.audio-progress i { position: relative; z-index: 1; display: block; width: 2%; height: 3px; border-radius: 4px; background: linear-gradient(90deg, var(--home-violet), var(--home-cyan), var(--home-lime)); animation: none; transition: width .12s linear; }
.audio-progress i::after { position: absolute; top: 50%; right: -5px; width: 9px; height: 9px; border-radius: 50%; background: var(--home-lime); box-shadow: 0 0 13px rgba(185,255,122,.48); content: ''; transform: translateY(-50%); }

.lesson-actions { display: flex !important; flex-wrap: wrap; gap: 7px !important; }
.lesson-actions button { min-height: 38px; }
.lesson-actions button + button { border: 1px solid rgba(255,255,255,.1); color: rgba(238,242,249,.72); background: rgba(255,255,255,.035); }
.lesson-visual.is-complete .lesson-ring { box-shadow: 0 0 75px rgba(185,255,122,.14); animation: evidence-pop .45s cubic-bezier(.2,.8,.2,1); }

.frame-caption [data-story-progress] { transform: scaleX(0); transform-origin: left center; }
.flow-experience.is-story-paused [data-story-progress] { animation-play-state: paused !important; }
@keyframes story-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes evidence-pop { 0% { transform: scale(.96); filter: brightness(.8); } 100% { transform: scale(1); filter: brightness(1); } }

/* Browser-independent, searchable dropdown used for every select in the product UI. */
.smart-select { position: relative; width: 100%; min-width: 0; }
.smart-select__native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.smart-select__trigger {
  display: grid;
  width: 100%;
  min-height: 46px;
  align-items: center;
  padding: 10px 13px;
  border: 1px solid rgba(255,255,255,.105);
  border-radius: 13px;
  grid-template-columns: minmax(0,1fr) 28px;
  gap: 10px;
  color: var(--ink);
  background: linear-gradient(145deg, rgba(255,255,255,.052), rgba(255,255,255,.024));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  text-align: right;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.smart-select__trigger:hover { border-color: rgba(102,228,255,.22); background: linear-gradient(145deg, rgba(102,228,255,.055), rgba(255,255,255,.025)); }
.smart-select__trigger:focus-visible,
.smart-select.is-open .smart-select__trigger { border-color: rgba(102,228,255,.42); box-shadow: 0 0 0 4px rgba(102,228,255,.055), inset 0 1px 0 rgba(255,255,255,.05); }
.smart-select__trigger:disabled { cursor: not-allowed; opacity: .5; }
.smart-select__trigger.is-placeholder .smart-select__value { color: var(--muted); }
.smart-select__value { min-width: 0; overflow: hidden; color: var(--ink-soft); font-size: 11px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.smart-select__trigger > i { position: relative; display: grid; width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.08); border-radius: 9px; background: rgba(0,0,0,.12); place-items: center; }
.smart-select__trigger > i::before { width: 6px; height: 6px; border-right: 1.5px solid rgba(218,225,237,.6); border-bottom: 1.5px solid rgba(218,225,237,.6); content: ''; transform: translateY(-2px) rotate(45deg); transition: transform .2s ease; }
.smart-select.is-open .smart-select__trigger > i::before { transform: translateY(2px) rotate(225deg); }
.smart-select-menu {
  position: fixed;
  z-index: 1000;
  display: grid;
  width: var(--select-menu-width, 280px);
  max-width: calc(100vw - 24px);
  max-height: var(--select-menu-max-height, 380px);
  padding: 8px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 17px;
  gap: 7px;
  opacity: 0;
  background: linear-gradient(155deg, rgba(18,23,35,.98), rgba(7,10,17,.98));
  box-shadow: 0 30px 85px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.055), 0 0 0 1px rgba(102,228,255,.025);
  backdrop-filter: blur(24px) saturate(135%);
  transform: translateY(-5px) scale(.985);
  transform-origin: top center;
  transition: opacity .14s ease, transform .14s ease;
}
.smart-select-menu[data-side="top"] { transform: translateY(5px) scale(.985); transform-origin: bottom center; }
.smart-select-menu.is-open { opacity: 1; transform: none; }
.smart-select-menu[hidden] { display: none; }
.smart-select-menu__search-wrap { position: relative; }
.smart-select-menu__search-wrap[hidden] { display: none; }
.smart-select-menu__search-wrap > span { position: absolute; z-index: 1; top: 50%; right: 13px; width: 13px; height: 13px; border: 1px solid rgba(222,229,241,.48); border-radius: 50%; pointer-events: none; transform: translateY(-58%); }
.smart-select-menu__search-wrap > span::after { position: absolute; right: -4px; bottom: -2px; width: 5px; height: 1px; background: rgba(222,229,241,.48); content: ''; transform: rotate(45deg); }
.smart-select-menu__search { width: 100%; min-height: 42px; padding: 9px 36px 9px 11px; border: 1px solid rgba(255,255,255,.09); border-radius: 11px; outline: 0; color: var(--ink); background: rgba(255,255,255,.035); font-size: 10px; }
.smart-select-menu__search:focus { border-color: rgba(102,228,255,.35); background: rgba(102,228,255,.04); }
.smart-select-menu__list { display: grid; max-height: calc(var(--select-menu-max-height, 380px) - 64px); overflow: auto; padding: 1px 2px 2px; gap: 3px; overscroll-behavior: contain; scrollbar-color: rgba(102,228,255,.3) transparent; scrollbar-width: thin; }
.smart-select-menu__option {
  display: grid;
  width: 100%;
  min-height: 39px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 10px;
  grid-template-columns: minmax(0,1fr) 22px;
  gap: 8px;
  color: rgba(225,231,242,.68);
  background: transparent;
  text-align: right;
  transition: color .16s ease, border-color .16s ease, background .16s ease, transform .16s ease;
}
.smart-select-menu__option:hover,
.smart-select-menu__option.is-active { border-color: rgba(102,228,255,.12); color: #fff; background: linear-gradient(90deg, rgba(102,228,255,.07), rgba(157,140,255,.025)); transform: translateX(-2px); }
.smart-select-menu__option[aria-selected="true"] { border-color: rgba(185,255,122,.15); color: var(--home-lime); background: rgba(185,255,122,.045); }
.smart-select-menu__option:disabled { cursor: not-allowed; opacity: .36; }
.smart-select-menu__option span { overflow: hidden; font-size: 10px; font-weight: 600; line-height: 1.65; text-overflow: ellipsis; white-space: nowrap; }
.smart-select-menu__option i { color: var(--home-lime); font-size: 12px; font-style: normal; text-align: center; }
.smart-select-menu__empty { padding: 22px 12px; color: var(--muted); font-size: 10px; text-align: center; }

@media (max-width: 660px) {
  .cinema-media { inset: -3%; transform: translate3d(0, var(--hero-scroll-shift), 0) scale(1.06); }
  .cinema-depth-field { opacity: .2; }
  .product-frame[data-tilt-surface],
  body:not(.motion-ready) .evidence-console[data-tilt-surface],
  body.motion-ready .evidence-console[data-reveal].is-visible { transform: none; }
  .evidence-switcher { right: 22px; bottom: 17px; left: 36%; overflow-x: auto; }
  .evidence-switcher button { flex: 0 0 auto; }
  .scene-filter-row button { flex: 0 0 auto; }
  .lesson-actions { display: grid !important; grid-template-columns: 1fr; }
  .lesson-actions button { width: 100%; }
  .smart-select-menu { border-radius: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .cinema-media, [data-tilt-surface], .smart-select-menu, .smart-select__trigger { transition: none; transform: none !important; }
  .frame-caption [data-story-progress] { animation: none !important; transform: scaleX(1); }
}

/* Article infographic studio: wide modal, responsive artboard and export controls. */
.modal--infographic { width: min(1240px, 100%); padding: 20px; overflow: hidden; }
.infographic-modal-head { margin-bottom: 12px; }
.infographic-modal-head p { margin: 7px 0 0; color: var(--muted); font-size: 10px; }
.infographic-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 10px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 15px; gap: 10px; background: rgba(255,255,255,.025); }
.infographic-toolbar > div { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.infographic-toolbar > div > span { margin-left: 4px; color: var(--muted); font-size: 9px; }
.ig-tool { min-height: 34px; padding: 7px 10px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: rgba(255,255,255,.025); font-size: 9px; transition: .18s ease; }
.ig-tool:hover { color: var(--ink); border-color: rgba(89,221,255,.28); transform: translateY(-1px); }
.ig-tool.is-active { color: var(--cyan); border-color: rgba(89,221,255,.28); background: rgba(89,221,255,.075); box-shadow: inset 0 0 18px rgba(89,221,255,.035); }
.infographic-downloads { margin-right: auto; }
.infographic-preview-shell { max-height: calc(100vh - 190px); overflow: auto; padding: 10px; border: 1px solid var(--line); border-radius: 18px; background: #04060b; scrollbar-width: thin; }
.infographic-preview { width: 100%; min-width: 980px; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 18px; box-shadow: 0 24px 80px rgba(0,0,0,.38); }
.infographic-preview[data-layout="story"] { width: min(760px, 100%); min-width: 620px; margin-inline: auto; aspect-ratio: 4 / 5; }
.infographic-loading { display: grid; min-height: 420px; align-content: center; justify-items: center; text-align: center; }
.infographic-loading i { width: 54px; height: 54px; margin-bottom: 20px; border: 2px solid rgba(89,221,255,.12); border-top-color: var(--cyan); border-radius: 50%; animation: spin .72s linear infinite; }
.infographic-loading strong { font-size: 17px; }
.infographic-loading span { margin-top: 8px; color: var(--muted); font-size: 10px; }

.infographic-artboard{--bg:#050811;--panel:rgba(12,18,31,.82);--panel2:rgba(20,28,47,.78);--text:#f7f9ff;--muted:#aab5c9;--line:rgba(150,190,235,.18);--cyan:#62e6ff;--lime:#b9ff7a;--violet:#a18dff;--danger:#ff7188;position:relative;width:100%;height:100%;overflow:hidden;padding:42px 46px 34px;color:var(--text);background:radial-gradient(circle at 18% 12%,rgba(98,230,255,.11),transparent 26%),radial-gradient(circle at 82% 78%,rgba(161,141,255,.12),transparent 30%),linear-gradient(145deg,#080d18,var(--bg) 56%,#080b14);font-family:'Vazirmatn',Tahoma,Arial,sans-serif}.theme-cobalt{--cyan:#77b7ff;--lime:#77f0da;--violet:#7a88ff}.theme-paper{--bg:#edf3f8;--panel:rgba(255,255,255,.83);--panel2:rgba(244,249,253,.88);--text:#142033;--muted:#5e6c80;--line:rgba(31,72,110,.14);--cyan:#167ba2;--lime:#27845f;--violet:#5f57b8;background:radial-gradient(circle at 15% 10%,rgba(41,139,185,.12),transparent 28%),linear-gradient(145deg,#f9fcff,#eaf1f7)}.ig-noise{position:absolute;inset:0;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,#000,transparent 85%)}.ig-glow{position:absolute;border-radius:50%;filter:blur(18px);opacity:.24}.ig-glow--a{top:-150px;right:260px;width:420px;height:420px;background:var(--cyan)}.ig-glow--b{bottom:-190px;left:120px;width:420px;height:420px;background:var(--violet)}.ig-header,.ig-hero,.ig-metrics,.ig-content-grid,.ig-footer{position:relative;z-index:2}.ig-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:20px;border-bottom:1px solid var(--line)}.ig-brand{display:flex;align-items:center;gap:12px}.ig-brand-mark{display:grid;width:48px;height:48px;border:1px solid rgba(185,255,122,.35);border-radius:15px;color:#07120d;background:linear-gradient(145deg,var(--lime),var(--cyan));font-size:25px;font-weight:900;place-items:center;box-shadow:0 0 30px rgba(98,230,255,.17)}.ig-brand strong,.ig-brand small{display:block}.ig-brand strong{font-size:18px}.ig-brand small{margin-top:3px;color:var(--muted);font:700 8px/1 Arial,sans-serif;letter-spacing:2px}.ig-header-meta{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px}.ig-header-meta i{width:4px;height:4px;border-radius:50%;background:var(--lime);box-shadow:0 0 9px var(--lime)}.ig-hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(290px,.45fr);align-items:center;min-height:292px;padding:32px 0 26px;gap:44px}.ig-kicker{display:inline-flex;padding:7px 11px;border:1px solid rgba(98,230,255,.2);border-radius:999px;color:var(--cyan);background:rgba(98,230,255,.06);font-size:11px;font-weight:800}.ig-hero h2{max-width:1040px;margin:13px 0 8px;font-size:42px;line-height:1.48;letter-spacing:-1.5px}.ig-original{max-width:980px;margin:0;color:var(--muted);font-size:12px;line-height:1.65;text-align:right}.ig-lead{max-width:980px;margin:15px 0 0;color:#cbd4e4;font-size:14px;line-height:2}.theme-paper .ig-lead{color:#3f5067}.ig-identifiers{display:flex;flex-wrap:wrap;margin-top:14px;gap:7px;direction:ltr;justify-content:flex-end}.ig-identifiers span{padding:6px 9px;border:1px solid var(--line);border-radius:8px;color:var(--muted);background:rgba(255,255,255,.025);font:700 9px/1.2 Arial,sans-serif}.ig-rings{display:grid;justify-items:center}.ig-ring{display:grid;width:174px;height:174px;padding:13px;border-radius:50%;background:conic-gradient(var(--lime) var(--signal-score),rgba(255,255,255,.075) 0);box-shadow:0 0 55px rgba(98,230,255,.11);place-items:center}.ig-ring:before{grid-area:1/1;width:142px;height:142px;border:1px solid var(--line);border-radius:50%;background:radial-gradient(circle,rgba(98,230,255,.12),var(--bg) 66%);content:''}.ig-ring>div{z-index:1;grid-area:1/1;text-align:center}.ig-ring strong,.ig-ring span{display:block}.ig-ring strong{font:900 31px/1 Arial,sans-serif}.ig-ring span{max-width:110px;margin-top:8px;color:var(--lime);font-size:11px;line-height:1.5}.ig-ring-caption{margin-top:11px;text-align:center}.ig-ring-caption b,.ig-ring-caption small{display:block}.ig-ring-caption b{font-size:12px}.ig-ring-caption small{margin-top:4px;color:var(--muted);font-size:9px}.ig-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.ig-metric{display:flex;min-height:88px;align-items:center;padding:15px;border:1px solid var(--line);border-radius:18px;gap:12px;background:linear-gradient(145deg,var(--panel2),rgba(255,255,255,.025));box-shadow:inset 0 1px rgba(255,255,255,.035)}.ig-icon{display:grid;flex:0 0 auto;width:38px;height:38px;border:1px solid rgba(98,230,255,.2);border-radius:12px;color:var(--cyan);background:rgba(98,230,255,.07);place-items:center}.ig-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.ig-metric small,.ig-metric strong,.ig-metric em{display:block}.ig-metric small{color:var(--muted);font-size:9px}.ig-metric strong{margin-top:5px;font-size:14px}.ig-metric em{margin-top:4px;color:var(--cyan);font-size:8px;font-style:normal}.ig-content-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(330px,.6fr);margin-top:13px;gap:13px}.ig-panel{padding:20px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,var(--panel),rgba(255,255,255,.025));box-shadow:0 18px 60px rgba(0,0,0,.13),inset 0 1px rgba(255,255,255,.035)}.ig-panel-head{display:flex;align-items:center;gap:11px}.ig-panel-head small,.ig-panel-head h3{display:block;margin:0}.ig-panel-head small{color:var(--cyan);font-size:9px}.ig-panel-head h3{margin-top:4px;font-size:15px}.ig-points{display:grid;margin-top:14px;grid-template-columns:repeat(2,1fr);gap:9px}.ig-point{display:grid;min-height:76px;padding:12px;border:1px solid rgba(255,255,255,.075);border-radius:14px;grid-template-columns:34px 1fr;align-items:start;gap:9px;background:rgba(255,255,255,.023)}.theme-paper .ig-point{border-color:rgba(30,65,100,.1)}.ig-point>span{display:grid;width:31px;height:31px;border-radius:10px;color:#07120d;background:linear-gradient(145deg,var(--lime),var(--cyan));font:900 9px/1 Arial,sans-serif;place-items:center}.ig-point p{margin:0;color:#ced6e4;font-size:10px;line-height:1.85}.theme-paper .ig-point p{color:#394b61}.ig-side-stack{display:grid;gap:13px}.ig-method p,.ig-limit p{margin:12px 0 0;color:#bdc8d9;font-size:10px;line-height:1.9}.theme-paper .ig-method p,.theme-paper .ig-limit p{color:#4a5c72}.ig-flow{display:flex;align-items:center;justify-content:space-between;margin-top:16px;gap:4px;direction:rtl}.ig-flow span{padding:5px 7px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:7px}.ig-flow i{height:1px;flex:1;background:linear-gradient(90deg,var(--violet),var(--cyan),var(--lime));opacity:.62}.ig-limit{border-color:rgba(255,177,97,.18)}.ig-limit.is-danger{border-color:rgba(255,113,136,.35);background:linear-gradient(145deg,rgba(72,16,30,.62),rgba(255,113,136,.035))}.ig-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.56fr);align-items:end;padding-top:15px;margin-top:13px;border-top:1px solid var(--line);gap:10px 20px}.ig-keywords{display:flex;flex-wrap:wrap;gap:6px}.ig-keywords span{padding:6px 9px;border:1px solid rgba(185,255,122,.16);border-radius:999px;color:var(--lime);background:rgba(185,255,122,.045);font-size:8px}.ig-footer-copy{text-align:left;direction:rtl}.ig-footer-copy strong,.ig-footer-copy span,.ig-footer-copy small{display:block}.ig-footer-copy strong{font-size:11px}.ig-footer-copy span{margin-top:4px;color:var(--muted);font-size:8px;line-height:1.65}.ig-footer-copy small{margin-top:4px;color:var(--muted);font-size:7px;line-height:1.55}.ig-source-link{display:inline-flex;align-items:center;width:max-content;padding:8px 10px;border:1px solid rgba(98,230,255,.22);border-radius:10px;gap:7px;color:var(--cyan);font-size:9px;text-decoration:none}.ig-source-link svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2}.ig-safety{grid-column:1/-1;margin:0;color:var(--muted);font-size:7px;line-height:1.6}.is-story{padding:36px}.is-story .ig-hero{grid-template-columns:1fr;min-height:auto;gap:20px}.is-story .ig-rings{grid-template-columns:auto 1fr;justify-content:start;align-items:center;gap:18px}.is-story .ig-ring{width:142px;height:142px}.is-story .ig-ring:before{width:114px;height:114px}.is-story .ig-metrics{grid-template-columns:repeat(2,1fr)}.is-story .ig-content-grid{grid-template-columns:1fr}.is-story .ig-points{grid-template-columns:1fr}.is-story .ig-footer{grid-template-columns:1fr}.is-story .ig-footer-copy{text-align:right}

@media (max-width: 820px) {
  .modal-backdrop:has(.modal--infographic) { padding: 0; place-items: stretch; }
  .modal--infographic { width: 100%; max-height: 100vh; padding: 13px; border-radius: 0; overflow: auto; }
  .infographic-toolbar { align-items: stretch; flex-direction: column; }
  .infographic-downloads { width: 100%; margin: 0; }
  .infographic-downloads .btn { flex: 1; }
  .infographic-preview-shell { max-height: none; padding: 6px; }
  .infographic-preview { min-width: 900px; }
  .infographic-preview[data-layout="story"] { min-width: 600px; }
}


/* Natural bilingual article reader. */
.article-main h1 { font-family: 'Vazirmatn', Tahoma, Arial, sans-serif; font-weight: 900; }
.article-summary-highlight { position: relative; padding: 22px; border: 1px solid rgba(185,255,122,.15); border-radius: 18px; background: radial-gradient(circle at 100% 0, rgba(185,255,122,.075), transparent 42%), rgba(185,255,122,.025); }
.article-analysis-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.article-analysis-grid > section { padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.018); }
.article-analysis-grid h2 { margin-top: 0; }
.translated-fulltext { max-height: 62vh; overflow: auto; padding: 20px; border: 1px solid rgba(154,130,255,.13); border-radius: 16px; color: #c6cbd6; background: rgba(154,130,255,.025); font-size: 13px; line-height: 2.25; scrollbar-width: thin; }
[data-speech-block] { border-radius: 15px; transition: background .25s ease, box-shadow .25s ease, outline-color .25s ease; }
[data-speech-block].is-being-read { outline: 1px solid rgba(89,221,255,.22); outline-offset: 8px; background: linear-gradient(90deg, rgba(89,221,255,.045), transparent 70%); box-shadow: 18px 0 45px rgba(89,221,255,.035); }
.audio-dock--advanced { grid-template-columns: auto minmax(210px,1fr) auto auto; padding: 14px; border-color: rgba(89,221,255,.22); background: radial-gradient(circle at 10% 50%, rgba(89,221,255,.085), transparent 35%), linear-gradient(145deg, rgba(16,26,42,.86), rgba(10,14,23,.9)); box-shadow: inset 0 1px rgba(255,255,255,.035), 0 20px 55px rgba(0,0,0,.16); }
.audio-main-button { display: grid; min-width: 116px; min-height: 52px; padding: 9px 13px; border: 1px solid rgba(185,255,122,.22); border-radius: 14px; grid-template-columns: 28px 1fr; align-items: center; gap: 8px; color: #eaffdc; background: linear-gradient(145deg, rgba(185,255,122,.11), rgba(89,221,255,.045)); font-family: inherit; font-size: 9px; font-weight: 800; text-align: right; transition: .2s ease; }
.audio-main-button:hover { border-color: rgba(185,255,122,.4); transform: translateY(-1px); }
.audio-main-icon { position: relative; display: block; width: 27px; height: 27px; border: 1px solid rgba(185,255,122,.28); border-radius: 50%; background: rgba(185,255,122,.055); }
.audio-main-icon::before { position: absolute; top: 50%; left: 52%; width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 8px solid var(--lime); content: ''; transform: translate(-43%,-50%); }
.audio-main-button[data-speech-state="playing"] .audio-main-icon::before { width: 8px; height: 10px; border: 0; border-right: 3px solid var(--lime); border-left: 3px solid var(--lime); transform: translate(-50%,-50%); }
.audio-copy strong { font-size: 12px; }
.audio-copy small { color: #9da8bb; font-size: 9px; white-space: normal; }
.audio-progress-track { position: relative; height: 4px; margin-top: 9px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.07); }
.audio-progress-track i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--violet), var(--cyan), var(--lime)); box-shadow: 0 0 12px rgba(89,221,255,.25); transition: width .12s linear; }
.audio-controls { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.audio-controls button { min-height: 32px; padding: 6px 8px; border: 1px solid rgba(255,255,255,.085); border-radius: 9px; color: #abb5c6; background: rgba(255,255,255,.025); font-family: inherit; font-size: 8px; }
.audio-controls button:hover { color: #fff; border-color: rgba(89,221,255,.25); background: rgba(89,221,255,.055); }
.audio-dock--advanced.is-paused { border-color: rgba(255,200,103,.24); }
.audio-dock--advanced.is-paused .audio-wave i { animation-play-state: paused; background: var(--amber); }
.audio-settings { grid-column: 1 / -1; padding-top: 9px; border-top: 1px solid rgba(255,255,255,.06); }
.audio-settings summary { width: max-content; cursor: pointer; color: var(--cyan); font-size: 9px; font-weight: 700; }
.audio-settings-grid { display: grid; grid-template-columns: 1fr 1fr .55fr; margin-top: 11px; gap: 9px; }
.audio-settings label { display: grid; gap: 5px; color: var(--muted); font-size: 8px; }
.audio-settings select { width: 100%; min-height: 38px; padding: 6px 9px; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; outline: 0; color: var(--ink); background: #111722; font-family: inherit; font-size: 9px; }
.audio-settings p { margin: 8px 0 0; color: var(--muted); font-size: 8px; line-height: 1.8; }

@media (max-width: 980px) {
  .audio-dock--advanced { grid-template-columns: auto 1fr auto; }
  .audio-dock--advanced .audio-wave { display: none; }
  .audio-settings-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 660px) {
  .article-analysis-grid { grid-template-columns: 1fr; }
  .audio-dock--advanced { grid-template-columns: 1fr; }
  .audio-main-button { width: 100%; }
  .audio-controls { justify-content: stretch; }
  .audio-controls button { flex: 1; }
  .audio-settings-grid { grid-template-columns: 1fr; }
  .audio-settings summary { width: auto; }
}