@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&family=Noto+Sans+KR:wght@400;500;700&display=swap";*{box-sizing:border-box}:root{font-family:Rubik,Noto Sans KR,system-ui,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#333;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%;min-height:100vh}h1{font-size:2.5em;line-height:1.2}button{font-family:inherit;cursor:pointer;transition:all .3s ease}button:focus,button:focus-visible{outline:3px solid #ff6b9d;outline-offset:2px}.game-container{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}::-webkit-scrollbar{width:12px;height:12px}::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}::-webkit-scrollbar-thumb{background:#ff6b9d;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#ff5c8d}@font-face{font-family:esamanru;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicLight.woff) format("woff");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:esamanru;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicLight.woff) format("woff");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:esamanru;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicMedium.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:esamanru;src:url(https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicBold.woff) format("woff");font-weight:700;font-style:normal;font-display:swap}*{font-family:esamanru}html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;max-width:100vw;overflow-x:hidden}#root{width:100%;max-width:100vw;margin:0;padding:0;height:100vh;max-height:100vh;background:url(/background.webp);background-size:cover;background-position:center;background-attachment:fixed;font-family:esamanru,Poppins,Noto Sans KR,-apple-system,BlinkMacSystemFont,sans-serif;position:relative;overflow:hidden;overflow-x:hidden}#root:before{content:"";position:absolute;width:100%;height:100%;background:radial-gradient(ellipse at 50% 50%,rgba(255,255,255,.05) 0%,transparent 70%);opacity:.3;animation:subtle-glow 20s ease-in-out infinite}#root:after{content:"";position:absolute;width:100%;height:100%;background:transparent;opacity:1}@keyframes subtle-glow{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.1;transform:scale(1.01)}}.app{display:flex;flex-direction:column;height:100vh;max-height:100vh;padding:.5rem;box-sizing:border-box;overflow:hidden}.app-header{text-align:center;margin-bottom:1rem;flex-shrink:0}.app-header h1{font-size:2.5rem;font-weight:800;background:linear-gradient(135deg,#ffb6c1,plum,#e6e6fa,khaki);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 .75rem;text-transform:uppercase;letter-spacing:3px;position:relative;animation:gradient 3s ease infinite,subtle-bounce 4s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(221,160,221,.4));text-shadow:2px 2px 4px rgba(230,230,250,.3)}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes subtle-bounce{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.02)}}@keyframes cute-float{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-5px) rotate(-2deg)}75%{transform:translateY(3px) rotate(2deg)}}.game-info{display:flex;justify-content:center;align-items:center;gap:2.5rem;flex-wrap:nowrap;background:linear-gradient(135deg,#fff0f5f2,#e6e6fae6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:1rem 2rem;border-radius:20px;box-shadow:0 8px 32px #dda0dd4d,inset 0 1px #fff6;border:2px solid rgba(255,182,193,.4);width:fit-content;height:auto;margin:0 auto 1rem;transition:transform .3s ease,box-shadow .3s ease;touch-action:manipulation;box-sizing:border-box}.game-info:hover{transform:translateY(-2px);box-shadow:0 12px 40px #dda0dd66,inset 0 1px #fff9}.info-item{display:flex;align-items:center;gap:.5rem;min-width:fit-content;white-space:nowrap;flex-shrink:0}.info-label{font-size:.875rem;color:#b19cd9;font-weight:500;text-transform:uppercase;letter-spacing:1px;text-shadow:1px 1px 2px rgba(255,255,255,.5)}.info-value{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,plum,#ffb6c1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:1px 1px 2px rgba(0,0,0,.1);min-width:2.5rem;text-align:center;display:inline-block}.info-value.no-matches{background:linear-gradient(135deg,#ff6b6b,#ee5a24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:pulse-color .8s ease-in-out infinite;font-weight:800}.info-value.time-warning{background:linear-gradient(135deg,#ff9f43,#ff6348);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:pulse 2s ease-in-out infinite}.info-value.time-critical{background:linear-gradient(135deg,#ff6b6b,#ee5a24);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:pulse .5s ease-in-out infinite;font-weight:800}.time-value{min-width:6rem;display:inline-block}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}@keyframes pulse-color{0%,to{filter:brightness(1)}50%{filter:brightness(1.2)}}.new-game-btn{background:linear-gradient(135deg,#ffb6c1,plum);color:#fff;border:2px solid #E6E6FA;padding:.875rem 2rem;border-radius:15px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 15px #dda0dd66,inset 0 1px #fff3;position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:1px;text-shadow:1px 1px 2px rgba(0,0,0,.2);white-space:nowrap;min-width:fit-content}.new-game-btn:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,plum,#ffb6c1);opacity:0;transition:opacity .3s ease}.new-game-btn span{position:relative;z-index:1}.new-game-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 8px 25px #dda0dd99,inset 0 1px #ffffff4d}.new-game-btn:hover:before{opacity:1}.new-game-btn:active{transform:translateY(-1px) scale(1.02)}.game-container{flex:1;display:flex;justify-content:center;align-items:center;padding:.25rem;height:calc(100vh - 140px);max-height:calc(100vh - 140px);position:relative;z-index:1;width:100%;max-width:100vw;overflow:hidden;box-sizing:border-box;touch-action:manipulation;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.game-container canvas{max-width:100%;max-height:100%;height:auto;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}.game-container canvas:not(:first-child){display:none!important}.welcome-screen{text-align:center;animation:fadeIn .6s ease-out}.welcome-screen h2{font-size:2.5rem;font-weight:700;color:#000;margin-bottom:1rem;text-shadow:0 4px 12px rgba(221,160,221,.4),2px 2px 4px rgba(0,0,0,.2)}.welcome-screen p{font-size:1.25rem;color:#000;margin-bottom:2rem;text-shadow:0 2px 6px rgba(221,160,221,.3)}.new-game-btn.large{padding:1.25rem 3rem;font-size:1.25rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.game-complete{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:linear-gradient(135deg,#fff0f5fa,#e6e6faf2);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);padding:3.5rem;border-radius:25px;box-shadow:0 25px 60px #dda0dd66,inset 0 1px #fff6;border:3px solid rgba(255,182,193,.4);text-align:center;z-index:1000;animation:popIn .6s cubic-bezier(.68,-.55,.265,1.55)}@keyframes popIn{0%{transform:translate(-50%,-50%) scale(.8);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}.game-complete h2{font-size:3rem;font-weight:800;background:linear-gradient(135deg,#ffb6c1,plum);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0 0 1.5rem;animation:gradient 3s ease infinite;text-shadow:2px 2px 4px rgba(221,160,221,.2)}.game-complete p{font-size:1.2rem;color:#b19cd9;margin:.5rem 0;text-shadow:1px 1px 2px rgba(255,255,255,.5)}.game-complete .completion-time{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#ffb6c1,plum);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:1rem 0 1.5rem}.button-group{display:flex;gap:1rem;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:1.5rem}.share-btn{background:linear-gradient(135deg,#4267b2,#5b7ec6);color:#fff;border:2px solid #3B5998;padding:.875rem 2rem;border-radius:15px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 15px #4267b266,inset 0 1px #fff3;position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:1px;text-shadow:1px 1px 2px rgba(0,0,0,.2);white-space:nowrap;min-width:fit-content}.share-btn:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 8px 25px #4267b299,inset 0 1px #ffffff4d}.share-btn:active{transform:translateY(-1px) scale(1.02)}.share-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.share-message{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:1rem 2rem;border-radius:10px;font-size:.9rem;z-index:2000;animation:slideInUp .3s ease-out;max-width:90%;text-align:center}@keyframes slideInUp{0%{transform:translate(-50%,100px);opacity:0}to{transform:translate(-50%);opacity:1}}@media (max-width: 768px){.app{padding:0;height:100vh;height:100dvh;width:100vw;overflow-x:hidden}.app-header{margin-bottom:.5rem}.app-header h1{font-size:1.3rem;letter-spacing:.5px;margin-bottom:.3rem}.game-info{flex-direction:row;flex-wrap:wrap;gap:.8rem;padding:.6rem 1rem;min-width:unset;width:95%;max-width:100%;height:auto;margin:0 auto .5rem;font-size:.9rem}.info-item{justify-content:center;width:auto;border-bottom:none;padding:0 .5rem}.info-item:last-child{border-bottom:none;justify-content:center}.info-label{font-size:.7rem}.info-value{font-size:.9rem;min-width:1.5rem}.time-value{min-width:5rem}.new-game-btn{padding:.7rem 1.8rem;font-size:.85rem;margin-top:.5rem;letter-spacing:.5px}.game-container{padding:2px;height:calc(100vh - 120px);height:calc(100dvh - 120px);max-height:calc(100dvh - 120px);width:100%;max-width:100vw;overflow:hidden;box-sizing:border-box}.game-complete{padding:1.5rem;width:90%;max-width:350px;margin:1rem}.game-complete h2{font-size:1.8rem}.game-complete p{font-size:1rem}.game-complete .completion-time{font-size:1.3rem}.button-group{gap:.5rem;margin-top:1rem}.share-btn{padding:.7rem 1.5rem;font-size:.85rem}.welcome-screen h2{font-size:2rem}.welcome-screen p{font-size:1.1rem}.new-game-btn.large{padding:1rem 2rem;font-size:1.1rem}}@media (max-width: 480px){.app{padding:.25rem}.app-header h1{font-size:1.5rem;margin-bottom:.5rem}.game-info{padding:.75rem;gap:.5rem}.info-label{font-size:.75rem}.info-value{font-size:1rem}.time-value{min-width:4.5rem}.new-game-btn{padding:.6rem 1.5rem;font-size:.75rem;letter-spacing:.3px}.game-container{padding:0;height:calc(100vh - 110px);height:calc(100dvh - 110px);max-height:calc(100dvh - 110px);width:100vw;max-width:100vw;box-sizing:border-box}.welcome-screen h2{font-size:1.5rem}.welcome-screen p{font-size:1rem;margin-bottom:1.5rem}.new-game-btn.large{padding:.875rem 1.5rem;font-size:1rem}.game-complete{padding:1rem;margin:.5rem}.game-complete h2{font-size:1.5rem}.game-complete p{font-size:.9rem}}.game-board-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;position:relative;padding:.5rem;box-sizing:border-box;overflow:hidden}.game-board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr));gap:4px 4px;row-gap:20px;width:100%;max-width:600px;height:100%;max-height:500px;position:relative;margin:0 auto}.tile{position:relative;aspect-ratio:5/6;cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.tile-inner{width:100%;height:100%;position:relative;border-radius:12px;overflow:hidden;box-shadow:0 4px 15px #0000001a;transition:transform .2s ease}.tile-background{position:absolute;inset:0;background:linear-gradient(135deg,#fff0f5,#ffe4e1);border:2px solid #DDA0DD;border-radius:12px;box-shadow:inset 0 2px 4px #ffffff80,inset 0 -2px 4px #dda0dd33}.tile-image{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80%;height:80%;object-fit:contain;pointer-events:none;-webkit-user-drag:none;user-drag:none}.tile-selected-overlay{position:absolute;inset:0;background:radial-gradient(circle,#ffd70066,#ffa5004d);border:3px solid #FFD700;border-radius:12px;box-shadow:0 0 20px #ffd70099,inset 0 0 20px #ffd7004d}.match-path-svg{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10}@media (max-width: 768px){.game-board-container{padding:0;width:100%;max-width:100vw;box-sizing:border-box}.game-board{gap:1px 1px;row-gap:3px;width:calc(90vw - 4px);max-width:calc(90vw - 4px);height:auto;aspect-ratio:8/6;margin:0 auto}.tile{border-radius:6px;width:100%;height:100%}.tile-inner{border-radius:6px;box-shadow:0 1px 4px #0000001a}.tile-background{border-width:1px;border-radius:6px}.tile-image{width:70%;height:70%}.tile-selected-overlay{border-width:2px;border-radius:6px}}@media (max-width: 480px){.game-board{gap:.5px .5px;row-gap:2.5px;width:calc(96vw - 2px);max-width:calc(96vw - 2px);height:auto;aspect-ratio:8/6;margin:0 auto;margin-right:3.2vw}.tile{border-radius:6px;box-shadow:0 2px 8px #0000001a}.tile-background,.tile-selected-overlay{border-radius:6px}}@media (max-width: 768px) and (orientation: landscape){.game-board{max-height:calc(100vh - 80px);max-width:calc(100vh - 80px);width:auto;height:calc(100vh - 80px)}.game-board-container{height:calc(100vh - 80px)}}.match-effect-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:20}.particle{pointer-events:none}