.match-table-container{display:flex;flex-direction:column;gap:1rem;margin:0 auto;transition:max-width .3s ease;width:100%}.match-table-container.card{max-width:800px}.match-table-container.spreadsheet{max-width:1200px}.match-view-controls{display:flex;justify-content:flex-end}.view-toggle-btn{background:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary);padding:.5rem 1rem;font-size:.875rem;cursor:pointer;transition:all .2s ease}.view-toggle-btn:first-child{border-top-left-radius:var(--radius);border-bottom-left-radius:var(--radius);border-right:none}.view-toggle-btn:last-child{border-top-right-radius:var(--radius);border-bottom-right-radius:var(--radius);border-left:none}.view-toggle-btn:hover{background:var(--bg-card-hover);color:var(--text-primary)}.view-toggle-btn.active{background:#6c5ce71a;color:var(--primary);border-color:var(--primary);z-index:1}.match-list{display:flex;flex-direction:column;gap:1rem}.match-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.25rem;transition:background .2s ease,border-color .2s ease,transform .15s ease}.match-card:hover{background:var(--bg-card-hover);border-color:#6c5ce726}.match-date{font-size:.75rem;color:var(--text-muted);font-weight:500;margin-bottom:.625rem;letter-spacing:.02em;text-transform:uppercase}.card-players{display:flex;flex-direction:column;gap:.375rem}.card-player-row{display:grid;grid-template-columns:2rem 1fr auto auto;align-items:center;gap:.5rem;padding:.375rem .5rem;border-radius:var(--radius-sm);font-size:.875rem;transition:background .15s ease}.card-player-row:hover{background:#ffffff08}.card-player-row.rank-1{background:#ffd7000a}.card-player-rank{font-size:1rem;text-align:center}.card-player-name{font-weight:500;color:var(--text-primary)}.card-player-score{font-variant-numeric:tabular-nums;color:var(--text-secondary);font-weight:400;text-align:right;min-width:4.5rem}.card-player-delta{font-variant-numeric:tabular-nums;font-size:.8rem;font-weight:500;text-align:right;min-width:3.5rem}.card-player-delta.positive{color:var(--positive)}.card-player-delta.negative{color:var(--negative)}.spreadsheet-container{width:100%;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-card);overflow:hidden}.match-spreadsheet{width:100%;border-collapse:collapse;font-size:.875rem;text-align:left}.match-spreadsheet th,.match-spreadsheet td{padding:.75rem 1rem;border-bottom:1px solid var(--border)}.match-spreadsheet th{background:var(--bg-card-hover);color:var(--text-muted);font-weight:600;text-transform:uppercase;font-size:.75rem;letter-spacing:.05em;white-space:nowrap;position:sticky;top:0;z-index:10}.match-spreadsheet td{color:var(--text-primary)}.match-spreadsheet th.text-right,.match-spreadsheet td.text-right{text-align:right}.match-spreadsheet th.text-center,.match-spreadsheet td.text-center{text-align:center}.match-group-start{border-top:2px solid var(--border)}.match-spreadsheet td.match-date-cell{vertical-align:top;font-variant-numeric:tabular-nums;color:var(--text-muted);font-size:.8rem;border-right:1px solid var(--border);background:var(--bg-card)}.spreadsheet-rank-1{color:gold;font-weight:700}.spreadsheet-rank-2{color:silver}.spreadsheet-rank-3{color:#cd7f32}.match-spreadsheet td.positive{color:var(--positive)}.match-spreadsheet td.negative{color:var(--negative)}.match-spreadsheet td.yakuman{color:var(--yakuman);font-weight:700;text-shadow:0 0 8px rgba(73,182,255,.3)}.stat-cell{font-family:monospace;font-size:1rem;color:var(--text-muted)}.player-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1.5rem}.summary-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;display:flex;flex-direction:column;gap:.25rem;transition:transform .2s ease}.summary-card:hover{transform:translateY(-2px);border-color:var(--primary)}.summary-label{font-size:.75rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.summary-value-container{display:flex;align-items:baseline;gap:.75rem}.summary-value{font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums}.summary-recent{font-size:.875rem;font-weight:500;font-variant-numeric:tabular-nums;opacity:.8}.summary-value.positive,.summary-recent.positive{color:var(--positive)}.summary-value.negative,.summary-recent.negative{color:var(--negative)}@media(max-width:768px){.match-spreadsheet th,.match-spreadsheet td{padding:.5rem;font-size:.8rem}.match-date{font-size:.7rem}}.mahjong-page{min-height:100vh}.mahjong-header{background:linear-gradient(135deg,var(--bg-secondary) 0%,rgba(108,92,231,.08) 100%);border-bottom:1px solid var(--border);padding:2.5rem 1.5rem 2rem}.header-content{max-width:800px;margin:0 auto}.header-content h1{font-size:1.75rem;font-weight:700;letter-spacing:-.02em;display:flex;align-items:center;gap:.5rem}.header-icon{font-size:1.5rem}.subtitle{color:var(--text-secondary);font-size:.9rem;margin-top:.25rem;font-weight:400}.mahjong-main{max-width:1200px;width:100%;margin:0 auto;padding:1.5rem}.player-summary-container,.status-card{max-width:800px;width:100%;margin-left:auto;margin-right:auto}.status-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 2rem;text-align:center;color:var(--text-secondary);gap:.75rem}.status-card.error{color:var(--negative)}.empty-icon{font-size:2.5rem}.hint{font-size:.8rem;color:var(--text-muted)}.spinner{width:28px;height:28px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.history-controls{display:flex;justify-content:space-between;align-items:center;max-width:800px;margin:0 auto 1rem}.match-count{font-size:.85rem;color:var(--text-muted)}.count-number{color:var(--accent);font-weight:600}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary: #1e1e1e;--bg-secondary: #282828;--bg-card: #333333;--bg-card-hover: #3d3d3d;--text-primary: #d6d8cf;--text-secondary: #b0b0b0;--text-muted: #808080;--accent: #157A6E;--accent-glow: rgba(21, 122, 110, .2);--positive: #499F68;--negative: #B4654A;--yakuman: #49B6FF;--border: rgba(255, 255, 255, .1);--radius: 12px;--radius-sm: 8px;--font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font);background:var(--bg-primary);color:var(--text-primary);min-height:100vh;line-height:1.5}#root{min-height:100vh}