:root{--blue-50: #eff6ff;--blue-500: #3b82f6;--blue-600: #2563eb;--blue-700: #1d4ed8;--green-50: #f0fdf4;--green-500: #22c55e;--green-600: #16a34a;--green-700: #15803d;--purple-50: #faf5ff;--purple-500: #8b5cf6;--purple-600: #7c3aed;--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--red-50: #fef2f2;--red-500: #ef4444;--red-600: #dc2626;--yellow-50: #fffbeb;--yellow-500: #eab308;--yellow-600: #d97706;--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;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--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);--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;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.6;color:var(--gray-800);background-color:var(--gray-50);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{max-width:1200px;margin:0 auto;padding:0 var(--space-4)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-xs{font-size:var(--font-size-xs)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.text-3xl{font-size:var(--font-size-3xl)}.text-4xl{font-size:var(--font-size-4xl)}.text-5xl{font-size:var(--font-size-5xl)}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.text-gray-500{color:var(--gray-500)}.text-gray-600{color:var(--gray-600)}.text-gray-700{color:var(--gray-700)}.text-gray-800{color:var(--gray-800)}.text-gray-900{color:var(--gray-900)}.text-blue-600{color:var(--blue-600)}.text-green-600{color:var(--green-600)}.text-red-600{color:var(--red-600)}.bg-white{background-color:#fff}.bg-gray-50{background-color:var(--gray-50)}.bg-gray-100{background-color:var(--gray-100)}.bg-blue-50{background-color:var(--blue-50)}.bg-green-50{background-color:var(--green-50)}.bg-red-50{background-color:var(--red-50)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-3) var(--space-6);border-radius:var(--radius-lg);font-weight:600;text-decoration:none;border:none;cursor:pointer;transition:all .2s ease;font-size:var(--font-size-base);line-height:1}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--blue-600),var(--green-600));color:#fff;box-shadow:var(--shadow-md)}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,var(--blue-700),var(--green-700));box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-secondary{background:white;color:var(--gray-700);border:2px solid var(--gray-300)}.btn-secondary:hover:not(:disabled){border-color:var(--gray-400);background:var(--gray-50)}.btn-outline{background:transparent;color:var(--blue-600);border:2px solid var(--blue-600)}.btn-outline:hover:not(:disabled){background:var(--blue-50)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--font-size-lg)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--font-size-sm)}.card{background:white;border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-md);border:1px solid var(--gray-200);transition:all .3s ease}.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-selectable{cursor:pointer;border:2px solid var(--gray-200)}.card-selectable:hover{border-color:var(--gray-300)}.card-selected{border-color:var(--blue-500)!important;background:var(--blue-50);box-shadow:var(--shadow-xl)}.card-header{display:flex;align-items:center;margin-bottom:var(--space-4)}.card-icon{width:48px;height:48px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;margin-right:var(--space-4);font-size:var(--font-size-xl)}.card-title{font-size:var(--font-size-xl);font-weight:700;color:var(--gray-900);margin:0}.card-description{color:var(--gray-600);margin-bottom:var(--space-4);line-height:1.6}.form-group{margin-bottom:var(--space-4)}.form-label{display:block;font-weight:600;color:var(--gray-700);margin-bottom:var(--space-2)}.form-input{width:100%;padding:var(--space-3);border:2px solid var(--gray-300);border-radius:var(--radius-md);font-size:var(--font-size-base);transition:border-color .2s ease}.form-input:focus{outline:none;border-color:var(--blue-500);box-shadow:0 0 0 3px #3b82f61a}.form-select{width:100%;padding:var(--space-3);border:2px solid var(--gray-300);border-radius:var(--radius-md);background:white;font-size:var(--font-size-base)}.grid{display:grid;gap:var(--space-6)}.grid-cols-1{grid-template-columns:repeat(1,1fr)}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.p-2{padding:var(--space-2)}.p-3{padding:var(--space-3)}.p-4{padding:var(--space-4)}.p-6{padding:var(--space-6)}.p-8{padding:var(--space-8)}.m-2{margin:var(--space-2)}.m-3{margin:var(--space-3)}.m-4{margin:var(--space-4)}.m-6{margin:var(--space-6)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mt-2{margin-top:var(--space-2)}.mt-3{margin-top:var(--space-3)}.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}.progress-bar{width:100%;height:8px;background:var(--gray-200);border-radius:var(--radius-md);overflow:hidden;margin-bottom:var(--space-4)}.progress-fill{height:100%;background:linear-gradient(to right,var(--blue-600),var(--green-600));transition:width .3s ease}.badge{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-3);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500}.badge-blue{background:var(--blue-100);color:var(--blue-800)}.badge-green{background:var(--green-100);color:var(--green-800)}.badge-gray{background:var(--gray-100);color:var(--gray-800)}.badge-red{background:var(--red-100);color:var(--red-800)}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-bounce{animation:bounce 1s infinite}.transition-all{transition:all .3s ease}.hover-lift:hover{transform:translateY(-2px)}.hover-scale:hover{transform:scale(1.02)}@keyframes bounce{0%,to{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}}@media (min-width: 640px){.sm\\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.sm\\:text-lg{font-size:var(--font-size-lg)}.sm\\:text-xl{font-size:var(--font-size-xl)}}@media (min-width: 768px){.md\\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.md\\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.md\\:text-xl{font-size:var(--font-size-xl)}.md\\:text-2xl{font-size:var(--font-size-2xl)}}@media (min-width: 1024px){.lg\\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.lg\\:grid-cols-4{grid-template-columns:repeat(4,1fr)}.lg\\:text-2xl{font-size:var(--font-size-2xl)}.lg\\:text-3xl{font-size:var(--font-size-3xl)}}.hearing-ready-gradient{background:linear-gradient(135deg,#dbeafe 0%,#ffffff 50%,#dcfce7 100%)}.game-mode-card{position:relative;background:white;border:2px solid var(--gray-200);border-radius:var(--radius-2xl);padding:var(--space-6);cursor:pointer;transition:all .3s ease;overflow:hidden}.game-mode-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--blue-500),var(--green-500));opacity:0;transition:opacity .3s ease;z-index:0}.game-mode-card:hover:before{opacity:.05}.game-mode-card.selected{border-color:var(--blue-500);background:var(--blue-50);transform:translateY(-4px);box-shadow:var(--shadow-2xl)}.game-mode-card.selected:before{opacity:.1}.game-mode-card>*{position:relative;z-index:1}.selection-indicator{position:absolute;top:var(--space-4);right:var(--space-4);width:24px;height:24px;border-radius:50%;background:var(--blue-500);display:flex;align-items:center;justify-content:center;z-index:2}.selection-indicator:after{content:"✓";color:#fff;font-size:var(--font-size-sm);font-weight:700}.game-setup-container{min-height:100vh;background:linear-gradient(135deg,var(--blue-50) 0%,var(--green-50) 100%);padding:var(--space-6)}.game-setup-content{max-width:1200px;margin:0 auto;background:white;border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);overflow:hidden}.setup-header{padding:var(--space-8);background:linear-gradient(135deg,var(--blue-600),var(--green-600));color:#fff;position:relative}.setup-header:before{content:"";position:absolute;top:0;left:0;right:0;bottom: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,.1) 0%,transparent 50%),radial-gradient(circle at 40% 60%,rgba(255,255,255,.05) 0%,transparent 50%);pointer-events:none}.header-text{position:relative;z-index:1;margin-top:var(--space-4)}.header-text h1{margin:0 0 var(--space-2) 0;font-size:2.5rem;font-weight:700;background:linear-gradient(45deg,#ffffff,#f0f9ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.header-text p{margin:0;opacity:.9;font-size:1.125rem}.progress-container{padding:var(--space-8) var(--space-8) var(--space-4) var(--space-8);background:var(--gray-50);border-bottom:1px solid var(--gray-200)}.progress-steps{display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-4);gap:var(--space-2)}.progress-step-wrapper{display:flex;align-items:center;gap:var(--space-2)}.progress-step{width:3rem;height:3rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;transition:all .3s ease;background:white;border:3px solid var(--gray-300);color:var(--gray-500);position:relative}.progress-step.active{border-color:var(--blue-500);color:var(--blue-600);background:var(--blue-50);transform:scale(1.1)}.progress-step.completed{background:linear-gradient(135deg,var(--blue-500),var(--green-500));border-color:var(--blue-500);color:#fff;transform:scale(1.05)}.progress-line{width:4rem;height:3px;background:var(--gray-300);border-radius:9999px;transition:all .3s ease}.progress-line.completed{background:linear-gradient(90deg,var(--blue-500),var(--green-500));box-shadow:0 0 10px #3b82f64d}.progress-labels{display:flex;justify-content:space-between;max-width:600px;margin:0 auto;font-size:.875rem;font-weight:500;color:var(--gray-600)}.progress-labels span.active{color:var(--blue-600);font-weight:600}.step-container{padding:var(--space-8);animation:slideIn .5s ease-out}@keyframes slideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.step-header{text-align:center;margin-bottom:var(--space-8)}.step-header h2{margin:0 0 var(--space-3) 0;font-size:2rem;font-weight:700;color:var(--gray-900)}.step-header p{font-size:1.125rem;color:var(--gray-600);max-width:600px;margin:0 auto}.industry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-6);margin-bottom:var(--space-8)}.session-types-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--space-6);margin-bottom:var(--space-8)}.focus-areas-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4);margin-bottom:var(--space-8)}.themes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-4)}.characters-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-6);margin-bottom:var(--space-8)}.card-selectable{position:relative;overflow:hidden;transition:all .3s ease}.card-selectable:after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,var(--blue-500) 0%,transparent 70%);opacity:0;transform:translate(-50%,-50%);transition:all .3s ease;pointer-events:none}.card-selectable:hover:after{width:100%;height:100%;opacity:.1}.card-selected{border-color:var(--blue-500)!important;background:linear-gradient(135deg,var(--blue-50),var(--green-50))!important;box-shadow:0 0 20px #3b82f633!important;transform:translateY(-2px)}.card-selected:before{content:"✓";position:absolute;top:1rem;right:1rem;width:1.5rem;height:1.5rem;background:linear-gradient(135deg,var(--blue-500),var(--green-500));color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;z-index:10}.session-summary{margin-top:var(--space-8);padding:var(--space-6);background:linear-gradient(135deg,var(--green-50),var(--blue-50));border-radius:var(--radius-lg);border:2px solid var(--green-200);text-align:center}.summary-title{margin:0 0 var(--space-4) 0;color:var(--green-700);font-size:1.5rem;font-weight:700}.summary-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-4);margin-bottom:var(--space-6);text-align:left}.summary-item{padding:var(--space-3);background:white;border-radius:var(--radius-md);border:1px solid var(--green-200);font-size:.875rem}.summary-item strong{color:var(--green-800)}.start-session-btn{position:relative;overflow:hidden;font-size:1.125rem;padding:var(--space-4) var(--space-8);background:linear-gradient(135deg,var(--green-500),var(--blue-500));border:none;box-shadow:var(--shadow-lg);transform:translateY(0);transition:all .3s ease}.start-session-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl);background:linear-gradient(135deg,var(--green-600),var(--blue-600))}.navigation-footer{display:flex;align-items:center;padding:var(--space-6) var(--space-8);background:var(--gray-50);border-top:1px solid var(--gray-200)}.nav-spacer{flex:1}.loading-container,.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;padding:var(--space-8);text-align:center}.loading-spinner{width:3rem;height:3rem;border:3px solid var(--gray-200);border-top:3px solid var(--blue-500);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:var(--space-4)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.game-setup-container{padding:var(--space-4)}.setup-header{padding:var(--space-6)}.header-text h1{font-size:2rem}.step-container{padding:var(--space-6)}.step-header h2{font-size:1.5rem}.industry-grid,.session-types-grid,.focus-areas-grid,.themes-grid,.characters-grid,.summary-content{grid-template-columns:1fr}}.enhanced-theme-selector{margin-bottom:var(--space-8)}.theme-selector-header{margin-bottom:var(--space-4)}.theme-selector-header h3{font-size:var(--font-size-xl);font-weight:700;color:var(--gray-900)}.section-description{font-size:var(--font-size-base);color:var(--gray-600)}.theme-controls{margin-bottom:var(--space-6)}.theme-controls-row{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-bottom:var(--space-4)}.search-container{flex:1;min-width:200px}.search-input-wrapper{position:relative}.search-icon{position:absolute;top:50%;left:var(--space-3);transform:translateY(-50%);width:20px;height:20px;color:var(--gray-500)}.search-input{width:100%;padding:var(--space-3) var(--space-3) var(--space-3) var(--space-10);border:2px solid var(--gray-300);border-radius:var(--radius-md);font-size:var(--font-size-base)}.search-input:focus{border-color:var(--blue-500);box-shadow:0 0 0 3px #3b82f61a}.search-clear{position:absolute;top:50%;right:var(--space-3);transform:translateY(-50%);background:none;border:none;color:var(--gray-500);font-size:var(--font-size-lg);cursor:pointer}.filter-container,.sort-container{min-width:150px}.filter-select,.sort-select{width:100%;padding:var(--space-3);border:2px solid var(--gray-300);border-radius:var(--radius-md);background:white;font-size:var(--font-size-base)}.quick-filters{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.quick-filters-label{font-size:var(--font-size-sm);color:var(--gray-600);margin-right:var(--space-2)}.focus-area-tag{padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);background:var(--gray-100);color:var(--gray-800);font-size:var(--font-size-sm);cursor:pointer}.focus-area-tag.active{background:var(--blue-100);color:var(--blue-800)}.selection-summary{margin-bottom:var(--space-6);padding:var(--space-4);background:var(--gray-50);border-radius:var(--radius-md)}.summary-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-3)}.summary-header h4{font-size:var(--font-size-lg);color:var(--gray-900)}.clear-all-btn{background:none;border:none;color:var(--red-600);font-size:var(--font-size-sm);cursor:pointer}.selected-themes{display:flex;flex-wrap:wrap;gap:var(--space-2)}.selected-theme-chip{display:flex;align-items:center;padding:var(--space-2) var(--space-3);background:var(--blue-100);color:var(--blue-800);border-radius:var(--radius-md);font-size:var(--font-size-sm)}.remove-theme-btn{background:none;border:none;color:var(--blue-800);margin-left:var(--space-2);cursor:pointer}.themes-grid-enhanced{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-4)}.theme-card-enhanced{position:relative;background:white;border:2px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--space-4);cursor:pointer;transition:all .3s ease}.theme-card-enhanced:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.theme-card-enhanced.selected{border-color:var(--blue-500);background:var(--blue-50)}.theme-card-enhanced.disabled{opacity:.5;cursor:not-allowed}.theme-card-enhanced.relevant{border-color:var(--green-500)}.relevance-badge{position:absolute;top:var(--space-3);left:var(--space-3);display:flex;align-items:center;gap:var(--space-1);font-size:var(--font-size-xs);color:var(--green-800)}.relevance-text{display:none}.theme-card-enhanced.relevant:hover .relevance-text{display:inline}.selection-indicator{position:absolute;top:var(--space-3);right:var(--space-3);width:1.5rem;height:1.5rem;background:var(--blue-500);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem}.theme-content .theme-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-2)}.theme-title{font-size:var(--font-size-base);font-weight:600;color:var(--gray-900)}.difficulty-badge{padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:var(--font-size-xs);border:1px solid}.theme-description{font-size:var(--font-size-sm);color:var(--gray-600);margin-bottom:var(--space-3)}.theme-keywords{display:flex;flex-wrap:wrap;gap:var(--space-2)}.keyword-chip{padding:var(--space-1) var(--space-2);background:var(--gray-100);color:var(--gray-800);border-radius:var(--radius-sm);font-size:var(--font-size-xs)}.more-keywords{background:var(--blue-100);color:var(--blue-800)}.theme-hover-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.1);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease}.theme-card-enhanced:hover .theme-hover-overlay{opacity:1}.hover-text{color:#fff;font-size:var(--font-size-sm);font-weight:600}.no-results{text-align:center;padding:var(--space-8)}.no-results-icon{font-size:2rem;margin-bottom:var(--space-2)}.no-results h4{font-size:var(--font-size-lg);color:var(--gray-900)}.no-results p{font-size:var(--font-size-base);color:var(--gray-600)}.selection-guidance{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--yellow-50);border-radius:var(--radius-md);margin-top:var(--space-4)}.guidance-icon{font-size:1.5rem}.selection-guidance h4{font-size:var(--font-size-base);color:var(--gray-900)}.selection-guidance p{font-size:var(--font-size-sm);color:var(--gray-700)}.character-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.character-modal{background:white;border-radius:16px;max-width:600px;width:100%;max-height:90vh;overflow:hidden;box-shadow:0 25px 50px -12px #00000040;display:flex;flex-direction:column}.character-modal-header{display:flex;align-items:center;justify-content:space-between;padding:24px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,var(--blue-50) 0%,var(--purple-50) 100%)}.character-modal-title-section{display:flex;align-items:center;gap:16px}.character-avatar-large{width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--blue-500) 0%,var(--purple-500) 100%);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 8px #0000001a}.character-avatar-icon-large{font-size:28px}.character-title-info{display:flex;flex-direction:column;gap:4px}.character-modal-title{font-size:24px;font-weight:700;color:var(--gray-900);margin:0}.character-modal-role{font-size:16px;color:var(--gray-600);margin:0}.character-difficulty-badge{display:inline-block;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.5px;margin-top:4px}.character-modal-close-btn{background:none;border:none;color:var(--gray-500);cursor:pointer;padding:8px;border-radius:8px;transition:all .2s}.character-modal-close-btn:hover{color:var(--gray-700);background:rgba(0,0,0,.1)}.character-modal-content{flex:1;overflow-y:auto;padding:24px}.character-modal-section{margin-bottom:24px}.character-modal-section:last-child{margin-bottom:0}.character-section-header{display:flex;align-items:center;gap:8px;margin-bottom:16px}.character-section-header h3{font-size:18px;font-weight:600;color:var(--gray-900);margin:0}.character-section-header svg{color:var(--blue-500)}.character-info-grid{display:flex;flex-direction:column;gap:12px}.character-info-item{display:flex;flex-direction:column;gap:4px}.character-info-label{font-size:14px;font-weight:600;color:var(--gray-600);text-transform:uppercase;letter-spacing:.5px}.character-info-value{font-size:16px;color:var(--gray-900);line-height:1.5}.expertise-tags{display:flex;flex-wrap:wrap;gap:8px}.expertise-tag{padding:6px 12px;background:var(--blue-50);color:var(--blue-700);border-radius:20px;font-size:14px;font-weight:500;border:1px solid var(--blue-200)}.sample-questions{display:flex;flex-direction:column;gap:12px}.sample-question{display:flex;align-items:flex-start;gap:8px;padding:12px;background:var(--gray-50);border-radius:8px;border-left:4px solid var(--blue-500)}.question-icon{color:var(--blue-500);margin-top:2px;flex-shrink:0}.sample-question span{font-size:14px;color:var(--gray-700);line-height:1.5}.interaction-tips{display:flex;flex-direction:column;gap:12px}.tip-item{padding:12px;background:var(--green-50);border-radius:8px;border-left:4px solid var(--green-500);font-size:14px;line-height:1.5;color:var(--gray-700)}.tip-item strong{color:var(--gray-900)}.character-modal-footer{display:flex;align-items:center;justify-content:space-between;padding:24px;border-top:1px solid #e5e7eb;background:var(--gray-50)}.btn-selected{background:var(--green-500);color:#fff}.btn-selected:hover{background:var(--green-600)}.enhanced-character-selector{width:100%}.character-selector-header{margin-bottom:24px}.header-title{display:flex;align-items:center;gap:12px;margin-bottom:8px}.header-title h3{font-size:24px;font-weight:700;color:var(--gray-900);margin:0}.header-title svg{color:var(--blue-500)}.selection-count{padding:4px 12px;background:var(--blue-100);color:var(--blue-700);border-radius:20px;font-size:14px;font-weight:600}.header-subtitle{color:var(--gray-600);font-size:16px;line-height:1.5;margin:0}.character-controls{margin-bottom:24px}.character-controls-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:16px;align-items:center}.search-container{position:relative}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--gray-400);pointer-events:none}.search-input{width:100%;padding:12px 12px 12px 44px;border:2px solid var(--gray-200);border-radius:8px;font-size:16px;transition:all .2s}.search-input:focus{outline:none;border-color:var(--blue-500);box-shadow:0 0 0 3px #3b82f61a}.filter-container{position:relative;display:flex;align-items:center;gap:8px}.filter-container svg:first-child{color:var(--gray-500);flex-shrink:0}.filter-select,.sort-select{flex:1;padding:12px 32px 12px 12px;border:2px solid var(--gray-200);border-radius:8px;font-size:14px;background:white;cursor:pointer;transition:all .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none}.filter-select:focus,.sort-select:focus{outline:none;border-color:var(--blue-500);box-shadow:0 0 0 3px #3b82f61a}.select-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--gray-400);pointer-events:none}.characters-grid-enhanced{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-bottom:24px}.character-card-enhanced{position:relative;background:white;border:2px solid var(--gray-200);border-radius:12px;padding:20px;transition:all .3s ease;cursor:pointer;overflow:hidden}.character-card-enhanced:hover{border-color:var(--blue-300);box-shadow:0 8px 25px #0000001a;transform:translateY(-2px)}.character-card-enhanced.selected{border-color:var(--green-500);background:var(--green-50);box-shadow:0 4px 20px #22c55e33}.character-card-enhanced.disabled{opacity:.5;cursor:not-allowed}.character-card-enhanced.disabled:hover{transform:none;box-shadow:none}.character-card-avatar{display:flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--blue-500) 0%,var(--purple-500) 100%);margin:0 auto 16px;position:relative;box-shadow:0 4px 12px #0000001a}.character-avatar-icon{font-size:28px}.difficulty-indicator{position:absolute;top:-4px;right:-4px;width:20px;height:20px;border-radius:50%;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid white}.character-card-content{text-align:center;margin-bottom:16px}.character-name{font-size:18px;font-weight:700;color:var(--gray-900);margin:0 0 4px}.character-role{font-size:14px;font-weight:600;color:var(--blue-600);margin:0 0 8px}.character-personality{font-size:14px;color:var(--gray-600);margin:0 0 12px}.character-specialty{display:flex;flex-direction:column;gap:2px;font-size:12px}.specialty-label{color:var(--gray-500);font-weight:600}.specialty-value{color:var(--gray-700)}.selection-indicator{position:absolute;top:12px;right:12px}.selection-checkmark{width:24px;height:24px;border-radius:50%;background:var(--green-500);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}.character-card-actions{display:flex;gap:8px}.btn-preview,.btn-select{flex:1;padding:8px 16px;border-radius:6px;font-size:14px;font-weight:600;border:none;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:4px}.btn-preview{background:var(--gray-100);color:var(--gray-700);border:1px solid var(--gray-300)}.btn-preview:hover{background:var(--gray-200)}.btn-select{background:var(--blue-500);color:#fff}.btn-select:hover{background:var(--blue-600)}.btn-select.selected{background:var(--green-500)}.btn-select.selected:hover{background:var(--green-600)}.btn-select:disabled{background:var(--gray-300);color:var(--gray-500);cursor:not-allowed}.character-hover-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(59,130,246,.95);color:#fff;padding:20px;opacity:0;transition:opacity .3s ease;display:flex;flex-direction:column;justify-content:center;border-radius:12px}.character-card-enhanced:hover .character-hover-overlay{opacity:1}.hover-content{text-align:center}.hover-background{font-size:14px;line-height:1.4;margin:0 0 16px}.hover-actions{display:flex;justify-content:center}.hover-btn-preview{padding:8px 16px;background:rgba(255,255,255,.2);color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:4px;transition:all .2s}.hover-btn-preview:hover{background:rgba(255,255,255,.3)}.selection-summary{background:var(--blue-50);border:1px solid var(--blue-200);border-radius:12px;padding:20px;margin-bottom:24px}.selection-summary h4{font-size:16px;font-weight:600;color:var(--gray-900);margin:0 0 12px}.selected-character-chips{display:flex;flex-wrap:wrap;gap:8px}.selected-character-chip{display:flex;align-items:center;gap:8px;background:white;border:1px solid var(--blue-300);border-radius:20px;padding:6px 12px;font-size:14px;color:var(--gray-700)}.chip-icon{font-size:16px}.chip-name{font-weight:500}.chip-remove{background:none;border:none;color:var(--gray-500);cursor:pointer;font-size:18px;font-weight:700;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s}.chip-remove:hover{background:var(--red-100);color:var(--red-600)}.character-empty-state{text-align:center;padding:60px 20px;color:var(--gray-500)}.character-empty-state svg{margin-bottom:16px;opacity:.5}.character-empty-state h3{font-size:18px;font-weight:600;margin:0 0 8px}.character-empty-state p{font-size:14px;margin:0}.character-selector-step{margin:20px 0}.step-navigation{display:flex;justify-content:space-between;align-items:center;margin-top:32px;padding-top:24px;border-top:1px solid var(--gray-200)}.step-navigation .btn{min-width:120px}.character-selector-step .character-card-enhanced{transition:all .3s ease}.character-selector-step .character-card-enhanced:hover{transform:translateY(-4px);box-shadow:0 12px 30px #0000001f}@media (max-width: 768px){.character-modal-overlay{padding:12px}.character-modal{max-height:95vh}.character-modal-header{padding:20px}.character-modal-title-section{gap:12px}.character-avatar-large{width:56px;height:56px}.character-avatar-icon-large{font-size:24px}.character-modal-title{font-size:20px}.character-modal-content{padding:20px}.character-modal-footer{padding:20px;flex-direction:column;gap:12px}.character-modal-footer .btn{width:100%;justify-content:center}.character-controls-row{grid-template-columns:1fr;gap:12px}.characters-grid-enhanced{grid-template-columns:1fr;gap:16px}.character-card-actions{flex-direction:column}.selection-summary{padding:16px}.selected-character-chips{gap:6px}.step-navigation{flex-direction:column;gap:12px}.step-navigation .btn{width:100%;min-width:unset}.expertise-tags{gap:6px}.expertise-tag{font-size:12px;padding:4px 8px}}.search-input,.filter-select,.sort-select{pointer-events:auto!important;z-index:10!important;position:relative}.character-card-actions{pointer-events:auto!important;z-index:20!important;position:relative}.character-card-actions button{pointer-events:auto!important;z-index:21!important;position:relative}.character-hover-overlay{pointer-events:none!important;z-index:5!important}.hover-btn-preview{pointer-events:auto!important;z-index:6!important}.character-modal-overlay{z-index:1000!important;pointer-events:auto!important}.character-modal{z-index:1001!important;pointer-events:auto!important}.character-modal-close-btn{pointer-events:auto!important;z-index:1002!important;background:white!important;border:1px solid #e5e7eb!important;box-shadow:0 2px 4px #0000001a!important}.chip-remove{pointer-events:auto!important;z-index:15!important}.character-card-enhanced{position:relative;z-index:1}.character-card-actions button:hover{outline:2px solid red!important}*:focus{outline:2px solid var(--blue-500);outline-offset:2px;transition:outline-offset .2s ease}.btn{position:relative;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.btn: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 .5s ease}.btn:hover:before{left:100%}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #00000026}.btn:active{transform:translateY(0);transition:transform .1s ease}.card{transition:all .3s cubic-bezier(.4,0,.2,1);transform-origin:center}.card:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 12px 40px #0000001f}.card-entrance{animation:cardSlideIn .6s cubic-bezier(.4,0,.2,1) forwards;opacity:0;transform:translateY(30px)}@keyframes cardSlideIn{to{opacity:1;transform:translateY(0)}}.card-entrance:nth-child(1){animation-delay:.1s}.card-entrance:nth-child(2){animation-delay:.2s}.card-entrance:nth-child(3){animation-delay:.3s}.card-entrance:nth-child(4){animation-delay:.4s}.card-entrance:nth-child(5){animation-delay:.5s}.card-entrance:nth-child(6){animation-delay:.6s}.page-transition-enter{opacity:0;transform:translate(30px)}.page-transition-enter-active{opacity:1;transform:translate(0);transition:opacity .4s ease,transform .4s ease}.page-transition-exit{opacity:1;transform:translate(0)}.page-transition-exit-active{opacity:0;transform:translate(-30px);transition:opacity .3s ease,transform .3s ease}.loading-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.loading-skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.form-group{position:relative}.form-input{transition:all .3s ease;border:2px solid transparent}.form-input:focus{border-color:var(--blue-500);box-shadow:0 0 0 3px #3b82f61a;transform:scale(1.02)}.form-input:invalid{border-color:var(--red-500);animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.progress-bar{position:relative;overflow:hidden;background-color:#e5e7eb;border-radius:9999px;height:8px}.progress-fill{height:100%;background:linear-gradient(90deg,var(--blue-500),var(--green-500));border-radius:9999px;transition:width .8s cubic-bezier(.4,0,.2,1);position:relative}.progress-fill:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:progressShimmer 2s infinite}@keyframes progressShimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.theme-card{transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}.theme-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;padding:2px;background:linear-gradient(45deg,var(--blue-500),var(--green-500));mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:0;transition:opacity .3s ease}.theme-card.selected:after{opacity:1}.theme-card.selected{transform:scale(1.05);box-shadow:0 8px 30px #3b82f64d}.character-avatar{transition:all .3s ease;position:relative;overflow:hidden}.character-avatar:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(45deg,transparent 30%,rgba(255,255,255,.1) 50%,transparent 70%);transform:translate(-100%);transition:transform .6s ease}.character-avatar:hover:before{transform:translate(100%)}.character-avatar:hover{transform:scale(1.1) rotate(2deg)}.modal-backdrop{animation:fadeIn .3s ease}.modal-content{animation:modalSlideIn .4s cubic-bezier(.4,0,.2,1)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.notification{animation:notificationSlideIn .5s cubic-bezier(.4,0,.2,1)}.notification.exit{animation:notificationSlideOut .3s ease forwards}@keyframes notificationSlideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes notificationSlideOut{to{transform:translate(100%);opacity:0}}.hover-lift{transition:transform .3s ease,box-shadow .3s ease}.hover-lift:hover{transform:translateY(-6px);box-shadow:0 16px 50px #00000026}.hover-glow{transition:box-shadow .3s ease}.hover-glow:hover{box-shadow:0 0 30px #3b82f666}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.will-change-transform{will-change:transform}.will-change-opacity{will-change:opacity}.gpu-accelerate{transform:translateZ(0);backface-visibility:hidden;perspective:1000px}.session-style-section,.difficulty-section{margin:2rem 0}.session-styles,.difficulty-levels{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;margin:1rem 0}.session-style-card,.difficulty-card{padding:1.5rem;background:white;border:2px solid #e5e7eb;border-radius:.75rem;cursor:pointer;transition:all .3s ease;text-align:center;position:relative}.session-style-card:hover,.difficulty-card:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.session-style-card.selected,.difficulty-card.selected{border-color:#3b82f6;background-color:#eff6ff;box-shadow:0 8px 25px #3b82f633}.style-icon,.difficulty-icon{font-size:2rem;margin-bottom:.75rem}.session-style-card h4,.difficulty-card h4{font-size:1.25rem;font-weight:600;margin:0 0 .5rem;color:#1f2937}.session-style-card p,.difficulty-card p{color:#6b7280;font-size:.9rem;margin:0 0 .75rem;line-height:1.4}.difficulty-characteristics{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:.75rem}.characteristic-tag{background:#f3f4f6;color:#4b5563;padding:.25rem .5rem;border-radius:.375rem;font-size:.75rem;font-weight:500}.session-style-card.selected .characteristic-tag,.difficulty-card.selected .characteristic-tag{background:#dbeafe;color:#1e40af}.step-content{padding:2rem}.step-header{text-align:center;margin-bottom:2rem}.step-header h2{font-size:2rem;font-weight:700;color:#1f2937;margin-bottom:.5rem}.step-header p{color:#6b7280;font-size:1.125rem}.step-navigation{display:flex;justify-content:space-between;align-items:center;margin-top:2rem;padding-top:1.5rem;border-top:1px solid #e5e7eb}@media (max-width: 768px){.session-styles,.difficulty-levels{grid-template-columns:1fr;gap:1rem}.session-style-card,.difficulty-card{padding:1.25rem}.step-navigation{flex-direction:column;gap:1rem}.step-navigation .btn{width:100%}}