:root{--bg:#f7f8fc;--surface:#fff;--primary:#3b82f6;--primary-hover:#2563eb;--text:#111827;--text-secondary:#6b7280;--border:#e5e7eb;--overlay:#11182773;--error:#ef4444;--success:#10b981;--radius-card:16px;--radius-btn:12px;--radius-popup:14px;--shadow-card:0 6px 20px #0000000f;--shadow-popup:0 12px 32px #0000001f}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans SC,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button{cursor:pointer;font:inherit;color:inherit;background:0 0;border:none}.home{max-width:1200px;margin:0 auto;padding:24px 24px 48px}.home__header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:32px;display:flex}.home__brand{align-items:center;gap:12px;display:flex}.home__logo{flex-shrink:0}.home__title{color:var(--text);font-size:28px;font-weight:700;line-height:1.2}.home__subtitle{color:var(--text-secondary);margin-top:2px;font-size:14px}.home__search{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-btn);align-items:center;gap:8px;min-width:240px;padding:8px 16px;transition:border-color .15s;display:flex}.home__search:focus-within{border-color:var(--primary)}.home__search input{width:100%;color:var(--text);background:0 0;border:none;outline:none;font-size:15px}.home__search input::placeholder{color:#9ca3af}.home__grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px;display:grid}.story-card{background:var(--surface);border-radius:var(--radius-card);box-shadow:var(--shadow-card);flex-direction:column;transition:transform .18s,box-shadow .18s;display:flex;overflow:hidden}.story-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px #0000001a}.story-card:active{transform:translateY(-1px)}.story-card__image{aspect-ratio:4/3;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.story-card__image img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.story-card__placeholder-icon{opacity:.5}.story-card__title{color:var(--text);flex-direction:column;gap:6px;padding:14px 16px;font-size:15px;font-weight:600;display:flex}.story-card__titleEn{white-space:nowrap;text-overflow:ellipsis;align-items:baseline;gap:8px;display:flex;overflow:hidden}.story-card__num{color:#111827bf;background:#1118270f;border:1px solid #1118270f;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;min-width:28px;height:22px;padding:0 8px;font-size:12px;font-weight:800;display:inline-flex}.story-card__titleCn{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:600;overflow:hidden}.story-card--skeleton{pointer-events:none}.story-card__image--skeleton{background:linear-gradient(90deg,#e5e7eb 25%,#f3f4f6 50%,#e5e7eb 75%) 0 0/200% 100%;animation:1.5s infinite shimmer}.story-card__title--skeleton{background:linear-gradient(90deg,#e5e7eb 25%,#f3f4f6 50%,#e5e7eb 75%) 0 0/200% 100%;border-radius:6px;height:20px;margin:14px 16px;animation:1.5s infinite shimmer}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.home__error,.home__empty{text-align:center;color:var(--text-secondary);padding:80px 24px;font-size:18px}.home__error button{background:var(--primary);color:#fff;border-radius:var(--radius-btn);margin-top:16px;padding:10px 28px;font-size:15px;font-weight:600;transition:background .15s}.home__error button:hover{background:var(--primary-hover)}.reader{flex-direction:column;min-height:100vh;display:flex}.reader__toolbar{z-index:20;background:var(--bg);border-bottom:none;flex-wrap:wrap;align-items:center;gap:16px;padding:12px 24px 0;display:flex;position:sticky;top:0}.reader__back{color:var(--primary);white-space:nowrap;align-items:center;gap:4px;font-size:14px;font-weight:600;transition:color .15s;display:flex}.reader__back:hover{color:var(--primary-hover)}.reader__tabs{background:#1118270f;border:1px solid #1118270f;border-radius:999px;justify-content:center;gap:6px;padding:2px;display:inline-flex}.reader__tabs--content{margin:6px auto 10px}.reader__tabs--toolbar{-webkit-overflow-scrolling:touch;max-width:calc(100% - 120px);margin-left:6px;overflow-x:auto}.reader__tab{color:#111827a6;white-space:nowrap;background:0 0;border:1px solid #0000;border-radius:999px;padding:8px 14px;font-size:14px;font-weight:700;transition:background .15s,color .15s,box-shadow .15s,border-color .15s}.reader__tab:hover{color:#111827d9}.reader__tab.is-active{background:var(--surface);color:#111827e6;border-color:#1118270f;box-shadow:0 6px 16px #1118271a}.reader__audio{flex-shrink:0}.reader__body{flex:1;gap:32px;width:100%;max-width:1200px;margin:0 auto;padding:1px 24px 132px;display:flex}.reader--alt .reader__body{padding-bottom:24px}.reader__content{flex:1;min-width:0}.reader__storyHeader{grid-template-columns:1fr auto;align-items:center;gap:12px;margin:6px 0 16px;display:grid}.reader__storyTitle{text-align:center;color:var(--text);word-break:break-word;margin:0;font-size:28px;font-weight:800;line-height:1.25}.reader__placeholder{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);text-align:center;color:var(--text-secondary);padding:48px 24px}.reader__placeholderTitle{color:var(--text);margin-bottom:8px;font-size:20px;font-weight:800}.reader__placeholderText{font-size:15px}.reader__audioBar{z-index:40;box-sizing:border-box;background:0 0;border-top:none;width:min(1200px,100% - 48px);padding:12px 0;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.reader__audioBarInner{flex-direction:column;align-items:center;width:100%;max-width:1200px;margin:0 auto;display:flex}.reader__audioBar .audio-player,.reader__audioBar .audio-player--compact{width:fit-content;max-width:100%}.reader__cover{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);margin-bottom:20px;overflow:hidden}.reader__cover img{object-fit:contain;background:var(--bg);width:100%;height:auto;max-height:300px;display:block}.reader__video{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);overflow:hidden}.reader__videoEl{background:#000;width:100%;max-height:70vh;display:block}.audio-player{box-sizing:border-box;background:var(--surface);border:1px solid var(--border);width:fit-content;max-width:100%;box-shadow:var(--shadow-card);border-radius:var(--radius-btn);flex-direction:column;align-items:center;padding:5px 14px;display:flex;position:relative}.audio-player>audio{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.audio-player__expanded{grid-template-columns:max-content;width:max-content;min-width:0;max-width:100%;display:grid}.audio-player__topRow{grid-column:1;align-items:center;gap:10px;width:100%;min-width:0;display:flex}.audio-player__controlsRow{flex-wrap:wrap;grid-column:1;align-items:center;gap:10px;width:max-content;min-width:0;max-width:100%;display:flex}.audio-player--compact{padding-top:8px;padding-bottom:8px}.audio-player__compactRow{flex-wrap:wrap;align-items:center;gap:10px;width:max-content;max-width:100%;display:flex}.audio-player--error{color:var(--error);font-size:13px}.audio-player--error button{background:var(--error);color:#fff;border-radius:8px;padding:4px 12px;font-size:12px;font-weight:600}.audio-player__btn{background:var(--primary);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;transition:background .15s;display:flex}.audio-player__btn:hover{background:var(--primary-hover)}.audio-player__time{color:var(--text-secondary);font-variant-numeric:tabular-nums;min-width:32px;font-size:12px}.audio-player__timeRange{white-space:nowrap;flex-shrink:0;min-width:auto}.audio-player__track{background:var(--border);cursor:pointer;border-radius:3px;flex:1 1 0;min-width:3.5rem;height:6px;position:relative}.audio-player__progress{background:var(--primary);border-radius:3px;height:100%;transition:width .1s linear}.audio-player__pill{box-sizing:border-box;min-height:38px;color:var(--text);background:0 0;border:none;border-radius:999px;justify-content:center;align-items:center;padding:8px 12px;font-size:13px;font-weight:700;line-height:1;display:inline-flex}.audio-player__pill:hover{background:#0000000d}.audio-player__pill.is-active{color:var(--primary);background:#3b82f61f}.audio-player__pill--icon{min-width:36px}.audio-player__pill--stack{box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:56px;min-width:56px;max-width:56px;height:52px;min-height:52px;padding:0 4px}.audio-player__pillIcon{width:100%;height:20px;min-height:20px;color:var(--text);flex-shrink:0;justify-content:center;align-items:center;line-height:20px;display:flex}.audio-player__pillIcon>svg{flex-shrink:0;display:block}.audio-player__pillIcon--speed{letter-spacing:-.03em;height:20px;font-size:14px;font-weight:800;line-height:20px}.audio-player__pillCaption{color:var(--text-secondary);text-align:center;white-space:nowrap;flex-shrink:0;justify-content:center;align-items:center;width:100%;min-height:14px;font-size:11px;font-weight:600;line-height:1.2;display:flex}.audio-player__pill--stack.is-active .audio-player__pillIcon,.audio-player__pill--stack.is-active .audio-player__pillCaption{color:var(--primary)}.audio-player__speed{position:relative}.audio-player__menu{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-card);z-index:60;border-radius:12px;min-width:140px;padding:6px;position:absolute;bottom:calc(100% + 8px);left:0}.audio-player__menuItem{text-align:left;width:100%;color:var(--text);background:0 0;border-radius:10px;padding:8px 10px;font-size:13px;font-weight:700}.audio-player__menuItem:hover{background:#0000000a}.audio-player__menuItem.is-active{color:var(--primary);background:#3b82f61f}.audio-player__rightControls{align-items:center;gap:10px;display:flex}.story-text{color:var(--text);font-size:25px;line-height:2.5}.story-text__original{display:block}.story-text__sentenceBlock{margin:10px 0;display:block}.story-text__sentence{margin-right:2px}.story-text__cn{color:var(--text-secondary);margin-top:6px;font-size:18px;line-height:1.8}.word-token{display:inline}.word-token--clickable{cursor:pointer;border-radius:5px;padding-bottom:1px;padding-left:5px;transition:background .12s,color .12s}.word-token--clickable:hover{color:var(--primary);background:#3b82f61a}.word-token--clickable:active{background:#3b82f62e}.word-popup-overlay{z-index:100;position:fixed;inset:0}.word-popup{z-index:101;background:var(--surface);border-radius:var(--radius-popup);box-shadow:var(--shadow-popup);min-width:220px;max-width:300px;padding:20px 24px 18px;animation:.15s ease-out popupIn;position:fixed}@keyframes popupIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.word-popup__close{width:28px;height:28px;color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;transition:background .12s;display:flex;position:absolute;top:10px;right:10px}.word-popup__close:hover{background:var(--bg)}.word-popup__word{color:var(--text);margin-bottom:10px;font-size:22px;font-weight:700;line-height:1.15}.word-popup__ipaRow{flex-wrap:wrap;align-items:center;gap:6px 12px;margin-bottom:10px;display:flex}.word-popup__ipaLine{flex:0 auto;align-items:center;gap:5px;display:inline-flex}.word-popup__ipa{color:var(--text-secondary);white-space:nowrap;font-size:14px;line-height:1}.word-popup__ipaTag{color:var(--text-secondary);font-size:11px;font-weight:700}.word-popup__ipaAudioBtn{color:var(--text-secondary);border:1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border-radius:999px;align-items:center;gap:4px;padding:3px 7px;font-family:inherit;font-size:11px;font-weight:700;line-height:1;transition:background-color .12s,color .12s,border-color .12s,transform 60ms;display:inline-flex}.word-popup__ipaAudioBtn:hover{background:color-mix(in srgb, var(--text-secondary) 12%, transparent);color:var(--text);border-color:color-mix(in srgb, var(--text-secondary) 45%, transparent)}.word-popup__ipaAudioBtn:active{transform:scale(.96)}.word-popup__ipaAudioBtn:focus-visible{outline:2px solid color-mix(in srgb, var(--text) 50%, transparent);outline-offset:2px}.word-popup__ipaAudioBtn:disabled{cursor:not-allowed;opacity:.6}.word-popup__ipaTagLabel{display:inline-block}.word-popup__speaker{flex:none;display:inline-block}.word-popup__ipaTag.is-loading .word-popup__speaker{animation:.9s ease-in-out infinite word-popup-speaker-pulse}@keyframes word-popup-speaker-pulse{0%,to{opacity:.35}50%{opacity:1}}.word-popup__chips{-webkit-overflow-scrolling:touch;align-items:center;gap:10px;margin:10px 0 6px;padding-bottom:2px;display:flex;overflow-x:auto}.word-popup__chip{white-space:nowrap;color:#111827b3;background:#fff;border:1.5px solid #1118271a;border-radius:999px;justify-content:center;align-items:center;min-height:30px;padding:2px 14px;font-size:14px;font-weight:700;line-height:1;transition:background .15s,border-color .15s,color .15s,transform 50ms;display:inline-flex}.word-popup__chip:hover{border-color:var(--primary);color:var(--primary);background:#6991e91a}.word-popup__chip:active{transform:translateY(.5px)}.word-popup__chip.is-active{color:#0f766e;background:#10b98124;border-color:#10b9818c}.word-popup__divider{background:#11182714;height:1px;margin:2px 0}.word-popup__pos{color:var(--primary);letter-spacing:.5px;font-size:12px;font-weight:600}.word-popup__meanings{flex-direction:column;gap:6px;display:flex}.word-popup__lemmaRow{background:#1118270f;border-radius:2px;align-items:center;gap:6px;width:fit-content;margin-top:6px;padding:2px 5px;line-height:1.2;display:flex}.word-popup__lemmaValue{color:#111827b3;font-size:12px;font-weight:500}.word-popup__chinese{color:var(--text);font-size:16px}.word-popup__play{background:var(--bg);width:28px;height:28px;color:var(--primary);border-radius:50%;justify-content:center;align-items:center;transition:background .12s;display:flex}.word-popup__play:hover{background:#3b82f61f}.word-popup__metaRow{align-items:baseline;gap:8px;margin-bottom:10px;display:flex}.word-popup__loading,.word-popup__error{color:var(--text-secondary);padding:8px 0;font-size:14px}.word-popup__error{color:var(--error)}.new-words__sidebar{background:var(--surface);border-radius:var(--radius-card);width:280px;box-shadow:var(--shadow-card);flex-shrink:0;align-self:flex-start;padding:20px;position:sticky;top:40px}.new-words__tabHeader .reader__tabs--content{margin:0}.new-words__tabRow{justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.new-words__hide{width:32px;height:32px;color:var(--text-secondary);border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;transition:background .12s,color .12s;display:flex}.new-words__hide:hover{background:var(--bg);color:#111827d9}.reader__knowledgeBtn{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-card);color:#111827d9;border-radius:999px;padding:10px 18px;font-size:14px;font-weight:700;transition:transform .12s,background .12s,border-color .12s}.reader__knowledgeBtn:hover{border-color:#3b82f659;transform:translateY(-1px)}.reader__knowledgeBtn:active{transform:translateY(0)}.new-words__title{color:var(--text);border-bottom:1px solid var(--border);margin-bottom:16px;padding-bottom:12px;font-size:16px;font-weight:700}.new-words__list{flex-direction:column;gap:14px;display:flex}.new-words__item{grid-template-rows:auto auto;grid-template-columns:1fr auto;align-items:center;gap:2px 8px;display:grid}.new-words__word{color:var(--text);font-size:16px;font-weight:600}.new-words__ipa{color:var(--text-secondary);grid-column:1;font-size:12px}.new-words__chinese{color:var(--text-secondary);grid-column:1;font-size:14px}.new-words__play{width:32px;height:32px;color:var(--primary);background:var(--bg);border-radius:50%;grid-area:1/2/-1;justify-content:center;align-items:center;transition:background .12s;display:flex}.new-words__play:hover{background:#3b82f61f}.new-words__trigger{z-index:30;background:var(--primary);color:#fff;border-radius:999px;padding:12px 24px;font-size:14px;font-weight:700;transition:background .15s,transform .15s;position:fixed;bottom:140px;right:24px;box-shadow:0 8px 24px #3b82f64d}.new-words__trigger:hover{background:var(--primary-hover)}.new-words__trigger:active{transform:scale(.96)}.new-words__drawer-overlay{z-index:50;background:var(--overlay);animation:.15s ease-out fadeIn;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.new-words__drawer{z-index:51;background:var(--surface);border-radius:20px 20px 0 0;max-height:60vh;padding:20px 24px 32px;animation:.22s ease-out slideUp;position:fixed;bottom:0;left:0;right:0;overflow-y:auto}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.new-words__drawer-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;display:flex}.new-words__drawer-header h3{font-size:18px;font-weight:700}.new-words__drawer-close{width:32px;height:32px;color:var(--text-secondary);border-radius:50%;justify-content:center;align-items:center;display:flex}.error-page{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:60vh;padding:48px 24px;display:flex}.error-page svg{margin-bottom:24px}.error-page h2{color:var(--text);margin-bottom:8px;font-size:24px;font-weight:700}.error-page p{color:var(--text-secondary);max-width:400px;margin-bottom:24px;font-size:16px}.error-page__btn{background:var(--primary);color:#fff;border-radius:var(--radius-btn);padding:12px 32px;font-size:15px;font-weight:600;transition:background .15s;display:inline-block}.error-page__btn:hover{background:var(--primary-hover)}.skeleton{background:linear-gradient(90deg,#e5e7eb 25%,#f3f4f6 50%,#e5e7eb 75%) 0 0/200% 100%;border-radius:8px;animation:1.5s infinite shimmer}.skeleton--title{width:60%;height:28px;margin-bottom:24px}.skeleton--text{width:100%;height:20px;margin-bottom:14px}.skeleton--text.short{width:45%}@media (width<=768px){.home{padding:16px 16px 32px}.home__header{flex-direction:column;align-items:stretch}.home__search{min-width:0}.home__title{font-size:22px}.home__grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}.story-text{font-size:17px;line-height:1.75}.reader__cover img{max-height:240px}.reader__toolbar{gap:10px;padding:10px 16px}.reader__tabs{-webkit-overflow-scrolling:touch;max-width:100%;overflow-x:auto}.reader__tabs--content{margin:2px auto 10px}.reader__tabs--toolbar{max-width:100%;margin-left:0}.reader__storyTitle{margin:2px 0 12px;font-size:20px}.reader__body{flex-direction:column;padding:20px 16px}.reader__audioBar{width:min(1200px,100% - 32px);padding:10px 0}.reader__audio{width:100%}.new-words__sidebar{display:none}}@media (width<=480px){.home__grid{grid-template-columns:repeat(2,1fr);gap:12px}.story-card__title{padding:10px 12px;font-size:13px}}