/* Kaynak tema: 9. sınıf Tarih "Geçmişin İnşa Sürecinde Tarih" PDF paleti.
   Örneklenen kaynak renkleri (PDF vektör dolguları ve render):
   krem zemin #fcf7e9, başlık bandı #f9dccd, turuncu #f47f50,
   koyu tuğla #9c351f, açık bej kutu #f7e6d0, ders başlığı #ee6b3a,
   tual çizgi #d8d2c9.
   Düğme geometrisi, kontrol modeli ve gezinme yeniden tasarlanmaz; yalnız renk. */
:root{
  --orange:#f47f50;
  --rust:#9f3424;
  --cream:#fcf7e9;
  --peach:#f9dccd;
  --gray:#ecebed;
  --ink:#282726;
  --accent:#c14f28;
  --tint:#fff5ee;
  --line:#ddd6d0;
}
body{background:#f2efe9}
.masthead{background:var(--cream);border-right:20px solid var(--orange)}
.brand{background:#f47f50}
.hero-mark{left:178px;top:38px;width:136px;height:136px;border-radius:50%;object-fit:cover;opacity:1;z-index:2;background:#fcf7e9}
.subject strong{color:#ee6b3a;font-size:36px;letter-spacing:.02em;line-height:1}
.subject span{display:block;color:#282726;margin-top:6px;font-size:15px;font-weight:700}
.grade{color:#9c351f}
.grade .squares{color:#9c351f}
.masthead:after{background:#9c351f;width:64px;height:22px}
.course-title{color:#221f1f}
#sections button{background:#f3eeea;color:#5c504a}
#sections button.active{background:var(--peach);border-bottom-color:var(--rust);color:#843c26}
.page{background:#fff}
.question-navigation{background:var(--cream);border-bottom-color:#e3d6c8}
.question-navigation button{color:#756557}
.question-navigation button[aria-current]{background:var(--peach);border-bottom-color:var(--rust);color:var(--rust)}
.start-button{background:var(--rust);border-color:var(--rust);border-bottom-color:#702417}
.start-button:hover{background:#b03c2a}
.example-toggle{background:#fff;border-color:#c99a86;color:var(--rust)}
.example-toggle:hover:not(:disabled){background:#fbeee6}
.page-arrow{background:#f47f50}
.page-arrow:hover{background:#e06b37}
.flow-text small{color:#806454}
.flow-number{border-color:#d1997f;color:var(--rust)}
.activity-flow li+li:before{background:#e4c9b8}
.activity-flow button{border-color:#e3d3c7;color:#4d423c}
.activity-flow button[aria-current]{background:#fceadf;border-color:#e0a583}
.feedback{background:#fbeee5;border-left-color:#f47f50}
.feedback strong{color:#9f3424}
.exit-feedback,.library-cards .card{border-color:#e6cfbf}
@media(hover:hover){
  .start-button:hover{background:#b03c2a}
  .page-arrow:hover{background:#e06b37}
  .question-navigation button:hover{background:#fce8dc;color:var(--rust)}
}
@media(max-width:560px){
  .subject{right:10px;top:10px}
  .subject strong{font-size:22px}
  .subject span{font-size:11px;max-width:190px;margin-top:3px}
  .hero-mark{left:104px;top:56px;width:84px;height:84px}
  .brand img{width:88px;left:100px;top:118px}
  .grade{font-size:13px;right:10px;bottom:6px}
  .grade .squares i{width:8px;height:8px}
}
@media(max-width:430px){
  /* Uzun bölüm adları 360 px'te tek kelime olarak sığsın diye harf aralığı sıfırlanır. */
  #sections button{font-size:9.5px;letter-spacing:0;padding:10px 3px}
  .subject strong{font-size:18px}
}