.b-shell{background:linear-gradient(#efebff 0,#fffbf3 360px);min-height:100dvh;font-size:17px}.b-top{z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);background:#ffffffeb;justify-content:space-between;align-items:center;gap:12px;padding:10px 20px;display:flex;position:sticky;top:0}.b-me{align-items:center;gap:14px;display:flex}.b-me__who{align-items:center;gap:8px;font-weight:800;text-decoration:none;display:flex}@media (max-width:560px){.b-me{gap:12px}.b-me__txt,.b-me__who span{display:none}}.b-me__who i{background:var(--yellow);border-radius:50%;place-items:center;width:40px;height:40px;font-size:1.3rem;font-style:normal;display:grid}.b-link{color:var(--purple);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;font-weight:800;text-decoration:none}.b-main{gap:18px;width:min(1100px,100%);margin:0 auto;padding:22px 18px 60px;display:grid}.b-btn{cursor:pointer;background:var(--purple);color:var(--white);font:inherit;box-shadow:0 6px 0 var(--purple-dark);border:0;border-radius:999px;justify-content:center;align-items:center;gap:.4em;padding:.75em 1.5em;font-weight:800;text-decoration:none;transition:transform .12s,box-shadow .12s;display:inline-flex}.b-btn:hover{transform:translateY(-2px)}.b-btn:active{box-shadow:0 2px 0 var(--purple-dark);transform:translateY(3px)}.b-btn:disabled{opacity:.6}.b-btn--big{padding:.9em 1.8em;font-size:1.1rem}.b-btn--ghost{background:var(--white);color:var(--purple);border:2px solid #dcd9ee;box-shadow:0 4px #dcd9ee}.b-actions{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.b-done{color:#0f766e;font-weight:800}.b-input{font-size:1.15rem}.b-kodi{mix-blend-mode:multiply}.b-card{background:var(--white);border-radius:26px;padding:22px;box-shadow:0 8px 26px #1e1b4b12}.b-card h2{margin:0;font-size:1.3rem}.b-hello{justify-content:space-between;align-items:center;gap:12px;display:flex}.b-hello h1{margin:0;font-size:clamp(1.7rem,4vw,2.4rem)}.b-hello p{margin:4px 0 0}.b-hello .b-kodi{animation:3s ease-in-out infinite kodi-bob}@keyframes kodi-bob{50%{translate:0 -8px}}.mission{background:linear-gradient(135deg,#fff 0%,#f7f5ff 100%);border:3px solid #e4dfff;gap:18px;display:grid}.mission__head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.mission__head small{color:var(--purple);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;font-weight:800}.mission__count{background:var(--yellow);border-radius:999px;padding:.3em .9em;font-size:.9rem;font-weight:800}.mission>.b-btn{justify-self:start}.path{grid-template-columns:repeat(5,1fr);gap:10px;margin:0;padding:0;list-style:none;display:grid;position:relative}.path a{text-align:center;color:var(--muted);background:#f4f3f9;border-radius:18px;justify-items:center;gap:6px;padding:12px 6px;font-size:.88rem;font-weight:800;text-decoration:none;display:grid}.path__icon{background:var(--white);border-radius:50%;place-items:center;width:48px;height:48px;font-size:1.4rem;display:grid;box-shadow:0 3px #e2e0ec}.path li.is-done a{color:#0f766e;background:#e3f8f5}.path li.is-done .path__icon{background:var(--mint);color:var(--white);box-shadow:0 3px #1f9c90}.path li.is-now a{color:var(--purple);outline:3px solid var(--purple);background:#efebff}.path li.is-now .path__icon{animation:1.6s ease-in-out infinite kodi-bob}.map{grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px;display:grid}.map__isle{text-align:center;color:var(--muted);background:#f4f3f9;border-radius:22px;justify-items:center;gap:2px;padding:16px 8px;text-decoration:none;display:grid}.map__isle b{color:var(--navy)}.map__isle small{font-size:.82rem}.map__isle em{color:var(--purple);margin-top:4px;font-size:.75rem;font-style:normal;font-weight:800}.map__no{background:var(--white);width:52px;height:52px;font-family:var(--font-head);border-radius:50%;place-items:center;margin-bottom:6px;font-size:1.4rem;font-weight:700;display:grid}.map__isle.is-done{background:linear-gradient(160deg,#fff5da,#ffe7a3)}.map__isle.is-open{outline:3px solid var(--purple);background:linear-gradient(160deg,#efebff,#dcd5ff)}.map__isle.is-open .map__no{background:var(--purple);color:var(--white)}.map__isle.is-locked,.map__isle.is-soon,.map__isle.is-paywall{opacity:.7}.paywall{background:#fff8e1;border:2px solid #ffe08a;align-items:flex-start;gap:14px;display:flex}.paywall>span{font-size:2rem}.paywall p{margin:4px 0 0}a.map__isle:hover{transition:transform .15s;transform:translateY(-3px)}.cert-teaser{align-items:center;gap:16px;display:flex}.cert-teaser>span{font-size:2.4rem}.cert-teaser div{flex:1}.cert-teaser p{margin:2px 0 0}.lesson{grid-template-columns:220px 1fr;align-items:start;gap:20px;display:grid}.lesson__side{background:var(--white);border-radius:22px;gap:4px;padding:18px;display:grid;position:sticky;top:80px;box-shadow:0 8px 26px #1e1b4b0f}.lesson__side>b{font-family:var(--font-head);margin-top:10px;font-size:1.15rem}.lesson__side>small{color:var(--muted);margin-bottom:8px}.side-steps{gap:6px;margin:0;padding:0;list-style:none;display:grid}.side-steps a{color:var(--muted);border-radius:14px;align-items:center;gap:10px;padding:8px 10px;font-size:.92rem;font-weight:800;text-decoration:none;display:flex}.side-steps span{background:#f4f3f9;border-radius:50%;place-items:center;width:30px;height:30px;display:grid}.side-steps .is-done span{background:var(--mint);color:var(--white)}.side-steps .is-now a{color:var(--purple);background:#efebff}.lesson__main{gap:18px;min-width:0;display:grid}.lesson__head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.lesson__head small{color:var(--purple);font-weight:800}.lesson__head h1{margin:4px 0 0;font-size:clamp(1.5rem,3.4vw,2.1rem)}.lesson__video{aspect-ratio:16/9;background:var(--navy);border-radius:22px;overflow:hidden}.lesson__video iframe{border:0;width:100%;height:100%}.b-protect{background-color:var(--white);-webkit-user-select:none;user-select:none;background-repeat:repeat;border-radius:26px;padding:26px 28px;box-shadow:0 8px 26px #1e1b4b0f}.k-body{gap:12px;font-size:1.08rem;line-height:1.7;display:grid}.k-body p,.k-body li{color:var(--navy)}.k-body p{margin:0}.k-body h3{color:var(--purple);margin:10px 0 0;font-size:1.3rem}.k-body ul,.k-body ol{gap:6px;margin:0;padding-left:1.3em;display:grid}.k-tip{border:2px dashed var(--yellow);background:#fff5da;border-radius:16px;padding:14px 16px;font-weight:700}.k-fig{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;margin:4px 0;display:flex}.k-fig img{-webkit-user-select:none;user-select:none;-webkit-user-drag:none;border-radius:22px;max-width:min(100%,520px);height:auto;box-shadow:0 8px 26px #1e1b4b14}.k-fig--row img{object-fit:contain;flex:240px;min-width:0;max-width:calc(50% - 7px)}.k-fig--small{justify-content:flex-start}.k-fig--small img{max-width:150px;box-shadow:none;border-radius:18px}@media (max-width:560px){.k-fig--row img{max-width:100%}}.k-pilih{background:#f3f1ff;border-radius:22px;gap:12px;padding:18px;display:grid}.k-pilih__soal{font-size:1.15rem}.k-pilih__opsi{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;display:grid}.k-pilih__kartu{background:var(--white);min-width:0;font:inherit;color:var(--navy);cursor:pointer;border:3px solid #e4e1f5;border-radius:20px;grid-template-columns:minmax(0,1fr);justify-items:center;gap:8px;padding:12px;font-weight:800;transition:transform .15s,border-color .15s;display:grid}.k-pilih__kartu:hover{border-color:var(--purple);transform:translateY(-3px)}.k-pilih__kartu img{aspect-ratio:220/128;object-fit:contain;background:var(--white);border-radius:12px;width:100%;max-width:220px}.k-pilih__kartu span{background:#f3f1ff;border-radius:999px;max-width:100%;padding:4px 16px}.k-pilih__kartu.is-benar{background:#e7faf1;border-color:#22b573}.k-pilih__kartu.is-salah{background:#fff0f0;border-color:#f26b6b;animation:.35s k-geleng}@keyframes k-geleng{25%{translate:-5px}75%{translate:5px}}.k-pilih__hasil{background:#fff0f0;border-radius:14px;margin:0;padding:10px 14px;font-weight:700}.k-pilih__hasil.is-benar{color:#0f766e;background:#e7faf1}@media (max-width:560px){.k-pilih__opsi{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.k-pilih__kartu{border-width:2px;padding:8px 6px;font-size:.8rem}.k-pilih__kartu span{background:0 0;padding:0}.k-pilih__kartu img{border-radius:8px}}.sb{border:1px solid var(--line);background:#f9f9fb;border-radius:18px;justify-items:start;gap:2px;padding:16px;display:grid;overflow-x:auto}.sb__block{min-width:120px;color:var(--white);white-space:nowrap;border-radius:6px;padding:8px 14px;font-size:.95rem;font-weight:800;position:relative;box-shadow:inset 0 -3px #00000026}.sb__block--hat{border-radius:18px 18px 6px 6px;padding-top:12px}.sb__block--in{margin-left:22px}.sb__block--end{border-radius:0 0 8px 8px;min-width:60px;height:14px;padding:0}.quiz{background:var(--white);border-radius:26px;gap:16px;padding:24px;display:grid;box-shadow:0 8px 26px #1e1b4b0f}.quiz__bar{background:#f0eef8;border-radius:999px;height:14px;overflow:hidden}.quiz__bar span{border-radius:inherit;background:linear-gradient(90deg, var(--mint), var(--purple));height:100%;transition:width .4s;display:block}.quiz__count{margin:0;font-weight:800}.quiz__count em{background:var(--yellow);color:var(--navy);border-radius:999px;margin-left:8px;padding:.15em .7em;font-size:.82rem;font-style:normal}.quiz__q{margin:0;font-size:clamp(1.3rem,3vw,1.7rem)}.quiz__opts{grid-template-columns:1fr 1fr;gap:12px;display:grid}.quiz__opt{cursor:pointer;font:inherit;color:var(--white);border:0;border-radius:20px;padding:18px 16px;font-size:1.1rem;font-weight:800;transition:transform .12s,opacity .2s;box-shadow:0 6px #00000026}.quiz__opt--0{background:var(--purple)}.quiz__opt--1{background:#f2a900}.quiz__opt--2{background:#1fae9f}.quiz__opt--3{background:var(--coral)}.quiz__opt:not(:disabled):hover{transform:translateY(-3px)}.quiz__opt.is-right{outline:5px solid #0f766e}.quiz__opt.is-wrong{outline:5px solid #b42318}.quiz__opt.is-dim{opacity:.35}.quiz__fb{border-radius:20px;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:16px;display:grid}.quiz__fb.is-right{background:#e3f8f5}.quiz__fb.is-wrong{background:#fff1e6}.quiz__fb img{mix-blend-mode:multiply}.quiz__fb p{color:var(--navy);margin:4px 0 0}.quiz-start{text-align:center;background:var(--white);border-radius:26px;justify-items:center;gap:12px;padding:30px 20px;display:grid;box-shadow:0 8px 26px #1e1b4b0f}.quiz-score{font-family:var(--font-head);color:var(--purple);font-size:4rem;font-weight:700;line-height:1}.quiz-score small{color:var(--muted);font-size:1.8rem}.task__check{border:0;gap:10px;margin:0 0 4px;padding:0;display:grid}.task__check legend{margin-bottom:8px;font-weight:800}.task__check label{cursor:pointer;background:#f7f6fc;border-radius:16px;align-items:center;gap:12px;padding:12px 14px;font-weight:700;display:flex}.task__check input{width:24px;height:24px;accent-color:var(--mint)}.b-celebrate{background:#fff5da;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;font-size:1.2rem;font-weight:800;display:flex}.studio-cta{border:3px dashed #dcd5ff;flex-wrap:wrap;align-items:center;gap:14px;display:flex}.studio-cta>span{font-size:2rem}.studio-cta div{flex:1;min-width:200px}.studio-cta small{color:var(--muted);display:block}.studio-new__form{flex-wrap:wrap;gap:12px;display:flex}.studio-new__form input{flex:1;min-width:220px}.studio-list{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;display:grid}.studio-card{background:var(--white);border-radius:22px;gap:4px;padding:18px;text-decoration:none;transition:transform .15s;display:grid;box-shadow:0 8px 26px #1e1b4b12}.studio-card:hover{transform:translateY(-3px)}.studio-card__icon{font-size:2rem}.studio-card small{color:var(--muted)}.studio-card__badge{color:#8a6100;background:#fff1c2;border-radius:999px;justify-self:start;margin-top:4px;padding:2px 10px;font-size:.78rem;font-weight:800}.karya-list{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));align-items:start;gap:16px;display:grid}.karya-card{background:var(--white);border-radius:22px;overflow:hidden;box-shadow:0 8px 26px #1e1b4b12}.karya-card>img{aspect-ratio:4/3;object-fit:cover;background:var(--tint,#f3f1ff);width:100%;display:block}.karya-card__body{gap:4px;padding:14px 16px 16px;display:grid}.karya-card__body b{font-size:1.05rem}.karya-card__body p{margin:0}.karya-card__body small{color:var(--muted)}.karya-card__tools{justify-content:space-between;align-items:center;gap:10px;margin-top:6px;display:flex}.karya-player__open{background:var(--purple);color:var(--white);font:inherit;cursor:pointer;border:0;border-radius:999px;justify-self:start;margin-top:6px;padding:.45em 1.2em;font-weight:800}.studio{z-index:30;background:var(--white);flex-direction:column;display:flex;position:fixed;inset:0}.studio__bar{border-bottom:1px solid var(--line);background:#faf9fe;flex-wrap:wrap;align-items:center;gap:10px;padding:4px 12px;display:flex}.studio__title input{font:inherit;color:var(--navy);background:0 0;border:1.5px solid #0000;border-radius:10px;min-width:240px;padding:6px 10px;font-size:1rem;font-weight:800}.studio__title input:hover,.studio__title input:focus{background:var(--white);border-color:#dcd9ee;outline:none}.studio__status{color:var(--muted);font-size:.85rem;font-weight:800}.studio__status.is-saved{color:#0f766e}.studio__status.is-dirty{color:#8a6100}.studio__status.is-error{color:#b42318}.studio__actions{align-items:center;gap:10px;margin-left:auto;display:flex}.studio__actions .b-btn{padding:.35em 1em;font-size:.88rem}.studio__del{font-size:1.2rem}.b-btn--star{color:var(--navy);background:#ffc83d;box-shadow:0 4px #d99a00}.studio__publish{background:#fff8e1;border-bottom:1px solid #f3dc9a;grid-template-columns:minmax(220px,1.2fr) minmax(200px,1fr) minmax(220px,1.4fr) auto;align-items:center;gap:10px;padding:10px 14px;display:grid}.studio__publish p{gap:2px;margin:0;display:grid}.studio__publish small{color:var(--muted);font-size:.8rem}.studio__publish textarea{resize:vertical;min-height:0}.studio__publish-actions{align-items:center;gap:12px;display:flex}.studio__publish .b-btn{padding:.4em 1.1em;font-size:.9rem}@media (max-width:900px){.studio__publish{grid-template-columns:1fr}}.studio__msg{background:#fff1e6;padding:8px 14px;font-weight:700}.studio__msg.is-ok{color:#0f766e;background:#e3f8f5}.studio__msg a{color:var(--purple)}.studio__main{flex:1;min-height:0;display:flex}.studio__frame{border:0;flex:1;min-width:0}.studio__guide{border-right:1px solid var(--line);background:#fbfaff;flex:none;width:clamp(260px,24vw,380px);padding:14px 16px 24px;overflow-y:auto}.studio__guide h2{margin:6px 0 10px;font-size:1.15rem}.studio__guide .b-protect{box-shadow:none;border:1px solid var(--line);border-radius:18px;padding:14px}.studio__guide .k-body{gap:10px;font-size:.95rem;line-height:1.6}.studio__guide .k-body h3{font-size:1.05rem}.studio__guide .sb{padding:10px}.studio__guide .sb__block{font-size:.82rem}.studio__guide-tabs{background:#eeebff;border-radius:999px;gap:6px;padding:4px;display:flex}.studio__guide-tabs button{font:inherit;color:var(--navy);cursor:pointer;background:0 0;border:0;border-radius:999px;flex:1;padding:.4em .6em;font-size:.88rem;font-weight:800}.studio__guide-tabs button.is-on{background:var(--white);color:var(--purple);box-shadow:0 2px 8px #1e1b4b1a}.studio__guide-toggle{background:var(--white);font:inherit;color:var(--purple);cursor:pointer;border:2px solid #dcd9ee;border-radius:999px;padding:.35em .9em;font-size:.85rem;font-weight:800}.studio__guide-toggle.is-on{background:#eeebff;border-color:#eeebff}.b-login{text-align:center;justify-items:center;gap:8px;width:min(440px,100%);margin:10px auto;display:grid}.b-login h1{margin:0;font-size:2.2rem}.b-login__form{background:var(--white);text-align:left;border-radius:28px;gap:16px;width:100%;padding:24px;display:grid;box-shadow:0 12px 40px #5b4bff24}.b-login__help{font-size:.9rem}.b-login__help a{color:var(--purple);font-weight:800}.pin{justify-items:center;gap:14px;display:grid}.pin__dots{gap:12px;display:flex}.pin__dots span{background:#e5e2f2;border-radius:50%;width:20px;height:20px;transition:background .15s,transform .15s}.pin__dots span.is-on{background:var(--purple);transform:scale(1.15)}.pin__keys{grid-template-columns:repeat(3,72px);gap:10px;display:grid}.pin__keys button{height:64px;color:var(--white);font-family:var(--font-head);cursor:pointer;border:0;border-radius:20px;font-size:1.6rem;font-weight:700;box-shadow:0 5px #00000026}.pin__keys button:active{transform:translateY(3px);box-shadow:0 2px #00000026}.pin__keys .pin__del{color:var(--navy);background:#edebf5;font-size:1.3rem}.cert-locked{text-align:center;justify-items:center;gap:10px;padding:36px 20px;display:grid}.cert-locked>span{font-size:3.4rem}.cert-locked h1{margin:0}.cert-progress{background:#f0eef8;border-radius:999px;width:min(360px,100%);height:16px;overflow:hidden}.cert-progress span{background:linear-gradient(90deg, var(--yellow), var(--coral));height:100%;display:block}.cert{background:conic-gradient(from 0deg, var(--purple), var(--yellow), var(--mint), var(--coral), var(--purple));border-radius:22px;padding:14px}.cert__inner{background:var(--white);text-align:center;border-radius:14px;justify-items:center;gap:6px;padding:42px 30px;display:grid;position:relative}.cert__inner small{font-family:var(--font-head);color:var(--purple);font-size:1.6rem;font-weight:700}.cert__inner h1{border-bottom:3px dashed var(--yellow);margin:6px 0;padding-bottom:6px;font-size:clamp(2rem,5vw,3rem)}.cert__inner h2{color:var(--purple);margin:0}.cert__inner p{margin:0}.cert__kodi{position:absolute;bottom:18px;right:24px}@media (max-width:860px){.lesson{grid-template-columns:1fr}.lesson__side{position:static}.side-steps{grid-auto-flow:column;overflow-x:auto}.map{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.path{grid-template-columns:repeat(5,minmax(56px,1fr));overflow-x:auto}.path a span:last-child{font-size:.72rem}.quiz__opts,.quiz__fb{grid-template-columns:1fr}.b-protect{padding:18px}}@media print{.b-top,.b-actions{display:none}.b-shell{background:0 0}}