:root{--primary-color: #8e44ad;--primary-light: #9b59b6;--primary-dark: #7d3c98;--secondary-color: #2c3e50;--secondary-light: #34495e;--secondary-dark: #1a252f;--accent-color: #e74c3c;--light-color: #ecf0f1;--dark-color: #2c3e50;--success-color: #2ecc71;--success-dark: #27ae60;--success-light: #2ecc71;--warning-color: #f39c12;--warning-dark: #e67e22;--warning-light: #f5b041;--error-color: #e74c3c;--bg-card: #2c3e50;--bg-card-dark: #1a252f;--bg-form: #34495e;--bg-input: #ecf0f1;--bg-info: #34495e;--bg-selected: #7d3c98;--bg-table-header: #2c3e50;--bg-table-row-even: #2a3c4d;--bg-table-row-odd: #233240;--bg-table-row-hover: #3c5a7a;--bg-overlay: rgba(0, 0, 0, .3);--bg-primary-alpha: rgba(142, 68, 173, .15);--gradient-primary: #8e44ad;--gradient-primary-hover: #9b59b6;--gradient-success: #2ecc71;--gradient-success-hover: #27ae60;--gradient-warning: #f39c12;--gradient-warning-hover: #e67e22;--gradient-card: #34495e;--gradient-card-hover: #3d5a74;--gradient-card-selected: #7d3c98;--box-shadow: 0 2px 5px rgba(0, 0, 0, .1);--box-shadow-hover: 0 4px 8px rgba(0, 0, 0, .2);--box-shadow-strong: 0 8px 32px rgba(0, 0, 0, .1);--box-shadow-inset: inset 0 2px 4px rgba(0, 0, 0, .1);--box-shadow-button: 0 4px 10px rgba(0, 0, 0, .2);--box-shadow-button-hover: 0 6px 15px rgba(0, 0, 0, .25);--box-shadow-card: 0 4px 10px rgba(0, 0, 0, .15);--box-shadow-selected: 0 6px 15px rgba(0, 0, 0, .25), 0 0 15px rgba(142, 68, 173, .3);--transition: all .3s ease;--border-radius: 8px;--card-border-radius: 12px;--button-border-radius: 50px;--border-light: 1px solid rgba(255, 255, 255, .1);--border-medium: 1px solid rgba(255, 255, 255, .2);--border-highlight: 1px solid rgba(142, 68, 173, .5);--border-input: 1px solid rgba(221, 221, 221, .5);--text-shadow-light: 1px 1px 2px rgba(0, 0, 0, .3);--text-shadow-medium: 1px 1px 3px rgba(0, 0, 0, .5);--text-shadow-strong: 2px 2px 4px rgba(0, 0, 0, .6);--text-shadow-heavy: 2px 2px 4px rgba(0, 0, 0, .8);--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--font-sm: .85rem;--font-md: 1rem;--font-lg: 1.2rem;--font-xl: 1.5rem;--font-xxl: 2rem;--text-primary: #ffffff;--text-secondary: #e8e8e8;--text-tertiary: #cccccc;--disabled-color: #bdc3c7;--bg-secondary: #3a4a5c;--bg-tertiary: #4a5a6c;--border-color: rgba(255, 255, 255, .15);--accent-primary: #6366f1;--accent-hover: #5048e5;--success-color: #22c55e;--warning-color: #fbbf24;--blur-light: blur(10px);--blur-medium: blur(20px);--container-width: 1200px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;touch-action:manipulation}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;color:var(--dark-color);background-color:#f8f9fa;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent}img{max-width:100%;height:auto}button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}ul,ol{list-style:none}a{color:var(--primary-color);text-decoration:none;transition:var(--transition)}a:hover{color:var(--primary-light)}.App{display:flex;flex-direction:column;min-height:100vh;background:linear-gradient(#000000b3,#000000b3),url(https://images.unsplash.com/photo-1513694203232-719a280e022f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2069&q=80);background-size:cover;background-position:center;background-attachment:scroll}.container{max-width:var(--container-width);margin:0 auto;padding:var(--space-lg) var(--space-md);flex:1;width:100%;box-sizing:border-box}.App-header{background-color:#2c3e50;color:#fff;padding:var(--space-md) var(--space-lg);border-bottom:1px solid rgba(255,255,255,.1);position:relative;z-index:100}.App-footer{background-color:#2c3e50;color:#fff;text-align:center;padding:var(--space-md);margin-top:auto;border-top:1px solid rgba(255,255,255,.1)}.loading,.error{text-align:center;padding:var(--space-xl);background-color:#fff;border-radius:var(--border-radius);box-shadow:var(--box-shadow-strong);border:var(--border-medium)}.error{color:var(--error-color)}.btn{background-color:var(--primary-color);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:4px;cursor:pointer;font-size:var(--font-md);transition:var(--transition);box-shadow:var(--box-shadow);-webkit-appearance:none;-moz-appearance:none;appearance:none}.btn:hover{background-color:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--box-shadow-hover)}.btn:disabled{background-color:#bdc3c7;cursor:not-allowed}.btn-primary{background:var(--gradient-primary);border-radius:var(--button-border-radius);padding:.6rem 1.8rem;text-transform:uppercase;letter-spacing:.5px;font-weight:600;box-shadow:var(--box-shadow-button);text-shadow:var(--text-shadow-light);border:var(--border-light)}.btn-primary:hover{background:var(--gradient-primary-hover);transform:translateY(-2px);box-shadow:var(--box-shadow-button-hover)}.btn-secondary{background:var(--gradient-warning);border-radius:var(--button-border-radius);padding:.6rem 1.5rem;font-weight:600;box-shadow:var(--box-shadow-button);text-shadow:var(--text-shadow-light);border:var(--border-light)}.btn-secondary:hover{background:var(--gradient-warning-hover);transform:translateY(-2px);box-shadow:var(--box-shadow-button-hover)}.btn-success{background:var(--gradient-success);border-radius:var(--button-border-radius);padding:.6rem 1.8rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase;box-shadow:var(--box-shadow-button);text-shadow:var(--text-shadow-light);border:var(--border-light)}.btn-success:hover{background:var(--gradient-success-hover);transform:translateY(-2px);box-shadow:var(--box-shadow-button-hover)}.add-form{background-color:var(--bg-form);padding:var(--space-lg);border-radius:var(--border-radius);box-shadow:var(--box-shadow-strong);margin-bottom:var(--space-lg);display:flex;flex-wrap:wrap;gap:var(--space-md);align-items:center;border:var(--border-medium);width:100%;box-sizing:border-box}.form-group{flex:1;min-width:200px}.input-field{width:100%;padding:.75rem;border:var(--border-input);border-radius:4px;font-size:var(--font-md);background-color:var(--bg-input);-webkit-appearance:none;-moz-appearance:none;appearance:none}.input-field:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #8e44ad33,var(--box-shadow-inset)}.dashboard,.song-list,.artist-list,.album-list,.query-runner,.bell-experiment{background-color:var(--bg-card);border-radius:var(--card-border-radius);padding:var(--space-lg);box-shadow:var(--box-shadow-strong);border:var(--border-medium);width:100%;box-sizing:border-box}.card{background-color:var(--bg-form);border-radius:var(--border-radius);padding:var(--space-lg);box-shadow:var(--box-shadow-card);border:var(--border-medium);margin-bottom:var(--space-lg);width:100%;box-sizing:border-box;max-width:100%}.card-header{margin-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:.5rem}.card h3{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:0;font-size:var(--font-lg)}.info-card{background-color:var(--bg-info);border-left:4px solid var(--primary-color);padding:var(--space-md);margin-bottom:var(--space-md);border-radius:0 var(--border-radius) var(--border-radius) 0;box-shadow:var(--box-shadow);color:#fff;width:100%;box-sizing:border-box;max-width:100%}.info-card h4{margin:0 0 .5rem;color:#fff;text-shadow:var(--text-shadow-light);font-size:var(--font-md)}.info-card p{margin:0;color:#ffffffe6;text-shadow:var(--text-shadow-light);font-size:var(--font-sm)}.selectable-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--space-md);width:100%}.selectable-card{background:var(--gradient-card);border:var(--border-medium);border-radius:10px;padding:.7rem 1.2rem;cursor:pointer;transition:var(--transition);box-shadow:var(--box-shadow-card);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.selectable-card:hover{transform:translateY(-3px) scale(1.03);box-shadow:var(--box-shadow-button-hover);border-color:var(--border-highlight);background:var(--gradient-card-hover)}.selectable-card.selected{border-color:var(--primary-color);background:var(--gradient-card-selected);box-shadow:var(--box-shadow-selected)}.selectable-card-name{font-weight:700;font-size:var(--font-sm);color:#fff;text-shadow:var(--text-shadow-light)}h2{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-lg);border-bottom:2px solid rgba(142,68,173,.5);padding-bottom:var(--space-sm);font-size:var(--font-xl)}h3{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-md);font-size:var(--font-lg)}@media(max-width:768px){.container,.App-header,.dashboard,.song-list,.artist-list,.album-list,.query-runner,.bell-experiment,.card{padding:var(--space-md)}h2{font-size:var(--font-lg)}.btn{width:100%}.form-group{min-width:100%}.form-actions{flex-direction:column}.selectable-card{min-width:110px;height:45px;padding:.6rem 1rem}.selectable-cards-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--space-sm)}}@media(max-width:480px){.container,.dashboard,.song-list,.artist-list,.album-list,.query-runner,.bell-experiment,.card{padding:var(--space-md) var(--space-sm)}h2{font-size:calc(var(--font-lg) - .1rem)}.selectable-card{min-width:90px;height:40px;padding:.5rem .8rem}.selectable-card-name{font-size:.8rem}.info-card{padding:.8rem}.selectable-cards-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.4rem}}.header-content{display:flex;justify-content:space-between;align-items:center}.App-header h1{font-weight:300;margin-bottom:0;text-shadow:1px 1px 3px rgba(0,0,0,.5);font-size:1.5rem}.mobile-nav-toggle{display:none;background:transparent;border:none;width:36px;height:30px;position:relative;cursor:pointer;z-index:10}.burger-icon,.burger-icon:before,.burger-icon:after{display:block;position:absolute;height:3px;width:30px;border-radius:2px;background-color:#fff;transition:var(--transition)}.burger-icon{top:13px}.burger-icon:before{content:"";top:-8px}.burger-icon:after{content:"";top:8px}.nav-links{display:flex;list-style:none;flex-wrap:wrap;margin-top:1rem}.nav-links li{margin-right:1.5rem;margin-bottom:.5rem}.nav-links a{color:var(--light-color);text-decoration:none;transition:var(--transition);font-size:1rem;text-shadow:1px 1px 2px rgba(0,0,0,.5);display:block;padding:.5rem;border-radius:4px}.nav-links a:hover{color:var(--primary-color);background-color:#ffffff1a}@media(max-width:768px){.mobile-nav-toggle{display:block}nav{max-height:0;overflow:hidden;transition:max-height .3s ease}nav.nav-open{max-height:500px;margin-top:1rem}.nav-links{flex-direction:column;width:100%;margin-top:0}.nav-links li{width:100%;margin-right:0;text-align:center}.nav-links a{padding:.8rem;display:block;width:100%;border-bottom:1px solid rgba(255,255,255,.1)}.nav-links a:hover{background-color:#fff3}.nav-links li:last-child a{border-bottom:none}}@media(max-width:480px){.App-header h1{font-size:1.3rem}.nav-links a{padding:.7rem;font-size:.95rem}}.form-container{background-color:var(--bg-form);border-radius:var(--border-radius);padding:var(--space-lg);box-shadow:0 4px 15px #00000026;-webkit-backdrop-filter:var(--blur-light);backdrop-filter:var(--blur-light);border:var(--border-medium);margin-bottom:var(--space-lg)}.form-textarea{width:100%;padding:1rem;font-family:Courier New,Courier,monospace;font-size:.9rem;border:var(--border-input);border-radius:8px;resize:vertical;min-height:120px;line-height:1.5;background-color:var(--bg-input);box-shadow:var(--box-shadow-inset);-webkit-appearance:none;-moz-appearance:none;appearance:none}.form-textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #8e44ad33,var(--box-shadow-inset)}.form-actions{display:flex;gap:10px;margin-top:var(--space-md);justify-content:flex-end}.form-input,input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url]{width:100%;height:40px;border:var(--border-input);border-radius:4px;font-size:var(--font-md);background-color:var(--bg-input);-webkit-appearance:none;-moz-appearance:none;appearance:none;box-sizing:border-box;display:flex;align-items:center;padding:0 .75rem}.form-select,select{width:100%;height:40px;border:var(--border-input);border-radius:4px;font-size:var(--font-md);background-color:var(--bg-input);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="6" viewBox="0 0 12 6"><path fill="%238e44ad" d="M0 0l6 6 6-6z"/></svg>');background-repeat:no-repeat;background-position:right .75rem center;background-size:12px 6px;padding:0 2.5rem 0 .75rem;box-sizing:border-box;display:flex;align-items:center}.form-input:focus,input[type=text]:focus,input[type=number]:focus,input[type=email]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=url]:focus,.form-select:focus,select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #8e44ad33,var(--box-shadow-inset)}.form-group{margin-bottom:var(--space-md)}.form-group label{display:block;margin-bottom:var(--space-xs);color:#fff;text-shadow:var(--text-shadow-light);font-weight:500}.add-form{display:flex;flex-wrap:wrap;gap:var(--space-md);align-items:center}.add-form button,.add-form .btn,.add-form .btn-primary{height:40px;display:flex;align-items:center;justify-content:center;padding:0 1.8rem;margin:0;box-sizing:border-box;min-height:40px;max-height:40px;white-space:nowrap}.add-form .form-group{margin-bottom:0;margin-top:0;display:flex;align-items:center}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}@-moz-document url-prefix(){.form-input,input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],.form-select,select{padding-top:0;padding-bottom:0;line-height:40px}.add-form button,.add-form .btn,.add-form .btn-primary{line-height:40px}}@media not all and (min-resolution:.001dpcm){.form-input,input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],.form-select,select,.add-form button,.add-form .btn,.add-form .btn-primary{line-height:40px}}@media(max-width:768px){.form-container{padding:var(--space-md)}.form-textarea{min-height:100px;padding:.8rem}.form-actions{flex-direction:column}.form-actions .btn{width:100%}.form-input,.form-select,input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],select{height:38px}.add-form button,.add-form .btn,.add-form .btn-primary{height:38px;min-height:38px;max-height:38px}@-moz-document url-prefix(){.form-input,input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],.form-select,select,.add-form button,.add-form .btn,.add-form .btn-primary{line-height:38px}}}@media(max-width:480px){.form-container{padding:var(--space-md) var(--space-sm)}.form-textarea{min-height:80px;padding:.7rem;font-size:.85rem}.form-input,.form-select,input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],select{height:36px;font-size:var(--font-sm)}.add-form button,.add-form .btn,.add-form .btn-primary{height:36px;min-height:36px;max-height:36px}@-moz-document url-prefix(){.form-input,input[type=text],input[type=number],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],.form-select,select,.add-form button,.add-form .btn,.add-form .btn-primary{line-height:36px}}}.table-container{overflow-x:auto;background-color:var(--bg-card-dark);border-radius:var(--border-radius);box-shadow:0 4px 15px #0003;margin-top:var(--space-lg);-webkit-backdrop-filter:var(--blur-light);backdrop-filter:var(--blur-light);border:var(--border-light);-webkit-overflow-scrolling:touch;width:100%}table{width:100%;border-collapse:collapse;table-layout:fixed}thead{position:sticky;top:0;z-index:10}th,td{padding:.75rem 1rem;text-align:left;font-size:.95rem;word-wrap:break-word;overflow:hidden;text-overflow:ellipsis;color:#ffffffe6}th{background-color:var(--bg-table-header);color:#fff;font-weight:500;position:sticky;top:0;z-index:10;text-shadow:var(--text-shadow-light);letter-spacing:.5px;border-bottom:2px solid rgba(142,68,173,.5)}tr:nth-child(2n){background-color:var(--bg-table-row-even)}tr:nth-child(odd){background-color:var(--bg-table-row-odd)}tr:hover{background-color:var(--bg-table-row-hover)}@media(min-width:769px){.table-container{max-width:100%;margin-left:auto;margin-right:auto}th,td{white-space:nowrap}}@media(max-width:768px){th,td{padding:.75rem .8rem;font-size:.9rem}}@media(max-width:480px){th,td{padding:.6rem;font-size:.85rem}}.card{background-color:var(--bg-card);border-radius:var(--card-border-radius);padding:var(--space-lg);box-shadow:var(--box-shadow-strong);border:var(--border-medium);margin-bottom:var(--space-md);max-width:100%;width:100%;box-sizing:border-box}.card-dark{background-color:var(--bg-card-dark)}.card-highlight{border-left:4px solid var(--primary-color);border-radius:0 var(--border-radius) var(--border-radius) 0}.card-header{margin-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:var(--space-sm)}.card-header h3{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:0;font-size:var(--font-lg)}.card-content{margin-bottom:var(--space-sm)}.stat-card{background-color:#34495e;border-radius:10px;padding:1.2rem;box-shadow:0 4px 20px #0003;text-align:center;border:var(--border-light);display:flex;flex-direction:column;justify-content:center;transition:transform .3s ease,box-shadow .3s ease}.stat-card:hover{transform:translateY(-5px);box-shadow:0 6px 25px #00000040;border-color:#8e44ad66}.stat-card h3{color:#fff;font-size:1.1rem;margin-bottom:.5rem;text-shadow:var(--text-shadow-medium);font-weight:500}.stat-number{font-size:2.2rem;font-weight:700;color:#fff;text-shadow:var(--text-shadow-strong);margin:0;line-height:1.2}@media(max-width:768px){.card{padding:var(--space-md)}.stat-card{padding:1rem}.stat-number{font-size:1.8rem}}@media(max-width:480px){.card{padding:var(--space-md) var(--space-sm)}.stat-card{padding:.8rem}.stat-number{font-size:1.6rem}}.query-runner{display:flex;flex-direction:column;width:100%}.query-form{width:100%}.sql-templates{background-color:var(--bg-card);max-width:100%;width:100%;box-sizing:border-box;margin-left:0!important;margin-right:0!important;padding-left:var(--space-lg);padding-right:var(--space-lg)}@media(max-width:768px){.sql-templates{padding-left:var(--space-md);padding-right:var(--space-md)}}@media(max-width:480px){.sql-templates{padding-left:var(--space-md);padding-right:var(--space-md)}}.query-runner>.card.sql-templates{margin-left:0;margin-right:0;width:100%}.query-textarea{width:100%;padding:1rem;font-family:Courier New,Courier,monospace;font-size:.9rem;border:var(--border-input);border-radius:8px;resize:vertical;min-height:150px;line-height:1.5;background-color:var(--bg-input);box-shadow:var(--box-shadow-inset);-webkit-appearance:none;-moz-appearance:none;appearance:none}.query-textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #8e44ad33,var(--box-shadow-inset)}.query-actions{display:flex;gap:10px;margin-top:var(--space-md);justify-content:flex-end;width:100%}.clear-btn{flex:1;max-width:120px}.execute-btn{flex:2}.query-file-selector{width:100%}.query-file-selector .selectable-card{background-color:#34495e;min-height:50px}.query-file-selector .selectable-card:hover{background-color:#3d5a74}.query-file-selector .selectable-card.selected{background-color:var(--bg-selected)}.query-results{width:100%}.query-results h3{border-bottom:2px solid var(--primary-color);padding-bottom:.5rem;margin-top:2rem;margin-bottom:1rem;color:#fff;text-shadow:var(--text-shadow-medium);font-size:var(--font-lg)}@media(max-width:768px){.query-textarea{min-height:120px}.query-actions{width:100%}.query-file-selector .selectable-card{min-height:50px;background-color:#34495e}}@media(max-width:480px){.query-textarea{min-height:100px;padding:.8rem}.clear-btn,.execute-btn{max-width:none;margin-bottom:var(--space-xs)}}.dashboard-content{display:grid;grid-template-columns:2fr 1fr;gap:var(--space-lg);margin-bottom:var(--space-xl)}.stats-container{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md);margin-bottom:var(--space-lg)}.latest-content{background-color:var(--bg-form);border-radius:var(--border-radius);padding:var(--space-lg);box-shadow:0 4px 15px #00000026;-webkit-backdrop-filter:var(--blur-light);backdrop-filter:var(--blur-light);border:var(--border-medium)}.latest-content h3{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-md);font-size:var(--font-lg);border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.5rem}.left-content{display:flex;flex-direction:column}@media(max-width:768px){.dashboard-content{grid-template-columns:1fr}.latest-content{padding:var(--space-md)}}@media(max-width:480px){.stats-container{grid-template-columns:1fr}.latest-content{padding:var(--space-md) var(--space-sm)}}.vinyl-section{display:flex;flex-direction:column;align-items:center;padding:var(--space-lg);border-radius:var(--card-border-radius);background-color:#0000004d;max-width:240px;margin:0 auto 1.5rem;box-shadow:0 8px 32px #0006;border:var(--border-light)}.vinyl-container{width:170px;height:170px;position:relative;margin-bottom:var(--space-md);display:flex;justify-content:center;align-items:center}.vinyl-record{width:160px;height:160px;background-color:#000;border-radius:50%;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;box-shadow:0 4px 20px #0009,0 0 10px #ffffff1a;z-index:1;background:linear-gradient(135deg,#222,#000,#111)}.vinyl-record:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;background:repeating-radial-gradient(circle at center,transparent 0,transparent 3px,rgba(255,255,255,.15) 3px,rgba(255,255,255,.15) 4px)}.vinyl-record:after{content:"";position:absolute;width:100%;height:100%;background:conic-gradient(transparent 0deg,transparent 30deg,rgba(255,255,255,.2) 30deg,rgba(255,255,255,.2) 32deg,transparent 32deg,transparent 90deg,rgba(255,255,255,.2) 90deg,rgba(255,255,255,.2) 92deg,transparent 92deg,transparent 150deg,rgba(255,255,255,.2) 150deg,rgba(255,255,255,.2) 152deg,transparent 152deg,transparent 210deg,rgba(255,255,255,.2) 210deg,rgba(255,255,255,.2) 212deg,transparent 212deg,transparent 270deg,rgba(255,255,255,.2) 270deg,rgba(255,255,255,.2) 272deg,transparent 272deg,transparent 330deg,rgba(255,255,255,.2) 330deg,rgba(255,255,255,.2) 332deg,transparent 332deg,transparent 360deg);border-radius:50%}.vinyl-label{width:60px;height:60px;background-color:var(--primary-color);border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:2;background:radial-gradient(circle at center,var(--primary-light),var(--primary-color));box-shadow:0 0 10px #00000080,inset 0 0 5px #0000004d;position:relative}.vinyl-hole{width:10px;height:10px;background-color:#111;border-radius:50%;box-shadow:inset 0 0 5px #fff3;z-index:3;margin:5px 0}.vinyl-label-text{color:#fff;font-size:.4rem;font-weight:700;text-shadow:var(--text-shadow-light);letter-spacing:.5px;line-height:1;text-align:center;width:100%}.vinyl-control-btn{background:linear-gradient(to bottom,var(--primary-color),var(--primary-dark));color:#fff;border:none;padding:.6rem 1.4rem;border-radius:50px;cursor:pointer;font-size:.9rem;font-weight:600;transition:var(--transition);box-shadow:0 4px 15px #0000004d;border:var(--border-light);min-width:100px}.vinyl-control-btn:hover{background:linear-gradient(to bottom,var(--primary-light),var(--primary-color));transform:translateY(-2px);box-shadow:0 6px 20px #0006}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.vinyl-record{animation:rotate 4s linear infinite;animation-play-state:paused}.vinyl-record.spinning{animation-play-state:running}@media(max-width:768px){.vinyl-section{padding:var(--space-md);max-width:200px}}@media(max-width:480px){.vinyl-section{padding:.8rem;max-width:180px}.vinyl-container{width:140px;height:140px}.vinyl-record{width:130px;height:130px}.vinyl-label{width:50px;height:50px}.vinyl-label-text{font-size:.4rem}}.bell-experiment h2{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-lg);text-align:center}.control-panel{background-color:var(--bg-form);border-radius:var(--border-radius);padding:var(--space-lg);box-shadow:0 4px 15px #00000026;-webkit-backdrop-filter:var(--blur-light);backdrop-filter:var(--blur-light);border:var(--border-medium)}.control-panel h3{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.5rem}.angle-controls{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-lg)}.angle-controls h4{color:#fff;margin-bottom:var(--space-md);text-align:center;text-shadow:var(--text-shadow-heavy);font-weight:600;background:var(--bg-overlay);padding:var(--space-sm);border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.2)}.angle-control{display:flex;flex-direction:column;gap:var(--space-sm)}.angle-control label{color:#fff;font-weight:500;text-shadow:var(--text-shadow-light)}.angle-control input[type=range]{width:100%;height:8px;border-radius:4px;background:linear-gradient(45deg,#667eea,#764ba2);outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.angle-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;cursor:pointer;box-shadow:0 2px 4px #0000004d}.angle-control input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;cursor:pointer;border:none;box-shadow:0 2px 4px #0000004d}.checkbox-control{display:flex;flex-direction:column;gap:var(--space-sm);padding:var(--space-md);background:#ffffff0d;border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.1)}.checkbox-label{display:flex;align-items:center;gap:var(--space-sm);color:#fff;font-weight:500;text-shadow:var(--text-shadow-light);cursor:pointer}.checkbox-label input[type=checkbox]{width:18px;height:18px;accent-color:#667eea;cursor:pointer}.control-description{color:#ffffffb3;font-size:.9rem;line-height:1.4;margin:0;font-style:italic}.experiment-buttons{display:flex;gap:var(--space-sm);flex-wrap:wrap}.btn-outline{background:var(--bg-primary-alpha);border:2px solid var(--primary-color);color:#fff;border-radius:var(--button-border-radius);padding:.6rem 1.5rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;transition:var(--transition);cursor:pointer;box-shadow:var(--box-shadow);text-shadow:var(--text-shadow-light)}.btn-outline:hover{background:var(--primary-color);color:#fff;transform:translateY(-2px);box-shadow:var(--box-shadow-hover)}.btn-outline:disabled{border-color:var(--disabled-color, #bdc3c7);color:var(--disabled-color, #bdc3c7);cursor:not-allowed;transform:none;box-shadow:none}.btn-outline:disabled:hover{background:transparent;color:var(--disabled-color, #bdc3c7);transform:none;box-shadow:none}.dropdown-control{display:flex;flex-direction:column;gap:var(--space-sm);margin-bottom:var(--space-md)}.dropdown-control label{color:#fff;font-weight:500;text-shadow:var(--text-shadow-light)}.dropdown-control select{width:100%;padding:.75rem 2.5rem .75rem .75rem;line-height:1.6;height:auto;min-height:3rem;border:1px solid rgba(255,255,255,.2);border-radius:var(--border-radius);background:#34495e url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"><path fill="white" d="M2 0L0 2h4zm0 5L0 3h4z"/></svg>') no-repeat right .75rem center;background-size:1rem;color:#fff;font-size:1rem;cursor:pointer;transition:border-color .3s ease;appearance:none;-webkit-appearance:none;-moz-appearance:none}.dropdown-control select option{background:#34495e!important;color:#fff!important;padding:.75rem!important;line-height:1.6!important;border:none!important;font-size:1rem!important}.dropdown-control select option:checked{background:var(--primary-color)!important;color:#fff!important}.dropdown-control select option:hover{background:var(--primary-color)!important;color:#fff!important}.dropdown-control select:hover{border-color:var(--primary-color);background:#ffffff26}.dropdown-control select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px var(--primary-color-alpha, rgba(102, 126, 234, .2))}.dropdown-control select:disabled{opacity:.5;cursor:not-allowed}.algorithm-steps{background-color:var(--bg-form);border-radius:var(--border-radius);padding:var(--space-lg);box-shadow:0 4px 15px #00000026;-webkit-backdrop-filter:var(--blur-light);backdrop-filter:var(--blur-light);border:var(--border-medium);overflow:auto;min-height:0;flex:1}.algorithm-steps h3{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.5rem}.algorithm-step{margin-bottom:var(--space-md);padding:var(--space-md);border-radius:var(--border-radius);background:#ffffff0d;border:1px solid rgba(255,255,255,.1);transition:all .3s ease}.algorithm-step.active{background:#ffffff0d;border:1px solid rgba(255,255,255,.1)}.algorithm-step.completed{background:#4caf5033;border:1px solid rgba(76,175,80,.5)}.step-header{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-sm)}.step-number{width:24px;height:24px;border-radius:50%;background:linear-gradient(45deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.8rem}.algorithm-step.completed .step-number{background:linear-gradient(45deg,#4caf50,#2e7d32)}.step-header h4{color:#fff;margin:0;text-shadow:var(--text-shadow-light)}.algorithm-step p{color:var(--text-secondary);margin:0;line-height:1.6;font-size:.95rem}.step-visualization{margin-top:var(--space-md);padding:var(--space-md);background:#0003;border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.1)}.viz-placeholder{color:#ffffffb3;text-align:center;font-style:italic;padding:var(--space-lg)}.detectors-container{background-color:var(--bg-form);border-radius:var(--border-radius);padding:var(--space-lg);box-shadow:0 4px 15px #00000026;-webkit-backdrop-filter:var(--blur-light);backdrop-filter:var(--blur-light);border:var(--border-medium);overflow:hidden;min-width:0}.detectors-container h3{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.5rem;text-align:center}.detectors-grid{display:grid;grid-template-columns:2fr 1fr 2fr;gap:var(--space-md);align-items:center}.detector{text-align:center;padding:var(--space-md);background:#ffffff0d;border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.1);min-width:0;overflow:hidden}.detector h4{color:#fff;margin-bottom:var(--space-md);text-shadow:var(--text-shadow-light)}.detector-visual{position:relative;width:80px;height:80px;margin:0 auto var(--space-md);background:radial-gradient(circle,rgba(255,255,255,.1) 0%,transparent 70%);border-radius:50%;display:flex;align-items:center;justify-content:center}.polarizer{width:60px;height:60px;position:relative;transition:transform .3s ease}.polarizer-line{width:2px;height:100%;background:linear-gradient(0deg,#667eea,#764ba2);margin:0 auto;box-shadow:0 0 10px #667eea80}.angle-display{color:#fff;font-size:.9rem;font-weight:700;text-shadow:var(--text-shadow-light)}.measurement-result{color:#fffc;font-size:.9rem}.result-value{font-weight:700;font-size:1.1rem}.result-value.positive{color:#4caf50}.result-value.negative{color:#f44336}.entanglement-source{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:100%;padding:var(--space-sm)}.photon-source{background:radial-gradient(circle,rgba(255,255,255,.8) 0%,rgba(102,126,234,.3) 50%,transparent 100%);width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;animation:pulse 2s infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.8}}.photon-pair{display:flex;align-items:center;gap:var(--space-sm)}.photon{width:8px;height:8px;border-radius:50%;animation:photon-glow 1s infinite alternate}.alice-photon{background:#667eea;box-shadow:0 0 10px #667eea}.bob-photon{background:#764ba2;box-shadow:0 0 10px #764ba2}@keyframes photon-glow{0%{opacity:.7}to{opacity:1}}.entanglement-line{width:20px;height:1px;background:linear-gradient(90deg,#667eea,#764ba2);animation:entanglement-flow 2s infinite}@keyframes entanglement-flow{0%,to{opacity:.5}50%{opacity:1}}.results-panel{background-color:var(--bg-form);border-radius:var(--border-radius);padding:var(--space-lg);box-shadow:0 4px 15px #00000026;-webkit-backdrop-filter:var(--blur-light);backdrop-filter:var(--blur-light);border:var(--border-medium)}.results-panel h3{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-md);border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.5rem}.measurements-table{margin-top:var(--space-lg)}.measurements-table h4{color:#fff;margin-bottom:var(--space-md);text-shadow:var(--text-shadow-light)}.measurements-table .positive{color:#4caf50;font-weight:700}.measurements-table .negative{color:#f44336;font-weight:700}.chsh-results{margin-top:var(--space-lg);padding:var(--space-lg);background:#ffffff0d;border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.1)}.chsh-results h4,.chsh-results h5{color:#fff;margin-bottom:var(--space-md);text-align:center;text-shadow:var(--text-shadow-heavy);font-weight:600;background:var(--bg-overlay);padding:var(--space-sm);border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.2)}.chsh-summary{margin-bottom:var(--space-lg)}.chsh-stat{display:flex;flex-direction:column;margin-bottom:var(--space-sm);padding:var(--space-sm);background:#0003;border-radius:var(--border-radius)}.chsh-stat .label{color:#fffc;font-size:.9rem;margin-bottom:4px}.chsh-stat .value{font-weight:700;color:#fff;font-size:1.1rem;margin-bottom:4px}.chsh-stat .limit-status{color:#ffffffb3;font-size:.8rem;font-style:italic}.chsh-stat .value.violation{color:#f44336;animation:pulse-violation 2s infinite}.chsh-stat .value.classical{color:#4caf50}@keyframes pulse-violation{0%,to{opacity:1}50%{opacity:.7}}.chsh-interpretation{margin-top:var(--space-md);padding:var(--space-md);background:#667eea1a;border-radius:var(--border-radius);border-left:4px solid #667eea}.chsh-interpretation p{color:#ffffffe6;margin-bottom:var(--space-sm);line-height:1.4}.chsh-interpretation strong{color:#fff;text-shadow:var(--text-shadow-light)}.chsh-correlations{margin-top:var(--space-md)}.correlation-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-sm);min-width:0;max-width:100%;box-sizing:border-box}.correlation-item{display:flex;justify-content:space-between;padding:var(--space-sm);background:#0003;border-radius:var(--border-radius)}.correlation-label{color:#fffc;font-size:.9rem}.correlation-value{color:#fff;font-weight:700}.stat-subtitle{font-size:.8rem;color:#ffffffb3;margin-top:4px}.bell-violation{color:#f44336!important;animation:pulse-violation 2s infinite}.chsh-angles-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg);margin-bottom:var(--space-md)}.angle-group{background:#ffffff0d;border-radius:var(--border-radius);padding:var(--space-md);border:1px solid rgba(255,255,255,.1)}.angle-group h5{color:#fff;margin-bottom:var(--space-md);text-align:center;text-shadow:var(--text-shadow-heavy);font-weight:600;background:var(--bg-overlay);padding:var(--space-sm);border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.2)}.detector-angles{display:flex;gap:var(--space-md);justify-content:center;flex-wrap:wrap;max-width:100%}.chsh-formula{color:#fffc;font-family:Courier New,monospace;font-size:.8rem;text-align:center;margin-top:var(--space-sm);padding:var(--space-xs) var(--space-sm);background:#0000004d;border-radius:var(--border-radius);max-width:100%;overflow-wrap:break-word}.correlation-details{margin-top:var(--space-lg)}.correlation-details h4{color:#fff;margin-bottom:var(--space-md);text-align:center;text-shadow:var(--text-shadow-heavy);font-weight:600;background:var(--bg-overlay);padding:var(--space-sm);border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.2)}.details-instruction{color:#ffffffb3;font-style:italic;margin-bottom:var(--space-md);text-align:center}.correlation-item{cursor:pointer;transition:all .3s ease}.correlation-item:hover{background:#667eea33}.correlation-item.selected{background:#667eea4d;border-color:#667eea;box-shadow:0 0 10px #667eea66}.measurement-details{margin-top:var(--space-md);padding:var(--space-md);background:#0003;border-radius:var(--border-radius);border:1px solid rgba(255,255,255,.1)}.measurement-details h5{color:#fff;margin-bottom:var(--space-md);text-shadow:var(--text-shadow-light)}.measurement-summary{color:#ffffffb3;font-size:.9rem;text-align:center;margin-top:var(--space-sm);font-style:italic}.comparison-results{margin-top:var(--space-lg);padding:var(--space-md);background:#667eea1a;border-radius:var(--border-radius);border:1px solid rgba(102,126,234,.3)}.comparison-results h5{color:#fff;margin-bottom:var(--space-md);text-align:center;text-shadow:var(--text-shadow-light)}.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);min-width:0;max-width:100%;box-sizing:border-box}.comparison-item{display:flex;justify-content:space-between;padding:var(--space-sm);background:#0003;border-radius:var(--border-radius)}.comparison-label{color:#fffc;font-weight:500}.comparison-value{color:#fff;font-weight:700}.comparison-value.violation{color:#f44336}.comparison-value.classical{color:#4caf50}.stats-container{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md);margin-bottom:var(--space-lg);min-width:0;max-width:100%;box-sizing:border-box}.stat-card{background:#ffffff0d;border-radius:var(--border-radius);padding:var(--space-md);border:1px solid rgba(255,255,255,.1);text-align:center;min-width:0;max-width:100%;box-sizing:border-box}.stat-card h4{color:#fff;margin-bottom:var(--space-sm);font-size:.9rem;text-shadow:var(--text-shadow-light)}.stat-number{font-size:1.2rem;font-weight:700;color:#fff;margin-bottom:var(--space-xs)}.table-container{overflow-x:auto;max-width:100%;box-sizing:border-box}.table-container table{width:100%;border-collapse:collapse;min-width:0;max-width:100%}.table-container th,.table-container td{padding:var(--space-sm);text-align:center;border-bottom:1px solid rgba(255,255,255,.1);color:#fff;white-space:nowrap}.table-container th{background:#0003;font-weight:700}@media(max-width:1024px){.experiment-content{grid-template-columns:1fr;grid-template-areas:"controls" "visualization" "results"}.detectors-grid{grid-template-columns:1fr;gap:var(--space-md)}.entanglement-source{order:-1}.chsh-angles-grid{grid-template-columns:1fr;gap:var(--space-md)}}@media(max-width:768px){.experiment-buttons{flex-direction:column}.angle-controls{gap:var(--space-lg)}.detector-visual{width:60px;height:60px}.polarizer{width:40px;height:40px}.chsh-angles-grid{grid-template-columns:1fr;gap:var(--space-md)}.comparison-grid{grid-template-columns:1fr;gap:var(--space-sm)}.correlation-grid{grid-template-columns:1fr}.stats-container{grid-template-columns:1fr;gap:var(--space-sm)}}.ghz-experiment h2{color:#fff;text-shadow:var(--text-shadow-medium);margin-bottom:var(--space-lg);text-align:center}.experiment-description{color:var(--text-secondary);text-align:center;margin-bottom:var(--space-lg);font-size:1.1rem;line-height:1.6}.experiment-content{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr;gap:var(--space-lg);grid-template-areas:"controls visualization" "results visualization"}.control-panel{grid-area:controls;min-width:0;max-width:100%;box-sizing:border-box}.visualization-area{grid-area:visualization;display:flex;flex-direction:column;gap:var(--space-md);min-height:0;max-width:100%;overflow:hidden;box-sizing:border-box}.results-panel{grid-area:results;min-height:0;min-width:0;max-width:100%;box-sizing:border-box}.control-panel{background:var(--bg-secondary);border-radius:var(--border-radius);padding:var(--space-lg);border:1px solid var(--border-color);-webkit-backdrop-filter:var(--blur-light);backdrop-filter:var(--blur-light)}.control-panel h3{color:#fff;margin-bottom:var(--space-md);font-size:1.3rem;text-shadow:var(--text-shadow-medium);border-bottom:1px solid var(--border-color);padding-bottom:var(--space-sm)}.direction-controls-group{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-lg)}.direction-control{display:flex;flex-direction:column;gap:var(--space-xs)}.direction-control label{color:var(--text-primary);font-weight:500;font-size:.95rem;text-shadow:var(--text-shadow-light)}.direction-select{width:100%;padding:var(--space-sm) var(--space-md);border:1px solid var(--border-color);border-radius:var(--border-radius);background:var(--bg-tertiary);color:var(--text-primary);font-size:.95rem;cursor:pointer;transition:all .2s ease}.direction-select:hover:not(:disabled){border-color:var(--accent-primary);background:var(--bg-secondary)}.direction-select:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 2px #6366f133}.direction-select:disabled{opacity:.5;cursor:not-allowed}.direction-select option{background:var(--bg-tertiary);color:var(--text-primary);padding:var(--space-sm)}.preset-buttons{display:flex;flex-direction:column;gap:var(--space-sm);margin-bottom:var(--space-lg)}.preset-button{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:var(--space-sm) var(--space-md);cursor:pointer;transition:all .2s ease;font-size:.9rem}.preset-button:hover:not(:disabled){background:var(--bg-tertiary);border-color:var(--accent-primary);transform:translateY(-1px)}.preset-button:disabled{opacity:.5;cursor:not-allowed}.checkbox-control{margin-bottom:var(--space-lg)}.checkbox-label{display:flex;align-items:center;gap:var(--space-sm);color:var(--text-primary);cursor:pointer;font-size:.95rem}.checkbox-label input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent-primary)}.run-experiment-button,.single-measurement-button{width:100%;background:var(--accent-primary);color:#fff;border:none;border-radius:var(--border-radius);padding:var(--space-md);font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .2s ease;margin-bottom:var(--space-sm)}.run-experiment-button:hover:not(:disabled),.single-measurement-button:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 4px 12px #6366f14d}.run-experiment-button:disabled,.single-measurement-button:disabled{background:var(--bg-secondary);color:var(--text-secondary);cursor:not-allowed;transform:none;box-shadow:none}.single-measurement-button{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-color)}.single-measurement-button:hover:not(:disabled){background:var(--bg-tertiary);border-color:var(--accent-primary);box-shadow:0 2px 8px #0003}.algorithm-steps{background:var(--bg-secondary);border-radius:var(--border-radius);padding:var(--space-lg);border:1px solid var(--border-color)}.algorithm-steps h3{color:#fff;margin-bottom:var(--space-md);font-size:1.3rem;text-shadow:var(--text-shadow-medium);text-align:center;border-bottom:1px solid var(--border-color);padding-bottom:var(--space-sm)}.steps-container{display:flex;flex-direction:column;gap:var(--space-md)}.step{display:flex;gap:var(--space-md);padding:var(--space-md);border-radius:var(--border-radius);background:var(--bg-tertiary);border:2px solid var(--border-color);transition:all .3s ease;opacity:.6}.step.active{opacity:.9;border-color:var(--accent-primary);background:var(--bg-secondary)}.step.current{opacity:1;border-color:var(--accent-primary);background:#6366f126;box-shadow:0 0 20px #6366f14d}.step-number{flex-shrink:0;width:32px;height:32px;border-radius:50%;background:var(--accent-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.9rem}.step.current .step-number{background:var(--accent-primary);animation:pulse-glow 2s infinite}@keyframes pulse-glow{0%,to{box-shadow:0 0 5px #6366f180}50%{box-shadow:0 0 20px #6366f1cc,0 0 30px #6366f166}}.step-content h4{color:var(--text-primary);margin-bottom:var(--space-xs);font-size:1rem;font-weight:600;text-shadow:var(--text-shadow-light)}.step-content p{color:var(--text-secondary);font-size:.95rem;line-height:1.6;margin:0}.results-container{background:var(--bg-secondary);border-radius:var(--border-radius);padding:var(--space-lg);border:1px solid var(--border-color)}.results-container h3{color:#fff;margin-bottom:var(--space-lg);text-align:center;font-size:1.4rem}.results-summary{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);margin-bottom:var(--space-lg)}.result-stat{display:flex;flex-direction:column;gap:var(--space-xs);padding:var(--space-md);background:var(--bg-tertiary);border-radius:var(--border-radius);border:1px solid var(--border-color)}.stat-label{color:var(--text-secondary);font-size:.9rem;font-weight:500}.stat-value{color:var(--text-primary);font-size:1.1rem;font-weight:600}.stat-value.ghz-success{color:var(--success-color)}.stat-value.ghz-warning{color:var(--warning-color)}.outcome-distribution h4,.ghz-analysis h4,.sample-measurements h4{color:#fff;margin-bottom:var(--space-md);font-size:1.2rem}.outcomes-grid{display:flex;flex-direction:column;gap:var(--space-sm);margin-bottom:var(--space-lg)}.outcome-item{display:flex;justify-content:space-between;align-items:center;padding:var(--space-sm) var(--space-md);background:var(--bg-tertiary);border-radius:var(--border-radius);border:1px solid var(--border-color)}.outcome-pattern{font-family:Courier New,monospace;color:var(--text-primary);font-weight:600;font-size:1rem}.outcome-count{color:var(--accent-primary);font-weight:600}.outcome-percentage{color:var(--text-secondary);font-size:.9rem}.analysis-grid{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-lg)}.analysis-item{padding:var(--space-md);border-radius:var(--border-radius);border:2px solid;display:flex;flex-direction:column;gap:var(--space-xs)}.analysis-item.success{border-color:var(--success-color);background:#22c55e1a}.analysis-item.warning{border-color:var(--warning-color);background:#fbbf241a}.analysis-item strong{color:var(--text-primary);font-size:1rem}.analysis-item span{font-weight:600;font-size:1.1rem}.analysis-item.success span{color:var(--success-color)}.analysis-item.warning span{color:var(--warning-color)}.analysis-item small{color:var(--text-secondary);font-size:.85rem;line-height:1.4}.measurements-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-sm)}.measurement-item{display:flex;justify-content:space-between;align-items:center;padding:var(--space-sm);background:var(--bg-tertiary);border-radius:var(--border-radius);border:1px solid var(--border-color);font-family:Courier New,monospace;font-size:.9rem}.measurement-index{color:var(--text-secondary);font-weight:500}.measurement-alice,.measurement-bob,.measurement-charlie{color:var(--text-primary);font-weight:600}.measurement-parity{color:var(--accent-primary);font-weight:700}@media(max-width:1024px){.experiment-content{grid-template-columns:1fr;grid-template-areas:"controls" "visualization" "results"}.results-summary,.measurements-grid{grid-template-columns:1fr}}@media(max-width:768px){.preset-buttons{flex-direction:column}.outcome-item{flex-direction:column;align-items:flex-start;gap:var(--space-xs)}.measurement-item{flex-direction:column;gap:var(--space-xs);align-items:flex-start}}