.dance-nav{display:inline-flex;align-items:center;gap:8px;border:1px solid #dce3f2;background:#edf1ff;color:#234bdf;border-radius:30px;padding:9px 18px;font-size:14px;font-weight:700}.dance-nav span{color:#e57c39;font-size:19px}.dance-open{overflow:hidden}.dance-open>header,.dance-open>main,.dance-open>footer{visibility:hidden}#dance-page[hidden]{display:none}#dance-page{--dance-ink:#17132e;position:fixed;inset:0;z-index:100;background:var(--dance-ink);color:#f7f4ff;overflow-y:auto;overflow-x:hidden;isolation:isolate;padding:26px 5vw 30px;display:flex;flex-direction:column;min-height:100dvh;font-family:'DM Sans','Noto Sans Devanagari',sans-serif}#dance-page button:focus-visible,#dance-page input:focus-visible{outline:3px solid #ffe15b;outline-offset:5px}.dance-top{display:flex;justify-content:space-between;align-items:center;gap:15px;position:relative;z-index:2;min-height:42px}.dance-back{border:1px solid #514763;border-radius:24px;padding:10px 17px;color:#eee7ff;background:#241d3c;font-size:14px}.dance-brand{font-family:Manrope,sans-serif;font-size:20px;font-weight:800;letter-spacing:-.7px}.dance-brand b{font-weight:500;color:#b7a8d6}.dance-live{font-size:11px;letter-spacing:2px;color:#b2a6c8}.dance-intro{position:relative;text-align:center;margin:7vh auto 26px;z-index:1}.dance-kicker{font-size:12px;letter-spacing:2.5px;font-weight:700;color:#c1addf}.dance-intro h1{font-size:clamp(50px,6.2vw,84px);line-height:1.07;letter-spacing:-3px;margin:21px 0}.dance-intro em{font-family:Georgia,serif;color:#ffe15b;font-weight:400}.dance-intro p{color:#c0b6d1;font-size:17px}.dance-form{position:relative;z-index:2;width:min(610px,100%);margin:0 auto}.dance-form>label{display:block;font-size:13px;font-weight:600;margin-bottom:8px;color:#d5cae5}.dance-input-row{display:flex;border:1px solid #625374;border-radius:16px;background:#2c2443;padding:6px;box-shadow:0 12px 45px #0002;gap:6px}.dance-input-row input{font:inherit;width:100%;min-width:0;background:transparent;border:0;color:white;padding:12px 14px;font-size:18px;outline:none}.dance-input-row input::placeholder{color:#a899bd;font-size:16px}.dance-go{border:0;background:#ffe15b;color:#282035;border-radius:11px;padding:13px 20px;font-weight:800;white-space:nowrap;display:flex;gap:14px;align-items:center}.dance-go span{font-size:22px}.dance-form>p{color:#a99aba;font-size:12px;text-align:center;margin:10px 0 0}.dance-orb{position:absolute;z-index:-1;border:1px solid #6f4b882e;border-radius:50%;pointer-events:none}.orb-one{width:680px;height:680px;left:-470px;top:17vh;box-shadow:0 0 0 90px #a16fdb08,0 0 0 180px #a16fdb05}.orb-two{width:450px;height:450px;right:-300px;top:-100px;box-shadow:0 0 0 75px #d2709808,0 0 0 150px #d2709805}.dance-grid{position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 70% 100%,#57375b55,transparent 60%),radial-gradient(ellipse at 5% 0%,#34285f66,transparent 50%)}.dance-stage{position:relative;display:none;flex:1;min-height:330px;margin:16px auto 0;width:100%;align-items:center;justify-content:center;padding:65px 0 85px;perspective:1000px}.dance-word{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;width:100%;max-width:1120px;column-gap:.01em;row-gap:40px;font-size:clamp(42px,calc(86vw / var(--count,5) * 1.2),170px);font-family:Manrope,'Noto Sans Devanagari',sans-serif;font-weight:800;line-height:1.3;letter-spacing:-.025em;padding:10px 15px}.dance-letter{color:var(--letter-color);display:inline-block;transform-origin:center bottom;animation:dance-bounce 1.25s ease-in-out var(--delay) infinite;text-shadow:0 4px 0 #0002,0 9px 0 #0001;will-change:transform}.dance-letter>span{display:inline-block}.dance-floor{position:absolute;left:15%;right:15%;height:2px;bottom:60px;background:linear-gradient(90deg,transparent,#8f70b5,transparent);box-shadow:0 18px 70px 20px #9767b522;transform:rotate(-3deg)}.dance-stage-label{position:absolute;bottom:16px;font-size:10px;letter-spacing:3px;color:#a799bc}.dance-echo{position:absolute;left:0;top:20%;font-family:Manrope,sans-serif;font-size:clamp(60px,8vw,130px);font-weight:800;line-height:.88;letter-spacing:-5px;color:#ffffff03;transform:rotate(-9deg);pointer-events:none}.dance-controls{display:flex;justify-content:center;align-items:center;gap:30px;position:relative;z-index:2;margin:26px auto 0;flex-wrap:wrap}.dance-styles{display:flex;border:1px solid #4c405f;border-radius:30px;padding:5px;gap:4px}.dance-styles button{background:none;border:0;border-radius:24px;padding:9px 19px;color:#b7a9cd;font-size:14px;font-weight:600}.dance-styles button[aria-pressed=true]{background:#eee7ff;color:#31223f}.dance-stop{display:none;align-items:center;gap:22px;background:#ff9dcb;border:0;border-radius:30px;color:#322036;padding:14px 23px;font-weight:800}.dance-stop span{font-size:14px}.dance-status{height:25px;margin:16px auto 0;text-align:center;font-size:13px;color:#bdafcf}.dance-motion-note{text-align:center;font-size:13px;color:#bbaacb;margin:15px auto;max-width:500px}.has-word .dance-intro{display:none}.has-word .dance-form{margin:25px auto 0;max-width:550px}.has-word .dance-form>label,.has-word .dance-form>p{display:none}.has-word .dance-stage{display:flex}.has-word .dance-stop{display:flex}.has-word .dance-controls{margin-top:5px}.is-paused .dance-letter,.is-paused .dance-letter>span{animation-play-state:paused!important}#dance-page[data-move=wave] .dance-letter{animation-name:dance-wave;animation-duration:2s}#dance-page[data-move=spin] .dance-letter{animation-name:dance-twirl;animation-duration:3.1s}#dance-page[data-move=spin] .dance-letter>span{animation:dance-sway 3.1s ease-in-out var(--delay) infinite}@keyframes dance-bounce{0%,100%{transform:translateY(0) rotate(-5deg) scale(1.03,.98)}35%{transform:translateY(-45px) rotate(8deg) scale(.98,1.04)}65%{transform:translateY(5px) rotate(-3deg) scale(1.07,.93)}80%{transform:translateY(-10px) rotate(1deg)}}@keyframes dance-wave{0%,100%{transform:translateY(20px) rotate(-10deg)}50%{transform:translateY(-30px) rotate(10deg)}}@keyframes dance-twirl{0%,15%{transform:translateY(0) rotateY(0) rotate(-4deg)}50%{transform:translateY(-28px) rotateY(180deg) rotate(7deg)}85%,100%{transform:translateY(0) rotateY(360deg) rotate(-4deg)}}@keyframes dance-sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}@media(prefers-reduced-motion:reduce){/* Motion starts only after an explicit dance submission. */#dance-page.has-word:not(.is-paused) .dance-letter{animation:dance-gentle 3s ease-in-out var(--delay) infinite!important}#dance-page .dance-letter>span{animation:none!important}@keyframes dance-gentle{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}}@media(max-width:760px){.header-end{gap:8px}.dance-nav{padding:7px 11px;font-size:13px;gap:5px}.dance-nav span{font-size:15px}#dance-page{padding:18px 18px 20px}.dance-top{gap:9px}.dance-brand{font-size:15px}.dance-brand b{display:none}.dance-back{font-size:12px;padding:9px 12px}.dance-live{font-size:9px;letter-spacing:1px}.dance-intro{margin-top:9vh}.dance-intro h1{font-size:55px;letter-spacing:-2px}.dance-kicker{font-size:10px;letter-spacing:1.6px}.dance-intro p{font-size:15px}.dance-go{padding:12px;font-size:14px;gap:8px}.dance-go span{display:none}.dance-input-row input{padding:12px 8px;font-size:16px}.dance-input-row input::placeholder{font-size:13px}.dance-controls{gap:16px}.dance-styles button{padding:9px 16px}.dance-stage{min-height:320px;padding:70px 0}.dance-word{font-size:clamp(40px,calc(85vw / var(--count,5) * 1.55),100px);max-width:100%;row-gap:38px;line-height:1.5;padding:10px 0}.dance-stop{padding:12px 21px}.dance-stage-label{font-size:8px;letter-spacing:2px}.dance-status{font-size:12px;min-height:36px}.has-word .dance-form{margin-top:20px}.dance-echo{font-size:70px}.has-word .dance-stage{margin-top:10px}}@media(max-width:380px){header .brand{font-size:19px}header .brand-icon{margin-right:7px;width:29px;font-size:27px}header{padding:0 13px}.dance-nav{padding:7px 9px}.points{padding:5px 9px}}
/* Ten-style shuffle; only the Dance page is affected. */
#dance-page[data-move=swing] .dance-letter{animation-name:dance-swing;animation-duration:1.8s;transform-origin:top center}
#dance-page[data-move=hop] .dance-letter{animation-name:dance-hop;animation-duration:1.5s}
#dance-page[data-move=jelly] .dance-letter{animation-name:dance-jelly;animation-duration:1.9s}
#dance-page[data-move=zigzag] .dance-letter{animation-name:dance-zigzag;animation-duration:2s}
#dance-page[data-move=float] .dance-letter{animation-name:dance-float;animation-duration:3s}
#dance-page[data-move=march] .dance-letter{animation-name:dance-march;animation-duration:1.3s}
#dance-page[data-move=rock] .dance-letter{animation-name:dance-rock;animation-duration:1.6s}
@keyframes dance-swing{0%,100%{transform:rotate(-18deg) translateY(0)}50%{transform:rotate(18deg) translateY(-15px)}}
@keyframes dance-hop{0%,100%{transform:translate(0,0) scale(1.05,.95)}30%{transform:translate(-12px,-45px) rotate(-8deg)}60%{transform:translate(12px,-20px) rotate(8deg)}80%{transform:translate(0,3px) scale(1.12,.88)}}
@keyframes dance-jelly{0%,100%{transform:scale(1) rotate(0)}25%{transform:scale(1.2,.8) rotate(-8deg)}50%{transform:scale(.85,1.15) translateY(-18px)}75%{transform:scale(1.1,.9) rotate(8deg)}}
@keyframes dance-zigzag{0%,100%{transform:translate(-12px,0) rotate(-8deg)}25%{transform:translate(10px,-18px) rotate(8deg)}50%{transform:translate(-10px,-36px) rotate(-8deg)}75%{transform:translate(12px,-18px) rotate(8deg)}}
@keyframes dance-float{0%,100%{transform:translate(-12px,5px) rotate(-6deg)}50%{transform:translate(12px,-32px) rotate(6deg)}}
@keyframes dance-march{0%,50%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-28px) rotate(-12deg)}75%{transform:translateY(-28px) rotate(12deg)}}
@keyframes dance-rock{0%,100%{transform:rotate(-15deg) scale(1)}50%{transform:rotate(15deg) scale(1.1) translateY(-12px)}}
.dance-styles{flex-wrap:wrap;justify-content:center}.dance-styles button[data-move=random][aria-pressed=true]{background:#ffe15b;color:#2c2040}
@media(max-width:760px){.dance-styles button{padding:9px 13px}.dance-controls{gap:13px}}
/* The playing surface contains only the moving word. */
#dance-page.dance-immersive{padding:0;overflow:hidden;cursor:pointer}
#dance-page.dance-immersive>.dance-top,#dance-page.dance-immersive>.dance-intro,#dance-page.dance-immersive>.dance-form,#dance-page.dance-immersive>.dance-controls,#dance-page.dance-immersive>.dance-status,#dance-page.dance-immersive>.dance-motion-note,#dance-page.dance-immersive>.dance-orb{display:none!important}
#dance-page.dance-immersive .dance-stage{position:fixed;inset:0;width:100%;height:100%;min-height:0;margin:0;padding:0;display:block;overflow:hidden;outline:none}
#dance-page.dance-immersive .dance-echo,#dance-page.dance-immersive .dance-floor,#dance-page.dance-immersive .dance-stage-label{display:none!important}
#dance-page.dance-immersive .dance-word{position:absolute;left:0;top:0;width:max-content;max-width:none;flex-wrap:nowrap;gap:0;padding:0;margin:0;line-height:1.5;will-change:transform}
#dance-page:not(.dance-immersive) .dance-word{font-size:clamp(42px,calc(86vw / var(--count,5) * 1.2),170px)!important}