@import"https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap";@import"https://fonts.googleapis.com/css2?family=Google+Sans+Code:ital,wght@0,300..800;1,300..800&display=swap";:root{--color-background: #f5f5f5;--color-surface: #ffffff;--color-surface-alt: #f0f2f5;--color-text: #111111;--color-text-inverse: #ffffff;--color-border: #cccccc;--color-accent: #2563eb;--color-accent-alt: #3b82f6;--color-danger: #dc2626;--color-warning: #f59e0b;--color-success: #16a34a;--color-overlay: rgba(0, 0, 0, .6);--color-error: rgba(255, 0, 0, .8);--color-menu-highlight: #2563eb;--color-menu-prompt: #facc15;--color-pulse-base: var(--color-accent-alt);--color-pulse-strong: var(--color-accent);--color-play-accent: #c2410c;--color-play-accent-alt: #ea580c;--color-play-glow: rgba(234, 88, 12, .5);--color-muted: #6b7280;--color-muted-border: #9ca3af}body[data-theme=dark]{--color-background: #0f172a;--color-surface: #1e293b;--color-surface-alt: #273549;--color-text: #f1f5f9;--color-text-inverse: #0f172a;--color-border: #334155;--color-accent: #60a5fa;--color-accent-alt: #93c5fd;--color-danger: #f87171;--color-warning: #fbbf24;--color-success: #4ade80;--color-overlay: rgba(0, 0, 0, .65);--color-error: rgba(185, 28, 28, .85);--color-menu-highlight: #3b82f6;--color-menu-prompt: #facc15;--color-pulse-base: var(--color-accent);--color-pulse-strong: var(--color-accent-alt);--color-play-accent: #f97316;--color-play-accent-alt: #fb923c;--color-play-glow: rgba(249, 115, 22, .6);--color-muted: #9ca3af;--color-muted-border: #6b7280}body{font-family:Lato;background-color:var(--color-background);color:var(--color-text);margin:0;padding:0;transition:background-color .25s,color .25s}#root{background-color:transparent}.menu-outer-container{display:flex;justify-content:center;align-items:center;height:100vh}.menu-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;color:var(--color-text)}.menu-button-container{background-color:var(--color-surface-alt);border:1px solid var(--color-border);padding:40px;align-items:center;justify-content:center;gap:20px;color:var(--color-text);width:300px;display:flex;flex-direction:column;gap:15px}.menu-title{font-size:48px;font-family:Lato;text-align:center;margin:0;letter-spacing:2px;font-weight:700}.smaller-button{margin-top:10px;text-decoration:none;color:var(--color-text);font-size:14px;font-family:Lato;border:1px solid var(--color-border);padding:8px 12px;border-radius:4px;background-color:var(--color-surface);transition:background-color .2s,color .2s}.discord-button{display:inline-flex;align-items:center;gap:6px}.discord-icon{display:flex;align-items:center;justify-content:center}.discord-icon svg{width:16px;height:16px}.menu-info{padding:20px;border:1px solid var(--color-border);background-color:var(--color-surface);font-size:20px;font-family:Lato;text-align:center;margin:0}.menu-info-username{font-weight:700}.menu-info-clickable{cursor:pointer;transition:color .2s,text-decoration-color .2s;text-decoration:underline;text-decoration-color:var(--color-muted);text-underline-offset:3px}.menu-info-clickable:hover{color:var(--color-accent);text-decoration-color:var(--color-accent)}.menu-info-rating{font-weight:700;background:linear-gradient(90deg,var(--color-play-accent),var(--color-play-accent-alt),var(--color-play-accent));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:rating-shimmer 3s ease-in-out infinite}@keyframes rating-shimmer{0%{background-position:100% 50%}50%{background-position:0% 50%}to{background-position:100% 50%}}.menu-button{width:100%;padding:16px 20px;border:2px solid var(--color-border);font-size:18px;font-weight:600;font-family:Lato,sans-serif;letter-spacing:.5px;cursor:pointer;background:var(--color-surface);color:var(--color-text);transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s;display:flex;align-items:center;justify-content:center;gap:10px}.menu-button-icon{display:flex;align-items:center;justify-content:center;width:1em;height:1em}.menu-button-icon svg{width:100%;height:100%}.menu-button-text{line-height:1}.menu-button-play{font-weight:700;letter-spacing:2px}@keyframes play-glow{0%,to{box-shadow:0 0 5px var(--color-play-glow),0 0 10px var(--color-play-glow)}50%{box-shadow:0 0 10px var(--color-play-glow),0 0 20px var(--color-play-glow),0 0 30px var(--color-play-glow)}}@keyframes play-pulse{0%{background-color:var(--color-play-accent)}50%{background-color:var(--color-play-accent-alt)}to{background-color:var(--color-play-accent)}}.menu-button-muted{color:var(--color-muted)}.menu-button-muted:hover{color:var(--color-text)}.menu-button.selected{animation:pulse 1.2s infinite;border-color:var(--color-menu-highlight)}.menu-button-play.selected{background:var(--color-play-accent);color:var(--color-text-inverse);border-color:var(--color-play-accent-alt);animation:play-pulse 1.2s infinite,play-glow 2s ease-in-out infinite}@keyframes pulse{0%{color:var(--color-text);background-color:var(--color-pulse-base)}50%{color:var(--color-text-inverse);background-color:var(--color-pulse-strong)}to{color:var(--color-text);background-color:var(--color-pulse-base)}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--color-overlay);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{position:relative;background-color:var(--color-surface);padding:30px;border-radius:8px;box-shadow:0 4px 15px #0003;display:flex;flex-direction:column;align-items:center;gap:15px;min-width:300px;text-align:center;font-family:Lato;color:var(--color-text)}.modal-title{margin:0 0 10px;font-family:Lato}.modal-error{color:var(--color-danger);font-size:14px;margin:0;height:20px}.input-field{padding:10px;font-size:16px;width:100%;border:1px solid var(--color-border);border-radius:4px;font-family:Lato;background:var(--color-surface);color:var(--color-text)}.modal-button{padding:10px 20px;font-size:16px;background-color:var(--color-success);color:var(--color-text-inverse);border:none;border-radius:4px;cursor:pointer;font-family:Lato}.friends{overflow-y:auto;scrollbar-width:thin;max-height:200px;width:340px;border:1px solid var(--color-border);border-radius:4px;display:flex;flex-direction:column;gap:10px;padding:20px}.friend-action-btn{width:28px;height:28px;border-radius:4px;border:1px solid transparent;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:background-color .2s,transform .1s,border-color .2s}.friend-action-btn:hover{transform:scale(1.05)}.friend-action-btn.accept{background-color:var(--color-accent);color:var(--color-text-inverse);border-color:var(--color-accent)}.friend-action-btn.accept:hover{background-color:var(--color-accent-hover);border-color:var(--color-accent-hover)}.friend-action-btn.decline{background-color:var(--color-surface);color:var(--color-text);border-color:var(--color-border)}.friend-action-btn.decline:hover{background-color:var(--color-surface-hover)}.friend-request-row{display:flex;gap:10px;align-items:center;padding:0 10px}.section-title{font-family:Lato;text-align:center;margin:15px 0 5px;font-size:18px}.friend-name{margin:0}.auth-overlay{display:none}.auth-button{padding:10px 15px;font-size:16px;border-radius:4px;border:none;cursor:pointer;background-color:var(--color-accent);color:var(--color-text-inverse);transition:background-color .2s}.auth-button.google{background-color:#db4437}.auth-button.github{background-color:#333;color:#fff}.auth-button.close{margin-top:20px;background-color:var(--color-border);color:var(--color-text)}.auth-button.google:hover{background-color:#c23321}.auth-button.github:hover{background-color:#222}.auth-button.close:hover{background-color:var(--color-accent-alt);color:var(--color-text-inverse)}.modal-close-icon{position:absolute;top:8px;right:12px;border:none;background:transparent;font-size:20px;cursor:pointer;color:var(--color-text)}.modal-close-icon:hover{color:var(--color-menu-prompt)}.video-container{position:absolute;top:0;z-index:-1;width:100vw;height:100vh;overflow:hidden}video{object-fit:cover;filter:blur(3px);width:100%;height:100%;top:0;left:0;z-index:-1}.end-screen-container{position:absolute;top:0;width:100vw;height:100vh;overflow:hidden;background-color:#0000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.end-screen{position:absolute;left:50%;top:50%;width:85%;height:85%;max-width:1400px;max-height:900px;transform:translate(-50%,-50%);font-family:Lato;color:var(--color-text);display:flex;border-width:2px;border-style:solid;border-radius:12px;overflow:hidden;box-shadow:0 8px 32px #0000004d}.end-screen-nav{background-color:var(--color-surface-alt);border-right:2px solid var(--color-border)}.end-screen-nav-item{user-select:none;-webkit-user-select:none;font-weight:400;background-color:transparent}.end-screen-nav-item.selected{background-color:var(--color-accent)!important;color:var(--color-text-inverse)!important;font-weight:700}.selected .key-hint span{color:var(--color-text-inverse)!important;border-color:var(--color-text-inverse)!important}.end-screen-content{background-color:var(--color-background)}.stats-view-container{box-shadow:0 2px 8px #0000001a}.animated-number-container{animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.match-history-container{display:flex;flex-direction:column;align-items:center;gap:20px;color:var(--color-text);background-color:var(--color-surface-alt);border:1px solid var(--color-border);padding:30px;min-width:380px;max-width:500px}.match-history-header{display:flex;align-items:center;gap:15px;width:100%}.match-history-back-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--color-border);border-radius:4px;background:var(--color-surface);color:var(--color-text);cursor:pointer;transition:background-color .2s,border-color .2s}.match-history-back-btn:hover{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-text-inverse)}.match-history-back-btn svg{width:20px;height:20px}.match-history-title{font-size:24px;font-family:Lato,sans-serif;margin:0;flex:1}.match-history-loading{padding:40px;text-align:center;opacity:.7;font-family:Lato,sans-serif}.match-history-empty{padding:40px;text-align:center;opacity:.6;font-family:Lato,sans-serif;font-size:16px}.match-history-list{display:flex;flex-direction:column;gap:8px;width:100%;max-height:400px;overflow-y:auto;scrollbar-width:thin}.match-history-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:4px;font-family:Lato,sans-serif}.match-history-date{font-size:14px;opacity:.85}.match-history-rating{font-size:16px;font-weight:600;min-width:60px;text-align:right}.rating-positive{color:var(--color-success)}.rating-negative{color:var(--color-danger)}