.main-header[data-v-8d5d551b]{width:100%;box-sizing:border-box;padding:1.5rem;padding-top:calc(1.5rem + env(safe-area-inset-top));padding-left:calc(1.5rem + env(safe-area-inset-left));padding-right:calc(1.5rem + env(safe-area-inset-right));position:relative;z-index:100;background:var(--color-bg)}.header-inner[data-v-8d5d551b]{display:flex;align-items:center;justify-content:space-between;width:100%}.header-right[data-v-8d5d551b]{display:flex;align-items:center}.profile-circle-btn[data-v-8d5d551b]{display:flex;align-items:center;justify-content:center;width:52px;height:52px;background:color-mix(in srgb,var(--color-primary),transparent 92%);border:1px solid color-mix(in srgb,var(--color-primary),transparent 85%);border-radius:50%;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);padding:0;overflow:hidden}.profile-circle-btn[data-v-8d5d551b]:hover{transform:translateY(-2px);background:color-mix(in srgb,var(--color-primary),transparent 85%);border-color:color-mix(in srgb,var(--color-primary),transparent 70%)}.profile-circle-btn:hover .header-profile-icon[data-v-8d5d551b]{transform:rotate(5deg)}.header-profile-icon[data-v-8d5d551b]{width:100%;height:100%;display:flex;align-items:center;justify-content:center;transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}[data-v-8d5d551b] .char-svg{width:100%;height:100%;transform:scale(1.2);object-fit:cover}.logo-group[data-v-8d5d551b]{display:flex;align-items:center}.line-logo[data-v-8d5d551b]{height:2.8rem;margin-right:12px}.text-logo[data-v-8d5d551b]{height:2.8rem}.speech-bubble.growth-hint[data-v-8d5d551b]{position:absolute;top:85px;right:1.75rem;color:var(--color-text-lighter);border:1px solid var(--color-primary-light);padding:4px 12px;border-radius:8px;font-size:.75rem;font-weight:500;white-space:nowrap;z-index:200}.speech-bubble.growth-hint[data-v-8d5d551b]:after{content:"";position:absolute;top:-6px;right:15px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:6px solid var(--color-primary-light)}@keyframes float-8d5d551b{0%{transform:translateY(0)}50%{transform:translateY(-5px)}to{transform:translateY(0)}}.fade-enter-active[data-v-8d5d551b],.fade-leave-active[data-v-8d5d551b]{transition:opacity .3s ease}.fade-enter-from[data-v-8d5d551b],.fade-leave-to[data-v-8d5d551b]{opacity:0}.main-layout[data-v-d180fa4a]{display:flex;flex-direction:column;min-height:100dvh}.main-content[data-v-d180fa4a]{flex:1;display:flex;flex-direction:column}.modal-overlay[data-v-4011258e]{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;z-index:10000;padding:1.5rem;animation:fadeIn-4011258e .2s ease-out}.modal-overlay.is-closing[data-v-4011258e]{background:#0000;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:auto}.modal-content[data-v-4011258e]{background:var(--color-bg-white, #ffffff);padding:2rem;border-radius:1.5rem;width:100%;max-width:360px;text-align:center;box-shadow:0 20px 50px #0000004d;border:1px solid var(--color-border, #ddd);transition:opacity .2s ease-out}.modal-content.fade-out[data-v-4011258e]{opacity:0;pointer-events:none}.modal-header[data-v-4011258e]{display:flex;flex-direction:column;align-items:center;gap:.8rem;margin-bottom:.8rem}.modal-title[data-v-4011258e]{font-size:1.35rem;font-weight:700;color:var(--color-text, #333);margin:0}.modal-message[data-v-4011258e]{color:var(--color-text-soft, #666);font-size:1.05rem;line-height:1.6;margin-bottom:2rem;word-break:keep-all}.modal-actions[data-v-4011258e]{display:flex;justify-content:center}.modal-btn[data-v-4011258e]{padding:.85rem 3rem;border-radius:1rem;font-weight:600;cursor:pointer;border:none;font-size:1rem;color:#fff;transition:all .2s;box-shadow:0 4px 12px #00000026}.modal-btn[data-v-4011258e]:hover{transform:translateY(-2px);box-shadow:0 6px 15px #0003;filter:brightness(1.1)}.modal-btn[data-v-4011258e]:active{transform:scale(.96)}@keyframes fadeIn-4011258e{0%{opacity:0}to{opacity:1}}.animate-pop[data-v-4011258e]{animation:popIn-4011258e .3s cubic-bezier(.175,.885,.32,1.275)}@keyframes popIn-4011258e{0%{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}#app{min-height:-webkit-fill-available;min-height:100dvh;display:flex;flex-direction:column}#app>header{flex:none}*{margin:0;padding:0;box-sizing:border-box}html{height:100%;height:-webkit-fill-available}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg);margin:0;padding:0;height:100%;height:-webkit-fill-available;min-height:100vh;min-height:-webkit-fill-available;min-height:100dvh;overflow-x:hidden;transition:background-color .3s ease,color .3s ease}#app{width:100%;height:100%;min-height:100vh;min-height:-webkit-fill-available;min-height:100dvh;display:flex;flex-direction:column}button{font-family:inherit;font-size:inherit;cursor:pointer}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}:root{--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-size-base: 18px;--font-size-lg: 20px;--font-size-xl: 28px;--font-size-2xl: 36px;--color-gray: #a0a0a0;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--border-radius-sm: 4px;--border-radius-md: 8px;--border-radius-lg: 12px}:root{--color-primary: #ff4500;--color-primary-hover: #e63e00;--color-primary-light: #ff6a2e;--color-primary-dark: #cc3700;--color-secondary: #6c757d;--color-secondary-hover: #5a6268;--color-secondary-light: #a8b0b6;--color-secondary-dark: #545b62;--color-danger: #d32f2f;--color-danger-hover: #b71c1c;--color-danger-light: #e57373;--color-danger-dark: #c62828;--color-success-bg: #eaffea;--color-success-text: #2d7a2d;--color-success-border: #c2e2c2;--color-growth-bg-1: #f0f7f0;--color-growth-bg-2: #fbc3a4;--color-growth-text: #4b8c4b;--color-gold-1: #ffd700;--color-gold-2: #ffa500;--color-info-bg: #e3f2fd;--color-info-text: #1976d2;--color-danger-bg: #fff0f0;--color-primary-orange: #ff8c00;--color-text: #212529;--color-text-light: #495057;--color-text-lighter: #6c757d;--color-text-inverse: #f8f9fa;--color-bg: #f8f9fa;--color-bg-white: #ffffff;--color-bg-hover: #e9ecef;--color-bg-active: #dee2e6;--color-border: #dee2e6;--color-border-light: #e9ecef;--color-border-dark: #adb5bd;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 2px 4px rgba(0, 0, 0, .07);--shadow-lg: 0 4px 8px rgba(0, 0, 0, .08);--shadow-xl: 0 8px 16px rgba(0, 0, 0, .09);--color-highlight-space: #ff6d00;--color-highlight-punctuation: #d50000;--color-highlight-batchim: #2962ff;--color-highlight-green: #00c853;--color-modal-bg: #fcfcfc;--color-modal-text: #212529;--color-social-kakao: #fee500;--color-social-kakao-text: #3c1e1e;--color-social-google-bg: #ffffff}@media (prefers-color-scheme: dark){:root{--color-primary: #ff5722;--color-primary-hover: #f4511e;--color-primary-light: #ff7043;--color-primary-dark: #e64a19;--color-secondary: #adb5bd;--color-secondary-hover: #9fa8b1;--color-secondary-light: #ced4da;--color-secondary-dark: #868e96;--color-danger: #ef5350;--color-danger-hover: #e57373;--color-danger-light: #e57373;--color-danger-dark: #d32f2f;--color-success-bg: #1b331b;--color-success-text: #81c784;--color-success-border: #2e7d32;--color-growth-bg-1: #1a2e1a;--color-growth-bg-2: #3d261b;--color-growth-text: #81c784;--color-gold-1: #ffcf40;--color-gold-2: #ff9d00;--color-info-bg: #0d47a1;--color-info-text: #bbdefb;--color-danger-bg: #2d1a1a;--color-primary-orange: #ffb74d;--color-text: #e9ecef;--color-text-light: #ced4da;--color-text-lighter: #adb5bd;--color-text-inverse: #212529;--color-bg: #121212;--color-bg-white: #1e1e1e;--color-bg-hover: #2c2c2c;--color-bg-active: #3a3a3a;--color-border: #495057;--color-border-light: #343a40;--color-border-dark: #6c757d;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 2px 4px rgba(0, 0, 0, .4);--shadow-lg: 0 4px 8px rgba(0, 0, 0, .5);--shadow-xl: 0 8px 16px rgba(0, 0, 0, .6);--color-highlight-space: #ff9100;--color-highlight-punctuation: #ff1744;--color-highlight-batchim: #448aff;--color-highlight-green: #69f0ae;--color-modal-bg: #fcfcfc;--color-modal-text: #212529;--color-social-kakao: #fee500;--color-social-kakao-text: #3c1e1e;--color-social-google-bg: #ffffff}}.text-gray{color:var(--color-gray)}.home-view,.level-select-view,.practice-view,.result-view,.purchase-view{flex:1;display:flex;flex-direction:column;width:100%;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}@media (max-width: 768px){body{font-size:14px}.home-view,.level-select-view,.practice-view,.result-view,.purchase-view{padding:1rem;padding-bottom:max(1rem,env(safe-area-inset-bottom));padding-top:max(1rem,env(safe-area-inset-top));padding-left:max(1rem,env(safe-area-inset-left));padding-right:max(1rem,env(safe-area-inset-right))}button{min-height:44px;padding:.75rem 1.5rem;font-size:16px}.camera-capture video{max-width:100%;height:auto}.tts-controls{flex-wrap:wrap}.tts-controls button{flex:1 1 45%;min-width:120px}.level-selector{gap:1.5rem}.level-selector select{font-size:18px;padding:.75rem}}@media (min-width: 769px) and (max-width: 1024px){.home-view,.level-select-view,.practice-view,.result-view,.purchase-view{padding:1.5rem;max-width:800px;margin:0 auto;height:100%}}@media (min-width: 1025px){.home-view,.level-select-view,.practice-view,.result-view,.purchase-view{padding:2rem;max-width:1200px;margin:0 auto;height:100%}}@media (hover: none) and (pointer: coarse){button:hover{opacity:1}button,a,select,input{min-height:44px;min-width:44px}.modal-content{-webkit-overflow-scrolling:touch}}@media (max-width: 768px) and (orientation: landscape){.home-view,.level-select-view,.practice-view,.result-view,.purchase-view{padding:.75rem;max-height:100vh;max-height:100dvh}.camera-capture{flex-direction:row;flex:1;min-height:0}.camera-capture video{max-width:50%;max-height:100%;object-fit:contain}}@media (max-width: 480px) and (orientation: portrait){.home-view,.level-select-view,.practice-view,.result-view,.purchase-view,.settings-view{padding:.75rem;font-size:14px}}@media (max-height: 500px) and (orientation: landscape){.home-view,.level-select-view,.practice-view,.result-view,.purchase-view,.settings-view{padding:.5rem}button{padding:.5rem 1rem;font-size:14px}}#app>:not(header){flex:1;display:flex;flex-direction:column;min-height:0;width:100%}.scrollable-content{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;min-height:0}.app-header,.app-footer{flex-shrink:0}.app-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
