@import"https://fonts.googleapis.com/css2?family=Jua&family=Noto+Sans+KR:wght@500;700;900&display=swap";*{box-sizing:border-box}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:Noto Sans KR,sans-serif;color:#30493c;background:#193f43}button{font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:0}button:disabled{cursor:default}button:focus-visible{outline:4px solid #0369a1;outline-offset:2px}button:active:not(:disabled){transform:translateY(2px)}.game{height:100dvh;position:relative;isolation:isolate;display:flex;flex-direction:column;background:url(/assets/bg.png) center/cover}header{height:14%;padding:1.4vh 2.3vw;display:flex;align-items:flex-start;justify-content:space-between;flex-shrink:0}.brand{background:#fff7dded;padding:.5vh 1.4vw;border-radius:1.4vh;box-shadow:0 4px #886c3644}.brand small{font-size:clamp(10px,1.1vw,16px);font-weight:900;letter-spacing:.05em}h1{font-family:Jua,sans-serif;font-size:clamp(24px,3.1vw,48px);margin:0;line-height:1.2}.top-tools{display:flex;align-items:center;gap:.5vw}.top-tools button,.pace{background:#fff8e5ed;border-radius:1vh;padding:.7vh .8vw;font-size:clamp(11px,1vw,17px);font-weight:900}.scene{height:20%;position:relative;display:flex;align-items:center;justify-content:center;gap:2vw;flex-shrink:0}.scene-board{max-width:70%;background:#fff9e9f2;padding:1.5vh 3vw;border-radius:2vh;border:2px solid #c0a86a;box-shadow:0 6px #87663744;text-align:center}.scene-board h2{font:clamp(17px,2.1vw,32px) Jua,sans-serif;margin:0 0 .6vh}.scene-board p{font-size:clamp(12px,1.2vw,19px);margin:0;line-height:1.6}.lanes{height:64%;display:grid;grid-template-columns:repeat(var(--players),minmax(0,1fr));gap:1vw;padding:0 1.2vw 1vh;flex-shrink:0}.lane{position:relative;min-width:0;height:100%;display:flex;flex-direction:column;padding:3.8vh 1.6vw 2.6vh;isolation:isolate}.lane:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url(/assets/frame.png) center/100% 100% no-repeat;z-index:-1;pointer-events:none}.lane-head{display:flex;justify-content:space-between;gap:.3vw;align-items:center;padding:.4vh .5vw;border-radius:1vh;color:#fff;background:var(--color);font-size:clamp(12px,1.15vw,20px);font-weight:900;box-shadow:0 3px #0002}.lane-head small{font-size:.8em}.sprite{display:block;width:100%;height:100%;overflow:hidden}.notice{font-size:clamp(11px,1.03vw,17px);text-align:center;min-height:3.9vh;display:flex;justify-content:center;align-items:center;line-height:1.35;font-weight:700}.notice.ok{color:#12643e}.notice.error{color:#a23e2b}.action-row{display:flex;gap:.4vw;margin-top:auto}.action-row button,.primary{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;min-height:5.3vh}.action-row button{flex:1;font-size:clamp(13px,1.2vw,22px)}.action-row .secondary{background:linear-gradient(#b3e6f0,#76becf);box-shadow:0 4px #448394;color:#224d60}.action-row button:disabled{filter:grayscale(.65);opacity:.62}.footnote{height:2%;font-size:clamp(9px,.8vw,14px);text-align:center;color:#fff;text-shadow:0 1px 4px #000;font-weight:700}.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}.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}.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}.done-panel{flex:1;display:grid;place-content:center;text-align:center;gap:1vh}.done-panel strong{font:clamp(24px,3vw,44px) Jua,sans-serif;color:var(--color)}.done-panel p{font-size:clamp(12px,1.2vw,18px)}@media(max-height:600px){header{height:12%}.scene{height:18%}.lanes{height:68%}.lane{padding-top:3vh;padding-bottom:2vh}.scene-board{padding:1vh 2vw}.dialog{padding:2vh 3vw}.dialog li{padding:0}.pace{display:none}}.animal .lane{padding-left:2.1vw;padding-right:2.1vw}.animal h3{text-align:center;font:clamp(14px,1.35vw,24px) Jua;margin:1vh 0}.chain{display:flex;align-items:center;justify-content:center;gap:.15vw;height:15vh}.slot{width:29%;height:100%;background:#fffdf0;border:2px dashed #98a36a;border-radius:1vh;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0}.slot .sprite{height:75%;width:100%}.slot span{font-size:clamp(10px,.94vw,17px);font-weight:900}.slot b{font-size:3vh;color:#a1ac82}.slot.filled{border-style:solid;box-shadow:0 3px #94794033}.arrow{color:#478e48;font-size:1.5vw;font-weight:900}.animal .notice{flex:1;min-height:6vh}.choices{display:flex;gap:.5vw;height:15vh;margin:.5vh 0 1.3vh}.choices button{width:33.33%;background:#fff9e5;border:2px solid #c9b378;border-radius:1vh;display:flex;flex-direction:column;align-items:center;box-shadow:0 4px #af966b;padding:.3vh .2vw}.choices .sprite{height:75%}.choices span{font-size:clamp(11px,1.05vw,18px);font-weight:900}.choices button:disabled{opacity:.4}.animal .done-panel .sprite{height:19vh}.animal .action-row button{font-size:clamp(11px,1vw,19px)}.animal header{height:22%;align-items:center;justify-content:center;position:relative}.animal .brand{background:repeating-linear-gradient(3deg,#784f2b 0,#784f2b 5px,#80572f 6px,#80572f 9px);border:5px solid #a17843;border-radius:1vh;transform:rotate(-1deg);box-shadow:0 6px #4c3826,0 10px 15px #0004;padding:1vh 3vw;color:#fff6df;text-shadow:0 4px 0 #4c3227}.animal .brand small{display:none}.animal h1{font-size:clamp(30px,4.3vw,72px)}.animal h1:before{content:"15. ";color:#ffcb56}.animal .top-tools{position:absolute;right:1vw;top:1vh}.animal .pace{display:none}.animal .scene{height:12%;align-items:flex-start}.animal .scene-board{background:#e8cea1;border:0;border-radius:0;padding:.8vh 2vw;box-shadow:0 3px #8e693f;transform:rotate(1deg)}.animal .scene-board h2{font-size:clamp(15px,1.6vw,26px);margin:0}.animal .scene-board p{font-size:clamp(11px,1vw,17px)}.animal .lanes{height:64%;gap:.4vw;padding:0 .6vw .8vh}.animal .lane{background:linear-gradient(100deg,#ffffff08,#0002),var(--color);border:3px solid #6c8c4d;border-radius:2vh 2vh .6vh .6vh;padding:1.3vh .9vw 1.8vh;box-shadow:inset 0 0 0 3px #e7e9b755;gap:.8vh}.animal .lane:before{top:0;right:0;bottom:0;left:0;background:none;border-radius:inherit;border:2px dashed #d6dfa076}.animal .lane:after{content:"❧";font-size:5vh;color:#9cb74e;position:absolute;left:.2vw;top:-1.8vh;text-shadow:2px 2px #47793a;pointer-events:none}.animal .lane-head{background:transparent;box-shadow:none;justify-content:center;position:relative;padding:0;min-height:5vh;text-shadow:0 3px 2px #2d4d3288}.animal .lane-head b{font:clamp(25px,3vw,48px) Jua}.animal .lane-head span{position:absolute;right:.4vw;bottom:0;font-size:clamp(9px,.8vw,14px);background:#ffffffd9;color:#4c5b3a;border-radius:1vh;padding:.2vh .4vw;text-shadow:none}.animal h3{background:#f6e6bde8;box-shadow:0 4px #354e4b55;margin:0 1vw;padding:.7vh .2vw;font-size:clamp(13px,1.4vw,23px)}.animal .chain{height:14vh;flex-shrink:0;margin:1vh 0 0}.animal .slot{background:#f4eed6;border:2px dashed #b2ad8a;width:30%;box-shadow:0 4px #284d4266}.animal .arrow{color:#ffd880;text-shadow:0 2px #7d6947}.animal .notice{min-height:3.2vh;max-height:5vh;font-size:clamp(10px,.85vw,14px);color:#263c29;background:#fff7d0d9;border-radius:.8vh;padding:.2vh}.animal .choices{height:19vh;margin:0;gap:.6vw;flex-shrink:0}.animal .choices button{border:3px solid #cee3a2;background:#fffce8;border-radius:1.4vh;box-shadow:0 4px #386d4777;padding:.7vh .2vw}.animal .choices .sprite{height:80%}.animal .choices span{color:#303e2d;font-size:clamp(13px,1.3vw,22px)}.animal .action-row{gap:.9vw;margin-top:auto}.animal .action-row button{font-size:clamp(17px,1.8vw,29px);min-height:7.8vh;background:linear-gradient(#ffbf30,#ff8500);color:#fff;border:2px solid #ffdf6b;border-radius:1.7vh;box-shadow:inset 0 3px #fff5,0 5px #985611;text-shadow:0 2px #a65f2b}.animal .action-row .secondary{background:linear-gradient(#35bafa,#087cc9);border-color:#69cafe;color:#fff;box-shadow:inset 0 3px #fff5,0 5px #185687}.animal .done-panel{background:#ffffefcf;border-radius:2vh}.animal .lane{border-image-source:url(/assets/frame.png);border-image-slice:145;border-image-width:10px;border-image-repeat:stretch}.animal .action-row button:disabled{opacity:.7;filter:none}.animal .round-clock{position:absolute;left:2vw;top:3vh;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:11vw;padding:.7vh 1vw;background:#fff2cf;border:4px ridge #bf9656;border-radius:1.5vh;color:#3e5638;box-shadow:0 4px #49342055;z-index:2}.animal .round-clock small{font-size:1.5vh}.animal .round-clock strong{font:4.2vh Jua;font-variant-numeric:tabular-nums}.animal .round-clock.urgent{color:#b32924;border-color:#d36b40;background:#fff0d1}.animal .choices span,.animal .slot span{max-width:100%;text-align:center;word-break:keep-all;font-size:clamp(10px,1vw,18px);line-height:1.1}.animal .choices span{min-height:2.5vh}.animal .choices .sprite{height:75%}.animal .lane-head .score-badge{font:clamp(17px,1.65vw,28px) Jua;color:#3a5530;padding:.4vh .8vw;background:#fff7d6;border:2px solid #d9c27e;bottom:.2vh}.victory{border:6px solid #d8a947!important;background:linear-gradient(#fff8db,#fffef5)!important;max-width:760px!important}.victory-crown{font-size:8vh;line-height:1.2}.victory h2{color:#835513;font-size:clamp(26px,3.4vw,54px)!important;margin:1vh 0}.winner-points strong{color:#947015;font-size:1.5em}.victory .results .winner{background:#fff0ab;box-shadow:0 0 0 3px #dbad46,0 5px 14px #b8833733}.victory .results{margin:2vh 0}
