/* Shared styles for MCC tutoring lesson kits */
.resource-wrap{max-width:900px}
.guide-section{background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px;margin-bottom:22px;box-shadow:0 6px 22px rgba(20,20,20,.05)}
.guide-section h2{font-size:1.7rem;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.guide-section h3{font-size:1.18rem;margin-top:22px}
.guide-section p,.guide-section li{color:var(--muted)}
.guide-section ul,.guide-section ol{margin:0 0 1em 1.2em}
.guide-section li{margin-bottom:.4em}
/* lesson meta bar */
.lesson-meta{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 8px}
.lesson-meta span{background:#fff7ef;border:1px solid #f6d4b2;border-radius:999px;padding:8px 16px;font-family:var(--eyebrow);font-size:.86rem;color:var(--orange-dark);letter-spacing:.02em}
/* time pill on section heads */
.tpill{font-family:var(--eyebrow);font-size:.72rem;letter-spacing:.06em;background:var(--orange);color:#fff;border-radius:999px;padding:5px 12px;line-height:1}
/* sticky sub-nav */
.hb-nav{position:sticky;top:74px;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hb-nav .wrap{display:flex;gap:8px;overflow-x:auto;padding:11px 24px;justify-content:center;-webkit-overflow-scrolling:touch}
.hb-nav a{white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:7px 14px;background:#fff;font-family:var(--eyebrow);font-size:.76rem;letter-spacing:.03em;color:var(--ink);transition:background .25s,border-color .25s,color .25s}
.hb-nav a:hover{border-color:var(--orange);color:var(--orange-dark);text-decoration:none}
.hb-nav a.active{background:var(--orange);border-color:var(--orange);color:#fff}
.anchor{scroll-margin-top:140px}
/* tutor tip callout */
.tip{background:#eef7f1;border:1px solid #bfe3cd;border-left:4px solid #1f9d57;border-radius:12px;padding:14px 18px;margin:16px 0 0;color:#235}
.tip b{color:#157a41}
/* level question blocks */
.levels{display:grid;gap:12px;margin-top:6px}
.lvl{border:1px solid var(--line);border-left-width:5px;border-radius:0 12px 12px 0;padding:14px 18px;background:#fff}
.lvl .tag{font-family:var(--eyebrow);font-size:.74rem;letter-spacing:.05em;font-weight:700;display:inline-block;margin-bottom:6px}
.lvl.beg{border-left-color:#3b9c5a}.lvl.beg .tag{color:#2c7a44}
.lvl.int{border-left-color:#e09227}.lvl.int .tag{color:#b9700f}
.lvl.adv{border-left-color:#b4532e}.lvl.adv .tag{color:#8f3c1c}
.lvl ul{margin:0 0 0 1.1em}
.lvl li{margin-bottom:.3em}
/* vocab list with speaker */
.vocab{list-style:none;margin:0;padding:0}
.vocab li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-bottom:1px dashed var(--line)}
.vocab li:last-child{border-bottom:0}
.say{flex:none;width:40px;height:40px;border-radius:11px;border:0;background:linear-gradient(135deg,var(--orange),#ffa94d);color:#fff;font-size:1.05rem;cursor:pointer;box-shadow:0 6px 14px rgba(245,130,32,.3);transition:transform .2s}
.say:hover{transform:translateY(-2px)}
.say:active{transform:scale(.94)}
.vphrase b{font-family:var(--body);color:var(--ink);font-size:1.08rem}
.vphrase .ex{display:block;color:var(--muted-2);font-size:.97rem;margin-top:2px}
/* model frames / dialogue box */
.frames{background:#faf7f2;border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin-top:8px}
.frames p{margin:.3em 0;color:var(--ink)}
.frames .blank{color:var(--orange-dark);font-weight:700}
/* dialogue lines */
.dialogue{margin-top:8px}
.dialogue .line{display:flex;gap:10px;align-items:flex-start;padding:7px 0}
.dialogue .who{flex:none;font-weight:700;color:var(--orange-dark);min-width:34px}
.dialogue .line p{margin:0;color:var(--ink)}
.dialogue .say{width:34px;height:34px;font-size:.95rem}
.to-top{position:fixed;right:20px;bottom:20px;z-index:60;width:46px;height:46px;border-radius:50%;background:var(--orange);color:#fff;border:0;font-size:1.2rem;box-shadow:0 10px 26px rgba(245,130,32,.4);cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.to-top.show{opacity:1;pointer-events:auto}.to-top:hover{transform:translateY(-3px)}