.tut__extra{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}.tut__extra button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;height:2.5rem;padding:0 1rem;border:1px solid rgb(232 238 245 / .16);border-radius:999px;background:#e8eef50f;color:var(--kertas);font:600 .85rem var(--sans);cursor:pointer;transition:background-color .2s,border-color .2s}.tut__extra button:hover{border-color:#e8eef559;background:#e8eef51f}.tut__extra button[hidden]{display:none}.tut__extra [data-act=repeat],.tut__extra [data-act=full]{width:2.5rem;padding:0}.tut__extra [aria-pressed=true]{border-color:#e8eef5bf;background:#e8eef538;color:#fff}.tut__extra svg{width:1.05rem;height:1.05rem;flex-shrink:0}.tut__steps button.is-tap{animation:tut-tap .55s ease-out}@keyframes tut-tap{0%{transform:scale(1);box-shadow:0 0 #e8eef559}30%{transform:scale(.97)}to{transform:scale(1);box-shadow:0 0 0 10px #e8eef500}}html.theater-open{overflow:hidden}.theater{position:fixed;z-index:1000;top:0;right:0;bottom:0;left:0;display:grid;grid-template-rows:auto minmax(0,1fr);background:radial-gradient(120% 80% at 50% 0%,#0d2348 0%,var(--malam-dalam, #040e21) 62%);color:var(--kertas, #e8eef5)}.theater[hidden]{display:none}.theater::backdrop{background:#040e21}.theater__bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem clamp(.75rem,3vw,2rem);border-bottom:1px solid rgb(232 238 245 / .08)}.theater__info{display:grid;gap:.1rem;min-width:0;margin:0;font-family:var(--sans)}.theater__count{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#e8eef599}.theater__title{overflow:hidden;font-size:clamp(.95rem,1vw + .7rem,1.2rem);white-space:nowrap;text-overflow:ellipsis}.theater__nav,.theater__card-actions{display:flex;flex-shrink:0;gap:.4rem}.theater__nav button,.theater__card-actions button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-width:2.6rem;height:2.6rem;padding:0 .8rem;border:0;border-radius:999px;background:#e8eef51a;color:inherit;font:600 .9rem var(--sans);cursor:pointer}.theater__nav button:hover,.theater__card-actions button:hover{background:#e8eef533}.theater__nav button:disabled{opacity:.35;cursor:default}.theater__nav svg,.theater__card-actions svg{width:1.1rem;height:1.1rem}.theater__body{position:relative;min-height:0;overflow:auto}.theater__card{position:absolute;z-index:5;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;justify-items:center;gap:.6rem;padding:2rem;text-align:center;background:#040e21e0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}.theater__card.is-on{opacity:1;visibility:visible}.theater__card-count{font:700 .8rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#e8eef599}.theater__card-title{max-width:22ch;font-family:var(--serif);font-size:clamp(1.5rem,3vw + 1rem,2.6rem);line-height:1.15}.theater__card.is-on .theater__card-title{animation:theater-rise .6s ease-out both}.theater__card-actions{margin-top:1rem}.theater__card-actions[hidden]{display:none}@keyframes theater-rise{0%{opacity:0;transform:translateY(12px)}}.theater .tut{height:100%;padding:clamp(.75rem,2vh,1.5rem) 0;border:0}.theater .tut .wrap{height:100%}.theater .tut__head,.theater .tut__note,.theater .tut__switch{display:none}.theater .tut__grid{height:100%;grid-template-columns:auto minmax(0,30rem);grid-template-rows:minmax(0,1fr);justify-content:center;align-items:center}.theater .tut__stage{position:static;width:min(26rem,100%);justify-items:center;gap:.75rem}.theater .tut__stage .phone-wrap{width:min(100%,max(11rem,calc((100vh - 18rem)/2)));width:min(100%,max(11rem,calc((100dvh - 18rem)/2)));max-width:none}.theater .tut__caption{min-height:2.6em;margin:0}.theater .tut__controls{position:static;width:100%;max-width:26rem}.theater .tut__grid>:last-child{position:relative;max-height:100%;overflow-y:auto;overscroll-behavior:contain;padding:.25rem .5rem .25rem 0;scrollbar-width:thin;scrollbar-color:rgb(232 238 245 / .25) transparent}@media (max-width: 52rem){.theater .tut__grid{grid-template-columns:minmax(0,1fr);justify-items:center}.theater .tut__grid>:last-child{display:none}}@media (prefers-reduced-motion: reduce){.tut__steps button.is-tap,.theater__card.is-on .theater__card-title{animation:none}}