:root{--paper:#f5f3ee;--ink:#1a1815;--muted:#6f6a5e;--accent:#b45309;--accent-soft:#f7e8d5;--line:#e3ded2;--card:#fffdf8}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.65}.wrap{max-width:1120px;margin:0 auto;padding:0 24px}header.site{padding:28px 0 8px}header.site .brand{font-weight:800;font-size:1.3rem;letter-spacing:-.02em;color:var(--ink);text-decoration:none}header.site .brand span{color:var(--accent)}header.site nav{margin-top:6px;font-size:.92rem}header.site nav a{color:var(--muted);text-decoration:none;margin-right:18px}header.site nav a:hover{color:var(--accent)}h1{font-size:clamp(2.1rem,5vw,3.4rem);line-height:1.06;letter-spacing:-.03em;margin:.4em 0 .3em}h2{font-size:1.55rem;letter-spacing:-.02em;margin:1.7em 0 .5em}h3{font-size:1.12rem;margin:1.2em 0 .3em}p.lede{font-size:1.18rem;color:var(--muted);max-width:46rem}.tool{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:28px;margin:28px 0}.tool label{font-weight:600;display:block;margin-bottom:6px;font-size:.95rem}.tool input[type=number],.tool input[type=text],.tool select{font-size:1.05rem;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font-family:inherit;width:100%}.tool input[type=range]{width:100%;accent-color:var(--accent)}.tool button{background:var(--accent);color:#fff;border:0;border-radius:10px;padding:12px 22px;font-size:1.05rem;font-weight:700;cursor:pointer;font-family:inherit}.tool button.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}.tool button:disabled{opacity:.5;cursor:default}.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin:14px 0}.result{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:22px}.result .card{background:var(--accent-soft);border-radius:14px;padding:20px}.result .card h3{margin-top:0}.result .big{font-size:1.9rem;font-weight:800;letter-spacing:-.02em}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:20px 0}.grid a{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;text-decoration:none;color:var(--ink)}.grid a:hover{border-color:var(--accent)}.grid a .nm{font-weight:700;font-size:1.05rem}.grid a .sub{color:var(--muted);font-size:.9rem}table{border-collapse:collapse;width:100%;margin:16px 0;background:var(--card)}th,td{border:1px solid var(--line);padding:8px 10px;text-align:left;font-size:.95rem}th{background:var(--accent-soft)}.note{color:var(--muted);font-size:.92rem}.pro{background:var(--card);border:1px dashed var(--accent);border-radius:14px;padding:18px 22px;margin:36px 0 0}footer.site{border-top:1px solid var(--line);margin-top:56px;padding:28px 0 44px;color:var(--muted);font-size:.92rem}footer.site a{color:var(--muted)}footer.site .sibs{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px 18px}footer.site .sibs a{text-decoration:none}footer.site .sibs a:hover{color:var(--accent)}.faq dt{font-weight:700;margin-top:14px}.faq dd{margin:4px 0 0}.bpm-display{text-align:center;padding:10px 0 2px}.bpm-num{font-size:clamp(4rem,12vw,6.5rem);font-weight:800;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}.bpm-mark{font-size:1.25rem;color:var(--accent);font-weight:700;margin-top:4px}.bpm-sub{color:var(--muted);font-size:.95rem}.dots{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:22px 0 6px;min-height:26px}.dot{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);background:#fff;transition:background .05s,transform .05s}.dot.on{background:var(--accent);border-color:var(--accent);transform:scale(1.25)}.dot.on.accent{background:#1a1815;border-color:#1a1815}.metro-controls{display:flex;gap:10px;justify-content:center;align-items:stretch;flex-wrap:wrap;margin:16px 0}.metro-controls .bpm-adj{width:56px;font-size:1.5rem;padding:8px 0}.metro-controls .bpm-input{width:110px;text-align:center;font-size:1.3rem;font-weight:700}.metro-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:14px}.btn-start{font-size:1.3rem!important;padding:16px 46px!important;border-radius:14px!important}.btn-tap{font-size:1.1rem!important;padding:14px 30px!important}.check{display:flex;gap:8px;align-items:center;font-weight:600}.check input{width:20px;height:20px;accent-color:var(--accent)}.statline{text-align:center;color:var(--muted);font-size:.95rem;min-height:1.5em}.tappad{display:block;width:100%;padding:44px 20px!important;font-size:1.6rem!important;border-radius:18px!important}
