:root{--font-ui: "IBM Plex Sans Arabic", "Segoe UI", system-ui, sans-serif;--font-serif: "Amiri", "Times New Roman", serif;--font-mono: "Space Grotesk", ui-monospace, monospace;--accent: #f0518b;--accent-2: #a78bfa;--accent-3: #f5c15a;--radius: 26px;--radius-sm: 14px;--ease: cubic-bezier(.22, .61, .36, 1);--read-scale: 1}[data-theme=dark]{--bg: #08080a;--bg-elev: #0e0e13;--panel: #0b0b10;--surface: rgba(255, 255, 255, .045);--surface-2: rgba(255, 255, 255, .085);--border: rgba(255, 255, 255, .09);--border-strong: rgba(255, 255, 255, .17);--text: #f4f2ef;--text-2: #b3b0bc;--text-3: #7b7885;--shadow: 0 40px 80px -44px rgba(0, 0, 0, .95);--card-ink: #ffffff}[data-theme=light]{--bg: #f2efea;--bg-elev: #ffffff;--panel: #fbf9f6;--surface: rgba(20, 19, 25, .038);--surface-2: rgba(20, 19, 25, .07);--border: rgba(20, 19, 25, .1);--border-strong: rgba(20, 19, 25, .2);--text: #141319;--text-2: #55525e;--text-3: #827f8c;--shadow: 0 40px 80px -50px rgba(40, 30, 20, .4);--card-ink: #ffffff}[data-theme=sepia]{--bg: #ece0cd;--bg-elev: #f7eedf;--panel: #f3e8d6;--surface: rgba(70, 45, 20, .055);--surface-2: rgba(70, 45, 20, .1);--border: rgba(70, 45, 20, .15);--border-strong: rgba(70, 45, 20, .26);--text: #2b2118;--text-2: #5f4c37;--text-3: #8a745c;--shadow: 0 40px 80px -50px rgba(60, 40, 15, .45);--card-ink: #fff8ec}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-ui);font-size:15px;line-height:1.6;overflow:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button,input{font-family:inherit;color:inherit}button{border:0;background:none;cursor:pointer}a{color:inherit;text-decoration:none}::selection{background:var(--accent);color:#fff}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}.cover{display:block;width:100%;height:100%}.app{display:grid;grid-template-columns:92px minmax(0,1fr) 372px;height:100dvh;background:radial-gradient(900px 600px at 80% -10%,rgba(240,81,139,.08),transparent 60%),radial-gradient(700px 500px at 10% 110%,rgba(167,139,250,.08),transparent 60%),var(--bg)}.main{position:relative;display:flex;flex-direction:column;min-width:0;height:100dvh;overflow:hidden}.rail-nav{display:flex;flex-direction:column;align-items:center;gap:26px;padding:22px 10px 18px;border-left:1px solid var(--border);background:color-mix(in srgb,var(--panel) 70%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);z-index:5}.brand{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--text)}.brand__mark{position:relative;display:grid;place-items:center;width:42px;height:42px}.brand__ring{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:2px solid var(--accent);background:radial-gradient(circle at 30% 20%,rgba(240,81,139,.35),transparent 70%)}.brand__dot{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:0 0 18px var(--accent)}.brand__word{font-family:var(--font-serif);font-size:19px;letter-spacing:.5px}.rail-nav__items,.rail-nav__foot{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%}.rail-nav__foot{margin-top:auto}.rail-nav__btn{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;width:100%;padding:11px 2px;border-radius:16px;color:var(--text-3);font-size:10.5px;transition:color .22s var(--ease),background .22s var(--ease),transform .22s var(--ease)}.rail-nav__btn:hover{color:var(--text);background:var(--surface);transform:translateY(-2px)}.rail-nav__btn.is-active{color:var(--text);background:var(--surface-2)}.rail-nav__btn.is-active:before{content:"";position:absolute;inset-inline-start:0;top:22%;height:56%;width:3px;border-radius:3px;background:linear-gradient(var(--accent),var(--accent-2))}.rail-nav__badge{position:absolute;top:5px;inset-inline-end:9px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--accent);color:#fff;font-size:10px;font-style:normal;line-height:17px;text-align:center}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px 10px;flex-shrink:0}.topbar__id{display:flex;align-items:center;gap:14px;min-width:0}.brand--compact{display:none;flex-direction:row;gap:8px}.topbar__meta{display:flex;flex-direction:column;gap:1px;min-width:0}.topbar__live{display:flex;align-items:center;gap:7px;color:var(--text-3);font-size:11.5px;letter-spacing:.2px}.live-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 #f0518b99;animation:pulse 2.6s infinite}.topbar__claim{font-family:var(--font-serif);font-size:19px;font-weight:700;letter-spacing:0}.topbar__actions{display:flex;align-items:center;gap:8px}.icon-btn{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;border:1px solid var(--border);background:var(--surface);color:var(--text-2);transition:all .2s var(--ease)}.icon-btn:hover{color:var(--text);border-color:var(--border-strong);transform:translateY(-2px)}.storybar{display:flex;gap:12px;padding:2px 20px 12px;overflow-x:auto;scrollbar-width:none;flex-shrink:0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 3%,#000 97%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 3%,#000 97%,transparent 100%)}.storybar::-webkit-scrollbar{display:none}.story{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;flex-shrink:0;color:var(--text-3);transition:color .2s var(--ease)}.story__ring{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;padding:2px;background:conic-gradient(from 140deg,var(--accent),var(--accent-2),var(--accent-3),var(--accent));opacity:.55;transition:transform .24s var(--ease),opacity .24s var(--ease),box-shadow .24s var(--ease)}.story__face{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;border:3px solid var(--bg);background:linear-gradient(160deg,#1a1a22,#0b0b10);color:var(--text);font-family:var(--font-serif);font-size:17px;letter-spacing:.5px}.story__label{font-size:11.5px;color:inherit;white-space:nowrap}.story:hover{color:var(--text-2)}.story:hover .story__ring{opacity:.9;transform:translateY(-2px)}.story.is-active{color:var(--text)}.story.is-active .story__ring{opacity:1;transform:scale(1.04);box-shadow:0 0 0 2px var(--bg),0 8px 24px -10px var(--accent)}.story__count{position:absolute;top:-4px;inset-inline-end:-2px;min-width:18px;height:18px;border-radius:9px;background:var(--accent);color:#fff;font-family:var(--font-mono);font-size:10px;line-height:18px;text-align:center;opacity:0;transform:scale(.7);transition:all .2s var(--ease)}.story__count.is-visible{opacity:1;transform:scale(1)}.feed-wrap{flex:1;min-height:0;padding:0 20px 18px}.feed{height:100%;overflow-y:auto;scroll-snap-type:y mandatory;scrollbar-width:none;overscroll-behavior:contain;scroll-behavior:smooth}.feed::-webkit-scrollbar{display:none}.reel-slot{height:100%;padding-bottom:14px;scroll-snap-align:start;scroll-snap-stop:always}.reel{height:100%}.reel__frame{position:relative;height:100%;min-height:420px;border-radius:30px;overflow:hidden;isolation:isolate;border:1px solid var(--border);background:var(--bg-elev);box-shadow:var(--shadow)}.reel__media{position:absolute;top:0;right:0;bottom:0;left:0}.reel__media .cover{transition:transform 1.1s var(--ease)}.reel:hover .reel__media .cover{transform:scale(1.035)}.reel__frame:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,#040408ad,#0404081a 22%,#04040805 40%,#040408a8 72%,#040408f2)}.reel__frame:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff12,inset 0 0 120px #00000059}.reel__surface{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;cursor:pointer}.reel__segments{position:absolute;top:12px;inset-inline:16px;z-index:5;display:flex;gap:4px;height:3px}.seg{position:relative;flex:1;border-radius:2px;background:#ffffff3d;overflow:hidden}.seg.is-done{background:#ffffffeb}.seg.is-active{background:#fff6}.seg__fill{display:block;height:100%;width:100%;background:#fff;transform-origin:right center;animation-name:segFill;animation-timing-function:linear;animation-fill-mode:forwards}.seg__fill.no-anim{animation:none;transform:scaleX(1);opacity:.6}.reel__head{position:absolute;top:26px;inset-inline:0;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:0 22px;pointer-events:none}.reel__cat{display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:999px;background:#0c0c106b;border:1px solid rgba(255,255,255,.2);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#fff;font-size:11.5px;letter-spacing:.3px}.reel__count{font-family:var(--font-mono);font-size:12px;color:#ffffffd9;letter-spacing:1px}.reel__count i{color:#ffffff73;font-style:normal}.reel__content{position:absolute;inset-inline-start:0;inset-inline-end:94px;bottom:0;z-index:4;padding:0 26px 30px;color:#fff;pointer-events:none}.reel__content>*{pointer-events:auto}.reel__kicker{margin:0 0 8px;color:var(--accent-3);font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;font-weight:500}.reel__title{margin:0 0 12px;font-family:var(--font-serif);font-weight:700;font-size:clamp(27px,2.9vw,42px);line-height:1.22;letter-spacing:0;text-wrap:balance;text-shadow:0 2px 30px rgba(0,0,0,.45)}.reel__excerpt{margin:0 0 16px;max-width:46ch;color:#ffffffbf;font-size:14.5px;line-height:1.85;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}[data-contrast=high] .reel__excerpt,[data-contrast=high] .read__body{color:#fff}.reel__meta{display:flex;align-items:center;gap:10px;margin-bottom:18px;color:#ffffff9e;font-size:11.5px}.reel__meta-item{display:inline-flex;align-items:center;gap:5px}.reel__dot{width:3px;height:3px;border-radius:50%;background:#fff6}.reel__cta{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#ffffff24;border:1px solid rgba(255,255,255,.22);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#fff;font-size:13px;transition:all .24s var(--ease)}.reel__cta:hover{background:#fff;color:#0b0b10;transform:translateY(-2px);box-shadow:0 14px 30px -12px #000000b3}.rail{position:absolute;left:16px;bottom:34px;z-index:5;display:flex;flex-direction:column;align-items:center;gap:14px}.rail__btn{display:flex;flex-direction:column;align-items:center;gap:3px;width:52px;padding:6px 0;border-radius:14px;color:#ffffffe0;font-size:9.5px;transition:color .2s var(--ease),transform .2s var(--ease),background .2s var(--ease)}.rail__btn svg{filter:drop-shadow(0 2px 8px rgba(0,0,0,.45));transition:transform .2s var(--ease)}.rail__btn:hover{background:#ffffff1a;transform:translateY(-2px)}.rail__btn:hover svg{transform:scale(1.08)}.rail__btn:active svg{transform:scale(.9)}.rail__btn.is-on{color:#fff}.rail__btn.is-like{color:var(--accent)}.rail__btn span{font-family:var(--font-mono);letter-spacing:.2px;opacity:.9}.reel__scroll-hint{position:absolute;left:26px;top:50%;z-index:4;display:flex;align-items:center;gap:8px;color:#fff6;font-size:10px;letter-spacing:2px;writing-mode:vertical-rl;transform:rotate(180deg);animation:hintFade 6s var(--ease) forwards;pointer-events:none}.reel__scroll-line{width:1px;height:34px;background:linear-gradient(rgba(255,255,255,.5),transparent)}.heart-burst{position:absolute;top:0;right:0;bottom:0;left:0;z-index:6;display:grid;place-items:center;color:var(--accent);pointer-events:none;animation:heartPop .85s var(--ease) forwards}.heart-burst svg{filter:drop-shadow(0 10px 40px rgba(240,81,139,.7))}.heart-burst.is-static{animation:none;opacity:0}.reel-end{height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:14px;padding:48px;border-radius:30px;border:1px dashed var(--border-strong);background:radial-gradient(600px 400px at 90% 0%,rgba(240,81,139,.14),transparent 65%),radial-gradient(500px 400px at 0% 100%,rgba(167,139,250,.14),transparent 65%),var(--bg-elev)}.reel-end__mark{font-family:var(--font-serif);font-size:14px;letter-spacing:3px;color:var(--accent)}.reel-end h2{margin:0;font-family:var(--font-serif);font-size:clamp(26px,3vw,40px);line-height:1.3}.reel-end p{margin:0;max-width:46ch;color:var(--text-2);line-height:1.9}.reel-end__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border-radius:999px;border:1px solid transparent;font-size:13.5px;font-weight:500;transition:all .22s var(--ease);white-space:nowrap}.btn--primary{background:linear-gradient(135deg,var(--accent),#ff8aae);color:#fff;box-shadow:0 14px 30px -14px #f0518bcc}.btn--primary:hover{transform:translateY(-2px);box-shadow:0 18px 36px -14px #f0518be6}.btn--ghost{border-color:var(--border);background:var(--surface);color:var(--text)}.btn--ghost:hover{border-color:var(--border-strong);transform:translateY(-2px)}.side{height:100dvh;overflow-y:auto;padding:25px 22px 20px;border-inline-start:1px solid var(--border);background:color-mix(in srgb,var(--panel) 82%,transparent);display:flex;flex-direction:column;gap:18px;scrollbar-width:thin}.side__eyebrow{font-size:10.5px;letter-spacing:2px;color:var(--accent);text-transform:uppercase}.side__head h2{margin:6px 0 4px;font-family:var(--font-serif);font-size:25px;line-height:1.35}.side__head p{margin:0;color:var(--text-3);font-size:12.5px;line-height:1.8}.side__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stat{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:11px 10px;border-radius:14px;border:1px solid var(--border);background:var(--surface);color:var(--text-3);font-size:10px}.stat svg{color:var(--accent);margin-bottom:4px}.stat strong{font-family:var(--font-mono);font-size:19px;color:var(--text);line-height:1}.side__feature{display:flex;gap:12px;padding:10px;border-radius:18px;border:1px solid var(--border);background:var(--surface);text-align:start;transition:all .22s var(--ease)}.side__feature:hover{border-color:var(--border-strong);transform:translateY(-2px)}.side__feature-media{width:78px;height:100px;border-radius:12px;overflow:hidden;flex-shrink:0}.side__feature-body{display:flex;flex-direction:column;gap:5px;min-width:0}.side__tag{font-size:9.5px;letter-spacing:1.2px;color:var(--accent-3);text-transform:uppercase}.side__feature h3{margin:0;font-family:var(--font-serif);font-size:15.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.side__more{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:var(--text-3);margin-top:auto}.side__block{padding:14px;border-radius:18px;border:1px solid var(--border);background:var(--surface)}.side__block-head h3{display:flex;align-items:center;gap:6px;margin:0 0 10px;font-size:12px;font-weight:600;letter-spacing:.3px;color:var(--text-2)}.side__block-head svg{color:var(--accent)}.side__rank{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}.side__rank button{display:flex;align-items:center;gap:10px;width:100%;padding:7px 4px;border-radius:10px;text-align:start;transition:background .2s var(--ease)}.side__rank button:hover{background:var(--surface-2)}.side__num{font-family:var(--font-mono);font-size:11px;color:var(--text-3)}.side__rank-text{display:flex;flex-direction:column;min-width:0}.side__rank-text strong{font-size:12px;font-weight:500;line-height:1.5;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.side__rank-text small{color:var(--text-3);font-size:10px}.side__how ol{margin:0;padding-inline-start:16px;color:var(--text-3);font-size:11.5px;line-height:1.85;display:flex;flex-direction:column;gap:6px}.side__how b{color:var(--text-2);font-weight:600}.side__link{display:inline-flex;align-items:center;gap:4px;margin-top:10px;color:var(--accent);font-size:11.5px}.side__link:hover{text-decoration:underline}.side__foot{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:8px;color:var(--text-3);font-size:10.5px}.side__dot{width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.5}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:20px;background:#0404089e;-webkit-backdrop-filter:blur(16px) saturate(120%);backdrop-filter:blur(16px) saturate(120%);animation:fadeIn .26s var(--ease)}.overlay--top{align-items:flex-start;padding-top:9vh}.sheet{position:relative;display:flex;flex-direction:column;width:100%;max-height:92dvh;border-radius:26px;border:1px solid var(--border);background:var(--bg-elev);box-shadow:0 50px 120px -40px #000000d9;overflow:hidden;animation:sheetUp .38s var(--ease)}.sheet--read{max-width:760px;height:92dvh;--fs: 16.5px}.sheet--settings{max-width:560px;max-height:90dvh}.sheet--comments{max-width:470px;height:84dvh}.sheet__progress{position:absolute;top:0;right:0;height:3px;z-index:8;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .12s linear}.sheet__close{position:absolute;top:16px;left:16px;z-index:9;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#0a0a0e80;border:1px solid rgba(255,255,255,.2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;transition:all .2s var(--ease)}.sheet__close:hover{background:#0a0a0ecc;transform:rotate(90deg)}.sheet__close--inline{position:static;background:var(--surface);border-color:var(--border);color:var(--text-2)}.sheet__close--inline:hover{background:var(--surface-2);color:var(--text);transform:none}.sheet__scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.sheet__scroll--pad{padding:18px 20px 24px}.sheet__bar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:18px 20px;border-bottom:1px solid var(--border);flex-shrink:0}.sheet__bar h2{margin:0;font-family:var(--font-serif);font-size:20px}.sheet__bar p{margin:2px 0 0;font-size:11.5px;color:var(--text-3);line-height:1.7}.read__hero{position:relative;height:250px;overflow:hidden}.read__hero-fade{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(4,4,8,.35) 0%,transparent 40%,var(--bg-elev) 100%)}.read__hero-meta{position:absolute;bottom:14px;inset-inline-start:26px;display:flex;align-items:center;gap:8px}.read__hero-time{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:999px;background:#0c0c1073;border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;font-size:11px}.read__body{max-width:650px;margin:0 auto;padding:6px 38px 46px}.read__kicker{margin:0 0 8px;color:var(--accent);font-size:11px;letter-spacing:1.8px;text-transform:uppercase}.read__title{margin:0 0 14px;font-family:var(--font-serif);font-size:clamp(27px,3.2vw,38px);line-height:1.3;text-wrap:balance}.font-serif .read__para,.font-serif .read__lead{font-family:var(--font-serif)}.read__lead{margin:0 0 20px;padding-bottom:20px;border-bottom:1px solid var(--border);font-size:calc(var(--fs) * .98);line-height:1.9;color:var(--text-2)}.read__byline{display:flex;align-items:center;gap:10px;margin-bottom:26px}.read__avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(140deg,var(--accent),var(--accent-2));color:#fff;font-family:var(--font-serif);font-size:16px;flex-shrink:0}.read__byline strong{display:block;font-size:12px;font-weight:600}.read__byline small{display:block;font-size:10px;color:var(--text-3);line-height:1.5}.read__type-tools{display:flex;align-items:center;gap:2px;margin-inline-start:auto;padding:3px;border-radius:999px;border:1px solid var(--border);background:var(--surface);flex-shrink:0}.read__type-tools button{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;color:var(--text-2);transition:background .2s var(--ease)}.read__type-tools button:hover{background:var(--surface-2);color:var(--text)}.read__type-label{display:grid;place-items:center;color:var(--text-3)}.read__para{margin:0 0 20px;font-size:var(--fs);line-height:1.95;color:var(--text);opacity:.94}.read__para:first-of-type:first-letter{font-family:var(--font-serif);font-size:2.6em;line-height:.9;float:right;padding:6px 0 0 10px;color:var(--accent)}.fs-1{--fs: 14.5px}.fs-2{--fs: 16.5px}.fs-3{--fs: 18.5px}.fs-4{--fs: 21px}.read__tags{display:flex;flex-wrap:wrap;gap:6px;margin:26px 0 22px}.tag{padding:5px 11px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--text-3);font-size:11px}.read__actions{display:flex;flex-wrap:wrap;gap:8px;padding-top:18px;border-top:1px solid var(--border)}.read__act{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--text-2);font-size:12px;transition:all .2s var(--ease)}.read__act:hover{border-color:var(--border-strong);color:var(--text);transform:translateY(-2px)}.read__act.is-on{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,transparent);background:color-mix(in srgb,var(--accent) 12%,transparent)}.read__next{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-top:20px;padding:15px 18px;border-radius:16px;border:1px solid var(--border);background:var(--surface);font-size:13px;transition:all .22s var(--ease)}.read__next:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--border));background:color-mix(in srgb,var(--accent) 8%,var(--surface));transform:translateY(-2px)}.read__note{margin:18px 0 0;padding-top:16px;border-top:1px dashed var(--border);font-size:10.5px;line-height:1.85;color:var(--text-3)}.comments{flex:1;min-height:0;overflow-y:auto;padding:14px 20px 8px;display:flex;flex-direction:column;gap:14px;scrollbar-width:thin}.comments__empty{margin:30px 0;text-align:center;color:var(--text-3);font-size:12.5px}.comment{display:flex;gap:10px;animation:fadeUp .3s var(--ease)}.comment__avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:var(--text);font-size:13px;flex-shrink:0;border:1px solid var(--border)}.comment__avatar--me{background:linear-gradient(140deg,var(--accent),var(--accent-2));color:#fff}.comment__main{flex:1;min-width:0;padding:10px 12px;border-radius:14px;background:var(--surface);border:1px solid var(--border)}.comment__head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:4px}.comment__head strong{font-size:11.5px;font-weight:600}.comment__head small{font-size:10px;color:var(--text-3)}.comment__main p{margin:0;font-size:12.5px;line-height:1.8;color:var(--text-2)}.comment__foot{display:flex;gap:12px;margin-top:6px}.comment__foot button{font-size:10px;color:var(--text-3)}.comment__like{display:inline-flex;align-items:center;gap:4px}.comment__foot button:hover{color:var(--accent)}.comment-form{display:flex;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--border);background:var(--bg-elev);flex-shrink:0}.comment-form input{flex:1;min-width:0;padding:10px 14px;border-radius:999px;border:1px solid var(--border);background:var(--surface);font-size:12.5px;outline:none;transition:border-color .2s var(--ease)}.comment-form input:focus{border-color:color-mix(in srgb,var(--accent) 55%,var(--border))}.comment-form__send{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#ff8aae);color:#fff;transition:opacity .2s var(--ease),transform .2s var(--ease)}.comment-form__send:disabled{opacity:.4;cursor:not-allowed}.comment-form__send:not(:disabled):hover{transform:scale(1.06)}.setting{padding-bottom:18px;margin-bottom:18px;border-bottom:1px dashed var(--border)}.setting:last-of-type{border-bottom:0;margin-bottom:8px}.setting h3{margin:0 0 10px;font-size:12.5px;font-weight:600;letter-spacing:.2px}.setting__hint{margin:8px 0 0;font-size:10.5px;line-height:1.75;color:var(--text-3)}.setting--row{display:flex;align-items:center;justify-content:space-between;gap:18px}.setting--row h3{margin-bottom:4px}.theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.theme-card{position:relative;display:flex;flex-direction:column;gap:2px;padding:9px;border-radius:14px;border:1px solid var(--border);background:var(--surface);text-align:start;transition:all .2s var(--ease)}.theme-card:hover{border-color:var(--border-strong);transform:translateY(-2px)}.theme-card.is-active{border-color:color-mix(in srgb,var(--accent) 60%,var(--border));box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 35%,transparent)}.theme-card__swatch{height:38px;border-radius:9px;margin-bottom:6px;border:1px solid var(--border)}.theme-card--dark .theme-card__swatch{background:linear-gradient(140deg,#17171d,#08080a 60%,#2a1030)}.theme-card--light .theme-card__swatch{background:linear-gradient(140deg,#fff,#eee9e0)}.theme-card--sepia .theme-card__swatch{background:linear-gradient(140deg,#f7eedf,#e3d2b4)}.theme-card strong{font-size:11.5px;font-weight:600}.theme-card small{font-size:9.5px;color:var(--text-3)}.theme-card__check{position:absolute;top:12px;inset-inline-end:12px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--accent);color:#fff}.segmented{display:flex;gap:4px;padding:4px;border-radius:13px;border:1px solid var(--border);background:var(--surface)}.segmented button{flex:1;padding:8px 6px;border-radius:9px;color:var(--text-3);font-size:11.5px;transition:all .2s var(--ease);white-space:nowrap}.segmented button:hover{color:var(--text)}.segmented button.is-active{background:var(--bg-elev);color:var(--text);box-shadow:0 6px 14px -8px #0009;border:1px solid var(--border)}.switch{position:relative;width:46px;height:27px;flex-shrink:0;border-radius:999px;border:1px solid var(--border);background:var(--surface-2);transition:background .24s var(--ease),border-color .24s var(--ease)}.switch span{position:absolute;top:3px;left:3px;width:19px;height:19px;border-radius:50%;background:var(--text-2);transition:left .24s var(--ease),background .24s var(--ease)}.switch.is-on{background:linear-gradient(135deg,var(--accent),#ff8aae);border-color:transparent}.switch.is-on span{left:22px;background:#fff}.setting__footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:6px}.setting__badge{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:10px;color:var(--text-3)}.search{width:100%;max-width:620px;border-radius:20px;border:1px solid var(--border);background:var(--bg-elev);box-shadow:0 40px 100px -40px #000c;overflow:hidden;animation:sheetUp .3s var(--ease)}.search__field{display:flex;align-items:center;gap:10px;padding:15px 18px;border-bottom:1px solid var(--border);color:var(--text-3)}.search__field input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:14px;color:var(--text)}.search__field button{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;color:var(--text-3)}.search__field button:hover{background:var(--surface-2);color:var(--text)}.search__hint{display:flex;align-items:center;justify-content:space-between;padding:10px 18px 6px;font-size:10px;color:var(--text-3);letter-spacing:.4px}.search__keys{display:inline-flex;align-items:center;gap:5px}.search__keys kbd{padding:1px 5px;border-radius:4px;border:1px solid var(--border);background:var(--surface);font-family:var(--font-mono);font-size:9px}.search__list{list-style:none;margin:0;padding:4px 8px 10px;max-height:56vh;overflow-y:auto}.search__list button{display:flex;align-items:center;gap:10px;width:100%;padding:11px 10px;border-radius:12px;text-align:start;transition:background .18s var(--ease)}.search__list button:hover{background:var(--surface)}.search__dot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex-shrink:0}.search__text{display:flex;flex-direction:column;min-width:0;flex:1}.search__text strong{font-size:12.5px;font-weight:500;line-height:1.6}.search__text small{font-size:10px;color:var(--text-3)}.search__none{padding:24px;text-align:center;color:var(--text-3);font-size:12px}.view-wrap{flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin}.view{padding:6px 26px 36px;max-width:1120px;margin:0 auto}.view__head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:18px}.view__eyebrow{font-size:10.5px;letter-spacing:2px;color:var(--accent);text-transform:uppercase}.view__head h1{margin:5px 0 6px;font-family:var(--font-serif);font-size:clamp(25px,3vw,34px);line-height:1.3}.view__head p{margin:0;color:var(--text-3);font-size:12.5px;max-width:52ch}.view__count{font-family:var(--font-mono);font-size:11px;color:var(--text-3);padding:6px 12px;border-radius:999px;border:1px solid var(--border);white-space:nowrap}.chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:20px}.chip{padding:7px 15px;border-radius:999px;border:1px solid var(--border);background:var(--surface);color:var(--text-3);font-size:12px;transition:all .2s var(--ease)}.chip:hover{color:var(--text);border-color:var(--border-strong);transform:translateY(-1px)}.chip.is-active{background:var(--text);color:var(--bg);border-color:var(--text)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px}.tile{display:flex;flex-direction:column;overflow:hidden;border-radius:18px;border:1px solid var(--border);background:var(--surface);text-align:start;transition:all .26s var(--ease)}.tile:hover{transform:translateY(-4px);border-color:var(--border-strong);box-shadow:0 24px 44px -28px #000000b3}.tile__media{height:148px;overflow:hidden}.tile__media .cover{transition:transform .8s var(--ease)}.tile:hover .tile__media .cover{transform:scale(1.06)}.tile__body{padding:12px 13px 13px;display:flex;flex-direction:column;gap:5px}.tile__cat{font-size:9.5px;letter-spacing:1.1px;color:var(--accent);text-transform:uppercase}.tile__body h3{margin:0;font-family:var(--font-serif);font-size:16px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tile__meta{display:flex;align-items:center;gap:10px;margin-top:3px;font-size:10px;color:var(--text-3)}.tile__meta span{display:inline-flex;align-items:center;gap:4px}.tile__go{margin-inline-start:auto;color:var(--text-3);transition:transform .24s var(--ease),color .24s var(--ease)}.tile:hover .tile__go{color:var(--accent);transform:translate(2px,-2px)}.saved-list{display:flex;flex-direction:column;gap:8px}.saved-row{display:flex;align-items:center;gap:10px;padding:8px;border-radius:16px;border:1px solid var(--border);background:var(--surface);transition:border-color .2s var(--ease),transform .2s var(--ease)}.saved-row:hover{border-color:var(--border-strong);transform:translateY(-2px)}.saved-row__main{display:flex;align-items:center;gap:12px;flex:1;min-width:0;text-align:start}.saved-row__thumb{width:58px;height:66px;border-radius:11px;overflow:hidden;flex-shrink:0}.saved-row h3{margin:2px 0;font-family:var(--font-serif);font-size:15px;line-height:1.4}.saved-row small{font-size:10px;color:var(--text-3)}.saved-row__remove{padding:7px 12px;border-radius:999px;border:1px solid var(--border);color:var(--text-3);font-size:10.5px;transition:all .2s var(--ease)}.saved-row__remove:hover{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,var(--border))}.empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:60px 20px;text-align:center;border:1px dashed var(--border-strong);border-radius:22px}.empty__icon{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:var(--surface);color:var(--accent);margin-bottom:4px}.empty h3{margin:0;font-family:var(--font-serif);font-size:19px}.empty p{margin:0;color:var(--text-3);font-size:12px;max-width:34ch}.toast{position:fixed;bottom:26px;left:50%;z-index:90;transform:translate(-50%,18px);padding:11px 20px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:#121218eb;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#f4f2ef;font-size:12.5px;box-shadow:0 20px 50px -20px #000c;opacity:0;pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease)}.toast.is-on{opacity:1;transform:translate(-50%)}.mnav{display:none;position:absolute;bottom:0;inset-inline:0;z-index:20;height:62px;padding-bottom:env(safe-area-inset-bottom);align-items:center;justify-content:space-around;border-top:1px solid var(--border);background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.mnav button{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 10px;color:var(--text-3);font-size:9.5px;transition:color .2s var(--ease)}.mnav button.is-active{color:var(--text)}.mnav button.is-active:before{content:"";position:absolute;top:-6px;width:16px;height:2px;border-radius:2px;background:var(--accent)}.mnav__badge{position:absolute;top:0;inset-inline-end:2px;min-width:14px;height:14px;border-radius:7px;background:var(--accent);color:#fff;font-family:var(--font-mono);font-size:8.5px;font-style:normal;line-height:14px;text-align:center}@keyframes segFill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes heartPop{0%{opacity:0;transform:scale(.4)}18%{opacity:1;transform:scale(1.12)}38%{transform:scale(.96)}62%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.05)}}@keyframes pulse{0%,to{box-shadow:0 0 #f0518b8c}50%{box-shadow:0 0 0 5px #f0518b00}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes sheetUp{0%{opacity:0;transform:translateY(22px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes hintFade{0%{opacity:0}15%{opacity:1}70%{opacity:1}to{opacity:0}}[data-motion=reduced] *,[data-motion=reduced] *:before,[data-motion=reduced] *:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}@media (max-width: 1280px){.app{grid-template-columns:88px minmax(0,1fr)}.side{display:none}}@media (max-width: 880px){.app{grid-template-columns:1fr}.rail-nav{display:none}.brand--compact{display:flex}.main{padding-bottom:62px}.topbar{padding:12px 14px 8px}.topbar__claim{font-size:15px}.topbar__live{font-size:10px}.icon-btn{width:34px;height:34px;border-radius:10px}.brand--compact .brand__mark{width:32px;height:32px}.brand--compact .brand__word{font-size:16px}.storybar{padding:0 14px 10px;gap:10px}.story__ring{width:50px;height:50px}.story__face{font-size:15px;border-width:2px}.story__label{font-size:10.5px}.feed-wrap{padding:0 10px 8px}.reel-slot{padding-bottom:8px}.reel__frame{border-radius:22px}.reel__content{inset-inline-end:70px;padding:0 18px 22px}.reel__title{font-size:clamp(24px,7.2vw,33px)}.reel__excerpt{font-size:13.5px;-webkit-line-clamp:2}.reel__meta{margin-bottom:14px}.rail{left:8px;bottom:22px;gap:8px}.rail__btn{width:46px;padding:5px 0;font-size:9px}.reel__scroll-hint{display:none}.mnav{display:flex}.view{padding:4px 16px 24px}.view__head{flex-direction:column;align-items:flex-start;gap:8px}.chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.chips::-webkit-scrollbar{display:none}.chip{flex-shrink:0}.grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.tile__media{height:118px}.tile__body h3{font-size:14.5px}.overlay{padding:0;align-items:flex-end}.sheet--read{height:100dvh;max-height:100dvh;border-radius:0;max-width:none}.sheet--settings,.sheet--comments{max-width:none;border-radius:22px 22px 0 0;max-height:92dvh}.sheet--comments{height:88dvh}.overlay--top{align-items:flex-start;padding-top:8vh;padding-inline:12px}.read__body{padding:4px 22px 36px}.read__hero{height:205px}.read__hero-meta{inset-inline-start:20px}.read__title{font-size:clamp(25px,7.4vw,32px)}.read__actions{gap:6px}.read__act{padding:8px 11px;font-size:11px}.toast{bottom:78px}.reel-end{padding:26px}.theme-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width: 430px){.topbar__claim{font-size:14px}.topbar__live{font-size:9.5px}.reel__content{padding:0 14px 18px;inset-inline-end:64px}.reel__title{font-size:23px}.reel__kicker{font-size:10px;letter-spacing:1px}.reel__cta{font-size:12px;padding:9px 13px}.grid{grid-template-columns:1fr 1fr}.segmented button{font-size:10.5px;padding:8px 2px}.read__body{padding:4px 18px 32px}.read__lead{font-size:15.5px}}@media (max-height: 720px){.reel__title{font-size:clamp(22px,4.4vw,30px)}.reel__excerpt{-webkit-line-clamp:2}.reel__meta{margin-bottom:12px}.reel__cta{padding:8px 14px}.rail{bottom:18px;gap:6px}.read__hero{height:180px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
