body[data-game="rhythm"]{background:#f2f1e5;color:#28483f}
body[data-game="rhythm"] .playground{max-width:1120px;padding:32px 26px 26px;background:#fffcf5;border:1px solid #e1e3cb;border-radius:28px}
body[data-game="rhythm"] h1{font-family:Georgia,"Yu Mincho",serif;letter-spacing:.04em;font-size:clamp(28px,4vw,42px);color:#29493e}
body[data-game="rhythm"] .pg-eyebrow{letter-spacing:.18em;color:#6d806c;font-size:11px}
body[data-game="rhythm"] button{font:inherit;font-weight:700;color:#345349;background:#fffdf4;border:1px solid #d8dfcb;border-radius:16px;min-height:48px;padding:12px 18px;cursor:pointer;box-shadow:0 3px 0 #dfe3d4;transition:background .15s,border-color .15s,transform .15s}
body[data-game="rhythm"] button:hover:not(:disabled){background:#edf2dc;border-color:#89a381}
body[data-game="rhythm"] button:focus-visible{outline:3px solid #4f8575;outline-offset:4px}
body[data-game="rhythm"] button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 #dfe3d4}
body[data-game="rhythm"] button[aria-pressed="true"],body[data-game="rhythm"] button.primary{background:#477e68;color:#fffef1;border-color:#477e68;box-shadow:0 3px 0 #2f6150}
body[data-game="rhythm"] button[aria-pressed="true"]:hover,body[data-game="rhythm"] button.primary:hover{background:#3d705d}
body[data-game="rhythm"] button:disabled{cursor:default;color:#748171;box-shadow:none}
body[data-game="rhythm"] [hidden]{display:none!important}
body[data-game="rhythm"] .pg-options{gap:10px}
body[data-game="rhythm"] #description{max-width:680px;line-height:1.85;color:#68786b;margin:18px auto 24px}
body[data-game="rhythm"] .pg-help{padding:15px 20px;border-radius:17px;background:#eef1df;font-size:14px;line-height:1.7}
body[data-game="rhythm"] .pg-status{border-left:5px solid #8ca78d;background:#e8f1e5;border-radius:16px;color:#3e6855;min-height:52px;box-sizing:border-box;margin:18px 0;padding:14px 20px;text-align:left}
.rhythm-mode-bar{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:18px 0}
.rhythm-audio-bar{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;padding:16px 18px;background:#f0eedb;border-radius:20px;border:1px solid #e2dfc9;line-height:1.6}
.rhythm-audio-bar #audioState{font-size:13px;max-width:280px;color:#65735f}
.rhythm-audio-bar label{display:flex;gap:8px;align-items:center;font-size:12px;white-space:nowrap}
.rhythm-audio-bar input[type="range"]{accent-color:#477e68;width:100px}
.rhythm-audio-bar select{font:inherit;border:1px solid #bdc8ae;border-radius:10px;background:#fffcf3;color:#3d5c4d;padding:8px;max-width:150px}
.rhythm-audio-bar meter{width:72px;height:12px;accent-color:#6b9570}
.rhythm-host-line{font-family:Georgia,"Yu Mincho",serif;font-size:clamp(16px,2vw,21px);font-weight:700;text-align:center;color:#536b48;margin:22px 0 15px;line-height:1.65}
.rhythm-concert{position:relative;isolation:isolate;overflow:hidden;border-radius:24px;aspect-ratio:1.65;max-height:calc(100svh - 185px);box-shadow:0 6px 0 #d0c5a5;border:1px solid #d5d7bd;background:#decfae;margin:0 auto 28px}
.rhythm-stage-backdrop{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;z-index:-2;pointer-events:none}
.rhythm-decor-layer{position:absolute;inset:0;z-index:0;pointer-events:none}
.rhythm-stage-decor{position:absolute;object-fit:contain;filter:drop-shadow(0 3px 4px #48381325);pointer-events:none}
.rhythm-stage-decor.decor-0{width:40%;height:23%;top:0;left:30%;object-position:top}
.rhythm-stage-decor.decor-1{width:20%;height:20%;left:2%;bottom:2%}
.rhythm-stage-decor.decor-2{width:13%;height:26%;right:3%;top:3%}
.rhythm-stage-decor.decor-3{width:15%;height:26%;left:4%;top:4%}
.rhythm-performers{position:absolute;z-index:1;inset:19% 7% 5%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3%}
body[data-game="rhythm"] button.rhythm-performer{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding:0;min-width:0;min-height:0;border:0;box-shadow:none;border-radius:28px;background:transparent;color:#3a513e;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:filter .15s}
body[data-game="rhythm"] button.rhythm-performer:disabled{opacity:1;filter:none;color:#3a513e}
body[data-game="rhythm"] button.rhythm-performer:hover:not(:disabled){background:transparent;filter:brightness(1.04)}
body[data-game="rhythm"] button.rhythm-performer:active:not(:disabled){transform:none;box-shadow:none}
.rhythm-performer .performer-portrait{display:block;position:relative;width:100%;flex:1;min-height:0;filter:drop-shadow(0 5px 3px #392d231a);transform-origin:50% 90%;transition:transform .18s}
.rhythm-performer .performer-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;transform:none;pointer-events:none;user-select:none;transition:opacity .08s}
.rhythm-performer .performer-play{opacity:0}
.rhythm-performer.playing .performer-ready,.rhythm-performer.holding .performer-ready{opacity:0}
.rhythm-performer.playing .performer-play,.rhythm-performer.holding .performer-play{opacity:1}
.rhythm-performer .performer-name{font-size:clamp(12px,1.5vw,18px);font-family:Georgia,"Yu Mincho",serif;border-radius:14px;background:#fffbeaee;padding:8px 12px;margin-top:1px;white-space:nowrap;box-shadow:0 2px 5px #4e422125}
.rhythm-performer .performer-key{display:block;color:#596953;font-size:11px;background:#fffbefdb;padding:3px 8px;border-radius:0 0 10px 10px}
.rhythm-performer.struck .performer-portrait{animation:rhythm-bounce .32s ease-out}
.rhythm-performer.holding .performer-portrait{transform:rotate(-2deg) scale(1.025)}
.rhythm-performer.playing:after{content:"♪";position:absolute;right:7%;top:9%;font-family:Georgia,serif;font-size:clamp(24px,4vw,48px);color:#efc055;text-shadow:0 2px 0 #fff7da;animation:rhythm-note .6s ease-out;pointer-events:none}
.rhythm-round-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 6px;color:#526e58;font-size:15px}
.rhythm-score{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;padding:6px 0 16px}
.rhythm-step{border-radius:17px;background:#f2eed9;border:1px solid #dddcc0;color:#5d7157;min-height:122px;flex:0 1 150px;width:150px;max-width:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:9px 5px;box-sizing:border-box;position:relative;transition:background .15s,border-color .15s}
.rhythm-step-animal{height:70px;width:76px;object-fit:contain;pointer-events:none}
.rhythm-step small{font-size:11px;position:absolute;top:6px;left:9px;color:#8a9976}
.rhythm-step b{font-size:28px;line-height:1.15;color:#7d9471}
.rhythm-step span{font-size:12px;font-weight:700;text-align:center}
.rhythm-step.current{background:#fff4c6;border-color:#c3a75f;box-shadow:0 0 0 2px #ecd697}
.rhythm-step.demo-step,.rhythm-step.prompt-step{background:#fff4c6;border-color:#bc9753}
.rhythm-step.matched{background:#e1ebd7;border-color:#8ea77b}
.rhythm-step.matched b{color:#4f815c}
.rhythm-example-controls{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;padding-bottom:10px;margin:18px 0 8px}
.rhythm-length-controls{display:flex;align-items:center;justify-content:center;gap:15px;flex-wrap:wrap;margin:12px auto 22px;max-width:650px}
body[data-game="rhythm"] #lengthDrum{position:relative;isolation:isolate;overflow:hidden;min-height:108px;min-width:220px;background:#f8e8bc;border:2px solid #d6bd81;touch-action:none;box-shadow:0 4px 0 #ba995c}
#lengthDrum b,#lengthDrum small{position:relative;z-index:1;display:block}
#lengthDrum small{font-size:12px;font-weight:400;padding-top:6px}
.rhythm-hold-meter{position:absolute;inset:0;z-index:0;background:#d3e4ad;transform:scaleX(var(--hold-progress,0));transform-origin:left center}
.rhythm-length-controls p{font-size:13px;color:#768366;flex-basis:100%;margin:0;text-align:center;line-height:1.65}
.rhythm-record-panel{background:#f4efdb;border:1px solid #dfdcc0;border-radius:22px;padding:24px 24px 20px;margin:24px 0;text-align:center}
.rhythm-record-panel h2{font-family:Georgia,"Yu Mincho",serif;color:#46634b;margin:0 0 12px;font-size:22px}
.rhythm-record-panel p{color:#69775f;line-height:1.75;font-size:14px}
.rhythm-record-panel .duo-toolbar{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.rhythm-record-panel.is-recording{border:2px solid #ba8265;background:#faf0dd}
.rhythm-record-panel.is-recording #recordingStatus{color:#a2593c;font-weight:700}
.rhythm-record-panel.is-replaying{border:2px solid #82a184;background:#eaf0df}
.rhythm-record-controls{border:1px solid #dfdcc0;background:#f4efdb;border-radius:18px;padding:12px 18px;margin:12px 0 16px;text-align:center}
.rhythm-record-controls .duo-toolbar{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.rhythm-record-controls .rhythm-record-progress{margin:10px auto 0}
.rhythm-record-controls p{margin:8px 0;font-size:13px;color:#69775f;line-height:1.5}
.rhythm-record-controls.is-recording{border-color:#ba8265;background:#faf0dd}
.rhythm-record-controls.is-recording #recordingStatus{color:#a2593c;font-weight:700}
.rhythm-record-controls:not([hidden]) + .rhythm-concert{max-height:calc(100svh - 245px)}
.rhythm-record-progress{display:flex;align-items:center;gap:12px;justify-content:center;margin:18px auto 10px;max-width:700px;font-size:13px}
.rhythm-record-progress progress{flex:1;min-width:40px;accent-color:#8ca76d;height:12px}
.rhythm-recorded-notes{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;min-height:44px;max-width:750px;margin:16px auto}
.recorded-note{width:27px;height:30px;display:grid;place-items:center;background:#fffcf0;border:1px solid #d9d9ba;border-radius:8px;color:#6b8565;font-size:15px}
.recorded-note.note-1{color:#9d776d;background:#f9eee6}.recorded-note.note-2{color:#777baa;background:#eef0f8}
.recorded-note img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.rhythm-record-reset{margin:22px auto 0;padding-top:16px;border-top:1px solid #ddd7bd}
body[data-game="rhythm"] #deleteRecording{min-height:38px;font-size:12px;padding:8px 12px;background:transparent;box-shadow:none}
#confirmDeleteRecording,#resetConfirm{background:#fff9e9;border:1px solid #dbb29b;padding:18px;border-radius:16px;margin-top:16px}
.rhythm-win:empty{display:none}
.rhythm-win{background:#e7eed9;border:1px solid #c0d1a9;border-radius:22px;padding:22px;text-align:center;margin:20px 0}
.rhythm-win h2{font-family:Georgia,"Yu Mincho",serif;font-size:24px;color:#45634b;margin:0 0 10px}
.rhythm-win p{color:#79836b;font-size:13px;line-height:1.6}
.rhythm-book-toolbar{display:flex;justify-content:center;margin:24px 0 12px}
.rhythm-rewards{display:grid;grid-template-columns:1fr auto;gap:8px 18px;background:#ecf0da;border:1px solid #dbe0c4;border-radius:18px;padding:18px 22px;margin:18px 0;color:#657653;font-size:14px}
.rhythm-rewards strong{color:#507348;font-size:17px}.rhythm-rewards progress{grid-column:1/-1;width:100%;accent-color:#7d9d61;height:12px}.rhythm-rewards small{grid-column:1/-1;font-size:12px}
.rhythm-scrapbook{padding:24px;background:#f7f4e8;border:1px solid #dedfc8;border-radius:22px;margin-top:22px}
.rhythm-scrapbook summary{font-size:18px;font-family:Georgia,"Yu Mincho",serif;font-weight:700;cursor:pointer;color:#577044;min-height:32px;line-height:1.6}
.rhythm-scrapbook p{font-size:13px;color:#78856c;line-height:1.75}
.rhythm-stamp-groups{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0 26px}
.rhythm-stamp-groups section{padding:16px;background:#fffdf3;border:1px solid #daddc3;border-radius:18px;min-width:0}
.rhythm-stamp-groups h3,.rhythm-scrapbook h3{font-size:16px;color:#526c4d;text-align:left;margin:8px 0 16px}
.rhythm-stamp-groups .stamp-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
body[data-game="rhythm"] .stamp-grid button{padding:9px 3px;min-height:78px;border-radius:12px;background:#f1efdf;border-style:dashed;box-shadow:none;display:flex;flex-direction:column;align-items:center;gap:4px}
.stamp-grid button b{font-size:21px;color:#8ca179}.stamp-grid button span,.stamp-grid button small{font-size:10px}
body[data-game="rhythm"] .stamp-grid button.earned{background:#dfe9bf;border-color:#9dae72;border-style:solid;color:#476d42}
.rhythm-stage-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 26px}
.rhythm-decor-choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0 26px}
body[data-game="rhythm"] .rhythm-stage-choices button,body[data-game="rhythm"] .rhythm-decor-choices button{display:flex;flex-direction:column;align-items:center;padding:10px;min-width:0;gap:10px;box-shadow:none;color:#53704d;background:#fffcf1}
.rhythm-stage-choices button img{width:100%;height:120px;object-fit:cover;border-radius:11px}.rhythm-decor-choices button img{width:100%;height:115px;object-fit:contain}
.rhythm-stage-choices button b,.rhythm-decor-choices button b{font-size:13px;line-height:1.5}.rhythm-stage-choices button small,.rhythm-decor-choices button small{font-size:11px;line-height:1.55}
body[data-game="rhythm"] .rhythm-stage-choices button[aria-pressed="true"],body[data-game="rhythm"] .rhythm-decor-choices button[aria-pressed="true"]{color:#415f39;background:#e2ebc7;border:2px solid #a4b97c}
.rhythm-locked{display:grid;place-items:center;width:100%;height:115px;color:#b3baa3;font-size:42px;font-family:Georgia,serif;background:#eeeddc;border-radius:12px}
.rhythm-parent-reset{border-top:1px solid #dadcc5;padding-top:16px;margin-top:24px}
.rhythm-save-warning{color:#885938;background:#f9edda;border-radius:12px;padding:14px;line-height:1.7}
@keyframes rhythm-bounce{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-7px) rotate(-2deg)}70%{transform:translateY(-2px) rotate(1deg)}}
@keyframes rhythm-note{from{transform:translateY(10px) rotate(-12deg);opacity:0}35%{opacity:1}to{transform:translateY(-14px) rotate(8deg);opacity:.3}}
@media(max-width:700px){
 body[data-game="rhythm"] .playground{padding:22px 14px;border-radius:22px;margin-left:8px;margin-right:8px}
 body[data-game="rhythm"] button{font-size:13px;padding:10px 12px;min-height:46px}
 .rhythm-mode-bar{gap:8px}.rhythm-audio-bar{padding:12px;gap:10px}
 .rhythm-concert{aspect-ratio:1.25;border-radius:20px}
 .rhythm-performers{inset:20% 3% 6%;gap:1%}
 .rhythm-performer .performer-name{font-size:11px;padding:7px 5px;white-space:normal;line-height:1.3;min-height:30px;display:flex;align-items:center;justify-content:center}
 .rhythm-performer .performer-key{font-size:9px;padding:2px 4px}
 .rhythm-score{gap:7px}.rhythm-step{min-height:108px;flex-basis:calc((100% - 16px)/3);width:auto;max-width:120px}.rhythm-step span{font-size:10px}.rhythm-step-animal{height:60px;width:66px}
 .rhythm-stamp-groups{grid-template-columns:1fr;gap:14px}.rhythm-stamp-groups .stamp-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
 .rhythm-scrapbook{padding:16px}.rhythm-stage-choices{gap:8px}.rhythm-stage-choices button img{height:80px}.rhythm-stage-choices button b{font-size:11px}
 .rhythm-decor-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.rhythm-record-panel{padding:20px 14px}
 .rhythm-record-progress{flex-wrap:wrap}.rhythm-record-progress progress{flex-basis:100%}.rhythm-recorded-notes{gap:5px}
 .rhythm-stage-decor.decor-0{width:40%;height:20%}.rhythm-stage-decor.decor-1{width:16%;height:14%;bottom:1%}.rhythm-stage-decor.decor-2{width:12%;height:20%;right:2%}
}
@media(max-width:370px){
 .rhythm-mode-bar button{flex-basis:100%;max-width:250px}.rhythm-performer .performer-key{display:none}
 .rhythm-stage-choices{grid-template-columns:1fr}.rhythm-stage-choices button img{height:110px}
 .rhythm-stamp-groups .stamp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .rhythm-rewards{padding:14px}.rhythm-audio-bar #audioState{max-width:230px;text-align:center}
}
@media(prefers-reduced-motion:reduce){
 body[data-game="rhythm"] *,body[data-game="rhythm"] *:before,body[data-game="rhythm"] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}