/* Keep visual timing guides above actor pixels while pointer input reaches the tap zone. */
.rhythm-ring{z-index:6;pointer-events:none}
.timing-ring{left:85px;top:386px;width:220px;height:72px;transform-origin:50% 50%;z-index:7;pointer-events:none}
.gold-line{z-index:7;transform:translateY(-50%);pointer-events:none}
.music-note{left:195px;width:42px;height:42px;display:grid;place-items:center;line-height:1;text-align:center;transform:translate(-50%,-50%);z-index:8;pointer-events:none}
.training-title,.train-status,.training-help,.train-result{z-index:9;pointer-events:none}


/* Contrasting edges remain readable over the pale actor and golden xylophone. */
.gold-line{background:#ffda50;box-shadow:0 0 0 2px #6f4528,0 0 0 4px #fff6ce,0 0 10px #ffe292}
.music-note{color:#ffb52e;-webkit-text-stroke:1.3px #704125;text-shadow:0 2px 0 #fff8dd,0 0 4px #fff8dd;font-weight:900}
.rhythm-ring{border-color:#ffc34e;box-shadow:0 0 0 2px #704927,0 0 0 4px #fff3c6,0 0 12px #ffdc79}
.timing-ring{border-color:#fff9df;box-shadow:0 0 0 2px #704927,0 0 10px #ffdc79}