:root{--color-bg: #0f1117;--color-sidebar: #161b22;--color-topbar: #161b22;--color-card: #1c2333;--color-card-hover: #21293a;--color-border: #30363d;--color-accent: #4CAF50;--color-accent-hover: #3d9140;--color-accent-dim: rgba(76, 175, 80, .15);--color-text: #e6edf3;--color-text-muted: #8b949e;--color-text-dim: #6e7681;--color-win: #238636;--color-win-bg: rgba(35, 134, 54, .15);--color-draw: #d29922;--color-draw-bg: rgba(210, 153, 34, .15);--color-loss: #da3633;--color-loss-bg: rgba(218, 54, 51, .15);--color-yellow-card: #d29922;--color-red-card: #da3633;--topbar-height: 56px;--sidebar-left-width: 220px;--sidebar-right-width: 280px;--footer-height: 32px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace;--transition: .15s ease;--transition-slow: .3s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:14px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);line-height:1.5;overflow:hidden;height:100vh}a{color:var(--color-accent);text-decoration:none}a:hover{color:var(--color-accent-hover);text-decoration:underline}button{cursor:pointer;font-family:var(--font-sans)}input,select,textarea{font-family:var(--font-sans)}h1,h2,h3,h4,h5,h6{font-weight:600;color:var(--color-text);line-height:1.25}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-dim)}.win{color:var(--color-win);background-color:var(--color-win-bg);padding:2px 8px;border-radius:var(--radius-sm);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}.draw{color:var(--color-draw);background-color:var(--color-draw-bg);padding:2px 8px;border-radius:var(--radius-sm);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}.loss{color:var(--color-loss);background-color:var(--color-loss-bg);padding:2px 8px;border-radius:var(--radius-sm);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}.badge-yellow{display:inline-flex;align-items:center;justify-content:center;width:16px;height:20px;background-color:var(--color-yellow-card);border-radius:2px;font-size:.65rem;font-weight:700;color:#000}.badge-red{display:inline-flex;align-items:center;justify-content:center;width:16px;height:20px;background-color:var(--color-red-card);border-radius:2px;font-size:.65rem;font-weight:700;color:#fff}.text-muted{color:var(--color-text-muted)}.text-accent{color:var(--color-accent)}.text-sm{font-size:.75rem}.text-center{text-align:center}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.btn,.btn-ghost,.btn-secondary,.btn-primary{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--radius-md);font-size:.875rem;font-weight:500;border:1px solid transparent;transition:all var(--transition);white-space:nowrap;line-height:1.5}.btn:disabled,.btn-ghost:disabled,.btn-secondary:disabled,.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background-color:var(--color-accent);color:#fff;border-color:var(--color-accent)}.btn-primary:hover:not(:disabled){background-color:var(--color-accent-hover);border-color:var(--color-accent-hover)}.btn-secondary{background-color:transparent;color:var(--color-text);border-color:var(--color-border)}.btn-secondary:hover:not(:disabled){background-color:var(--color-card);border-color:var(--color-text-muted)}.btn-ghost{background-color:transparent;color:var(--color-text-muted);border-color:transparent}.btn-ghost:hover:not(:disabled){background-color:var(--color-card);color:var(--color-text)}.form-group{display:flex;flex-direction:column;gap:4px}.form-group label{font-size:.75rem;font-weight:500;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.form-group input,.form-group select,.form-group textarea{background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);padding:6px 10px;font-size:.875rem;transition:border-color var(--transition);width:100%}.form-group input::placeholder,.form-group select::placeholder,.form-group textarea::placeholder{color:var(--color-text-dim)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 2px var(--color-accent-dim)}.form-group input option,.form-group select option,.form-group textarea option{background-color:var(--color-sidebar);color:var(--color-text)}.section-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.section-header h2{font-size:1rem;font-weight:600;color:var(--color-text)}.section-header .section-count{font-size:.75rem;color:var(--color-text-muted);background-color:var(--color-card);padding:1px 8px;border-radius:10px;border:1px solid var(--color-border)}.card{background-color:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:16px}.page{padding:24px}.page-title{font-size:1.25rem;font-weight:700;color:var(--color-text);margin-bottom:24px;display:flex;align-items:center;gap:10px}.page-title:before{content:"";display:block;width:3px;height:20px;background-color:var(--color-accent);border-radius:2px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;color:var(--color-text-muted);text-align:center;gap:8px}.empty-state .empty-icon{font-size:2.5rem;opacity:.4}.empty-state p{font-size:.875rem}.flag{display:inline-block;width:16px;height:12px;object-fit:cover;border-radius:1px;vertical-align:middle}.dialog-overlay{position:fixed;inset:0;background-color:#0009;z-index:200;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(2px)}.dialog{background-color:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:24px;min-width:360px;max-width:500px;width:90%;position:relative}.dialog .dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.dialog .dialog-header h3{font-size:1rem;font-weight:600}.dialog .dialog-header .dialog-close{background:none;border:none;color:var(--color-text-muted);font-size:1.25rem;cursor:pointer;padding:4px;border-radius:var(--radius-sm);line-height:1}.dialog .dialog-header .dialog-close:hover{color:var(--color-text);background-color:var(--color-bg)}.dialog .dialog-body{display:flex;flex-direction:column;gap:12px}
