/* ============================================================
   AID ENGLISH — additions on top of the base style.css
   ============================================================ */

/* English question text: readable, left-aligned, serif */
.q-expr.eng{font-family:var(--fm); font-size:clamp(1.02rem,2.1vw,1.28rem); text-align:left;
  padding:.9rem 0 1.5rem; color:var(--ink); line-height:1.75; min-height:0}
.q-expr.eng .ctx{color:var(--muted); font-size:.92em; display:block; margin-bottom:.45rem}
.bk{display:inline-block; min-width:64px; border-bottom:2px solid var(--gold); text-align:center;
  color:var(--gold-hi); font-weight:600; letter-spacing:.06em; padding:0 .3rem}
.vw{color:var(--gold-hi); font-style:italic; font-weight:600; border-bottom:1px dashed var(--gold-deep)}
.subj{border-bottom:2.5px solid var(--gold); font-weight:600; color:var(--gold-hi)}
.xout{text-decoration:line-through; text-decoration-color:rgba(207,127,101,.85); opacity:.5}
.arrowline{color:var(--gold-hi); font-weight:700}

/* Sentence-length options */
.opt{font-family:var(--fm); font-size:clamp(.95rem,1.9vw,1.08rem); min-height:64px; line-height:1.5}
.opt .key{width:38px; height:38px; font-size:.92rem}

/* ===== Passage pane (EST-style line numbers) ===== */
.eq-outer{display:grid; grid-template-columns:minmax(0,1fr); gap:1.3rem; max-width:1000px; margin:0 auto; align-items:start}
.eq-outer.haspass{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
@media(max-width:900px){.eq-outer.haspass{grid-template-columns:1fr}}
.pass-side{background:var(--card); border:1px solid var(--line2); border-radius:16px; padding:1rem 1.1rem; max-height:calc(100vh - 130px); overflow-y:auto; position:sticky; top:74px}
.pass-head{display:flex; align-items:center; gap:.7rem; margin-bottom:.8rem; flex-wrap:wrap}
.pass-title{font-family:var(--fs); font-weight:600; color:var(--gold-hi); font-size:1rem}
.pass-line{display:flex; gap:.7rem; font-family:var(--fm); font-size:1.02rem; line-height:1.7; color:var(--ink)}
.pass-line .ln{flex:none; width:26px; text-align:right; color:var(--faint); font-size:.72rem;
  font-family:var(--fb); font-weight:700; padding-top:.35em; user-select:none}
.pass-line.hl .pt{background:rgba(210,164,77,.14); border-radius:4px}
.pass-line .pt{flex:1}

/* ===== Trick card (intro) ===== */
.card.trick{border-color:var(--gold-deep)}
.trick-head{display:flex; gap:1rem; align-items:flex-start; margin-bottom:1rem}
.trick-ico{font-size:2.6rem; line-height:1; flex:none; filter:drop-shadow(0 0 12px rgba(210,164,77,.35))}
.trick-head h3{font-family:var(--fs); font-size:1.4rem; color:var(--gold-hi); margin-bottom:.35rem}
.trick-head p{color:var(--muted); line-height:1.6; font-size:.95rem}
.trick-steps{list-style:none; counter-reset:ts; display:flex; flex-direction:column; gap:.7rem}
.trick-steps li{counter-increment:ts; position:relative; padding-left:2.5rem; line-height:1.55; font-size:.95rem}
.trick-steps li::before{content:counter(ts); position:absolute; left:0; top:.05em; width:26px; height:26px; border-radius:8px;
  background:var(--gold); color:#1c1408; font-family:var(--fs); font-weight:700; display:grid; place-items:center; font-size:.9rem}
.trick-chips{display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.9rem}

/* ===== Trap system ===== */
.trapbox{margin-top:.6rem; border:1.5px solid rgba(195,105,80,.55); background:rgba(195,105,80,.1);
  border-radius:12px; padding:.85rem 1rem; display:flex; gap:.8rem; align-items:flex-start; line-height:1.6}
.trapbox .te{font-size:1.5rem; flex:none; line-height:1.2}
.trapbox b{color:var(--bad)}
.trapbox .twhy{color:var(--muted); font-size:.9rem}
.trap-pill{display:inline-flex; align-items:center; gap:.4rem; background:rgba(195,105,80,.12); border:1px solid rgba(195,105,80,.5);
  color:var(--bad); border-radius:99px; padding:.3rem .8rem; font-size:.74rem; font-weight:700; white-space:nowrap}
.trap-pill.good{background:var(--good-bg); border-color:rgba(141,181,120,.5); color:var(--good)}
.trap-row{display:flex; align-items:center; gap:1rem; padding:.8rem .4rem; border-bottom:1px solid var(--line); flex-wrap:wrap}
.trap-row:last-child{border-bottom:none}
.trap-count{font-family:var(--fs); font-size:1.5rem; color:var(--bad); font-weight:600; min-width:44px; text-align:center}
.trap-count small{display:block; font-size:.6rem; color:var(--faint); letter-spacing:.14em; text-transform:uppercase}

/* Codex */
.codex-grid{display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1rem}
@media(max-width:820px){.codex-grid{grid-template-columns:1fr}}
.codex-item{background:var(--card); border:1px solid var(--line2); border-radius:14px; padding:1rem 1.1rem}
.codex-item h3{display:flex; gap:.6rem; align-items:center; font-size:1.05rem; color:var(--gold-hi); margin-bottom:.4rem}
.codex-item p{color:var(--muted); font-size:.88rem; line-height:1.6}
.codex-item.trap h3{color:var(--bad)}
.hub-btns{display:flex; gap:.6rem; flex-wrap:wrap}