:root {
  --bg: #050906;
  --bg-2: #08120d;
  --panel: rgba(12, 23, 17, .80);
  --panel-solid: #0d1813;
  --panel-2: rgba(22, 39, 31, .72);
  --text: #f4fbf7;
  --muted: #9bafa6;
  --muted-2: #71857c;
  --border: rgba(255,255,255,.09);
  --border-strong: rgba(70,242,170,.28);
  --accent: #43eea8;
  --accent-2: #0eae6d;
  --accent-3: #9affd5;
  --accent-text: #04130d;
  --warning: #ffd369;
  --danger: #ff7580;
  --positive: #4ae7a0;
  --negative: #ff7f88;
  --shadow: 0 22px 70px rgba(0,0,0,.32);
  --radius-xl: 30px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

:root.light {
  --bg: #eef8f3;
  --bg-2: #f9fcfa;
  --panel: rgba(255,255,255,.86);
  --panel-solid: #fff;
  --panel-2: rgba(235,247,241,.90);
  --text: #07160f;
  --muted: #60756b;
  --muted-2: #879990;
  --border: rgba(4,34,22,.11);
  --border-strong: rgba(3,137,84,.25);
  --accent: #0ca767;
  --accent-2: #08794c;
  --accent-3: #35cc84;
  --accent-text: #fff;
  --warning: #946500;
  --danger: #cf4651;
  --positive: #087e4f;
  --negative: #c8414b;
  --shadow: 0 22px 58px rgba(20,78,53,.12);
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); scroll-behavior: smooth; }
body {
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 88% -8%, rgba(67,238,168,.13), transparent 36%),
    radial-gradient(circle at -10% 36%, rgba(67,238,168,.06), transparent 28%),
    linear-gradient(180deg,var(--bg),var(--bg-2));
  color: var(--text);
  font-family: "Vazirmatn", Tahoma, Arial, sans-serif;
  font-weight: 500;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; }
.hidden { display: none !important; }

#ambientCanvas {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: -3;
  pointer-events: none;
}

.splash {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: grid;
  place-content: center;
  justify-items: center;
  background:
    radial-gradient(circle at 50% 42%, rgba(67,238,168,.14), transparent 30%),
    #030604;
  transition: opacity .65s ease, visibility .65s ease;
}
.splash.hidden { opacity: 0; visibility: hidden; }
.splash-logo {
  position: relative;
  width: 112px;
  height: 112px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
}
.splash-logo::before,
.splash-logo::after {
  content: "";
  position: absolute;
  inset: 4px;
  border: 1px solid rgba(67,238,168,.28);
  border-radius: 50%;
  animation: spin 4s linear infinite;
}
.splash-logo::after { inset: 20px; animation-direction: reverse; animation-duration: 2.8s; }
.splash-logo i {
  position: absolute;
  top: 2px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 18px var(--accent);
  animation: spinDot 4s linear infinite;
  transform-origin: 4px 54px;
}
.splash-logo span {
  position: relative;
  z-index: 2;
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 23px;
  background: linear-gradient(145deg,var(--accent-3),var(--accent-2));
  color: var(--accent-text);
  font-size: 36px;
  font-weight: 900;
  box-shadow: 0 0 45px rgba(67,238,168,.28);
  animation: pulse 1.8s ease-in-out infinite;
}
.splash h1 { margin: 0; font-size: 23px; letter-spacing: 4px; }
.splash h1 b { color: var(--accent); }
.splash p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.splash-progress { width: 180px; height: 3px; margin-top: 22px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.07); }
.splash-progress span { display:block; width:45%; height:100%; background:linear-gradient(90deg,transparent,var(--accent),transparent); animation:loader 1.1s ease-in-out infinite; }

.app-shell {
  width: min(100%, 900px);
  min-height: 100vh;
  margin: 0 auto;
  padding: max(14px,env(safe-area-inset-top)) 14px calc(116px + var(--safe-bottom));
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .6s ease, transform .6s ease;
}
.app-shell.ready { opacity: 1; transform: none; }

.glass,
.card {
  border: 1px solid var(--border);
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),transparent 45%),
    var(--panel);
  backdrop-filter: blur(22px) saturate(145%);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025),var(--shadow);
}
.card { position: relative; overflow: hidden; border-radius: var(--radius-lg); }
.card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(500px circle at var(--mx,50%) var(--my,50%),rgba(67,238,168,.065),transparent 43%);
  opacity: 0;
  transition: opacity .25s ease;
}
.card:hover::before { opacity: 1; }

.topbar {
  position: relative;
  z-index: 20;
  display: grid;
  grid-template-columns: 46px 1fr 46px;
  align-items: center;
  gap: 10px;
  padding: 8px;
  border-radius: 20px;
}
.avatar,.icon-btn {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--panel-2);
  cursor: pointer;
  font-weight: 900;
}
.avatar { color: var(--accent); background:linear-gradient(145deg,rgba(67,238,168,.18),rgba(67,238,168,.03)),var(--panel-2); }
.brand { display:flex; align-items:center; justify-content:center; gap:10px; }
.brand-orb { width:36px; height:36px; display:grid; place-items:center; border:1px solid rgba(67,238,168,.3); border-radius:50%; color:var(--accent); font-weight:900; box-shadow:0 0 20px rgba(67,238,168,.08); }
.brand small,.brand strong { display:block; line-height:1.35; }
.brand small { color:var(--accent); font-size:8px; letter-spacing:1.4px; }
.brand strong { font-size:14px; font-weight:800; }

