:root{--fs-sm: 1rem;--fs-base: 1.25rem;--fs-lg: 1.5rem;--fs-xl: 1.75rem;--bg: #f6f7f9;--surface: #ffffff;--ink: #1a1a1a;--muted: #6b7280;--line: #e5e7eb;--radius: 16px;--cat: #1a1a1a}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:var(--fs-base);line-height:1.5;color:var(--ink);background:var(--bg);-webkit-text-size-adjust:100%}#app{max-width:720px;margin:0 auto;padding:0 16px 64px}.header{position:sticky;top:0;z-index:10;display:flex;gap:16px;align-items:center;margin:0 -16px;background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:12px 16px;border-bottom:1px solid var(--line)}.nav-link{font-size:var(--fs-base);color:var(--muted);text-decoration:none;padding:4px 8px;border-radius:8px}.nav-link[aria-current=page]{color:var(--ink);font-weight:600}.page{display:flex;flex-direction:column;gap:20px;padding-top:16px}.date-line{margin:0;font-size:var(--fs-sm);color:var(--muted);text-align:center}.card{background:var(--surface);border-radius:var(--radius);border:1px solid var(--line);border-top:4px solid var(--cat);padding:16px;display:flex;flex-direction:column;gap:12px;box-shadow:0 1px 2px #0000000a}.card__header{display:flex;flex-direction:column;gap:2px}.card__title{margin:0;font-size:var(--fs-lg);line-height:1.3}.card__category{font-size:var(--fs-sm);color:var(--cat);font-weight:600}.card__bubbles{display:flex;flex-wrap:wrap;gap:6px}.bubble{font-size:var(--fs-sm);padding:2px 10px;border-radius:999px;background:color-mix(in srgb,var(--cat) 14%,white);color:color-mix(in srgb,var(--cat) 70%,black)}.timer{display:flex;align-items:center;gap:12px;padding:8px 0}.timer__display{font-size:var(--fs-xl);font-variant-numeric:tabular-nums;letter-spacing:.5px}.timer__display--done{color:var(--cat)}.timer__controls{display:flex;gap:6px}.timer__btn{font-size:var(--fs-base);width:40px;height:40px;border-radius:999px;border:1px solid var(--line);background:var(--surface);cursor:pointer;line-height:1}.timer__btn--play{background:var(--cat);color:#fff;border-color:var(--cat)}.timer__btn:active{transform:scale(.95)}.carousel{position:relative;border-radius:12px;overflow:hidden;background:#000}.carousel__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.carousel__track::-webkit-scrollbar{display:none}.carousel__slide{flex:0 0 100%;scroll-snap-align:center;display:flex;align-items:center;justify-content:center;background:#000}.carousel__img,.carousel__video{max-width:100%;max-height:360px;width:auto;height:auto;display:block}.carousel__audio{display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;width:100%;min-height:160px;background:#111;color:#fff;padding:24px}.carousel__audio-label{font-size:var(--fs-base)}.carousel__nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:999px;border:none;background:#00000073;color:#fff;font-size:var(--fs-xl);line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}.carousel__nav--prev{left:8px}.carousel__nav--next{right:8px}.carousel__dots{position:absolute;bottom:8px;left:0;right:0;display:flex;gap:6px;justify-content:center}.carousel__dot{width:8px;height:8px;padding:0;border-radius:999px;border:none;background:#ffffff80;cursor:pointer}.carousel__dot.is-active{background:#fff}.explanation :where(h1,h2,h3){font-size:var(--fs-lg);margin:.6em 0 .3em}.explanation p{margin:.5em 0}.explanation ul,.explanation ol{margin:.5em 0;padding-left:1.3em}.explanation strong{font-weight:600}.explanation.is-collapsed{display:-webkit-box;-webkit-line-clamp:5;line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}.readmore{align-self:flex-start;background:none;border:none;color:var(--cat);font-size:var(--fs-sm);font-weight:600;cursor:pointer;padding:4px 0;margin-top:2px}.readmore[hidden]{display:none}.done-note{text-align:center;font-size:var(--fs-base);color:var(--muted);margin:8px 0 24px}.cat-section{display:flex;flex-direction:column;gap:8px}.cat-section__title{margin:0;font-size:var(--fs-lg);color:var(--cat);border-bottom:2px solid var(--cat);padding-bottom:4px}.cat-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.cat-list__item{width:100%;text-align:left;font-size:var(--fs-base);padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--surface);cursor:pointer;color:var(--ink)}.cat-list__item:active{background:color-mix(in srgb,var(--cat) 8%,white)}.empty{font-size:var(--fs-base);color:var(--muted);text-align:center;padding:24px 0}.offline-toast{position:fixed;left:50%;bottom:16px;transform:translate(-50%);z-index:50;width:min(92vw,460px);display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:12px;background:var(--ink);color:#fff;box-shadow:0 6px 20px #00000040}.offline-toast[hidden]{display:none}.offline-toast__label{font-size:var(--fs-sm);line-height:1.3}.offline-toast__bar{display:block;height:6px;border-radius:999px;background:#ffffff40;overflow:hidden}.offline-toast__fill{display:block;height:100%;width:0%;border-radius:999px;background:#fff;transition:width .2s ease}