:root{--primary: #FF9A9E;--secondary: #FECFEF;--accent: #FFD23F;--background: #FFF5F5;--surface: #FFFFFF;--text-main: #111;--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;height:100dvh;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);box-sizing:border-box}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:100dvh;display:flex;flex-direction:column;align-items:center;padding:2rem;width:100%;box-sizing:border-box}.card{background:var(--surface);border-radius:20px;border:2px solid #111;box-shadow:6px 6px #111;padding:2rem;width:100%;max-width:100%;box-sizing:border-box}button{font-family:Jua,sans-serif;background:var(--primary);color:#111;border:2px solid #111;padding:12px 24px;border-radius:99px;font-size:1.2rem;cursor:pointer;transition:transform .1s,box-shadow .1s;box-shadow:4px 4px #111}button:active{transform:translate(4px,4px);box-shadow:0 0 #111}button.secondary{background:var(--accent);color:#111;box-shadow:4px 4px #111}button.secondary:active{transform:translate(4px,4px);box-shadow:0 0 #111}.wizard-battle-container{display:flex;flex-direction:column;gap:.5rem;width:100%;padding:.5rem 1rem;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:.5rem .8rem;box-shadow:4px 4px #111;display:flex;align-items:center;gap:1rem;border:2px solid #111;transition:all .3s ease;width:100%;box-sizing:border-box}.battle-participant.player{background:var(--background)}.battle-participant.enemy{background:#fdfdfd}.battle-avatar{width:45px;height:45px;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.2rem;font-weight:700;color:var(--primary);text-shadow:1px 1px 0px white;padding:0 .5rem}.wizard-action-stage{background:#fff;border-radius:24px;border:2px solid #111;padding:.5rem 1.5rem 1.5rem;box-shadow:6px 6px #111;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:min(600px,65vh);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:35px;height:35px}.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}}