:root {
  --background: #09090b;
  --surface: rgba(255, 255, 255, 0.035);
  --surface-hover: rgba(255, 255, 255, 0.065);
  --text: #f5f5f7;
  --text-secondary: #92929a;
  --text-muted: #66666f;
  --border: rgba(255, 255, 255, 0.075);
  --accent-1: #8b5cf6;
  --accent-2: #4f7cff;
  --accent-soft: rgba(139, 92, 246, 0.08);
  --glow-1: rgba(139, 92, 246, 0.12);
  --glow-2: rgba(79, 124, 255, 0.035);
  --shadow: rgba(0, 0, 0, 0.16);
}

body.color-galaxy { --accent-1:#8b5cf6; --accent-2:#4f7cff; --accent-soft:rgba(139,92,246,.13); --glow-1:rgba(139,92,246,.18); --glow-2:rgba(79,124,255,.05); }
body.color-gold   { --accent-1:#f5c451; --accent-2:#d89a2b; --accent-soft:rgba(245,196,81,.12); --glow-1:rgba(245,196,81,.15); --glow-2:rgba(216,154,43,.05); }
body.color-mint   { --accent-1:#54d7b0; --accent-2:#2fb7a0; --accent-soft:rgba(84,215,176,.11); --glow-1:rgba(84,215,176,.135); --glow-2:rgba(47,183,160,.05); }
body.color-sky    { --accent-1:#59b9ff; --accent-2:#3986ee; --accent-soft:rgba(89,185,255,.115); --glow-1:rgba(89,185,255,.15); --glow-2:rgba(57,134,238,.05); }

body.light-mode {
  --background: #f5f5f7;
  --surface: rgba(255,255,255,.68);
  --surface-hover: rgba(255,255,255,.88);
  --text: #17171a;
  --text-secondary: #68686f;
  --text-muted: #96969d;
  --border: rgba(0,0,0,.08);
  --shadow: rgba(0,0,0,.08);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  min-height:100vh;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 50% -10%, var(--glow-1), transparent 38%),
    radial-gradient(circle at 15% 45%, var(--glow-2), transparent 32%),
    var(--background);
  -webkit-font-smoothing:antialiased;
  transition:background-color 300ms ease, color 300ms ease;
}

a { color:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }

.utility-buttons {
  position:fixed;
  top:24px;
  right:24px;
  z-index:50;
  display:flex;
  align-items:center;
  gap:10px;
}

#theme-toggle, #color-toggle {
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--border);
  border-radius:50%;
  background:linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)), var(--surface);
  color:var(--text);
  cursor:pointer;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 8px 28px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.045);
  transition:transform 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
#theme-toggle { font-size:17px; }
#color-toggle svg { width:18px; height:18px; display:block; }
#theme-toggle:hover, #color-toggle:hover { transform:scale(1.06); background:var(--surface-hover); box-shadow:0 10px 30px rgba(0,0,0,.12), 0 0 22px var(--accent-soft), inset 0 1px 0 rgba(255,255,255,.055); }
#theme-toggle:active, #color-toggle:active { transform:scale(.94); }

