:root{--ground:#14161a;--card:#fbfaf6;--ink:#1c1a17;--muted:#6f6c63;--accent:#1f5c8c;--accent-soft:#e9f0f5;--line:rgba(0,0,0,.08);--display:"Fraunces",Georgia,serif;--read:"Newsreader",Georgia,serif;--mono:"JetBrains Mono",ui-monospace,monospace}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{height:100%}body{background:var(--ground);color:var(--ink);font-family:var(--read);display:flex;justify-content:center;align-items:stretch;overflow:hidden}app-root{display:contents}#app{width:100%;max-width:480px;height:100dvh;background:var(--card);position:relative;display:flex;flex-direction:column;box-shadow:0 0 60px #0006}.bar{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:14px 18px 10px;border-bottom:1px solid var(--line)}.brand{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase}.brand b{color:var(--ink)}.right{display:flex;align-items:center;gap:10px}.count{font-family:var(--mono);font-size:12px;color:var(--accent);cursor:pointer}.lang{font-family:var(--mono);font-size:11px;letter-spacing:.06em;border:1px solid var(--line);border-radius:999px;background:none;color:var(--muted);padding:5px 9px;cursor:pointer}.lang:active{background:var(--accent-soft)}.stage{flex:1 1 auto;position:relative;overflow:hidden}.card{position:absolute;inset:0;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;will-change:transform,opacity}.card::-webkit-scrollbar{display:none}.card.enter{animation:rise .42s cubic-bezier(.2,.7,.2,1)}@keyframes rise{0%{transform:translateY(34px);opacity:0}to{transform:translateY(0);opacity:1}}.hero{position:relative;width:100%;aspect-ratio:16/10;flex:0 0 auto;background:#23262c center/cover no-repeat}.hero.no-img{aspect-ratio:auto;height:14px}.hero .tint{position:absolute;inset:0;background:linear-gradient(180deg,#14161a00 55%,#14161a80)}.meta{position:relative;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--muted);padding:14px 22px 0;text-transform:uppercase;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.src{display:inline-flex;align-items:center;gap:5px;color:var(--src,var(--accent));font-weight:500}.meta .dot{opacity:.4}.meta .views{color:var(--accent)}.title{font-family:var(--display);font-weight:600;line-height:1.04;font-size:clamp(28px,7.5vw,38px);letter-spacing:-.01em;padding:8px 22px 0}.extract{font-family:var(--read);font-size:18px;line-height:1.55;color:#34312b;padding:16px 22px 30px}.actions{flex:0 0 auto;display:flex;gap:10px;align-items:center;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--card)}.btn{font-family:var(--mono);font-size:13px;letter-spacing:.03em;border:1px solid var(--line);background:none;color:var(--ink);padding:13px 14px;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px}.btn:active{transform:translateY(1px)}.btn.ghost{flex:0 0 auto}.btn.open{flex:0 0 auto;color:var(--accent);border-color:var(--accent-soft)}.btn.next{flex:1 1 auto;background:var(--ink);color:var(--card);border-color:var(--ink);font-weight:500}.btn.saved{color:var(--accent);border-color:var(--accent)}.state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:40px}.spin{width:30px;height:30px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:sp .8s linear infinite}@keyframes sp{to{transform:rotate(360deg)}}.state p{font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.04em;max-width:300px;line-height:1.6}.drawer{position:absolute;inset:0;background:var(--card);z-index:5;transform:translateY(100%);transition:transform .3s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column}.drawer.open{transform:translateY(0)}.drawer h2{font-family:var(--display);font-weight:600;font-size:24px;padding:18px 22px 6px}.drawer .sub{font-family:var(--mono);font-size:11px;color:var(--muted);padding:0 22px 12px;letter-spacing:.05em;text-transform:uppercase}.list{flex:1;overflow-y:auto;padding:0 14px 20px}.item{display:flex;gap:12px;padding:12px;border-bottom:1px solid var(--line);text-decoration:none;color:inherit}.item img{width:54px;height:54px;border-radius:10px;object-fit:cover;background:#ddd;flex:0 0 auto}.item .t{font-family:var(--display);font-weight:600;font-size:17px;line-height:1.15}.item .d{font-family:var(--read);font-size:13px;color:var(--muted);margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.empty{font-family:var(--mono);font-size:12px;color:var(--muted);text-align:center;padding:40px;letter-spacing:.04em}@media(prefers-reduced-motion:reduce){.card.enter{animation:none}.drawer{transition:none}}