.tg{--tg-hijau:#22C55E;--tg-oranye:#FB923C;--tg-teks-ak:color-mix(in srgb,var(--ak) 55%,var(--fg));max-width:680px;margin-inline:auto}.tg-tab{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:14px;background:var(--bg2);border:1px solid var(--line)}.tg-tab button{font:inherit;font-weight:800;font-size:15.5px;border:0;border-radius:10px;padding:11px 6px;background:transparent;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px}.tg-tab .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.tg-tab button[aria-selected=true]{background:var(--kartu);color:var(--fg);box-shadow:0 2px 8px #0b25451f;outline:2px solid color-mix(in srgb,var(--ak) 45%,transparent)}.tg-tab button[aria-selected=true] .ic{color:var(--ak)}.tg-panel{margin-top:16px}.tg-panel[hidden]{display:none}.tg-pilih select{font-size:16px;font-weight:700}.tg-layar{position:relative;margin-top:14px;border-radius:22px;padding:14px 14px 16px;text-align:center;color:#eaf1f8;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,color-mix(in srgb,var(--ak) 38%,transparent),transparent 70%),linear-gradient(170deg,#0e2a47,#071a33);box-shadow:inset 0 1px #ffffff14,0 14px 30px -18px #071a33b3;transition:box-shadow .3s}:root[data-theme=dark] .tg-layar{border:1px solid #22334A}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .tg-layar{border:1px solid #22334A}}.tg-layar:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 3px var(--tg-hijau),inset 0 0 60px #22c55e59;opacity:0;transition:opacity .25s}.tg-layar[data-keadaan=pas]:after{opacity:1}.tg-meter{display:block;width:100%;max-width:380px;margin:0 auto;overflow:visible}.tg-busur{fill:none;stroke:#ffffff1f;stroke-width:12;stroke-linecap:round}.tg-busur-pas{fill:none;stroke:var(--tg-hijau);stroke-width:12;opacity:.85}.tg-g{stroke:#ffffff59;stroke-width:2;stroke-linecap:round}.tg-g-besar{stroke:#ffffffbf;stroke-width:2.6}.tg-lbl{fill:#eaf1f8b3;font:600 12.5px var(--mono)}.tg-lbl-0{fill:var(--tg-hijau);font-weight:700}.tg-ujung{fill:#eaf1f88c;font:700 11.5px var(--sans);letter-spacing:.04em;text-transform:uppercase}.tg-jarum path{fill:var(--tg-oranye);transition:fill .2s}.tg-jarum circle{fill:#eaf1f8;stroke:#0b2545;stroke-width:3}.tg-layar[data-keadaan=pas] .tg-jarum path{fill:var(--tg-hijau)}.tg-layar[data-keadaan=diam] .tg-jarum path,.tg-layar[data-keadaan=dengar] .tg-jarum path{fill:#eaf1f859}.tg-nada{margin-top:-6px;line-height:1;display:flex;justify-content:center;align-items:flex-start;gap:2px;min-height:84px;font-variant-numeric:tabular-nums}.tg-nada b{font-size:84px;font-weight:800;letter-spacing:-.04em;transition:color .2s,opacity .3s}.tg-nada span{font-size:26px;font-weight:700;opacity:.7;margin-top:10px;min-width:.6em;text-align:left}.tg-layar[data-keadaan=pas] .tg-nada b{color:var(--tg-hijau)}.tg-layar[data-keadaan=diam] .tg-nada,.tg-layar[data-keadaan=dengar] .tg-nada{opacity:.45}.tg-saran{margin-top:8px;font-size:19px;font-weight:800;min-height:1.4em;letter-spacing:-.01em}.tg-saran b{color:#fdba74}.tg-layar[data-keadaan=rendah] .tg-saran,.tg-layar[data-keadaan=tinggi] .tg-saran{color:var(--tg-oranye)}.tg-layar[data-keadaan=pas] .tg-saran{color:var(--tg-hijau)}.tg-detail{margin-top:4px;font:500 13.5px var(--mono);color:#eaf1f8b3;display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.tg-level{height:5px;max-width:200px;margin:12px auto 0;border-radius:99px;background:#ffffff1a;overflow:hidden}.tg-level b{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#38BDF8,var(--tg-hijau));transition:width .08s}.tg-senar-bungkus{margin-top:14px}.tg-senar-bungkus[hidden]{display:none}.tg-senar{display:flex;gap:6px;justify-content:center}.tg-s{position:relative;flex:1 1 0;min-width:0;max-width:64px;aspect-ratio:1;border-radius:50%;border:2px solid var(--line);background:var(--bg);color:var(--fg);font:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;padding:0;transition:border-color .15s,background .15s,transform .12s,box-shadow .15s}.tg-s b{font-size:clamp(16px,5vw,21px);font-weight:800;letter-spacing:-.02em}.tg-s b sup{font-size:.55em;font-weight:700;opacity:.6;vertical-align:.5em;margin-left:1px}.tg-s small{font-size:11px;font-weight:700;color:var(--muted);margin-top:3px}.tg-s:active{transform:scale(.94)}.tg-s.aktif{border-color:var(--ak);background:color-mix(in srgb,var(--ak) 12%,var(--bg));box-shadow:0 0 0 3px color-mix(in srgb,var(--ak) 22%,transparent)}.tg-s.kunci{border-color:var(--ak);background:color-mix(in srgb,var(--ak) 82%,#000);color:#fff}.tg-s.kunci small{color:#fffc}.tg-s.sudah:after{content:"";position:absolute;top:-3px;right:-3px;width:18px;height:18px;border-radius:50%;border:2px solid var(--kartu);background:var(--hijau) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat}.tg-senar-info{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 10px;margin-top:10px;font-size:13.5px;color:var(--muted);text-align:center;min-height:30px}.tg-oto{font:inherit;font-size:13px;font-weight:800;border:1px solid var(--ak);color:var(--tg-teks-ak);background:color-mix(in srgb,var(--ak) 8%,var(--bg));border-radius:99px;padding:5px 12px;cursor:pointer}.tg-oto[hidden]{display:none}.tg-mulai{width:100%;justify-content:center;margin-top:16px;min-height:56px;font-size:17px;gap:10px}.tg-mulai .ic,.tg-main .ic,.tg-ketuk .ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.tg-mulai.jalan{background:var(--kartu);color:var(--fg);border:1px solid var(--line)}.tg-mulai.jalan .ic{color:#dc2626}.tg-lanjut{margin-top:14px;border:1px solid var(--line);border-radius:14px;background:var(--bg2);padding:0 14px}.tg-lanjut summary{cursor:pointer;padding:12px 0;font-weight:700;font-size:14.5px}.tg-lanjut summary small{font-weight:500;color:var(--muted)}.tg-a4{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:2px 0 14px}.tg-a4 output{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;min-width:2.2em;text-align:center}.tg-a4 span{color:var(--muted);font-weight:700;margin-left:-6px}.tg-bulat{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--kartu);color:var(--fg);font:inherit;font-size:24px;font-weight:700;line-height:1;cursor:pointer;display:grid;place-items:center;flex:none;user-select:none;-webkit-user-select:none;touch-action:manipulation}.tg-bulat:hover{border-color:var(--ak)}.tg-bulat:active{transform:scale(.94)}.tg-kecil{font:inherit;font-size:13px;font-weight:700;border:1px solid var(--line);background:var(--kartu);color:var(--fg);border-radius:99px;padding:7px 12px;cursor:pointer}.tg-metro{text-align:center}.tg-titik{display:flex;justify-content:center;gap:12px;min-height:44px;align-items:center;margin-top:6px}.tg-titik i{width:22px;height:22px;border-radius:50%;background:var(--line);transition:transform .08s,background .08s,box-shadow .2s}.tg-titik i:first-child{width:28px;height:28px;border:3px solid color-mix(in srgb,var(--oranye) 55%,var(--line));background:transparent}.tg-titik i.nyala{background:var(--ak);transform:scale(1.25);box-shadow:0 0 0 6px color-mix(in srgb,var(--ak) 22%,transparent)}.tg-titik i:first-child.nyala{background:var(--oranye);border-color:var(--oranye);box-shadow:0 0 0 7px color-mix(in srgb,var(--oranye) 28%,transparent)}.tg-bpm-baris{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:12px}.tg-bulat-besar{width:58px;height:58px;font-size:30px}.tg-bpm{display:flex;flex-direction:column;align-items:center;min-width:0;flex:0 1 190px}.tg-bpm output{font-size:clamp(64px,19vw,88px);font-weight:800;letter-spacing:-.05em;line-height:.95;font-variant-numeric:tabular-nums}.tg-bpm small{font-size:12.5px;font-weight:700;color:var(--muted);margin-top:6px}.tg-tempo{margin-top:6px;font-size:13px;font-weight:800;color:var(--tg-teks-ak);background:color-mix(in srgb,var(--ak) 12%,var(--bg));border-radius:99px;padding:4px 12px}#tg-bpm-geser{width:100%;margin-top:18px;accent-color:var(--ak);height:30px}.tg-cepat{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:8px}.tg-cepat button{padding:8px 4px}.tg-birama{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.tg-birama button{display:flex;flex-direction:column;align-items:center;line-height:1.1;padding:8px 4px;font-size:18px;border-radius:14px}.tg-birama button small{font-size:11px;font-weight:600;opacity:.75;margin-top:2px}.tg-metro-aksi{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.tg-metro-aksi .btn{justify-content:center;min-height:58px;font-size:16.5px;gap:8px;padding-inline:10px;white-space:nowrap}.tg-main.jalan{background:var(--kartu);color:var(--fg);border:1px solid var(--line)}.tg-ketuk.kedip{border-color:var(--ak);background:color-mix(in srgb,var(--ak) 12%,var(--kartu))}@media(max-width:380px){.tg-metro-aksi{grid-template-columns:1fr}.tg-titik{gap:9px}.tg-nada b{font-size:74px}}@media(prefers-reduced-motion:reduce){.tg-titik i,.tg-level b,.tg-layar:after{transition:none}}