:root{color:#102033;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-ink:#102033;--color-muted-strong:#556578;--color-muted:#6f8093;--color-accent:#2f6df6;--color-surface:#ffffffeb;--color-surface-muted:#f3f7fb;--color-border:#10203314;--radius-panel:20px;--shadow-panel:0 14px 34px #1020330f;background:#eef3f8;font-family:IBM Plex Sans,Inter,Source Han Sans SC,Noto Sans SC,system-ui,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html{background:#eef3f8}body{min-width:320px;margin:0}button,video{font:inherit}button{border:0}.app-shell{min-height:100vh;color:var(--color-ink);background:radial-gradient(circle at top,#2f6df614,#0000 26%),linear-gradient(#f4f7fb 0%,#eef3f8 100%);padding:28px}.app-frame{grid-template-columns:232px minmax(0,1fr) 320px;grid-template-areas:"lesson header vocab""lesson video vocab""lesson spotlight vocab""lesson transcript vocab";align-items:start;gap:18px 20px;max-width:1520px;margin:0 auto;display:grid}.player-shell,.player-stage{display:contents}.lesson-strip,.player-header,.video-panel,.spotlight-panel,.transcript-panel,.sidebar{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-panel);min-width:0;box-shadow:var(--shadow-panel)}.lesson-strip{background:linear-gradient(180deg, #fffffffa, #f8fbfff5), var(--color-surface);grid-area:lesson;max-height:calc(100vh - 56px);padding:20px 14px 14px;position:sticky;top:28px;overflow:auto}.lesson-rail .section-heading{margin-bottom:14px;padding:0 6px}.lesson-rail-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.lesson-rail-list li{min-width:0}.lesson-search{gap:8px;margin:0 6px 14px;display:grid}.lesson-search-label{color:var(--color-muted-strong);letter-spacing:.08em;text-transform:uppercase;font-size:.76rem;font-weight:700}.lesson-search input{border:1px solid var(--color-border);width:100%;min-height:42px;color:var(--color-ink);background:#ffffffe0;border-radius:14px;outline:none;padding:0 14px}.lesson-search input:focus{border-color:#2f6df64d;box-shadow:0 0 0 3px #2f6df614}.lesson-pill{border-radius:var(--radius-panel);text-align:left;width:100%;color:var(--color-ink);cursor:pointer;background:0 0;border:1px solid #0000;padding:12px 14px;transition:background-color .14s,border-color .14s,box-shadow .14s,color .14s}.lesson-pill:hover{background:var(--color-surface-muted);border-color:#2f6df61f}.lesson-pill strong,.lesson-pill span{display:block}.lesson-pill-top{justify-content:space-between;align-items:flex-start;gap:10px;display:flex}.lesson-pill strong{-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:.95rem;font-weight:600;line-height:1.45;display:-webkit-box;overflow:hidden}.lesson-pill span{color:var(--color-muted);letter-spacing:.08em;margin-top:6px;font-size:.74rem}.lesson-status{letter-spacing:.04em;white-space:nowrap;border-radius:999px;flex-shrink:0;align-items:center;min-height:22px;padding:0 8px;font-size:.68rem;font-weight:700;display:inline-flex}.lesson-pill-top .lesson-status{margin-top:0}.lesson-status-pending{color:var(--color-muted-strong);background:#eef3f8}.lesson-status-completed{color:var(--color-accent);background:#2f6df61f}.lesson-pill-active{background:#2f6df61a;border-color:#2f6df62e;box-shadow:inset 0 0 0 1px #2f6df608}.player-header{grid-area:header;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:16px;padding:22px 24px;display:grid}.player-header h1,.section-heading h2{color:var(--color-ink);letter-spacing:-.02em;margin:0;font-size:clamp(1.2rem,1rem + .9vw,2rem);font-weight:650;line-height:1.15}.player-description,.section-heading p,.lesson-pill span,.transcript-title,.transcript-chinese,.vocab-card p,.vocab-card-meta,.playback-meta{color:var(--color-muted)}.player-description{-webkit-line-clamp:3;-webkit-box-orient:vertical;max-width:62ch;margin:10px 0 0;font-size:.95rem;line-height:1.6;display:-webkit-box;overflow:hidden}.playback-meta{text-align:right;text-transform:uppercase;letter-spacing:.08em;flex-direction:column;align-self:center;align-items:flex-end;gap:8px;font-size:.83rem;display:flex}.playback-controls{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.playback-toggle,.playback-speed-select{border:1px solid var(--color-border);background:var(--color-surface-muted);min-height:34px;color:var(--color-muted-strong);letter-spacing:.04em;border-radius:999px;font-size:.74rem;font-weight:700;transition:background-color .14s,border-color .14s,box-shadow .14s,color .14s}.playback-toggle{cursor:pointer;padding:0 14px}.playback-toggle:hover,.playback-speed-select:hover{border-color:#2f6df62e}.playback-toggle:focus-visible,.playback-speed-select:focus-visible{border-color:#2f6df642;outline:none;box-shadow:0 0 0 3px #2f6df614}.playback-toggle[aria-pressed=true]{color:var(--color-accent);background:#2f6df61a;border-color:#2f6df638}.playback-speed-select{cursor:pointer;appearance:none;padding:0 34px 0 12px}.playback-follow{white-space:nowrap}.playback-meta strong{color:var(--color-ink);letter-spacing:-.03em;font-size:1.15rem;line-height:1}.section-kicker{color:var(--color-accent);letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px;font-size:.73rem;font-weight:700;display:inline-flex}.section-stat{min-height:30px;color:var(--color-accent);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;background:#2f6df614;border-radius:999px;align-items:center;padding:0 12px;font-size:.74rem;font-weight:700;display:inline-flex}.header-pills{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.header-pill{background:var(--color-surface-muted);min-height:30px;color:var(--color-muted-strong);letter-spacing:.05em;text-transform:uppercase;border-radius:999px;align-items:center;padding:0 11px;font-size:.77rem;font-weight:700;display:inline-flex}.video-panel{background:linear-gradient(180deg, #fffffff5, #f4f8fdf5), var(--color-surface);grid-area:video;padding:14px}.lesson-video{aspect-ratio:16/9;object-fit:cover;border-radius:calc(var(--radius-panel) - 6px);background:#0f1728;width:100%;display:block;box-shadow:inset 0 0 0 1px #ffffff08}.spotlight-panel{grid-area:spotlight;padding:20px 24px 22px}.spotlight-top{justify-content:space-between;gap:12px;margin-bottom:16px;display:flex}.spotlight-chip,.spotlight-replay{letter-spacing:.06em;text-transform:uppercase;border-radius:999px;align-items:center;min-height:32px;padding:0 12px;font-size:.75rem;font-weight:600;display:inline-flex}.spotlight-chip{background:var(--color-surface-muted);color:var(--color-muted-strong)}.spotlight-replay{color:var(--color-accent);background:#2f6df61a}.sentence-line{color:var(--color-ink);letter-spacing:-.02em;margin:0;font-size:clamp(1.5rem,1.15rem + 1vw,2.35rem);font-weight:650;line-height:1.38}.sentence-word{border-radius:8px;padding:1px 3px;transition:background-color .14s,color .14s;display:inline-block}.sentence-word-active{color:#fff;background:var(--color-accent)}.translation-line{color:var(--color-muted-strong);margin:14px 0 0;font-size:1rem;line-height:1.6}.follow-reading-panel{border-top:1px solid #0f172814;gap:10px;margin-top:18px;padding-top:16px;display:grid}.follow-reading-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.follow-reading-button{border:1px solid var(--color-border);background:var(--color-surface-muted);min-height:38px;color:var(--color-muted-strong);letter-spacing:.04em;cursor:pointer;border-radius:999px;padding:0 16px;font-size:.82rem;font-weight:700;transition:background-color .14s,border-color .14s,box-shadow .14s,color .14s}.follow-reading-button:hover{border-color:#2f6df62e}.follow-reading-button:focus-visible{border-color:#2f6df642;outline:none;box-shadow:0 0 0 3px #2f6df614}.follow-reading-button-primary{color:var(--color-accent);background:#2f6df61a;border-color:#2f6df633}.follow-reading-status{color:var(--color-accent);letter-spacing:.06em;font-size:.8rem;font-weight:700}.follow-reading-error{color:#b42318;margin:0;font-size:.88rem;line-height:1.5}.transcript-panel,.sidebar{padding:20px}.transcript-panel{grid-area:transcript}.sidebar{background:linear-gradient(180deg, #fcfefffa, #f7fafefa), var(--color-surface);grid-area:vocab;max-height:calc(100vh - 56px);position:sticky;top:28px;overflow:auto}.section-heading{justify-content:space-between;align-items:start;gap:12px;margin-bottom:16px;display:flex}.section-heading p{margin:8px 0 0;font-size:.92rem;line-height:1.55}.transcript-list{gap:10px;max-height:520px;padding-right:4px;display:grid;overflow:auto}.transcript-row{border-radius:var(--radius-panel);text-align:left;cursor:pointer;background:#f7fafc;border:1px solid #0000;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;width:100%;padding:14px 16px;transition:background-color .14s,border-color .14s,box-shadow .14s;display:grid}.transcript-row:hover{background:#f2f6fb;border-color:#2f6df61f}.transcript-row-active{background:#2f6df614;border-color:#2f6df62e;box-shadow:inset 0 0 0 1px #2f6df605}.replay-button{min-width:68px;min-height:32px;color:var(--color-accent);letter-spacing:.04em;text-transform:uppercase;background:#2f6df614;border-radius:999px;justify-content:center;align-self:center;align-items:center;padding:0 12px;font-size:.74rem;font-weight:600;display:inline-flex}.transcript-copy{min-width:0}.transcript-title{text-transform:uppercase;letter-spacing:.04em;justify-content:space-between;align-items:baseline;gap:10px;font-size:.8rem;display:flex}.transcript-title strong{color:var(--color-ink);font-weight:600}.transcript-english,.transcript-chinese,.vocab-card p{margin:8px 0 0;line-height:1.55}.transcript-english{color:var(--color-ink);font-size:1rem;font-weight:600}.transcript-chinese{font-size:.95rem}.vocab-list{gap:10px;display:grid}.public-page{min-height:100vh;color:var(--color-ink);background:radial-gradient(circle at top,#2f6df614,#0000 26%),linear-gradient(#f4f7fb 0%,#eef3f8 100%);padding:28px}.public-nav{justify-content:space-between;align-items:center;gap:18px;max-width:1120px;margin:0 auto 28px;display:flex}.public-brand,.public-nav a,.public-primary-link,.public-secondary-link,.public-lesson-card{color:inherit;text-decoration:none}.public-brand{letter-spacing:-.01em;font-size:1rem;font-weight:750}.public-nav nav{align-items:center;gap:16px;display:flex}.public-nav nav a{color:var(--color-muted-strong);font-size:.9rem;font-weight:650}.public-hero,.public-section,.public-lesson-hero,.public-content-grid,.public-feature-grid{max-width:1120px;margin:0 auto}.public-hero,.public-lesson-hero{align-items:center;min-height:420px;display:grid}.public-hero h1,.public-section h1,.public-lesson-hero h1{max-width:760px;color:var(--color-ink);letter-spacing:0;margin:0;font-size:clamp(2.2rem,1.6rem + 3vw,4.8rem);font-weight:750;line-height:1.04}.public-hero p,.public-section-header p,.public-lesson-hero p{max-width:660px;color:var(--color-muted-strong);margin:18px 0 0;font-size:1.05rem;line-height:1.75}.public-actions{flex-wrap:wrap;gap:12px;margin-top:28px;display:flex}.public-primary-link,.public-secondary-link{border-radius:10px;justify-content:center;align-items:center;min-height:44px;padding:0 18px;font-size:.92rem;font-weight:700;display:inline-flex}.public-primary-link{background:var(--color-accent);color:#fff}.public-secondary-link{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-muted-strong)}.public-feature-grid,.public-lesson-grid,.public-content-grid{gap:16px;display:grid}.public-feature-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:28px}.public-feature-grid article,.public-lesson-card,.public-panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-panel);min-width:0;box-shadow:var(--shadow-panel)}.public-feature-grid article{padding:22px}.public-feature-grid h2,.public-panel h2,.public-lesson-card h2,.public-vocab-list h3{color:var(--color-ink);letter-spacing:0;margin:0;font-weight:700}.public-feature-grid h2,.public-panel h2{font-size:1.15rem}.public-feature-grid p,.public-lesson-card p,.public-vocab-list p,.public-vocab-list span,.public-transcript-row span{color:var(--color-muted)}.public-feature-grid p{margin:10px 0 0;line-height:1.6}.public-section{padding-top:28px}.public-section-header{margin-bottom:24px}.public-state{max-width:1120px;color:var(--color-muted-strong);margin:40px auto}.public-lesson-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.public-lesson-card{transition:transform .14s,border-color .14s,box-shadow .14s;overflow:hidden}.public-lesson-card:hover{border-color:#2f6df62e;transform:translateY(-2px)}.public-lesson-card img,.public-lesson-hero img{object-fit:cover;background:#dbe5ef;width:100%}.public-lesson-card img{aspect-ratio:16/9}.public-lesson-card div{padding:18px}.public-lesson-card h2{font-size:1.05rem;line-height:1.3}.public-lesson-card p{margin:10px 0 0;font-size:.92rem;line-height:1.55}.public-lesson-card span{color:var(--color-accent);letter-spacing:.08em;margin-top:16px;font-size:.75rem;font-weight:700;display:inline-flex}.public-lesson-hero{grid-template-columns:minmax(0,1fr) minmax(280px,420px);gap:36px}.public-lesson-hero img{aspect-ratio:4/3;border-radius:var(--radius-panel);border:1px solid var(--color-border);box-shadow:var(--shadow-panel)}.public-content-grid{grid-template-columns:minmax(0,1fr) 340px;align-items:start;margin-top:28px}.public-panel{padding:22px}.public-transcript-list,.public-vocab-list{gap:12px;margin-top:18px;display:grid}.public-transcript-row{border-bottom:1px solid var(--color-border);padding-bottom:14px}.public-transcript-row:last-child{border-bottom:0;padding-bottom:0}.public-transcript-row strong{color:var(--color-accent);letter-spacing:.08em;text-transform:uppercase;font-size:.75rem}.public-transcript-row p{color:var(--color-ink);margin:8px 0 0;font-size:1rem;font-weight:650;line-height:1.55}.public-transcript-row span{margin-top:6px;line-height:1.55;display:block}.public-vocab-list article{background:var(--color-surface-muted);border-radius:12px;padding:14px}.public-vocab-list h3{font-size:1rem}.public-vocab-list p{gap:8px;margin:6px 0 0;font-size:.85rem;display:flex}.public-vocab-list article>span{margin-top:8px;line-height:1.55;display:block}.active-vocab-banner{border-radius:calc(var(--radius-panel) - 4px);background:linear-gradient(#2f6df614,#2f6df608);border:1px solid #2f6df624;gap:4px;margin-bottom:14px;padding:14px 16px;display:grid}.active-vocab-label{color:var(--color-accent);letter-spacing:.1em;text-transform:uppercase;font-size:.72rem;font-weight:700}.active-vocab-banner strong{color:var(--color-ink);letter-spacing:-.01em;font-size:1rem}.vocab-card{border-radius:var(--radius-panel);background:var(--color-surface-muted);border:1px solid #0000;padding:16px;transition:background-color .14s,border-color .14s,box-shadow .14s}.vocab-card-active{background:#2f6df61a;border-color:#2f6df629;box-shadow:inset 0 0 0 1px #2f6df608}.vocab-card-top{justify-content:flex-start;align-items:center;gap:12px;display:flex}.vocab-card h3{color:var(--color-ink);letter-spacing:-.01em;margin:0;font-size:1.02rem;font-weight:650}.vocab-card-meta{flex-wrap:wrap;gap:6px 10px;margin:6px 0 0;font-size:.85rem;display:flex}.vocab-card-active .vocab-card-meta,.vocab-card-active p,.vocab-card-active h3{color:inherit}@media (width<=1180px){.app-frame{grid-template-columns:208px minmax(0,1fr) 280px}.player-header{grid-template-columns:minmax(0,1fr)}.playback-meta{text-align:left;align-items:flex-start}.playback-controls{justify-content:flex-start}}@media (width<=920px){.app-shell{padding:18px}.app-frame{grid-template-columns:minmax(0,1fr);grid-template-areas:"lesson""header""video""spotlight""vocab""transcript";gap:14px}.lesson-strip,.sidebar{max-height:none;position:static;overflow:visible}.lesson-strip,.player-header,.video-panel,.spotlight-panel,.transcript-panel,.sidebar{padding-left:18px;padding-right:18px}.video-panel{padding-top:12px;padding-bottom:12px}.playback-follow{white-space:normal}.public-feature-grid,.public-lesson-grid,.public-content-grid,.public-lesson-hero{grid-template-columns:minmax(0,1fr)}.public-lesson-hero{min-height:auto;padding-top:28px}}@media (width<=640px){.app-shell{padding:12px}.public-page{padding:18px}.public-nav{align-items:flex-start}.public-nav nav{gap:12px}.public-hero{min-height:360px}.player-header,.spotlight-panel,.transcript-panel,.sidebar,.lesson-strip{padding:16px}.spotlight-top,.transcript-title{flex-direction:column;align-items:flex-start}.transcript-row{grid-template-columns:minmax(0,1fr)}.replay-button{justify-self:start}}.auth-page{background:radial-gradient(circle at top,#2f6df614,#0000 26%),linear-gradient(#f4f7fb 0%,#eef3f8 100%);justify-content:center;align-items:center;min-height:100vh;padding:28px;display:flex}.auth-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-panel);width:100%;max-width:400px;box-shadow:var(--shadow-panel);padding:36px 32px}.auth-card h1{letter-spacing:-.02em;margin:0;font-size:1.6rem;font-weight:650}.auth-subtitle{color:var(--color-muted);margin:8px 0 0;font-size:.92rem}.auth-phone-display{color:var(--color-muted-strong);margin:0 0 12px;font-size:.85rem}.auth-form{gap:16px;margin-top:24px;display:grid}.auth-error{color:#dc2626;background:#dc262614;border-radius:10px;padding:10px 14px;font-size:.88rem;line-height:1.4}.auth-message{color:var(--color-accent);background:#2f6df614;border-radius:10px;padding:10px 14px;font-size:.88rem;line-height:1.4}.auth-label{color:var(--color-ink);gap:6px;font-size:.85rem;font-weight:600;display:grid}.auth-input{border:1px solid var(--color-border);background:var(--color-surface);width:100%;color:var(--color-ink);border-radius:10px;outline:none;padding:10px 14px;font-size:1rem;transition:border-color .14s}.auth-input:focus{border-color:var(--color-accent)}.auth-button{background:var(--color-accent);color:#fff;cursor:pointer;border:none;border-radius:10px;width:100%;padding:12px;font-size:.95rem;font-weight:600;transition:opacity .14s}.auth-button:disabled{opacity:.6;cursor:not-allowed}.auth-links{justify-content:center;gap:16px;margin-top:8px;display:flex}.auth-link{color:var(--color-accent);cursor:pointer;background:0 0;border:none;padding:0;font-size:.88rem;font-weight:500}.auth-link:hover{text-decoration:underline}.auth-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);justify-content:flex-end;align-items:center;gap:12px;padding:12px 24px;display:flex}.auth-header-phone{color:var(--color-muted-strong);font-size:.88rem}.auth-header-logout{border:1px solid var(--color-border);color:var(--color-muted-strong);cursor:pointer;background:0 0;border-radius:8px;padding:6px 16px;font-size:.83rem;font-weight:500;transition:background-color .14s}.auth-header-logout:hover{background:var(--color-surface-muted)}.vocab-save-button{border:1px solid var(--color-border);color:var(--color-muted);cursor:pointer;background:0 0;border-radius:8px;padding:4px 10px;font-size:.72rem;font-weight:600;transition:all .14s}.vocab-save-button:hover{border-color:var(--color-accent);color:var(--color-accent)}.vocab-save-button-saved{border-color:var(--color-accent);color:var(--color-accent);background:#2f6df61a}.profile-page{max-width:720px;margin:0 auto;padding:28px 24px}.profile-back{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-accent);cursor:pointer;border-radius:10px;align-items:center;margin-bottom:28px;padding:8px 16px;font-size:.9rem;font-weight:500;transition:background-color .14s;display:inline-flex}.profile-back:hover{background:var(--color-surface-muted)}.profile-tabs{gap:6px;margin-bottom:24px;padding-bottom:4px;display:flex;overflow-x:auto}.profile-tab{border:1px solid var(--color-border);color:var(--color-muted);cursor:pointer;white-space:nowrap;background:0 0;border-radius:10px;padding:8px 16px;font-size:.85rem;font-weight:500;transition:background-color .14s,border-color .14s,color .14s}.profile-tab:hover{background:var(--color-surface-muted);color:var(--color-ink)}.profile-tab-active{border-color:var(--color-accent);color:var(--color-accent);background:#2f6df61a;font-weight:600}.profile-section{margin-bottom:32px}.profile-heading{letter-spacing:-.01em;margin:0 0 14px;font-size:1.15rem;font-weight:650}.profile-empty{color:var(--color-muted);font-size:.92rem;line-height:1.5}.profile-list{gap:8px;display:grid}.profile-card{border:1px solid var(--color-border);background:var(--color-surface);border-radius:12px;flex-wrap:wrap;align-items:center;gap:6px 12px;padding:14px 16px;font-size:.92rem;display:flex}.profile-card strong{color:var(--color-ink);font-weight:600}.profile-card span{color:var(--color-muted)}.profile-card-clickable{cursor:pointer;text-align:left;width:100%;transition:background-color .14s,border-color .14s}.profile-card-clickable:hover{background:var(--color-surface-muted);border-color:#2f6df61f}.profile-card-top{flex-wrap:wrap;align-items:center;gap:6px 10px;display:flex}.profile-tag{background:var(--color-surface-muted);min-height:22px;color:var(--color-muted-strong);letter-spacing:.04em;border-radius:999px;align-items:center;padding:0 8px;font-size:.72rem;font-weight:600;display:inline-flex}.profile-meta{color:var(--color-muted);font-size:.85rem}.profile-meaning{width:100%;color:var(--color-muted);margin:4px 0 0;font-size:.88rem}.auth-header-profile{border:1px solid var(--color-border);color:var(--color-accent);cursor:pointer;background:0 0;border-radius:8px;padding:6px 16px;font-size:.83rem;font-weight:500;transition:background-color .14s}.auth-header-profile:hover{background:var(--color-surface-muted)}.lesson-search-wrapper{margin-bottom:14px;position:relative}.lesson-search-input{border:1px solid var(--color-border);background:var(--color-surface);width:100%;color:var(--color-ink);border-radius:10px;outline:none;padding:8px 32px 8px 12px;font-size:.88rem;transition:border-color .14s}.lesson-search-input:focus{border-color:var(--color-accent)}.lesson-search-input::-webkit-search-cancel-button{display:none}.lesson-search-clear{background:var(--color-surface-muted);width:24px;height:24px;color:var(--color-muted);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:.85rem;transition:background-color .14s;display:flex;position:absolute;top:50%;right:6px;transform:translateY(-50%)}.lesson-search-clear:hover{color:var(--color-accent);background:#2f6df61a}