*{box-sizing:border-box}body{margin:0;background:#f7f4ec;color:#17283b;font:17px/1.65 system-ui,sans-serif}header,main{max-width:1440px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;border-bottom:1px solid #d8d2c6}a{color:#98511e;text-underline-offset:4px}h1{font:600 clamp(28px,3.5vw,44px)/1.25 Georgia,serif;margin:12px 0 20px}h2{font-size:20px;margin:0}p{color:#556071}.eyebrow{font-size:13px;letter-spacing:.06em;color:#955326}.intro{margin:20px 0 32px}.shelf-heading,.lesson-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.films{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:18px 4px 24px;scrollbar-width:thin}.film{flex:0 0 240px;scroll-snap-align:start;text-align:left;padding:0;overflow:hidden;border-radius:14px;white-space:normal}.film img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.film .info{padding:14px;display:block}.film strong{display:block;font-size:18px;line-height:1.4;min-height:52px;margin:8px 0}.film small{display:block;opacity:.8;font-size:13px}.film[aria-pressed=true]{outline:3px solid #a96732;outline-offset:1px}.grid{display:grid;grid-template-columns:1.15fr 1fr;gap:24px}#lesson{margin:28px 0 48px;scroll-margin-top:20px}.lesson-heading>a{font-size:14px;white-space:nowrap}.hint{font-size:15px}video{width:100%;aspect-ratio:16/9;background:#111;border-radius:16px}.panel{border:1px solid #d8d2c6;border-radius:16px;background:#fff;overflow:hidden}.tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:14px;border-bottom:1px solid #ddd}.languages{display:flex;gap:6px;flex-wrap:wrap}button,select{font:inherit;border:1px solid #c8c8c8;background:#fff;border-radius:22px;padding:7px 13px;cursor:pointer;color:inherit}button:hover{border-color:#98511e}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #a96732;outline-offset:3px}button[aria-pressed=true]{background:#17283b;color:#fff}.lines{position:relative;height:55vh;min-height:300px;max-height:640px;overflow:auto;overscroll-behavior:contain}.cue{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid #ece7df;border-radius:0;padding:18px 22px;background:#fff;line-height:1.6}.cue.on{background:#fff0df;box-shadow:inset 4px 0 #c26924}.stamp{color:#9b5b25;font:13px system-ui;display:block;margin-bottom:7px}.en{font:21px/1.55 Georgia,serif;display:block}.zh{color:#526072;display:block;margin-top:7px}[data-lang=en] .zh,[data-lang=zh] .en{display:none}.status{font-variant-numeric:tabular-nums;font-size:14px}.caption,.note,details{font-size:13px;color:#647081}.note a{overflow-wrap:anywhere}.note p{margin:8px 0}summary{cursor:pointer}.error{color:#a22}body.study .intro{display:none}@media(max-width:800px){.grid{grid-template-columns:1fr}main,header{padding:16px}.lines{height:46vh;min-height:250px}.en{font-size:19px}.film{flex-basis:205px}.film strong{font-size:16px}.lesson-heading{align-items:start;flex-direction:column;gap:0}.tools{font-size:14px}.playback{padding:12px 0}.film img{aspect-ratio:2/1}.intro{margin-bottom:20px}#lesson{margin-top:16px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