.search-launch {
  width: calc(100% - 4px);
  margin: 10px 2px 16px;
  padding: 10px 13px;
  display:grid;
  grid-template-columns:34px 1fr auto;
  gap:9px;
  align-items:center;
  text-align:right;
  border-radius:15px;
  color:var(--text);
  cursor:pointer;
}
.search-launch > span { color:var(--accent); font-size:20px; }
.search-launch strong,.search-launch small { display:block; }
.search-launch strong { font-size:11px; }
.search-launch small { color:var(--muted); font-size:9px; }
.search-launch kbd { padding:3px 7px; border:1px solid var(--border); border-radius:8px; background:var(--panel-2); color:var(--muted); font-size:8px; }

.view { display:none; }
.view.active { display:block; animation:viewIn .42s cubic-bezier(.22,.8,.25,1); }

.hero {
  min-height: 520px;
  display:grid;
  gap:20px;
  align-items:center;
  padding:25px 20px;
  border-radius:var(--radius-xl);
  isolation:isolate;
}
.hero-grid { position:absolute; inset:0; z-index:-3; opacity:.14; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:38px 38px; mask-image:linear-gradient(180deg,#000,transparent 92%); }
.hero-glow { position:absolute; z-index:-2; width:340px; height:340px; top:-120px; left:-90px; border-radius:50%; filter:blur(80px); background:rgba(67,238,168,.16); animation:aurora 7s ease-in-out infinite alternate; }
.hero-copy { position:relative; z-index:2; }
.badge-row,.hero-actions,.hero-trust { display:flex; flex-wrap:wrap; gap:9px; align-items:center; }
.badge { display:inline-flex; align-items:center; min-height:27px; padding:4px 10px; border:1px solid var(--border); border-radius:999px; color:var(--muted); font-size:9px; }
.badge.accent { border-color:rgba(67,238,168,.24); background:rgba(67,238,168,.10); color:var(--accent); }
h1,h2,h3,p { margin-top:0; }
.hero h2 { margin:15px 0 11px; font-size:clamp(34px,9vw,56px); line-height:1.18; letter-spacing:-1.5px; font-weight:900; }
.hero h2 em { font-style:normal; color:transparent; background:linear-gradient(120deg,var(--text),var(--accent),var(--accent-3)); background-clip:text; -webkit-background-clip:text; background-size:200% auto; animation:shimmer 5s linear infinite; }
.hero p { max-width:560px; color:var(--muted); font-size:13px; }
.primary-btn,.secondary-btn {
  min-height:46px;
  padding:11px 17px;
  border:1px solid transparent;
  border-radius:15px;
  cursor:pointer;
  font-weight:800;
  transition:transform .2s ease,border-color .2s ease;
}
.primary-btn { display:inline-flex; align-items:center; justify-content:center; gap:11px; background:linear-gradient(135deg,var(--accent-3),var(--accent-2)); color:var(--accent-text); box-shadow:0 12px 30px rgba(14,174,109,.19); }
.secondary-btn { background:rgba(255,255,255,.025); border-color:var(--border); color:var(--text); }
.primary-btn:active,.secondary-btn:active { transform:scale(.975); }
.full { width:100%; }
.hero-trust { margin-top:18px; color:var(--muted-2); font-size:9px; }
.hero-visual { min-height:230px; display:grid; place-items:center; }
.orbit { position:relative; width:220px; height:220px; display:grid; place-items:center; }
.orbit-ring { position:absolute; border:1px solid rgba(67,238,168,.2); border-radius:50%; }
.orbit-ring::after { content:""; position:absolute; top:-3px; left:50%; width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 16px var(--accent); }
.orbit-ring.r1 { inset:0; animation:spin 12s linear infinite; }
.orbit-ring.r2 { inset:24px; border-style:dashed; animation:spin 9s linear infinite reverse; }
.orbit-ring.r3 { inset:50px; opacity:.55; animation:spin 7s linear infinite; }
.orbit-core { width:94px; height:94px; display:grid; place-items:center; border-radius:32px; background:radial-gradient(circle at 30% 18%,rgba(255,255,255,.38),transparent 22%),linear-gradient(145deg,var(--accent-3),var(--accent-2)); color:var(--accent-text); box-shadow:0 0 55px rgba(67,238,168,.22); animation:float 4s ease-in-out infinite; }
.orbit-core b { font-size:46px; line-height:1; }
.orbit-core small { position:absolute; bottom:10px; font-size:8px; font-weight:900; }
.float-chip { position:absolute; min-width:86px; padding:8px 10px; border:1px solid var(--border); border-radius:13px; background:rgba(7,17,12,.82); color:var(--accent); font-size:9px; font-weight:800; text-align:center; box-shadow:0 15px 30px rgba(0,0,0,.18); }
:root.light .float-chip { background:rgba(255,255,255,.90); }
.float-chip.c1 { top:10px; left:-8px; animation:floatA 4.3s ease-in-out infinite; }
.float-chip.c2 { right:-18px; top:47%; animation:floatB 5s ease-in-out infinite; }
.float-chip.c3 { bottom:4px; left:17px; animation:floatA 5.4s ease-in-out infinite reverse; }

.clarity-note { margin-top:13px; padding:14px; display:grid; grid-template-columns:40px 1fr auto; gap:11px; align-items:center; border-color:rgba(255,211,105,.18); }
.note-icon { width:40px; height:40px; display:grid; place-items:center; border-radius:13px; background:rgba(255,211,105,.1); color:var(--warning); font-weight:900; }
.clarity-note strong { font-size:12px; }
.clarity-note p { margin:2px 0 0; color:var(--muted); font-size:9px; }
.clarity-note button { border:0; background:transparent; color:var(--warning); cursor:pointer; font-weight:800; font-size:9px; }

.stats-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; margin-top:13px; }
.stat-card { min-height:132px; padding:15px; }
.stat-card small,.stat-card span { display:block; color:var(--muted); font-size:9px; }
.stat-card strong { display:block; margin:5px 0; color:var(--accent); font-size:26px; font-weight:900; }

.section { margin-top:26px; }
.section-head,.page-head { display:flex; justify-content:space-between; gap:13px; align-items:flex-start; }
.section-head { margin-bottom:11px; }
.section-head small,.page-head small { display:block; color:var(--accent); font-size:9px; letter-spacing:1.2px; }
.section-head h3 { margin:1px 0 0; font-size:21px; }
.section-head > span { color:var(--muted-2); font-size:10px; letter-spacing:2px; }
.feature-grid { display:grid; gap:9px; }
.feature-card { min-height:155px; padding:15px; text-align:right; color:var(--text); cursor:pointer; }
.feature-card > b { width:42px; height:42px; display:grid; place-items:center; margin-bottom:20px; border:1px solid rgba(67,238,168,.16); border-radius:14px; background:rgba(67,238,168,.08); color:var(--accent); font-size:19px; }
.feature-card strong,.feature-card small { display:block; }
.feature-card strong { font-size:14px; }
.feature-card small { max-width:85%; color:var(--muted); font-size:9px; }
.feature-card i { position:absolute; left:14px; bottom:13px; color:var(--accent); font-style:normal; }
.feature-card:hover { border-color:var(--border-strong); transform:translateY(-2px); }

.progress-card { margin-top:13px; padding:17px; display:flex; justify-content:space-between; gap:16px; align-items:center; }
.progress-card small,.progress-card strong { display:block; }
.progress-card small { color:var(--muted); font-size:9px; }
.progress-card strong { color:var(--accent); font-size:25px; }
.progress-card p { margin:3px 0 0; color:var(--muted); font-size:9px; }
.progress-ring,.result-ring { position:relative; flex:0 0 auto; width:78px; height:78px; display:grid; place-items:center; border-radius:50%; background:radial-gradient(circle closest-side,var(--panel-solid) 73%,transparent 74% 99%),conic-gradient(var(--accent) calc(var(--progress) * 1%),rgba(255,255,255,.06) 0); }
.progress-ring span { font-size:10px; font-weight:800; }
.daily-card { margin-top:12px; padding:15px; display:grid; grid-template-columns:44px 1fr; gap:11px; align-items:center; }
.daily-icon { width:44px; height:44px; display:grid; place-items:center; border-radius:15px; background:rgba(67,238,168,.1); color:var(--accent); }
.daily-card small,.daily-card strong { display:block; }
.daily-card small { color:var(--accent); font-size:8px; }
.daily-card strong { font-size:10px; }

.page-head { margin:10px 2px 17px; align-items:center; }
.page-head h2 { margin:1px 0 4px; font-size:31px; line-height:1.25; font-weight:900; }
.page-head p { margin:0; color:var(--muted); font-size:10px; }
.refresh-btn,.print-btn { flex:0 0 auto; min-width:45px; height:45px; display:grid; place-items:center; border:1px solid var(--border); border-radius:14px; background:var(--panel); color:var(--accent); cursor:pointer; font-weight:800; }
.refresh-btn.loading { animation:spin .7s linear infinite; }
.level-pill,.score-badge { flex:0 0 auto; padding:7px 10px; border:1px solid var(--border); border-radius:13px; background:var(--panel); color:var(--accent); font-size:9px; font-weight:800; }

.market-status { padding:14px; display:flex; align-items:center; justify-content:space-between; gap:13px; }
.market-status > div:first-child { display:grid; grid-template-columns:auto 1fr; column-gap:8px; align-items:center; }
.market-status strong,.market-status small { display:block; }
.market-status strong { font-size:11px; }
.market-status small { grid-column:2; color:var(--muted); font-size:8px; }
.live-dot { width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 0 rgba(67,238,168,.45); animation:ping 1.8s infinite; }
.market-summary { text-align:left; }
.market-summary span,.market-summary b { display:block; }
.market-summary span { color:var(--muted); font-size:8px; }
.market-summary b { color:var(--accent); font-size:19px; }
.market-controls,.academy-toolbar { display:grid; grid-template-columns:1fr auto; gap:8px; margin:11px 0; }
.input-wrap { position:relative; display:flex; align-items:center; }
.input-wrap > span { position:absolute; right:13px; color:var(--muted); pointer-events:none; }
.input-wrap input { width:100%; height:48px; padding:0 42px 0 13px; border:1px solid var(--border); border-radius:15px; outline:none; background:var(--panel); color:var(--text); }
.input-wrap input:focus { border-color:var(--border-strong); box-shadow:0 0 0 3px rgba(67,238,168,.05); }
select { min-height:48px; padding:0 11px; border:1px solid var(--border); border-radius:15px; outline:none; background:var(--panel-solid); color:var(--text); }
.market-list { display:grid; gap:8px; }
.market-row { display:grid; grid-template-columns:1.2fr .9fr .8fr; align-items:center; gap:8px; padding:12px; }
.market-row:hover { transform:translateY(-2px); border-color:var(--border-strong); }
.market-symbol { display:flex; align-items:center; gap:9px; }
.coin-dot { width:39px; height:39px; display:grid; place-items:center; border:1px solid rgba(67,238,168,.14); border-radius:13px; background:linear-gradient(145deg,rgba(67,238,168,.16),rgba(67,238,168,.03)); color:var(--accent); font-size:9px; font-weight:900; }
.market-symbol strong,.market-symbol small,.market-value strong,.market-value small { display:block; }
.market-symbol strong { font-size:10px; }
.market-symbol small { color:var(--muted); font-size:8px; }
.sparkline { width:86px; height:31px; overflow:visible; }
.sparkline path { fill:none; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; }
.market-value { text-align:left; direction:ltr; }
.market-value strong { font-size:10px; }
.market-value small { font-size:8px; }
.positive { color:var(--positive) !important; }
.negative { color:var(--negative) !important; }
.market-disclaimer { margin-top:11px; padding:13px; color:var(--muted); font-size:9px; }
.market-skeleton { height:64px; overflow:hidden; background:linear-gradient(90deg,var(--panel),rgba(255,255,255,.05),var(--panel)); background-size:200% 100%; animation:skeleton 1.2s linear infinite; }

.module-list { display:grid; gap:9px; }
.module-card { padding:14px; }
.module-head { display:grid; grid-template-columns:47px 1fr auto; gap:10px; align-items:center; }
.module-number { width:47px; height:47px; display:grid; place-items:center; border:1px solid rgba(67,238,168,.18); border-radius:15px; background:rgba(67,238,168,.08); color:var(--accent); font-weight:900; }
.module-head strong,.module-head small { display:block; }
.module-head strong { font-size:13px; }
.module-head small { color:var(--muted); font-size:8px; }
.module-progress { text-align:left; }
.module-progress b { display:block; color:var(--accent); font-size:11px; }
.module-progress span { color:var(--muted); font-size:8px; }
.module-summary { margin:11px 0; color:var(--muted); font-size:9px; }
.module-actions { display:flex; gap:8px; align-items:center; }
.module-actions button { min-height:39px; padding:8px 12px; border:1px solid var(--border); border-radius:12px; background:var(--panel-2); color:var(--text); cursor:pointer; font-size:9px; font-weight:700; }
.module-actions .open-module { background:rgba(67,238,168,.1); color:var(--accent); border-color:rgba(67,238,168,.16); }
.lesson-list { display:none; margin-top:12px; border-top:1px solid var(--border); padding-top:10px; }
.module-card.open .lesson-list { display:grid; gap:7px; animation:viewIn .3s ease; }
.lesson-row { width:100%; display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:9px; padding:10px; border:1px solid var(--border); border-radius:13px; background:rgba(255,255,255,.018); color:var(--text); text-align:right; cursor:pointer; }
.lesson-row .lesson-state { width:28px; height:28px; display:grid; place-items:center; border:1px solid var(--border); border-radius:9px; color:var(--muted); font-size:8px; }
.lesson-row.completed .lesson-state { border-color:var(--accent); background:var(--accent); color:var(--accent-text); }
.lesson-row strong { display:block; font-size:10px; }
.lesson-row small { color:var(--muted); font-size:8px; }
.lesson-row > span:last-child { color:var(--accent); }

.exam-setup { padding:17px; }
.exam-setup h3 { margin-bottom:14px; }
.exam-setup label { display:grid; gap:6px; margin-bottom:12px; color:var(--muted); font-size:9px; }
.exam-setup select { width:100%; }
.switch-row { display:flex !important; align-items:center; gap:9px !important; padding:10px; border:1px solid var(--border); border-radius:13px; background:rgba(255,255,255,.018); color:var(--text) !important; }
.switch-row input { width:18px; height:18px; accent-color:var(--accent); }
.exam-progress { display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; padding:11px 13px; }
.exam-progress span,.exam-progress b { font-size:9px; }
.exam-progress b { color:var(--accent); }
.exam-progress > div { height:5px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.06); }
.exam-progress i { display:block; width:0; height:100%; border-radius:inherit; background:var(--accent); transition:width .3s ease; }
.question-card { margin-top:10px; padding:18px; }
.question-category { display:inline-flex; padding:4px 9px; border-radius:999px; background:rgba(67,238,168,.09); color:var(--accent); font-size:8px; }
.question-card h3 { margin:13px 0; font-size:18px; line-height:1.65; }
.answer-list { display:grid; gap:8px; }
.answer-btn { display:grid; grid-template-columns:31px 1fr; gap:10px; align-items:center; padding:11px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.018); color:var(--text); text-align:right; cursor:pointer; }
.answer-btn span { width:31px; height:31px; display:grid; place-items:center; border-radius:10px; background:var(--panel-2); color:var(--muted); font-size:9px; }
.answer-btn.correct { border-color:rgba(67,238,168,.34); background:rgba(67,238,168,.08); }
.answer-btn.correct span { background:var(--accent); color:var(--accent-text); }
.answer-btn.wrong { border-color:rgba(255,117,128,.32); background:rgba(255,117,128,.07); }
.answer-btn.wrong span { background:var(--danger); color:#fff; }
.answer-btn:disabled { cursor:default; }
.answer-explanation { display:none; margin:10px 0; padding:11px; border-radius:13px; background:var(--panel-2); color:var(--muted); font-size:9px; }
.answer-explanation.show { display:block; animation:viewIn .25s ease; }
.result-hero { padding:18px; display:grid; grid-template-columns:92px 1fr; gap:15px; align-items:center; }
.result-ring { width:92px; height:92px; background:radial-gradient(circle closest-side,var(--panel-solid) 72%,transparent 73% 99%),conic-gradient(var(--accent) calc(var(--score) * 1%),rgba(255,255,255,.06) 0); }
.result-ring strong { font-size:16px; }
.result-hero small { color:var(--accent); font-size:8px; }
.result-hero h3 { margin:2px 0; }
.result-hero p { margin:0; color:var(--muted); font-size:9px; }
.weakness-list { margin:10px 0; padding:15px; }
.weakness-list h3 { font-size:13px; }
.weak-row { display:grid; grid-template-columns:80px 1fr auto; gap:8px; align-items:center; margin-top:9px; font-size:8px; }
.weak-row > div { height:6px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.06); }
.weak-row i { display:block; height:100%; background:var(--accent); }

