:root{--bg1:#2e3440;--bg2:#3b4252;--bg3:#434c5e;--text1:#eceff4;--text2:#e5e9f0;--text3:#d8dee9;--border1:#4c566a;--border2:#434c5e;--accent1:#88c0d0;--accent1-hover:#8fbcbb;--accent2:#5e81ac;--success:#a3be8c;--success-bg:#3b4252;--warning:#ebcb8b;--warning-bg:#3b4252;--warning-border:#434c5e;--error:#bf616a;--error-bg:#3b4252;--info:#81a1c1;--info-hover:#5e81ac;--info-bg:#3b4252;--info-border:#434c5e;--shadow-sm:0 2px 4px #2e3440;--shadow-md:0 4px 8px #2e3440;--shadow-lg:0 8px 32px #2e3440;--shadow-xl:0 6px 20px #2e3440;--overlay:#2e3440;--t:#ffffff}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:var(--bg1);color:var(--text1);transition:background-color 0.3s ease,color 0.3s ease;min-height:100vh;display:flex;flex-direction:column}main{max-width:1200px;width:calc(100% - 4rem);margin:2rem auto;padding:0 2rem;flex:1 0 auto}button{background:transparent;color:var(--text2);border:1px solid var(--text3);padding:0.5rem 1.25rem;border-radius:6px;cursor:pointer;font-size:0.95rem;font-weight:600}button:hover{border-color:var(--accent1);color:var(--accent1)}.link{color:var(--accent1);text-decoration:none;transition:color 200ms ease-in}.link:hover{text-decoration:underline}header{background:var(--bg2);padding:1rem 2rem;box-shadow:var(--shadow-md);display:flex;justify-content:space-between;align-items:center}footer{background:var(--bg2);padding:1rem 2rem;margin-top:auto;box-shadow:var(--shadow-md);text-align:center;color:white}footer p{margin:0;font-size:0.9rem;opacity:0.9}.logo{font-size:1.5rem;font-weight:bold;color:var(--text1);cursor:pointer}.logo:hover{opacity:0.9}.header-nav{display:flex;gap:1rem;align-items:center}.header-nav a{color:white;text-decoration:none;padding:0.5rem 1rem;border-radius:6px;transition:background 0.2s}.header-nav a:hover{background:rgba(255,255,255,0.1)}.header-nav a.active{background:rgba(255,255,255,0.2)}.user-section{display:flex;align-items:center;gap:1rem}.user-info{display:none;align-items:center;gap:0.5rem;color:var(--text1)}.user-avatar{width:36px;height:36px;border-radius:50%;background:var(--accent1);display:flex;align-items:center;justify-content:center;font-weight:bold;font-size:1.1rem}.header-btn{min-width:9rem;text-align:center}.lang-switcher{position:relative;margin-right:0.5rem}.lang-switcher-btn{background:transparent;border:1px solid var(--text3);border-radius:6px;padding:0.5rem;cursor:pointer;color:inherit;font-size:1.2rem;display:flex;align-items:center;justify-content:center;width:40px;height:40px;transition:border-color 200ms ease-in,color 200ms ease-in}.lang-switcher-btn:hover{border-color:var(--accent1)}.lang-switcher-dropdown{display:none;position:absolute;top:100%;right:0;margin-top:0.25rem;background:var(--bg2);border:1px solid var(--border1);border-radius:6px;box-shadow:var(--shadow-md);z-index:100;min-width:100px;overflow:hidden}.lang-switcher.open .lang-switcher-dropdown{display:block}.lang-switcher-option{display:flex;align-items:center;gap:0.5rem;width:100%;padding:0.5rem 0.75rem;background:transparent;border:none;cursor:pointer;color:var(--text1);font-size:0.9rem;text-align:left;transition:background-color 200ms ease-in}.lang-switcher-option:hover{background:var(--bg3)}.lang-switcher-option.active{background:var(--bg3);color:var(--accent1)}.lang-flag{font-size:1.1rem}.lang-code{font-weight:500}.auth-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:var(--overlay);justify-content:center;align-items:center;z-index:1000}.auth-modal-content{background:var(--bg2);padding:2rem;border-radius:12px;max-width:450px;width:90%;box-shadow:var(--shadow-lg)}.auth-modal-close{float:right;font-size:1.75rem;font-weight:bold;color:var(--text3);cursor:pointer;line-height:1}.auth-modal-close:hover{color:var(--text1)}.auth-modal h2{margin:0 0 1.5rem 0;color:var(--text1);font-size:1.75rem}.form-group{margin-bottom:1.25rem}.form-group label{display:block;margin-bottom:0.5rem;color:var(--text2);font-weight:500}.form-group input{width:100%;padding:0.75rem;border:1px solid var(--border2);border-radius:6px;font-size:1rem;transition:border-color 0.2s;background:var(--bg2);color:var(--text1)}.form-group input:focus{outline:none;border-color:var(--accent1);box-shadow:0 0 0 3px #434c5e}.error-message{display:none;background:var(--error-bg);border:1px solid var(--error);color:var(--error);padding:0.75rem;border-radius:6px;margin-bottom:1rem;font-size:0.9rem}.auth-modal button[type="submit"]{width:100%;background:linear-gradient(135deg,var(--accent1) 0%,var(--accent2) 100%);color:white;border:none;padding:0.875rem;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform 0.2s,box-shadow 0.2s}.auth-modal button[type="submit"]:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl)}.toggle-auth{text-align:center;margin-top:1.5rem;color:var(--text2);font-size:0.95rem}.toggle-auth a{font-weight:600;margin-left:0.25rem}.pings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;margin-top:1rem}.ping-card{background:var(--bg2);border:1px solid var(--border1);border-radius:6px;padding:1rem;transition:transform 0.2s,box-shadow 0.2s}.ping-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.ping-card-header{display:flex;align-items:center;margin-bottom:0.75rem;padding-bottom:0.75rem;border-bottom:1px solid var(--border1);position:relative}.flag{font-size:1.5rem;margin-right:0.5rem}.ping-card-title{font-weight:600;color:var(--text1);font-size:0.9rem;flex:1}.ping-indicator{width:8px;height:8px;border-radius:50%;background:#a3be8c;margin-left:0.5rem;opacity:0;transition:opacity 1.5s ease-out}.ping-indicator.active{opacity:1;transition:opacity 0.2s ease-in;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.5;transform:scale(1.2)}}.ping-card-stats{display:flex;flex-direction:column;gap:0.5rem}.ping-stat{display:flex;justify-content:space-between;align-items:center}.ping-stat-label{color:var(--text2);font-size:0.85rem}.ping-stat-value{font-weight:600;font-size:0.9rem}.latency-good{color:var(--success)}.latency-ok{color:var(--warning)}.latency-bad{color:var(--error)}.loading{text-align:center;padding:2rem;color:var(--text2)}.hide{display:none !important}.show{display:block !important}.logged-in{display:flex !important}.hero{text-align:center;padding:4rem 2rem;background:var(--bg2);border-radius:12px;box-shadow:var(--shadow-md);margin-bottom:3rem}.hero h1{font-size:3rem;margin:0 0 1rem 0;background:linear-gradient(135deg,var(--accent1) 0%,var(--accent2) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero p{font-size:1.25rem;color:var(--text2);margin:0 0 2rem 0}.cta-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl)}.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-bottom:3rem}.feature-card{background:var(--bg2);padding:2rem;border-radius:12px;box-shadow:var(--shadow-md);transition:transform 0.2s}.feature-card:hover{transform:translateY(-4px)}.feature-icon{font-size:3rem;margin-bottom:1rem}.feature-card h3{color:var(--text1);margin:0 0 0.5rem 0;font-size:1.5rem}.feature-card p{color:var(--text2);margin:0;line-height:1.6}.pings-container{max-width:1400px;width:calc(100% - 4rem);margin:2rem auto;padding:0 2rem;flex:1 0 auto}.pings-header{display:flex;flex-direction:column;margin-bottom:2rem;gap:0.5rem}.pings-header h1{color:var(--text1);margin:0}.group-title-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.copy-link-btn{background:var(--accent2);color:var(--text1);border:none;padding:0.5rem 1rem;border-radius:6px;cursor:pointer;font-size:0.9rem;transition:background 200ms ease-in}.copy-link-btn:hover{background:var(--accent1)}.copy-toast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%);background:var(--success);color:var(--bg1);padding:0.75rem 1.5rem;border-radius:6px;font-weight:500;z-index:1000;animation:fadeInOut 2s ease-in-out}@keyframes fadeInOut{0%{opacity:0;transform:translateX(-50%) translateY(10px)}15%{opacity:1;transform:translateX(-50%) translateY(0)}85%{opacity:1;transform:translateX(-50%) translateY(0)}100%{opacity:0;transform:translateX(-50%) translateY(-10px)}}.pings-header button{background:transparent;border:none;font-size:1.5rem;cursor:pointer;padding:0.5rem;opacity:0.6;transition:opacity 0.2s,transform 0.2s}.pings-header button:hover{opacity:1;transform:scale(1.1);background:transparent}.participant-name-section{display:flex;align-items:center;gap:0.5rem;margin-bottom:1rem;padding:0.75rem;background:var(--bg3);border-radius:6px}.participant-name-section button{background:transparent;border:none;font-size:1.2rem;cursor:pointer;padding:0.25rem;opacity:0.6;transition:opacity 0.2s,transform 0.2s}.participant-name-section button:hover{opacity:1;transform:scale(1.1);background:transparent}.editable-text{cursor:pointer;transition:border-color 200ms ease-in,color 200ms ease-in;padding:2px 4px;border-radius:4px;border:1px solid transparent}.editable-text:hover{border-color:var(--accent1);color:var(--accent1)}.inline-edit-input{border:2px solid var(--accent1);border-radius:4px;padding:0.25rem 0.5rem;outline:none;background:var(--bg2)}.inline-edit-input:focus{border-color:var(--accent1-hover);box-shadow:0 0 0 3px #434c5e}.pings-table-container{background:var(--bg2);padding:2rem;border-radius:8px;box-shadow:var(--shadow-sm);margin-bottom:2rem}.testing-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.testing-header h2{margin:0}.toggle-btn{background:transparent;border:none;font-size:1.5rem;cursor:pointer;padding:0.5rem;color:var(--accent1);transition:transform 0.2s}.toggle-btn:hover{transform:scale(1.1);background:transparent}.testing-content{display:block;transition:all 0.3s ease}.status-text{color:var(--text2);font-size:0.9rem;margin-left:1rem}.results-container{background:var(--bg2);padding:2rem;border-radius:8px;box-shadow:var(--shadow-sm);margin-bottom:2rem}.results-container>h2{margin-bottom:1.5rem}.participants-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem}.best-location-note{background:var(--success-bg);border:1px solid var(--success);border-radius:8px;padding:1rem 1.25rem;margin-bottom:1.5rem;color:var(--success);font-size:1rem;text-align:center}.participant-card{background:var(--bg2);border:1px solid var(--border1);border-radius:6px;padding:1.5rem}.participant-card.current-user{border:2px solid var(--accent1);background:#434c5e}.participant-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.my-groups-section{max-width:1200px;margin:3rem auto;padding:2rem;background:var(--bg2);border-radius:12px;box-shadow:var(--shadow-md)}.my-groups-section h2{margin-bottom:1.5rem;color:var(--text1)}.groups-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.group-card{background:var(--bg2);border:1px solid var(--border1);border-radius:8px;padding:1.5rem;transition:transform 0.2s,box-shadow 0.2s}.group-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.group-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.group-card-header h3{font-size:1.25rem;color:var(--text1);margin:0}.owner-badge{background:var(--accent1);color:white;padding:0.25rem 0.75rem;border-radius:12px;font-size:0.75rem;font-weight:600}.group-info{color:var(--text2);font-size:0.9rem;margin:0.5rem 0}.group-actions{display:flex;gap:0.5rem;margin-top:1rem}.group-btn{flex:1;padding:0.5rem 1rem;border:none;border-radius:6px;cursor:pointer;font-size:0.9rem;transition:all 0.2s}.group-btn.primary{background:var(--accent1);color:white}.group-btn.primary:hover{background:var(--accent1-hover)}.group-btn.secondary{background:var(--bg3);color:var(--text2)}.group-btn.secondary:hover{background:var(--border1)}.owner-controls{background:var(--warning-bg);border:1px solid var(--warning-border);border-radius:8px;padding:1.5rem;margin-bottom:2rem}.owner-controls h3{margin-bottom:1rem;color:var(--warning)}#claimOwnershipBtn{margin-bottom:0.5rem}.kick-btn{background:var(--error);color:white;border:none;padding:0.25rem 0.75rem;border-radius:4px;font-size:0.8rem;cursor:pointer;transition:background 0.2s}.kick-btn:hover{background:var(--error)}.activity-log-container{background:var(--bg2);border-radius:12px;padding:1.5rem;margin-bottom:2rem;box-shadow:var(--shadow-md)}.activity-log-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.activity-log-header h3{margin:0;color:var(--text1)}.activity-log-list{display:flex;flex-direction:column;gap:0.75rem}.activity-log-item{padding:0.75rem;background:var(--bg3);border-radius:6px;border-left:3px solid var(--accent1)}.activity-log-message{color:var(--text1);font-size:0.9rem;margin-bottom:0.25rem}.activity-log-time{color:var(--text2);font-size:0.8rem}.activity-log-empty{text-align:center;color:var(--text3);padding:1rem;font-style:italic}.oauth-buttons{display:flex;flex-direction:column;gap:0.75rem}.oauth-btn{display:flex;align-items:center;justify-content:center;gap:0.75rem;width:100%;padding:0.875rem 1rem;border:1px solid var(--border2);border-radius:6px;background:var(--bg2);color:var(--text1);font-size:0.95rem;font-weight:500;cursor:pointer;transition:all 0.2s}.oauth-btn:hover{background:var(--bg3);border-color:var(--border1);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.oauth-btn svg{flex-shrink:0}.oauth-btn.google:hover{border-color:#4285F4;background:rgba(66,133,244,0.1)}.oauth-btn.discord:hover{border-color:#5865F2;background:rgba(88,101,242,0.1)}.oauth-btn.steam:hover{border-color:#171A21;background:rgba(23,26,33,0.1)}