:root{color-scheme:light}body{margin:0;background:#f4f6f2}#na-history-demo{max-width:1200px;margin:0 auto}button:focus-visible,a:focus-visible{outline:3px solid #548647;outline-offset:3px}
#na-history-demo{max-width:1260px}#na-history-demo header{padding:22px 30px}.brand{text-decoration:none;color:inherit}.brand small{display:block;font-size:10px;letter-spacing:2px;margin-top:5px}.brandmark{display:flex;align-items:center;justify-content:center;background:#143c35;color:#d2efa2;border-radius:12px;width:43px;height:43px;font-size:35px}.header-note{font-size:13px;color:#60756e}.pill{font-size:12px;border:1px solid #dce5de;border-radius:30px;padding:6px 12px}.history-site-nav{display:flex;gap:24px;align-items:center;padding:15px 30px;border-bottom:1px solid #dce5de;font-size:14px}.history-site-nav a{color:#173e35;text-decoration:none}.history-site-nav span{font-weight:700}.history-site-nav a:hover{text-decoration:underline}@media(max-width:690px){.header-note,.pill{display:none}.history-site-nav{padding:14px 16px;gap:18px}}
.seo-guide{max-width:1200px;margin:24px auto;padding:20px 30px;border-top:1px solid #dce4df;color:#143c35;line-height:1.7}.seo-guide h2{font-size:1.2rem;margin:0 0 12px}.seo-guide p{max-width:85ch}.seo-guide summary{cursor:pointer;font-weight:600}.seo-links{display:flex;flex-wrap:wrap;gap:10px 20px;margin:16px 0}.seo-links a{color:#245b4d;text-underline-offset:3px;font-size:14px}@media(max-width:690px){.seo-guide{padding:20px 16px}}

#na-history-demo{--paper:light-dark(#f4f6f2,#142520);--panel:light-dark(#fff,#20352e);--ink:light-dark(#173e35,#e5eee8);--sub:light-dark(#60756e,#afc3b7);--line:light-dark(#dce5de,#3d5449);--hero:#143d33;--lime:#d5f1a8;background:var(--paper);color:var(--ink);font:16px/1.65 system-ui,sans-serif;border-radius:18px;overflow:hidden}
#na-history-demo *{box-sizing:border-box}#na-history-demo button,#na-history-demo select,#na-history-demo textarea{font:inherit}#na-history-demo button{cursor:pointer;min-height:44px}#na-history-demo button:disabled{opacity:.45;cursor:default}#na-history-demo header{padding:22px 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:16px;flex-wrap:wrap}#na-history-demo .brand{display:flex;gap:10px;align-items:center;font-weight:700;font-size:23px;letter-spacing:-1px}#na-history-demo .mark{background:var(--hero);color:var(--lime);border-radius:11px;padding:0 10px;font-size:30px}#na-history-demo .tag{font-size:12px;color:var(--sub);border:1px solid var(--line);padding:5px 12px;border-radius:30px}#na-history-demo .wrap{padding:26px 30px 32px}#na-history-demo h1{font-size:clamp(30px,5vw,48px);line-height:1.1;letter-spacing:-1.7px;margin:12px 0 18px}#na-history-demo h2{font-size:23px;letter-spacing:-.6px;line-height:1.35;margin:0 0 14px}#na-history-demo h3{font-size:18px;line-height:1.4;margin:12px 0}#na-history-demo p{margin:10px 0}#na-history-demo .muted{color:var(--sub)}#na-history-demo .eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase}#na-history-demo .hero{padding:34px;background:var(--hero);color:#f4f8ed;border-radius:19px;display:grid;grid-template-columns:1.65fr 1fr;gap:30px;align-items:center}#na-history-demo .hero p{color:#c4d6cb;max-width:47ch}#na-history-demo .hero .eyebrow{color:var(--lime)}#na-history-demo .timeline{border-left:1px solid #668676;padding-left:22px;display:grid;gap:22px}#na-history-demo .timeline span{color:var(--lime);font-size:12px;display:block}#na-history-demo .primary{background:var(--hero);color:#f5f8ef;border:0;padding:12px 19px;border-radius:10px;font-weight:600}#na-history-demo .hero .primary{background:var(--lime);color:#143d33;margin-top:16px}#na-history-demo .secondary{background:var(--panel);color:var(--ink);border:1px solid var(--line);padding:10px 16px;border-radius:10px}#na-history-demo .link{background:transparent;color:var(--ink);border:0;padding:5px 0}#na-history-demo .section-head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:30px 0 16px;flex-wrap:wrap}#na-history-demo .section-head h2{margin:0}#na-history-demo .topics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}#na-history-demo .topic{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;align-items:start}#na-history-demo .topic p{color:var(--sub);flex:1}#na-history-demo .num{color:var(--sub);font-size:12px}#na-history-demo .topic button{margin-top:16px;width:100%;text-align:left}#na-history-demo .tip{padding:18px 0;margin-top:16px;border-top:1px solid var(--line);color:var(--sub);font-size:13px}#na-history-demo .question-layout{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:22px}#na-history-demo .question{background:var(--panel);padding:27px;border:1px solid var(--line);border-radius:16px}#na-history-demo .answers{display:grid;gap:9px;margin:22px 0}#na-history-demo .option{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:10px;display:flex;align-items:center;gap:14px;padding:12px 15px;text-align:left;width:100%}#na-history-demo .option[aria-pressed=true]{background:var(--hero);color:#f6f9ee;border-color:var(--hero)}#na-history-demo .option span{display:grid;place-items:center;min-width:28px;height:28px;border:1px solid var(--line);border-radius:7px}#na-history-demo .actions{display:flex;justify-content:space-between;gap:9px;flex-wrap:wrap;margin-top:20px}#na-history-demo .map{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:15px 0}#na-history-demo .map button{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:7px;min-height:35px;padding:0}#na-history-demo .map button.answered{background:var(--hero);color:#fff}#na-history-demo .map button.current{outline:2px solid var(--sub);outline-offset:1px}#na-history-demo progress{width:100%;height:7px;accent-color:#568469;margin:10px 0 22px}#na-history-demo .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}#na-history-demo .stat{background:var(--panel);padding:16px;border-radius:12px;border:1px solid var(--line)}#na-history-demo .stat b{font-size:29px;display:block}#na-history-demo .answer-review{padding:14px;background:var(--paper);border-left:3px solid #74985b;margin:18px 0}#na-history-demo .status{font-weight:600;color:var(--ink)}#na-history-demo textarea,#na-history-demo select{width:100%;padding:10px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:8px}#na-history-demo .report{margin-top:16px;border-top:1px solid var(--line);padding-top:16px}#na-history-demo .report label{display:block;margin:10px 0}#na-history-demo .toast{margin:16px 30px;padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}#na-history-demo footer{padding:16px 30px;border-top:1px solid var(--line);color:var(--sub);font-size:12px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}#na-history-demo [hidden]{display:none!important}#na-history-demo .history-row{display:flex;gap:20px;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:16px 0;flex-wrap:wrap}
@media(max-width:690px){#na-history-demo .hero{grid-template-columns:1fr;padding:25px}#na-history-demo .timeline{display:none}#na-history-demo .topics{grid-template-columns:1fr}#na-history-demo .question-layout{grid-template-columns:1fr}#na-history-demo .wrap{padding:20px 16px}#na-history-demo header{padding:17px}#na-history-demo .question{padding:19px}#na-history-demo .stats{grid-template-columns:repeat(2,1fr)}#na-history-demo .map{grid-template-columns:repeat(10,1fr)}#na-history-demo .map button{min-height:36px}#na-history-demo .question-layout aside .map{grid-template-columns:repeat(6,1fr)}}

#na-history-demo .subjects{display:flex;gap:8px;margin:0 0 22px;overflow-x:auto;padding:2px}
#na-history-demo .subject{text-decoration:none;min-width:0}
#na-history-demo .subject{display:flex;align-items:center;gap:13px;border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:12px 18px;border-radius:12px;font-weight:650;white-space:nowrap}
#na-history-demo .subject span{font-size:11px;font-weight:400}
#na-history-demo .subject.selected{background:var(--hero);color:var(--lime);border-color:var(--hero)}
#na-history-demo .subject:disabled{opacity:.65}
#na-history-demo .card-top{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:5px}
#na-history-demo .topic-number{font-size:23px;font-weight:600;letter-spacing:-1px;color:#69836d}
#na-history-demo .topic h3{margin-bottom:4px}
#na-history-demo .topic p{font-size:14px}
#na-history-demo .topic:hover{border-color:#98b19c}
#na-history-demo .completed{font-size:12px;color:#386c40}
#na-history-demo .continue{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid #afc99e;background:#eaf2e1;border-radius:13px;padding:18px 22px;margin-top:20px}
#na-history-demo .continue p{margin:4px 0}
@media(min-width:691px) and (max-width:980px){#na-history-demo .topics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:690px){#na-history-demo .subjects{gap:6px}#na-history-demo .subject{padding:10px 13px;display:grid;gap:0}#na-history-demo .hero h1{font-size:38px}#na-history-demo .section-head .tag{white-space:normal}#na-history-demo .topic{padding:20px}}


/* Ana sayfayla ortak ölçüler ve yazı hiyerarşisi. */
body { background: #f4f6f4; }
#na-history-demo {
  max-width: 1344px;
  border-radius: 0;
  --paper: #f4f6f4;
  --ink: #20332f;
  --sub: #6c7974;
  --line: #dee5df;
  --hero: #143c35;
  --lime: #d2efa2;
  font: 16px/1.5 'DM Sans', Arial, sans-serif;
}
#na-history-demo header {
  height: 100px;
  padding: 0 42px;
  flex-wrap: nowrap;
}
#na-history-demo .brand {
  gap: 11px;
  font: 800 23px/1.15 Manrope, Arial, sans-serif;
  letter-spacing: -.8px;
  flex-shrink: 0;
}
#na-history-demo .brand small {
  font: 600 10px 'DM Sans', Arial, sans-serif;
  letter-spacing: 2.1px;
  margin-top: 7px;
}
#na-history-demo .brandmark {
  width: 43px;
  height: 43px;
  font-size: 35px;
  line-height: 1;
  letter-spacing: -5px;
  padding: 0 7px 5px 0;
}
#na-history-demo .brandmark span { font-size: 27px; }
#na-history-demo .header-note { font-size: 14px; }
#na-history-demo .pill {
  display: block;
  background: #fff;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 25px;
}
#na-history-demo .history-site-nav {
  max-width: 1260px;
  margin: 0 auto;
  padding: 14px 0 0;
  gap: 12px;
  align-items: stretch;
  overflow-x: auto;
}
#na-history-demo .history-site-nav > * {
  padding: 14px 15px;
  border-bottom: 2px solid transparent;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--sub);
  white-space: nowrap;
  flex-shrink: 0;
}
#na-history-demo .history-site-nav [aria-current="page"] {
  color: var(--hero);
  border-bottom-color: #225c48;
}
#na-history-demo .wrap { max-width: 1260px; margin: 0 auto; padding: 44px 0 64px; }
#na-history-demo h1, #na-history-demo h2, #na-history-demo h3 {
  font-family: Manrope, Arial, sans-serif;
}
#na-history-demo .hero h1 { font-size: 38px; line-height: 1.25; letter-spacing: -1.4px; }
#na-history-demo .section-head h2 { font-size: 19px; }
#na-history-demo .topic h3 { font-size: 20px; }
#na-history-demo .subjects { flex-wrap: wrap; gap: 10px; overflow: visible; }
#na-history-demo .subject { min-height: 52px; font-size: 15px; font-weight: 600; }
#na-history-demo .subject span { font-size: 12px; }
#na-history-demo .subject:disabled { opacity: 1; color: var(--sub); background: #f8faf8; }
#na-history-demo footer { max-width: 1260px; margin: 0 auto; padding: 24px 0; }
@media (min-width: 1500px) { #na-history-demo .wrap { padding-top: 55px; } }
@media (max-width: 1340px) {
  #na-history-demo .history-site-nav, #na-history-demo .wrap, #na-history-demo footer { margin-left: 40px; margin-right: 40px; }
}
@media (max-width: 1000px) { #na-history-demo .header-note { display: none; } }
@media (max-width: 760px) {
  #na-history-demo header { height: 83px; padding: 0 20px; }
  #na-history-demo .brand { font-size: 20px; }
  #na-history-demo .brand small { font-size: 9px; }
  #na-history-demo .pill { font-size: 10px; padding: 6px 9px; }
  #na-history-demo .history-site-nav { margin: 0 20px; gap: 3px; }
  #na-history-demo .history-site-nav > * { padding: 13px 10px; font-size: 13px; }
  #na-history-demo .wrap { margin: 0; padding: 29px 20px 40px; }
  #na-history-demo .hero h1 { font-size: 30px; }
  #na-history-demo .subjects { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  #na-history-demo .subject { display: grid; justify-content: start; text-align: left; gap: 2px; padding: 10px 13px; }
  #na-history-demo footer { margin: 0 20px; flex-direction: column; font-size: 11px; }
}
@media (max-width: 450px) { #na-history-demo .pill { max-width: 120px; text-align: center; } }

#na-history-demo .topic a.primary{display:block;width:100%;text-align:center;text-decoration:none;margin-top:16px}#na-history-demo .hero .primary{display:inline-block;text-decoration:none}.catalog-note{line-height:1.7;padding:18px 0}.catalog-nav{display:flex;gap:12px;flex-wrap:wrap;padding:16px 30px}.catalog-nav a{color:#245b4d}#na-history-demo footer{display:none}