.tool-tabs { display:flex; gap:6px; overflow-x:auto; padding-bottom:3px; scrollbar-width:none; }
.tool-tabs::-webkit-scrollbar { display:none; }
.tool-tabs button { flex:0 0 auto; padding:8px 12px; border:1px solid var(--border); border-radius:12px; background:var(--panel); color:var(--muted); cursor:pointer; font-size:9px; }
.tool-tabs button.active { border-color:rgba(67,238,168,.2); background:rgba(67,238,168,.1); color:var(--accent); }
.tool-panel { display:none; margin-top:10px; padding:17px; }
.tool-panel.active { display:block; animation:viewIn .3s ease; }
.form-grid { display:grid; gap:9px; }
.form-grid label { display:grid; gap:5px; color:var(--muted); font-size:8px; }
.form-grid input,.form-grid select { width:100%; min-height:44px; padding:0 11px; border:1px solid var(--border); border-radius:13px; outline:none; background:var(--panel-solid); color:var(--text); }
.tool-result { margin-top:11px; min-height:58px; padding:12px; border:1px solid var(--border); border-radius:14px; background:var(--panel-2); color:var(--muted); font-size:10px; }
.tool-result strong { color:var(--accent); font-size:17px; }
.leverage-head { display:flex; justify-content:space-between; align-items:center; }
.leverage-head strong { color:var(--accent); font-size:27px; direction:ltr; }
.leverage-head span:last-child { font-size:9px; }
#leverageRange { width:100%; margin:15px 0; accent-color:var(--accent); }
.leverage-meter { position:relative; height:9px; border-radius:999px; background:linear-gradient(90deg,var(--accent),var(--warning),var(--danger)); direction:ltr; }
.leverage-meter i { position:absolute; left:4%; top:50%; width:17px; height:17px; border:3px solid var(--panel-solid); border-radius:50%; background:var(--text); transform:translate(-50%,-50%); transition:left .22s ease; }

