/* Thẻ khoá tính năng (Sprint 5 · A) — cùng bộ màu, phông của trang học. Dùng ở trang bài học và "Gói của tôi". */
.fl-card{display:flex;align-items:center;flex-wrap:wrap;gap:12px 16px;padding:20px;border-radius:var(--r-lg,18px);background:var(--surface);border:1px solid var(--line-strong,var(--line));color:var(--ink);box-shadow:0 10px 30px -18px rgba(20,30,60,.35)}
.fl-card.compact{padding:14px 16px;box-shadow:none}
.fl-ic{flex:none;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:color-mix(in srgb,var(--blue-600) 10%,transparent);color:var(--blue-600)}
.fl-body{flex:1 1 220px;min-width:0}
.fl-h{margin:0;font-size:18px;line-height:1.3;font-weight:800;overflow-wrap:anywhere}
.fl-card.compact .fl-h{font-size:16px}
.fl-p{margin:4px 0 0;color:var(--muted);font-size:14px;line-height:1.5}
.fl-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border-radius:999px;background:var(--ink);color:#fff;font-weight:700;font-size:15px;text-decoration:none;white-space:nowrap}
.fl-btn:hover{opacity:.9}
.fl-btn:focus-visible{outline:2px solid var(--blue-600);outline-offset:2px}
.fl-svg{display:block}
/* Bài bị khoá: vài vạch mờ giả nội dung phía sau thẻ (KHÔNG phải nội dung thật — nội dung thật không có trong trang) */
.fl-lesson{position:relative;margin-top:24px}
.fl-blur{display:flex;flex-direction:column;gap:12px;padding:8px 4px;filter:blur(3px);opacity:.55;pointer-events:none;user-select:none}
.fl-blur span{display:block;height:14px;border-radius:7px;background:var(--line-strong,var(--line))}
.fl-blur span:nth-child(2n){width:82%}.fl-blur span:nth-child(3n){width:64%}
.fl-lesson .fl-card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,calc(100% - 8px));box-sizing:border-box}
.fl-state{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;margin-top:24px;padding:40px 16px;border-radius:var(--r-lg,18px);background:var(--surface);border:1px solid var(--line);color:var(--muted)}
.fl-state h2{margin:0;color:var(--ink);font-size:20px}
.fl-state p{margin:0;max-width:460px}
.fl-spin{width:26px;height:26px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--blue-600);animation:spin .8s linear infinite}
.lock-tag{display:inline-flex;align-items:center;gap:4px;color:var(--blue-600);font-weight:700}
.lock-tag .fl-svg{width:14px;height:14px}
.pill.locked{opacity:.85}
.pill .fl-svg{display:inline-block;width:14px;height:14px;vertical-align:-2px;margin-right:4px}
@media (max-width:560px){
  .fl-lesson .fl-card{position:static;transform:none;width:auto;margin-top:-150px}
  .fl-btn{flex:1 1 100%}
}
/* Hạn mức (Sprint 5 · B) */
.lm-row{display:flex;flex-direction:column;gap:6px;padding:10px 0;border-top:1px solid var(--line)}
.lm-row:first-child{border-top:0}
.lm-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:15px}
.lm-lb{overflow-wrap:anywhere}
.lm-val{white-space:nowrap;font-variant-numeric:tabular-nums}
.lm-bar{height:8px;border-radius:999px;background:var(--surface-2,#eef1f6);overflow:hidden}
.lm-bar span{display:block;height:100%;border-radius:999px;background:var(--blue-600)}
.lm-near .lm-bar span{background:#C98A00}
.lm-full .lm-bar span{background:#B4231A}
.lm-msg{margin:0;font-size:13px;color:var(--muted)}
.lm-near .lm-msg{color:#7A4B00}
.lm-full .lm-msg{color:#9F2A22;font-weight:600}
.lm-msg a{color:inherit;font-weight:700}
.lm-off .lm-val,.lm-unlimited .lm-val{color:var(--muted);font-weight:600}