@import"https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap";@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&display=swap";body{font-family:var(--font-korean);background:linear-gradient(135deg,var(--korean-bg-dark) 0%,var(--korean-bg-medium) 100%);color:var(--korean-text-primary);overflow:hidden;user-select:none}#root{width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;background:radial-gradient(ellipse at center,var(--korean-bg-medium) 0%,var(--korean-bg-dark) 100%)}.korean-text{font-family:var(--font-korean);font-weight:400;text-shadow:0 0 8px var(--korean-glow);letter-spacing:.02em}.korean-title{font-family:var(--font-korean);font-weight:700;font-size:3rem;background:linear-gradient(45deg,var(--korean-primary),var(--korean-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 20px var(--korean-primary)}.cyber-text{font-family:var(--font-cyber);color:var(--korean-primary);text-transform:uppercase;letter-spacing:.1em;text-shadow:0 0 10px currentColor}.cyberpunk-border{border:2px solid var(--korean-primary);border-image:linear-gradient(45deg,var(--korean-primary),var(--korean-accent),var(--korean-primary)) 1;box-shadow:0 0 10px var(--korean-primary),inset 0 0 10px #00d4ff1a}.cyberpunk-button{background:linear-gradient(135deg,#00d4ff1a,#ffb7001a);border:1px solid var(--korean-primary);color:var(--korean-text-primary);padding:.8rem 1.5rem;cursor:pointer;transition:all .3s ease;font-family:var(--font-korean);font-weight:500;position:relative;overflow:hidden}.cyberpunk-button:hover{background:linear-gradient(135deg,#00d4ff33,#ffb70033);box-shadow:0 0 20px var(--korean-primary);transform:translateY(-2px)}.cyberpunk-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.cyberpunk-button:hover:before{left:100%}.combat-hud{position:absolute;top:0;left:0;right:0;background:linear-gradient(180deg,rgba(10,10,15,.9) 0%,transparent 100%);padding:1rem;border-bottom:1px solid var(--korean-primary)}.health-bar{background:var(--korean-bg-dark);border:1px solid var(--korean-primary);height:8px;border-radius:4px;overflow:hidden;position:relative}.health-bar-fill{background:linear-gradient(90deg,var(--korean-danger) 0%,var(--korean-accent) 50%,var(--korean-glow) 100%);height:100%;transition:width .3s ease;box-shadow:0 0 10px currentColor}@keyframes korean-glow{0%,to{text-shadow:0 0 5px var(--korean-glow)}50%{text-shadow:0 0 20px var(--korean-glow)}}.animate-glow{animation:korean-glow 2s ease-in-out infinite}@keyframes combat-flash{0%{background-color:#ff33661a}50%{background-color:#ff33664d}to{background-color:#ff33661a}}.combat-flash{animation:combat-flash .2s ease-in-out}@media (max-width: 768px){.korean-title{font-size:2rem}.cyberpunk-button{padding:.6rem 1.2rem;font-size:.9rem}.app-container{position:relative;width:100vw;height:100vh;overflow:hidden;background:#000;display:flex;align-items:center;justify-content:center}.app-container canvas{width:100vw!important;height:100vh!important;position:relative!important}.test-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:500}}@media (min-width: 768px) and (max-width: 1024px){.app-container canvas{width:100vw!important;height:100vh!important}}@media (min-width: 1024px){.app-container{justify-content:center;align-items:center}}.loading-spinner{border:2px solid var(--korean-bg-medium);border-top:2px solid var(--korean-primary);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:0 auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-message{color:var(--korean-danger);background:#ff33661a;border:1px solid var(--korean-danger);padding:1rem;border-radius:4px;margin:1rem 0;font-family:var(--font-korean)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (prefers-contrast: high){:root{--color-primary-cyan: #ffffff;--color-primary-gold: #ffffff;--color-text-primary: #ffffff;--color-text-secondary: #ffffff;--color-text-tertiary: #cccccc;--color-bg-dark: #000000;--color-bg-medium: #000000;--color-bg-light: #1a1a1a;--color-danger: #ff0000;--color-success: #00ff00;--color-warning: #ffff00}button,.error-boundary__container,.loading-state__progress{border-width:3px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}#root{width:100vw;height:100vh;margin:0;padding:0;overflow:hidden}.app-container{position:fixed;top:0;left:0;width:100vw;height:100vh;margin:0;padding:0;overflow:hidden;background:#000;display:flex;align-items:center;justify-content:center;font-family:Noto Sans KR,sans-serif;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none;will-change:transform;transform:translateZ(0);backface-visibility:hidden}.app-container h1,.app-container .instructions{display:none!important}body{font-family:Noto Sans KR,sans-serif;margin:0;padding:0;overflow:hidden;background:#000;width:100vw;height:100vh}.app-container:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,#8b00001a,#000 70%);pointer-events:none;z-index:-1}.app-container canvas{will-change:transform;transform:translateZ(0);backface-visibility:hidden}@media (max-width: 768px){.app-container{width:100vw!important;height:100vh!important}.app-container canvas{width:100vw!important;height:100vh!important}}@media (max-width: 375px){.app-container{width:100vw!important;height:100vh!important}.app-container canvas{width:100vw!important;height:100vh!important}}.logo,.card,.read-the-docs{display:none!important}@media (max-width: 768px){.app-container{touch-action:manipulation;position:fixed;overflow:hidden}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 2dppx){.app-container canvas{image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges}}.app{width:100vw;height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#000a12,#001a25);color:#fff;font-family:Noto Sans KR,Arial,sans-serif;overflow:hidden}.app-header{padding:1rem 2rem;background:#000a12e6;border-bottom:2px solid #ffd700;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 10px #ffd7004d}.app-title{margin:0;display:flex;flex-direction:column;gap:.25rem}.korean-title{font-size:1.8rem;font-weight:700;color:gold;text-shadow:2px 2px 4px rgba(0,0,0,.8)}.english-title{font-size:1rem;color:#87ceeb;font-style:italic;text-shadow:1px 1px 2px rgba(0,0,0,.6)}.app-status{display:flex;flex-direction:column;gap:.5rem;text-align:right}.phase-indicator,.time-indicator{padding:.25rem .75rem;border-radius:4px;font-size:.9rem;font-weight:700}.phase-indicator{background:#ffd70033;color:gold;border:1px solid #ffd700}.time-indicator{background:#87ceeb33;color:#87ceeb;border:1px solid #87ceeb}.app-main{flex:1;display:flex;justify-content:center;align-items:center;overflow:hidden}.app-debug{background:#000c;color:#0f0;font-family:Courier New,monospace;font-size:.8rem;max-height:200px;overflow-y:auto}.app-debug summary{padding:.5rem;cursor:pointer;background:#00ff001a;border-bottom:1px solid #00ff00}.app-debug pre{padding:1rem;margin:0;white-space:pre-wrap;word-wrap:break-word}@media (max-width: 768px){.app-header{padding:.5rem 1rem;flex-direction:column;gap:.5rem}.korean-title{font-size:1.4rem}.english-title{font-size:.9rem}.app-status{flex-direction:row;gap:1rem}}.app:before{content:"";position:fixed;inset:0;background-image:radial-gradient(circle at 20% 20%,rgba(255,215,0,.05) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(135,206,235,.05) 0%,transparent 50%);pointer-events:none;z-index:-1}.loading-screen{display:flex;justify-content:center;align-items:center;min-height:100vh;background:linear-gradient(135deg,#000,#1a1a2e,#16213e);color:#fff;font-family:Noto Sans KR,Arial,sans-serif}.loading-content{text-align:center;animation:pulse 2s ease-in-out infinite}.korean-title{font-size:2.5rem;font-weight:700;color:gold;margin-bottom:1rem;text-shadow:0 0 20px rgba(255,215,0,.5)}.english-subtitle{font-size:1.2rem;font-weight:300;color:#0ff;margin:0}.error-state{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;background:linear-gradient(135deg,#8b0000,#4b0000);color:#fff;font-family:Noto Sans KR,Arial,sans-serif;text-align:center}.error-state h1{color:#f44;margin-bottom:2rem}.error-state button{padding:1rem 2rem;background:gold;color:#000;border:none;border-radius:4px;font-weight:700;cursor:pointer;transition:background-color .3s ease}.error-state button:hover{background:#ffed4e}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.app-container{width:100%;height:100%;position:relative;background:linear-gradient(45deg,#0a0a0a,#1a1a1e)}.game-canvas{width:100%;height:100%;display:block}.loading-screen{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:var(--primary-cyan)}.error-screen{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#ff4136;padding:2rem;border:1px solid #ff4136;background:#ff41361a}.test-overlay{pointer-events:none;position:absolute!important;top:0;left:0;width:100%;height:100%;z-index:100;background:transparent}.test-overlay button{z-index:50!important;pointer-events:auto;position:absolute}.training-button{top:60%!important;left:5%!important;right:auto!important;width:auto!important;max-width:200px!important}.combat-button{top:70%!important;left:5%!important;right:auto!important;width:auto!important;max-width:200px!important}@media (max-width: 768px){.training-button{top:65%!important;left:5%!important;right:5%!important;width:auto!important;font-size:14px;padding:10px 16px}.combat-button{top:75%!important;left:5%!important;right:5%!important;width:auto!important;font-size:14px;padding:10px 16px}}@media (max-width: 375px){.training-button{top:70%!important;font-size:12px;padding:8px 12px}.combat-button{top:80%!important;font-size:12px;padding:8px 12px}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.02);opacity:.95}}@keyframes glow{0%,to{opacity:.8;filter:drop-shadow(0 0 4px #ffd700)}50%{opacity:1;filter:drop-shadow(0 0 8px #ffd700)}}@keyframes glow-alt{0%,to{opacity:.6;filter:drop-shadow(0 0 3px #00ffff)}50%{opacity:.8;filter:drop-shadow(0 0 6px #00ffff)}}.menu-button:focus-visible{outline:3px solid #ffd700!important;outline-offset:2px}.archetype-nav-button:focus-visible{outline:3px solid #ffd700!important;outline-offset:2px}:root{--color-primary-cyan: #00ffff;--color-primary-gold: #ffd700;--color-primary-black: #000000;--color-korean-east: #00ff88;--color-korean-west: #ffffff;--color-korean-south: #ff4444;--color-korean-north: #000000;--color-korean-center: #ffaa00;--color-accent-cyan: #00d4ff;--color-accent-blue: #4a89e2;--color-accent-magenta: #ff00ff;--color-accent-orange: #ff6b35;--color-bg-dark: #0a0a0f;--color-bg-medium: #1a1a2e;--color-bg-light: #2d2d2d;--color-text-primary: #ffffff;--color-text-secondary: #e0e0e0;--color-text-tertiary: #b3b3cc;--color-success: #00ff88;--color-warning: #ffb700;--color-danger: #ff3366;--color-info: #00d4ff;--font-korean: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", Arial, sans-serif;--font-cyber: "Orbitron", "SF Mono", "Monaco", "Consolas", monospace;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--korean-primary: var(--color-accent-cyan);--korean-secondary: var(--color-accent-orange);--korean-accent: var(--color-warning);--korean-bg-dark: var(--color-bg-dark);--korean-bg-medium: var(--color-bg-medium);--korean-text-primary: var(--color-text-primary);--korean-text-secondary: var(--color-text-tertiary);--korean-glow: var(--color-korean-east);--korean-danger: var(--color-danger);--korean-red: var(--color-korean-south);--korean-gold: var(--color-primary-gold);--korean-black: var(--color-primary-black);--korean-white: var(--color-korean-west);--dojang-blue: var(--color-accent-blue);--primary-cyan: var(--color-primary-cyan);--primary-blue: var(--color-accent-blue);--accent-magenta: var(--color-accent-magenta);--background-dark: var(--color-bg-dark);--text-primary: var(--color-text-primary);--trigram-red: var(--color-korean-south);--trigram-gold: var(--color-primary-gold);--trigram-black: var(--color-primary-black);--trigram-white: var(--color-korean-west);--black-trigram-cyan: var(--color-primary-cyan)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-korean);background-color:var(--background-dark);color:var(--text-primary);overflow:hidden}#root{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center}.cyberpunk-glow{box-shadow:0 0 10px var(--primary-cyan);border:1px solid var(--primary-cyan)}.korean-text{font-family:var(--font-korean);text-shadow:0 0 5px currentColor}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}h1{font-size:3.2em;line-height:1.1;color:var(--korean-gold);text-shadow:2px 2px 4px rgba(0,0,0,.8)}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.app{outline:none;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.game-container{width:100%;height:100%;position:relative;background:linear-gradient(135deg,#0a0a0a,#1a1a2e,#16213e)}canvas{display:block;position:relative;top:0;left:0;width:100vw;height:100vh;max-width:100vw;max-height:100vh;border:none;background:#000;image-rendering:-moz-crisp-edges;image-rendering:-webkit-crisp-edges;image-rendering:pixelated;image-rendering:crisp-edges;cursor:pointer;outline:none;z-index:1;will-change:transform;transform:translateZ(0);backface-visibility:hidden}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}@keyframes glow{0%,to{text-shadow:0 0 20px rgba(255,215,0,.5)}50%{text-shadow:0 0 30px rgba(255,215,0,.8)}}@keyframes indeterminate{0%{transform:translate(-100%)}to{transform:translate(400%)}}.error-boundary{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,var(--color-danger) 0%,#4b0000 100%);color:var(--color-text-primary);padding:2rem;text-align:center;font-family:var(--font-korean)}.error-boundary__container{max-width:600px;padding:2rem;background:#000c;border:2px solid var(--color-danger);border-radius:8px}.error-boundary__title{font-size:2rem;margin-bottom:1rem;color:var(--color-danger)}.error-boundary__message{margin-bottom:1.5rem;font-size:1.1rem;color:#fcc}.error-boundary__actions{display:flex;gap:1rem;justify-content:center;margin-top:2rem}.error-boundary__button{padding:.75rem 1.5rem;font-size:1rem;border:none;border-radius:4px;cursor:pointer;font-weight:700;transition:transform .2s ease}.error-boundary__button:hover:not(:disabled){transform:translateY(-2px)}.error-boundary__button--primary{background:var(--color-primary-gold);color:var(--color-primary-black)}.error-boundary__button--secondary{background:transparent;color:var(--color-text-primary);border:1px solid var(--color-text-primary)}.error-boundary__details{margin-top:2rem;text-align:left;font-size:.9rem;color:#ccc}.error-boundary__details summary{cursor:pointer;margin-bottom:.5rem;font-weight:700}.error-boundary__details pre{background:var(--color-primary-black);padding:1rem;border-radius:4px;overflow:auto;max-height:200px;font-size:.8rem}.loading-state{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,var(--color-bg-dark) 0%,var(--color-bg-medium) 100%);color:var(--color-text-primary);font-family:var(--font-korean);padding:2rem}.loading-state__logo{width:150px;height:150px;margin-bottom:2rem;animation:pulse 2s ease-in-out infinite}.loading-state__title{font-size:2.5rem;font-weight:700;color:var(--color-primary-gold);margin-bottom:2rem;text-shadow:0 0 20px rgba(255,215,0,.5);animation:glow 2s ease-in-out infinite}.loading-state__progress{width:300px;height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden;margin-bottom:1rem;border:1px solid rgba(0,255,255,.3)}.loading-state__progress-bar{height:100%;background:linear-gradient(90deg,var(--color-primary-cyan),var(--color-primary-gold));transition:width .3s ease;box-shadow:0 0 10px var(--color-primary-cyan)}.loading-state__progress-bar--indeterminate{width:25%;animation:indeterminate 1.5s ease-in-out infinite}.loading-state__stage{font-size:1.2rem;color:var(--color-text-primary);margin-bottom:.5rem}.loading-state__message{font-size:.9rem;color:var(--color-text-secondary);margin-top:.5rem}.loading-state__spinner{width:40px;height:40px;border:4px solid rgba(0,255,255,.3);border-top-color:var(--color-primary-cyan);border-radius:50%;animation:spin 1s linear infinite;margin-top:2rem}.combat-ui{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100}.combat-ui>*{pointer-events:auto}*{box-sizing:border-box}html{touch-action:manipulation}.dojang-background{background:linear-gradient(135deg,var(--korean-black) 0%,var(--dojang-blue) 50%,var(--korean-red) 100%);background-size:200% 200%;animation:dojaingGradient 8s ease infinite}@keyframes dojaingGradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@media (max-width: 768px){body{overflow:hidden;position:fixed;width:100%;height:100%}#root{width:100vw;height:100vh}}@media screen and (max-width: 767px){input[type=text],input[type=number],select,textarea{font-size:16px}}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}::-webkit-scrollbar{display:none}.app.loading{width:100vw;height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f0f23)}.intro-screen,.training-screen,.combat-screen{position:relative;width:100%;height:100%;display:flex;flex-direction:column}[data-testid]{position:relative}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.test-overlay{pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;z-index:500;background:transparent}.test-overlay button,.test-overlay .archetype-section{pointer-events:auto;z-index:501}@media (max-width: 768px){.test-overlay .archetype-section{bottom:2%;left:2%;right:2%;max-width:none}.test-overlay button{font-size:14px;padding:10px 16px;min-width:150px}.training-button,.combat-button{left:5%!important;right:5%!important;width:auto!important}}@media (max-width: 375px){.test-overlay button{font-size:12px;padding:8px 12px}}.training-button{width:100%;height:40px;border:2px solid rgba(255,255,255,.8);border-radius:8px;color:#fff;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .2s ease}.training-button-start{background:#0f8}.training-button-stop{background:#f44}.training-button:hover{transform:scale(1.05);box-shadow:0 0 15px currentColor}.mode-button{background:#2d2d2d80;border:2px solid rgba(0,255,255,.5);border-radius:8px;padding:10px;cursor:pointer;text-align:left;color:#fff;transition:all .2s ease}.mode-button.selected{background:#00ffff4d;border-color:#0ff}.mode-button:not(.selected):hover{background:#404040b3;border-color:#0ff}.vital-point-button{background:#2d2d2d80;border:2px solid rgba(255,170,0,.5);border-radius:8px;padding:8px;cursor:pointer;text-align:left;color:#fff;transition:all .2s ease}.vital-point-button.selected{background:#ffaa004d}.vital-point-button:not(.selected):hover{background:#404040b3}@keyframes feedbackPulse{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}.training-feedback{background:#000000e6;border:3px solid #ffd700;border-radius:16px;color:gold;text-align:center;box-shadow:0 0 30px #ffd70080;animation:feedbackPulse .5s ease-in-out;min-width:200px}.training-feedback.mobile{padding:20px 30px;font-size:20px}.training-feedback.desktop{padding:30px 50px;font-size:28px}@keyframes statusPulse{0%,to{opacity:.6;box-shadow:0 0 8px currentColor}50%{opacity:1;box-shadow:0 0 16px currentColor}}.status-indicator{width:12px;height:12px;border-radius:50%;background:#0f8}.status-indicator.active{animation:statusPulse 1s ease-in-out infinite}.status-indicator.inactive{background:#888}
