:root{
  --kyami-yellow:#F5C518;
  --kyami-yellow-2:#FFD84A;
  --kyami-charcoal:#0B0B0B;
  --kyami-text:#111;
  --kyami-bg:#0B0B0B;
  --kyami-link:#111;
  --radius:18px;
  --container:1180px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:#0B0B0B;color:#fff;line-height:1.55}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.container{width:min(100% - 24px,var(--container));margin-inline:auto}
.site{min-height:100vh;display:flex;flex-direction:column;background:transparent}
.site-content{flex:1;padding:8px 0 48px}

.site-header{position:sticky;top:0;z-index:40;background:transparent;transition:box-shadow .2s}
.site-header.is-compact{box-shadow:0 8px 20px rgba(0,0,0,.4)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:84px}
.site-branding{display:flex;justify-content:center;flex:1;min-width:0}
.custom-logo,.site-branding img{max-height:44px;max-width:150px;width:auto;object-fit:contain}
.site-title{display:none}
.home-logo{display:none}
.nav-logo{max-width:140px;display:block;margin:28px auto 16px}
.nav-auth{display:flex;gap:8px;margin:0 0 16px}
.nav-daftar,.nav-login{flex:1;text-align:center;padding:10px 8px;border-radius:10px;font-weight:800}
.nav-daftar{background:#F5C518;color:#111!important;border-bottom:0!important}
.nav-login{background:#2563eb;color:#fff!important;border-bottom:0!important}
.nav-sheet .menu{list-style:none;padding:0;margin:0}
.nav-sheet .menu li{list-style:none}
.site-branding img{max-height:56px;width:auto}
.site-title{margin:0;font-weight:800;letter-spacing:.04em}
.site-title a{color:var(--kyami-yellow)}
.header-search{display:flex;background:#fff;border-radius:8px;overflow:hidden;max-width:260px}
.header-search input{border:0;padding:10px 12px;min-width:0;flex:1;color:#111;font-size:14px}
.header-search button{background:var(--kyami-yellow);border:0;width:42px;cursor:pointer;color:#111}
.nav-toggle{width:42px;height:42px;border:0;border-radius:10px;background:var(--kyami-yellow);cursor:pointer}
.nav-toggle span,.nav-toggle span:before,.nav-toggle span:after{display:block;width:16px;height:2px;background:#111;margin:0 auto;position:relative}
.nav-toggle span:before,.nav-toggle span:after{content:"";position:absolute;left:0}
.nav-toggle span:before{top:-5px}.nav-toggle span:after{top:5px}
.primary-nav,.header-cta{display:none}
.mobile-drawer{display:none;position:fixed;inset:84px 0 0;background:#111;z-index:30;padding:16px}
.mobile-drawer.is-open{display:block}
.mobile-drawer a{display:block;padding:14px 8px;border-bottom:1px solid #222}

.page-kicker{text-align:center;font-weight:800;letter-spacing:.04em;margin:10px 0 8px;font-size:1.15rem}
.ticker{overflow:hidden;border-top:1px dashed #f5c51855;border-bottom:1px dashed #f5c51855;padding:8px 0;margin:0 0 18px;white-space:nowrap}
.ticker-track{display:inline-flex;gap:40px;animation:tick 18s linear infinite;font-weight:700;letter-spacing:.08em;color:#eee}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none;padding-left:0}}

.card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch}
.card-cell{min-width:0;display:flex}
.article-card{
  background:linear-gradient(180deg,#FFE44A,#F5C518);
  color:#111;border-radius:16px;overflow:hidden;
  box-shadow:0 10px 24px rgba(0,0,0,.35);
  display:flex;flex-direction:column;
  width:100%;
}
.article-card .kyami-thumb{
  margin:10px 10px 0;border-radius:12px;overflow:hidden;
  border:3px solid #111;aspect-ratio:1/1;width:calc(100% - 20px);background:#111;
}
.article-card .kyami-thumb img,.featured-image img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .25s}
.img-loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.img-loader svg{width:48%;max-width:130px}
.kyami-thumb,.featured-image{position:relative}
.kyami-thumb.is-ready .img-loader,.featured-image.is-ready .img-loader{display:none}
.kyami-thumb.is-ready img,.featured-image.is-ready img{opacity:1}
.card-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1;min-height:0}
.card-title-box{margin:10px 10px 0;background:#111;color:#F5C518;border-radius:10px;padding:8px 10px;text-align:center;height:40px;display:flex;align-items:center;justify-content:center}
.card-title-box a{color:#F5C518!important;font-size:.85rem;text-transform:uppercase;display:block;width:100%;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.card-body h3{margin:0}
.meta-date{font-size:11px!important;font-weight:700;color:#333;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;height:16px;line-height:16px}
.excerpt{margin:0!important;font-size:12px!important;color:#222;height:36px!important;line-height:18px!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
.btn-read{
  display:block;text-align:center;background:#2563eb;color:#fff!important;font-weight:800;
  border-radius:10px;padding:11px 12px;margin-top:auto;
  transition:transform .18s ease,filter .18s ease;
}
@media (hover:hover){
  .article-card:hover{transform:translateY(-5px);box-shadow:0 18px 32px rgba(0,0,0,.45)}
  .article-card:hover img{transform:scale(1.04)}
  .btn-read:hover{filter:brightness(1.08);transform:translateY(-2px)}
}

.back-home{display:inline-block;background:#F5C518;color:#111!important;font-weight:800;font-size:13px;padding:6px 12px;border-radius:8px;margin:0 0 12px}
.single-layout{display:grid;grid-template-columns:1.65fr .7fr;gap:22px;align-items:start}
.single-wrap{max-width:none;margin:0;background:transparent;color:#fff;border-radius:0;padding:0}
.single-wrap .entry-title{color:#fff;text-transform:uppercase;font-size:1.7rem;line-height:1.2;margin:0 0 8px}
.single-meta{color:#9a9a9a;font-size:13px;margin-bottom:14px}
.article-box{background:#161616;border:2px solid #F5C518;border-radius:16px;padding:14px;box-shadow:0 12px 28px rgba(0,0,0,.35)}
.featured-image{border-radius:12px;overflow:hidden;margin:0 0 16px;border:3px solid #F5C518;background:#000}
.featured-image img{width:100%;height:auto;display:block}
.entry-content{color:#e8e8e8;padding:4px 6px 10px;text-align:left}
.entry-content img,
.entry-content .aligncenter,
.entry-content .wp-caption,
.article-box img{
  display:block;
  margin-left:auto;
  margin-right:auto;
  max-width:100%;
  height:auto;
}
.entry-content .alignleft{margin:0 auto 12px}
.featured-image{display:flex;justify-content:center}
.featured-image img{margin:0 auto}
.post-cta{display:flex;gap:8px;margin:10px 0 12px}
.post-cta a{flex:1;text-align:center;padding:8px 6px;border-radius:8px;font-size:12px;font-weight:800;text-decoration:none!important;text-transform:uppercase}
.post-cta a.wa{background:#25D366;color:#fff!important;box-shadow:0 0 10px #25D36688}
.post-cta a.tg{background:#229ED9;color:#fff!important;box-shadow:0 0 10px #229ED988}
.post-cta a.login{background:#F5C518;color:#111!important;box-shadow:0 0 10px #F5C51888}
.entry-content .pmtoto-cta{display:none!important}
.kyami-share{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid #333}
.kyami-share a{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#F5C518;color:#111}
.site-branding{display:flex;align-items:center;max-width:46%;position:relative;z-index:2}
.site-branding img,.custom-logo{max-height:56px;width:auto;display:block}
.side-title{margin:0 0 12px;font-size:16px}
.single-side .related-posts .section-head{display:none}
.single-side .card-grid{grid-template-columns:1fr!important}
@media(max-width:900px){.single-layout{grid-template-columns:1fr}}
.site-footer{background:#050505;color:#aaa;padding:28px 0 16px;margin-top:auto;border-top:1px solid #1a1a1a}
.footer-grid{display:grid;gap:16px}
.footer-bottom{margin-top:12px;font-size:.82rem}
.kyami-banner{margin:16px 0;text-align:center}
.pagination{display:flex;gap:8px;justify-content:center;margin:22px 0}
.page-numbers{padding:8px 12px;border-radius:8px;background:#1a1a1a}
.page-numbers.current{background:var(--kyami-yellow);color:#111;font-weight:800}
.search-form{display:flex;gap:8px}
.search-form input{flex:1;padding:10px;border-radius:8px;border:0}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--kyami-yellow);color:#111;font-weight:800;border:0;border-radius:10px;padding:10px 16px}
.no-anim .ticker-track{animation:none}
[data-animate]{opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .4s ease}
[data-animate].in,.no-anim [data-animate]{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){[data-animate]{opacity:1;transform:none}}

.article-card .kyami-thumb{border:3px solid #d4a017;box-shadow:inset 0 0 0 2px #111}
.page-kicker{display:flex;justify-content:center;align-items:center;gap:8px}
.nav-fab{width:42px;height:42px;border:0;border-radius:12px;background:#F5C518;color:#111;cursor:pointer;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:0}
.nav-fab svg{display:block}
.nav-mask{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:80;opacity:0;transition:opacity .2s}
.nav-mask.is-open{opacity:1}
.nav-sheet{position:fixed;left:0;top:0;bottom:0;width:min(82vw,300px);background:#111;z-index:91;padding:56px 16px 22px;transform:translateX(-105%);transition:transform .32s cubic-bezier(.2,1.1,.3,1);overflow:auto}
.nav-sheet.is-open{transform:none}
.nav-close{float:right;background:transparent;border:0;color:#F5C518;font-size:28px}
.nav-sheet-brand{color:#F5C518;font-weight:800;margin:8px 0 16px}
.nav-sheet a{display:block;padding:12px 8px;border-bottom:1px solid #222;color:#fff;font-weight:700}
.nav-label{color:#888;font-size:11px;letter-spacing:.1em;margin:16px 0 6px}
.header-inner{gap:10px}
.site-branding{flex:0 1 auto}
@media(min-width:1025px){
  .nav-fab{display:inline-flex}
}
.article-card{transition:transform .2s ease,box-shadow .2s ease}
@media(hover:hover){
  .article-card:hover{transform:translateY(-8px) rotate(-0.4deg);box-shadow:0 18px 32px rgba(245,197,24,.2)}
  .article-card:hover img{transform:scale(1.06) rotate(1deg)}
}
[data-animate="left"]{opacity:0;transform:translateX(-40px) rotate(-4deg);transition:opacity .5s ease,transform .5s ease}
[data-animate="right"]{opacity:0;transform:translateX(40px) rotate(4deg);transition:opacity .5s ease,transform .5s ease}
[data-animate="left"].in,[data-animate="right"].in{opacity:1;transform:none}
.site-footer{background:transparent;color:#fff;padding:24px 0 18px;text-align:center}
.site-footer h2,.footer-bottom{margin:0;color:#fff;text-shadow:0 1px 4px #000}
.bukti-pager{margin:22px 0 8px}
.bukti-pager ul{display:flex;justify-content:center;gap:8px;list-style:none;padding:0;margin:0;flex-wrap:wrap}
.bukti-pager a,.bukti-pager span{display:inline-flex;min-width:36px;height:36px;align-items:center;justify-content:center;border-radius:10px;background:rgba(0,0,0,.35);color:#fff;font-weight:800;border:1px solid #F5C518}
.bukti-pager .current{background:#F5C518;color:#111}
.pmtoto-cta{text-align:center;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:14px 0}
.entry-content .pmtoto-cta a{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:210px;padding:13px 22px;border-radius:12px;
  font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  text-decoration:none!important
}
.entry-content .pmtoto-cta a.wa{background:linear-gradient(180deg,#2dff7a,#16b34a);color:#fff!important;box-shadow:0 0 16px #25D366}
.entry-content .pmtoto-cta a.tg{background:linear-gradient(180deg,#4cc2ff,#1a86c7);color:#fff!important;box-shadow:0 0 16px #229ED9}
.entry-content .pmtoto-cta a.login{background:linear-gradient(180deg,#ffe44a,#f5c518);color:#111!important;box-shadow:0 0 18px #F5C518}
@media(max-width:600px){.entry-content .pmtoto-cta a{min-width:100%;width:100%}}

.jp-gate{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(circle at 50% 42%,#1a1200 0%,#05050a 55%,#000 100%)}
.jp-gate.on{display:flex;animation:jpIn .45s ease both}
@keyframes jpIn{from{opacity:0}to{opacity:1}}
.jp-stars{position:absolute;inset:0;background:radial-gradient(2px 2px at 20% 30%,#fff,transparent),radial-gradient(1px 1px at 70% 20%,#ffe566,transparent),radial-gradient(2px 2px at 40% 80%,#fff,transparent),radial-gradient(1px 1px at 85% 60%,#f5c518,transparent);opacity:.7;animation:jpTw 2.4s ease-in-out infinite}
@keyframes jpTw{0%,100%{opacity:.35}50%{opacity:.9}}
.jp-hole{width:46px;height:46px;border-radius:50%;background:radial-gradient(circle,#000 28%,#3d2a00 42%,#f5c518 50%,#000 72%);box-shadow:0 0 40px #f5c518;animation:jpHole 1.8s cubic-bezier(.2,.7,.2,1) forwards;position:relative;z-index:2}
.jp-ring{position:absolute;width:96px;height:96px;border-radius:50%;border:2px solid rgba(245,197,24,.4);animation:jpRing 1.8s ease-out forwards}
.jp-gate span{position:relative;z-index:2;margin-top:28px;color:#f5c518;font-weight:800;letter-spacing:2px;font-size:12px}
@keyframes jpHole{0%{transform:scale(.2)}55%{transform:scale(7) rotate(200deg)}100%{transform:scale(22) rotate(400deg);opacity:.25}}
@keyframes jpRing{0%{transform:scale(.4);opacity:0}30%{opacity:1}100%{transform:scale(8);opacity:0}}
body.single .site-content{animation:jpPageIn .7s ease both}
@keyframes jpPageIn{from{opacity:0;filter:blur(8px);transform:translateY(10px)}to{opacity:1;filter:none;transform:none}}
