:root{--primary: #FF9A9E;--secondary: #FECFEF;--accent: #FFD23F;--background: #FFF5F5;--surface: #FFFFFF;--text-main: #4A4E69;--success: #84E296;--error: #FF6B6B}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Jua,sans-serif;background-color:var(--background);color:var(--text-main);overflow-x:hidden;position:relative;min-height:100vh}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;background-image:url(/bg.webp);background-size:cover;background-position:center;background-repeat:no-repeat;pointer-events:none}h1,h2,h3,h4,h5,h6{font-family:Jua,sans-serif;letter-spacing:1px}.app-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:2rem;width:100%;box-sizing:border-box}.card{background:var(--surface);border-radius:24px;box-shadow:0 10px 25px #ff9a9e33;padding:2rem;width:100%;max-width:100%;box-sizing:border-box}button{font-family:Jua,sans-serif;background:var(--primary);color:#fff;border:none;padding:12px 24px;border-radius:99px;font-size:1.2rem;cursor:pointer;transition:transform .1s,box-shadow .1s;box-shadow:0 4px #e57373}button:active{transform:translateY(4px);box-shadow:0 0 #e57373}button.secondary{background:var(--accent);color:#4a4e69;box-shadow:0 4px #e6b800}button.secondary:active{box-shadow:0 0 #e6b800}.wizard-battle-container{display:flex;flex-direction:column;gap:1.5rem;width:100%;padding:1.5rem;box-sizing:border-box}.wizard-battle-stage{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;width:100%}.battle-participant{background:#fff;border-radius:20px;padding:.8rem 1.2rem;box-shadow:0 8px 20px #ff9a9e0d;display:flex;align-items:center;gap:1rem;border:4px solid transparent;transition:all .3s ease;width:100%;box-sizing:border-box}.battle-participant.player{border-color:var(--primary)}.battle-participant.enemy{border-color:var(--accent)}.battle-avatar{width:70px;height:70px;object-fit:contain}.participant-info{flex:1;display:flex;flex-direction:column;gap:.3rem;min-width:0}.participant-name{font-size:1.1rem;font-weight:700;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hp-bar-container{display:flex;align-items:center;gap:6px;width:100%}.hp-label{font-weight:700;font-size:.8rem;color:var(--text-secondary)}.hp-bar{flex:1;height:10px;background:#eee;border-radius:5px;overflow:hidden}.hp-text{font-size:.8rem;font-weight:700;color:var(--text-main);min-width:32px;text-align:right}.battle-vs{font-size:1.5rem;font-weight:700;color:var(--primary);text-shadow:1px 1px 0px white;padding:0 .5rem}.wizard-action-stage{background:#fff;border-radius:24px;padding:1.5rem;box-shadow:0 10px 25px #ff9a9e26;display:flex;flex-direction:column;align-items:center;position:relative;width:100%;max-width:460px;margin:0 auto;box-sizing:border-box}.wizard-hanja-wrapper,.hanja-pad-wrapper{position:relative;width:100%;max-width:400px;aspect-ratio:1;margin:0 auto}.village-container{display:flex;flex-direction:column;align-items:center;width:100%;max-width:800px;min-height:90vh}.village-layout{display:flex;gap:2rem;width:100%;flex:1}@media (max-width: 768px){.village-layout{flex-direction:column;gap:1.5rem}.wizard-battle-container{gap:.8rem;padding:.5rem}.wizard-battle-stage{gap:.3rem}.battle-participant{padding:6px 10px;border-radius:14px;gap:.4rem;border-width:2px}.battle-avatar{width:40px;height:40px}.participant-name{font-size:.85rem}.hp-bar{height:8px}.hp-text{font-size:.75rem;min-width:26px}.hp-label{font-size:.75rem}.battle-vs{font-size:1rem;padding:0 .2rem}.wizard-action-stage{padding:1rem;border-radius:16px}}@media (max-width: 480px){.app-container{padding:1rem .5rem}.card{padding:1rem}button{padding:10px 18px;font-size:1rem}}.main-title{font-size:4rem;color:var(--primary);margin-bottom:1rem;text-shadow:2px 2px 0px var(--secondary);line-height:1.2}.main-subtitle{font-size:1.5rem;color:var(--text-main);margin-bottom:4rem}.menu-btn{font-size:2rem;padding:1rem 4rem;width:100%;max-width:450px;border-radius:99px;white-space:nowrap}.menu-btn-small{font-size:1.5rem;padding:1rem 2rem;width:100%;max-width:350px;border-radius:99px;white-space:nowrap}.practice-header{display:flex;justify-content:space-between;width:100%;align-items:center;margin-bottom:2rem;margin-top:3rem;gap:1rem}.practice-header h1{font-size:2.5rem;color:var(--primary);margin:0;white-space:nowrap}.back-btn-text-short,.info-card-short{display:none}.back-btn-text-full{display:inline}.info-card-full{display:flex}.grade-select-btn{padding:1.5rem;font-size:1.5rem;border-radius:16px;width:100%;white-space:nowrap}.difficulty-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;width:100%}.difficulty-btn{padding:1rem;font-size:1.2rem;display:flex;flex-direction:column;align-items:center;border-radius:16px;width:100%;white-space:nowrap}.hanja-status-text{color:var(--primary);font-size:2rem;height:2.5rem;line-height:2.5rem;text-align:center;white-space:nowrap;width:100%}@media (max-width: 768px){.main-title{font-size:3rem}.main-subtitle{font-size:1.2rem;margin-bottom:2.5rem}.menu-btn{font-size:1.5rem;padding:.8rem 2.5rem}.menu-btn-small{font-size:1.2rem;padding:.8rem 1.8rem}.back-btn-text-full{display:none}.back-btn-text-short{display:inline}.info-card-full{display:none}.info-card-short{display:block;font-size:.85rem;font-weight:700}.practice-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%;margin-top:1rem;margin-bottom:1rem;gap:.5rem}.practice-header h1{font-size:1.1rem;margin:0;white-space:nowrap;text-align:center}.practice-back-btn{padding:6px 12px;font-size:.9rem}.practice-info-card{padding:6px 10px;border-radius:12px;width:auto;box-shadow:0 4px 10px #ff9a9e1a}.grade-select-btn{padding:1.2rem;font-size:1.2rem}.hanja-status-text{font-size:1.4rem;height:2rem;line-height:2rem}}@media (max-width: 480px){.main-title{font-size:2.2rem}.main-subtitle{font-size:1rem;margin-bottom:2rem}.menu-btn{font-size:1.2rem;padding:.6rem 1.5rem}.menu-btn-small{font-size:1rem;padding:.6rem 1.2rem}.practice-header h1{font-size:1rem}.grade-select-btn{padding:1rem;font-size:.95rem}.difficulty-grid{grid-template-columns:1fr}.difficulty-btn{padding:.8rem;font-size:1rem}.hanja-status-text{font-size:1.1rem;height:1.6rem;line-height:1.6rem}}