.dashboard{color:#e5f6ff;background:radial-gradient(circle at 18% 24%,#14b8a629,#0000 28%),radial-gradient(circle at 82% 18%,#0ea5e947,#0000 32%),radial-gradient(circle at 50% 100%,#2563eb2e,#0000 46%),linear-gradient(135deg,#020617 0%,#05204a 48%,#020817 100%);min-height:100%;padding:14px 18px 18px;position:relative;overflow:hidden}.dashboard:before{pointer-events:none;content:"";background:linear-gradient(#38bdf812 1px,#0000 1px) 0 0/44px 44px,linear-gradient(90deg,#38bdf812 1px,#0000 1px) 0 0/44px 44px,radial-gradient(circle,#0000 0 58%,#0ea5e91f 59%,#0000 60%) 0 0/760px 760px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000000eb,#00000059);mask-image:linear-gradient(#000000eb,#00000059)}.dashboard:after{pointer-events:none;content:"";background:linear-gradient(90deg,#0ea5e92e,#0000 18% 82%,#0ea5e92e),linear-gradient(#7dd3fc24,#0000 22% 76%,#0ea5e91a);position:absolute;inset:0;box-shadow:inset 0 0 120px #0ea5e929}.dashboard__glow{filter:blur(84px);opacity:.26;pointer-events:none;border-radius:999px;width:460px;height:460px;position:absolute}.dashboard__glow--red{background:#0ea5e9;top:8%;left:-150px}.dashboard__glow--blue{background:#2563eb;bottom:4%;right:-150px}.dashboard-header,.dashboard-grid{z-index:2;position:relative}.dashboard-header{grid-template-columns:minmax(120px,1fr) auto minmax(120px,1fr);align-items:center;gap:18px;height:78px;margin-bottom:12px;padding:0 18px;display:grid}.dashboard-header h1{color:#ecfeff;letter-spacing:.12em;text-align:center;text-shadow:0 0 12px #7dd3fce0,0 0 30px #0ea5e99e;clip-path:polygon(7% 0,93% 0,100% 42%,94% 100%,6% 100%,0 42%);background:linear-gradient(90deg,#0000,#0ea5e938 18% 82%,#0000),linear-gradient(#0f172a1f,#0ea5e92e);min-width:520px;margin:0;padding:13px 56px 18px;font-size:clamp(28px,3vw,42px);font-weight:900;line-height:1;position:relative}.dashboard-header h1:after{content:"";background:linear-gradient(90deg,#0000,#38bdf8,#67e8f9,#38bdf8,#0000);height:2px;position:absolute;bottom:7px;left:48px;right:48px;box-shadow:0 0 18px #38bdf8e6}.dashboard-header__wing{background:linear-gradient(90deg,#0000,#0ea5e933,#0000);border-top:2px solid #38bdf894;border-bottom:1px solid #38bdf83d;height:26px}.dashboard-header__wing--left{clip-path:polygon(0 28%,88% 28%,100% 100%,0 100%)}.dashboard-header__wing--right{clip-path:polygon(12% 28%,100% 28%,100% 100%,0 100%)}.panel__eyebrow{color:#67e8f9;letter-spacing:.18em;text-transform:uppercase;align-items:center;font-size:11px;font-weight:800;display:inline-flex}.dashboard-grid{grid-template:"info section sankey"minmax(300px,35vh)"video video side"minmax(430px,calc(65vh - 50px))/1fr 1.05fr 1fr;gap:14px;height:calc(100vh - 122px);min-height:730px;display:grid}.grid-area{min-width:0;min-height:0}.grid-area--info{grid-area:info}.grid-area--section{grid-area:section}.grid-area--sankey{grid-area:sankey}.grid-area--video{grid-area:video}.grid-area--distribution,.grid-area--trajectory{min-height:0}.grid-area--distribution{grid-area:side;align-self:start;height:calc(50% - 7px)}.grid-area--trajectory{grid-area:side;align-self:end;height:calc(50% - 7px)}.panel{background:linear-gradient(135deg,#082f49bd,#0f172ae0),#020817d6;border:1px solid #38bdf861;border-radius:16px;height:100%;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff1f,inset 0 0 42px #0ea5e91f,0 0 28px #0ea5e91f,0 18px 50px #0000005c}.panel:before{pointer-events:none;content:"";background:linear-gradient(115deg,#ffffff14,#0000 28% 70%,#22d3ee1f),linear-gradient(#7dd3fc09 1px,#0000 1px) 0 0/100% 12px;position:absolute;inset:0}.panel__header{z-index:1;justify-content:space-between;align-items:flex-start;gap:16px;padding:15px 16px 0;display:flex;position:relative}.panel__header h2{color:#f8fafc;margin:5px 0 0;font-size:20px;line-height:1}.panel__corner{opacity:.9;border-top:2px solid #f97316;border-right:2px solid #f97316;width:42px;height:18px}.panel__body{z-index:1;height:calc(100% - 58px);padding:14px 16px 16px;position:relative}.trajectory-card .panel__body{flex-direction:column;min-height:0;display:flex}.match-card{flex-direction:column;display:flex}.match-card .panel__header{flex-shrink:0;padding-top:18px}.match-card .panel__header h2{color:#fff7ed;text-shadow:0 0 22px #facc1557;max-width:360px;margin-top:7px;font-size:clamp(16px,2.8vh,28px);line-height:1.08}.match-card .panel__body{flex-direction:column;flex:1;height:auto;min-height:0;padding-top:16px;display:flex}.match-summary{flex-direction:column;flex:1;min-height:0;display:flex}.players{flex:1;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:clamp(10px,2vh,20px);min-height:0;display:grid}.player{text-align:center;grid-template-rows:minmax(0,1fr) auto auto;place-items:center;gap:clamp(4px,1vh,8px);min-width:0;min-height:0;display:grid}.player__portrait{aspect-ratio:3/4;background:radial-gradient(circle at 35% 28%,#fef3c7,#dc2626 58%,#7f1d1d);border-radius:14px;justify-self:center;width:auto;max-width:min(100%,clamp(72px,11vw,128px));height:100%;min-height:0;position:relative;overflow:hidden;box-shadow:0 0 28px #ef444461,inset 0 0 0 2px #fee2e2b8}.player--blue .player__portrait{background:radial-gradient(circle at 35% 28%,#cffafe,#0284c7 58%,#075985);box-shadow:0 0 28px #38bdf861,inset 0 0 0 2px #cffafeb8}.player__portrait img{object-fit:cover;object-position:center top;width:100%;height:100%;display:block}.player__label{color:#94a3b8;letter-spacing:.06em;font-size:clamp(9px,1vh,11px);display:block}.player__name{color:#f8fafc;letter-spacing:.04em;text-shadow:0 2px 18px #0f172acc;margin-top:0;font-size:clamp(16px,2.4vh,26px);font-weight:900;line-height:1.05;display:block}.player--red .player__name{color:#fecaca;text-shadow:0 0 22px #ef44448c}.player--blue .player__name{color:#bae6fd;text-shadow:0 0 22px #38bdf88c}.match-score{flex-direction:column;justify-content:center;align-self:stretch;align-items:center;gap:clamp(2px,.6vh,4px);min-width:clamp(72px,12vw,88px);padding:clamp(6px,1.2vh,10px) 6px clamp(8px,1.4vh,14px);display:flex}.match-score__label{color:#fbbf24;letter-spacing:.14em;text-transform:uppercase;font-size:clamp(9px,1vh,11px);font-weight:800;display:block}.match-score__value{color:#fef3c7;letter-spacing:.06em;white-space:nowrap;text-shadow:0 0 28px #facc15b8,0 0 8px #facc1573;font-size:clamp(24px,4.5vh,42px);font-weight:900;line-height:1;display:block}.set-scores{background:linear-gradient(#14b8a633,#02061780);border-radius:999px;align-items:center;gap:10px;min-width:0;margin-top:0;padding:10px 12px;display:flex}.set-scores span{color:#67e8f9;letter-spacing:.08em;flex:none;font-size:11px;font-weight:800}.set-scores strong{color:#fff7ed;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:13px;line-height:1.2;display:block;overflow:hidden}.section-card .panel__body{flex-direction:column;min-height:0;display:flex}.phase-summary{flex-direction:column;flex:1;gap:10px;min-height:0;display:flex}.phase-player{border:1px solid color-mix(in srgb, var(--accent) 58%, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 16%, transparent), #02061770);border-radius:15px;flex-direction:column;flex:1;min-height:0;padding:10px 12px;display:flex}.phase-player__name{color:var(--accent);flex-shrink:0;margin-bottom:6px;font-size:clamp(14px,1.8vh,18px);font-weight:900}.phase-player .phase-grid{flex:1;align-items:stretch;min-height:0;margin-top:0}.phase-player .phase-grid--rates{flex:.85}.phase-player .phase-grid--header{flex:.65;font-size:clamp(8px,1vh,10px)}.phase-player .phase-grid span,.phase-player .phase-grid strong{justify-content:center;align-items:center;min-width:0;padding:3px 2px;line-height:1.15;display:flex;overflow:hidden}.phase-player .phase-grid strong{white-space:nowrap;font-size:clamp(9px,1.1vh,11px)}.phase-player .phase-grid--header span{white-space:nowrap;text-overflow:ellipsis}.phase-grid{grid-template-columns:minmax(52px,56px) repeat(6,minmax(0,1fr));align-items:center;gap:3px;margin-top:4px;font-size:clamp(9px,1.15vh,12px);display:grid}.phase-grid span,.phase-grid strong{text-align:center;background:#0f172a85;border-radius:8px;min-width:0;padding:4px 2px}.phase-grid--header span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.phase-grid--header{color:#cbd5e1;font-size:10px}.phase-grid--rates span,.phase-grid--rates strong{color:#fef9c3;background:#facc151f}.phase-grid__pair{grid-column:span 2}.phase-grid__label{white-space:nowrap;flex-shrink:0}.phase-player .phase-grid+.phase-grid{margin-top:4px}.technique-matrix{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:10px;display:grid}.technique-block{background:#02061759;border-radius:13px;min-height:0;padding:8px}.technique-block h3{color:#5eead4;margin:0 0 7px;font-size:13px}.technique-row{grid-template-columns:42px 1fr;align-items:center;gap:6px;margin-top:5px;font-size:10px;display:grid}.technique-row>span{color:#cbd5e1;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.technique-bar{background:#0f172ae6;border-radius:999px;height:13px;overflow:hidden}.technique-bar i{color:#082f49;text-align:right;background:linear-gradient(90deg,#22c55e,#facc15);min-width:2px;height:100%;padding-right:5px;font-size:9px;font-style:normal;line-height:13px;display:block}.sankey-stage{border:1px solid #7dd3fc29;border-radius:18px;height:calc(100% - 34px);min-height:210px;position:relative;overflow:hidden}.sankey-chart{width:100%;height:100%}.distribution-stage{background:0 0;border-radius:18px;height:100%;min-height:0;position:relative;overflow:hidden}.distribution-chart{width:100%;height:100%;background:0 0!important}.distribution-chart canvas{background:0 0!important}.sankey-error{color:#7f1d1d;text-align:center;background:#ffffffb8;place-items:center;padding:18px;font-size:13px;font-weight:800;display:grid;position:absolute;inset:0}.flow-kpis,.distribution-legend,.trajectory-meta,.cluster-ribbon{flex-wrap:wrap;gap:8px;display:flex}.flow-kpis span,.distribution-legend span,.trajectory-meta span,.cluster-ribbon span,.cluster-ribbon button{color:#cbd5e1;background:#0f172a8c;border:1px solid #7dd3fc29;border-radius:999px;align-items:center;gap:5px;padding:6px 9px;font-size:12px;display:inline-flex}.cluster-ribbon button{cursor:pointer;appearance:none;transition:border-color .2s,color .2s,background .2s,transform .2s}.cluster-ribbon button:hover,.cluster-ribbon button.is-active{color:#f8fafc;background:#0ea5e92e;border-color:#7dd3fc94}.cluster-ribbon button.is-active{transform:translateY(-1px)}.cluster-ribbon__reset{color:#bae6fd}.video-shell{background:radial-gradient(circle,#22c55e38,#0000 40%),#020617;border:1px solid #2dd4bf52;border-radius:18px;height:100%;position:relative;overflow:hidden}.video-shell video{object-fit:contain;background:#020617;width:100%;height:100%}.video-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#020617b3;border:1px solid #fb923c52;border-radius:12px;gap:4px;padding:10px 12px;display:grid;position:absolute;top:14px;left:14px}.video-overlay span{color:#f97316;letter-spacing:.16em;font-size:11px;font-weight:900}.video-overlay strong{color:#f8fafc;font-size:16px}.cube-scene{perspective:760px;place-items:center;height:calc(100% - 40px);min-height:170px;display:grid}.cube-floor{aspect-ratio:1.55;width:min(82%,360px);transform-style:preserve-3d;background:linear-gradient(#bbf7d024 1px,#0000 1px) 0 0/24px 24px,linear-gradient(90deg,#bbf7d024 1px,#0000 1px) 0 0/24px 24px,linear-gradient(135deg,#15803ddb,#064e3bb8);border:2px solid #bbf7d085;border-radius:14px;position:relative;transform:rotateX(58deg)rotate(-35deg);box-shadow:0 28px 70px #00000070,inset 0 0 34px #a7f3d02e}.cube-floor:before,.cube-floor:after{content:"";background:#ecfdf580;position:absolute}.cube-floor:before{width:100%;height:2px;top:50%;left:0}.cube-floor:after{width:2px;height:100%;top:0;left:50%}.axis{color:#e0f2fe;text-shadow:0 0 8px #020617;font-size:12px;font-weight:800;position:absolute;transform:rotate(35deg)rotateX(-58deg)}.axis--x{bottom:-10px;right:-34px}.axis--y{top:-16px;left:-28px}.scatter-point{transform-style:preserve-3d;border-radius:50%;animation:2.8s ease-in-out infinite pointFloat;position:absolute}.scatter-point:after{content:"";background:linear-gradient(currentColor,#0000);width:2px;height:38px;position:absolute;inset:48% auto auto 48%;transform:translateZ(-24px)}.scatter-point--a{color:#fb7185;background:radial-gradient(circle,#fff1f2,#ef4444 62%);box-shadow:0 0 18px #ef4444}.scatter-point--b{color:#67e8f9;background:radial-gradient(circle,#ecfeff,#06b6d4 62%);box-shadow:0 0 18px #06b6d4}.legend-dot,.cluster-ribbon i{border-radius:50%;width:9px;height:9px;display:inline-block}.legend-dot--red{background:#ef4444}.legend-dot--cyan{background:#06b6d4}.trajectory-board{background:linear-gradient(90deg,#0000 49.6%,#ffffff9e 49.6% 50.4%,#0000 50.4%),linear-gradient(#16a34ae6,#065f46eb);border:2px solid #bbf7d07a;border-radius:14px;flex:auto;min-height:150px;position:relative;overflow:hidden;box-shadow:inset 0 0 40px #bbf7d01f}.trajectory-board svg{z-index:1;width:calc(100% - 16px);height:calc(100% - 16px);position:absolute;inset:8px;overflow:visible}.table-line{z-index:0;background:#ffffff9e;position:absolute}.table-line--net{width:100%;height:2px;top:50%;left:0}.table-line--center{width:2px;height:100%;top:0;left:50%}.trajectory-path{fill:none;stroke:var(--path-color);stroke-linecap:round;stroke-linejoin:round;stroke-width:.45px;opacity:.28;filter:drop-shadow(0 0 2px var(--path-color));mix-blend-mode:screen}.trajectory-path--highlight{stroke-width:.9px;stroke-dasharray:16 118;stroke-dashoffset:96px;opacity:.88;filter:drop-shadow(0 0 5px var(--path-color));animation:trajectoryTrace var(--duration) ease-in-out infinite alternate;animation-delay:var(--delay);will-change:stroke-dashoffset}.trajectory-meta{flex:none;margin-top:10px}.cluster-ribbon{flex:none;margin-top:8px}@keyframes flowPulse{0%,to{stroke-dasharray:0 8}50%{stroke-dasharray:6 4}}@keyframes pointFloat{0%,to{filter:brightness()}50%{filter:brightness(1.35)}}@keyframes trajectoryTrace{0%{stroke-dashoffset:100px}to{stroke-dashoffset:-32px}}@media (width<=1280px){.dashboard{overflow:auto}.dashboard-grid{grid-template-rows:repeat(6,minmax(320px,auto));grid-template-columns:1fr;grid-template-areas:"info""section""sankey""video""distribution""trajectory";height:auto}.grid-area--distribution,.grid-area--trajectory{grid-area:auto;height:360px}.grid-area--video{height:520px}}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{-webkit-font-smoothing:antialiased;background:#020617;margin:0;font-family:Inter,Microsoft YaHei,PingFang SC,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}button,input,select,textarea{font:inherit}body{min-width:1180px}