/* YÖKDİL Hazırlık (/yokdil). Renkler ve ölçüler site.css'teki tasarım belirteçlerinden gelir
 * (--ink, --paper-card, --line, --good, --bad...); gece görünümü bu yüzden ayrıca tanımlanmaz. */
.yk{max-width:880px; margin:0 auto; padding:56px 24px 90px;}
.yk h3{font-size:16px; margin:0 0 4px;}
.yk-muted{color:var(--ink-soft); font-size:13px;}
.yk-ok{color:var(--good); font-weight:600;}
.yk-row{display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap;}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

/* ---------- Giriş ---------- */
.yk-facts{display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:0 0 18px;}
.yk-facts li{
  background:var(--paper-card); border:1px solid var(--line); border-radius:100px;
  padding:6px 14px; font-size:13.5px; color:var(--ink-soft);
}
.yk-facts strong{color:var(--ink);}
.yk-exam{padding:0; margin-bottom:40px;}
.yk-exam summary, .yk-tips summary, .yk-wordlist summary{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:16px 22px; cursor:pointer; list-style:none;
}
.yk-exam summary::-webkit-details-marker, .yk-tips summary::-webkit-details-marker,
.yk-wordlist summary::-webkit-details-marker, .yk-week summary::-webkit-details-marker,
.yk-review-item summary::-webkit-details-marker{display:none;}
.yk-exam summary::after, .yk-tips summary::after, .yk-wordlist summary::after, .yk-week summary::after{
  content:""; width:8px; height:8px; flex-shrink:0; margin-right:4px;
  border-right:2px solid var(--ink-soft); border-bottom:2px solid var(--ink-soft);
  transform:rotate(45deg); transition:transform .15s;
}
.yk-exam[open] > summary::after, .yk-tips[open] > summary::after,
.yk-wordlist[open] > summary::after, .yk-week[open] > summary::after{transform:rotate(-135deg);}
.yk-exam summary h2{font-size:15px; margin:0;}
.yk-exam > :not(summary){margin-left:22px; margin-right:22px;}
.yk-exam .yk-exam-note{margin-top:12px; margin-bottom:20px; font-size:12.5px;}

/* ---------- Seviye seçimi ---------- */
.yk-section-title{font-size:20px; margin:0 0 14px;}
.yk-level-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;}
.yk-level{
  display:flex; flex-direction:column; gap:6px; text-align:left;
  background:var(--paper-card); color:var(--ink); border:1.5px solid var(--line); border-radius:16px;
  padding:18px 18px 16px; font:inherit; transition:border-color .15s, box-shadow .15s;
}
.yk-level:hover{border-color:var(--brass);}
.yk-level[aria-pressed="true"]{border-color:var(--ink); box-shadow:0 0 0 1px var(--ink);}
.yk-level-top{display:flex; align-items:center; justify-content:space-between; gap:8px;}
.yk-level-code{
  display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:28px; padding:0 10px;
  border-radius:100px; background:var(--ink); color:var(--paper-card); font-weight:700; font-size:14px;
}
.yk-level-target{font-size:12px; font-weight:600; color:var(--accent);}
.yk-level-title{font-size:17px; font-weight:700; margin-top:4px;}
.yk-level-who{font-size:13px; color:var(--ink-soft); line-height:1.5; flex:1;}
.yk-level-meta{font-size:12px; color:var(--sage); font-weight:600; margin-top:4px;}
.yk-placement-cta{font-size:13.5px; color:var(--ink-soft); margin:14px 0 0;}
.yk-placement-cta .link-btn{font-size:13.5px; padding:2px 0;}

