:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f0f4ff;background-color:#090b14;--surface: #141825;--surface-alt: #0f121d;--border: rgba(255, 255, 255, .06);--color-t: #f7a545;--color-ct: #5fa9f7}body{margin:0;min-height:100vh;background:#090b14;color:#f0f4ff}a{color:inherit}*{box-sizing:border-box}#root{min-height:100vh}.app-shell{display:flex;min-height:100vh;flex-direction:column}.app-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background:#0f121d;border-bottom:1px solid rgba(255,255,255,.05)}.app-content{flex:1;padding:1.5rem 2rem 3rem}.button{background:linear-gradient(120deg,#2d5bff,#5c7cfe);color:#fff;border:none;border-radius:6px;padding:.6rem 1rem;font-size:.95rem;cursor:pointer;transition:opacity .2s}.button:hover{opacity:.9}.button.secondary{background:#ffffff1a}.card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:1.5rem;box-shadow:0 15px 45px #00000059}.grid{display:grid;gap:1rem}.match-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem}.match-card{display:flex;flex-direction:row;overflow:hidden;padding:0;position:relative}@keyframes pulse-highlight{0%,to{box-shadow:0 0 15px #ff98004d}50%{box-shadow:0 0 25px #ff980080}}.match-thumbnail{width:140px;height:140px;object-fit:cover;flex-shrink:0}.match-card-content{padding:1rem;display:flex;flex-direction:column;justify-content:space-between;flex:1}.match-card-content h3{font-size:1rem;margin-bottom:.5rem}.match-card-content p{margin:.25rem 0;font-size:.85rem}.timeline{display:flex;align-items:center;gap:1rem;background:#0d111d;padding:.6rem 1rem;border-radius:10px;border:1px solid var(--border)}.timeline input[type=range]{flex:1}.radar-wrapper{position:relative;width:100%;height:100%;border-radius:16px;overflow:hidden;background-color:#19171e;background-size:contain;background-repeat:no-repeat;background-position:center}.radar-wrapper canvas{width:100%;height:100%;display:block}.controls-row{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}.controls-row.wrap{justify-content:space-between}.stats-table{width:100%;border-collapse:collapse;font-size:.9rem}.stats-table th,.stats-table td{padding:.4rem .6rem;text-align:center}.stats-table th{background:#ffffff0d}.stats-table tbody tr:nth-child(odd){background:#ffffff05}.viewer-fullscreen{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#19171e;overflow:hidden}.map-viewport{width:100%;height:100%;overflow:hidden;cursor:grab;touch-action:none;overscroll-behavior:contain}.map-viewport:active{cursor:grabbing}.map-content{width:100%;height:100%;transform-origin:0 0}.viewer-topbar{position:fixed;top:0;left:50%;transform:translate(-50%);height:50px;background:#090b14d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom-left-radius:12px;border-bottom-right-radius:12px;display:flex;align-items:center;gap:1.5rem;padding:0 2rem;z-index:100}.back-button{background:#ffffff1a;border:none;color:#fff;padding:.4rem .8rem;border-radius:6px;cursor:pointer;text-decoration:none;font-size:.9rem}.viewer-topbar h2{margin:0;font-size:1rem;font-weight:500}.round-info{font-size:.9rem;opacity:.7}.topbar-controls{display:flex;align-items:center;gap:.5rem;margin-left:auto}.play-button{background:#5c7cfe;border:none;color:#fff;padding:.4rem .8rem;border-radius:6px;cursor:pointer;font-size:1rem}.speed-select{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#fff;padding:.4rem .6rem;cursor:pointer;font-size:.85rem}.viewer-sidebar-left{position:fixed;top:10px;left:10px;bottom:120px;width:280px;z-index:60;display:flex;flex-direction:column;gap:.5rem;align-items:stretch}.viewer-sidebar-left .team-sidebar{flex:1;display:flex;flex-direction:column;gap:.5rem}.viewer-sidebar-left .team-block{flex:1;display:flex;flex-direction:column;min-height:0}.viewer-sidebar-left .team-block ul{flex:1;display:flex;flex-direction:column;gap:.25rem}.viewer-sidebar-left .team-block li{flex:1;min-height:0}.viewer-sidebar-left .player-hp-bar{min-height:40px;height:100%}.viewer-sidebar-right{position:fixed;top:10px;right:10px;width:auto;max-width:400px;z-index:50}.round-info-container{position:fixed;bottom:120px;right:20px;z-index:60;display:flex;flex-direction:column;gap:.5rem;align-items:stretch;width:200px}.round-controls-box{background:#090b14e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:.75rem;border:1px solid rgba(255,255,255,.1)}.round-controls-box .bottom-controls-grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;width:160px}.round-controls-box .toggle-btn{display:flex;align-items:center;justify-content:center;gap:.3rem;cursor:pointer;background:#ffffff14;padding:.5rem 0;border-radius:6px;transition:all .15s ease;border:1px solid rgba(255,255,255,.1);color:#fff9;font-size:.75rem;font-weight:500;width:100%}.round-controls-box .toggle-btn:hover{background:#ffffff1f;color:#ffffffd9}.round-controls-box .toggle-btn.active{background:#2d5bff59;border-color:#5c7cfe99;color:#fff;box-shadow:inset 0 1px 2px #0000004d,0 0 8px #5c7cfe4d}.round-controls-box .toggle-btn.active:hover{background:#2d5bff73}.hotkeys-hint-footer{display:flex;gap:.5rem;justify-content:center;font-size:.7rem;opacity:.5;padding:.3rem 0}.hotkeys-hint-footer span{background:#ffffff14;padding:.15rem .5rem;border-radius:4px}.round-info-box{background:#090b14e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:1rem 1.5rem;text-align:right;transition:background .3s ease,border .3s ease;border:2px solid transparent}.round-info-box.freezetime{background:#143c78e6;border-color:#6496ff80}.round-info-box.bomb-active{background:#781e14e6;border-color:#ff6450b3;animation:bomb-pulse 1s ease-in-out infinite}@keyframes bomb-pulse{0%,to{background:#781e14e6}50%{background:#b4321ef2}}.bomb-timer{color:#ff6b5b;text-shadow:0 0 10px rgba(255,100,80,.5)}.round-label{font-size:.75rem;opacity:.6;letter-spacing:.05em;margin-bottom:.25rem}.round-timer{font-size:2.5rem;font-weight:600;line-height:1;margin-bottom:.75rem}.playback-controls{display:flex;gap:.5rem;justify-content:flex-end}.playback-controls button{background:#ffffff1a;border:none;color:#fff;padding:.4rem .6rem;border-radius:6px;cursor:pointer;font-size:1rem}.viewer-bottombar{position:fixed;bottom:0;left:0;right:0;background:#090b14f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:.75rem 1rem .5rem;z-index:100;display:flex;flex-direction:column;gap:.5rem}.progress-bar{position:relative;height:4px;background:#ffffff1a;border-radius:2px;margin-bottom:.5rem}.progress-fill{height:10px;background:#5c7cfe;border-radius:2px;transition:width .1s}.timeline-slider{position:absolute;top:-6px;left:0;width:100%;height:16px;opacity:0;cursor:pointer}.bottom-controls{display:flex;gap:1.5rem;align-items:center;font-size:.85rem;padding:0 .5rem}.viewer-controls{display:flex;flex-direction:column;gap:.85rem}.round-track{display:grid;grid-template-columns:repeat(auto-fit,minmax(40px,1fr));gap:.35rem}.round-track button{background:#ffffff0d;border:1px solid rgba(255,255,255,.08);border-radius:8px;color:inherit;padding:.3rem 0;cursor:pointer;font-size:.8rem}.round-track button.active{border-color:#8be2c4;color:#8be2c4}.team-sidebar{display:flex;flex-direction:column;gap:.5rem}.team-block{background:#090b14f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:.75rem;border:1px solid rgba(255,255,255,.08)}.team-block header{display:flex;justify-content:space-between;font-weight:600;margin-bottom:.5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;opacity:.9}.team-block header span:last-child{font-size:1.2rem}.team-block ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.4rem}.team-block li{background:#ffffff0a;border-radius:8px;border:1px solid rgba(255,255,255,.05);transition:opacity .3s;overflow:hidden}.player-hp-bar{position:relative;width:100%;min-height:50px;background:#0000004d}.hp-bar-fill{position:absolute;top:0;left:0;height:100%;transition:width .3s ease;opacity:.7}.player-info-overlay{position:relative;z-index:1;padding:.5rem .65rem}.player-top-row{display:flex;align-items:center;gap:.5rem;font-size:.8rem;margin-bottom:.3rem}.player-bottom-row{display:flex;justify-content:space-between;align-items:center;gap:.5rem;font-size:.75rem}.player-weapon{flex-shrink:0}.weapon-icon-img{width:50px;height:20px;object-fit:contain;filter:brightness(0) invert(1);opacity:.9}.player-grenades{display:flex;gap:.2rem;align-items:center;flex-shrink:0}.grenade-slot{position:relative;display:inline-flex;align-items:center}.grenade-icon-img{width:16px;height:16px;filter:brightness(0) invert(1);opacity:.8}.grenade-count{position:absolute;bottom:-2px;right:-4px;font-size:.6rem;font-weight:700;background:#000000b3;padding:0 2px;border-radius:2px}.player-kda{font-size:.75rem;opacity:.7;white-space:nowrap}.player-hp-text{display:inline-flex;align-items:center;justify-content:center;min-width:32px;font-size:.85rem;font-weight:700}.player-name{font-weight:500;flex:1}.player-money{color:#71e3a4;font-size:.75rem;font-weight:600}.player-ammo{font-size:.75rem;opacity:.7;white-space:nowrap}.player-equipment{display:flex;gap:.35rem;align-items:center}.equipment-icon{font-size:.85rem;opacity:.7}.equipment-icon-img{width:16px;height:16px;filter:brightness(0) invert(1);opacity:.8}.equipment-icon-img.c4-icon{filter:brightness(0) saturate(100%) invert(70%) sepia(98%) saturate(1000%) hue-rotate(360deg) brightness(100%) contrast(100%);animation:pulse-c4 1.5s ease-in-out infinite}@keyframes pulse-c4{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}.team-block li.dead{opacity:.4}.team-block li.dead .hp-bar-fill{background:#6464644d!important}.kill-feed{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:1rem;min-width:300px}.stats-panel{grid-column:1 / span 3}.kill-feed ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.8rem}.kill-feed__row{display:flex;align-items:center;gap:.4rem;font-size:.85rem}.kill-feed__row .killer.t,.kill-feed__row .victim.t{color:var(--color-t)}.kill-feed__row .killer.ct,.kill-feed__row .victim.ct{color:var(--color-ct)}.kill-feed .weapon{font-size:.75rem;opacity:.8}.kill-feed .weapon-icon{width:40px;height:16px;object-fit:contain;filter:brightness(0) invert(1);opacity:.9}.kill-feed__placeholder{opacity:.5;font-size:.85rem}.badge{display:inline-flex;align-items:center;padding:.15rem .4rem;border-radius:999px;font-size:.7rem;background:#ffffff14}.badge-hs{background:#f693;border:1px solid rgba(255,102,153,.4)}.badge-icon{width:16px;height:16px;filter:brightness(0) invert(1);opacity:.9}@media (max-width: 1200px){.viewer-layout{grid-template-columns:1fr}.viewer-stage{grid-column:1}.radar-wrapper{width:100%;height:480px}.map-viewport{height:520px}}.stats-panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#0f121dfa;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:1.5rem;z-index:1000;max-width:90vw;max-height:80vh;overflow:auto;box-shadow:0 25px 80px #0009;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.stats-panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid rgba(255,255,255,.1)}.stats-panel-header h3{margin:0;font-size:1.1rem}.stats-panel-header .close-btn{background:none;border:none;color:#fff;font-size:1.2rem;cursor:pointer;opacity:.7;transition:opacity .2s;padding:.25rem .5rem}.stats-panel-header .close-btn:hover{opacity:1}.stats-table-mini{width:100%;border-collapse:collapse;font-size:.85rem}.stats-table-mini th,.stats-table-mini td{padding:.5rem .75rem;text-align:center}.stats-table-mini th{font-weight:600;opacity:.7;font-size:.75rem;text-transform:uppercase}.stats-table-mini td.player-name{text-align:left;font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stats-table-mini .ct-row{background:#5fa9f71a}.stats-table-mini .ct-row td.player-name{color:var(--color-ct)}.stats-table-mini .t-row{background:#f7a5451a}.stats-table-mini .t-row td.player-name{color:var(--color-t)}.stats-table-mini .team-separator td{height:8px;background:transparent;padding:0}.stats-legend{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1rem;padding-top:.75rem;border-top:1px solid rgba(255,255,255,.1);font-size:.7rem;opacity:.6}.stats-toggle{background:#ffffff14;border:1px solid transparent;color:#fff;padding:.35rem .6rem;border-radius:6px;cursor:pointer;font-size:.75rem;transition:all .2s}.stats-toggle:hover{background:#ffffff1f}.stats-toggle.active{background:#2d5bff40;border-color:#2d5bff66}.stats-toggle.active{background:#2d5bff4d;border-color:#2d5bff80}