@import"https://fonts.googleapis.com/css2?family=Jua&family=Noto+Sans+KR:wght@500;700;900&display=swap";html,body,#root{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Noto Sans KR,Malgun Gothic,sans-serif;background:#254246}button{font:inherit;cursor:pointer;border:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible{outline:4px solid #0369a1;outline-offset:2px}button:active:not(:disabled){transform:translateY(2px)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#123e3ba6;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:grid;place-items:center;padding:2vw}.dialog{width:min(760px,85vw);max-height:94dvh;overflow:auto;background:#fff8e8;border:7px solid #ddc393;border-radius:28px;padding:3vh 3vw;box-shadow:0 20px 70px #14292299;color:#3d4e40}.dialog h2{font:clamp(28px,3vw,42px) Jua,sans-serif;margin:1vh 0 2vh}.dialog li{font-size:clamp(16px,1.5vw,23px);padding:.7vh 0;line-height:1.6}.dialog p{font-size:clamp(13px,1.1vw,18px)}.dialog .primary{width:100%;font-size:clamp(20px,1.7vw,28px);margin-top:1vh;min-height:64px;background:linear-gradient(#ffce6d,#ec963a);box-shadow:0 4px #946124;border:2px solid #fff2c0;border-radius:1.2vh;color:#503917;font-weight:900;padding:1vh .5vw}.results{display:flex;gap:10px;margin:20px 0}.results>div{flex:1;border:3px solid;border-radius:15px;display:grid;text-align:center;padding:15px}.results strong{font-size:36px}@media(max-height:600px){.dialog{padding:2vh 3vw}.dialog li{padding:0}}*{box-sizing:border-box}.workshop{height:100dvh;display:flex;flex-direction:column;background:url(/assets/bg.png) center/cover;position:relative;overflow:hidden;color:#463a2d}.workshop-header{height:15%;flex-shrink:0;display:flex;justify-content:center;align-items:center;position:relative;padding:1vh 2vw}.sign{background:linear-gradient(#936b42,#533d2d);border:5px ridge #d4ae70;border-radius:1.6vh;box-shadow:0 5px #352b2488;padding:.8vh 2.5vw;color:#fff1c4}.sign h1{font:clamp(28px,3.3vw,56px) Jua,sans-serif;margin:0;text-shadow:0 3px #4a3525}.tools{position:absolute;right:1vw;top:1vh;display:flex;gap:.4vw;font-size:clamp(10px,.9vw,15px)}.tools button,.tools>span{background:#fff6dfdf;color:#345053;border:1px solid #cab88a;border-radius:1vh;padding:.5vh .6vw;white-space:nowrap}.work-stage{height:37%;flex-shrink:0;position:relative;padding:1vh 3vw;min-height:0}.work-lanes{height:46%;display:grid;grid-template-columns:repeat(var(--players),minmax(0,1fr));gap:.8vw;padding:0 1vw 1vh;flex-shrink:0;min-height:0}.work-panel{min-width:0;min-height:0;position:relative;display:flex;flex-direction:column;gap:.8vh;border:5px solid var(--tint);border-radius:2vh;background:linear-gradient(120deg,#fff9e9f5,#e5d8bdf2);box-shadow:inset 0 0 0 2px #fff9,0 5px #4b3c3166;padding:1vh .8vw;isolation:isolate}.panel-label{display:flex;align-items:center;justify-content:space-between;gap:.3vw;border-radius:1vh;background:linear-gradient(#fff2,#0001),var(--tint);color:#fff;padding:.4vh .5vw;min-height:4.5vh;margin:-1.1vh -.65vw .5vh;font-weight:900;font-size:clamp(12px,1.15vw,19px);box-shadow:0 3px #5d574755}.panel-label b{font:clamp(20px,2vw,34px) Jua}.panel-label small{font-size:.72em}.work-panel button{touch-action:manipulation}.prompt-box,.sequence{background:#fff8e9;border:2px solid #c9b994;border-radius:1vh;padding:.7vh .5vw;text-align:center;font-weight:700;font-size:clamp(14px,1.3vw,22px);line-height:1.45}.number-options,.options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6vw}.options button,.number-options button,.key{min-height:5.8vh;border:2px solid #fff8;border-radius:1vh;background:linear-gradient(#fffdf5,#e7daba);box-shadow:0 4px #a78d68;color:#403a31;font:700 clamp(15px,1.5vw,25px)/1.3 "Malgun Gothic","Noto Sans KR",sans-serif;padding:.7vh .3vw}.options button.selected,.number-options button.selected,.key.selected{background:linear-gradient(#fff4a8,#ffd370);outline:3px solid var(--tint);outline-offset:-2px}.confirm,.aux{border:2px solid #fff8;border-radius:1.3vh;padding:.7vh .4vw;min-height:5.8vh;background:linear-gradient(#fff3,#0001),var(--tint,#4b9f77);box-shadow:inset 0 2px #fff6,0 4px #4d655c;color:#fff;font-weight:900;font-size:clamp(13px,1.2vw,21px)}.confirm:disabled,.aux:disabled{background:#c6c7b6;color:#737969;box-shadow:0 3px #999c8d;cursor:default}.aux{background:linear-gradient(#fff1a0,#e4b64d);color:#584320;box-shadow:0 4px #9a7b36}.work-actions{display:flex;gap:.5vw;margin-top:auto;flex-shrink:0}.work-actions>button{flex:1;min-width:0}.feedback{min-height:3.8vh;line-height:1.4;font-size:clamp(11px,.96vw,16px);padding:.4vh .3vw;text-align:center;color:#36544b;font-weight:700;background:#fffbeecc;border-radius:.8vh;display:flex;align-items:center;justify-content:center}.work-footer{height:2%;text-align:center;font-size:clamp(9px,.8vw,14px);color:#fff;text-shadow:0 1px 3px #000;background:#243e4455;flex-shrink:0}.atlas{width:100%;height:100%;display:block;overflow:hidden}.shared-board{background:#fff7e6ef;border:4px ridge #c7ac79;border-radius:1.4vh;padding:1vh 1.5vw;box-shadow:0 4px #66523777;text-align:center}.shared-board h2{font:clamp(19px,2vw,34px) Jua;margin:.4vh 0}.shared-board p{font-size:clamp(12px,1.1vw,19px);margin:.5vh 0}.goal-done{flex:1;display:grid;place-content:center;text-align:center;color:#417257;gap:1vh;font-size:clamp(14px,1.3vw,22px)}.goal-done strong{font:clamp(25px,2.7vw,44px) Jua}.slot-strip{display:flex;gap:.5vw;justify-content:center;align-items:center}.slot-strip span{background:#fff9e7;border:2px solid #c7b995;border-radius:.6vh;padding:.7vh .5vw;min-width:3vw;font:700 clamp(20px,2vw,34px) "Malgun Gothic",sans-serif;text-align:center}.slot-strip .empty{border-style:dashed;color:#ad9c7e;background:#fff5c3}.status-badge{background:#fff9e6;border:2px solid #cab480;border-radius:2vh;padding:.4vh 1vw;font-size:clamp(12px,1.1vw,19px);font-weight:900}.gauge-bottle{width:100%;height:100%;overflow:visible}@media(max-height:650px){.tools>span{display:none}.work-panel{gap:.5vh;padding:.8vh .7vw}.feedback{font-size:11px;min-height:3.5vh}.sign h1{font-size:clamp(23px,3vw,40px)}}.slide .workshop-header{height:12%}.slide .sign{background:linear-gradient(#fdd689,#ed9e56);color:#744331;border:4px solid #fff0ba}.slide .sign h1{text-shadow:0 2px #fff6}.slide .work-lanes{height:86%;gap:1.2vw}.slide .work-panel{background:linear-gradient(90deg,#ffffff7d,transparent 25%,#ffffff22 60%,#ffffff9b),var(--tint);border-radius:5vh 5vh 1vh 1vh;border:5px ridge #fff7;padding:1.2vh .8vw;gap:.6vh}.slide .panel-label{margin:0 2vw}.slide-progress{height:2.7vh;border:3px solid #dec69a;border-radius:3vh;background:#886e48;overflow:hidden;margin:0 2vw}.slide-progress i{display:block;height:100%;background:linear-gradient(#baff6c,#43b95e);transition:width .5s}.slide-course{flex:1;min-height:0;position:relative;overflow:hidden;border-left:6px solid #ffffff4a;border-right:6px solid #ffffff66}.water-streaks{position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(93deg,transparent 0 13%,#fff3 14% 15%,transparent 16% 24%);opacity:.8}.rider{position:absolute;left:4%;width:92%;height:70%;transition:top .8s ease}.splash{position:absolute;bottom:-2vh;left:20%;font-size:9vh;color:#d2f9ff;opacity:.7}.slide-question{background:linear-gradient(#b99066,#886441);border:5px ridge #c5a274;border-radius:2vh;padding:.8vh .5vw;display:flex;flex-direction:column;gap:.8vh;flex-shrink:0}.slide .prompt-box{min-height:7vh;font-size:clamp(14px,1.4vw,23px)}.slide .options button{border-radius:3vh;background:linear-gradient(#fff7,#fff2),var(--tint);color:#283b35;font-size:clamp(14px,1.5vw,25px);min-height:7vh}.slide .feedback{font-size:clamp(10px,.9vw,15px)}.slide .goal-done{background:#fff8df;border-radius:2vh;flex:0;padding:2vh}.slide .work-panel:nth-child(2){--tint:#eac053!important}.slide .work-panel:nth-child(3){--tint:#4cabe2!important}.slide .work-panel:nth-child(4){--tint:#6ab77c!important}.work-panel{--sprite-x:0%}.work-panel:nth-child(2){--sprite-x:33.333333%}.work-panel:nth-child(3){--sprite-x:66.666667%}.work-panel:nth-child(4){--sprite-x:100%}.workshop .work-panel :where(.key,.confirm,.aux,.options button,.number-options button){position:relative;isolation:isolate;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:1.5vh;color:#382c20;padding:.8vh .55vw;font-weight:900;--key-x:0%;--key-y:22%}.workshop .work-panel :where(.key,.confirm,.aux,.options button,.number-options button):before{content:"";position:absolute;top:-.2vh;right:-.2vw;bottom:-.2vh;left:-.2vw;z-index:-1;background:url(/assets/controls.png) var(--key-x) var(--key-y)/300% 280% no-repeat;pointer-events:none}.workshop .work-panel .confirm{--key-x:0%;--key-y:82%;color:#fff;text-shadow:0 1px 2px #17472d}.workshop .work-panel .aux{--key-x:50%;--key-y:82%}.workshop .work-panel :where(.key,.confirm,.aux,.options button,.number-options button):disabled{opacity:.6;filter:saturate(.45);color:#3b443e;text-shadow:none}.workshop .work-panel :where(.key,.options button,.number-options button).selected{outline:3px solid #fff171;outline-offset:-4px;filter:brightness(1.08)}.work-panel button:focus-visible{outline:3px solid #24c6ff!important;outline-offset:2px}.workshop .feedback{box-shadow:none}.workshop .work-panel :where(.key,.confirm,.aux,.options button,.number-options button){display:grid;place-items:center;padding:.2vh .4vw;line-height:1.15}.workshop .work-panel :where(.key,.confirm,.aux,.options button,.number-options button):disabled{opacity:.72;color:#fff9e9;text-shadow:0 1px 2px #251b13;filter:saturate(.35)}.slide .workshop-header{height:9%}.slide .sign{padding:.3vh 2vw;border-width:3px}.slide .sign h1{font-size:2.6vw}.slide .work-lanes{height:89%;gap:0;padding:0 1vw 1vh}.slide .work-panel{background:none;border:0;box-shadow:none;border-radius:0;padding:0 1.2vw 1.5vh;gap:0}.slide .work-panel:before{content:"";position:absolute;top:-1vh;right:-1vw;bottom:0;left:-1vw;z-index:-1;background:url(/assets/reference-art.png) var(--sprite-x) center/400% 100% no-repeat}.slide .panel-label{margin:2vh 4vw .5vh;background:var(--tint);border:2px ridge #fcebc0;box-shadow:0 3px 2px #69382455;min-height:3.8vh;padding:0 .6vw}.slide .panel-label b{font-size:2.6vh}.slide .panel-label span{font-size:1.4vh}.slide .panel-label small{display:none}.slide .slide-progress{margin:0 4vw;height:2vh;border-width:2px}.slide .slide-course{border:0;overflow:visible}.slide .water-streaks,.slide .splash{display:none}.slide .rider{left:-1%;width:102%;height:85%;filter:drop-shadow(0 6px 3px #16435c55)}.slide .slide-question{z-index:2;min-height:21vh;padding:1.2vh .8vw;gap:.7vh;border-radius:2vh;border-width:5px;background:linear-gradient(105deg,#b79369,#84603d);box-shadow:0 6px 3px #61412680}.slide .prompt-box{min-height:5.8vh;padding:.7vh .2vw;font-size:1.9vh;background:#fff1d7;border:2px solid #bea074}.slide .options button{min-height:5.8vh;font-size:2.5vh;--key-y:22%;--key-x:0%}.slide .feedback{font-size:1.2vh;min-height:2.7vh;background:#fff1d4dd;padding:.2vh}.slide .next{min-height:5vh;font-size:1.7vh}.slide .goal-done{z-index:2;margin-top:auto}.slide .work-panel:nth-child(1) .options button{--key-x:100%;--key-y:22%;color:#fff}.slide .work-panel:nth-child(2) .options button{--key-x:50%;--key-y:82%}.slide .work-panel:nth-child(3) .options button{--key-x:50%;--key-y:22%;color:#fff}.slide .work-panel:nth-child(4) .options button{--key-x:0%;--key-y:82%;color:#fff}.slide .rider{height:75%;top:8%}.slide .slide-question{background-image:linear-gradient(105deg,#b79369,#84603d)}.slide .slide-question{background:url(/assets/board.png) center/100% 100% no-repeat;border:0;box-shadow:none;padding:2vh 1.5vw 1.5vh;min-height:24vh}.slide .prompt-box{background:none;border:0;min-height:6vh}.slide .options{margin-top:1vh}.slide .feedback{background:#fff2d4da;margin-top:.5vh}.slide .slide-question:has(.next){min-height:29vh}.slide-race .workshop-header{position:absolute;z-index:12;left:0;right:0;top:0;height:8%;padding:.5vh 1vw;pointer-events:none}.slide-race .sign{padding:.25vh 1.7vw;border-width:3px;border-radius:1vh;pointer-events:auto}.slide-race .sign h1{font-size:2.2vw}.slide-race .tools{pointer-events:auto}.slide-race .work-lanes{height:98%;padding:0 .35vw .5vh;gap:.3vw}.slide-race .work-panel{display:block;height:100%;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:hidden}.slide-race .work-panel:before{top:0;right:0;bottom:0;left:0;background:url(/assets/reference-art.png) var(--sprite-x) center/400% 100% no-repeat}.slide-race .panel-label{position:absolute;z-index:5;top:8.3%;left:24%;right:24%;height:5.2%;min-height:0;margin:0;padding:0;display:grid;place-items:center;border:2px ridge #ffe7a8;border-radius:1.2vh;box-shadow:0 2px 2px #57351e66}.slide-race .panel-label b{font:2.8vh/1 Jua,sans-serif}.slide-race .panel-label span,.slide-race .panel-label small{display:none}.slide-race .slide-progress{position:absolute;z-index:5;top:13.8%;left:24%;right:24%;height:2.2%;margin:0;border:2px solid #9c6b3e;border-radius:2vh;background:#71492d;box-shadow:inset 0 1px 2px #29160b}.slide-race .slide-course{position:absolute;z-index:2;left:6%;right:6%;top:14.5%;height:55%;border:0;overflow:hidden}.slide-race .water-streaks{display:block;position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(94deg,transparent 0 18%,#fff5 19% 20%,transparent 21% 35%);opacity:.7}.slide-race .rider{position:absolute;left:6%;top:2%;width:88%;height:50%;filter:drop-shadow(0 6px 3px #16435c55)}.slide-race .rider.swoosh{animation:slide-swoosh 1s cubic-bezier(.2,.64,.25,1) both}.slide-race .splash{display:block;position:absolute;left:25%;top:73%;font-size:8vh;color:#e4fbff;opacity:0;transform:scale(.4)}.slide-race .splash.active{animation:splash-pop 1s ease-out}.slide-race .slide-course:has(.rider.swoosh) .water-streaks{animation:water-speed 1s linear both}@keyframes slide-swoosh{0%{transform:translateY(0) scale(1);opacity:1}18%{transform:translateY(7%) scale(1.035) rotate(-1deg)}72%{transform:translateY(76%) scale(1.015) rotate(1deg);opacity:1}92%{transform:translateY(94%) scale(.98) rotate(0);opacity:1}to{transform:translateY(98%) scale(.96);opacity:0}}@keyframes splash-pop{0%,68%{opacity:0;transform:scale(.3)}82%{opacity:1;transform:scale(1.3)}to{opacity:0;transform:scale(1.85) translateY(1.5vh)}}@keyframes water-speed{0%{background-position:0 0;opacity:.35}75%{background-position:0 18vh;opacity:.9}to{background-position:0 24vh;opacity:.3}}.slide-race .slide-question{position:absolute;z-index:7;left:5%;right:5%;bottom:2%;height:31%;min-height:0;padding:2.55vh 1vw 1.15vh;display:flex;flex-direction:column;justify-content:center;gap:.7vh;background:url(/assets/board.png) center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none}.slide-race .prompt-box{width:100%;height:8.8vh;min-height:0;margin:0 auto;padding:.35vh 1vw;display:grid;align-items:center;justify-items:center;background:none;border:0;color:#3b2416;font-family:Jua,Noto Sans KR,sans-serif;font-size:clamp(22px,1.55vw,29px);font-weight:900;line-height:1.22;letter-spacing:-.02em;text-align:center;white-space:normal;word-break:keep-all;overflow-wrap:normal;text-shadow:0 1px 0 #fff8e8}.slide-race .options{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:.55vw}.slide-race .options button{width:100%;height:7.35vh;min-height:0;padding:0 .35vw;display:grid;place-items:center;text-align:center;font:clamp(17px,1.58vw,27px)/1 Jua,sans-serif;border-radius:2vh}.slide-race .feedback{height:4.2vh;min-height:0;margin:0;padding:.25vh .3vw;display:grid;place-items:center;background:#fff3d9e8;font-size:clamp(10px,.82vw,14px)}.slide-race .penalty-overlay{position:absolute;z-index:20;top:1.2vh;right:.65vw;bottom:1.2vh;left:.65vw;display:grid;grid-template-rows:auto auto;align-content:center;justify-items:center;gap:.5vh;border:3px solid #b84438;border-radius:2.2vh;background:linear-gradient(180deg,#fff8e8f5,#ffe1c7f5);color:#6f241e;text-align:center;box-shadow:inset 0 0 0 3px #fff8e0,0 .7vh 1.2vh #58201855;animation:penalty-bump .32s ease-out}.slide-race .penalty-overlay strong{font:clamp(54px,5.4vw,88px)/.9 Jua,sans-serif;color:#d7473b;text-shadow:0 3px 0 #fff,0 5px 0 #8c2e27}.slide-race .penalty-overlay span{font:clamp(17px,1.25vw,23px)/1.15 Jua,sans-serif}@keyframes penalty-bump{0%{transform:scale(.86);opacity:0}65%{transform:scale(1.035)}to{transform:scale(1);opacity:1}}.slide-race .work-footer{position:absolute;z-index:10;left:0;right:0;bottom:0;height:2%;background:#204b6177}.slide-race .slide-result .winner{background:#fff0a9;border-color:#e0a52f;box-shadow:0 0 0 3px #ffe288}