/* ---------- Seviye alanı ---------- */
.yk-placement, .yk-panel{margin-top:44px; scroll-margin-top:72px;}
.yk-panel-head{margin-bottom:18px;}
.yk-panel-title{font-size:26px; margin:0 0 6px;}
.yk-panel-mode{font-size:14px; color:var(--ink-soft); margin:0; max-width:680px;}
.yk-panel-mode strong{color:var(--ink);}
.yk-tabs{
  display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:22px;
  overflow-x:auto; scrollbar-width:none;
}
.yk-tabs::-webkit-scrollbar{display:none;}
.yk-tab{
  background:none; border:none; border-bottom:2px solid transparent; margin-bottom:-1px;
  padding:10px 14px; font-size:14.5px; font-weight:600; color:var(--ink-soft); white-space:nowrap;
}
.yk-tab:hover{color:var(--ink);}
.yk-tab[aria-selected="true"]{color:var(--ink); border-bottom-color:var(--ink);}
.yk-tabpanel{scroll-margin-top:72px;}

.yk-progress{height:6px; border-radius:100px; background:var(--paper-alt); overflow:hidden; margin:10px 0 4px;}
.yk-progress > span{display:block; height:100%; width:0; background:var(--good); border-radius:inherit; transition:width .25s;}

/* Plan */
.yk-routine{list-style:none; padding:0; margin:12px 0 0; display:grid; gap:8px;}
.yk-routine li{display:flex; gap:12px; align-items:baseline; font-size:14.5px;}
.yk-routine-time{
  flex-shrink:0; min-width:56px; text-align:center; font-size:12px; font-weight:700;
  background:var(--field); border-radius:100px; padding:3px 8px; color:var(--walnut);
}
.yk-weeks{margin-top:14px; border-top:1px solid var(--line-soft);}
.yk-week{border-bottom:1px solid var(--line-soft);}
.yk-week summary{
  display:flex; align-items:center; gap:10px; padding:12px 2px; cursor:pointer; list-style:none;
  font-size:14.5px; font-weight:600;
}
.yk-week summary > span:first-child{flex:1;}
.yk-week-count{font-size:12px; font-weight:600; color:var(--ink-soft); background:var(--field); border-radius:100px; padding:2px 9px;}
.yk-week-count.is-done{background:color-mix(in srgb, var(--good) 16%, transparent); color:var(--good);}
.yk-tasks{list-style:none; padding:0 0 8px; margin:0;}
.yk-tasks .check{margin:0 0 10px; font-size:14px; color:var(--ink); cursor:pointer;}
.yk-tasks .check input:checked + span{color:var(--ink-soft); text-decoration:line-through;}
.yk-tips{padding:0;}
.yk-tips summary h3, .yk-wordlist summary h3{margin:0;}
.yk-tips dl{margin:0; padding:0 22px 20px;}
.yk-tips dt{font-weight:700; font-size:14px; margin-top:12px;}
.yk-tips dd{margin:2px 0 0; font-size:14px; color:var(--ink-soft);}

/* Kelime kartları */
.yk-flash-help{margin:6px 0 16px;}
.yk-flash{
  border:1px solid var(--line); border-radius:14px; background:var(--page);
  padding:30px 20px 24px; text-align:center; min-height:200px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
}
.yk-flash-word{font-size:clamp(26px, 5vw, 34px); font-weight:700; margin:0; letter-spacing:-0.01em; overflow-wrap:anywhere;}
.yk-flash-tr{font-size:18px; font-weight:600; margin:10px 0 0; color:var(--walnut);}
.yk-flash-ex{font-size:14.5px; margin:4px 0 0; color:var(--ink-soft); font-style:italic; max-width:520px;}
.yk-flash-ask{font-size:13px; margin:10px 0 0; color:var(--ink-soft);}
.yk-dots{display:flex; gap:5px; margin:4px 0 0;}
.yk-dots span{width:8px; height:8px; border-radius:50%; background:var(--paper-alt);}
.yk-dots span.is-on{background:var(--good);}
.yk-flash-actions{display:flex; gap:10px; justify-content:center; margin-top:16px; flex-wrap:wrap;}
.yk-flash-actions .btn{min-width:150px;}
.yk-wordlist{padding:0;}
.yk-wordlist .yk-table-wrap{padding:0 22px 20px;}

/* Tablolar */
.yk-table-wrap{overflow-x:auto;}
.yk-table{width:100%; border-collapse:collapse; font-size:14px;}
.yk-table th{text-align:left; font-size:12px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-soft); font-weight:600; padding:8px 10px 8px 0; border-bottom:1px solid var(--line);}
.yk-table td{padding:9px 10px 9px 0; border-bottom:1px solid var(--line-soft); vertical-align:top;}
.yk-table tr:last-child td{border-bottom:none;}

