:root{font-family:system-ui,sans-serif;color:#29251e;background:#f6f0e2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:700px;margin:auto;padding:24px 20px 40px}nav{display:flex;justify-content:space-between;gap:10px}a{color:#754722}nav a,summary{display:inline-flex;align-items:center;min-height:44px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.1em;margin:18px 0 8px}h1{font:700 clamp(30px,6vw,44px)/1.1 Georgia,serif;margin:0 0 12px}.intro{line-height:1.5;margin:0 0 18px}.music{background:#fffdf7;border:1px solid #d8c8a8;border-radius:10px;padding:20px}button,textarea{font:inherit;color:inherit;border:1px solid #a98b5e;border-radius:6px;background:#fffdf7}button{min-height:44px;min-width:76px;padding:10px 14px;cursor:pointer}.primary{background:#754722;border-color:#754722;color:#fff}button:disabled{opacity:.5;cursor:default}:focus-visible{outline:3px solid #285a84;outline-offset:3px}.transport{display:flex;align-items:center;gap:10px}.transport span{font-size:12px;color:#5b554b;margin-left:auto}#status{font-size:14px;min-height:2.7em;line-height:1.35;margin:12px 0}fieldset{border:0;margin:12px 0;padding:0}legend,.thought{font-size:14px;font-weight:600}.choices{display:flex;gap:8px;margin-top:8px}.choices label{display:flex;align-items:center;justify-content:center;gap:7px;flex:1;min-height:44px;border:1px solid #d8c8a8;border-radius:6px;font-size:14px;cursor:pointer}.choices label:has(:checked){background:#f1e5cc;border-color:#946a31}.choices input{width:17px;height:17px;margin:0;accent-color:#754722}.phrase{margin:18px 0 8px}.row{display:grid;grid-template-columns:58px repeat(4,minmax(0,1fr));gap:4px;align-items:center}.row strong{font-size:12px}.chords span{text-align:center;font-size:18px;font-weight:650;padding:6px 0;border-radius:3px}.bar.active{background:#ead3a1;outline:1px solid #946a31}.cell{height:51px;border-left:1px solid #c8b995;padding:7px 4px 5px;background:repeating-linear-gradient(90deg,transparent 0 calc(25% - 1px),#e7ddc7 calc(25% - 1px) 25%)}.cell:last-child{border-right:1px solid #c8b995}.cell b{display:block;text-align:center;font-size:14px;font-weight:600}.attacks{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin-top:9px}.attacks i{display:block;width:70%;height:7px;background:#805c35}.caption{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#5b554b;margin:8px 0 16px}#comparison,.restart{font-size:13px;line-height:1.45;margin:12px 0}.restart{color:#5b554b}.thought{display:block;line-height:1.45;margin:16px 0 7px}.thought small{display:block;font-size:12px;font-weight:400;color:#5b554b}textarea{width:100%;padding:9px;resize:vertical;min-height:66px}.privacy{font-size:11px;color:#5b554b;margin-bottom:0}details{font-size:13px;line-height:1.55;margin-top:12px}summary{cursor:pointer;font-size:14px}details p{margin:8px 0}html{scrollbar-gutter:stable}@media(max-width:450px){main{padding:12px 12px 28px}.music{padding:14px}.transport{gap:8px}.transport button{min-width:68px}.transport span{font-size:11px}.row{grid-template-columns:48px repeat(4,minmax(0,1fr));gap:2px}.cell{padding:7px 3px 5px}.attacks{gap:2px}.caption{flex-direction:column;gap:3px}.choices label{font-size:13px;gap:5px}}
.choices.bass-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.bass-choices label{padding:8px;text-align:center}.bass-choices label:first-child{grid-column:1/-1}