.color-panel {
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  width:154px;
  padding:9px;
  border:1px solid var(--border);
  border-radius:17px;
  background:linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.02)), var(--surface);
  backdrop-filter:blur(24px) saturate(135%);
  -webkit-backdrop-filter:blur(24px) saturate(135%);
  box-shadow:0 20px 55px var(--shadow), 0 0 42px var(--accent-soft), inset 0 1px 0 rgba(255,255,255,.05);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-6px) scale(.97);
  transform-origin:top right;
  transition:opacity 170ms ease, transform 170ms cubic-bezier(.22,1,.36,1), visibility 170ms ease;
}
.color-panel.is-open { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0) scale(1); }
.color-panel-title { margin:2px 7px 7px; color:var(--text-muted); font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.color-option { width:100%; display:flex; align-items:center; gap:9px; padding:8px; border:0; border-radius:11px; background:transparent; color:var(--text-secondary); font:inherit; font-size:12px; font-weight:500; cursor:pointer; text-align:left; transition:background 160ms ease, color 160ms ease, transform 160ms ease; }
.color-option:hover, .color-option.active { background:var(--surface-hover); color:var(--text); }
.color-option:hover { transform:translateX(1px); }
.color-swatch { width:13px; height:13px; flex:0 0 13px; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(255,255,255,.22), 0 0 10px currentColor; }
.color-swatch.galaxy { color:#7d72ff; background:linear-gradient(135deg,#8b5cf6,#4f7cff); }
.color-swatch.gold { color:#e8ad39; background:linear-gradient(135deg,#f5c451,#d89a2b); }
.color-swatch.mint { color:#4ac7a5; background:linear-gradient(135deg,#54d7b0,#2fb7a0); }
.color-swatch.sky { color:#4ea6f5; background:linear-gradient(135deg,#59b9ff,#3986ee); }

.page { width:min(920px, calc(100% - 32px)); margin:0 auto; padding:30px 0 56px; }
.home-button {
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:11px 15px;
  margin-bottom:58px;
  border:1px solid transparent;
  border-radius:14px;
  text-decoration:none;
  font-size:12px;
  font-weight:700;
  letter-spacing:.01em;
  color:#fff;
  background:linear-gradient(135deg, var(--accent-1), var(--accent-2));
  box-shadow:0 8px 34px var(--accent-soft), inset 0 1px 0 rgba(255,255,255,.17);
  transition:transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
}
.home-button:hover { transform:translateY(-2px); filter:brightness(1.05); box-shadow:0 12px 38px var(--accent-soft), inset 0 1px 0 rgba(255,255,255,.18); }
.home-button:active { transform:translateY(0) scale(.98); }

.hero { max-width:760px; margin-bottom:28px; }
.hero.compact { margin-bottom:24px; }
.eyebrow { display:inline-block; font-size:11px; letter-spacing:.14em; color:var(--text-muted); font-weight:700; }
h1 { margin:0 0 14px; font-size:clamp(38px, 7vw, 68px); line-height:1.01; letter-spacing:-.045em; }
.hero.compact h1 { margin-top:10px; font-size:clamp(30px, 5.5vw, 48px); }
.hero p, .summary, #message { margin:0; color:var(--text-secondary); line-height:1.7; font-size:16px; }

.research-list { display:grid; gap:16px; }
.research-card, .panel, .stat-card {
  background:linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)), var(--surface);
  border:1px solid var(--border);
  box-shadow:0 20px 50px var(--shadow), 0 0 44px var(--accent-soft);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-radius:24px;
}
body.light-mode .research-card, body.light-mode .panel, body.light-mode .stat-card {
  background:linear-gradient(145deg, rgba(255,255,255,.65), rgba(255,255,255,.35)), var(--surface);
}
.research-card { padding:28px; }
.card-top, .panel-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; }
.card-heading { min-width:0; }
.status, .live-badge { display:inline-flex; align-items:center; gap:8px; color:var(--accent-1); font-size:11px; font-weight:700; letter-spacing:.12em; }
.status-dot { width:7px; height:7px; border-radius:50%; background:currentColor; box-shadow:0 0 16px currentColor; }
h2 { margin:10px 0 0; font-size:clamp(24px, 4vw, 34px); line-height:1.15; letter-spacing:-.025em; }
.card-number { color:var(--text-muted); font-size:13px; font-weight:700; }
.author-line { display:flex; align-items:center; gap:8px; margin-top:18px; color:var(--text-muted); font-size:12px; }
.author-line strong { color:var(--text-secondary); font-weight:650; }
.summary { margin-top:14px; }
.actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:24px; }
.primary, .secondary { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:13px 17px; border-radius:14px; text-decoration:none; font-weight:700; border:1px solid var(--border); transition:transform 180ms ease, filter 180ms ease, background 180ms ease, border-color 180ms ease; }
.primary { gap:8px; color:#fff; background:linear-gradient(135deg, var(--accent-1), var(--accent-2)); border-color:transparent; box-shadow:0 8px 30px var(--accent-soft), inset 0 1px 0 rgba(255,255,255,.16); }
.primary:hover { transform:translateY(-2px); filter:brightness(1.04); }
.primary:active { transform:scale(.98); }
.secondary { color:var(--text); background:rgba(255,255,255,.04); }
.secondary:hover { transform:translateY(-2px); background:var(--surface-hover); }
.note { margin:16px 0 0; color:var(--text-muted); font-size:12px; line-height:1.6; }

/* ---------- Görsel yükleme ---------- */
.image-reveal {
  opacity: 0;
  visibility: hidden;
  transform: scale(.94);
  transition: opacity 280ms ease, transform 280ms cubic-bezier(.22,1,.36,1);
}

.image-reveal.is-loaded {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}

.forms-logo-wrap {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.012)), var(--tag-background);
  border: 1px solid var(--tag-border);
  box-shadow: 0 0 18px var(--accent-soft), inset 0 1px 0 rgba(255,255,255,.03);
}

