/* ==========================================================================
   LLMS Reader — tool-specific styles
   Marka paleti KİLİTLİ: bu dosyada tek bir ham hex yok; her renk main.css'teki
   mevcut token'lardan gelir, bu yüzden açık/koyu tema otomatik çalışır.
   Renk rolü:  accent(--primary-color) = EYLEM (tek birincil CTA)
               teal/purple             = bilgi sınıflandırması (bölüm türü, sözdizimi)
               green/amber/red         = durum (bulundu / uyarı / hata)
   ========================================================================== */

.lr-tool {
    --lr-accent: var(--primary-color);
    --lr-ink: var(--text-primary);
    --lr-ink-2: var(--text-secondary);
    --lr-surface: var(--bg-primary);
    --lr-surface-2: var(--bg-secondary);
    --lr-line: var(--border-color);
    --lr-ok: var(--success-color);
    --lr-warn: var(--warning-color);
    --lr-danger: var(--error-color);

    /* METİN için ayrı token'lar. Açık temada --success-color (#059669) beyaz üstünde
       3.77:1, --warning-color (#d97706) 3.19:1 — ikisi de WCAG AA metin eşiğini (4.5:1)
       geçmiyor. Aynı hue'nun koyu luminance varyantı kullanılır (marka rengi değişmez):
       #047857 → 5.48:1 (hue farkı 1.6°) · #a95d05 → 4.94:1 (hue farkı 0.1°).
       İKONLAR açık token'da kalır: grafik eşiği 3:1 ve ikisi de onu geçiyor. */
    --lr-ok-text: #047857;
    --lr-warn-text: #a95d05;
    --lr-danger-text: var(--error-color);   /* #dc2626 → 4.83:1, zaten geçiyor */
    --lr-ref: var(--accent-teal);
    --lr-alt: var(--accent-purple);

    /* TEK okuma sütunu genişliği. Sorun şuydu: kapsayıcı 1140px iken paragraflar
       68-75ch'te (≈590-650px) kesiliyor, başlıklar ve tablolar ise 1108px kaplıyordu.
       Metin sola yapışıp sağında 500px boşluk kalıyordu. Çözüm satırı kısaltmak değil
       — okunabilirlik için doğruydu — KAPSAYICIYI metne indirmek: artık başlık,
       paragraf, tablo ve form aynı genişlikte. */
    --lr-measure: 760px;

    /* HİZA: sayfanın kanonik kenarı .container tarafından belirleniyor (1200px / 20px
       padding). Araç kendi max-width'i ve yatay padding'iyle 26px içeri kaçıyordu;
       breadcrumb ve başlık bandı 373'te başlarken içerik 399'da başlıyordu. Artık
       yatay ölçüyü .container veriyor — tek kenar. */
    max-width: none;
    margin: 0;
    padding: 0 0 var(--space-12);
    font-size: var(--text-base);
    line-height: 1.6;
    color: var(--lr-ink);
}

/* ---------- 1. Arama kartı (tek birincil CTA burada) ---------- */

[data-theme="dark"] .lr-tool,
body[data-theme="dark"] .lr-tool {
    /* Koyu zeminde parlak varyantlar zaten 6:1+ — koyu yeşil/kehribar burada okunmaz. */
    --lr-ok-text: var(--success-color);
    --lr-warn-text: var(--warning-color);
}

.lr-lookup {
    background: var(--lr-surface);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-6);
    margin-bottom: var(--space-6);
}

.lr-heading {
    margin: 0 0 var(--space-2);
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--lr-ink);
}

.lr-lookup-intro {
    margin: 0 0 var(--space-4);
    color: var(--lr-ink-2);
    line-height: 1.6;
}

.lr-lookup-form {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    align-items: flex-end;
}

.lr-field {
    flex: 1 1 320px;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    min-width: 0;
}

.lr-label {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--lr-ink);
}

.lr-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.lr-input-wrap > i {
    position: absolute;
    left: var(--space-3);
    color: var(--lr-ink-2);
    pointer-events: none;
}

.lr-input {
    width: 100%;
    min-height: 48px;
    padding: var(--space-3) var(--space-3) var(--space-3) var(--space-8);
    font-size: var(--text-base);
    font-family: inherit;
    color: var(--lr-ink);
    background: var(--lr-surface);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    transition: border-color 180ms var(--transition-curve);
}

.lr-input:hover { border-color: var(--lr-accent); }

.lr-input:focus-visible,
.lr-input:focus {
    outline: 2px solid var(--lr-accent);
    outline-offset: 1px;
    border-color: var(--lr-accent);
}

.lr-tool .lr-submit { min-height: 48px; }

.lr-examples {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-4);
    font-size: var(--text-sm);
    color: var(--lr-ink-2);
}

.lr-example {
    min-height: 44px;
    padding: var(--space-1) var(--space-3);
    font-size: var(--text-sm);
    font-family: var(--font-mono);
    color: var(--lr-ink-2);
    background: var(--lr-surface-2);
    border: 1px solid var(--lr-line);
    border-radius: 999px;
    cursor: pointer;
    transition: border-color 180ms var(--transition-curve),
                color 180ms var(--transition-curve);
}

.lr-example:hover { border-color: var(--lr-accent); color: var(--lr-accent); }
.lr-example:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: 2px; }

/* ---------- 2. Durum / hata ---------- */

.lr-status {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--lr-line);
    border-left: 3px solid var(--lr-accent);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface-2);
    color: var(--lr-ink-2);
    font-size: var(--text-sm);
}

.lr-status[hidden] { display: none; }
.lr-status.is-error { border-left-color: var(--lr-danger); color: var(--lr-ink); }
.lr-status.is-warn  { border-left-color: var(--lr-warn); color: var(--lr-ink); }

.lr-status-detail {
    display: block;
    margin-top: var(--space-1);
    color: var(--lr-ink-2);
}

.lr-attempts {
    margin: var(--space-2) 0 0;
    padding: 0;
    list-style: none;
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--lr-ink-2);
}

.lr-attempts li { padding: 2px 0; }
.lr-attempts i { width: 1em; margin-right: var(--space-2); }
.lr-attempts .is-ok i { color: var(--lr-ok); }
.lr-attempts .is-miss i { color: var(--lr-ink-2); }

.lr-spinner {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    border: 2px solid var(--lr-line);
    border-top-color: var(--lr-accent);
    border-radius: 50%;
    animation: lr-spin 700ms linear infinite;
}

@keyframes lr-spin { to { transform: rotate(360deg); } }

/* ---------- 3. Sonuç başlığı ---------- */

.lr-result[hidden] { display: none; }

.lr-source {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4);
    background: var(--lr-surface);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
    border-bottom: 0;
}

.lr-pill {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-3);
    border-radius: 999px;
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    border: 1px solid currentColor;
}

.lr-pill.is-ok    { color: var(--lr-ok); }
.lr-pill.is-warn  { color: var(--lr-warn); }
.lr-pill.is-info  { color: var(--lr-accent); }

.lr-source-url {
    flex: 1 1 260px;
    min-width: 0;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    color: var(--lr-accent);
    overflow-wrap: anywhere;
}

.lr-source-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.lr-tool .lr-source-actions .btn { min-height: 44px; }

/* ---------- 4. Ölçüm şeridi ---------- */

.lr-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 1px;
    background: var(--lr-line);
    border: 1px solid var(--lr-line);
    border-bottom: 0;
}

.lr-stat {
    padding: var(--space-3) var(--space-4);
    background: var(--lr-surface);
    text-align: center;
}

