:root{--primary: #3f51b5;--primary-light: #757de8;--primary-dark: #002984;--secondary: #ff4081;--secondary-light: #ff79b0;--secondary-dark: #c60055;--background: #fffcf2;--surface: #dbddff;--score-card-bg: #fdf9d1;--error: #f44336;--success: #4caf50;--warning: #ff9800;--on-primary: #ffffff;--on-secondary: #ffffff;--on-background: rgba(0, 0, 0, .87);--on-surface: rgba(0, 0, 0, .87);--on-error: #ffffff;--text-primary: rgba(0, 0, 0, .87);--text-secondary: rgba(0, 0, 0, .6);--text-hint: rgba(0, 0, 0, .38);--divider: rgba(0, 0, 0, .12);--elevation-1: 0 1px 3px rgba(251, 240, 255, .12), 0 1px 2px rgba(0,0,0,.24);--elevation-2: 0 3px 6px rgba(241, 217, 255, .16), 0 3px 6px rgba(0,0,0,.23)}[data-theme=dark]{--primary: #7986cb;--primary-light: #aab6fe;--primary-dark: #49599a;--secondary: #ff80ab;--secondary-light: #ffb2dd;--secondary-dark: #c94f7c;--background: #121212;--surface: #2e2828;--score-card-bg: #1e0922;--error: #f44336;--success: #4caf50;--warning: #ff9800;--on-primary: rgba(0, 0, 0, .87);--on-secondary: rgba(0, 0, 0, .87);--on-background: #ffffff;--on-surface: #ffffff;--on-error: #ffffff;--text-primary: rgba(255, 255, 255, .87);--text-secondary: rgba(255, 255, 255, .6);--text-hint: rgba(255, 255, 255, .38);--divider: rgba(255, 255, 255, .12);--elevation-1: 0 1px 3px rgba(0,0,0,.3), 0 1px 2px rgba(0,0,0,.22)}*{box-sizing:border-box;margin:0;padding:0}html{font-family:Mozilla Text,sans-serif;font-size:16px}body{font-family:Mozilla Text,sans-serif;font-weight:600;line-height:1.5;background-color:var(--background);color:var(--on-background);transition:all .3s ease;min-height:100vh}@media (max-width: 600px){html{font-size:14px}}h1,h2,h3,h4,h5,h6{font-family:Mozilla Text,sans-serif;font-weight:600;line-height:1.2;margin-bottom:1rem;color:var(--text-primary)}h1,h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}@media (max-width: 768px){h1{font-size:2rem}h2{font-size:1.75rem}h3{font-size:1.5rem}h4{font-size:1.25rem}}.container{width:100%;max-width:1200px;margin:0 auto;padding:1rem}.app-container{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1;padding:2rem 0;display:flex;flex-direction:column;align-items:center}.content-wrapper{width:100%;max-width:800px;padding:0 1rem}.card{background-color:var(--surface);border-radius:10px;box-shadow:var(--elevation-1);padding:1.5rem;margin-bottom:1.5rem;transition:all .3s ease;width:100%}.card:hover{box-shadow:var(--elevation-2)}.card-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.form-control{margin-bottom:1.5rem;width:100%}.label{display:block;margin-bottom:.5rem;font-family:Mozilla Text,sans-serif;font-size:.875rem;font-weight:700}.select{position:relative;width:100%}option{font-family:Mozilla Text,sans-serif;font-weight:700}.select select{width:100%;padding:.75rem 1rem;font-family:Mozilla Text,sans-serif;font-size:1rem;font-weight:700;border:1px solid var(--divider);border-radius:10px;background-color:var(--surface);color:var(--text-primary);appearance:none;transition:all .3s ease}.select select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #3f51b533}.select:after{content:"expand_more";font-family:Material Icons;position:absolute;top:50%;right:1rem;transform:translateY(-50%);color:var(--text-secondary);pointer-events:none;font-size:1.25rem}.icon-button{background-color:transparent;color:var(--primary);border:none;border-radius:50%;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;padding:0}.icon-button:hover{background-color:#3f51b51a}.icon-button:active{background-color:#3f51b533}.icon-button .material-icons{font-size:1.5rem}.notification-container{position:fixed;top:1rem;right:1rem;z-index:1000;display:flex;flex-direction:column;gap:.5rem;max-width:400px;width:calc(100% - 2rem)}.notification{padding:1rem;border-radius:4px;font-family:Mozilla Text,sans-serif;font-size:.875rem;font-weight:500;box-shadow:var(--elevation-2);display:flex;align-items:flex-start;gap:.75rem;animation:slideIn .3s ease-out;transform-origin:top right;max-width:100%}.notification.success{background-color:var(--success);color:#fff}.notification.error{background-color:var(--error);color:var(--on-error)}.notification.info{background-color:var(--primary);color:var(--on-primary)}.notification-icon{flex-shrink:0;display:flex;align-items:center}.notification-close{margin-left:auto;cursor:pointer;opacity:.8;transition:opacity .2s ease;background:none;border:none;color:inherit;display:flex;align-items:center}.notification-close:hover{opacity:1}@keyframes slideIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.score-display{background-color:var(--score-card-bg);border-radius:10px;padding:1rem;margin-top:1rem;overflow-x:auto;font-family:Mozilla Text,sans-serif;white-space:pre-wrap;color:var(--text-primary);font-size:.875rem;line-height:1.6}pre{font-family:Mozilla Text,sans-serif;padding:15px;border-radius:5px;overflow-x:auto;white-space:pre-wrap}.theme-toggle{display:flex;justify-content:center;margin-bottom:1.5rem;width:100%}.theme-toggle-button{background-color:transparent;border:none;color:var(--text-primary);cursor:pointer;display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:20px;transition:all .3s ease}.theme-toggle-button:hover{background-color:var(--divider)}.theme-toggle-button .material-icons{font-size:1.25rem}.spinner{animation:spin 1s linear infinite;width:20px;height:20px;border:3px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff}.match-status{display:inline-block;padding:.25rem .75rem;border-radius:12px;font-family:Mozilla Text,sans-serif;font-size:.75rem;font-weight:600;background-color:var(--primary);color:var(--on-primary);margin-left:.5rem}.empty-state{text-align:center;padding:2rem;color:var(--text-secondary)}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 768px){.card{padding:1rem}.card-title{flex-direction:column;align-items:flex-start;gap:1rem}.notification-container{max-width:100%}}@media (max-width: 480px){.content-wrapper{padding:0 .5rem}.card{padding:1rem .75rem}.notification{padding:.75rem}}