:root{--primary:#0f4c81;--emerald:#0b8f5a;--gold:#f4c95d;--gold-deep:#b98a1e;--orange:#f78c3d;--coral:#e45757;--white:#fff;--bg:#fffbf2;--text:#1d2939;--text-muted:#667085;--pookalam:#ffd54f;--lotus:#f48fb1;--leaf:#2e7d32;--coconut:#8d6e63;--glass-bg:#ffffffa6;--glass-border:#ffffff4d;--glass-edge:#fff9;--shadow:0 18px 40px #0f4c8114;--shadow-lg:0 18px 40px #0f4c8138;--green-live:var(--emerald);--border:#0f4c8124;--radius:18px;--gap:clamp(12px, 1.4vw, 22px);--font-body:"Poppins", system-ui, -apple-system, sans-serif;--font-display:"Playfair Display", Georgia, serif}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{min-height:100vh;font-family:var(--font-body);color:var(--text);background:radial-gradient(1000px 600px at 90% -10%, color-mix(in srgb, var(--gold) 35%, transparent), transparent 60%), radial-gradient(800px 500px at -10% 110%, color-mix(in srgb, var(--primary) 10%, transparent), transparent 60%), radial-gradient(700px 420px at 105% 100%, color-mix(in srgb, var(--lotus) 18%, transparent), transparent 60%), var(--bg);-webkit-font-smoothing:antialiased;background-attachment:fixed;margin:0}body:before{content:"";pointer-events:none;opacity:.5;z-index:0;background-image:radial-gradient(circle,#0f4c8112 1px,#0000 1.7px);background-size:26px 26px;position:fixed;inset:0}.app:before{content:"";background:linear-gradient(90deg, var(--primary), var(--gold), var(--coral), var(--emerald), var(--orange), var(--pookalam), var(--primary));z-index:5;height:4px;position:fixed;top:0;left:0;right:0}.app-decor{pointer-events:none;z-index:0;background:radial-gradient(460px 360px at 60% 85%, color-mix(in srgb, var(--lotus) 22%, transparent), transparent 70%), radial-gradient(400px 320px at 6% 50%, color-mix(in srgb, var(--orange) 18%, transparent), transparent 70%), radial-gradient(520px 420px at 40% 5%, color-mix(in srgb, var(--gold) 18%, transparent), transparent 70%);position:fixed;inset:0;overflow:hidden}.app-decor:before,.app-decor:after{content:"";border:2px dashed #f4c95d59;border-radius:50%;position:absolute}.app-decor:before{width:480px;height:480px;top:-240px;right:-160px}.app-decor:after{border-color:#0f4c8129;width:600px;height:600px;bottom:-320px;left:-260px}.app{height:100dvh;position:relative;overflow:hidden}.app-content{z-index:1;gap:var(--gap);flex-direction:column;height:100%;padding:clamp(14px,2.4vh,28px) clamp(16px,3vw,44px) clamp(10px,1.6vh,20px);display:flex;position:relative}button{font-family:inherit}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.header{flex-shrink:0}.header-top{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:18px;display:flex}.brand{align-items:flex-start;gap:14px;display:flex}.brand-title{font-family:var(--font-display);letter-spacing:.2px;background:linear-gradient(120deg, var(--primary), var(--emerald) 48%, var(--orange));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(26px,3.2vw,52px);font-weight:800;line-height:1.12}.brand-subtitle{color:var(--text-muted);max-width:560px;margin:8px 0 0;font-size:clamp(12px,1vw,16px);line-height:1.6}.header-meta{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.live-badge{color:var(--emerald);letter-spacing:1.4px;background:#0b8f5a1f;border:1px solid #0b8f5a66;border-radius:999px;align-items:center;gap:7px;padding:6px 12px;font-size:11.5px;font-weight:700;display:inline-flex}.live-dot{background:var(--green-live);border-radius:50%;width:8px;height:8px;animation:1.8s ease-out infinite pulse}@keyframes pulse{0%{box-shadow:0 0 #0b8f5a80}70%{box-shadow:0 0 0 9px #0b8f5a00}to{box-shadow:0 0 #0b8f5a00}}.updated-at{color:var(--text-muted);align-items:center;gap:6px;font-size:12px;display:inline-flex}.refresh-btn{background:var(--glass-bg);border:1px solid var(--glass-border);width:40px;height:40px;color:var(--primary);box-shadow:inset 0 1px 0 var(--glass-edge), 0 6px 16px #0f4c8114;cursor:pointer;border-radius:50%;place-items:center;transition:background .15s,transform .15s,border-color .15s;display:grid}.refresh-btn:hover:not(:disabled){background:var(--white);border-color:#0f4c814d;transform:scale(1.06)}.refresh-btn:disabled{opacity:.7;cursor:default}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.mock-banner,.error-banner{flex-shrink:0}.mock-banner{color:var(--text);background:#f4c95d3d;border:1px solid #c99e2880;border-radius:12px;align-items:flex-start;gap:10px;padding:10px 14px;font-size:13px;line-height:1.55;display:flex}.mock-banner-icon{color:var(--gold-deep);flex-shrink:0;margin-top:2px}.mock-banner p{margin:0}.mock-banner code{color:var(--primary);background:#ffffffbf;border-radius:5px;padding:1px 6px;font-size:12px}.error-banner{color:#b0403a;background:#e457571a;border:1px solid #e4575766;border-radius:12px;align-items:center;gap:10px;padding:10px 14px;font-size:13.5px;display:flex}.error-banner button{color:#b0403a;cursor:pointer;background:#e4575729;border:1px solid #e4575780;border-radius:8px;margin-left:auto;padding:6px 12px;font-size:12.5px;font-weight:600;transition:background .15s}.error-banner button:hover{background:#e4575742}.stats{gap:var(--gap);flex-shrink:0;grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.stat-card{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 var(--glass-edge), var(--shadow);border-radius:14px;align-items:center;gap:12px;padding:clamp(10px,1.2vh,16px) 16px;transition:transform .18s,border-color .18s;display:flex}.stat-card:hover{border-color:#0f4c8140;transform:translateY(-2px)}.stat-icon{width:clamp(36px,3vw,48px);height:clamp(36px,3vw,48px);color:var(--primary);background:#0f4c811a;border-radius:12px;flex-shrink:0;place-items:center;display:grid}.stat-card:nth-child(2) .stat-icon{color:var(--emerald);background:#0b8f5a1f}.stat-card:nth-child(3) .stat-icon{color:var(--orange);background:#f78c3d24}.stat-value{color:var(--text);font-size:clamp(20px,2vw,32px);font-weight:700;line-height:1.15;display:block}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px;font-size:11.5px}.dash-grid{gap:var(--gap);flex:1;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1.25fr);min-height:0;display:grid}.dash-grid.is-searching{grid-template-columns:1fr}.podium{gap:var(--gap);grid-column:1/3;grid-template-rows:minmax(0,1fr) minmax(0,1fr);grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);min-height:0;display:grid}.podium-card{border-radius:var(--radius);border:1px solid var(--glass-border);background:radial-gradient(130% 100% at 50% 0%, #f4c95d33, transparent 62%), var(--glass-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:inset 0 1px 0 var(--glass-edge), var(--shadow);min-height:0;animation:.5s both pop;animation-delay:calc(var(--i) * .11s);transition:transform .2s,border-color .2s,box-shadow .2s;position:relative;overflow:hidden}.podium-card:hover{border-color:#0f4c814d;transform:translateY(-3px)}.podium-first{background:radial-gradient(130% 100% at 50% 0%, #f4c95d47, transparent 62%), var(--glass-bg);border-color:#d4a4288c;grid-row:1/3;min-height:0}.podium-second{background:radial-gradient(130% 100% at 50% 0%, #0f4c811f, transparent 62%), var(--glass-bg);border-color:#0f4c8159}.podium-third{background:radial-gradient(130% 100% at 50% 0%, #8d6e6329, transparent 62%), var(--glass-bg);border-color:#8d6e6380}.podium-photo{place-items:center;display:grid;position:absolute;inset:0;overflow:hidden}.podium-photo .portrait-card{object-fit:cover;width:100%;height:100%;transition:transform .5s;position:static}.podium-card:hover .podium-photo .portrait-card{transform:scale(1.04)}.podium-shade{pointer-events:none;background:linear-gradient(#fff9 0%,#fff0 32% 50%,#fffbf2f0 100%);position:absolute;inset:0}.podium-top{z-index:1;align-items:center;gap:8px;display:flex;position:absolute;top:clamp(12px,1.6vh,18px);left:clamp(12px,1.4vw,18px);right:clamp(12px,1.4vw,18px)}.podium-medal{filter:drop-shadow(0 2px 6px #0f4c8140);font-size:clamp(26px,2.6vw,44px);line-height:1}.podium-label{text-transform:uppercase;letter-spacing:1.2px;color:var(--primary);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffc7;border:1px solid #ffffffd9;border-radius:999px;padding:5px 12px;font-size:clamp(11px,1vw,15px);font-weight:700;box-shadow:0 2px 10px #0f4c811a}.podium-crown{font-size:clamp(18px,1.8vw,30px);animation:2.4s ease-in-out infinite bob}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.podium-info{z-index:1;flex-direction:column;gap:10px;display:flex;position:absolute;bottom:clamp(14px,1.8vh,20px);left:clamp(14px,1.6vw,20px);right:clamp(14px,1.6vw,20px)}.podium-name{font-family:var(--font-display);color:var(--text);text-shadow:0 1px #ffffffd9,0 2px 12px #fffffff2;margin:0;font-size:clamp(20px,2vw,36px);font-weight:800}.podium-foot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.avatar{width:clamp(40px,3.4vw,56px);height:clamp(40px,3.4vw,56px);color:var(--white);background:linear-gradient(135deg, hsl(var(--avatar-hue) 62% 54%), hsl(calc(var(--avatar-hue) + 32) 62% 38%));-webkit-user-select:none;user-select:none;border-radius:50%;flex-shrink:0;place-items:center;font-size:clamp(16px,1.3vw,22px);font-weight:700;display:grid;box-shadow:inset 0 0 0 2px #ffffff8c,0 4px 10px #0f4c8124}.avatar-md{width:clamp(36px,3vw,48px);height:clamp(36px,3vw,48px);font-size:clamp(15px,1.1vw,19px)}.avatar-lg{width:66px;height:66px;font-size:26px}.avatar-photo{object-fit:cover;display:block}.portrait-fallback{color:var(--white);background:linear-gradient(135deg, hsl(var(--avatar-hue) 62% 54%), hsl(calc(var(--avatar-hue) + 32) 62% 38%));place-items:center;font-size:clamp(44px,6vw,84px);font-weight:800;display:grid}.code-chip{color:var(--primary);letter-spacing:.5px;cursor:pointer;background:#ffffffa6;border:1px dashed #0f4c8166;border-radius:999px;align-items:center;gap:6px;padding:4px 11px;font-size:12px;font-weight:600;transition:background .15s,transform .15s,border-color .15s;display:inline-flex}.code-chip:hover{background:var(--white);border-color:#0f4c81b3;transform:translateY(-1px)}.code-chip-sm{padding:3px 9px;font-size:11px}.code-label{text-transform:uppercase;letter-spacing:1px;color:var(--primary);opacity:.8;font-size:9.5px}.copied-icon{color:var(--leaf)}.score-badge{color:var(--white);background:linear-gradient(135deg,#e45757,#c23c3c);border-radius:999px;flex-shrink:0;align-items:baseline;gap:4px;padding:6px 14px;font-size:13px;font-weight:700;display:inline-flex;box-shadow:0 6px 14px #e4575759}.score-lg{padding:7px 16px;font-size:clamp(14px,1.3vw,19px)}.score-num{text-align:right;min-width:18px;font-size:15px}.score-unit{text-transform:uppercase;letter-spacing:.6px;opacity:.85;font-size:10.5px;font-weight:600}.leaderboard{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);min-height:0;box-shadow:inset 0 1px 0 var(--glass-edge), var(--shadow);flex-direction:column;grid-column:3;display:flex;overflow:hidden}.is-searching .leaderboard{grid-column:1/-1}.list-panel-head{flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;padding:clamp(12px,1.6vh,18px) 18px 0;display:flex}.list-panel-title{font-family:var(--font-display);color:var(--primary);text-transform:uppercase;letter-spacing:1px;align-items:center;gap:8px;margin:0;font-size:clamp(16px,1.5vw,24px);font-weight:800;display:inline-flex}.list-panel-title svg{color:var(--orange)}.list-count{color:var(--text-muted);white-space:nowrap;font-size:12px}.list-toolbar{flex-shrink:0;align-items:center;gap:12px;padding:12px 18px 10px;display:flex}.search-wrap{flex:1;min-width:0;max-width:340px;position:relative}.search-wrap input{border:1px solid var(--border);width:100%;color:var(--text);background:#ffffffb3;border-radius:12px;outline:none;padding:10px 36px;font-family:inherit;font-size:13.5px;transition:border-color .15s,background .15s,box-shadow .15s}.search-wrap input::placeholder{color:#667085a6}.search-wrap input:focus{background:var(--white);border-color:#0f4c8180;box-shadow:0 0 0 3px #0f4c8114}.search-icon{color:var(--text-muted);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.clear-search{width:24px;height:24px;color:var(--text-muted);cursor:pointer;background:#0f4c8114;border:none;border-radius:50%;font-size:12px;line-height:1;transition:background .15s,color .15s;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.clear-search:hover{color:var(--text);background:#0f4c8129}.list-wrap{flex:1;min-height:0;padding:2px 10px clamp(8px,1.4vh,14px);overflow-y:auto}.list-wrap::-webkit-scrollbar{width:8px}.list-wrap::-webkit-scrollbar-thumb{background:#0f4c8138;border-radius:999px}.list-wrap::-webkit-scrollbar-track{background:0 0}.list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.row{animation:.4s both rise;animation-delay:calc(var(--i) * 35ms);background:#ffffff8c;border:1px solid #ffffffa6;border-radius:13px;align-items:center;gap:12px;padding:clamp(9px,1vh,13px) 12px;transition:transform .18s,background .18s,border-color .18s,box-shadow .18s;display:flex}.row:hover{background:#ffffffe6;border-color:#0f4c8133;transform:translateY(-2px);box-shadow:0 8px 22px #0f4c8114}.row.rank-1{background:linear-gradient(90deg,#f4c95d4d,#f4c95d1a 55%,#0000);border-color:#c99e288c}.row.rank-2{background:linear-gradient(90deg,#0f4c811f,#0f4c810a 55%,#0000);border-color:#0f4c8138}.row.rank-3{background:linear-gradient(90deg,#8d6e632e,#8d6e630f 55%,#0000);border-color:#8d6e6359}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes pop{0%{opacity:0;transform:translateY(16px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.row-rank{text-align:center;flex-shrink:0;width:34px}.row-rank .medal{font-size:21px;line-height:1;display:block}.rank-num{border:1px solid var(--border);width:30px;height:30px;color:var(--text-muted);background:#ffffffbf;border-radius:50%;place-items:center;margin:0 auto;font-size:13px;font-weight:700;display:grid}.row-main{flex-direction:column;gap:5px;min-width:0;display:flex}.row-name{color:var(--text);white-space:nowrap;text-overflow:ellipsis;font-size:clamp(13px,1.1vw,18px);font-weight:600;overflow:hidden}.row .score-badge{margin-left:auto}.empty-state{text-align:center;color:var(--text-muted);background:#ffffff73;border:1px dashed #0f4c8147;border-radius:14px;margin:8px 8px 0;padding:48px 20px}.empty-state svg{color:var(--orange);opacity:.75;margin-bottom:10px}.empty-state p{margin:0;font-size:13.5px}.simulate-btn{color:var(--leaf);cursor:pointer;background:#2e7d321a;border:1px dashed #2e7d3280;border-radius:10px;align-items:center;gap:8px;margin:0 auto;padding:9px 16px;font-size:13px;font-weight:600;transition:background .15s,transform .15s;display:flex}.simulate-btn:hover{background:#2e7d322e;transform:translateY(-1px)}.skeleton{flex-direction:column;flex:1;gap:14px;min-height:0;display:flex}.skeleton-stats{border-radius:14px;flex-shrink:0;height:clamp(54px,7vh,76px)}.skeleton-rows{flex-direction:column;flex:1;gap:10px;display:flex}.skeleton-row{border-radius:14px;flex:1}.skeleton-stats,.skeleton-row{background:linear-gradient(90deg,#0f4c810d,#0f4c8121,#0f4c810d) 0 0/200% 100%;animation:1.4s infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.toast{background:var(--text);color:var(--white);box-shadow:var(--shadow-lg);z-index:50;text-align:center;border:1px solid #ffffff29;border-radius:999px;max-width:min(90vw,420px);padding:10px 18px;font-size:13.5px;font-weight:500;animation:.25s toast-in;position:fixed;bottom:26px;left:50%;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}.footer{z-index:1;text-align:center;color:#66708599;flex-shrink:0;font-size:clamp(11px,.9vw,14px);position:relative}@media (width<=980px){.app{height:auto;overflow:visible}.app-content{height:auto;padding:20px 16px 16px}.stats,.dash-grid,.dash-grid.is-searching{grid-template-columns:1fr}.podium{grid-column:auto;grid-template-rows:auto;grid-template-columns:1fr}.podium-first{grid-row:auto;min-height:320px}.podium-second,.podium-third{min-height:240px}.leaderboard,.is-searching .leaderboard{grid-column:auto;min-height:420px}.header-top{flex-direction:column}.brand-subtitle{font-size:13px}.row{gap:10px;padding:11px 12px}.row-name{font-size:13.5px}.row-rank{width:28px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