.faq-search { margin-bottom:11px; }
.faq-list { display:grid; gap:8px; }
.faq-item { padding:0; }
.faq-question { width:100%; display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; padding:13px; border:0; background:transparent; color:var(--text); text-align:right; cursor:pointer; font-weight:700; font-size:10px; }
.faq-question span { color:var(--accent); font-size:16px; transition:transform .2s ease; }
.faq-answer { display:none; padding:0 13px 13px; color:var(--muted); font-size:9px; }
.faq-item.open .faq-answer { display:block; animation:viewIn .25s ease; }
.faq-item.open .faq-question span { transform:rotate(45deg); }

.jurisdiction-card { display:grid; grid-template-columns:44px 1fr; gap:12px; padding:16px; border-color:rgba(255,211,105,.18); }
.jurisdiction-card > span { width:44px; height:44px; display:grid; place-items:center; border-radius:14px; background:rgba(255,211,105,.1); color:var(--warning); font-weight:900; }
.jurisdiction-card strong { font-size:12px; }
.jurisdiction-card p { margin:3px 0 0; color:var(--muted); font-size:9px; }
.community-section { margin-top:11px; padding:15px; }
.section-head.compact { margin-bottom:5px; }
.community-note { margin-bottom:11px; color:var(--muted); font-size:9px; }
.community-list { display:grid; gap:8px; }
.community-row { display:grid; grid-template-columns:42px 1fr auto; gap:10px; align-items:center; padding:10px; border:1px solid var(--border); border-radius:13px; background:rgba(255,255,255,.018); }
.community-row > span { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:rgba(67,238,168,.1); color:var(--accent); font-weight:900; }
.community-row strong,.community-row small { display:block; }
.community-row strong { font-size:10px; }
.community-row small { color:var(--muted); font-size:8px; }
.community-row a { text-decoration:none; color:var(--accent); font-size:9px; }
.source-grid { display:grid; gap:8px; margin-top:11px; }
.source-card { display:grid; grid-template-columns:43px 1fr auto; gap:10px; align-items:center; padding:12px; text-decoration:none; }
.source-card > span { width:43px; height:43px; display:grid; place-items:center; border:1px solid rgba(67,238,168,.15); border-radius:13px; background:rgba(67,238,168,.07); color:var(--accent); font-weight:900; font-size:10px; }
.source-card strong,.source-card small { display:block; }
.source-card strong { font-size:10px; }
.source-card small { color:var(--muted); font-size:8px; }
.source-card i { color:var(--accent); font-style:normal; }
.license-note { margin-top:11px; padding:15px; }
.license-note strong { color:var(--warning); font-size:11px; }
.license-note p { margin:4px 0 0; color:var(--muted); font-size:9px; }

