:root{--gi-bg:#061019;--gi-card:#0b1822;--gi-line:#1b3443;--gi-text:#eaf6fb;--gi-muted:#8aa6b5;--gi-accent:#55d5d0}.gi-page{margin:0;background:var(--gi-bg);color:var(--gi-text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.gi-main{padding:32px 18px 72px}.gi-shell{max-width:1180px;margin:auto}.gi-breadcrumb{display:flex;gap:8px;flex-wrap:wrap;color:var(--gi-muted);font-size:13px;margin-bottom:18px}.gi-breadcrumb a{color:#b9d8e5;text-decoration:none}.gi-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:22px;align-items:stretch;padding:28px;border:1px solid var(--gi-line);border-radius:26px;background:linear-gradient(135deg,#0c1d29,#08131c);box-shadow:0 22px 70px rgba(0,0,0,.22)}.gi-kicker,.gi-section-head>span,.gi-promo span{font-size:11px;letter-spacing:.14em;font-weight:900;color:var(--gi-accent)}.gi-hero h1{font-size:clamp(34px,5vw,62px);line-height:1.02;margin:10px 0 14px}.gi-hero p,.gi-section-head p,.gi-promo p,.gi-method p{color:var(--gi-muted);line-height:1.7}.gi-hero figure,.gi-art-placeholder{margin:0;border-radius:20px;overflow:hidden;min-height:280px;background:#102432}.gi-hero figure img{width:100%;height:100%;object-fit:cover}.gi-art-placeholder{display:grid;place-items:center;text-align:center}.gi-art-placeholder b{font-size:70px;color:#24495a}.gi-art-placeholder span{padding:16px;color:#9fb9c6}.gi-hero-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:22px}.gi-primary,.gi-promo>a{padding:12px 17px;border-radius:12px;background:var(--gi-accent);color:#042126;text-decoration:none;font-weight:900}.gi-hero-actions span{font-size:12px;color:#7f9dab}.gi-promo{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:18px;padding:20px 22px;border:1px solid #27404c;border-radius:20px;background:#0c1a24}.gi-promo h2{margin:4px 0}.gi-promo p{margin:0}.gi-section{margin-top:22px;padding:24px;border:1px solid var(--gi-line);border-radius:22px;background:var(--gi-card)}.gi-section-head{margin-bottom:18px}.gi-section-head h2{font-size:26px;margin:5px 0}.gi-section-head p{margin:5px 0}.gi-rank-grid,.gi-spec-grid,.gi-metric-grid{display:grid;gap:10px}.gi-rank-grid{grid-template-columns:repeat(3,1fr);margin-bottom:12px}.gi-rank-grid article,.gi-spec-grid article,.gi-metric-grid article{padding:15px;border:1px solid #18313e;border-radius:15px;background:#08151e}.gi-rank-grid article{display:grid;gap:4px}.gi-rank-grid b{font-size:22px;color:var(--gi-accent)}.gi-rank-grid small,.gi-spec-grid span,.gi-metric-grid span,.gi-updated{color:var(--gi-muted);font-size:12px}.gi-spec-grid{grid-template-columns:repeat(4,1fr)}.gi-spec-grid article{display:flex;justify-content:space-between;gap:10px;align-items:center}.gi-metric-grid{grid-template-columns:repeat(4,1fr)}.gi-metric-grid article{display:grid;gap:4px}.gi-metric-grid strong{font-size:25px}.gi-updated{display:block;margin-top:12px}.gi-performance-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:14px}.gi-dist,.gi-heat{padding:18px;border:1px solid #18313e;border-radius:16px;background:#08151e}.gi-dist>div{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid #142c38}.gi-dist p{color:var(--gi-muted)}.gi-heat{display:grid;gap:8px}.gi-heat>strong{font-size:32px;color:#f4bd5f}.gi-heat>small{color:var(--gi-muted)}.gi-heat>div{display:flex;justify-content:space-between;padding-top:10px;border-top:1px solid #142c38}.gi-win-list{display:grid;gap:8px}.gi-win-list article{display:grid;grid-template-columns:1fr auto auto;gap:18px;align-items:center;padding:13px 15px;border:1px solid #18313e;border-radius:14px;background:#08151e}.gi-win-list article div{display:grid}.gi-win-list small{color:var(--gi-muted)}.gi-win-list b{font-size:18px}.gi-win-list span{color:var(--gi-accent);font-weight:900}.gi-chart{height:260px;display:flex;align-items:end;gap:10px;padding:20px 12px 0;border-radius:16px;background:#08151e}.gi-chart>div{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:7px}.gi-chart i{width:min(44px,70%);min-height:4px;border-radius:8px 8px 2px 2px;background:linear-gradient(#5fe0d8,#2b7182)}.gi-chart small{color:var(--gi-muted);font-size:10px}.gi-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.gi-gallery figure{margin:0;aspect-ratio:16/10;border-radius:14px;overflow:hidden;background:#08151e}.gi-gallery img{width:100%;height:100%;object-fit:cover}.gi-content{color:#c8dbe4;line-height:1.8}.gi-content h2,.gi-content h3{color:#f0fbff}.gi-method{border-style:dashed}@media(max-width:850px){.gi-hero,.gi-performance-grid{grid-template-columns:1fr}.gi-spec-grid,.gi-metric-grid{grid-template-columns:repeat(2,1fr)}.gi-gallery{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.gi-main{padding:20px 12px 50px}.gi-hero,.gi-section{padding:17px;border-radius:18px}.gi-rank-grid,.gi-spec-grid,.gi-metric-grid{grid-template-columns:1fr}.gi-promo{align-items:flex-start;flex-direction:column}.gi-win-list article{grid-template-columns:1fr auto}.gi-win-list span{grid-column:1/-1}.gi-gallery{grid-template-columns:1fr 1fr}}
/* V4.29.0 — public currency presentation: IDR only */
.gi-idr-value{font-variant-numeric:tabular-nums}.gi-win-list article>.gi-idr-value{display:inline-flex;align-items:center;justify-content:flex-end;min-width:150px;padding:8px 11px;border:1px solid rgba(85,213,208,.2);border-radius:11px;background:rgba(85,213,208,.07);color:#efffff;font-size:17px}.gi-dist p .gi-idr-value{color:#efffff;font-size:16px}@media(max-width:560px){.gi-win-list article>.gi-idr-value{min-width:0;justify-content:flex-start}.gi-win-list article{grid-template-columns:1fr}.gi-win-list span{grid-column:auto}}

/* V4.31.0 — Source Data responsive demo wrapper */
.gi-demo-player{margin:24px 0;padding:0;border:1px solid rgba(148,163,184,.2);border-radius:22px;overflow:hidden;background:linear-gradient(145deg,rgba(15,23,42,.98),rgba(17,24,39,.94));box-shadow:0 18px 55px rgba(0,0,0,.24)}
.gi-demo-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px}.gi-demo-head span{font-size:12px;font-weight:800;letter-spacing:.12em}.gi-demo-head h2{margin:4px 0 6px;font-size:clamp(22px,3vw,34px)}.gi-demo-head p{margin:0;opacity:.72}.gi-demo-live{white-space:nowrap;padding:8px 12px;border-radius:999px;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.3)}
.gi-demo-frame{position:relative;width:100%;aspect-ratio:16/9;min-height:420px;background:#05070b}.gi-demo-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#05070b}
@media(max-width:720px){.gi-demo-head{align-items:flex-start;padding:16px;flex-direction:column}.gi-demo-frame{aspect-ratio:auto;min-height:520px;height:68vh;max-height:720px}}


/* V4.32.0 — editorial public demo copy + clean player chrome */
html{scroll-behavior:smooth}.gi-demo-copy{min-width:0;max-width:850px}.gi-demo-copy p{max-width:820px;line-height:1.65;color:var(--gi-muted)}.gi-demo-readmore{display:inline-flex;align-items:center;gap:7px;margin-top:13px;padding:9px 12px;border:1px solid rgba(85,213,208,.25);border-radius:11px;color:#bffbf7;text-decoration:none;font-size:11px;font-weight:900;letter-spacing:.08em;background:rgba(85,213,208,.07);transition:transform .18s ease,background .18s ease}.gi-demo-readmore:hover{transform:translateY(-1px);background:rgba(85,213,208,.12)}.gi-demo-meta{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 18px;border-top:1px solid rgba(148,163,184,.13);border-bottom:1px solid rgba(148,163,184,.13);background:rgba(5,10,20,.28)}.gi-demo-meta>div{display:grid;gap:4px;min-width:0}.gi-demo-meta strong{font-size:14px;color:#f4fbff}.gi-demo-meta small{display:block;max-width:880px;color:#89a6b6;font-size:12px;line-height:1.5}.gi-demo-live{color:#d7ffe4}.gi-editorial{scroll-margin-top:92px}@media(max-width:720px){.gi-demo-copy p{font-size:14px}.gi-demo-meta{padding:12px 15px}.gi-demo-live{align-self:flex-start}.gi-editorial{scroll-margin-top:76px}}


/* V4.33.0 — click-to-play full-frame featured image cover. */
.gi-demo-frame{overflow:hidden;isolation:isolate}
.gi-demo-cover{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;background:#05070b;z-index:2}
.gi-demo-cover>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.002);transition:transform .55s ease,filter .35s ease}
.gi-demo-cover-fallback{position:absolute;inset:0;display:grid;place-items:center;padding:24px;text-align:center;background:radial-gradient(circle at 50% 38%,rgba(85,213,208,.13),transparent 34%),linear-gradient(145deg,#101b2e,#05070b)}
.gi-demo-cover-fallback strong{font-size:clamp(28px,4vw,56px);color:#f4fbff;letter-spacing:-.03em}
.gi-demo-cover-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(2,6,15,.12),rgba(2,6,15,.28) 45%,rgba(2,6,15,.58));z-index:1}
.gi-demo-effect-soft .gi-demo-cover-shade{background:rgba(2,6,15,.34)}
.gi-demo-effect-none .gi-demo-cover-shade{background:transparent}
.gi-demo-play{position:relative;z-index:3;display:flex;align-items:center;gap:14px;min-width:196px;padding:13px 20px 13px 13px;border:1px solid rgba(255,255,255,.34);border-radius:999px;color:#fff;background:rgba(8,17,31,.72);box-shadow:0 18px 55px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.13);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);cursor:pointer;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
.gi-demo-play:hover{transform:translateY(-2px) scale(1.015);background:rgba(10,26,43,.86);box-shadow:0 24px 65px rgba(0,0,0,.42),0 0 0 6px rgba(85,213,208,.08)}
.gi-demo-play:focus-visible{outline:3px solid rgba(85,213,208,.58);outline-offset:4px}
.gi-demo-play-icon{display:grid;place-items:center;width:52px;height:52px;flex:0 0 52px;border-radius:50%;padding-left:3px;background:linear-gradient(145deg,#7cf4e9,#32c7ce);color:#06202a;font-size:19px;box-shadow:0 8px 24px rgba(50,199,206,.28);animation:giDemoPulse 2.2s ease-in-out infinite}
.gi-demo-play-text{display:grid;gap:1px;text-align:left}.gi-demo-play-text b{font-size:13px;letter-spacing:.08em}.gi-demo-play-text small{font-size:11px;color:#cbd7e3}
.gi-demo-loading{position:relative;z-index:4;display:flex;align-items:center;gap:10px;padding:11px 15px;border-radius:999px;color:#f4fbff;background:rgba(5,10,20,.8);backdrop-filter:blur(10px);font-size:12px}.gi-demo-loading[hidden]{display:none}.gi-demo-loading span{width:18px;height:18px;border:2px solid rgba(255,255,255,.25);border-top-color:#7cf4e9;border-radius:50%;animation:giDemoSpin .8s linear infinite}
.gi-demo-frame.is-loading .gi-demo-cover>img{transform:scale(1.035);filter:brightness(.62) blur(1px)}
.gi-demo-frame.is-started .gi-demo-cover{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease,visibility 0s linear .35s}
.gi-demo-frame iframe{z-index:1}
@keyframes giDemoPulse{0%,100%{box-shadow:0 8px 24px rgba(50,199,206,.28),0 0 0 0 rgba(124,244,233,.22)}50%{box-shadow:0 8px 24px rgba(50,199,206,.32),0 0 0 10px rgba(124,244,233,0)}}
@keyframes giDemoSpin{to{transform:rotate(360deg)}}
@media(max-width:720px){.gi-demo-play{min-width:174px;padding:11px 17px 11px 11px}.gi-demo-play-icon{width:46px;height:46px;flex-basis:46px}.gi-demo-cover>img{object-position:center}.gi-demo-frame{min-height:520px;height:68vh;max-height:720px}}
@media(prefers-reduced-motion:reduce){.gi-demo-play,.gi-demo-play-icon,.gi-demo-cover>img,.gi-demo-cover{transition:none;animation:none}}


/* V4.33.1 — modern aurora frame effect; Featured Image remains unblurred. */
.gi-demo-effect-gradient .gi-demo-cover::before{content:"";position:absolute;inset:-12%;z-index:2;pointer-events:none;opacity:.78;background:radial-gradient(circle at 18% 28%,rgba(56,189,248,.32) 0,rgba(56,189,248,.12) 18%,transparent 38%),radial-gradient(circle at 82% 32%,rgba(168,85,247,.28) 0,rgba(168,85,247,.10) 20%,transparent 40%),radial-gradient(circle at 54% 82%,rgba(45,212,191,.27) 0,rgba(45,212,191,.09) 22%,transparent 42%);filter:blur(34px);transform:scale(1.04);animation:giDemoAurora 8s ease-in-out infinite alternate}
.gi-demo-effect-gradient .gi-demo-cover::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border:1px solid rgba(125,211,252,.14);box-shadow:inset 0 0 46px rgba(56,189,248,.07),inset 0 -26px 70px rgba(139,92,246,.06)}
.gi-demo-effect-gradient .gi-demo-cover-shade{z-index:1;background:linear-gradient(180deg,rgba(2,6,15,.06),rgba(2,6,15,.13) 46%,rgba(2,6,15,.34))}
.gi-demo-effect-gradient .gi-demo-cover>img{filter:none!important}
.gi-demo-effect-gradient .gi-demo-play{box-shadow:0 20px 58px rgba(0,0,0,.42),0 0 0 1px rgba(125,211,252,.10),0 0 34px rgba(45,212,191,.14),inset 0 1px 0 rgba(255,255,255,.14)}
.gi-demo-effect-gradient .gi-demo-play:hover{box-shadow:0 24px 68px rgba(0,0,0,.46),0 0 0 6px rgba(85,213,208,.08),0 0 46px rgba(56,189,248,.18)}
.gi-demo-effect-gradient.is-loading .gi-demo-cover>img{filter:none!important}
.gi-demo-effect-gradient.is-loading .gi-demo-cover::before{opacity:.95;transform:scale(1.10)}
@keyframes giDemoAurora{0%{transform:translate3d(-1.5%,-1%,0) scale(1.03);opacity:.66}50%{transform:translate3d(1.5%,1%,0) scale(1.07);opacity:.82}100%{transform:translate3d(-.5%,1.5%,0) scale(1.05);opacity:.72}}
@media(prefers-reduced-motion:reduce){.gi-demo-effect-gradient .gi-demo-cover::before{animation:none}}


/* V4.33.2 — darker template-matched public demo cover; Featured Image remains sharp and Play CTA stays bright. */
.gi-demo-effect-gradient .gi-demo-cover::before{opacity:.58;background:radial-gradient(circle at 18% 26%,rgba(34,211,238,.20) 0,rgba(34,211,238,.07) 18%,transparent 38%),radial-gradient(circle at 82% 30%,rgba(99,102,241,.18) 0,rgba(99,102,241,.06) 20%,transparent 41%),radial-gradient(circle at 54% 84%,rgba(20,184,166,.14) 0,rgba(20,184,166,.05) 22%,transparent 44%);filter:blur(38px)}
.gi-demo-effect-gradient .gi-demo-cover::after{border-color:rgba(85,213,208,.12);box-shadow:inset 0 0 64px rgba(2,6,15,.46),inset 0 -90px 120px rgba(2,6,15,.55),inset 0 1px 0 rgba(255,255,255,.03)}
.gi-demo-effect-gradient .gi-demo-cover-shade{z-index:1;background:linear-gradient(180deg,rgba(3,10,18,.38) 0%,rgba(3,10,18,.50) 42%,rgba(2,7,13,.72) 100%)}
.gi-demo-effect-gradient .gi-demo-cover>img{filter:none!important}
.gi-demo-effect-gradient .gi-demo-play{z-index:4;background:rgba(7,18,28,.88);border-color:rgba(151,246,239,.48);box-shadow:0 20px 64px rgba(0,0,0,.56),0 0 0 1px rgba(85,213,208,.16),0 0 36px rgba(85,213,208,.20),inset 0 1px 0 rgba(255,255,255,.16)}
.gi-demo-effect-gradient .gi-demo-play:hover{background:rgba(9,28,40,.95);border-color:rgba(169,255,249,.68);box-shadow:0 24px 72px rgba(0,0,0,.62),0 0 0 6px rgba(85,213,208,.10),0 0 52px rgba(85,213,208,.30),inset 0 1px 0 rgba(255,255,255,.18)}
.gi-demo-effect-gradient .gi-demo-play-icon{background:linear-gradient(145deg,#8ff9ef,#35cfd2);box-shadow:0 10px 28px rgba(53,207,210,.42),0 0 24px rgba(85,213,208,.25)}
.gi-demo-effect-gradient .gi-demo-play-text b{color:#fff}.gi-demo-effect-gradient .gi-demo-play-text small{color:#d6e8ee}
.gi-demo-effect-gradient.is-loading .gi-demo-cover::before{opacity:.68}

/* V4.33.3 — near-black pre-play cover. Image stays intact; darkness is overlay-only and disappears when playback starts. */
.gi-demo-effect-gradient .gi-demo-cover-shade{z-index:3;background:linear-gradient(180deg,rgba(2,7,13,.82) 0%,rgba(2,7,13,.86) 48%,rgba(1,5,10,.91) 100%)}
.gi-demo-effect-gradient .gi-demo-cover::before{z-index:4;opacity:.22;background:radial-gradient(circle at 50% 48%,rgba(45,212,191,.12) 0,rgba(45,212,191,.035) 22%,transparent 48%);filter:blur(42px)}
.gi-demo-effect-gradient .gi-demo-cover::after{z-index:4;border-color:rgba(85,213,208,.10);box-shadow:inset 0 0 90px rgba(0,0,0,.68),inset 0 -120px 150px rgba(0,0,0,.52)}
.gi-demo-effect-gradient .gi-demo-cover>img{filter:none!important;opacity:1}
.gi-demo-effect-gradient .gi-demo-play{z-index:6;background:rgba(6,18,27,.96);border-color:rgba(151,246,239,.62);box-shadow:0 24px 72px rgba(0,0,0,.72),0 0 0 1px rgba(85,213,208,.20),0 0 42px rgba(85,213,208,.28),inset 0 1px 0 rgba(255,255,255,.18)}
.gi-demo-effect-gradient .gi-demo-loading{z-index:6}
.gi-demo-effect-gradient.is-loading .gi-demo-cover::before{opacity:.28}
/* V4.33.4 — Demo Slot public header color isolation. Keeps shared/global chrome untouched. */
.demo-slot-scope .site-header #mainNav a,
.demo-slot-scope .site-header #mainNav a:link,
.demo-slot-scope .site-header #mainNav a:visited{color:#a7bacb;text-decoration:none}
.demo-slot-scope .site-header #mainNav a:hover,
.demo-slot-scope .site-header #mainNav a:focus-visible{color:#eaf6fb}
.demo-slot-scope .site-header #mainNav a[aria-current="page"],
.demo-slot-scope .site-header #mainNav .current-menu-item>a{color:#eaf6fb}