/* =====================================================================
   Syllabus page (syllabus.php) — builds on result.css (.rf-card, .rf-steps …)
   ===================================================================== */
.sy-block{margin-top:26px}
.sy-block:first-of-type{margin-top:0}
.sy-in{animation:zpop .45s var(--ease) both}
.sy-label{display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;margin-bottom:14px;flex-wrap:wrap}
.sy-label b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:13px;background:var(--ink);color:var(--lime)}
.sy-label small{font-weight:500;color:var(--muted);font-size:13.5px}

/* category cards */
.sy-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.sy-cat{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;background:#fff;
  border:1.5px solid rgba(10,18,7,.08);transition:all .35s var(--ease);color:var(--text)}
.sy-cat:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(10,18,7,.1);border-color:var(--green-l)}
.sy-cat-ic{width:48px;height:48px;flex-shrink:0;border-radius:14px;display:grid;place-items:center;font-size:20px;
  background:linear-gradient(135deg,var(--lime),var(--lime-d));color:var(--ink);transition:all .35s var(--ease)}
.sy-cat-tx{flex:1;min-width:0}
.sy-cat-tx b{display:block;font-size:15.5px;line-height:1.3}
.sy-cat-tx small{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}
.sy-cat-go{color:var(--muted-2);font-size:13px;transition:transform .3s var(--ease)}
.sy-cat:hover .sy-cat-go{transform:translateX(3px);color:var(--green)}
.sy-cats.is-picked .sy-cat:not(.on){opacity:.62}
.sy-cats.is-picked .sy-cat:not(.on):hover{opacity:1}
.sy-cat.on{background:var(--ink);border-color:var(--ink);color:#fff;box-shadow:0 18px 40px rgba(10,18,7,.18)}
.sy-cat.on .sy-cat-tx small{color:rgba(255,255,255,.65)}
.sy-cat.on .sy-cat-ic{background:rgba(255,255,255,.1);color:var(--lime)}
.sy-cat.on .sy-cat-go{color:var(--lime);font-size:18px}

/* language chips */
.sy-langs{display:flex;flex-wrap:wrap;gap:10px}
.sy-lang{display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border-radius:100px;font-weight:600;font-size:15px;
  background:var(--cream);border:1.5px solid rgba(10,18,7,.08);color:var(--text);transition:all .3s var(--ease)}
.sy-lang i{color:var(--green)}
.sy-lang em{font-style:normal;font-size:11.5px;font-weight:700;background:#fff;border-radius:20px;padding:2px 8px;color:var(--muted)}
.sy-lang:hover{border-color:var(--green);color:var(--green-d)}
.sy-lang.on{background:var(--green);border-color:var(--green);color:#fff}
.sy-lang.on i{color:var(--lime)}
.sy-lang.on em{background:rgba(255,255,255,.2);color:#fff}

/* access code */
.sy-codeform{margin-top:0}
.sy-code-row{display:flex;gap:12px;align-items:stretch;flex-wrap:wrap}
.sy-code-row .rf-code{text-transform:uppercase;font-size:18px!important;height:100%;min-height:52px}
.sy-code-row .btn{white-space:nowrap}
.sy-unlocked{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 18px;border-radius:16px;
  background:rgba(62,168,69,.1);color:var(--green-d);font-weight:600}
.sy-unlocked form{margin:0}
.sy-lockbtn{border:none;background:#fff;color:var(--text);padding:8px 14px;border-radius:100px;font:inherit;font-size:13px;cursor:pointer;
  border:1px solid rgba(10,18,7,.1)}
.sy-lockbtn:hover{background:var(--ink);color:#fff}

/* files */
.sy-out{max-width:980px;margin:36px auto 0}
.sy-out-head{margin-bottom:16px}
.sy-out-head h2{font-size:clamp(1.6rem,2.6vw,2.1rem)}
.sy-files{display:grid;gap:12px}
.sy-file{display:flex;align-items:center;gap:16px;background:#fff;border-radius:20px;padding:18px 20px;
  border:1px solid rgba(10,18,7,.06);box-shadow:var(--shadow);animation:zpop .45s var(--ease) both}
.sy-file-ic{width:52px;height:52px;flex-shrink:0;border-radius:14px;display:grid;place-items:center;font-size:23px;background:#fdecea;color:#c0392b}
.sy-file-ic.ext-jpg,.sy-file-ic.ext-jpeg,.sy-file-ic.ext-png,.sy-file-ic.ext-webp{background:#e8f3ff;color:#2a6fbd}
.sy-file-ic.ext-doc,.sy-file-ic.ext-docx{background:#e8efff;color:#2b579a}
.sy-file-ic.ext-ppt,.sy-file-ic.ext-pptx{background:#fff0e8;color:#c4521f}
.sy-file-ic.ext-xls,.sy-file-ic.ext-xlsx{background:#e7f6ec;color:#1f7244}
.sy-file-tx{flex:1;min-width:0}
.sy-file-tx b{display:block;font-size:16.5px;line-height:1.35}
.sy-file-tx p{margin:3px 0 0;color:var(--muted);font-size:14px;line-height:1.5}
.sy-file-tx small{display:block;margin-top:5px;color:var(--muted-2);font-size:12.5px}
.sy-file-act{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.btn.sy-dark{background:var(--ink);color:#fff}
.btn.sy-dark:hover{background:var(--ink-3);color:var(--lime)}
.btn.sy-light{background:var(--cream-2);color:var(--text)}
.btn.sy-light:hover{background:#e6e9dc}

/* viewer */
.sy-viewer{margin-top:22px;background:#fff;border-radius:22px;overflow:hidden;box-shadow:var(--shadow-lg);border:1px solid rgba(10,18,7,.06)}
.sy-viewer[hidden]{display:none}
.sy-viewer-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;background:var(--ink);color:#fff;flex-wrap:wrap}
.sy-viewer-bar>div{display:flex;gap:8px}
.sy-viewer iframe{display:block;width:100%;height:min(82vh,900px);border:0;background:#525659}

@media(max-width:760px){
  .sy-cats{grid-template-columns:1fr}
  .sy-file{flex-wrap:wrap;padding:16px}
  .sy-file-act{width:100%;justify-content:stretch}
  .sy-file-act .btn{flex:1;justify-content:center}
  .sy-code-row .btn{width:100%;justify-content:center}
}