:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#11151b;color:#edf3ef}*{box-sizing:border-box}[hidden]{display:none}body{margin:0;min-height:100svh;padding:1rem}main{width:100%;max-width:34rem;margin:0 auto;text-align:center}.gameplay{min-height:calc(100svh - 3.25rem)}a{color:#bce8d1}.eyebrow{color:#a8cebc;font-size:.875rem}h1{font-size:clamp(3rem,14vw,5rem);letter-spacing:.12em;margin:1rem 0}.description{font-size:1.25rem;line-height:1.6}.home-page{padding:1rem 0}button,.button{display:inline-flex;align-items:center;justify-content:center;font:inherit;min-height:2.75rem;padding:.6rem 1rem;border-radius:.5rem;border:1px solid #718c7e;background:#25352e;color:#edf3ef;cursor:pointer;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.6}button:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #c8f8df;outline-offset:3px}input{width:100%;padding:.75rem;margin-top:.5rem;font:inherit}.status{color:#bac7cf;font-size:.875rem;line-height:1.4}#rooms{list-style:none;padding:0;text-align:left}.room-listing{display:grid;grid-template-columns:1fr auto;gap:.3rem .6rem;padding:.8rem;margin:.6rem 0;border:1px solid #52665d;border-radius:.6rem}.room-state{grid-column:1;font-size:.875rem;color:#bac7cf}.room-join{grid-column:2;grid-row:1 / 3}.room-page>.description{font-size:1rem;line-height:1.35;margin:0 0 .6rem}.phase-guide{padding:.4rem;border:1px solid #52665d;border-radius:.65rem}.phase-guide ol{display:flex;justify-content:space-between;align-items:center;list-style:none;margin:0;padding:0;gap:.1rem}.phase-guide li:not([aria-hidden]){padding:.45rem .35rem;border:2px solid transparent;border-radius:.3rem;font-weight:650}.phase-guide [aria-current=step]{color:#11151b;background:#c8f8df;border-color:#edf3ef;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}#guide-return{min-height:1.75rem;margin:.25rem 0 0;font-size:.75rem;color:#c8f8df}#guide-return[data-flow=loop]{position:relative;margin:.25rem 1rem 0;border:1px solid #718c7e;border-top:0;border-radius:0 0 .5rem .5rem;padding:.15rem 0 .3rem}#guide-return[data-flow=loop]:before{content:"\2191";position:absolute;top:-.6rem;left:-.3rem;font-size:1rem}#guide-return[data-flow=stopped]{color:#ffe2ac}#connection{margin:.35rem 0;font-size:.75rem}#connection-recovery{display:flex;gap:.4rem;justify-content:center;margin:.5rem 0}#connection-recovery[hidden]{display:none}#round-guidance{font-size:.875rem;line-height:1.35;margin:.5rem 0}.lobby-ready{display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap}.lobby-ready p{margin:0;font-size:.75rem}#lobby-roster{display:grid;grid-template-columns:repeat(2,1fr);gap:.25rem .5rem;list-style:none;padding:0;margin:.4rem 0;text-align:left;font-size:.75rem}#lobby-roster li{border-left:2px solid #718c7e;padding-left:.4rem}#lobby-roster [data-ready=true]{border-left:4px double #c8f8df}#ready{background:#c8f8df;color:#11151b;font-weight:700;font-size:.85rem;padding:.6rem .75rem}#group{margin:.4rem 0;font-size:.75rem}.personal-cues{min-height:6.25rem;padding:.4rem 0}#phase{font-size:1.15rem;line-height:1.2;min-height:2.4em;margin:0 0 .3rem}#caller{font-size:.8rem;line-height:1.3;margin:.3rem 0}#caller:empty{display:none}#cycle-status{font-size:.75rem;line-height:1.3;margin:.25rem 0;color:#bac7cf}#room[data-state=lobby] .personal-cues{min-height:0;padding:.15rem 0}#room[data-state=lobby] #phase{display:none}.performance-stage{position:relative;height:clamp(12.5rem,30svh,17rem)}.flower-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;border-radius:.5rem}.flower-caption{position:absolute;top:.5rem;left:.75rem;font-size:.75rem;color:#a8cebc;pointer-events:none}#tap{position:relative;background:linear-gradient(transparent 25%,#11151bee 75%);padding:.5rem;border:3px solid transparent;border-radius:.75rem;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:.25rem;width:100%;min-height:9rem;height:100%;margin:0;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;font-size:1.6rem;text-align:center}.drum-pads{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;width:100%;margin-top:.2rem}.drum-pads button{min-height:4rem;padding:.5rem;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border:2px solid currentColor;border-radius:1rem 1rem .6rem .6rem;font-size:1.05rem;font-weight:750}#pad-low{color:#ffe2ac;background:#41311f}#pad-high{color:#bceaff;background:#173a4b}.drum-pads button:disabled{opacity:.5}#pad-low.lit,#pad-high.lit{opacity:1;background:#edf3ef;color:#11151b;box-shadow:0 0 1rem #edf3ef88}#sound-hint{margin:.25rem 0;font-size:.75rem;color:#ffe2ac}#tap-title{font-size:clamp(1.2rem,5.5vw,1.75rem);line-height:1.15}#tap-instruction,#tap-timer{font-size:.85rem;line-height:1.3}#tap-timer{min-height:1.3em;font-variant-numeric:tabular-nums}#tap[data-cue=prepare]{border:3px solid #f4c477;color:#ffe2ac;background:linear-gradient(#f4c47722,#11151bf5 70%)}#tap[data-cue=call]{border:3px solid #a8cebc;color:#edf3ef;background:linear-gradient(#a8cebc44,#25352ef5 70%)}#tap[data-cue=echo]{border:3px solid #8ccbe8;color:#edf3ef}#tap[data-owner=true]{border-color:#ffe2ac;background:linear-gradient(#705022dd,#302715f5);box-shadow:0 0 0 2px #f4c47744,inset 0 0 2rem #f4c47722}#tap[data-owner=true] #tap-title{color:#fff0cd;letter-spacing:.06em;font-weight:900}#tap[data-cue=call] .drum-pads button{border-width:3px;opacity:1}#tap[data-cue=reveal]{background:transparent;border-color:transparent;visibility:hidden}#next-caller{position:absolute;z-index:1;top:2rem;left:.5rem;right:.5rem;margin:0;padding:.6rem;border-radius:.5rem;background:#11151bf2;font-size:1rem;pointer-events:none}#next-caller[data-yours=true]{background:#f4c477;color:#11151b;font-weight:700}.stage-toolbar{display:flex;justify-content:space-between;align-items:center;gap:.4rem;margin-top:.4rem}.mute-control{display:inline-flex;gap:.3rem;align-items:center;min-height:2.75rem;font-size:.875rem}#mute{width:1.1rem;height:1.1rem;margin:0}#room-actions{display:flex;gap:.4rem}#room-actions button{padding:.5rem .75rem}#replay{background:#c8f8df;color:#11151b;font-weight:700}#cycle-result{font-size:.875rem;line-height:1.4}#cycle-result:empty{display:none}#collective{position:absolute;inset:0;height:100%;overflow:hidden;border-radius:1.5rem;background:transparent;pointer-events:none}.performance-stage.terminal #tap,.performance-stage.terminal #collective{display:none}.reveal-wisp{position:absolute;top:50%;left:50%;width:2rem;height:2rem;margin:-1rem;will-change:transform}.wisp{display:inline-block;width:1.25rem;height:1.25rem;flex-shrink:0;background:currentColor}.reveal-wisp .wisp{width:100%;height:100%;box-shadow:0 0 1rem currentColor}.circle{border-radius:50%}.diamond{transform:rotate(45deg)}.triangle{clip-path:polygon(50% 0,100% 100%,0 100%)}.mint{color:#a8cebc}.amber{color:#f4c477}.violet{color:#c5a7ed}.sky{color:#8ccbe8}details{margin-top:1rem;text-align:left;border-top:1px solid #35453e;padding-top:.4rem}summary{cursor:pointer;min-height:2.75rem;padding:.65rem 0}#participants{padding:0;list-style:none;text-align:left}#participants li{display:flex;gap:1rem;align-items:center;padding:.75rem}.invite-qr{margin:1.5rem 0}.invite-qr img{display:block;max-width:100%;height:auto;margin:0 auto .75rem}.room-brand{margin:1.5rem 0;font-weight:650}.timing-values,#cycle-debug{white-space:pre-wrap;overflow-wrap:anywhere}#cycle-debug{font-size:.75rem}.timing-pulse{width:3rem;height:3rem;margin:1rem auto;border:2px solid #a8cebc;border-radius:50%}.timing-pulse.lit{background:#a8cebc}.flower-preview,textarea{width:100%}.flower-parameters{max-height:16rem;overflow:auto;font-size:.75rem}@media(max-width:350px){body{padding:.75rem}.phase-guide li:not([aria-hidden]){padding:.4rem .2rem;font-size:.875rem}#connection-recovery .button,#connection-recovery button{padding:.5rem .65rem}}