.lr-stat b {
    display: block;
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--lr-ink);
    font-variant-numeric: tabular-nums;
}

.lr-stat span {
    font-size: var(--text-xs);
    color: var(--lr-ink-2);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ---------- 5. Sekmeler ---------- */

.lr-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-2) 0;
    background: var(--lr-surface-2);
    border: 1px solid var(--lr-line);
    border-bottom: 0;
}

.lr-tab {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 44px;
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-sm);
    font-weight: 600;
    font-family: inherit;
    color: var(--lr-ink-2);
    background: transparent;
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: var(--border-radius-sm) var(--border-radius-sm) 0 0;
    cursor: pointer;
    transition: color 180ms var(--transition-curve),
                background-color 180ms var(--transition-curve);
}

.lr-tab:hover { color: var(--lr-ink); }
.lr-tab:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: -2px; }

.lr-tab[aria-selected="true"] {
    color: var(--lr-accent);
    background: var(--lr-surface);
    border-color: var(--lr-line);
    box-shadow: inset 0 2px 0 0 var(--lr-accent);
}

.lr-tab-count {
    padding: 0 var(--space-2);
    font-size: var(--text-xs);
    font-variant-numeric: tabular-nums;
    border-radius: 999px;
    background: var(--lr-surface-2);
    color: var(--lr-ink-2);
}

.lr-panel {
    padding: var(--space-6);
    background: var(--lr-surface);
    border: 1px solid var(--lr-line);
    border-radius: 0 0 var(--border-radius-lg) var(--border-radius-lg);
}

.lr-panel[hidden] { display: none; }

/* ---------- 6. Ayrıştırılmış belge ---------- */

.lr-doc-head {
    padding-bottom: var(--space-4);
    margin-bottom: var(--space-4);
    border-bottom: 1px solid var(--lr-line);
}

.lr-doc-title {
    margin: 0 0 var(--space-2);
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--lr-ink);
    line-height: 1.3;
}

.lr-doc-summary {
    margin: 0;
    padding-left: var(--space-4);
    border-left: 3px solid var(--lr-alt);
    max-width: 72ch;
    color: var(--lr-ink-2);
    font-size: var(--text-lg);
    line-height: 1.6;
}

/* Spec uyum listesi */
.lr-spec {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin: var(--space-4) 0 0;
    padding: 0;
    list-style: none;
}

.lr-spec-item {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-3);
    font-size: var(--text-xs);
    border: 1px solid var(--lr-line);
    border-radius: 999px;
    color: var(--lr-ink-2);
    background: var(--lr-surface);
    cursor: help;
}

.lr-spec-item.is-ok i { color: var(--lr-ok); }
.lr-spec-item.is-warn i { color: var(--lr-warn); }

/* Filtre */
.lr-filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.lr-filter {
    flex: 1 1 240px;
    min-height: 44px;
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-base);
    font-family: inherit;
    color: var(--lr-ink);
    background: var(--lr-surface);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
}

.lr-filter:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: 1px; }

.lr-filter-meta {
    font-size: var(--text-sm);
    color: var(--lr-ink-2);
    font-variant-numeric: tabular-nums;
}

/* Bölüm kartları */
/* HİZALAMA: her kart AYNI genişlikte, tek sütun. Daha önce auto-fill ızgarası
   kimi kartı dar kimini geniş bırakıyordu; kenarlar tutmuyordu. Bağlantılar
   kartın İÇİNDE ızgaraya girer, dış hat hep hizalı kalır. */
.lr-sections {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.lr-section {
    border: 1px solid var(--lr-line);
    border-top: 3px solid var(--lr-accent);
    border-radius: var(--border-radius);
    background: var(--lr-surface);
    overflow: hidden;
}

.lr-section[data-kind="api"],
.lr-section[data-kind="examples"] { border-top-color: var(--lr-ref); }
.lr-section[data-kind="blog"],
.lr-section[data-kind="company"] { border-top-color: var(--lr-alt); }
.lr-section[data-kind="optional"] { border-top-color: var(--lr-line); }
.lr-section[data-kind="optional"] .lr-section-head { background: var(--lr-surface-2); }

.lr-section[hidden] { display: none; }

.lr-section-head {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--lr-line);
}

.lr-section-title {
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--lr-ink);
    line-height: 1.35;
}

.lr-kind {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface-2);
    color: var(--lr-accent);
}

.lr-section[data-kind="api"] .lr-kind,
.lr-section[data-kind="examples"] .lr-kind { color: var(--lr-ref); }
.lr-section[data-kind="blog"] .lr-kind,
.lr-section[data-kind="company"] .lr-kind { color: var(--lr-alt); }
.lr-section[data-kind="optional"] .lr-kind { color: var(--lr-ink-2); }

.lr-count {
    padding: 2px var(--space-2);
    font-size: var(--text-xs);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lr-ink-2);
    background: var(--lr-surface-2);
    border-radius: 999px;
}

.lr-section-body { padding: var(--space-2) var(--space-4) var(--space-4); }

/* Bağlantı listesi */
.lr-links { margin: 0; padding: 0; list-style: none; }

.lr-link {
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--lr-line);
}

.lr-link:last-child { border-bottom: 0; }
.lr-link[hidden] { display: none; }
.lr-link[data-depth="1"] { padding-left: var(--space-4); }
.lr-link[data-depth="2"], .lr-link[data-depth="3"] { padding-left: var(--space-8); }

.lr-link-head {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
    flex-wrap: wrap;
}

.lr-link-title {
    font-weight: 600;
    color: var(--lr-accent);
    text-decoration: none;
    overflow-wrap: anywhere;
}

.lr-link-title:hover { text-decoration: underline; }
.lr-link-title:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: 2px; }

.lr-link-ext { font-size: 0.75em; color: var(--lr-ink-2); }

.lr-tag {
    padding: 1px var(--space-2);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    border-radius: var(--border-radius-sm);
    border: 1px solid currentColor;
    color: var(--lr-ink-2);
}

.lr-tag[data-kind="markdown"], .lr-tag[data-kind="text"] { color: var(--lr-ref); }
.lr-tag[data-kind="api"], .lr-tag[data-kind="data"] { color: var(--lr-alt); }
.lr-tag[data-kind="full"] { color: var(--lr-ok); }

.lr-link-desc {
    margin: var(--space-1) 0 0;
    max-width: 72ch;
    color: var(--lr-ink-2);
    font-size: var(--text-sm);
    line-height: 1.6;
}

.lr-link-url {
    display: block;
    margin-top: var(--space-1);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--lr-ink-2);
    overflow-wrap: anywhere;
}

/* Metin blokları */
.lr-prose {
    margin: 0 0 var(--space-3);
    max-width: 72ch;
    color: var(--lr-ink-2);
    line-height: 1.6;
}

.lr-prose:last-child { margin-bottom: 0; }

.lr-prose a { color: var(--lr-accent); overflow-wrap: anywhere; }
.lr-prose code, .lr-inline-code {
    padding: 1px 4px;
    font-family: var(--font-mono);
    font-size: 0.9em;
    background: var(--lr-surface-2);
    border-radius: var(--border-radius-sm);
    color: var(--lr-ink);
}

.lr-quote {
    margin: 0 0 var(--space-3);
    padding-left: var(--space-4);
    border-left: 3px solid var(--lr-alt);
    color: var(--lr-ink-2);
}

.lr-subhead {
    margin: var(--space-4) 0 var(--space-2);
    font-size: var(--text-base);
    font-weight: 700;
    color: var(--lr-ink);
}

