@import "https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css";
@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700&display=swap";
:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--cream:#faf6ef;--surface:#fff;--ink:#2c2420;--ink-soft:#867669;--ink-faint:#b6a998;--line:#eee3d5;--terracotta:#c9684b;--terracotta-deep:#a84e36;--terracotta-tint:#f4ddd0;--sage:#62795e;--sage-tint:#dee6d6;--pill:#f1e8dc;--hero-dark:#241c17;--hero-dark-line:#ffffff17;--accent-on-dark:#f2a988;--on-dark-soft:#fff9;--font-ui-cn-fallback:"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;--font-ui-kr-fallback:"Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", sans-serif;--font-kr:"Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;--font-cn:"Noto Sans SC", "PingFang SC", -apple-system, BlinkMacSystemFont, "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-num:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--color-primary:#d45a3a;--color-primary-hover:#b8472a;--color-primary-light:#fbefea;--color-accent:#b8741f;--color-page:#f7f8fb;--color-surface:#fff;--color-surface-hover:#fbefea;--color-border-focus:#d45a3a;--color-text-main:#1a1d29;--color-text-body:#4b4f63;--color-text-muted:#6b7280;--color-text-light:#9499ad;--color-border-subtle:#e5e7f0;--radius-md:.5625rem;--radius-lg:.75rem;--radius-xl:.875rem;--radius-2xl:.875rem;--radius-3xl:.875rem}*{box-sizing:border-box}html,body{background:radial-gradient(circle at 0 0,#d45a3a1a,#0000 30%),linear-gradient(#fbfcfe 0%,#f7f8fb 100%);min-height:100%;margin:0}body{min-height:100vh;color:var(--color-text-body);font-family:var(--font-cn);letter-spacing:-.01em;text-rendering:optimizelegibility;font-weight:400}@media (max-width:767px){html,body{touch-action:pan-y pinch-zoom;-webkit-overflow-scrolling:touch;overscroll-behavior-y:auto;scroll-behavior:auto;height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto!important}body{background-attachment:scroll}body>div:last-of-type{-webkit-overflow-scrolling:touch;touch-action:pan-y pinch-zoom;overscroll-behavior-y:auto;min-height:100dvh;overflow-x:hidden;overflow-y:auto!important}.mobile-app-scroll{scrollbar-width:auto;height:auto;min-height:100dvh;overflow-x:hidden;overflow-y:auto!important}.mobile-app-scroll-main{min-height:auto}.mobile-app-scroll::-webkit-scrollbar{width:10px}body::-webkit-scrollbar{width:10px}html::-webkit-scrollbar{width:10px}.mobile-app-scroll::-webkit-scrollbar-thumb{background:#78787873;border-radius:999px}body::-webkit-scrollbar-thumb{background:#78787873;border-radius:999px}html::-webkit-scrollbar-thumb{background:#78787873;border-radius:999px}a,button,select,input,textarea,label,summary,[role=button]{touch-action:pan-y pinch-zoom}}h1,h2,h3,h4,h5,h6,button,input,select,textarea{font-family:var(--font-cn)}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.line-clamp-1,.line-clamp-2,.line-clamp-3{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.line-clamp-1{-webkit-line-clamp:1}.line-clamp-2{-webkit-line-clamp:2}.line-clamp-3{-webkit-line-clamp:3}.no-scrollbar::-webkit-scrollbar{width:0;height:0;display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.glass-panel{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffd1}.font-kr{font-family:var(--font-kr)}.font-cn{font-family:var(--font-cn)}.font-num{font-family:var(--font-num);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}.font-sans{font-family:var(--font-cn)}@keyframes uxFadeLift{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes uxShimmer{0%{background-position:120% 0}to{background-position:-120% 0}}@keyframes learnLoaderSpin{to{transform:rotate(360deg)}}@keyframes learnLoaderSpinReverse{to{transform:rotate(-360deg)}}@keyframes learnLoaderPulse{0%,to{opacity:.58;transform:scale(.88)}50%{opacity:1;transform:scale(1)}}@keyframes learnLoaderFloat{0%{opacity:0;transform:translateY(10px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.ux-page-enter{animation:.36s cubic-bezier(.2,.8,.2,1) both uxFadeLift}.ux-card{transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s cubic-bezier(.2,.8,.2,1),border-color .18s,background-color .18s}.ux-card:hover{transform:translateY(-1px);box-shadow:0 18px 45px #0f172a17}.ux-skeleton{background:linear-gradient(90deg,#e2e8f0a6 25%,#f8fafcf2 38%,#e2e8f0a6 63%) 0 0/240% 100%;animation:1.35s ease-in-out infinite uxShimmer}button,a,[role=button]{transition:transform .15s cubic-bezier(.2,.8,.2,1),box-shadow .15s cubic-bezier(.2,.8,.2,1),background-color .15s,border-color .15s,color .15s,opacity .15s}button:not(:disabled):active,a:active,[role=button]:active{transform:translateY(1px)scale(.985)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[role=button]:focus-visible{outline-offset:2px;outline:3px solid #10b98138}tbody tr{transition:background-color .15s,transform .15s}tbody tr:hover{background-color:#f8fafcdb}.player-frame,.vintage-card,.practice-panel,.learn-side-panel,.learn-main-section,.rounded-\[2rem\],.rounded-\[30px\]{transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s cubic-bezier(.2,.8,.2,1),background-color .18s,border-color .18s}.player-skeleton{background:linear-gradient(90deg,#e2e8f0ad 25%,#f8fafcf2 38%,#e2e8f0ad 63%) 0 0/240% 100%;animation:1.35s ease-in-out infinite uxShimmer}.learn-loading-page{color:#34281f;background:radial-gradient(circle at 14% 4%,#e0876a24,#0000 34%),linear-gradient(#f6efe5 0%,#f8f4ec 48%,#f3eadf 100%);min-height:100dvh;overflow:hidden}.learn-loading-header{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#faf6efeb;border-bottom:1px solid #bfb2a052;flex:none;padding:16px 24px}.learn-loading-title-row{align-items:center;gap:16px;display:flex}.learn-loading-avatar{border-radius:999px;width:40px;height:40px}.learn-loading-title{border-radius:999px;width:min(320px,100vw - 112px);height:28px}.learn-loading-grid{grid-template-columns:minmax(0,1.65fr) minmax(320px,.9fr);min-height:0;display:grid}.learn-loading-main{border-right:1px solid #bfb2a052;flex-direction:column;min-height:0;display:flex}.learn-loading-player-wrap{flex:auto;padding:24px}.learn-loading-player{aspect-ratio:16/9;border-radius:30px;width:100%;min-height:220px;box-shadow:0 24px 60px #4a3b2b1f}.learn-loading-control{background:#faf6efc2;flex:none;padding:14px 32px 18px}.learn-loading-control-inner{justify-content:space-between;align-items:center;gap:14px;max-width:960px;margin:0 auto;display:flex}.learn-loading-pill{border-radius:999px;width:96px;height:40px}.learn-loading-play{border-radius:999px;width:64px;height:64px}.learn-loading-side{background:#faf6efd1;flex-direction:column;min-height:0;display:flex}.learn-loading-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px;display:grid}.learn-loading-tabs>div{border-radius:999px;height:42px}.learn-loading-list{flex:auto;min-height:0;padding:0 14px 16px;overflow:hidden}.learn-loading-card{background:#fffcf7c7;border:1px solid #bfb2a047;border-radius:24px;margin-bottom:12px;padding:16px 18px;box-shadow:0 16px 36px #4a3b2b14}.learn-loading-line-sm{border-radius:999px;width:64px;height:24px}.learn-loading-line-lg{border-radius:999px;width:78%;height:20px;margin-top:14px}.learn-loading-line-md{border-radius:999px;width:62%;height:18px;margin-top:10px}@media (max-width:767px){.learn-loading-page{min-height:100dvh;overflow:hidden}.learn-loading-header{background:#faf6efdb;border-bottom:0;padding:12px 14px}.learn-loading-title-row{gap:12px}.learn-loading-avatar{width:36px;height:36px}.learn-loading-title{width:min(260px,100vw - 78px);height:24px}.learn-loading-grid{flex-direction:column;height:calc(100dvh - 60px);display:flex}.learn-loading-main{border-right:0;flex:none}.learn-loading-player-wrap{padding:10px 12px 8px}.learn-loading-player{border-radius:22px;min-height:0}.learn-loading-control{background:0 0;padding:8px 12px 12px}.learn-loading-control-inner{justify-content:center;gap:8px}.learn-loading-pill{width:clamp(44px,17vw,64px);height:32px}.learn-loading-play{width:48px;height:48px}.learn-loading-side{background:0 0;flex:auto;min-height:0}.learn-loading-tabs{gap:8px;padding:4px 12px 10px}.learn-loading-tabs>div{height:36px}.learn-loading-list{padding:0 12px 18px}.learn-loading-card{background:#fffcf7d1;border-radius:18px;margin-bottom:10px;padding:14px}}.learn-loading-page{color:#34281f;background:radial-gradient(circle at 22% 18%,#d66d4b29,#0000 28%),radial-gradient(circle at 78% 72%,#3f81751f,#0000 32%),linear-gradient(#f7efe5 0%,#fbf7f0 52%,#f1e8dc 100%);justify-content:center;align-items:center;min-height:100dvh;padding:28px;display:flex;overflow:hidden}.learn-loading-shell{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:14px;width:min(100%,300px);min-height:260px;animation:.32s ease-out both learnLoaderFloat;display:flex}.learn-loader{contain:layout paint;width:96px;height:96px;margin-bottom:8px;position:relative}.learn-loader-ring{border:1px solid #bfb2a08c;border-radius:999px;position:absolute;inset:8px}.learn-loader-core{background:linear-gradient(135deg,#cd6340f2,#e8a16feb);border-radius:999px;animation:1.45s ease-in-out infinite learnLoaderPulse;position:absolute;inset:32px;box-shadow:0 18px 38px #be583a3d}.learn-loader-orbit{border-radius:999px;animation:1.12s linear infinite learnLoaderSpin;position:absolute;inset:0}.learn-loader-orbit:before{content:"";background:#c95f3f;border-radius:999px;width:12px;height:12px;position:absolute;top:8px;left:50%;transform:translate(-50%);box-shadow:0 8px 18px #c95f3f42}.learn-loader-orbit-two{animation:1.65s linear infinite learnLoaderSpinReverse;inset:14px}.learn-loader-orbit-two:before{background:#5f8f82;width:9px;height:9px;top:5px;box-shadow:0 8px 18px #5f8f8238}.learn-loading-copy{letter-spacing:0;font-size:20px;font-weight:900}.learn-loading-subcopy{color:#34281f94;letter-spacing:0;font-size:13px;font-weight:700}.admin-action-button,button,a,[role=button]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.admin-scroll-area{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;contain:content;max-height:min(68vh,720px);transition:opacity .14s}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}