:root{--drr-bg:#071525;--drr-card:#0c2035;--drr-card2:#112a45;--drr-line:rgba(255,255,255,.11);--drr-text:#edf5ff;--drr-muted:#9eb2c7;--drr-blue:#3ba7ff;--drr-yellow:#ffd84d;--drr-good:#4ade80;--drr-bad:#fb7185}
.drr-path{max-width:1180px;margin:24px auto;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--drr-text);background:linear-gradient(180deg,#071525 0,#081b2f 100%);border-radius:28px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.24)}
.drr-path *{box-sizing:border-box}.drr-path button,.drr-path input{font:inherit}.drr-hero{display:grid;grid-template-columns:1.2fr .8fr;min-height:410px;padding:58px;background:radial-gradient(circle at 78% 20%,rgba(59,167,255,.2),transparent 28%),radial-gradient(circle at 15% 90%,rgba(255,216,77,.12),transparent 25%)}
.drr-kicker,.drr-eyebrow{display:inline-block;text-transform:uppercase;letter-spacing:.13em;font-size:12px;font-weight:800;color:var(--drr-yellow)}.drr-hero h1{font-size:clamp(38px,5vw,68px);line-height:.98;margin:14px 0 18px;max-width:720px}.drr-hero p{max-width:720px;color:#c6d7e8;font-size:18px;line-height:1.7}.drr-hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.drr-btn{border:1px solid var(--drr-line);border-radius:14px;padding:12px 18px;font-weight:800;cursor:pointer}.drr-btn--primary{background:var(--drr-yellow);color:#172033;border-color:transparent}.drr-btn--ghost{background:rgba(255,255,255,.04);color:var(--drr-text)}.drr-statline{display:flex;gap:24px;flex-wrap:wrap;margin-top:28px;color:var(--drr-muted)}.drr-statline strong{color:white;font-size:20px}.drr-hero__visual{position:relative;display:grid;place-items:center;min-height:290px}.drr-slide-disc{width:min(330px,78vw);aspect-ratio:1;border-radius:50%;border:14px solid rgba(255,255,255,.1);background:#edf3ff;box-shadow:0 0 0 2px rgba(59,167,255,.35),0 20px 70px rgba(0,0,0,.35);overflow:hidden}.drr-tissue{width:100%;height:100%;background:radial-gradient(circle at 35% 45%,#753b8f 0 4%,transparent 5%),radial-gradient(circle at 60% 65%,#6a3582 0 5%,transparent 6%),radial-gradient(circle at 60% 35%,#d380bd 0 17%,transparent 18%),radial-gradient(circle at 30% 65%,#e5a1cb 0 20%,transparent 21%),radial-gradient(circle at 55% 55%,#f0bad8 0 45%,#efc4de 46% 100%);filter:saturate(1.2)}.drr-mini-card{position:absolute;right:3%;top:17%;padding:10px 14px;border-radius:12px;background:#102942;border:1px solid var(--drr-line);box-shadow:0 10px 25px rgba(0,0,0,.2);font-weight:800}.drr-mini-card--b{top:auto;bottom:15%;right:auto;left:2%;color:var(--drr-yellow)}
.drr-nav{position:sticky;top:0;z-index:12;display:flex;gap:5px;overflow-x:auto;padding:10px 18px;background:rgba(5,18,31,.94);backdrop-filter:blur(14px);border-top:1px solid var(--drr-line);border-bottom:1px solid var(--drr-line)}.drr-nav button{white-space:nowrap;border:0;border-radius:11px;padding:10px 14px;background:transparent;color:var(--drr-muted);font-weight:750;cursor:pointer}.drr-nav button.is-active{background:rgba(59,167,255,.13);color:white}.drr-panel{display:none;padding:42px}.drr-panel.is-active{display:block}.drr-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}.drr-section-head h2{font-size:clamp(26px,4vw,40px);margin:6px 0 0}.drr-progress-wrap{min-width:230px;color:var(--drr-muted);font-size:13px}.drr-progress-wrap strong{float:right;color:white}.drr-progress{clear:both;height:8px;margin-top:8px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}.drr-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--drr-blue),var(--drr-yellow))}.drr-grid{display:grid;gap:18px}.drr-grid--3{grid-template-columns:repeat(3,1fr)}.drr-feature,.drr-note,.drr-callout,.drr-card,.drr-case,.drr-quiz-card{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));border:1px solid var(--drr-line);border-radius:18px}.drr-feature{padding:24px}.drr-feature span{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:12px;background:rgba(255,216,77,.12);color:var(--drr-yellow);font-weight:900}.drr-feature h3{margin:18px 0 8px}.drr-feature p,.drr-note p,.drr-card p,.drr-case p{color:var(--drr-muted);line-height:1.65}.drr-callout{margin-top:22px;padding:18px 20px;color:#d9e7f5}.drr-callout strong{color:var(--drr-yellow)}
.drr-search{min-width:min(360px,100%);padding:12px 14px;border-radius:13px;border:1px solid var(--drr-line);background:#081a2c;color:white;outline:0}.drr-modules{display:grid;gap:12px}.drr-module{border:1px solid var(--drr-line);border-radius:18px;overflow:hidden;background:rgba(255,255,255,.025)}.drr-module__head{width:100%;display:grid;grid-template-columns:48px 1fr 24px;gap:14px;align-items:center;text-align:left;padding:18px;border:0;background:transparent;color:white;cursor:pointer}.drr-module__icon{font-size:26px}.drr-module__head b{display:block;font-size:18px}.drr-module__head small{display:block;color:var(--drr-muted);margin-top:5px;line-height:1.45}.drr-module__head i{font-style:normal;font-size:24px}.drr-module__body{display:none;padding:0 18px 18px}.drr-module.is-open .drr-module__body{display:block}.drr-module.is-open .drr-module__head i{transform:rotate(45deg)}.drr-note{padding:16px;margin:10px 0}.drr-note h4{margin:0 0 6px}.drr-note p{margin:0}.drr-done{margin-top:10px;border:1px solid rgba(74,222,128,.4);background:rgba(74,222,128,.09);color:#baf7cf;border-radius:12px;padding:10px 13px;cursor:pointer;font-weight:750}.drr-done.is-done{background:rgba(74,222,128,.2)}
.drr-filters{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.drr-filters button{border:1px solid var(--drr-line);background:rgba(255,255,255,.03);color:var(--drr-muted);border-radius:999px;padding:8px 11px;cursor:pointer}.drr-filters button.is-active{background:var(--drr-yellow);color:#152033;border-color:transparent}.drr-atlas{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.drr-card{overflow:hidden;display:flex;flex-direction:column}.drr-card__image{position:relative;aspect-ratio:4/3;overflow:hidden;background:#dbe4ee;cursor:zoom-in}.drr-card__image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}.drr-card:hover .drr-card__image img{transform:scale(1.035)}.drr-card__badge{position:absolute;left:10px;top:10px;padding:7px 9px;border-radius:9px;background:rgba(4,14,25,.86);font-size:11px;font-weight:850}.drr-card__body{padding:18px;display:flex;flex-direction:column;flex:1}.drr-card h3{margin:0 0 5px;font-size:20px}.drr-meta{font-size:12px;color:var(--drr-blue);font-weight:800}.drr-findings{padding:12px 14px;border-radius:12px;background:rgba(59,167,255,.08);border-left:3px solid var(--drr-blue);margin:10px 0;color:#dbeafa;font-size:14px;line-height:1.55}.drr-pearls{margin:8px 0 12px;padding-left:18px;color:var(--drr-muted);font-size:13px;line-height:1.5}.drr-attribution{margin-top:auto;padding-top:10px;border-top:1px solid var(--drr-line);font-size:11px;color:#8ea6bb;line-height:1.55}.drr-attribution a{color:#a7d6ff}.drr-card__open{margin-top:12px;border:0;border-radius:11px;padding:10px 12px;background:rgba(255,216,77,.12);color:#ffe98e;font-weight:800;cursor:pointer}
.drr-challenge-wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}.drr-challenge-img{min-height:430px;border-radius:20px;overflow:hidden;background:#dbe4ee}.drr-challenge-img img{width:100%;height:100%;object-fit:cover;display:block}.drr-challenge-panel{padding:22px;border:1px solid var(--drr-line);border-radius:20px;background:rgba(255,255,255,.035)}.drr-choice{display:block;width:100%;text-align:left;margin:9px 0;border:1px solid var(--drr-line);background:rgba(255,255,255,.03);color:white;border-radius:12px;padding:12px 14px;cursor:pointer}.drr-choice:hover{border-color:rgba(59,167,255,.5)}.drr-choice.is-good{border-color:var(--drr-good);background:rgba(74,222,128,.1)}.drr-choice.is-bad{border-color:var(--drr-bad);background:rgba(251,113,133,.1)}.drr-reveal{margin-top:15px;padding:15px;border-radius:13px;background:rgba(255,216,77,.08);color:#f6e9aa;line-height:1.6}.drr-reveal[hidden]{display:none}
.drr-cases{display:grid;gap:18px}.drr-case{padding:22px}.drr-case h3{margin:0 0 8px}.drr-case-step{margin-top:16px;padding-top:16px;border-top:1px solid var(--drr-line)}.drr-case-step b{display:block;margin-bottom:9px}.drr-case-takeaway{margin-top:16px;padding:13px;border-radius:12px;background:rgba(74,222,128,.08);color:#baf7cf}.drr-quiz-card{max-width:820px;margin:0 auto;padding:28px}.drr-quiz-card h3{font-size:24px;line-height:1.35;margin-top:0}.drr-quiz-nav{display:flex;justify-content:space-between;align-items:center;margin-top:18px}.drr-score{padding:10px 14px;border-radius:12px;background:rgba(255,216,77,.1);color:var(--drr-yellow);font-weight:900}.drr-explain{margin-top:14px;padding:14px;border-radius:12px;background:rgba(59,167,255,.08);color:#cae8ff;line-height:1.55}.drr-license-list{display:grid;gap:10px}.drr-license-row{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:center;padding:12px;border:1px solid var(--drr-line);border-radius:14px}.drr-license-row img{width:64px;height:52px;object-fit:cover;border-radius:9px;background:#dbe4ee}.drr-license-row b{display:block}.drr-license-row small{color:var(--drr-muted);line-height:1.5}.drr-license-row a{color:#a7d6ff}
.drr-modal{display:none;position:fixed;inset:0;z-index:999999}.drr-modal.is-open{display:grid;place-items:center}.drr-modal__backdrop{position:absolute;inset:0;background:rgba(0,8,15,.82);backdrop-filter:blur(8px)}.drr-modal__dialog{position:relative;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(320px,.6fr);width:min(1200px,94vw);height:min(780px,90vh);background:#071525;border:1px solid rgba(255,255,255,.15);border-radius:20px;overflow:hidden;box-shadow:0 30px 100px rgba(0,0,0,.6)}.drr-modal__close{position:absolute;z-index:4;right:12px;top:10px;width:40px;height:40px;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:white;font-size:26px;cursor:pointer}.drr-viewer{display:flex;flex-direction:column;background:#02070c;min-height:0}.drr-viewer__stage{flex:1;display:grid;place-items:center;overflow:hidden;cursor:grab;touch-action:none}.drr-viewer__stage.is-dragging{cursor:grabbing}.drr-viewer__stage img{max-width:90%;max-height:90%;transform-origin:center;will-change:transform;user-select:none;-webkit-user-drag:none}.drr-viewer__tools{display:flex;justify-content:center;align-items:center;gap:8px;padding:10px;background:#06111d;border-top:1px solid var(--drr-line)}.drr-viewer__tools button{border:1px solid var(--drr-line);background:#10243a;color:white;border-radius:9px;padding:7px 11px;cursor:pointer}.drr-viewer__tools span{min-width:58px;text-align:center;color:var(--drr-muted)}.drr-modal__info{overflow:auto;padding:34px 26px}.drr-modal__info h2{margin-top:0;font-size:30px}.drr-modal__info h4{margin-bottom:5px;color:var(--drr-yellow)}.drr-modal__info ul{padding-left:18px;color:var(--drr-muted);line-height:1.65}.drr-modal__info a{color:#a7d6ff}.drr-hidden{display:none!important}
@media(max-width:900px){.drr-hero{grid-template-columns:1fr;padding:34px 24px}.drr-hero__visual{min-height:260px}.drr-panel{padding:28px 20px}.drr-grid--3,.drr-atlas{grid-template-columns:1fr 1fr}.drr-challenge-wrap{grid-template-columns:1fr}.drr-challenge-img{min-height:330px}.drr-modal__dialog{grid-template-columns:1fr;height:94vh;overflow:auto}.drr-viewer{min-height:55vh}.drr-modal__info{overflow:visible}.drr-section-head{align-items:flex-start;flex-direction:column}.drr-filters{justify-content:flex-start}.drr-progress-wrap{width:100%}}
@media(max-width:620px){.drr-path{margin:0;border-radius:0}.drr-hero h1{font-size:42px}.drr-grid--3,.drr-atlas{grid-template-columns:1fr}.drr-nav{padding-left:10px}.drr-panel{padding:24px 14px}.drr-card__image{aspect-ratio:16/10}.drr-module__head{grid-template-columns:40px 1fr 22px;padding:14px}.drr-license-row{grid-template-columns:52px 1fr}.drr-license-row img{width:52px;height:46px}.drr-challenge-img{min-height:260px}.drr-modal__dialog{width:100vw;height:100vh;border-radius:0}.drr-viewer{min-height:50vh}}
/* v1.1 image reliability states */
.drr-card__image.drr-image-loading::after,.drr-challenge-img.drr-image-loading::after,.drr-viewer__stage.drr-image-loading::after{content:'Memuat preparat…';position:absolute;inset:auto 12px 12px 12px;padding:8px 10px;border-radius:10px;background:rgba(4,14,25,.82);color:#dbeafa;font-size:12px;font-weight:800;text-align:center;z-index:2;pointer-events:none}
.drr-card__image.drr-image-failed img,.drr-challenge-img.drr-image-failed img,.drr-viewer__stage.drr-image-failed img,.drr-license-row.drr-image-failed img{object-fit:contain;background:#f5f7fb}
.drr-card__image.drr-image-failed::after,.drr-challenge-img.drr-image-failed::after,.drr-viewer__stage.drr-image-failed::after{content:'Sumber gambar tidak dapat dijangkau. Gunakan tautan sumber pada atribusi.';position:absolute;left:12px;right:12px;bottom:12px;padding:9px 11px;border-radius:10px;background:rgba(4,14,25,.88);color:#ffe98e;font-size:11px;font-weight:800;text-align:center;z-index:3;pointer-events:none}
.drr-challenge-img,.drr-viewer__stage{position:relative}