.lr-code-block {
    margin: 0 0 var(--space-3);
    padding: var(--space-3);
    overflow-x: auto;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: 1.55;
    color: var(--lr-ink);
    background: var(--lr-surface-2);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
}

.lr-hr { margin: var(--space-4) 0; border: 0; border-top: 1px solid var(--lr-line); }

/* ---------- 7. Ham görünüm + sözdizimi renklendirme ---------- */

.lr-raw {
    margin: 0;
    max-height: 70vh;
    overflow: auto;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: 1.6;
    background: var(--lr-surface-2);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    counter-reset: lr-line;
}

.lr-raw-line {
    display: flex;
    gap: var(--space-3);
    padding: 0 var(--space-3);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.lr-raw-line:hover { background: var(--lr-surface); }

.lr-raw-no {
    flex: 0 0 4ch;
    text-align: right;
    color: var(--lr-ink-2);
    opacity: 0.7;
    user-select: none;
}

.lr-raw-txt { flex: 1 1 auto; min-width: 0; color: var(--lr-ink); }

.tk-h1, .tk-h2, .tk-h3 { color: var(--lr-accent); font-weight: 700; }
.tk-h2 { font-weight: 600; }
.tk-h3 { font-weight: 600; opacity: 0.9; }
.tk-quote { color: var(--lr-alt); font-style: italic; }
.tk-bullet { color: var(--lr-ink-2); }
.tk-label { color: var(--lr-ink); font-weight: 600; }
.tk-url { color: var(--lr-ref); }
.tk-code { color: var(--lr-ok); }
.tk-strong { color: var(--lr-ink); font-weight: 700; }
.tk-fence { color: var(--lr-ink-2); }

.lr-raw-note {
    margin: var(--space-3) 0 0;
    font-size: var(--text-sm);
    color: var(--lr-ink-2);
}

/* ---------- 8. llms-full.txt paneli ---------- */

.lr-full-intro {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    margin-bottom: var(--space-4);
    border: 1px solid var(--lr-line);
    border-left: 3px solid var(--lr-ok);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface-2);
}

.lr-full-intro.is-missing { border-left-color: var(--lr-warn); }
.lr-full-intro p { margin: 0; flex: 1 1 320px; color: var(--lr-ink-2); max-width: 72ch; }
.lr-full-intro strong { color: var(--lr-ink); }

.lr-toc {
    margin: 0 0 var(--space-4);
    padding: var(--space-3) var(--space-4);
    max-height: 260px;
    overflow: auto;
    list-style: none;
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface-2);
}

.lr-toc li { padding: 2px 0; font-size: var(--text-sm); }
.lr-toc li[data-level="2"] { padding-left: var(--space-4); }
.lr-toc li[data-level="3"] { padding-left: var(--space-8); }
.lr-toc li[data-level="4"] { padding-left: var(--space-12); }

.lr-toc a { color: var(--lr-ink-2); text-decoration: none; }
.lr-toc a:hover { color: var(--lr-accent); text-decoration: underline; }
.lr-toc a:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: 2px; }

.lr-full-section {
    margin-bottom: var(--space-2);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface);
}

.lr-full-section[hidden] { display: none; }

.lr-full-section > summary {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-height: 44px;
    padding: var(--space-2) var(--space-4);
    cursor: pointer;
    font-weight: 600;
    color: var(--lr-ink);
    list-style: none;
}

.lr-full-section > summary::-webkit-details-marker { display: none; }
.lr-full-section > summary:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: -2px; }
.lr-full-section > summary::before {
    content: "\f054";
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 0.7em;
    color: var(--lr-ink-2);
    transition: transform 180ms var(--transition-curve);
}

.lr-full-section[open] > summary::before { transform: rotate(90deg); }
.lr-full-section[data-level="1"] > summary { font-size: var(--text-lg); }
.lr-full-section[data-level="3"] > summary,
.lr-full-section[data-level="4"] > summary { font-size: var(--text-sm); color: var(--lr-ink-2); }

.lr-full-meta {
    margin-left: auto;
    font-size: var(--text-xs);
    font-variant-numeric: tabular-nums;
    color: var(--lr-ink-2);
}

.lr-full-body {
    padding: 0 var(--space-4) var(--space-4);
    margin: 0;
    max-height: 420px;
    overflow: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

/* ---------- 9. Boş / bilgi durumları ---------- */

.lr-empty {
    padding: var(--space-8) var(--space-4);
    text-align: center;
    color: var(--lr-ink-2);
}

.lr-empty i {
    font-size: var(--text-3xl);
    color: var(--lr-line);
    display: block;
    margin-bottom: var(--space-3);
}

.lr-empty p { margin: 0 auto; max-width: 60ch; }

/* ---------- 10. SEO / açıklama bölümü ---------- */

.lr-seo { margin-top: var(--space-12); }

/* Metin bölümü artık kenarları tutuyor ama satır uzunluğu hâlâ okunur:
   gövde en fazla --lr-measure, yanındaki sütun gerçek bir işe yarıyor
   (sayfa içi gezinme) — boş bırakılmış bir alan değil. */
.lr-seo-grid {
    display: grid;
    grid-template-columns: minmax(0, var(--lr-measure)) minmax(0, 1fr);
    gap: var(--space-12);
    align-items: start;
}

.lr-seo-body { min-width: 0; }

.lr-toc-nav {
    position: sticky;
    top: 92px;
    padding: var(--space-4);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius);
    background: var(--lr-surface-2);
}

.lr-toc-title {
    margin: 0 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--lr-ink-2);
}

.lr-toc-nav ul { margin: 0; padding: 0; list-style: none; }

.lr-toc-nav li { margin: 0; }

.lr-toc-nav a {
    display: block;
    padding: var(--space-2) 0;
    font-size: var(--text-sm);
    line-height: 1.45;
    color: var(--lr-ink-2);
    text-decoration: none;
    border-bottom: 1px solid var(--lr-line);
}

.lr-toc-nav li:last-child a { border-bottom: 0; }
.lr-toc-nav a:hover { color: var(--lr-accent); }
.lr-toc-nav a:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: 2px; }

/* Çapa hedefleri sabit başlığın altında kalmasın. */
.lr-seo-body h2[id],
.lr-seo-body h3[id] { scroll-margin-top: 92px; }

@media (max-width: 1060px) {
    .lr-seo-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
    .lr-toc-nav { position: static; order: -1; }
}
.lr-seo h2 { font-size: var(--text-2xl); color: var(--lr-ink); }
.lr-seo h3 { font-size: var(--text-xl); color: var(--lr-ink); margin-top: var(--space-6); }
.lr-seo p, .lr-seo li { line-height: 1.65; color: var(--lr-ink-2); }
.lr-seo code {
    padding: 1px 4px;
    font-family: var(--font-mono);
    font-size: 0.9em;
    background: var(--lr-surface-2);
    border-radius: var(--border-radius-sm);
    color: var(--lr-ink);
}

.lr-table-wrap { overflow-x: auto; margin: var(--space-4) 0; }

.lr-table-wrap table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
}

.lr-table-wrap th,
.lr-table-wrap td {
    padding: var(--space-3);
    text-align: left;
    border-bottom: 1px solid var(--lr-line);
    color: var(--lr-ink-2);
    vertical-align: top;
}

.lr-table-wrap th { color: var(--lr-ink); font-weight: 700; background: var(--lr-surface-2); }