/* Alıştırma */
.yk-chips{display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:10px; margin-top:4px;}
.yk-chip{
  display:flex; flex-direction:column; gap:2px; text-align:left;
  background:var(--page); border:1px solid var(--line); border-radius:12px; padding:12px 14px;
  font:inherit; color:var(--ink); transition:border-color .15s, background .15s;
}
.yk-chip:hover:not(:disabled){border-color:var(--ink);}
.yk-chip:disabled{opacity:.5; cursor:default;}
.yk-chip-label{font-weight:700; font-size:14.5px;}
.yk-chip-sub{font-size:12.5px; color:var(--ink-soft);}

/* Soru ekranı */
.yk-quiz{background:var(--paper-card); border:1px solid var(--line); border-radius:16px; padding:22px 26px 24px;}
.yk-quiz-head{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.yk-quiz-head .link-btn{padding:4px 0;}
.yk-quiz-count{flex:1; font-size:13px; font-weight:600; color:var(--ink-soft); text-align:center;}
.yk-timer{font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--ink); min-width:64px; text-align:right;}
.yk-timer.is-warn{color:var(--accent);}
.yk-strip{display:flex; flex-wrap:wrap; gap:5px; margin:12px 0 4px;}
.yk-strip-btn{
  width:30px; height:30px; border-radius:8px; border:1px solid var(--line); background:var(--page);
  font-size:12px; font-weight:600; color:var(--ink-soft); padding:0;
}
.yk-strip-btn.is-answered{background:var(--field); color:var(--ink);}
.yk-strip-btn.is-current{border-color:var(--ink); color:var(--ink); box-shadow:0 0 0 1px var(--ink);}
.yk-type{font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--sage); font-weight:700; margin:18px 0 10px;}
.yk-passage{
  background:var(--page); border:1px solid var(--line-soft); border-radius:12px;
  padding:16px 18px; font-size:15px; line-height:1.7; margin-bottom:14px;
}
.yk-stem{font-size:17px; line-height:1.65; margin:0 0 6px;}
.yk-source{margin:0 0 6px; padding:2px 0 2px 16px; border-left:3px solid var(--brass-soft); font-weight:500;}
.yk-blank{display:inline-block; width:4.2em; border-bottom:2px solid var(--ink); margin:0 3px; vertical-align:baseline; height:1em;}
.yk-prompt{font-size:13px; color:var(--ink-soft); margin:8px 0 14px;}
.yk-options{display:grid; gap:8px; margin-top:12px;}
.yk-option{
  display:flex; align-items:flex-start; gap:12px; width:100%; text-align:left;
  background:var(--page); border:1.5px solid var(--line); border-radius:12px;
  padding:11px 14px; font:inherit; font-size:15px; line-height:1.5; color:var(--ink);
  transition:border-color .12s, background .12s;
}
.yk-option:hover:not(:disabled){border-color:var(--brass);}
.yk-option:disabled{cursor:default;}
.yk-letter{
  flex-shrink:0; width:26px; height:26px; border-radius:50%; margin-top:-1px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1.5px solid var(--line); font-size:12.5px; font-weight:700; color:var(--ink-soft);
}
.yk-option.is-selected{border-color:var(--ink); background:var(--field);}
.yk-option.is-selected .yk-letter{background:var(--ink); border-color:var(--ink); color:var(--paper-card);}
.yk-option.is-correct{border-color:var(--good); background:color-mix(in srgb, var(--good) 10%, var(--page));}
.yk-option.is-correct .yk-letter{background:var(--good); border-color:var(--good); color:#fff;}
.yk-option.is-wrong{border-color:var(--bad); background:color-mix(in srgb, var(--bad) 9%, var(--page));}
.yk-option.is-wrong .yk-letter{background:var(--bad); border-color:var(--bad); color:#fff;}
.yk-hint-btn{margin-top:10px;}
.yk-hint{font-size:13.5px; color:var(--ink-soft); margin:12px 0 0; padding:10px 14px; background:var(--field); border-radius:10px;}
.yk-hint strong{color:var(--ink);}
.yk-feedback{margin:16px 0 0; font-size:14px;}
.yk-feedback p{margin:6px 0 0;}
.yk-quiz-foot{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:20px; flex-wrap:wrap;}

/* Sonuç */
.yk-result-score{font-size:40px; font-weight:800; margin:0; letter-spacing:-0.02em;}
.yk-result-score span{font-size:16px; font-weight:600; color:var(--ink-soft); letter-spacing:0;}
.yk-result-note{font-size:14px; color:var(--ink-soft); margin:6px 0 0;}
.yk-result-note strong{color:var(--ink); font-size:16px;}
.yk-result .yk-table{margin-top:18px;}
.yk-recommend{margin-top:16px; padding:16px 18px; border-radius:12px; background:var(--field);}
.yk-recommend p{margin:0 0 6px;}
.yk-recommend .btn{margin-top:8px;}
.yk-review{margin-top:28px;}
.yk-review h3{margin-bottom:10px;}
.yk-review-item{border:1px solid var(--line); border-radius:12px; margin-bottom:8px; background:var(--page);}
.yk-review-item summary{display:flex; justify-content:space-between; gap:10px; padding:11px 14px; cursor:pointer; list-style:none; font-size:14px; font-weight:600;}
.yk-review-mark{font-size:12px; font-weight:700; border-radius:100px; padding:2px 10px;}
.yk-review-item.is-ok .yk-review-mark{color:var(--good); background:color-mix(in srgb, var(--good) 12%, transparent);}
.yk-review-item.is-bad .yk-review-mark{color:var(--bad); background:color-mix(in srgb, var(--bad) 12%, transparent);}
.yk-review-item.is-blank .yk-review-mark{color:var(--ink-soft); background:var(--field);}
.yk-review-item > p{margin:0 14px 10px; font-size:14px; line-height:1.6;}
.yk-review-item > .yk-review-passage{font-size:13px; color:var(--ink-soft); padding-bottom:10px; border-bottom:1px solid var(--line-soft);}
.yk-review-item > .yk-review-q{font-weight:500;}
.yk-review-item > .yk-review-e{color:var(--ink-soft); padding-bottom:4px;}

/* Deneme / ilerleme */
.yk-mock-meta{font-size:15px; font-weight:700; margin:6px 0 4px;}
.yk-stats{display:grid; grid-template-columns:repeat(5, 1fr); gap:10px; margin-bottom:22px;}
.yk-stat{background:var(--paper-card); border:1px solid var(--line); border-radius:14px; padding:14px 14px 12px;}
.yk-stat-value{display:block; font-size:22px; font-weight:800;}
.yk-stat-label{display:block; font-size:12px; color:var(--ink-soft); margin-top:2px;}
.yk-type-row{padding:8px 0 4px; font-size:14px;}
.yk-type-row .yk-progress{margin-top:6px;}

@media (max-width:760px){
  .yk-level-grid{grid-template-columns:1fr;}
  .yk-stats{grid-template-columns:repeat(2, 1fr);}
  .yk-stats .yk-stat:last-child{grid-column:1 / -1;}
}
@media (max-width:640px){
  .yk{padding:40px 16px 64px;}
  .yk-quiz{padding:18px 16px 20px;}
  .yk-exam summary, .yk-tips summary, .yk-wordlist summary{padding:14px 18px;}
  .yk-exam > :not(summary){margin-left:18px; margin-right:18px;}
  .yk-tips dl{padding:0 18px 18px;}
  .yk-wordlist .yk-table-wrap{padding:0 18px 18px;}
  .yk-tabs{gap:0;}
  .yk-tab{padding:10px 8px; font-size:14px;}
  .yk-stem{font-size:16px;}
  .yk-option{font-size:14.5px; padding:10px 12px;}
  .yk-quiz-count{order:3; flex-basis:100%; text-align:left;}
  .yk-quiz-head .yk-timer{margin-left:auto;}
  .yk-flash-actions .btn{min-width:0; flex:1;}
}