:root{--navy:#0A1931;--red:#D90429;--bg:#f6f8fc;--muted:#64748b;--card:#ffffff;--line:#e5e7eb;--text:#0f172a;--grid:rgba(10,25,49,.06);--glow:rgba(217,4,41,.07)}
.dark{--bg:#0A1931;--card:#13233f;--line:#24344f;--text:#f1f5f9;--muted:#94a3b8;--grid:rgba(148,163,184,.085);--glow:rgba(56,189,248,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'Inter',system-ui,sans-serif;color:var(--text);line-height:1.65;background-color:var(--bg);background-image:radial-gradient(900px 340px at 50% -130px,var(--glow),transparent 70%),linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:auto,28px 28px,28px 28px;transition:background-color .5s ease,color .5s ease}
h1,h2,h3{font-family:'Lora',Georgia,serif;line-height:1.25;letter-spacing:-.01em}
.wrap{max-width:1160px;margin:0 auto;padding:0 18px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:99}
.topbar{background:var(--navy);color:#fff;font-size:13px}.topbar-in{display:flex;align-items:center;gap:10px;padding:7px 18px}.ticker{flex:1;white-space:nowrap}.ticker-label{background:var(--red);padding:2px 8px;border-radius:6px;font-weight:800}.live-dot{width:9px;height:9px;border-radius:50%;background:#22c55e;animation:blink 1.2s infinite}@keyframes blink{50%{opacity:.3}}
/* Sky switch: langit siang -> malam, awan hanyut, bintang berkelip, knob sun/moon morph */
.theme-switch{background:none;border:0;padding:4px;cursor:pointer;flex:0 0 auto;line-height:0}
.theme-switch:focus-visible{outline:2px solid #FFD93D;outline-offset:3px;border-radius:999px}
.ts-track{position:relative;display:block;width:70px;height:34px;border-radius:999px;overflow:hidden;background:linear-gradient(180deg,#38bdf8 0%,#bae6fd 55%,#fef3c7 100%);border:1px solid rgba(255,255,255,.5);box-shadow:inset 0 2px 6px rgba(10,25,49,.28),0 1px 2px rgba(10,25,49,.2);transition:background .6s ease,border-color .6s ease,box-shadow .6s ease}
.theme-switch:hover .ts-track{box-shadow:inset 0 2px 6px rgba(10,25,49,.28),0 0 0 4px rgba(255,217,61,.25),0 0 14px rgba(255,217,61,.45)}
.dark .ts-track{background:linear-gradient(180deg,#020617 0%,#0f172a 55%,#312e81 100%);border-color:rgba(148,163,184,.3)}
.dark .theme-switch:hover .ts-track{box-shadow:inset 0 2px 6px rgba(0,0,0,.5),0 0 0 4px rgba(56,189,248,.18),0 0 14px rgba(56,189,248,.4)}
.ts-cloud{position:absolute;color:rgba(255,255,255,.95);filter:drop-shadow(0 1px 1px rgba(10,25,49,.15));transition:opacity .5s ease,transform .7s cubic-bezier(.4,0,.2,1)}
.ts-cloud-a{right:8px;top:4px;animation:drift 7s ease-in-out infinite}
.ts-cloud-b{right:30px;top:18px;opacity:.75;animation:drift 9s ease-in-out -3s infinite}
.dark .ts-cloud{opacity:0;transform:translateX(16px)}
@keyframes drift{0%,100%{margin-right:0}50%{margin-right:5px}}
.ts-star{position:absolute;border-radius:50%;background:#fefce8;opacity:0;transform:scale(.4);transition:opacity .5s ease,transform .5s ease}
.ts-s1{left:10px;top:7px;width:3px;height:3px}
.ts-s2{left:20px;top:15px;width:2px;height:2px}
.ts-s3{left:30px;top:6px;width:2.5px;height:2.5px}
.ts-s4{left:15px;top:23px;width:2px;height:2px}
.dark .ts-star{opacity:1;transform:scale(1)}
.dark .ts-s1{animation:twinkle 2.2s ease-in-out infinite}
.dark .ts-s2{animation:twinkle 3.1s ease-in-out -.8s infinite}
.dark .ts-s3{animation:twinkle 2.6s ease-in-out -1.5s infinite}
.dark .ts-s4{animation:twinkle 3.6s ease-in-out -2s infinite}
@keyframes twinkle{0%,100%{opacity:.25}50%{opacity:1}}
.ts-knob{position:absolute;top:4px;left:4px;width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fefce8,#fbbf24 70%);display:grid;place-items:center;color:#92400e;box-shadow:0 2px 7px rgba(10,25,49,.45),0 0 10px rgba(251,191,36,.55);transition:transform .6s cubic-bezier(.34,1.45,.44,1),background .5s ease,color .5s ease,box-shadow .5s ease}
.dark .ts-knob{transform:translateX(36px);background:radial-gradient(circle at 35% 35%,#475569,#0f172a 72%);color:#fde68a;box-shadow:0 2px 7px rgba(0,0,0,.6),0 0 10px rgba(56,189,248,.5)}
.theme-switch:active .ts-knob{scale:.88}
.ts-knob-sun,.ts-knob-moon{grid-area:1/1;transition:opacity .35s ease,transform .6s cubic-bezier(.34,1.45,.44,1)}
.ts-knob-sun{opacity:1;transform:rotate(0) scale(1);animation:sunspin 14s linear infinite}
.dark .ts-knob-sun{opacity:0;transform:rotate(140deg) scale(.35);animation:none}
.ts-knob-moon{opacity:0;transform:rotate(-140deg) scale(.35)}
.dark .ts-knob-moon{opacity:1;transform:rotate(0) scale(1)}
@keyframes sunspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ts-track,.ts-knob,.ts-knob-sun,.ts-knob-moon,.ts-cloud,.ts-star{transition:none;animation:none}}
.site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.header-in{display:flex;align-items:center;gap:18px;padding:12px 18px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}.brand-text strong{font-size:20px;letter-spacing:.02em}.brand-text strong em{font-style:normal;color:var(--red)}.brand-text small{display:block;font-size:11px;color:var(--muted);font-family:'Inter'}
.mainnav{display:flex;gap:14px;margin-left:8px}.mainnav a{text-decoration:none;color:inherit;font-weight:600;font-size:14px;padding:6px 2px;border-bottom:2px solid transparent}.mainnav a:hover{border-color:var(--red)}.nav-fact{background:#dcfce7;color:#14532d!important;padding:4px 10px!important;border-radius:20px!important}.dark .nav-fact{background:#14532d;color:#dcfce7!important}.searchbox{margin-left:auto;display:flex}.searchbox input{padding:8px 12px;border:1px solid var(--line);border-radius:10px 0 0 10px;background:var(--card);color:inherit}.searchbox button{border:0;background:var(--navy);color:#fff;padding:8px 14px;border-radius:0 10px 10px 0;cursor:pointer}.hamburger{display:none;background:none;border:0;font-size:22px}
.hero-grid{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin-top:18px}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;display:block;transition:transform .25s,box-shadow .25s}.card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.12)}.hero-card h1{font-size:30px;margin:12px 16px}.hero-card p{margin:0 16px 12px;color:var(--muted)}.img-wrap{position:relative;aspect-ratio:16/9;background:#e2e8f0}.img-wrap.sm{aspect-ratio:16/10}.img-wrap img{width:100%;height:100%;object-fit:cover;display:block}.img-ph{width:100%;height:100%;background:linear-gradient(120deg,#e2e8f0,#f1f5f9)}.badge{position:absolute;top:12px;left:12px;background:var(--red);color:#fff;font-size:11px;font-weight:800;padding:4px 10px;border-radius:20px}.badge.fact{background:#15803d;color:#fff;position:static;display:inline-block;margin-bottom:8px}.dark .badge.fact{background:#16a34a;color:#052e16}.badge.big{font-size:13px}.meta{padding:0 16px 14px;color:var(--muted);font-size:13px}.mini{padding:14px;margin-bottom:12px}.mini h3{margin:6px 0;font-size:17px}.mini small{color:var(--muted)}.trending{padding:16px}.trend-list{list-style:none;margin:10px 0 0;padding:0}.trend-list li{margin:0 0 13px}.trend-list li:last-child{margin-bottom:0}.trend-list a{display:flex;gap:10px;align-items:flex-start;color:inherit;text-decoration:none;font-weight:600;font-size:14px}.trend-list a:hover .th{color:var(--red)}.rank{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:26px;width:26px;height:26px;margin-top:1px;background:var(--navy);color:#fff;border-radius:50%;font-size:12.5px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}.rank.top{background:var(--red)}.dark .rank{background:#334155}.dark .rank.top{background:var(--red)}.tt{min-width:0;flex:1}.th{display:block;line-height:1.45}.trending small{display:block;color:var(--muted);font-weight:400;margin-top:2px}
.section{margin:30px auto}.section.alt{background:color-mix(in srgb,var(--line) 35%,transparent);border-radius:18px;padding:20px}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-head h2,.section-head h1{margin:0;font-size:24px}.section-head a{text-decoration:none;font-weight:700;color:var(--red)}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.news{padding:0}.news h3{font-size:16px;margin:10px 14px;font-family:'Inter';font-weight:700}.news p{margin:0 14px 10px;color:var(--muted);font-size:13px}
.article{max-width:760px}.crumb{font-size:13px;color:var(--muted);margin:18px 0}.crumb a{color:inherit}.art-title{font-size:34px}.toc{background:#fff;border:1px solid var(--line);border-left:5px solid var(--red);border-radius:12px;padding:16px 20px;margin:20px 0;box-shadow:0 4px 14px rgba(10,25,49,.07)}.toc-title{font-weight:800;font-size:15px;margin-bottom:10px;color:var(--text)}.toc-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}.toc-list li{display:flex;gap:8px;align-items:baseline;font-size:14.5px}.toc-list li.toc-h3{padding-left:22px}.toc-num{font-weight:800;color:var(--red);flex:0 0 auto}.toc-list a{color:var(--text);text-decoration:none;font-weight:600}.toc-list a:hover{color:var(--red);text-decoration:underline}.dark .toc{background:#12294d;border-color:#2b4a73;border-left-color:var(--red);box-shadow:0 4px 16px rgba(0,0,0,.4)}.dark .toc-title{color:#fff}.dark .toc-list a{color:#e8eefb}.dark .toc-list a:hover{color:#ffb3c0}.art-body{font-size:18px}.art-body h2,.art-body h3{scroll-margin-top:150px}.art-body img{max-width:100%;border-radius:12px}.art-body h2{margin-top:28px}figure img{width:100%;border-radius:14px}figcaption{font-size:13px;color:var(--muted)}.share-row{display:flex;gap:8px;margin:14px 0}.share-row a,.share-row button{border:1px solid var(--line);border-radius:20px;padding:6px 14px;text-decoration:none;color:inherit;background:var(--card);cursor:pointer;font-size:13px}.tags{margin:18px 0}.tag{background:#f1f5f9;color:#0f172a;border:1px solid var(--line);padding:4px 12px;border-radius:20px;font-size:12px;margin-right:6px}.dark .tag{background:#1e293b;color:#e2e8f0}.progress{position:fixed;top:0;left:0;height:3px;background:var(--red);width:0;z-index:99}
.site-footer{border-top:1px solid var(--line);margin-top:36px;background:color-mix(in srgb,var(--line) 25%,transparent)}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:18px;padding:26px 18px}.footer-grid nav a{display:block;color:inherit;text-decoration:none;font-size:14px;margin:4px 0}.copy{text-align:center;padding:12px;font-size:13px;color:var(--muted);border-top:1px solid var(--line)}.pager{display:flex;gap:8px;margin-top:18px}.pager a{padding:8px 14px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:inherit}.pager a.on{background:var(--navy);color:#fff}.notice{border-radius:12px;padding:14px;margin:16px 0}.notice.error{background:#fef2f2;color:#7f1d1d;border:1px solid #fecaca}.dark .notice.error{background:#450a0a;color:#fecaca;border-color:#7f1d1d}.ad-slot{background:#eef2f7;border:1px dashed #94a3b8;border-radius:12px;min-height:90px;display:grid;place-items:center;margin:16px 0;color:#475569;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.dark .ad-slot{background:#0f1f3d;border-color:#3b5378;color:#9fb2cc}.ad-billboard{min-height:110px}.muted{color:var(--muted)}
@media(max-width:1100px){.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}.hero-side{display:grid;grid-template-columns:1fr 1fr;gap:16px}.hero-side .mini{margin-bottom:0}.hero-side .trending{grid-column:1/-1}.grid-3,.footer-grid{grid-template-columns:1fr 1fr}.mainnav,.searchbox{display:none}.hamburger{display:block;margin-left:auto}.mainnav.open{display:flex;position:absolute;top:100%;left:0;right:0;z-index:60;background:var(--card);flex-direction:column;padding:14px 18px 18px;border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(10,25,49,.15)}.hero-card h1{font-size:26px}.section-head h2,.section-head h1{font-size:21px}}
@media(max-width:600px){.wrap{padding:0 14px}.grid-4,.grid-3,.footer-grid,.hero-side{grid-template-columns:1fr}.topbar-in{padding:7px 14px}#ta-date{display:none}.ticker{font-size:12px}.theme-switch{transform:scale(.85);transform-origin:right center}.brand-text strong{font-size:17px}.brand-text small{display:none}.brand img{width:32px!important;height:32px!important}.header-in{gap:12px;padding:10px 14px}.hero-card h1,.art-title{font-size:23px}.hero-card h1{margin:10px 12px}.hero-card p{margin:0 12px 10px}.art-body{font-size:16.5px;overflow-wrap:anywhere}.section{margin:22px auto}.section.alt{padding:14px;border-radius:14px}.toc{padding:12px 14px}.toc-list li{font-size:13.5px}.share-row{flex-wrap:wrap}.crumb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pager{flex-wrap:wrap}.meta{font-size:12px}}