.lr-spec-sample {
    margin: var(--space-4) 0;
    padding: var(--space-4);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: 1.6;
    white-space: pre-wrap;
    color: var(--lr-ink);
    background: var(--lr-surface-2);
    border: 1px solid var(--lr-line);
    border-left: 3px solid var(--lr-accent);
    border-radius: var(--border-radius-sm);
    overflow-x: auto;
}

/* ---------- 11. Duyarlılık ---------- */

@media (max-width: 720px) {
    /* Yatay ölçü mobilde de .container'dan gelir — ek padding 12px kaydırıyordu. */
    .lr-tool { padding: 0 0 var(--space-8); }
    .lr-lookup, .lr-panel { padding: var(--space-4); }
    .lr-lookup-form { flex-direction: column; align-items: stretch; }
    .lr-tool .lr-submit { width: 100%; }
    .lr-sections { grid-template-columns: 1fr; }
    .lr-source { flex-direction: column; align-items: flex-start; }
    .lr-source-actions { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .lr-tool *,
    .lr-tool *::before,
    .lr-tool *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    /* Dönen yükleme göstergesi hareketsiz bir halkaya iner — titremesin. */
    .lr-spinner {
        animation: none !important;
        border-color: var(--lr-line);
        border-top-color: var(--lr-accent);
    }
}

/* ==========================================================================
   12. GEO skoru — KOMPAKT akordeon düzeni
   Tasarım kararı: skor ekranı daha önce 2400px sürüyordu. Artık her grup
   kapalı tek satır (44px hedef yüksekliği korunur), gövde talep üzerine açılır.
   Renk rolü DURUM'dur: yeşil geçti · kehribar kısmi · kırmızı eksik.
   Metin renkleri --lr-*-text (AA), ikonlar açık ton (grafik eşiği 3:1).
   ========================================================================== */

/* Ortak kart kabuğu — Parsed görünümündeki bloklar bunu paylaşır, böylece
   panel içindeki her kutunun sol/sağ kenarı birebir hizalanır. */
.lr-card,
.lr-section {
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius);
    background: var(--lr-surface);
    overflow: hidden;
}

.lr-card { margin-bottom: var(--space-4); }
.lr-card:last-child { margin-bottom: 0; }

.lr-card-head,
.lr-section-head {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--lr-line);
    background: var(--lr-surface);
}

.lr-card-title {
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: 1.35;
    color: var(--lr-ink);
}

.lr-card-body { padding: var(--space-4); }

/* ---------- Başlık şeridi ---------- */

.lr-score { display: flex; flex-direction: column; gap: var(--space-2); }

.lr-score-hero {
    display: flex;
    align-items: center;
    gap: var(--space-5, 1.25rem);
    padding: var(--space-4);
    margin-bottom: var(--space-2);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius);
    background: var(--lr-surface);
}

.lr-ring {
    position: relative;
    width: 88px;
    height: 88px;
    flex: 0 0 88px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: conic-gradient(var(--lr-ring-color) var(--lr-ring-pct, 0%), var(--lr-line) 0);
}

.lr-ring.is-good { --lr-ring-color: var(--lr-ok); }
.lr-ring.is-fair { --lr-ring-color: var(--lr-warn); }
.lr-ring.is-poor { --lr-ring-color: var(--lr-danger); }

.lr-ring-inner {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: var(--lr-surface);
    display: grid;
    place-items: center;
    align-content: center;
}

.lr-ring-num {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: var(--lr-ink);
    font-variant-numeric: tabular-nums;
}

.lr-ring-grade {
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--lr-ink-2);
}

.lr-score-text { flex: 1 1 auto; min-width: 0; }

.lr-score-verdict {
    margin: 0 0 var(--space-1);
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: 1.4;
    color: var(--lr-ink);
}

.lr-score-sub {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin: 0 0 var(--space-1);
    font-size: var(--text-sm);
    color: var(--lr-ink-2);
}

.lr-score-sub b { color: var(--lr-ink); font-variant-numeric: tabular-nums; }

.lr-score-note {
    margin: 0;
    max-width: 72ch;
    font-size: var(--text-xs);
    line-height: 1.55;
    color: var(--lr-ink-2);
}

/* ---------- Durum sayaç çipleri ---------- */

.lr-tally { display: inline-flex; gap: var(--space-2); }

.lr-tally-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--text-xs);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--lr-ink-2);
    white-space: nowrap;
}

.lr-tally-chip.is-pass { color: var(--lr-ok-text); }
.lr-tally-chip.is-warn { color: var(--lr-warn-text); }
.lr-tally-chip.is-fail { color: var(--lr-danger-text); }
.lr-tally-chip b { font-weight: 700; }

/* ---------- Akordeon satırı ---------- */

.lr-acc {
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface);
}

.lr-acc-head {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-height: 44px;
    padding: var(--space-2) var(--space-4);
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.lr-acc-head::-webkit-details-marker { display: none; }
.lr-acc-head:hover { background: var(--lr-surface-2); }
.lr-acc-head:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: -2px; }

.lr-acc-head::after {
    content: "\f078";
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 0.7em;
    color: var(--lr-ink-2);
    transition: transform 180ms var(--transition-curve);
    flex: 0 0 auto;
}

.lr-acc[open] > .lr-acc-head::after { transform: rotate(180deg); }
.lr-acc[open] > .lr-acc-head { border-bottom: 1px solid var(--lr-line); }

.lr-acc-icon {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface-2);
    color: var(--lr-accent);
    font-size: 0.85em;
}

.lr-acc-titles { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }

.lr-acc-title {
    font-weight: 700;
    font-size: var(--text-base);
    line-height: 1.35;
    color: var(--lr-ink);
    /* Dar ekranda başlık 3 satıra sarıp yanındaki rozetle çakışıyordu. */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lr-acc-hint {
    font-size: var(--text-xs);
    line-height: 1.4;
    color: var(--lr-ink-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lr-acc-aside {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex: 0 0 auto;
}

.lr-acc-score {
    font-size: var(--text-sm);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lr-ink);
    white-space: nowrap;
}

.lr-acc-body { padding: var(--space-3) var(--space-4) var(--space-4); }

.lr-acc-note {
    margin: 0 0 var(--space-2);
    max-width: 74ch;
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-acc-note:last-child { margin-bottom: 0; }
.lr-acc.is-skipped .lr-acc-icon,
.lr-acc.is-locked .lr-acc-icon { color: var(--lr-ink-2); }

.lr-meter {
    width: 72px;
    height: 6px;
    border-radius: 999px;
    background: var(--lr-line);
    overflow: hidden;
    flex: 0 0 72px;
}

.lr-meter-fill { display: block; height: 100%; border-radius: 999px; }
.lr-meter-fill.is-good { background: var(--lr-ok); }
.lr-meter-fill.is-fair { background: var(--lr-warn); }
.lr-meter-fill.is-poor { background: var(--lr-danger); }

/* ---------- Kontrol satırları ---------- */

.lr-checks { margin: 0; padding: 0; list-style: none; }

.lr-check {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--lr-line);
}

.lr-check:last-child { border-bottom: 0; padding-bottom: 0; }
.lr-check:first-child { padding-top: 0; }

.lr-check > i { margin-top: 3px; flex: 0 0 auto; }
.lr-check.is-pass > i { color: var(--lr-ok); }
.lr-check.is-warn > i { color: var(--lr-warn); }
.lr-check.is-fail > i { color: var(--lr-danger); }
.lr-check.is-skip > i { color: var(--lr-ink-2); }

.lr-check-text { flex: 1 1 auto; min-width: 0; }

.lr-check-label {
    display: block;
    font-weight: 600;
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--lr-ink);
}

.lr-check-detail {
    display: block;
    font-size: var(--text-sm);
    line-height: 1.55;
    color: var(--lr-ink-2);
    overflow-wrap: anywhere;
}

.lr-check.is-pass .lr-check-detail { color: var(--lr-ok-text); }
.lr-check.is-warn .lr-check-detail { color: var(--lr-warn-text); }
.lr-check.is-fail .lr-check-detail { color: var(--lr-danger-text); }
.lr-check-detail strong { font-weight: 700; }

.lr-check-points {
    flex: 0 0 auto;
    font-size: var(--text-xs);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lr-ink-2);
    padding-top: 2px;
}

