/* ---------------------------------------------------------------------------
   FM broadcasting deck (week-05/index.html).

   Appearance and layout only. Reuses the shared lecture-deck engine, the
   course tokens (--blue, --cyan, --amber, --red, --green ...) and the existing
   .fm-widget visual language. Everything is scoped to .fb-* classes so the
   original Week 6 deck and Weeks 1-4 are untouched.
   --------------------------------------------------------------------------- */

:root{--fb-mw:#0e7490;--fb-sw:#a15c00;--fb-fm:#155eef;--fb-ok:#167653;--fb-bad:#b42318;--fb-soft:#f3f7fc}

/* ---- composition ------------------------------------------------------- */
.fb-split{display:grid;grid-template-columns:minmax(0,13.5rem) minmax(0,1fr);gap:clamp(.8rem,1.8vw,1.4rem);align-items:start}
.fb-split--wide-side{grid-template-columns:minmax(0,17rem) minmax(0,1fr)}
.fb-split--right{grid-template-columns:minmax(0,1fr) minmax(0,19rem)}
.fb-split--even{grid-template-columns:repeat(2,minmax(0,1fr))}
.fb-split>*{min-width:0}
.fb-side{display:grid;gap:.5rem;align-content:start;font-size:.9rem;line-height:1.5}
.fb-side p{margin:0}
.fb-side .equation{font-size:1.05rem;padding:.2rem 0}
.lecture-slide .fb-side .equation{font-size:1.02rem}
.fb-note{margin:.35rem 0 0;font-size:.78rem;line-height:1.4;color:var(--muted)}
.fb-src{margin:.4rem 0 0;font-size:.72rem;line-height:1.35;color:var(--muted)}
.fb-src a{color:inherit}
.fb-flag{display:inline-block;margin-left:.15em;color:var(--amber);font-weight:900;font-size:.85em;cursor:help;text-decoration:none;vertical-align:super;line-height:0}
.fb-tag{display:inline-block;padding:.05rem .45rem;border-radius:999px;font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border:1px solid currentColor}
.fb-tag--src{color:var(--green)}
.fb-tag--pend{color:var(--amber)}
.fb-tag--local{color:var(--blue)}

/* ---- widget card -------------------------------------------------------- */
.fb-widget{display:grid;gap:.4rem;margin:0;padding:.55rem .7rem;border:1px solid var(--line);border-radius:12px;background:#fff;min-width:0}
.fb-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .9rem;margin:0;padding:0}
.fb-controls[hidden],.fb-control[hidden],.fb-check[hidden],.fb-seg[hidden],.fb-note[hidden],.fb-lab-panel [hidden]{display:none!important}
.fb-control{display:flex;align-items:center;gap:.4rem;font-size:.82rem;font-weight:700;margin:0}
.fb-control input[type=range]{width:min(9.5rem,30vw)}
.fb-control output{font-variant-numeric:tabular-nums;font-weight:800;color:var(--blue-dark);min-width:3.6rem}
.fb-seg{display:inline-flex;gap:2px;padding:2px;border:1px solid var(--line);border-radius:999px;background:#fff}
.fb-seg button{min-height:2rem;padding:.2rem .7rem;border:0;border-radius:999px;background:none;color:var(--muted);font-size:.78rem;font-weight:800;line-height:1.2;white-space:nowrap}
.fb-seg button:hover{background:var(--fb-soft);color:var(--blue-dark)}
.fb-seg button[aria-pressed="true"]{background:var(--blue-dark);color:#fff}
.fb-seg button:focus-visible,.fb-check input:focus-visible+span,.fb-btn:focus-visible{outline:3px solid #7ab4ff;outline-offset:2px}
.fb-btn{min-height:2rem;padding:.2rem .7rem;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--blue-dark);font-size:.78rem;font-weight:800}
.fb-btn:hover{background:var(--fb-soft)}
.fb-check{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:750;cursor:pointer}
.fb-check input{position:absolute;opacity:0;width:1px;height:1px}
.fb-check span{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .6rem;border:1.5px solid var(--sw,#999);border-radius:999px;background:#fff;color:var(--ink);min-height:2rem}
.fb-check span::before{content:"";width:.7rem;height:.7rem;border-radius:3px;border:2px solid var(--sw,#999);background:#fff}
.fb-check input:checked+span{background:color-mix(in srgb,var(--sw,#999) 14%,#fff)}
.fb-check input:checked+span::before{background:var(--sw,#999)}
.fb-readout{margin:0;font-size:.8rem;line-height:1.4;color:var(--muted);font-variant-numeric:tabular-nums}
.fb-readout strong{color:var(--blue-dark);font-weight:800}
.fb-stage{display:block;width:100%;height:auto;background:#fbfdff;border:1px solid #edf1f5;border-radius:8px}
canvas.fb-stage{height:12rem}
.lecture-slide .fb-fig svg,.lecture-slide[data-slide-type="figure"] .fb-fig svg{max-height:17rem}
.fb-fig figcaption{max-width:72ch}
.lecture-slide .fb-fig svg{max-width:46rem;margin-inline:auto}
canvas.fb-canvas--noise{height:17rem}
canvas.fb-canvas--matrix{height:13.5rem}
canvas.fb-canvas--exc{height:14rem}
.fb-widget [data-stage]{max-height:16rem;margin-inline:auto}
.fb-widget--mpx .fb-stage{max-height:13rem;margin-inline:auto}
.fb-widget--lab .fb-stage{max-height:15.5rem;margin-inline:auto}
.fb-widget--lab .fb-stage{background:#fff}

/* ---- svg vocabulary (classes used inside inline and generated svg) ------- */
.fb-svg{display:block;width:100%;height:auto;font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif}
.fb-svg text{font-size:12.5px;fill:var(--ink)}
.fb-svg .t-muted{fill:#5d6878}
.fb-svg .t-b{font-weight:800}
.fb-svg .t-sm{font-size:11px}
.fb-svg .t-lg{font-size:14px;font-weight:800}
.fb-svg .t-mw{fill:var(--fb-mw)}.fb-svg .t-sw{fill:var(--fb-sw)}.fb-svg .t-fm{fill:var(--fb-fm)}.fb-svg .t-bad{fill:var(--fb-bad)}.fb-svg .t-ok{fill:var(--fb-ok)}
.fb-svg .box{fill:#fff;stroke:#9aa7ba;stroke-width:1.4;rx:6}
.fb-svg .box--hi{fill:#eef5ff;stroke:var(--fb-fm)}
.fb-svg .box--dim{fill:#f6f7f9;stroke:#cfd6e0}
.fb-svg .wire{fill:none;stroke:#5d6878;stroke-width:1.6}
.fb-svg .wire--hi{stroke:var(--fb-fm);stroke-width:2.4}
.fb-svg .earth{fill:#dfead8;stroke:#6f8f5f;stroke-width:1.2}
.fb-svg .sky{fill:#f2f8ff}
.fb-svg .layer{fill:#c8d9f5;opacity:.55}
.fb-svg .layer--d{fill:#f6c177;opacity:.55}
.fb-svg .ray{fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.fb-svg .ray--mw{stroke:var(--fb-mw)}.fb-svg .ray--sw{stroke:var(--fb-sw)}.fb-svg .ray--fm{stroke:var(--fb-fm)}.fb-svg .ray--bad{stroke:var(--fb-bad);stroke-dasharray:5 4}
.fb-svg .cover{fill:none;stroke-width:6;stroke-linecap:round;opacity:.9}
.fb-svg .zone{opacity:.28}

/* ---- status chips ------------------------------------------------------ */
.fb-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
.fb-rx{padding:.4rem .5rem;border:1.5px solid var(--line);border-radius:10px;background:#fff;font-size:.78rem;line-height:1.35;text-align:left;color:var(--ink)}
.fb-rx strong{display:block;font-size:.84rem}
.fb-rx .st{display:inline-block;margin-top:.1rem;padding:.02rem .4rem;border-radius:999px;font-size:.68rem;font-weight:850;letter-spacing:.03em;text-transform:uppercase}
.fb-rx.is-ok{border-color:var(--fb-ok)}.fb-rx.is-ok .st{background:#e3f4ec;color:var(--fb-ok)}
.fb-rx.is-no{border-color:var(--fb-bad)}.fb-rx.is-no .st{background:#fbe9e7;color:var(--fb-bad)}
.fb-rx[aria-pressed="true"]{box-shadow:0 0 0 3px #bcd6ff}
.fb-rx:focus-visible{outline:3px solid #7ab4ff;outline-offset:2px}

/* ---- lab stepper ------------------------------------------------------- */
.fb-steps{display:flex;flex-wrap:wrap;gap:.3rem;margin:0;padding:0;list-style:none}
.fb-steps button{min-height:2rem;padding:.2rem .6rem;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--muted);font-size:.76rem;font-weight:800}
.fb-steps button[aria-pressed="true"]{background:var(--blue-dark);border-color:var(--blue-dark);color:#fff}
.fb-steps button:focus-visible{outline:3px solid #7ab4ff;outline-offset:2px}
.fb-lab-panel{margin:0;padding:.4rem .6rem;border-left:4px solid var(--fb-fm);background:#eef5ff;border-radius:0 8px 8px 0;font-size:.82rem;line-height:1.45;min-height:3.1em}
.fb-lab-panel p{margin:0}
.fb-svg [data-step]{opacity:.38;transition:opacity .15s}
.fb-svg [data-step].is-lit{opacity:1}
.fb-lab--all .fb-svg [data-step]{opacity:1}

/* ---- sw schedule timeline table ----------------------------------------- */
.fb-sched{width:100%;border-collapse:collapse;font-size:.74rem;line-height:1.15;font-variant-numeric:tabular-nums}
.fb-sched th{padding:.15rem .35rem;text-align:left;font-size:.7rem;letter-spacing:.02em;color:var(--muted);border-bottom:1.5px solid var(--line);font-weight:800}
.fb-sched td{padding:.04rem .35rem;border-bottom:1px solid #edf1f5;height:1.08rem;white-space:nowrap}
.fb-sched tbody tr{cursor:pointer}
.fb-sched tbody tr:hover td,.fb-sched tbody tr:focus-visible td{background:#f3f7fc}
.fb-sched tbody tr:focus-visible{outline:3px solid #7ab4ff;outline-offset:-2px}
.fb-sched tr.is-on td{background:#fff7e6;font-weight:700}
.fb-sched tr.is-sel td{background:#e8f1ff}
.fb-sched .num{text-align:right}
.fb-sched [lang=ar]{font-size:.82rem;margin-left:.3rem;color:var(--muted)}
.fb-tl{position:relative;width:100%;min-width:13rem;height:.95rem}
.fb-tl::before{content:"";position:absolute;inset:50% 0 auto;height:1px;background:#dce2ea}
.fb-tl::after{content:"";position:absolute;top:-2px;bottom:-2px;left:calc(var(--now,16)/24*100%);width:2px;background:#b42318;opacity:.8}
.fb-tl i{position:absolute;top:.12rem;bottom:.12rem;left:calc(var(--s)/24*100%);width:calc((var(--e) - var(--s))/24*100%);border-radius:3px;background:var(--bar,#a15c00);opacity:.85}
.fb-sched-axis{position:relative;height:.9rem;font-size:.62rem;color:var(--muted)}
.fb-sched-axis span{position:absolute;transform:translateX(-50%)}
.fb-cursor{position:absolute;top:0;bottom:0;width:2px;background:var(--fb-bad);left:calc(var(--now)/24*100%);pointer-events:none}
.fb-b9{--bar:#0e7490}.fb-b13{--bar:#7a3fb0}.fb-b16{--bar:#167653}.fb-b19{--bar:#b42318}.fb-b21{--bar:#155eef}.fb-b31{--bar:#a15c00}.fb-b41{--bar:#5d6878}

/* ---- comparison cards --------------------------------------------------- */
.fb-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}
.fb-cards--two{grid-template-columns:repeat(2,minmax(0,1fr))}
.fb-card{padding:.6rem .75rem;border:1px solid var(--line);border-top:4px solid var(--c,#9aa7ba);border-radius:10px;background:#fff;font-size:.86rem;line-height:1.45}
.fb-card h3{margin:0 0 .2rem;font-size:.98rem;color:var(--c,var(--ink))}
.fb-card p{margin:0 0 .3rem}
.fb-card ul{margin:.2rem 0 0;padding-left:1.1rem}
.fb-card--mw{--c:var(--fb-mw)}.fb-card--sw{--c:var(--fb-sw)}.fb-card--fm{--c:var(--fb-fm)}.fb-card--ok{--c:var(--fb-ok)}.fb-card--bad{--c:var(--fb-bad)}
.fb-card--pending{border-style:dashed;background:#fffaf0}

.fb-ladder{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem .9rem;counter-reset:q}
.fb-ladder li{counter-increment:q;position:relative;padding:.22rem .5rem .22rem 2.8rem;min-height:3.5rem;display:flex;flex-direction:column;justify-content:center;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:1rem;line-height:1.3}
.fb-ladder li::before{content:counter(q);position:absolute;left:.55rem;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:50%;background:var(--blue-dark);color:#fff;font-weight:800;font-size:.85rem}
.fb-ladder li.is-last{border-color:var(--fb-fm);background:#eef5ff}
.fb-ladder small{display:block;color:var(--muted);font-size:.8rem}

.fb-table{width:100%;border-collapse:collapse;font-size:.82rem;line-height:1.35}
.fb-table th,.fb-table td{padding:.3rem .5rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.fb-table th{font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

.fb-eq{padding:.35rem .6rem;border-left:4px solid var(--cyan);background:#ecf9fb;border-radius:0 8px 8px 0}

/* ---- responsive --------------------------------------------------------- */
@media(max-width:1023px){
  .fb-split,.fb-split--wide-side,.fb-split--right{grid-template-columns:minmax(0,1fr)}
  canvas.fb-stage{height:14rem}
}
@media(max-width:800px){
  .fb-scroll{overflow-x:auto;border-radius:8px}
  .fb-scroll>svg{min-width:34rem}
  .fb-fig{overflow-x:auto}
  .fb-fig svg{min-width:34rem}
  .fb-split--even,.fb-cards,.fb-cards--two,.fb-ladder,.fb-chips{grid-template-columns:minmax(0,1fr)}
  .fb-control{flex:1 1 100%}
  .fb-control input[type=range]{width:100%;flex:1}
  .fb-seg button,.fb-btn,.fb-steps button,.fb-check span{min-height:44px}
  .fb-sched-wrap{overflow-x:auto}
  .fb-sched{min-width:34rem}
  .fb-svg text{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.fb-svg [data-step]{transition:none}}
