.rht-hero{margin-bottom:var(--ct-space-8)}.rht-hero__heading{display:flex;align-items:center;gap:var(--ct-space-3)}.rht-hero__title{font-size:var(--ct-text-4xl);font-weight:800;color:var(--ct-text-main);line-height:1.2}.rht-hero__subtitle{margin-top:var(--ct-space-2);font-size:var(--ct-text-sm);color:var(--ct-text-muted)}.rht-app{display:flex;flex-direction:column;gap:var(--ct-space-6)}.rht-config{display:flex;flex-wrap:wrap;gap:var(--ct-space-5);padding:var(--ct-space-5);background:var(--ct-bg-soft);border:1px solid var(--ct-border);border-radius:var(--ct-radius-md)}.rht-config__group{display:flex;flex-direction:column;gap:var(--ct-space-2);border:none;padding:0;margin:0;min-width:0}.rht-config__legend{font-size:var(--ct-text-xs);font-weight:600;color:var(--ct-text-muted);text-transform:uppercase;letter-spacing:.5px}.rht-radio{display:inline-flex;align-items:center;gap:var(--ct-space-2);cursor:pointer;font-size:var(--ct-text-sm);color:var(--ct-text-main)}.rht-radio input[type=radio]{accent-color:var(--ct-accent)}.rht-radio__label{white-space:nowrap}.rht-slider{display:flex;align-items:center;gap:var(--ct-space-2)}.rht-slider input[type=range]{width:100px;accent-color:var(--ct-accent)}.rht-slider__value{font-size:var(--ct-text-sm);font-weight:700;color:var(--ct-text-main);min-width:32px;text-align:right}.rht-slider__unit{font-size:var(--ct-text-xs);color:var(--ct-text-muted)}.rht-controls{display:flex;gap:var(--ct-space-3)}.rht-tap-hint{display:flex;align-items:center;gap:var(--ct-space-3);padding:var(--ct-space-3) var(--ct-space-4);background:color-mix(in srgb,var(--ct-accent) 8%,var(--ct-bg));border:1px solid color-mix(in srgb,var(--ct-accent) 20%,var(--ct-border));border-radius:var(--ct-radius-sm)}.rht-tap-hint__key{display:inline-flex;align-items:center;justify-content:center;min-width:56px;padding:var(--ct-space-1) var(--ct-space-3);background:var(--ct-bg);border:1px solid var(--ct-border);border-radius:var(--ct-radius-sm);font-size:var(--ct-text-xs);font-weight:700;color:var(--ct-text-main);box-shadow:var(--ct-shadow-sm)}.rht-tap-hint__text{font-size:var(--ct-text-sm);color:var(--ct-text-muted)}.rht-timeline-wrapper{border:1px solid var(--ct-border);border-radius:var(--ct-radius-md);background:var(--ct-bg);overflow:hidden}.rht-timeline{position:relative;height:80px;overflow-x:auto;overflow-y:hidden}.rht-timeline__track{position:relative;height:100%;min-width:100%}.rht-timeline__beats{position:absolute;inset:0}.rht-timeline__grid{position:absolute;top:0;bottom:0;width:1px;background:var(--ct-border);opacity:.5}.rht-timeline__grid-label{position:absolute;top:var(--ct-space-1);left:var(--ct-space-1);font-size:10px;color:var(--ct-text-muted);white-space:nowrap;user-select:none}.rht-timeline__marker{position:absolute;top:50%;width:12px;height:12px;margin-top:-6px;margin-left:-6px;border-radius:var(--ct-radius-full);background:var(--ct-accent);opacity:.6;transition:transform .1s,opacity .1s}.rht-timeline__marker--downbeat{width:16px;height:16px;margin-top:-8px;margin-left:-8px;opacity:1}.rht-timeline__marker--active{transform:scale(1.5);opacity:1;box-shadow:0 0 12px color-mix(in srgb,var(--ct-accent) 50%,transparent)}.rht-timeline__marker--hit{background:var(--ct-success);opacity:1}.rht-timeline__marker--early{background:var(--ct-warning);opacity:1}.rht-timeline__marker--late{background:var(--ct-info);opacity:1}.rht-timeline__marker--miss{background:var(--ct-error);opacity:.5}.rht-timeline__playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--ct-accent);box-shadow:0 0 8px color-mix(in srgb,var(--ct-accent) 40%,transparent);z-index:2;will-change:transform}.rht-timeline__tap{position:absolute;top:50%;width:4px;height:24px;margin-top:-12px;margin-left:-2px;background:var(--ct-text-muted);border-radius:2px;opacity:.4}.rht-timeline--hidden-beats .rht-timeline__marker{opacity:0!important}.rht-count{padding:var(--ct-space-5);background:var(--ct-bg-soft);border:1px solid var(--ct-border);border-radius:var(--ct-radius-md);text-align:center}.rht-count__question{font-size:var(--ct-text-lg);font-weight:700;color:var(--ct-text-main);margin-bottom:var(--ct-space-4)}.rht-count__form{display:flex;justify-content:center;gap:var(--ct-space-3);max-width:280px;margin:0 auto}.rht-count__form .input{width:120px;text-align:center}.rht-count__result{margin-top:var(--ct-space-4);font-size:var(--ct-text-sm);font-weight:600}.rht-count__result--correct{color:var(--ct-success)}.rht-count__result--wrong{color:var(--ct-error)}.rht-score{padding:var(--ct-space-5);background:var(--ct-bg-soft);border:1px solid var(--ct-border);border-radius:var(--ct-radius-md)}.rht-score__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ct-space-4)}.rht-score__item{display:flex;flex-direction:column;align-items:center;gap:var(--ct-space-1)}.rht-score__label{font-size:var(--ct-text-xs);color:var(--ct-text-muted);text-transform:uppercase;letter-spacing:.5px}.rht-score__value{font-size:var(--ct-text-2xl);font-weight:800;color:var(--ct-text-main)}.rht-score__value--accent{color:var(--ct-accent)}.rht-score__value--hit{color:var(--ct-success)}.rht-score__value--early{color:var(--ct-warning)}.rht-score__value--late{color:var(--ct-info)}.rht-score__value--miss{color:var(--ct-error)}.rht-hidden{display:none!important}.rht-info{margin-top:var(--ct-space-12);padding-top:var(--ct-space-8);border-top:1px solid var(--ct-border)}.rht-info>h2{font-size:var(--ct-text-2xl);font-weight:800;color:var(--ct-text-main);margin-bottom:var(--ct-space-4)}.rht-info>p{font-size:var(--ct-text-sm);color:var(--ct-text-muted);line-height:1.7;max-width:640px}.rht-features{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ct-space-5);margin-top:var(--ct-space-8)}.rht-feature{padding:var(--ct-space-5);border:1px solid var(--ct-border);border-radius:var(--ct-radius-md);background:var(--ct-bg)}.rht-feature__icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin-bottom:var(--ct-space-3);border-radius:var(--ct-radius-sm);background:color-mix(in srgb,var(--ct-accent) 10%,var(--ct-bg));color:var(--ct-accent)}.rht-feature h3{font-size:var(--ct-text-sm);font-weight:700;color:var(--ct-text-main);margin-bottom:var(--ct-space-2)}.rht-feature p{font-size:var(--ct-text-xs);color:var(--ct-text-muted);line-height:1.6}.rht-howto{margin-top:var(--ct-space-8)}.rht-howto h3{font-size:var(--ct-text-lg);font-weight:700;color:var(--ct-text-main);margin-bottom:var(--ct-space-5)}.rht-steps{display:flex;flex-direction:column;gap:var(--ct-space-4)}.rht-step{display:flex;gap:var(--ct-space-4);align-items:flex-start}.rht-step__number{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--ct-radius-full);background:var(--ct-accent);color:#fff;font-size:var(--ct-text-sm);font-weight:700}.rht-step__content{padding-top:var(--ct-space-1)}.rht-step__label{font-size:var(--ct-text-sm);font-weight:700;color:var(--ct-text-main)}.rht-step__desc{font-size:var(--ct-text-xs);color:var(--ct-text-muted);line-height:1.6;margin-top:var(--ct-space-1)}.rht-faq{margin-top:var(--ct-space-8);display:flex;flex-direction:column;gap:var(--ct-space-3)}.rht-faq__item{border:1px solid var(--ct-border);border-radius:var(--ct-radius-sm);overflow:hidden}.rht-faq__item summary{padding:var(--ct-space-4);font-size:var(--ct-text-sm);font-weight:600;color:var(--ct-text-main);cursor:pointer;user-select:none;list-style:none}.rht-faq__item summary::-webkit-details-marker{display:none}.rht-faq__item summary:before{content:"+";display:inline-block;width:20px;font-weight:700;color:var(--ct-accent)}.rht-faq__item[open] summary:before{content:"−"}.rht-faq__item p{padding:0 var(--ct-space-4) var(--ct-space-4);font-size:var(--ct-text-xs);color:var(--ct-text-muted);line-height:1.7}@media(max-width:1080px){.rht-features{grid-template-columns:repeat(2,1fr)}.rht-score__grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:640px){.rht-hero__title{font-size:var(--ct-text-2xl)}.rht-config{flex-direction:column;gap:var(--ct-space-4)}.rht-controls{flex-wrap:wrap}.rht-features{grid-template-columns:1fr}.rht-score__grid{grid-template-columns:repeat(2,1fr)}.rht-tap-hint{flex-direction:column;text-align:center}.rht-slider input[type=range]{width:80px}}