/* ---------- Öneriler: her biri kendi içinde açılır ---------- */

.lr-acc-recs .lr-acc-icon { color: var(--lr-warn); }
.lr-recs { margin: 0; padding: 0; list-style: none; counter-reset: lr-rec; }

.lr-rec { border-bottom: 1px solid var(--lr-line); }
.lr-rec:last-child { border-bottom: 0; }

.lr-rec-head {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-height: 44px;
    padding: var(--space-2) 0;
    cursor: pointer;
    list-style: none;
}

.lr-rec-head::-webkit-details-marker { display: none; }
.lr-rec-head:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: 2px; }

.lr-rec-head::before {
    counter-increment: lr-rec;
    content: counter(lr-rec);
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: var(--text-xs);
    font-weight: 700;
    color: var(--lr-ink-2);
    background: var(--lr-surface-2);
}

.lr-rec.is-high .lr-rec-head::before { color: var(--lr-danger-text); }
.lr-rec.is-medium .lr-rec-head::before { color: var(--lr-warn-text); }

.lr-rec-title {
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 600;
    font-size: var(--text-sm);
    color: var(--lr-ink);
}

.lr-rec-group {
    font-size: var(--text-xs);
    color: var(--lr-ink-2);
    white-space: nowrap;
}

.lr-rec-weight {
    font-size: var(--text-xs);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lr-ink-2);
    white-space: nowrap;
}

.lr-rec-body { padding: 0 0 var(--space-3) calc(22px + var(--space-3)); }

.lr-rec-detail {
    margin: 0 0 var(--space-1);
    max-width: 74ch;
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-rec-was {
    margin: 0;
    max-width: 74ch;
    font-size: var(--text-xs);
    line-height: 1.55;
    color: var(--lr-ink-2);
}

.lr-rec-was-label { font-weight: 700; color: var(--lr-ink); }

/* ---------- Arama sonucu önizlemesi ---------- */

.lr-serp {
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface-2);
    max-width: 620px;
}

.lr-serp-url { display: block; font-size: var(--text-xs); color: var(--lr-ink-2); overflow-wrap: anywhere; }
.lr-serp-title { display: block; margin-top: 2px; font-size: var(--text-lg); line-height: 1.35; color: var(--lr-accent); }
.lr-serp-desc { display: block; margin-top: var(--space-1); font-size: var(--text-sm); line-height: 1.55; color: var(--lr-ink-2); }

/* ---------- Başlangıç şablonu ---------- */

.lr-template {
    margin: 0 0 var(--space-3);
    padding: var(--space-3) var(--space-4);
    overflow-x: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-family: var(--font-mono);
    font-size: var(--text-sm);
    line-height: 1.7;
    color: var(--lr-ink);
    background: var(--lr-surface-2);
    border: 1px solid var(--lr-line);
    border-left: 3px solid var(--lr-accent);
    border-radius: var(--border-radius-sm);
}

/* ---------- Erişilemeyen site durumu ---------- */

.lr-state {
    display: flex;
    gap: var(--space-4);
    padding: var(--space-6);
    border: 1px solid var(--lr-line);
    border-left: 3px solid var(--lr-warn);
    border-radius: var(--border-radius);
    background: var(--lr-surface);
}

.lr-state-icon {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 50%;
    background: var(--lr-surface-2);
    /*
     * Ikon rozeti olsa da AA metin varyantini kullaniyoruz: --lr-warn yuzeyin
     * uzerinde 3.04:1 kaliyor, yani grafik esigini (3:1) kil payi geciyor.
     * --lr-warn-text ayni hue'nun luminance varyanti (4.94:1); marka rengi
     * degismeden pay birakiyor. Denetci var()'i dosyalar arasi cozemedigi icin
     * bu ihlal dosya modunda gorunmuyordu, yalniz URL modunda cikti.
     */
    color: var(--lr-warn-text);
}

.lr-pill.is-danger { color: var(--lr-danger-text); }

/* ---------- Bağlantı ızgarası: kart içinde düzenli sütunlar ---------- */

.lr-links.is-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 0 var(--space-6);
}

.lr-tabs .lr-tab[hidden] { display: none; }

/* `body .btn { display: inline-flex }` tarayıcının [hidden] kuralını ezdiği için
   dosya bulunmayan durumda Copy/Download/Open butonları görünmeye devam ediyordu.
   Bu seçici (0,3,0) ile onu geçer — anlamsız eylem gösterilmez. */
.lr-tool .lr-source-actions [hidden],
.lr-tool .lr-card [hidden] { display: none; }

@media (max-width: 720px) {
    .lr-score-hero { gap: var(--space-3); padding: var(--space-3); }
    .lr-ring { width: 64px; height: 64px; flex-basis: 64px; }
    .lr-ring-inner { width: 50px; height: 50px; }
    .lr-ring-num { font-size: 1.1rem; }
    .lr-ring-grade { font-size: 10px; }
    .lr-score-verdict { font-size: var(--text-base); }
    .lr-acc-hint { display: none; }
    .lr-meter { display: none; }
    /* "locked" / "not scored" rozeti dar ekranda başlığın yerini yiyordu;
       durum zaten ikon renginden ve puandan okunuyor, gövdede de yazılı. */
    .lr-acc-aside .lr-count { display: none; }
    .lr-acc-head { padding: var(--space-2) var(--space-3); gap: var(--space-2); }
    .lr-acc-body { padding: var(--space-3); }
    .lr-links.is-grid { grid-template-columns: 1fr; }
    .lr-rec-group { display: none; }
    .lr-state { flex-direction: column; padding: var(--space-4); }
}

/* Uzun öneri listesi: ilk 8'den sonrası istendiğinde açılır. */
.lr-recs:not(.is-full) .lr-rec.is-extra,
.lr-fixes:not(.is-full) .lr-fix.is-extra { display: none; }

.lr-more {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 44px;
    margin-top: var(--space-2);
    padding: 0;
    font-family: inherit;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--lr-accent);
    background: none;
    border: 0;
    cursor: pointer;
}

.lr-more:hover { text-decoration: underline; }
.lr-more:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: 2px; }

/* Çok dar ekran: sayaç çipleri başlığı "Link..." hâline getiriyordu. Puan kesri
   zaten aynı bilgiyi taşıyor, ayrıntı da grup açılınca satır satır görünüyor. */
@media (max-width: 480px) {
    .lr-acc-aside .lr-tally.is-compact { display: none; }
    .lr-acc-head { gap: var(--space-2); }
    .lr-acc-aside { gap: var(--space-2); }
}

/* ==========================================================================
   13. Tarama ilerlemesi
   Çubuk iki GERÇEK isteğe (discover / analyze) oturur; aradaki hareket
   "çalışıyor" işaretidir, ölçüm değil (bkz. llms-reader.js creepTo).
   ========================================================================== */