.bottom-nav {
  position:fixed;
  z-index:50;
  right:50%;
  bottom:max(9px,var(--safe-bottom));
  width:min(calc(100% - 18px),880px);
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:2px;
  padding:6px;
  border-radius:22px;
  transform:translateX(50%);
}
.nav-indicator { position:absolute; top:6px; right:6px; width:calc((100% - 12px)/7); height:calc(100% - 12px); border:1px solid rgba(67,238,168,.13); border-radius:14px; background:rgba(67,238,168,.09); transition:transform .34s cubic-bezier(.22,.8,.25,1); pointer-events:none; }
.nav-item { position:relative; z-index:2; display:grid; justify-items:center; gap:1px; padding:6px 1px; border:0; border-radius:13px; background:transparent; color:var(--muted); cursor:pointer; }
.nav-item b { font-size:17px; line-height:1; transition:transform .2s ease; }
.nav-item small { font-size:7px; }
.nav-item.active { color:var(--accent); }
.nav-item.active b { transform:translateY(-2px) scale(1.08); }

.modal,.search-modal { position:fixed; inset:0; z-index:100; display:grid; align-items:end; opacity:0; visibility:hidden; transition:opacity .25s ease,visibility .25s ease; }
.modal.open,.search-modal.open { opacity:1; visibility:visible; }
.modal-backdrop { position:absolute; inset:0; border:0; background:rgba(0,0,0,.66); backdrop-filter:blur(8px); cursor:pointer; }
.modal-sheet,.search-sheet { position:relative; z-index:2; width:min(100%,900px); margin:0 auto; padding:23px 17px calc(21px + var(--safe-bottom)); border-radius:28px 28px 0 0; transform:translateY(105%); transition:transform .4s cubic-bezier(.22,.8,.25,1); }
.modal.open .modal-sheet,.search-modal.open .search-sheet { transform:none; }
.modal-handle { width:44px; height:4px; margin:-9px auto 17px; border-radius:999px; background:var(--border); }
.modal-close { position:absolute; top:13px; left:14px; width:36px; height:36px; border:1px solid var(--border); border-radius:12px; background:var(--panel-2); color:var(--muted); cursor:pointer; }
.modal-sheet > small { color:var(--accent); font-size:8px; }
.modal-sheet h3 { margin:4px 0 10px; font-size:20px; }
.modal-body { max-height:48vh; overflow-y:auto; margin-bottom:13px; color:var(--muted); font-size:10px; white-space:pre-line; }
.search-modal { align-items:start; padding-top:max(70px,env(safe-area-inset-top)); }
.search-sheet { width:min(calc(100% - 20px),760px); padding:15px; border-radius:22px; transform:translateY(-25px); }
.search-modal.open .search-sheet { transform:none; }
.search-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.search-top button { width:35px; height:35px; border:1px solid var(--border); border-radius:11px; background:var(--panel-2); color:var(--muted); cursor:pointer; }
.global-results { max-height:55vh; overflow-y:auto; display:grid; gap:7px; margin-top:10px; }
.global-result { padding:10px; border:1px solid var(--border); border-radius:13px; background:rgba(255,255,255,.018); cursor:pointer; }
.global-result small,.global-result strong { display:block; }
.global-result small { color:var(--accent); font-size:7px; }
.global-result strong { font-size:10px; }
.global-result p { margin:3px 0 0; color:var(--muted); font-size:8px; }
.toast { position:fixed; z-index:200; left:50%; bottom:calc(102px + var(--safe-bottom)); max-width:calc(100% - 28px); padding:10px 14px; border:1px solid var(--border); border-radius:14px; background:var(--panel-solid); box-shadow:var(--shadow); opacity:0; transform:translate(-50%,12px); pointer-events:none; transition:opacity .25s ease,transform .25s ease; font-size:9px; }
.toast.show { opacity:1; transform:translate(-50%,0); }

