@charset "UTF-8";.app-toast[data-v-25fba58e]{position:fixed;top:var(--spacing-lg);left:50%;margin-left:-160px;width:320px;display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-lg);background:var(--overlay-bg);border:1px solid var(--overlay-border);box-shadow:var(--shadow-overlay);color:var(--text-on-dark);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);text-align:center;z-index:var(--z-tooltip)}.app-toast--success[data-v-25fba58e]{border-left:3px solid var(--success-color)}.app-toast--error[data-v-25fba58e]{border-left:3px solid var(--danger-color)}.app-toast-fade-enter-active[data-v-25fba58e],.app-toast-fade-leave-active[data-v-25fba58e]{transition:opacity var(--transition-normal)}.app-toast-fade-enter-from[data-v-25fba58e],.app-toast-fade-leave-to[data-v-25fba58e]{opacity:0}#app{width:100%;min-height:100vh}.app-nav{position:fixed;top:0;left:0;right:0;z-index:var(--z-sticky);display:flex;align-items:center;gap:var(--spacing-lg);height:48px;padding:0 var(--spacing-lg);background:var(--bg-card);border-bottom:1px solid var(--border-color);transition:opacity var(--transition-fast)}.app-nav.nav-hidden{opacity:0;pointer-events:none}.nav-logo{display:flex;align-items:center;gap:var(--spacing-xs);text-decoration:none;color:var(--text-color);font-weight:var(--font-weight-bold);font-size:var(--font-size-md);flex-shrink:0}.nav-links{display:flex;align-items:center;gap:var(--spacing-xs)}.nav-link{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md);text-decoration:none;color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:background-color var(--transition-fast),color var(--transition-fast)}.nav-link:hover:not(.disabled){background:var(--bg-secondary);color:var(--text-color)}.nav-link.active{background:color-mix(in srgb,var(--primary-color) 12%,transparent);color:var(--primary-color)}.nav-link.disabled{opacity:var(--opacity-disabled);cursor:not-allowed;pointer-events:none}main.has-nav{padding-top:48px}main.has-nav .player-view,main.has-nav .editor-view{min-height:calc(100vh - 48px)}@media (max-width: 767px){.app-nav{gap:var(--spacing-sm);padding:0 var(--spacing-sm)}.nav-link span,.nav-logo span{display:none}}@font-face{font-family:Pretendard;src:local("Pretendard");font-display:swap}@font-face{font-family:NanumSquare;src:local("NanumSquare");font-display:swap}@font-face{font-family:Nanum Myeongjo;src:local("Nanum Myeongjo");font-display:swap}@font-face{font-family:NotoSerifKR;src:local("Noto Serif KR");font-display:swap}:root{--font-pretendard: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;--font-nanum-square: "NanumSquare", -apple-system, BlinkMacSystemFont, sans-serif;--font-nanum-myeongjo: "Nanum Myeongjo", serif;--font-noto-serif: "NotoSerifKR", "Noto Serif KR", serif}:root{--primary-color: #2563eb;--secondary-color: #5c636b;--success-color: #15803d;--danger-color: #dc2626;--warning-color: #b45309;--info-color: #2563eb;--on-accent: #ffffff;--text-color: #212529;--text-secondary: #5c636b;--text-tertiary: #697077;--text-disabled: #9ba1a8;--bg-color: #f6f7f9;--bg-card: #ffffff;--bg-secondary: #f1f3f5;--border-color: #e2e5e9;--border-strong: #8c959f;--scrollbar-thumb: #c3c9d1;--text-on-dark: rgba(255, 255, 255, .9);--text-on-dark-secondary: rgba(255, 255, 255, .6);--text-on-dark-muted: rgba(255, 255, 255, .4);--overlay-backdrop: rgba(0, 0, 0, .75);--overlay-bg: rgba(30, 30, 40, .97);--overlay-border: rgba(255, 255, 255, .15);--surface-glass: rgba(255, 255, 255, .06);--surface-glass-hover: rgba(255, 255, 255, .12);--surface-glass-active: rgba(255, 255, 255, .18);--surface-dark: rgba(0, 0, 0, .3);--surface-dark-hover: rgba(0, 0, 0, .45);--surface-chrome-dark: rgba(20, 20, 28, .8);--color-sfx: #fbbf24;--color-bgm: #8b5cf6;--color-bg-tag: #06b6d4;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .05);--shadow-md: 0 2px 8px rgba(0, 0, 0, .07);--shadow-lg: 0 4px 16px rgba(0, 0, 0, .09);--shadow-overlay: 0 12px 32px rgba(0, 0, 0, .28);--z-dropdown: 100;--z-sticky: 500;--z-overlay: 2000;--z-modal: 9000;--z-tooltip: 9500;--bg-image: none;--bg-image-size: cover;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--transition-fast: .15s;--transition-normal: .2s;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-md: 1rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--font-size-2xl: 2rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-normal: 1.5;--line-height-relaxed: 1.6;--opacity-disabled: .5}body{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--bg-secondary)}body::-webkit-scrollbar{width:8px}body::-webkit-scrollbar-track{background:var(--bg-secondary)}body::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb);border-radius:4px;border:2px solid var(--bg-secondary)}*{margin:0;padding:0;box-sizing:border-box;background-color:transparent}svg,svg *{color:inherit}html{font-size:16px}body{font-family:var(--font-pretendard);font-size:var(--font-size-md);line-height:var(--line-height-normal);color:var(--text-color);background-color:var(--bg-color);background-image:var(--bg-image);background-size:var(--bg-image-size);background-position:center;background-repeat:no-repeat;background-attachment:fixed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--primary-color);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--primary-color);opacity:.8}button{font-family:inherit;cursor:pointer;border:none;outline:none;background-color:var(--bg-card)}input,textarea,select{font-family:inherit;font-size:inherit;outline:none;background-color:transparent;color:var(--text-color)}:where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),textarea,select){border:1px solid var(--border-strong);border-radius:var(--radius-md)}:focus-visible{outline:2px solid var(--primary-color);outline-offset:2px;border-radius:var(--radius-sm)}.modal-overlay :focus-visible,.modal-container :focus-visible,.handout-overlay :focus-visible,.overlay-content :focus-visible{outline-color:var(--text-on-dark)}.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}.text-center{text-align:center}.text-right{text-align:right}.mt-1{margin-top:var(--spacing-sm)}.mt-2{margin-top:var(--spacing-md)}.mt-3{margin-top:var(--spacing-lg)}.mb-1{margin-bottom:var(--spacing-sm)}.mb-2{margin-bottom:var(--spacing-md)}.mb-3{margin-bottom:var(--spacing-lg)}.p-1{padding:var(--spacing-sm)}.p-2{padding:var(--spacing-md)}.p-3{padding:var(--spacing-lg)}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--overlay-backdrop);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--spacing-lg)}.modal-container{background:var(--overlay-bg);border:1px solid var(--overlay-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-overlay);max-width:560px;width:100%;max-height:85vh;overflow-y:auto;padding:var(--spacing-xl)}.modal-container--wide{max-width:800px}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-lg)}.modal-header h3{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-on-dark)}.modal-close{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);transition:background-color var(--transition-fast),color var(--transition-fast)}.modal-close:hover{background:var(--bg-secondary);color:var(--text-color)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:background-color var(--transition-fast),opacity var(--transition-fast);cursor:pointer;border:none;line-height:1.4}.btn:disabled{opacity:var(--opacity-disabled);cursor:not-allowed}.btn-primary{background-color:var(--primary-color);color:#fff}.btn-primary:hover:not(:disabled){opacity:.88}.btn-secondary{background:var(--bg-card);color:var(--text-color);border:1px solid var(--border-strong)}.btn-secondary:hover:not(:disabled){background:var(--bg-secondary)}.btn-danger{background-color:var(--danger-color);color:#fff}.btn-danger:hover:not(:disabled){opacity:.88}.btn-success{background-color:var(--success-color);color:#fff}.btn-success:hover:not(:disabled){opacity:.88}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover:not(:disabled){background:var(--bg-secondary);color:var(--text-color)}.modal-overlay .btn-secondary,.handout-overlay .btn-secondary{background:var(--surface-glass);color:var(--text-on-dark);border-color:var(--overlay-border)}.modal-overlay .btn-secondary:hover:not(:disabled),.handout-overlay .btn-secondary:hover:not(:disabled){background:var(--surface-glass-hover)}.modal-overlay .btn-ghost,.handout-overlay .btn-ghost{color:var(--text-on-dark-secondary)}.modal-overlay .btn-ghost:hover:not(:disabled),.handout-overlay .btn-ghost:hover:not(:disabled){background:var(--surface-glass);color:var(--text-on-dark)}.modal-overlay .modal-close,.handout-overlay .modal-close{background:var(--surface-glass);color:var(--text-on-dark-secondary)}.modal-overlay .modal-close:hover,.handout-overlay .modal-close:hover{background:var(--surface-glass-hover);color:var(--text-on-dark)}.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm)}.tag{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:1.4}.tag--sfx{background:#fbbf2426;color:var(--color-sfx)}.tag--bgm{background:#8b5cf626;color:var(--color-bgm)}.tag--bg{background:#06b6d426;color:var(--color-bg-tag)}.badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;font-size:11px;font-weight:var(--font-weight-semibold);background:var(--primary-color);color:#fff}