.lr-progress {
    margin-top: var(--space-4);
    padding: var(--space-4);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface-2);
}

.lr-progress[hidden] { display: none; }

.lr-progress-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-2);
}

.lr-progress-label {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--lr-ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lr-progress-pct {
    font-size: var(--text-sm);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lr-accent);
    flex: 0 0 auto;
}

.lr-progress-track {
    height: 8px;
    border-radius: 999px;
    background: var(--lr-line);
    overflow: hidden;
}

.lr-progress-fill {
    display: block;
    width: 0;
    height: 100%;
    border-radius: 999px;
    background: var(--lr-accent);
    transition: width 200ms var(--transition-curve);
}

.lr-steps {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-5, 1.25rem);
    margin: var(--space-3) 0 0;
    padding: 0;
    list-style: none;
    font-size: var(--text-xs);
    color: var(--lr-ink-2);
}

.lr-steps li { display: flex; align-items: center; gap: var(--space-2); }
.lr-steps li i { opacity: 0.6; }
.lr-steps li.is-active { color: var(--lr-accent); font-weight: 700; }
.lr-steps li.is-active i { opacity: 1; }
.lr-steps li.is-done { color: var(--lr-ok-text); }
.lr-steps li.is-done i { opacity: 1; }

/* Kaynak satırı — puanlamanın dayanağı görünür olsun. */
.lr-sources {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2) var(--space-4);
    margin: var(--space-4) 0 0;
    padding: var(--space-3) var(--space-4);
    border-left: 3px solid var(--lr-line);
    background: var(--lr-surface-2);
    border-radius: var(--border-radius-sm);
    font-size: var(--text-sm);
    color: var(--lr-ink-2);
}

.lr-sources span { font-weight: 700; color: var(--lr-ink); }
.lr-sources a { color: var(--lr-accent); }

/* ==========================================================================
   15. Kalıcı rapor sayfası (/network/llms-txt-reader/<host>)
   ========================================================================== */

.lr-report { padding-top: var(--space-4); }

.lr-report-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

/* Ölçü ELEMANA değil KAPSAYICIYA verilir: böylece H1 ile alt metni aynı
   genişlikte biter, biri 900px biri 700px olup basamak yapmaz. */
.lr-report-title { flex: 1 1 420px; min-width: 0; max-width: var(--lr-measure); }

.lr-report-title h1 {
    margin: 0 0 var(--space-2);
    font-size: var(--text-3xl);
    font-weight: 700;
    line-height: 1.25;
    color: var(--lr-ink);
    overflow-wrap: anywhere;
}

.lr-report-lede {
    margin: 0;
    font-size: var(--text-lg);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-report-card {
    margin: 0 0 var(--space-6);
    padding: 0;
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    background: var(--lr-surface);
}

.lr-report-card img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1200 / 630;
}

.lr-report-card figcaption {
    padding: var(--space-3) var(--space-4);
    border-top: 1px solid var(--lr-line);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink-2);
    overflow-wrap: anywhere;
}

.lr-report-card figcaption strong { color: var(--lr-ink); }
.lr-report-card figcaption a { color: var(--lr-accent); }

/* Rapor sayfasında öneriler zaten açıktır — <details> değil düz liste. */
.lr-report .lr-recs .lr-rec { padding: var(--space-3) 0; }
.lr-report .lr-recs .lr-rec-head { cursor: default; }
.lr-report .lr-recs .lr-rec-head::before { content: counter(lr-rec); counter-increment: lr-rec; }

@media (max-width: 720px) {
    .lr-report-title h1 { font-size: var(--text-2xl); }
    .lr-report-head .btn { width: 100%; }
}

/* Tek panel kaldığında sekme şeridi gizlenir (dosyası olmayan site, erişilemeyen site). */
.lr-tabs[hidden] { display: none; }
.lr-result .lr-tabs[hidden] + .lr-panel { border-radius: var(--border-radius-lg); }

/* ==========================================================================
   16. İçerik bölümünün dikey ritmi
   Global reset p/h2/ul üzerindeki margin'leri sıfırlıyor; bu bölüm de bir metin
   duvarına dönüşmüştü (paragraflar birbirine yapışık, başlıkla gövde arasında
   nefes yok). Ölçüler tipografik: gövde 16px/1.65 için paragraf arası ~1.15em,
   başlık üstü boşluk gövde arasının ~2 katı — grup hissi başlıkta oluşsun.
   ========================================================================== */

/* NOT: seçici `.lr-seo > p` idi; içerik iki sütuna alınınca paragraflar
   `.lr-seo-body` içine indi ve kural eşleşmeyi bıraktı — boşluklar kayboldu.
   Artık derinlikten bağımsız. */
.lr-seo p,
.lr-seo .faq-item p,
.lr-seo .lr-prose { margin: 0 0 1.15em; }

.lr-seo-body > p:last-child { margin-bottom: 0; }

.lr-seo h2 {
    margin: var(--space-12) 0 var(--space-3);
    line-height: 1.3;
}

.lr-seo-body > h2:first-child { margin-top: 0; }

.lr-seo h3 {
    margin: var(--space-8) 0 var(--space-3);
    line-height: 1.35;
}

.lr-seo h4 {
    margin: 0 0 var(--space-2);
    font-size: var(--text-base);
    font-weight: 700;
    line-height: 1.4;
    color: var(--lr-ink);
}

.lr-seo ul,
.lr-seo ol {
    margin: 0 0 1.15em;
    padding-left: var(--space-6);
}

.lr-seo li { margin-bottom: var(--space-2); }
.lr-seo li:last-child { margin-bottom: 0; }

.lr-seo .lr-table-wrap { margin: var(--space-4) 0 var(--space-6); }
.lr-seo .lr-spec-sample { margin: var(--space-4) 0 var(--space-6); }

/* SSS: her madde ayrı bir blok gibi okunsun, alt alta yapışmasın. */
.lr-seo .faq-section {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-top: var(--space-4);
}

.lr-seo .faq-item {
    padding: var(--space-4);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius);
    background: var(--lr-surface);
}

.lr-seo .faq-item p:last-child { margin-bottom: 0; }

.lr-seo .lr-sources { margin-top: var(--space-6); }

/* ==========================================================================
   17. Arama kartının üst bloğu — iki sütun
   Kart artık sayfanın kenarlarına hizalı (tam genişlik). Tek sütunda açıklama
   ~130ch olurdu; onun yerine metin okunur bir sütunda, yanında taramanın ne
   döndürdüğünü söyleyen gerçek bir liste var — boş bırakılmış alan değil.
   ========================================================================== */

.lr-lookup-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr);
    gap: var(--space-8);
    align-items: start;
    margin-bottom: var(--space-6);
}

.lr-lookup-copy { min-width: 0; }
.lr-lookup-copy .lr-lookup-intro { margin-bottom: 0; }

.lr-lookup-facts {
    margin: 0;
    padding: var(--space-4);
    list-style: none;
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius);
    background: var(--lr-surface-2);
}

.lr-lookup-facts li {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-2) 0;
    font-size: var(--text-sm);
    line-height: 1.55;
    color: var(--lr-ink-2);
    border-bottom: 1px solid var(--lr-line);
}

