:root{--ink:#1d2433;--muted:#5b6476;--bg:#f7f4ee;--card:#fff;--line:#e3ddd1;--accent:#1f3a5f;--gold:#b08a3e;--good:#1e7a4c;--bad:#b3261e;--walk:#5a8f5a;--trot:#3b6ea8;--canter:#c7782a;--passage:#7a4fa0;--intro:#9aa1ad}
*{box-sizing:border-box}body{margin:0;font:16px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--accent)}header.top{background:var(--accent);color:#fff}header.top .in{max-width:1080px;margin:0 auto;padding:.7rem 1rem;display:flex;gap:1rem;align-items:center;justify-content:space-between}
.brand{color:#fff;text-decoration:none;font-weight:700;letter-spacing:.04em}.brand span{color:#e9d3a0}.langs a{color:#dfe7f2;margin-left:.7rem;text-decoration:none;font-size:.9rem}.langs a[aria-current]{color:#fff;font-weight:700;border-bottom:2px solid var(--gold)}
main{max-width:1080px;margin:0 auto;padding:1rem}.hero h1{font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.2;margin:.8rem 0 .4rem;font-family:Georgia,"Times New Roman",serif}.hero p.lead{font-size:1.08rem;color:var(--muted);max-width:52rem}
.badges{display:flex;flex-wrap:wrap;gap:.5rem;margin:.8rem 0 1.2rem;padding:0;list-style:none}.badges li{background:#fff;border:1px solid var(--line);border-radius:99px;padding:.3rem .8rem;font-size:.9rem}.badges li:before{content:"✓ ";color:var(--good);font-weight:700}
section.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:1rem 1.2rem;margin:0 0 1rem;box-shadow:0 1px 2px rgba(0,0,0,.03)}section.card h2{margin:.1rem 0 .6rem;font-size:1.2rem}
label{font-size:.92rem;color:var(--muted)}select,input[type=text],input[type=number]{font:inherit;padding:.35rem .5rem;border:1px solid #cfc7b8;border-radius:8px;background:#fff;color:var(--ink)}input[type=number]{width:5.2rem}
.row{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}.small{font-size:.86rem;color:var(--muted)}.src a{word-break:break-word}.warn{color:#8a5a00}.warnbox{background:#fff7e6}
.btn{font:inherit;background:var(--accent);color:#fff;border:0;border-radius:9px;padding:.5rem .95rem;cursor:pointer;text-decoration:none;display:inline-block}.btn:hover{filter:brightness(1.1)}.btn[disabled],.btn.disabled{opacity:.45;cursor:not-allowed}.btn.sm{padding:.28rem .6rem;font-size:.86rem}.btn.ghost{background:#eef1f6;color:var(--accent)}.btn.gold{background:var(--gold)}.btn.playing{background:var(--bad);color:#fff}.btn.busy{opacity:.6;cursor:progress}
.pace{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;padding:.45rem .6rem;border-left:5px solid var(--intro);background:#fafaf7;border-radius:8px;margin:.35rem 0}.pname{min-width:8.5rem;font-weight:600}
.pace-walk{border-left-color:var(--walk)!important}.pace-trot{border-left-color:var(--trot)!important}.pace-canter{border-left-color:var(--canter)!important}.pace-passage{border-left-color:var(--passage)!important}
#drop{border:2px dashed #cfc7b8;border-radius:12px;padding:1rem;text-align:center;margin:.5rem 0}#drop.over{background:#eef4ff;border-color:var(--trot)}
.track,.seg{border-left:5px solid var(--intro);background:#fafaf7;border-radius:8px;padding:.55rem .7rem;margin:.45rem 0}.tname{font-weight:600;word-break:break-all}.tctl,.segctl{display:flex;flex-wrap:wrap;gap:.45rem .7rem;align-items:center;margin-top:.3rem}
.seg.intro{border-left-color:var(--intro)!important;background:#f3f3f1}.seghead{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.segno{font-weight:700;min-width:1.6rem}.segctl input[type=range]{width:9rem}.tempo{font-size:.88rem}
.totals{border-radius:10px;padding:.6rem .8rem;margin:.6rem 0;background:#f1f3f7}.totals.good{background:#e7f4ec}.totals.good .verdict{color:var(--good);font-weight:700}.totals.bad{background:#fbeaea}.totals.bad .verdict{color:var(--bad);font-weight:700}
#bar{position:relative;height:30px;border-radius:7px;overflow:hidden;background:#ece8df;display:flex;margin:.4rem 0}#bar .blk{height:100%;border-right:2px solid #fff}#bar .blk.pace-walk{background:var(--walk)}#bar .blk.pace-trot{background:var(--trot)}#bar .blk.pace-canter{background:var(--canter)}#bar .blk.pace-passage{background:var(--passage)}#bar .blk.intro{background:var(--intro)}
#bar .mark{position:absolute;top:0;bottom:0;width:3px;background:var(--ink)}#bar .mark.min{background:#555;opacity:.6}#playhead{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 0 1px #000}
.exp{display:flex;flex-wrap:wrap;gap:.6rem;margin:.5rem 0}.lock{border:1px solid #e6d7b5;background:#fffaf0;border-radius:12px;padding:.8rem 1rem;margin-top:.8rem}.lock .price{font-size:1.4rem;font-weight:700;color:var(--gold);margin-right:.6rem}
#keyform{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}#keyform input{flex:1;min-width:16rem}.ok{color:var(--good)}
.how ol{padding-left:1.2rem}.faq details{border-top:1px solid var(--line);padding:.5rem 0}.faq summary{cursor:pointer;font-weight:600}
table.rules{border-collapse:collapse;width:100%;font-size:.94rem}table.rules th,table.rules td{border-bottom:1px solid var(--line);padding:.4rem .5rem;text-align:left;vertical-align:top}table.rules th{background:#f1ede4}
footer{max-width:1080px;margin:1rem auto 2rem;padding:0 1rem;color:var(--muted);font-size:.88rem}progress{width:100%;height:8px}#clock{font-variant-numeric:tabular-nums;margin-left:.5rem}
@media(max-width:640px){.pname{min-width:100%}.segctl input[type=range]{width:100%}}