.dancing-rings{position:absolute;z-index:1;transform:translate(-50%,-50%);pointer-events:none}
.dancing-rings[hidden]{display:none!important}

.ring-move-selector{position:absolute;z-index:8;display:flex;gap:5px;transform:translateX(-50%)}
.ring-move-selector[hidden]{display:none}
.ring-move-selector button{width:27px;height:27px;border:1px solid #b69a6080;border-radius:50%;background:#ffffffc9;color:#47657a;cursor:pointer;font:13px Georgia,serif;padding:0}
.ring-move-selector button[aria-pressed="true"]{background:#b69a60;color:white}
.ring-move-selector button.is-playing{outline:2px solid #47657a;outline-offset:2px}
.ring-move-selector button:focus-visible{outline:2px solid #234d6b;outline-offset:3px}

.ring-move-selector{flex-wrap:wrap;width:320px;justify-content:center}
.ring-move-selector select{width:145px;font:12px system-ui;color:#47657a;background:#fffffff0;border:1px solid #b69a60;border-radius:7px;padding:3px}
.ring-selection-note{width:100%;text-align:center;font:10px system-ui;color:#365368}

/* Keep editing controls clear of the navigation and ring artwork. */
.ring-move-selector{transform:none;width:190px;padding:10px;border-radius:12px;background:rgba(255,255,255,.92);box-shadow:0 4px 18px #24445c18;z-index:30}
@media(max-width:600px){.ring-move-selector{width:165px;padding:7px;gap:4px}.ring-move-selector button{width:25px;height:25px}}

#design-panel .ds-control[hidden]{display:none!important}
.ring-editor-select{width:100%;padding:10px;border:1px solid #c7d4df;border-radius:8px;background:white;color:#365368;margin-bottom:18px;font:inherit}

.ring-move-selector [hidden]{display:none!important}
.ring-move-selector .ring-playback-select{width:100%;font-size:12px;padding:6px}
.ring-time-control{width:100%;display:grid;grid-template-columns:1fr auto;gap:5px 7px;padding:5px 0;font:11px system-ui;color:#365368;align-items:center}
.ring-time-control label,.ring-time-control input[type="range"],.ring-time-control small{grid-column:1/-1}
.ring-time-control input[type="number"]{min-width:0;width:100%;box-sizing:border-box;padding:5px 7px;border:1px solid #c7d4df;border-radius:6px;background:white;color:#365368;font:13px system-ui}
.ring-time-control input[type="range"]{width:100%;margin:3px 0;accent-color:#b69a60}
.ring-time-control small{font-size:10px;color:#5f7585}