.lr-lookup-facts li:last-child { border-bottom: 0; padding-bottom: 0; }
.lr-lookup-facts li:first-child { padding-top: 0; }
.lr-lookup-facts i { margin-top: 3px; flex: 0 0 auto; color: var(--lr-accent); }
.lr-lookup-facts li > span { min-width: 0; }
.lr-lookup-facts strong { color: var(--lr-ink); }

@media (max-width: 900px) {
    .lr-lookup-top { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
}

/* ==========================================================================
   18. Rapor kahramanı, güçlü/eksik blokları, grup notu
   Hiyerarşi: skor sayısı sayfanın en büyük öğesi, sonra tek cümlelik yargı,
   sonra ölçümden türetilmiş giriş. Renk DURUM bildirir, korku satmaz:
   yeşil geçti, kehribar kısmi, kırmızı eksik. Metin renkleri AA token'ları.
   ========================================================================== */

.lr-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--space-8);
    padding: var(--space-6);
    margin-bottom: var(--space-6);
    border: 1px solid var(--lr-line);
    border-left: 4px solid var(--lr-line);
    border-radius: var(--border-radius-lg);
    background: var(--lr-surface);
}

.lr-hero.is-good { border-left-color: var(--lr-ok); }
.lr-hero.is-fair { border-left-color: var(--lr-warn); }
.lr-hero.is-poor { border-left-color: var(--lr-danger); }

.lr-hero-score {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: auto auto;
    align-items: baseline;
    gap: 0 var(--space-1);
    min-width: 170px;
}

.lr-hero-num {
    font-size: 4.5rem;
    font-weight: 800;
    line-height: 0.95;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: var(--lr-ink);
}

.lr-hero.is-good .lr-hero-num { color: var(--lr-ok-text); }
.lr-hero.is-fair .lr-hero-num { color: var(--lr-warn-text); }
.lr-hero.is-poor .lr-hero-num { color: var(--lr-danger-text); }

.lr-hero-of {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--lr-ink-2);
}

.lr-hero-grade {
    grid-column: 1 / -1;
    margin-top: var(--space-2);
    font-size: var(--text-sm);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--lr-ink-2);
}

.lr-hero-text { flex: 1 1 420px; min-width: 0; }

.lr-hero-headline {
    margin: 0 0 var(--space-3);
    font-size: var(--text-3xl);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.01em;
    color: var(--lr-ink);
}

.lr-hero-lede {
    margin: 0 0 var(--space-3);
    font-size: var(--text-lg);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-hero-lede:first-of-type { color: var(--lr-ink); }

.lr-hero-meta {
    margin: var(--space-4) 0 0;
    padding-top: var(--space-3);
    border-top: 1px solid var(--lr-line);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-hero-meta strong { color: var(--lr-ink); }

/*
 * Kapsama ilani. Payda degistiginde bunu SOYLEMEK durustluk gereginin bir
 * parcasi; ama bir uyari degil, bir dipnottur — bu yuzden kendi rengini
 * almaz, yalnizca sol cizgiyle ayrilir ve ikincil murekkeple yazilir.
 */
.lr-hero-coverage,
.lr-score-coverage {
    margin: var(--space-3) 0 0;
    padding-left: var(--space-3);
    border-left: 2px solid var(--lr-line);
    max-width: 72ch;
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-hero-coverage strong,
.lr-score-coverage strong { color: var(--lr-ink); font-variant-numeric: tabular-nums; }

/* ---- Güçlü yanlar / eksikler ---- */

.lr-split {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.lr-split-col {
    padding: var(--space-5, 1.25rem);
    border: 1px solid var(--lr-line);
    border-top: 3px solid var(--lr-line);
    border-radius: var(--border-radius);
    background: var(--lr-surface);
}

.lr-split-col.is-good { border-top-color: var(--lr-ok); }
.lr-split-col.is-poor { border-top-color: var(--lr-danger); }

.lr-split-title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0 0 var(--space-3);
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: 1.3;
    color: var(--lr-ink);
}

.lr-split-col.is-good .lr-split-title i { color: var(--lr-ok); }
.lr-split-col.is-poor .lr-split-title i { color: var(--lr-danger); }

.lr-split-list { margin: 0; padding: 0; list-style: none; }

.lr-split-list li {
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--lr-line);
}

.lr-split-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.lr-split-list li:first-child { padding-top: 0; }

.lr-split-list b {
    display: block;
    font-size: var(--text-base);
    font-weight: 700;
    line-height: 1.4;
    color: var(--lr-ink);
}

.lr-split-list li > span {
    display: block;
    margin-top: 2px;
    font-size: var(--text-sm);
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.lr-split-col.is-good .lr-split-list li > span { color: var(--lr-ok-text); }
.lr-split-col.is-poor .lr-split-list li > span { color: var(--lr-danger-text); }

/* Özgüllük notu: `.lr-split-list span { display:block }` (0,1,1) bu kuralı (0,1,0)
   eziyordu ve rozet tam genişlik bir kutuya dönüşüyordu. Seçici eşitlendi. */
.lr-split-list b .lr-split-pts {
    display: inline-block;
    margin-left: var(--space-2);
    padding: 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    border-radius: 999px;
    border: 1px solid currentColor;
    color: var(--lr-danger-text);
}

/* ---- Karşılaştırma cümlesi ---- */

.lr-context {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    margin: 0 0 var(--space-6);
    padding: var(--space-4);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius);
    background: var(--lr-surface-2);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-context i { margin-top: 3px; color: var(--lr-accent); }

.lr-group-note {
    margin: 0 0 var(--space-3);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--lr-line);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink);
    font-weight: 600;
}

@media (max-width: 720px) {
    .lr-hero { padding: var(--space-4); gap: var(--space-4); }
    .lr-hero-num { font-size: 3.25rem; }
    .lr-hero-headline { font-size: var(--text-2xl); }
    .lr-hero-lede { font-size: var(--text-base); }
    .lr-split { grid-template-columns: 1fr; }
}

/* Araç sonuç panelinde de aynı hiyerarşi: önce siteye özgü tek cümlelik başlık,
   sonra ölçümden türetilmiş giriş. Kalıcı rapor sayfasıyla aynı metin. */
.lr-score-headline {
    margin: 0 0 var(--space-1);
    font-size: var(--text-2xl);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.01em;
    color: var(--lr-ink);
}

.lr-score-verdict-sm {
    margin: 0 0 var(--space-2);
    font-size: var(--text-sm);
    line-height: 1.5;
    color: var(--lr-ink-2);
}

.lr-score-lede {
    padding: var(--space-4);
    margin-bottom: var(--space-2);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface);
}

.lr-score-lede p {
    margin: 0 0 var(--space-3);
    font-size: var(--text-base);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-score-lede p:first-child { color: var(--lr-ink); }
.lr-score-lede p:last-child { margin-bottom: 0; }

.lr-score-lede-context {
    padding-top: var(--space-3);
    border-top: 1px solid var(--lr-line);
    font-size: var(--text-sm) !important;
}

/* ==========================================================================
   19. Açılır bulgu panelleri (rapor sayfası + araç paneli ortak)
   Yükseklik animasyonu grid-template-rows 0fr→1fr ile yapılır; `height: auto`
   doğrudan geçişlenemez. Kapalıyken visibility:hidden — içerik sekme sırasına
   da girmesin. prefers-reduced-motion'da geçiş yok, yalnız aç/kapa.
   ========================================================================== */

.lr-fixes { margin: 0; padding: 0; list-style: none; counter-reset: lr-fix; }

.lr-fix {
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius);
    background: var(--lr-surface);
    margin-bottom: var(--space-2);
    overflow: hidden;
}

