/* ══════════════════════════════════════════════════════
   STUDY GUIDE — Kelime Kartı Kullanım Kılavuzu
   ══════════════════════════════════════════════════════ */
.study-guide-wrap {
    margin: 12px 16px 24px;
    border-radius: 14px;
    border: 1.5px solid var(--border);
    background: var(--white);
    overflow: hidden;
}

.sgb-section-header {
    padding: 14px 16px 4px;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: var(--ink3);
}

.study-guide-body {
    display: block;
    padding: 0 16px 4px;
}

@keyframes sgbFadeIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Bölümler */
.sgb-section { padding: 12px 0 8px; }

.sgb-title {
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ink3);
    margin-bottom: 10px;
}

.sgb-divider {
    height: 1px;
    background: var(--border);
    margin: 2px 0;
}

/* Grid öğeler */
.sgb-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
@media (max-width: 400px) { .sgb-grid { grid-template-columns: 1fr; } }

.sgb-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 10px;
    background: var(--surface2);
    border: 1px solid var(--border);
}

.sgb-icon {
    font-size: .85rem;
    min-width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--white);
    border-radius: 6px;
    border: 1px solid var(--border);
    font-weight: 800;
    color: var(--ink);
    flex-shrink: 0;
    font-size: .7rem;
}

.sgb-label {
    font-size: .72rem;
    font-weight: 800;
    color: var(--ink);
    margin-bottom: 2px;
}
.sgb-desc {
    font-size: .65rem;
    color: var(--ink3);
    line-height: 1.5;
}

/* Aksiyon kartları */
.sgb-actions-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sgb-action-card {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1.5px solid var(--border);
}
.sgb-action-again { background: rgba(239,68,68,.06); border-color: rgba(239,68,68,.2); }
.sgb-action-known { background: rgba(34,197,94,.06); border-color: rgba(34,197,94,.2); }

.sgb-action-icon { font-size: 1.2rem; flex-shrink: 0; margin-top: 1px; }
.sgb-action-title {
    font-size: .74rem;
    font-weight: 800;
    color: var(--ink);
    margin-bottom: 3px;
}
.sgb-action-desc {
    font-size: .65rem;
    color: var(--ink2);
    line-height: 1.5;
}

/* SM-2 */
.sgb-sm2-info {
    background: var(--surface2);
    border-radius: 10px;
    padding: 10px 12px;
    border: 1px solid var(--border);
}
.sgb-sm2-info p {
    font-size: .7rem;
    color: var(--ink2);
    line-height: 1.6;
    margin-bottom: 8px;
}
.sgb-sm2-steps {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 8px;
}
.sgb-sm2-step {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .68rem;
    color: var(--ink2);
}
.sgb-sm2-num {
    min-width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--color-primary, #c1121f);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .6rem;
    font-weight: 900;
    flex-shrink: 0;
}
.sgb-sm2-tip {
    font-size: .65rem !important;
    color: var(--ink3) !important;
    background: var(--white);
    border-radius: 6px;
    padding: 6px 8px;
    border: 1px solid var(--border);
    margin-bottom: 0 !important;
}