.reveal { opacity:0; transform:translateY(16px); transition:opacity .65s cubic-bezier(.22,.8,.25,1),transform .65s cubic-bezier(.22,.8,.25,1); }
.reveal.visible { opacity:1; transform:none; }

@media (min-width:680px) {
  .hero { grid-template-columns:1.18fr .82fr; min-height:455px; padding:34px; }
  .hero-visual { min-height:320px; }
  .stats-grid { grid-template-columns:repeat(4,1fr); }
  .feature-grid { grid-template-columns:repeat(3,1fr); }
  .form-grid { grid-template-columns:repeat(2,1fr); }
  .source-grid { grid-template-columns:repeat(2,1fr); }
}

@media (max-width:500px) {
  .app-shell { padding-left:10px; padding-right:10px; }
  .brand small { display:none; }
  .search-launch kbd { display:none; }
  .hero { min-height:555px; }
  .clarity-note { grid-template-columns:38px 1fr; }
  .clarity-note button { grid-column:2; justify-self:start; }
  .market-row { grid-template-columns:1.15fr .6fr .75fr; }
  .sparkline { width:58px; }
  .page-head h2 { font-size:27px; }
  .nav-item small { font-size:6.5px; }
  .nav-item b { font-size:15px; }
}

@media print {
  #ambientCanvas,.splash,.topbar,.search-launch,.bottom-nav,.hero-visual,.hero-actions,.refresh-btn,.print-btn,.modal,.search-modal,.toast { display:none !important; }
  body { background:#fff; color:#111; }
  .app-shell { width:100%; padding:0; opacity:1; transform:none; }
  .view { display:block !important; page-break-after:always; }
  .card,.glass { background:#fff; box-shadow:none; border-color:#ddd; }
  p,small { color:#444 !important; }
}

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

@keyframes spin { to { transform:rotate(360deg); } }
@keyframes spinDot { to { transform:rotate(360deg); } }
@keyframes pulse { 50% { transform:scale(1.055); } }
@keyframes loader { from { transform:translateX(160%); } to { transform:translateX(-260%); } }
@keyframes viewIn { from { opacity:0; transform:translateY(10px) scale(.995); } to { opacity:1; transform:none; } }
@keyframes aurora { to { transform:translate3d(130px,110px,0) scale(1.17); } }
@keyframes shimmer { to { background-position:-200% center; } }
@keyframes float { 50% { transform:translateY(-9px) rotate(2deg); } }
@keyframes floatA { 50% { transform:translateY(-10px) rotate(1deg); } }
@keyframes floatB { 50% { transform:translateY(10px) rotate(-1deg); } }
@keyframes ping { 70%,100% { box-shadow:0 0 0 8px rgba(67,238,168,0); } }
@keyframes skeleton { to { background-position:-200% 0; } }


/* ===== Ultimate v4 typography, animation and AI ===== */
html { font-size: 17px; }
body { font-size: 1rem; font-weight: 500; line-height: 1.9; }
.brand small { font-size: .68rem; font-weight: 800; }
.brand strong { font-size: 1.05rem; font-weight: 900; }
.search-launch strong { font-size: .95rem; font-weight: 900; }
.search-launch small { font-size: .78rem; }
.badge { font-size: .72rem; font-weight: 800; }
.hero h2 { font-size: clamp(2.75rem, 9.5vw, 4.6rem); line-height: 1.13; }
.hero p { font-size: 1.03rem; font-weight: 600; max-width: 620px; }
.hero-trust { font-size: .76rem; font-weight: 700; }
.primary-btn,.secondary-btn,.telegram-btn { font-size: .95rem; font-weight: 900; }
.stat-card small,.stat-card span { font-size: .78rem; font-weight: 700; }
.stat-card strong { font-size: 2.1rem; }
.section-head small,.page-head small { font-size: .73rem; font-weight: 900; }
.section-head h3 { font-size: 1.65rem; font-weight: 900; }
.page-head h2 { font-size: clamp(2rem, 7vw, 3.15rem); font-weight: 900; }
.page-head p { font-size: .93rem; font-weight: 600; max-width: 650px; }
.feature-card strong { font-size: 1.12rem; font-weight: 900; }
.feature-card small { font-size: .82rem; font-weight: 600; }
.progress-card small,.progress-card p,.daily-card small { font-size: .8rem; }
.daily-card strong { font-size: .98rem; }
.market-status strong { font-size: .98rem; font-weight: 900; }
.market-status small,.market-summary span { font-size: .74rem; }
.market-summary b { font-size: 1.5rem; }
.market-symbol strong,.market-value strong { font-size: .94rem; font-weight: 900; }
.market-symbol small,.market-value small { font-size: .76rem; }
.module-head strong { font-size: 1.12rem; font-weight: 900; }
.module-head small,.module-progress span { font-size: .75rem; }
.module-progress b { font-size: .95rem; }
.module-summary { font-size: .9rem; font-weight: 600; }
.module-actions button { font-size: .86rem; font-weight: 900; }
.lesson-row strong { font-size: .95rem; font-weight: 900; }
.lesson-row small { font-size: .73rem; }
.question-card h3 { font-size: 1.45rem; font-weight: 900; }
.answer-btn { font-size: .98rem; font-weight: 800; }
.answer-explanation { font-size: .9rem; }
.tool-tabs button,.form-grid label,.faq-question,.faq-answer,.source-card strong,.source-card small,.license-note p { font-size: .9rem; }
.faq-question { font-weight: 900; }
.modal-sheet h3 { font-size: 1.65rem; font-weight: 900; }
.modal-body { font-size: 1rem; line-height: 2; }
.nav-item small { font-size: .68rem; font-weight: 800; }
.nav-item b { font-size: 1.25rem; }

.hero { animation: heroEntrance .9s cubic-bezier(.16,.8,.25,1) both; }
.hero-glow { animation: auroraDrift 8s ease-in-out infinite alternate; }
.orbit { animation: orbitFloat 5s ease-in-out infinite; }
.feature-card { transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .25s ease, box-shadow .35s ease; }
.feature-card:hover { transform: translateY(-7px) scale(1.012); box-shadow: 0 26px 70px rgba(0,0,0,.28); }
.feature-card > b { animation: iconBreath 3.8s ease-in-out infinite; }
.stat-card { transition: transform .3s ease; }
.stat-card:hover { transform: translateY(-4px); }
.market-row { animation: rowIn .42s ease both; }
.ai-feature-launch { border-color: rgba(67,238,168,.3); background: linear-gradient(145deg,rgba(67,238,168,.1),rgba(255,255,255,.02)),var(--panel); }

.market-controls-v4 { grid-template-columns: minmax(0,1fr) auto auto; }
.market-controls select { min-height: 48px; font-size: .82rem; font-weight: 800; }
.load-more-btn { margin-top: 12px; }

.official-cta,.official-hub { display:grid; gap:18px; align-items:center; padding:22px; margin-top:14px; border-color:rgba(67,238,168,.22); background:linear-gradient(135deg,rgba(67,238,168,.09),transparent 48%),var(--panel); }
.official-cta { grid-template-columns:1fr auto; }
.official-cta small,.official-hub small { color:var(--accent); font-size:.72rem; font-weight:900; letter-spacing:1px; }
.official-cta h3,.official-hub h3 { margin:2px 0 4px; font-size:1.5rem; font-weight:900; }
.official-cta p,.official-hub p { margin:0; font-size:.9rem; }
.official-hub-actions { display:flex; flex-wrap:wrap; gap:10px; }
.telegram-btn { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 16px; border:1px solid rgba(49,168,229,.35); border-radius:15px; background:rgba(49,168,229,.12); color:#73cfff; text-decoration:none; }

.ai-fab { position:fixed; z-index:80; right:max(18px,calc((100vw - 900px)/2 + 18px)); bottom:calc(104px + var(--safe-bottom)); width:62px; height:62px; display:grid; place-items:center; border:1px solid rgba(67,238,168,.35); border-radius:22px; background:linear-gradient(145deg,var(--accent-3),var(--accent-2)); color:var(--accent-text); box-shadow:0 18px 50px rgba(18,184,117,.35); cursor:pointer; animation:aiFloat 3.5s ease-in-out infinite; }
.ai-fab span { font-size:1rem; font-weight:900; }
.ai-fab i { position:absolute; inset:-7px; border:1px solid rgba(67,238,168,.25); border-radius:27px; animation:aiPulse 2.2s ease-out infinite; }
.ai-panel { position:fixed; inset:0; z-index:120; visibility:hidden; opacity:0; transition:opacity .28s ease,visibility .28s ease; }
.ai-panel.open { visibility:visible; opacity:1; }
.ai-backdrop { position:absolute; inset:0; border:0; background:rgba(0,0,0,.62); backdrop-filter:blur(9px); }
.ai-sheet { position:absolute; right:50%; bottom:0; width:min(100%,900px); height:min(86vh,760px); display:grid; grid-template-rows:auto auto 1fr auto auto; border-radius:30px 30px 0 0; transform:translate(50%,105%); transition:transform .45s cubic-bezier(.16,.8,.25,1); overflow:hidden; }
.ai-panel.open .ai-sheet { transform:translate(50%,0); }
.ai-header { display:grid; grid-template-columns:52px 1fr 42px; gap:12px; align-items:center; padding:16px; border-bottom:1px solid var(--border); }
.ai-avatar { position:relative; width:50px; height:50px; display:grid; place-items:center; border-radius:17px; background:linear-gradient(145deg,var(--accent-3),var(--accent-2)); color:var(--accent-text); font-weight:900; }
.ai-avatar i { position:absolute; inset:-4px; border:1px solid rgba(67,238,168,.25); border-radius:20px; animation:spin 8s linear infinite; }
.ai-header small { display:block; color:var(--accent); font-size:.65rem; font-weight:900; }
.ai-header strong { display:block; font-size:1.05rem; font-weight:900; }
.ai-header span { display:block; color:var(--muted); font-size:.72rem; }
.ai-header > button { width:40px; height:40px; border:1px solid var(--border); border-radius:13px; background:var(--panel-2); color:var(--text); font-size:1.25rem; cursor:pointer; }
.ai-suggestions { display:flex; gap:8px; overflow-x:auto; padding:10px 14px; border-bottom:1px solid var(--border); scrollbar-width:none; }
.ai-suggestions button { flex:0 0 auto; padding:8px 12px; border:1px solid var(--border); border-radius:999px; background:var(--panel-2); color:var(--text); font-size:.78rem; font-weight:800; cursor:pointer; }
.ai-messages { overflow-y:auto; display:flex; flex-direction:column; gap:12px; padding:16px; }
.ai-message { display:flex; }
.ai-message > div { max-width:88%; padding:13px 15px; border-radius:18px; font-size:.94rem; line-height:1.9; white-space:pre-wrap; }
.ai-message.assistant { justify-content:flex-start; }
.ai-message.assistant > div { border:1px solid var(--border); background:var(--panel-2); border-bottom-right-radius:5px; }
.ai-message.user { justify-content:flex-end; }
.ai-message.user > div { background:linear-gradient(135deg,var(--accent-3),var(--accent-2)); color:var(--accent-text); border-bottom-left-radius:5px; font-weight:700; }
.ai-message.loading > div::after { content:'•••'; letter-spacing:4px; animation:typing 1.2s steps(3,end) infinite; }
.ai-sources { display:grid; gap:5px; margin-top:9px; padding-top:9px; border-top:1px solid var(--border); }
.ai-sources a { color:var(--accent); font-size:.75rem; font-weight:800; text-decoration:none; }
.ai-composer { display:grid; grid-template-columns:1fr 48px; gap:8px; padding:12px 14px; border-top:1px solid var(--border); }
.ai-composer textarea { width:100%; max-height:120px; resize:none; padding:11px 13px; border:1px solid var(--border); border-radius:15px; outline:none; background:var(--panel-2); color:var(--text); font-size:.95rem; font-weight:600; }
.ai-composer textarea:focus { border-color:var(--border-strong); }
.ai-composer button { border:0; border-radius:15px; background:var(--accent); color:var(--accent-text); font-size:1.3rem; font-weight:900; cursor:pointer; }
.ai-footer { padding:0 14px 10px; color:var(--muted); font-size:.68rem; text-align:center; }

@keyframes heroEntrance { from { opacity:0; transform:translateY(24px) scale(.98); } to { opacity:1; transform:none; } }
@keyframes auroraDrift { from { transform:translate3d(-8%,0,0) scale(.9); } to { transform:translate3d(18%,20%,0) scale(1.25); } }
@keyframes orbitFloat { 0%,100% { transform:translateY(0) rotate(-1deg); } 50% { transform:translateY(-12px) rotate(1deg); } }
@keyframes iconBreath { 0%,100% { box-shadow:0 0 0 rgba(67,238,168,0); } 50% { box-shadow:0 0 28px rgba(67,238,168,.13); } }
@keyframes rowIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@keyframes aiFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
@keyframes aiPulse { 0% { transform:scale(.86); opacity:.8; } 100% { transform:scale(1.25); opacity:0; } }
@keyframes typing { 0% { opacity:.2; } 50% { opacity:1; } 100% { opacity:.2; } }

@media (min-width:700px) {
  .official-hub { grid-template-columns:1fr auto; }
  .ai-sheet { bottom:18px; height:min(82vh,740px); border-radius:30px; }
}
@media (max-width:620px) {
  html { font-size:16px; }
  .official-cta { grid-template-columns:1fr; }
  .market-controls-v4 { grid-template-columns:1fr 1fr; }
  .market-controls-v4 .input-wrap { grid-column:1/-1; }
  .hero p { font-size:.95rem; }
  .ai-fab { right:14px; width:56px; height:56px; bottom:calc(98px + var(--safe-bottom)); }
}
@media (prefers-reduced-motion:reduce) {
  .ai-fab,.hero,.orbit,.hero-glow,.feature-card > b { animation:none !important; }
}