.lr-fix:last-child { margin-bottom: 0; }
.lr-fix.is-high { border-left: 3px solid var(--lr-danger); }
.lr-fix.is-medium { border-left: 3px solid var(--lr-warn); }
.lr-fix.is-low { border-left: 3px solid var(--lr-line); }

.lr-fix-head {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    width: 100%;
    min-height: 52px;
    padding: var(--space-2) var(--space-4);
    font-family: inherit;
    font-size: var(--text-base);
    text-align: left;
    background: none;
    border: 0;
    cursor: pointer;
    color: var(--lr-ink);
}

.lr-fix-head:hover { background: var(--lr-surface-2); }
.lr-fix-head:focus-visible { outline: 2px solid var(--lr-accent); outline-offset: -2px; }

.lr-fix-num {
    counter-increment: lr-fix;
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: var(--text-xs);
    font-weight: 700;
    background: var(--lr-surface-2);
    color: var(--lr-ink-2);
}

.lr-fix-num::before { content: counter(lr-fix); }
.lr-fix.is-high .lr-fix-num { color: var(--lr-danger-text); }
.lr-fix.is-medium .lr-fix-num { color: var(--lr-warn-text); }

.lr-fix-title {
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 600;
    line-height: 1.4;
}

.lr-fix-group {
    flex: 0 0 auto;
    font-size: var(--text-xs);
    color: var(--lr-ink-2);
    white-space: nowrap;
}

.lr-fix-weight {
    flex: 0 0 auto;
    padding: 1px var(--space-2);
    font-size: var(--text-xs);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    border: 1px solid currentColor;
    border-radius: 999px;
    color: var(--lr-ink-2);
    white-space: nowrap;
}

.lr-fix.is-high .lr-fix-weight { color: var(--lr-danger-text); }
.lr-fix.is-medium .lr-fix-weight { color: var(--lr-warn-text); }

.lr-fix-head > .lr-fix-chevron {
    flex: 0 0 auto;
    font-size: 0.75em;
    color: var(--lr-ink-2);
    transition: transform 220ms var(--transition-curve);
}

.lr-fix-head[aria-expanded="true"] > .lr-fix-chevron { transform: rotate(180deg); }

/* Yükseklik geçişi: 0fr → 1fr */
/* visibility'yi SÜREYE yaymak yanlıştı: geçiş ilerlemezse panel kapalı takılıyor.
   Doğru kalıp — açarken anında görünür, kapanırken yükseklik bittikten SONRA gizle.
   Böylece görünürlük bir animasyon karesine bağımlı değil. */
.lr-fix-panel {
    display: grid;
    grid-template-rows: 0fr;
    visibility: hidden;
    transition: grid-template-rows 220ms var(--transition-curve),
                visibility 0s linear 220ms;
}

.lr-fix-panel.is-open {
    grid-template-rows: 1fr;
    visibility: visible;
    transition: grid-template-rows 220ms var(--transition-curve),
                visibility 0s linear 0s;
}
.lr-fix-inner { overflow: hidden; min-height: 0; }
.lr-fix-body { padding: 0 var(--space-4) var(--space-4) calc(26px + var(--space-3) + var(--space-4)); }

.lr-fix-now,
.lr-fix-why {
    margin: 0 0 var(--space-3);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink-2);
}

.lr-fix-now b { color: var(--lr-ink); }
.lr-fix-now { color: var(--lr-danger-text); }
.lr-fix-why strong { color: var(--lr-ink); }

.lr-fix-where {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    margin: 0 0 var(--space-3);
    padding: var(--space-2) var(--space-3);
    border-left: 3px solid var(--lr-accent);
    background: var(--lr-surface-2);
    border-radius: var(--border-radius-sm);
    font-size: var(--text-sm);
    line-height: 1.55;
    color: var(--lr-ink-2);
}

.lr-fix-where i { margin-top: 3px; color: var(--lr-accent); }
.lr-fix-where b { color: var(--lr-ink); }

.lr-fix-steps {
    margin: 0 0 var(--space-3);
    padding-left: 0;
    list-style: none;
    counter-reset: lr-step;
}

.lr-fix-steps li {
    position: relative;
    padding: 0 0 var(--space-3) var(--space-8);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--lr-ink);
}

.lr-fix-steps li:last-child { padding-bottom: 0; }

.lr-fix-steps li::before {
    counter-increment: lr-step;
    content: counter(lr-step);
    position: absolute;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: var(--text-xs);
    font-weight: 700;
    color: var(--lr-accent);
    background: var(--lr-surface-2);
    border: 1px solid var(--lr-line);
}

.lr-fix-example {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--space-3);
}

.lr-fix-snippet {
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    overflow: hidden;
}

.lr-fix-snippet > span {
    display: block;
    padding: var(--space-1) var(--space-3);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--lr-line);
    background: var(--lr-surface-2);
}

.lr-fix-snippet.is-bad > span { color: var(--lr-danger-text); }
.lr-fix-snippet.is-good > span { color: var(--lr-ok-text); }

.lr-fix-snippet pre {
    margin: 0;
    padding: var(--space-3);
    overflow-x: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: 1.6;
    color: var(--lr-ink);
}

@media (prefers-reduced-motion: reduce) {
    .lr-fix-panel,
    .lr-fix-head > .lr-fix-chevron { transition: none; }
}

@media (max-width: 720px) {
    .lr-fix-group { display: none; }
    .lr-fix-body { padding-left: var(--space-4); }
    .lr-fix-example { grid-template-columns: 1fr; }
}

/* ==========================================================================
   20. Kanıt blokları — kullanıcının KENDİ satırı
   Genel bir acme.example örneği yerine dosyadaki gerçek satır, satır numarasıyla.
   Önerilen hâl mekanik dönüşümdür (.md eklemek, ": " eklemek); metin yer tutucudur
   çünkü sayfanın ne anlattığını biz uyduramayız.
   ========================================================================== */

.lr-fix-evidence {
    margin-top: var(--space-3);
    padding: var(--space-3);
    border: 1px solid var(--lr-line);
    border-radius: var(--border-radius-sm);
    background: var(--lr-surface-2);
}

.lr-fix-ev-title {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: 0 0 var(--space-2);
    font-size: var(--text-xs);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--lr-ink-2);
}

.lr-fix-ev-title i { color: var(--lr-accent); }

.lr-ev {
    position: relative;
    margin-bottom: var(--space-3);
    padding-left: var(--space-3);
    border-left: 2px solid var(--lr-line);
}

.lr-ev:last-of-type { margin-bottom: var(--space-2); }

.lr-ev-line {
    display: inline-block;
    margin-bottom: 2px;
    font-size: var(--text-xs);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--lr-ink-2);
}

.lr-ev-raw,
.lr-ev-suggest {
    margin: 0;
    padding: var(--space-2) var(--space-3);
    overflow-x: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: 1.6;
    border-radius: var(--border-radius-sm);
}

.lr-ev-raw {
    color: var(--lr-ink);
    background: var(--lr-surface);
    border: 1px solid var(--lr-line);
    border-left: 3px solid var(--lr-danger);
}

.lr-ev-suggest {
    margin-top: var(--space-1);
    color: var(--lr-ink);
    background: var(--lr-surface);
    border: 1px solid var(--lr-line);
    border-left: 3px solid var(--lr-ok);
}

.lr-fix-ev-note {
    margin: 0;
    font-size: var(--text-xs);
    line-height: 1.5;
    color: var(--lr-ink-2);
}
