:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;--text-primary: #213547;--text-secondary: #666;--bg-primary: #ffffff;--bg-secondary: #f5f5f5;--bg-table-header: #f8f9fa;--border-color: #dee2e6;--shadow-color: rgba(0, 0, 0, .1);--color-ratio: #2c5282;--color-points: #2f855a;--color-bonus: #ae650c;color:var(--text-primary);background-color:var(--bg-primary);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme: dark){:root{--text-primary: rgba(255, 255, 255, .87);--text-secondary: rgba(255, 255, 255, .6);--bg-primary: #1a1a1a;--bg-secondary: #2a2a2a;--bg-table-header: #333;--border-color: #404040;--shadow-color: rgba(0, 0, 0, .3);--color-ratio: #90cdf4;--color-points: #68d391;--color-bonus: #fbd38d}}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;min-width:320px}h1{font-size:3.2em;line-height:1.1}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.settings{margin-bottom:24px;padding:12px;background-color:var(--bg-secondary);box-shadow:0 2px 4px var(--shadow-color)}.settings summary{color:var(--text-primary);font-size:1.17em;font-weight:700;cursor:pointer}.settings summary:hover{opacity:.8}.settings div{margin-top:8px}.points-input{margin-left:12px;padding:4px 8px;border:1px solid var(--border-color);border-radius:4px;width:80px;background-color:var(--bg-primary);color:var(--text-primary)}table{border-collapse:collapse;width:100%;background:var(--bg-primary);box-shadow:0 2px 8px var(--shadow-color);border-radius:8px;overflow:hidden}thead{position:-webkit-sticky;position:sticky;top:0;background-color:var(--bg-table-header);z-index:1;box-shadow:0 2px 4px var(--shadow-color)}thead th{position:-webkit-sticky;position:sticky;top:0;background-color:var(--bg-table-header)}th{background-color:var(--bg-table-header);color:var(--text-primary);font-weight:600;text-align:left;padding:12px 8px;border:1px solid var(--border-color)}td{padding:6px 8px;border:1px solid var(--border-color);line-height:1.6}tr:hover{background-color:var(--bg-secondary)}td span.ratio{font-weight:600;color:var(--color-ratio)}td span.points{color:var(--color-points);font-weight:500}td span.time{color:var(--text-secondary);font-size:.9em}td span.bonus{color:var(--color-bonus);font-size:.9em}
