*{box-sizing:border-box}
html{min-height:100%;background:#182f55 url("data:image/gif;base64,R0lGODlhAgACAIAAABgvVSo8aSH5BAAAAAAALAAAAAACAAIAAAIDhI9WADs=");scrollbar-gutter:stable}
body{margin:0;color:#111;background:transparent;font:11px Tahoma,Verdana,Arial,sans-serif}
.page{width:960px;max-width:calc(100vw - 12px);margin:12px auto;overflow:hidden;background:#d8e2f0;border:1px solid #071b3a;box-shadow:0 0 0 1px #89a7ca,0 5px 22px #07152d}
.top{height:102px;position:relative;overflow:hidden;padding:15px 20px;color:#fff;background:linear-gradient(#5fa9eb 0,#1266b4 47%,#06478f 48%,#0a3971 100%);border-bottom:1px solid #001f48}
.top:after{content:"";position:absolute;right:28px;top:-72px;width:260px;height:210px;border:18px solid rgba(255,255,255,.1);border-radius:50%}
.brand{position:relative;z-index:1;font:bold 27px "Trebuchet MS",Tahoma,sans-serif;letter-spacing:-1px;text-shadow:1px 2px #06396e}
.brand b{color:#ffcb27}
.subtitle{position:relative;z-index:1;margin-top:3px;color:#cfeaff;font-size:10px;letter-spacing:.08em}
.version{position:absolute;right:16px;bottom:12px;z-index:2;padding:3px 7px;color:#d5eaff;background:#063669;border:1px solid #77b6ec}
.nav{display:grid;grid-template-columns:62px 85px 135px minmax(145px,168px) minmax(100px,112px) 92px 104px;min-height:29px;padding-left:12px;overflow:hidden;background:linear-gradient(#fdfdfd,#aebdce);border-top:1px solid #fff;border-bottom:1px solid #657b96}
.nav a{display:block;padding:7px 5px 6px;color:#103a69;text-align:center;text-decoration:none;font-weight:bold;white-space:nowrap;border-left:1px solid #fff;border-right:1px solid #91a2b6}
.nav a:hover,.nav a.active{color:#fff;background:linear-gradient(#5d9fe0,#1760a7)}
.dota-tabs{display:flex;min-height:30px;padding-left:8px;background:#d8e2f0;border-bottom:1px solid #7189a3}
.dota-tabs a{min-width:110px;padding:8px 14px 7px;color:#174f8b;text-align:center;text-decoration:none;font-weight:bold;border-right:1px solid #9eb0c2}
.dota-tabs a:hover,.dota-tabs a.active{color:#fff;background:linear-gradient(#5d9fe0,#1760a7)}
.ticker{padding:5px 12px;color:#223b55;background:#fffbd0;border-bottom:1px solid #d0c881}
.ticker b{color:#b21b10}
.panel{margin:8px;border:1px solid #7189a3;background:#f5f7fa}
.panel h1,.section-title{margin:0;padding:7px 10px;color:#fff;text-align:center;background:linear-gradient(#609cd7,#28649f);border-bottom:1px solid #0c3d70;font:bold 15px "Trebuchet MS",Tahoma,sans-serif;text-shadow:1px 1px #184d80}
.players{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;padding:1px;background:#b9c7d5}
.player-card{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:11px;min-height:88px;padding:8px;color:#174f8b;background:#fff;text-decoration:none}
.player-card:nth-child(4n+3),.player-card:nth-child(4n+4){background:#eef3f8}
.player-card:hover,.player-card:focus{position:relative;z-index:1;outline:2px solid #2f72b3;background:#e1edf7}
.player-card img{width:72px;height:72px;object-fit:cover;border:1px solid #7189a3}
.player-card strong{display:block;overflow:hidden;font:bold 13px Tahoma,Verdana,Arial,sans-serif;text-overflow:ellipsis;white-space:nowrap}
.player-card small{display:block;margin-top:5px;color:#667789;font-size:9px}
.foot{display:flex;justify-content:space-between;padding:7px 12px;color:#d8e9fb;background:#173d68;border-top:1px solid #fff;font:9px "Courier New",monospace}
.player-head{display:grid;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px;background:#fff;border-bottom:1px solid #9fb2c5}
.player-head img{width:72px;height:72px;object-fit:cover;border:1px solid #7189a3}
.player-profile-name{display:block;overflow:hidden;color:#174f8b;font:bold 13px Tahoma,Verdana,Arial,sans-serif;text-overflow:ellipsis;white-space:nowrap}
.player-head p{margin:4px 0 0;color:#667789}
.player-head .count{color:#174f8b;text-align:right;font:bold 12px Tahoma,Verdana,Arial,sans-serif}
.latest{padding:8px;background:#eef3f8;border-bottom:1px solid #7189a3}
.latest a{display:grid;grid-template-columns:105px 1fr 80px 90px;align-items:center;gap:8px;color:#174f8b;text-decoration:none}
.latest strong{font-size:13px}.latest .result,.history .result{font-weight:bold;text-align:center}.win{color:#18812b}.loss{color:#b6241b}
.history-list{display:block;padding:3px;background:#fff}
.latest-list{border-bottom:1px solid #aebdca}
.history-match{display:grid;grid-template-columns:137px 164px minmax(108px,1fr) 68px 58px 50px 52px;align-items:center;gap:3px;width:100%;margin-bottom:2px;padding:3px 5px;color:#174f8b;background:#eef3f8;border:1px solid #aebdca;text-decoration:none}
.history-match:last-child{margin-bottom:0}
.history-match.history-win{color:#145c1e;background:#eff8e9;border-left:4px solid #2e8b2e}
.history-match.history-loss{color:#8b2119;background:#fff0ee;border-left:4px solid #b13a2f}
.history-match.history-unknown{color:#52687d;background:#eef3f8;border-left:4px solid #7f91a3}
.history-match:hover{filter:brightness(.97)}
.history-match strong{font-family:"Courier New",monospace}
.history-hero{display:flex;align-items:center;gap:5px;min-width:0;font-weight:bold}
.history-hero img{width:38px;height:22px;flex:none;object-fit:cover;border:1px solid #73869a;background:#151a20}
.history-hero span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.history-mode,.history-duration,.history-result,.history-score{text-align:center}
.history-mode{font-weight:bold}
.history-result{font-weight:900}
.history-match small{color:inherit}
.state{padding:28px;color:#667789;text-align:center;background:#fff}
@media(max-width:720px){.page{max-width:calc(100% - 8px);margin:4px auto}.top{height:90px}.brand{font-size:22px}.version{display:none}.nav{grid-template-columns:1fr 1fr;padding-left:0}.nav a{white-space:normal}.nav a:last-child{grid-column:1/-1}.players{grid-template-columns:1fr}.player-card:nth-child(odd){background:#fff}.player-card:nth-child(even){background:#eef3f8}.player-head{grid-template-columns:58px 1fr}.player-head img{width:58px;height:58px}.player-head .count{grid-column:1/-1;text-align:left}.history-match{grid-template-columns:1fr auto}.history-match time{grid-column:auto}}