.forms-logo {
  width: 22px;
  height: 22px;
  display: block;
  object-fit: contain;
}

.note-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
}

.note-row .note {
  margin: 0;
}

.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:18px 0; }
.stat-card { padding:18px; }
.stat-card span { display:block; color:var(--text-secondary); font-size:12px; line-height:1.4; }
.stat-card strong { display:block; margin-top:8px; color:var(--text); font-size:25px; letter-spacing:-.03em; }
.panel { margin-top:12px; padding:24px; }
footer { margin-top:54px; text-align:center; color:var(--text-muted); font-size:12px; }

@media (max-width:760px) {
  .page { padding-top:22px; }
  .utility-buttons { top:16px; right:16px; }
  #theme-toggle, #color-toggle { width:42px; height:42px; }
  .home-button { margin-bottom:38px; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:500px) {
  .page { width:min(100% - 20px, 920px); }
  .home-button { font-size:12px; padding:10px 13px; }
  .research-card, .panel { padding:20px; border-radius:20px; }
  .card-top { gap:14px; }
  .card-number { display:none; }
  .actions { flex-direction:column; }
  .primary, .secondary { width:100%; }
  .stats-grid { gap:9px; }
  .stat-card { padding:15px; }
}

/* ===== Ayrıntılı sonuç paneli ===== */
.results-page { width:min(1080px, calc(100% - 40px)); }
.results-hero { max-width:900px; }
.eyebrow-row { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:10px; }
.results-hero h1 { font-size:clamp(38px, 6vw, 66px); margin-bottom:18px; }
.live-badge { white-space:nowrap; }
.primary-stats { grid-template-columns:repeat(4, 1fr); gap:14px; margin:24px 0; }
.featured-stat { position:relative; overflow:hidden; }
.featured-stat::after { content:""; position:absolute; width:140px; height:140px; right:-70px; bottom:-85px; border-radius:50%; background:var(--accent-soft); filter:blur(10px); pointer-events:none; }
.stat-card small { display:block; margin-top:8px; color:var(--text-muted); font-size:11px; line-height:1.45; }
.dashboard-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.wide-panel { min-width:0; }
.dashboard-grid .wide-panel:first-child,
.dashboard-grid .wide-panel:nth-child(2),
.dashboard-grid .wide-panel:nth-child(3),
.dashboard-grid .wide-panel:nth-child(4),
.dashboard-grid .wide-panel:nth-child(5),
.dashboard-grid .wide-panel:nth-child(6) { grid-column:span 2; }
.panel-heading { margin-bottom:18px; }
.panel-note { color:var(--text-muted); font-size:11px; }
.privacy-notice { margin-bottom:16px; padding:11px 13px; border:1px solid var(--tag-border); border-radius:13px; background:rgba(255,255,255,.025); color:var(--text-muted); font-size:11px; line-height:1.55; }
.distribution-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
.distribution-card, .insight-card { padding:16px; border:1px solid var(--tag-border); border-radius:17px; background:linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.01)), var(--tag-background); }
.distribution-title { margin-bottom:13px; color:var(--text); font-size:13px; font-weight:650; }
.bar-row + .bar-row { margin-top:12px; }
.bar-label, .chart-meta { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; color:var(--text-secondary); font-size:12px; line-height:1.45; }
.bar-label strong, .chart-meta strong { color:var(--text); font-weight:650; white-space:nowrap; }
.bar-track, .chart-track { width:100%; height:7px; margin-top:6px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.055); }
.bar-track span, .chart-track span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg, var(--accent-1), var(--accent-2)); box-shadow:0 0 14px var(--accent-soft); }
.insight-cards { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; margin-bottom:12px; }
.insight-card span { display:block; color:var(--text-muted); font-size:11px; }
.insight-card strong { display:block; margin-top:7px; color:var(--text); font-size:15px; line-height:1.35; }
.chart-list { display:grid; gap:15px; }
.chart-row { padding:11px 13px 12px; border:1px solid var(--tag-border); border-radius:15px; background:rgba(255,255,255,.018); }
.likert-row .chart-track { height:8px; }
.time .chart-track span { background:linear-gradient(90deg, var(--accent-2), var(--accent-1)); }
.score-summary { display:flex; align-items:center; gap:18px; padding:15px; margin-bottom:16px; border:1px solid var(--tag-border); border-radius:18px; background:rgba(255,255,255,.018); }
.score-summary strong { display:block; color:var(--text); font-size:14px; }
.score-summary p { margin:5px 0 0; color:var(--text-secondary); font-size:12px; line-height:1.5; }
.score-ring { --score:0%; width:82px; height:82px; flex:0 0 82px; display:grid; place-items:center; position:relative; border-radius:50%; background:conic-gradient(var(--accent-1) var(--score), rgba(255,255,255,.07) 0); box-shadow:0 0 28px var(--accent-soft); font-weight:750; }
.score-ring::before { content:""; position:absolute; inset:7px; border-radius:50%; background:var(--background); }
.score-ring > * { position:relative; z-index:1; }
.score-ring span { font-size:20px; }
.score-ring small { margin-left:2px; font-size:10px; color:var(--text-muted); }
.locked-card { grid-column:1 / -1; padding:24px; text-align:center; border:1px dashed var(--border); border-radius:18px; background:rgba(255,255,255,.018); }
.locked-card .lock-icon { width:34px; height:34px; display:grid; place-items:center; margin:0 auto 10px; border-radius:50%; background:var(--accent-soft); color:var(--accent-1); font-size:18px; }
.locked-card strong { display:block; color:var(--text); font-size:13px; }
.locked-card p { max-width:560px; margin:6px auto 0; color:var(--text-muted); font-size:11px; line-height:1.55; }
.compact-lock { text-align:left; padding:18px; }
.compact-lock strong, .compact-lock p { margin-left:0; max-width:none; }
.panel-footnote { margin:15px 0 0; color:var(--text-muted); font-size:11px; line-height:1.55; }
.methodology-panel { margin-top:14px; }
.methodology-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin-top:17px; }
.methodology-grid > div { padding:14px; border:1px solid var(--tag-border); border-radius:15px; background:rgba(255,255,255,.018); }
.methodology-grid span { display:block; color:var(--text-muted); font-size:10px; }
.methodology-grid strong { display:block; margin-top:5px; color:var(--text-secondary); font-size:12px; line-height:1.35; }

@media (max-width:900px) {
  .results-page { width:min(100% - 28px, 1080px); }
  .primary-stats { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:700px) {
  .dashboard-grid, .distribution-grid { grid-template-columns:1fr; }
  .dashboard-grid .wide-panel:first-child,
  .dashboard-grid .wide-panel:nth-child(2),
  .dashboard-grid .wide-panel:nth-child(3),
  .dashboard-grid .wide-panel:nth-child(4),
  .dashboard-grid .wide-panel:nth-child(5),
  .dashboard-grid .wide-panel:nth-child(6) { grid-column:span 1; }
  .insight-cards, .methodology-grid { grid-template-columns:1fr; }
  .eyebrow-row { align-items:flex-start; flex-direction:column; }
  .primary-stats { gap:9px; }
}
@media (max-width:500px) {
  .results-page { width:calc(100% - 20px); }
  .results-hero h1 { font-size:34px; }
  .primary-stats { grid-template-columns:repeat(2,1fr); }
  .stat-card strong { font-size:21px; }
  .distribution-card, .insight-card, .chart-row { padding:14px; }
  .score-summary { align-items:flex-start; }
}