:root{--display:"Bebas Neue",Oswald,Impact,sans-serif;--serif:"Newsreader",Georgia,serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --ink:#f2eee6;--mute:#b9bcc4;--accent:#ff7a45;--ok:#6cc070;--no:#ff6b5e;
  --sky:#8197ff;--eng:#44c4b4;--odd:#f06aa8;--deep:#e0a54a;--low:#ff6b5e;--med:#6cc070;--space:#a48dff;--sea:#5ab4ea;--nature:#a5c552;--disc:#f08a4e;--hack:#4fd194;--scam:#c58be0;--tech:#a8bacb;--hist:#d6a27a;--game:#ff6fa5;--crime:#f08a8a;--food:#fb923c;--style:#e879f9;--sport:#4ade80;--sound:#a5b4fc;--everyday:#67e8f9;--crypto:#f0c14b;--chem:#5fd3f0;--phys:#8197ff;--earth:#5ab4ea;--life:#a5c552;--mind:#f06aa8;--math:#e0a54a;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:#000;color:var(--ink);font-family:var(--serif);overflow:hidden;-webkit-tap-highlight-color:transparent}
a{color:inherit}
.feed{position:fixed;inset:0;margin:0 auto;max-width:520px;overflow-y:scroll;scroll-snap-type:y mandatory;overscroll-behavior:contain;scrollbar-width:none;background:#07090d}
.feed::-webkit-scrollbar{display:none}
.it{position:relative;height:100dvh;height:100vh;height:100svh;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;background:#0b0e14}
.it video,.it .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.it .bg.plain{background:radial-gradient(120% 80% at 30% 20%,color-mix(in srgb,var(--c) 45%,#0b0e14),#0b0e14 70%)}
.k-s .bg,.k-l .bg{filter:saturate(1.05);transform:scale(1.04);animation:kb 14s ease-in-out infinite alternate}
@keyframes kb{to{transform:scale(1.14) translate(-2%,-2%)}}
@media (prefers-reduced-motion:reduce){.k-s .bg,.k-l .bg{animation:none}}
.shade{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.45) 0,rgba(0,0,0,0) 18%,rgba(0,0,0,0) 42%,rgba(0,0,0,.82) 78%,rgba(0,0,0,.92));pointer-events:none}
.shade.low{background:linear-gradient(to bottom,rgba(0,0,0,.4),rgba(0,0,0,0) 15%,rgba(0,0,0,0) 70%,rgba(0,0,0,.9))}
.tap{position:absolute;inset:0;width:100%;height:100%;background:none;border:0;cursor:pointer}
.txt{position:absolute;left:0;right:0;bottom:0;padding:0 18px calc(22px + env(safe-area-inset-bottom));pointer-events:none}
.txt *{pointer-events:auto}
.eye{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--c,var(--accent));margin-bottom:6px}
.it h2{font-family:var(--display);font-weight:400;font-size:clamp(34px,9vw,46px);line-height:.98;margin:0 0 8px;letter-spacing:.01em;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.txt p{font-size:17px;line-height:1.38;margin:0 0 12px;color:#e9e5dc;text-shadow:0 1px 8px rgba(0,0,0,.6);display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.txt p.from{font-family:var(--mono);font-size:12px;color:var(--mute)}
.acts{display:flex;gap:8px;flex-wrap:wrap}
.sbtn{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:var(--accent);color:#14100c;font:600 14px var(--mono);text-decoration:none;border:0;cursor:pointer}
.sbtn.ghost{background:rgba(255,255,255,.14);color:var(--ink);backdrop-filter:blur(6px)}
.sbar{position:fixed;top:0;left:50%;transform:translateX(-50%);width:100%;max-width:520px;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;z-index:5;pointer-events:none}
.sbar>*{pointer-events:auto}
.sbrand{font-family:var(--display);font-size:22px;letter-spacing:.03em;text-decoration:none;text-shadow:0 1px 8px rgba(0,0,0,.6);margin-right:auto}
.sbrand span{color:var(--accent)}
.snd,.sbrowse{min-height:36px;min-width:36px;padding:0 12px;border-radius:999px;border:0;background:rgba(0,0,0,.45);color:var(--ink);font:600 13px var(--mono);text-decoration:none;display:inline-flex;align-items:center;justify-content:center;backdrop-filter:blur(6px);cursor:pointer}
.k-c .strip{position:absolute;inset:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.k-c .strip::-webkit-scrollbar{display:none}
.k-c .strip img{flex:0 0 100%;width:100%;height:100%;object-fit:contain;scroll-snap-align:center;background:#0b0e14}
.dots{position:absolute;top:calc(58px + env(safe-area-inset-top));left:0;right:0;display:flex;justify-content:center;gap:5px;z-index:2}
.dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35)}.dots i.on{background:#fff}
.k-c .txt p{-webkit-line-clamp:2}
.qbox{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:70px 20px calc(24px + env(safe-area-inset-bottom));background:radial-gradient(110% 70% at 50% 0,#1b2233,#0b0e14 70%)}
.qbox h2{font-size:clamp(30px,8vw,40px)}
.opts{display:grid;gap:10px;margin:14px 0}
.opts button{min-height:52px;text-align:left;padding:10px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:var(--ink);font:17px var(--serif);cursor:pointer}
.opts button.ok{background:color-mix(in srgb,var(--ok) 30%,transparent);border-color:var(--ok)}
.opts button.no{background:color-mix(in srgb,var(--no) 28%,transparent);border-color:var(--no)}
.opts button.dim{opacity:.45}
.why{font-size:16px;line-height:1.4;color:#e2ded5;margin:0 0 14px}
.hint{position:fixed;left:50%;bottom:110px;transform:translateX(-50%);padding:10px 18px;border-radius:999px;background:rgba(0,0,0,.6);font:600 14px var(--mono);z-index:6;animation:hint 2.6s ease forwards;pointer-events:none}
@keyframes hint{0%{opacity:0;transform:translate(-50%,10px)}15%,70%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-30px)}}
.nos{padding:80px 20px;max-width:520px;margin:0 auto}.nos a{color:var(--accent)}
@media (min-width:700px){body{background:radial-gradient(80% 60% at 50% 30%,#141a26,#000)}.feed{box-shadow:0 0 0 1px #1d2330,0 30px 80px rgba(0,0,0,.6)}}

/* Shorts and card sets already carry their own words: keep our overlay small and low */
.k-v .txt h2,.k-c .txt h2{font-size:24px;margin-bottom:10px}
.k-v .shade{background:linear-gradient(to bottom,rgba(0,0,0,.45) 0,rgba(0,0,0,0) 14%,rgba(0,0,0,0) 80%,rgba(0,0,0,.85))}
.k-c .strip img{height:calc(100% - 150px);margin-top:64px}
.k-c .dots{top:auto;bottom:calc(132px + env(safe-area-inset-bottom))}
.k-c .shade.low{background:linear-gradient(to bottom,rgba(0,0,0,0) 80%,rgba(0,0,0,.9))}

.it .bg.blur{filter:blur(28px) brightness(.55);transform:scale(1.2);animation:none}
.it .bg.whole{object-fit:contain;object-position:50% 28%;animation:none;transform:none;height:62%}
