@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}@keyframes slideInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}:root{--primary-50: #f0f9ff;--primary-100: #e0f2fe;--primary-200: #bae6fd;--primary-300: #7dd3fc;--primary-400: #38bdf8;--primary-500: #0ea5e9;--primary-600: #0284c7;--primary-700: #0369a1;--primary-800: #075985;--primary-900: #0c4a6e;--secondary-50: #faf5ff;--secondary-100: #f3e8ff;--secondary-200: #e9d5ff;--secondary-300: #d8b4fe;--secondary-400: #c084fc;--secondary-500: #a855f7;--secondary-600: #9333ea;--secondary-700: #7c3aed;--secondary-800: #6b21a8;--secondary-900: #581c87;--gray-50: #fafafa;--gray-100: #f4f4f5;--gray-200: #e4e4e7;--gray-300: #d4d4d8;--gray-400: #a1a1aa;--gray-500: #71717a;--gray-600: #52525b;--gray-700: #3f3f46;--gray-800: #27272a;--gray-900: #18181b;--success-50: #f0fdf4;--success-100: #dcfce7;--success-500: #22c55e;--success-600: #16a34a;--success-700: #15803d;--warning-50: #fffbeb;--warning-100: #fef3c7;--warning-500: #f59e0b;--warning-600: #d97706;--error-50: #fef2f2;--error-100: #fee2e2;--error-500: #ef4444;--error-600: #dc2626;--blue-100: #dbeafe;--blue-700: #1d4ed8;--purple-100: #e9d5ff;--purple-700: #7c3aed;--green-100: #dcfce7;--green-700: #15803d;--orange-100: #fed7aa;--orange-700: #c2410c;--yellow-100: #fef3c7;--yellow-700: #a16207;--pink-100: #fce7f3;--pink-700: #be185d;--glass-bg: rgba(255, 255, 255, .1);--glass-border: rgba(255, 255, 255, .2);--glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, .37);--glass-backdrop: blur(8px);--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", sans-serif;--font-family-mono: "JetBrains Mono", "Fira Code", "Monaco", "Consolas", monospace;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-3xl: 2rem;--shadow-xs: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-sm: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .25);--shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / .05);--shadow-glow: 0 0 20px rgb(14 165 233 / .3);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .35s cubic-bezier(.4, 0, .2, 1);--transition-bounce: .5s cubic-bezier(.68, -.55, .265, 1.55)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at 20% 80%,var(--primary-100) 0%,transparent 50%),radial-gradient(circle at 80% 20%,var(--secondary-100) 0%,transparent 50%),radial-gradient(circle at 40% 40%,var(--primary-50) 0%,transparent 50%),linear-gradient(135deg,var(--gray-50) 0%,var(--gray-100) 100%);color:var(--gray-900);line-height:1.6;min-height:100vh;position:relative}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 25% 25%,rgba(14,165,233,.1) 0%,transparent 50%),radial-gradient(circle at 75% 75%,rgba(168,85,247,.1) 0%,transparent 50%);pointer-events:none;z-index:-1}#root{min-height:100vh}.quiz-builder{display:flex;flex-direction:column;height:100vh;overflow:hidden}.quiz-builder .internationalization-container{flex:1;display:flex;flex-direction:column;overflow:hidden}.header{background:linear-gradient(135deg,var(--primary-600) 0%,var(--primary-700) 50%,var(--secondary-600) 100%);color:#fff;padding:var(--space-8) var(--space-10);box-shadow:var(--shadow-2xl);position:relative;overflow:hidden;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border-bottom:1px solid var(--glass-border)}.header:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.05) 0%,transparent 50%),url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M20 20c0-5.5-4.5-10-10-10s-10 4.5-10 10 4.5 10 10 10 10-4.5 10-10zm10 0c0-5.5-4.5-10-10-10s-10 4.5-10 10 4.5 10 10 10 10-4.5 10-10z'/%3E%3C/g%3E%3C/svg%3E") repeat;pointer-events:none}.header:after{content:"";position:absolute;inset:0;background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.1) 50%,transparent 70%);animation:shimmer 3s ease-in-out infinite;pointer-events:none}@keyframes shimmer{0%,to{transform:translate(-100%)}50%{transform:translate(100%)}}.header h1{font-size:var(--font-size-4xl);font-weight:800;margin-bottom:var(--space-3);position:relative;z-index:1;background:linear-gradient(135deg,#fff,#fffc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.025em}.header p{font-size:var(--font-size-lg);opacity:.9;position:relative;z-index:1;font-weight:500;letter-spacing:.025em}.main-content{display:flex;flex:1;gap:var(--space-2);padding:var(--space-2);padding-top:100px;width:100%;height:calc(100vh - 100px);overflow:hidden}.sidebar{width:360px;background:#fffc;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border-radius:var(--radius-2xl);box-shadow:var(--shadow-xl);padding:0;border:1px solid var(--glass-border);height:100%;display:flex;flex-direction:column;transition:all var(--transition-normal)}.sidebar:hover{transform:translateY(-2px);box-shadow:var(--shadow-2xl)}.editor-panel{flex:1;background:#ffffffe6;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border-radius:var(--radius-2xl);box-shadow:var(--shadow-xl);padding:0;border:1px solid var(--glass-border);height:100%;display:flex;flex-direction:column;transition:all var(--transition-normal)}.editor-panel:hover{transform:translateY(-1px);box-shadow:var(--shadow-2xl)}.preview-panel{width:420px;background:#fffc;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border-radius:var(--radius-2xl);box-shadow:var(--shadow-xl);padding:var(--space-8);border:1px solid var(--glass-border);height:fit-content;position:sticky;top:var(--space-8);transition:all var(--transition-normal)}.preview-panel:hover{transform:translateY(-2px);box-shadow:var(--shadow-2xl)}.form-group{margin-bottom:var(--space-6);position:relative}.form-group label{display:block;margin-bottom:var(--space-3);font-weight:700;color:var(--gray-800);font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:.05em;position:relative}.form-group label:after{content:"";position:absolute;bottom:-4px;left:0;width:30px;height:2px;background:linear-gradient(90deg,var(--primary-500),var(--secondary-500));border-radius:1px}.form-group input,.form-group textarea,.form-group select{width:100%;padding:var(--space-4) var(--space-5);border:2px solid var(--gray-200);border-radius:var(--radius-lg);font-size:var(--font-size-base);font-family:inherit;background:#ffffffe6;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);transition:all var(--transition-normal);box-shadow:var(--shadow-sm);position:relative}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--primary-500);box-shadow:0 0 0 4px #0ea5e91a,var(--shadow-md);transform:translateY(-2px);background:#fff}.form-group input:hover,.form-group textarea:hover,.form-group select:hover{border-color:var(--primary-300);transform:translateY(-1px);box-shadow:var(--shadow-md)}.form-group textarea{min-height:120px;resize:vertical;line-height:1.7}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--gray-400);font-style:italic}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4) var(--space-6);border:none;border-radius:var(--radius-lg);cursor:pointer;font-size:var(--font-size-sm);font-weight:700;font-family:inherit;text-decoration:none;transition:all var(--transition-normal);box-shadow:var(--shadow-md);position:relative;overflow:hidden;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);letter-spacing:.025em;text-transform:uppercase}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left var(--transition-slow)}.btn:hover:before{left:100%}.btn:active{transform:translateY(1px) scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:var(--shadow-sm)}.btn-primary{background:linear-gradient(135deg,var(--primary-500) 0%,var(--primary-600) 50%,var(--secondary-500) 100%);color:#fff;box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.2)}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,var(--primary-600) 0%,var(--primary-700) 50%,var(--secondary-600) 100%);box-shadow:var(--shadow-xl),var(--shadow-glow);transform:translateY(-3px) scale(1.02)}.btn-secondary{background:#fffc;color:var(--gray-700);border:2px solid var(--gray-200);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop)}.btn-secondary:hover:not(:disabled){background:#fff;border-color:var(--primary-300);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.btn-success{background:linear-gradient(135deg,var(--success-500) 0%,var(--success-600) 100%);color:#fff;box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.2)}.btn-success:hover:not(:disabled){background:linear-gradient(135deg,var(--success-600) 0%,var(--success-700) 100%);box-shadow:var(--shadow-xl),0 0 20px #22c55e4d;transform:translateY(-3px) scale(1.02)}.btn-danger{background:linear-gradient(135deg,var(--error-500) 0%,var(--error-600) 100%);color:#fff;box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.2)}.btn-danger:hover:not(:disabled){background:linear-gradient(135deg,var(--error-600) 0%,#b91c1c 100%);box-shadow:var(--shadow-xl),0 0 20px #ef44444d;transform:translateY(-3px) scale(1.02)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--font-size-xs);border-radius:var(--radius-md)}.btn-lg{padding:var(--space-5) var(--space-10);font-size:var(--font-size-lg);border-radius:var(--radius-xl)}.question-list{padding-right:var(--space-3)}.question-list-scrollable::-webkit-scrollbar{width:8px}.question-list-scrollable::-webkit-scrollbar-track{background:#ffffff1a;border-radius:var(--radius-lg);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop)}.question-list-scrollable::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--primary-400),var(--secondary-400));border-radius:var(--radius-lg);border:2px solid rgba(255,255,255,.2)}.question-list-scrollable::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--primary-500),var(--secondary-500))}.question-item{padding:var(--space-5);border:2px solid var(--glass-border);border-radius:var(--radius-xl);margin-bottom:var(--space-4);cursor:pointer;transition:all var(--transition-normal);background:#fff9;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);position:relative;overflow:hidden}.question-item:before{content:"";position:absolute;top:0;left:0;width:6px;height:100%;background:linear-gradient(135deg,var(--primary-500),var(--secondary-500));transform:scaleY(0);transition:transform var(--transition-normal);border-radius:0 var(--radius-sm) var(--radius-sm) 0}.question-item:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#0ea5e90d,#a855f70d);opacity:0;transition:opacity var(--transition-normal);pointer-events:none}.question-item:hover{background:#ffffffe6;border-color:var(--primary-300);transform:translateY(-4px) scale(1.02);box-shadow:var(--shadow-xl)}.question-item:hover:before{transform:scaleY(1)}.question-item:hover:after{opacity:1}.question-item.active{background:#fffffff2;border-color:var(--primary-500);box-shadow:var(--shadow-xl),var(--shadow-glow);transform:translateY(-2px)}.question-item.active:before{transform:scaleY(1)}.question-item.active:after{opacity:1}.question-item h4{font-size:var(--font-size-lg);font-weight:700;margin-bottom:var(--space-2);color:var(--gray-800);position:relative;z-index:1}.question-item p{font-size:var(--font-size-sm);color:var(--gray-600);margin:0;line-height:1.5;position:relative;z-index:1}.question-item .template-badge{display:inline-block;background:linear-gradient(135deg,var(--primary-100),var(--secondary-100));color:var(--primary-700);padding:var(--space-2) var(--space-3);border-radius:var(--radius-lg);font-size:var(--font-size-xs);font-weight:700;margin-bottom:var(--space-3);border:1px solid var(--glass-border);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);text-transform:uppercase;letter-spacing:.05em;position:relative;z-index:1}.options-editor{border:2px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--space-6);background:var(--gray-50)}.option-item{border:2px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--space-5);margin-bottom:var(--space-4);background:#fff;transition:all var(--transition-fast);position:relative}.option-item:hover{border-color:var(--primary-300);box-shadow:var(--shadow-sm)}.option-item.correct{border-color:var(--success-300);background:var(--success-50)}.option-item h5{margin-bottom:var(--space-3);color:var(--gray-700);font-weight:600;display:flex;align-items:center;gap:var(--space-2)}.option-item h5:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gray-400)}.option-item.correct h5:before{background:var(--success-500)}.option-controls{display:flex;gap:var(--space-2);margin-top:var(--space-3)}.preview-container{border:2px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--space-6);background:var(--gray-50);min-height:400px}.preview-section{margin-bottom:var(--space-5);padding:var(--space-4);background:#fff;border-radius:var(--radius-md);border:1px solid var(--gray-200)}.preview-section h4{color:var(--primary-600);font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--space-3);display:flex;align-items:center;gap:var(--space-2)}.preview-section h4:before{content:"📝";font-size:var(--font-size-base)}.preview-section h5{color:var(--gray-700);font-size:var(--font-size-base);font-weight:600;margin-bottom:var(--space-2)}.preview-option{border:2px solid var(--gray-200);border-radius:var(--radius-md);padding:var(--space-3);margin-bottom:var(--space-2);background:#fff;transition:all var(--transition-fast)}.preview-option.correct{border-color:var(--success-300);background:var(--success-50)}.preview-option:hover{border-color:var(--primary-300);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.export-panel{background:linear-gradient(135deg,#fffc,#0ea5e91a,#a855f71a);-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border-top:2px solid var(--glass-border);padding:var(--space-8) var(--space-10);display:flex;justify-content:space-between;align-items:center;box-shadow:0 -8px 32px #1f26875e,inset 0 1px #fff3;position:relative;overflow:hidden}.export-panel:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(14,165,233,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(168,85,247,.1) 0%,transparent 50%);pointer-events:none}.export-info{color:var(--gray-700);font-size:var(--font-size-base);display:flex;flex-direction:column;gap:var(--space-2);position:relative;z-index:1}.export-info strong{color:var(--gray-900);font-weight:700;font-size:var(--font-size-lg)}.export-status{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-2);font-weight:600;font-size:var(--font-size-sm)}.export-status.valid{color:var(--success-600)}.export-status.invalid{color:var(--error-600)}.loading{display:inline-block;width:20px;height:20px;border:3px solid var(--gray-200);border-radius:50%;border-top-color:var(--primary-500);animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.badge{display:inline-flex;align-items:center;padding:var(--space-2) var(--space-3);border-radius:var(--radius-lg);font-size:var(--font-size-xs);font-weight:700;text-transform:uppercase;letter-spacing:.05em;-webkit-backdrop-filter:var(--glass-backdrop);backdrop-filter:var(--glass-backdrop);border:1px solid var(--glass-border);position:relative;overflow:hidden}.badge:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left var(--transition-normal)}.badge:hover:before{left:100%}.badge-primary{background:linear-gradient(135deg,var(--primary-100),var(--secondary-100));color:var(--primary-700);box-shadow:var(--shadow-sm)}.badge-success{background:linear-gradient(135deg,var(--success-100),var(--success-50));color:var(--success-700);box-shadow:var(--shadow-sm)}.badge-warning{background:linear-gradient(135deg,var(--warning-100),var(--warning-50));color:var(--warning-600);box-shadow:var(--shadow-sm)}.badge-error{background:linear-gradient(135deg,var(--error-100),var(--error-50));color:var(--error-600);box-shadow:var(--shadow-sm)}@media (max-width: 1200px){.main-content{flex-direction:column;gap:var(--space-6)}.sidebar,.preview-panel{width:100%;position:static}.export-panel{flex-direction:column;gap:var(--space-6);text-align:center}}@media (max-width: 768px){.header{padding:var(--space-6)}.header h1{font-size:var(--font-size-3xl)}.main-content{padding:var(--space-2);padding-top:100px;height:calc(100vh - 100px)}.sidebar,.editor-panel,.preview-panel{padding:0}.export-panel{padding:var(--space-6)}.btn{padding:var(--space-3) var(--space-5);font-size:var(--font-size-xs)}.btn-lg{padding:var(--space-4) var(--space-6);font-size:var(--font-size-base)}}@media (max-width: 480px){.header{padding:var(--space-4)}.header h1{font-size:var(--font-size-2xl)}.main-content{padding:var(--space-4);padding-top:120px;gap:var(--space-4)}.sidebar,.editor-panel,.preview-panel{padding:0}.export-panel{padding:var(--space-4)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes quizDialogSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes quizDialogSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}