@import "https://fonts.googleapis.com/css2?family=Jua&family=Gamja+Flower&display=swap";
@import "https://fonts.googleapis.com/css2?family=Gamja+Flower&family=Jua&family=Black+Han+Sans&display=swap";
@tailwind base;@tailwind components;@tailwind utilities;:root{--background:#0a0a0a;--foreground:#ededed;--game-gold:gold;--game-purple:#9c27b0;--game-pink:#e91e63;--game-sky:#87ceeb;--game-red:#f44336;--game-green:#4caf50;--game-white:#fff;--game-black:#000}*{box-sizing:border-box;margin:0;padding:0}html,body{-webkit-user-select:none;user-select:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{background:var(--background);color:var(--foreground);touch-action:none;font-family:Gamja Flower,Arial,Helvetica,sans-serif}canvas{-webkit-user-drag:none;-webkit-user-select:none;user-select:none;display:block}@layer utilities{.text-outline-game{text-shadow:-2px -2px #000,2px -2px #000,-2px 2px #000,2px 2px #000}.text-outline-game-lg{text-shadow:-3px -3px #000,3px -3px #000,-3px 3px #000,3px 3px #000}.text-glow-gold{text-shadow:0 0 10px #ffd700cc,0 0 20px #ffd70099,0 0 30px #ffd70066}.text-glow-white{text-shadow:0 0 10px #fffc,0 0 20px #fff9,0 0 30px #fff6}.game-title{text-shadow:-2px -2px #000,2px -2px #000,-2px 2px #000,2px 2px #000;font-family:Jua,sans-serif;font-size:2.25rem;font-weight:700}.game-title-lg{text-shadow:-3px -3px #000,3px -3px #000,-3px 3px #000,3px 3px #000;font-family:Jua,sans-serif;font-size:3rem;font-weight:700}.game-body{font-family:Gamja Flower,sans-serif;font-size:1rem}.game-body-sm{font-family:Gamja Flower,sans-serif;font-size:.875rem}.game-body-lg{font-family:Gamja Flower,sans-serif;font-size:1.125rem}.game-number{font-family:Courier New,monospace;font-size:1rem;font-weight:600}.game-number-lg{font-family:Courier New,monospace;font-size:1.5rem;font-weight:700}.btn-game-confirm{color:#fff;background:linear-gradient(135deg,#4caf50 0%,#45a049 100%)}.btn-game-cancel{color:#fff;background:linear-gradient(135deg,#f44336 0%,#d32f2f 100%)}.btn-game-primary{color:#fff;background:linear-gradient(135deg,gold 0%,orange 100%)}.btn-game-secondary{color:#fff;background:linear-gradient(135deg,#9c27b0 0%,#7b1fa2 100%)}}
:root{--cartoon-primary:#ff6b9d;--cartoon-secondary:#ffd93d;--cartoon-success:#6bcf7f;--cartoon-info:#4cc9f0;--cartoon-warning:#fa0;--cartoon-danger:#ff5757;--cartoon-purple:#c77dff;--cartoon-blue:#4895ef;--cartoon-green:#38b000;--cartoon-shadow-light:#0003;--cartoon-shadow-medium:#00000059;--cartoon-shadow-heavy:#00000080;--cartoon-outline:#2d3142;--cartoon-outline-light:#4f5d75}.cartoon-font-display{letter-spacing:-.02em;font-family:Black Han Sans,sans-serif;font-weight:900}.cartoon-font-title{font-family:Jua,sans-serif;font-weight:400}.cartoon-font-body{font-family:Gamja Flower,cursive;font-weight:400}.cartoon-shadow{box-shadow:0 4px 0 var(--cartoon-outline),0 6px 12px var(--cartoon-shadow-medium)}.cartoon-shadow-sm{box-shadow:0 2px 0 var(--cartoon-outline),0 3px 6px var(--cartoon-shadow-light)}.cartoon-shadow-lg{box-shadow:0 8px 0 var(--cartoon-outline),0 12px 24px var(--cartoon-shadow-heavy)}.cartoon-border{border:4px solid var(--cartoon-outline);border-radius:16px}.cartoon-border-sm{border:3px solid var(--cartoon-outline);border-radius:12px}.cartoon-border-lg{border:5px solid var(--cartoon-outline);border-radius:20px}.cartoon-bg-gradient{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.cartoon-bg-primary{background:var(--cartoon-primary)}.cartoon-bg-secondary{background:var(--cartoon-secondary)}.cartoon-bg-purple{background:linear-gradient(135deg,#c77dff 0%,#9d4edd 100%)}.cartoon-bg-blue{background:linear-gradient(135deg,#4cc9f0 0%,#4895ef 100%)}.cartoon-bg-green{background:linear-gradient(135deg,#6bcf7f 0%,#38b000 100%)}.cartoon-button{border:4px solid var(--cartoon-outline);box-shadow:0 4px 0 var(--cartoon-outline),0 6px 12px var(--cartoon-shadow-medium);text-shadow:2px 2px #0003;border-radius:16px;font-family:Jua,sans-serif;font-weight:700;transition:all .15s cubic-bezier(.68,-.55,.265,1.55);position:relative;overflow:hidden}.cartoon-button:hover{box-shadow:0 6px 0 var(--cartoon-outline),0 8px 16px var(--cartoon-shadow-heavy);transform:translateY(-2px)}.cartoon-button:active{box-shadow:0 2px 0 var(--cartoon-outline),0 3px 6px var(--cartoon-shadow-light);transform:translateY(2px)}.cartoon-button:before{content:"";background:linear-gradient(45deg,#0000 30%,#ffffff4d 50%,#0000 70%);width:200%;height:200%;animation:3s infinite shine;position:absolute;top:-50%;left:-50%;transform:rotate(45deg)}@keyframes shine{0%{transform:translate(-100%)translateY(-100%)rotate(45deg)}to{transform:translate(100%)translateY(100%)rotate(45deg)}}.cartoon-bounce{animation:.6s cubic-bezier(.68,-.55,.265,1.55) bounce}@keyframes bounce{0%,to{transform:translateY(0)scale(1)}25%{transform:translateY(-10px)scale(1.05)}50%{transform:translateY(-20px)scale(1.1)}75%{transform:translateY(-10px)scale(1.05)}}.cartoon-shake{animation:.5s shake}@keyframes shake{0%,to{transform:translate(0)rotate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)rotate(-2deg)}20%,40%,60%,80%{transform:translate(5px)rotate(2deg)}}.cartoon-glow{animation:2s ease-in-out infinite glow}@keyframes glow{0%,to{box-shadow:0 0 5px var(--cartoon-primary),0 0 10px var(--cartoon-primary),0 4px 0 var(--cartoon-outline)}50%{box-shadow:0 0 20px var(--cartoon-primary),0 0 30px var(--cartoon-primary),0 4px 0 var(--cartoon-outline)}}.cartoon-pulse{animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}.cartoon-float{animation:3s ease-in-out infinite float}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.cartoon-spin{animation:2s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.cartoon-card{border:4px solid var(--cartoon-outline);box-shadow:0 6px 0 var(--cartoon-outline),0 8px 16px var(--cartoon-shadow-medium);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffff1a 0%,#ffffff0d 100%);border-radius:20px;transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.cartoon-card:hover{box-shadow:0 10px 0 var(--cartoon-outline),0 12px 24px var(--cartoon-shadow-heavy);transform:translateY(-8px)scale(1.02)}.cartoon-badge{border:3px solid var(--cartoon-outline);text-shadow:1px 1px #0003;box-shadow:0 2px 0 var(--cartoon-outline);border-radius:12px;padding:4px 12px;font-family:Jua,sans-serif;font-weight:700}.cartoon-input{border:3px solid var(--cartoon-outline);box-shadow:inset 0 2px 4px var(--cartoon-shadow-light);border-radius:12px;padding:12px 16px;font-family:Gamja Flower,cursive;font-size:1.1rem;transition:all .2s}.cartoon-input:focus{border-color:var(--cartoon-primary);box-shadow:inset 0 2px 4px var(--cartoon-shadow-light),0 0 0 3px #ff6b9d4d;outline:none}.cartoon-modal{border:5px solid var(--cartoon-outline);box-shadow:0 8px 0 var(--cartoon-outline),0 16px 32px var(--cartoon-shadow-heavy);background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);border-radius:24px;animation:.3s cubic-bezier(.68,-.55,.265,1.55) modalSlideIn}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-50px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}.cartoon-tooltip{border:3px solid var(--cartoon-outline);box-shadow:0 4px 8px var(--cartoon-shadow-medium);background:#2d3142;border-radius:12px;padding:8px 12px;font-family:Gamja Flower,cursive;font-size:.9rem;animation:.2s tooltipFadeIn}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.cartoon-spinner{border:4px solid var(--cartoon-outline-light);border-top:4px solid var(--cartoon-primary);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}.cartoon-progress{border:3px solid var(--cartoon-outline);height:24px;box-shadow:inset 0 2px 4px var(--cartoon-shadow-light);background:#0000004d;border-radius:12px;overflow:hidden}.cartoon-progress-bar{background:linear-gradient(90deg,var(--cartoon-primary)0%,var(--cartoon-secondary)100%);border-radius:8px;height:100%;transition:width .3s;position:relative;overflow:hidden}.cartoon-progress-bar:after{content:"";background:linear-gradient(90deg,#0000 0%,#ffffff4d 50%,#0000 100%);animation:2s infinite progressShine;position:absolute;inset:0}@keyframes progressShine{0%{transform:translate(-100%)}to{transform:translate(100%)}}.cartoon-divider{background:var(--cartoon-outline);height:4px;box-shadow:0 2px 4px var(--cartoon-shadow-light);border-radius:2px}.cartoon-no-select{-webkit-user-select:none;user-select:none}.cartoon-cursor-pointer{cursor:pointer}.cartoon-cursor-pointer:hover{cursor:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\"><text y=\"24\" font-size=\"24\">👆</text></svg>"),pointer}