.Card{padding:16px;border:var(--bord-col) 1px solid;border-radius:8px;display:grid;gap:8px;align-content:center;break-inside:avoid-column;max-width:100%;flex-grow:1}.Card .data-container{height:min-content}.Card span{line-height:1em}.Card .name{margin:0;text-align:center;line-height:1em;font-size:1em;height:fit-content;word-wrap:break-word;text-wrap:balance}.Card .secondary{color:var(--secondary-txt-col)}.StatCard{text-align:center}.StatCard span{white-space:nowrap}.StatCard .stat{font-size:2em;font-weight:bolder}.TableCard .data-container{display:flex;flex-wrap:wrap;place-content:center}.TableCard caption{text-align:center}.TableCard table{margin:0 auto;border-spacing:0}.TableCard th,td{padding:8px}.TableCard th{text-align:left}.TableCard tr:not(:last-child) :is(th,td){border-bottom:var(--bord-col) 1px solid}.ChartCard .top-container{display:flex;align-items:center}.ChartCard .name{flex-grow:1}.ChartCard:has(.StackedLineChart){flex-basis:100%}.StackedLineChart .controls{display:grid;gap:16px}.StackedLineChart .textbox-container{text-align:center}.StackedLineChart .textbox-container>*{display:inline}.StackedLineChart .filter-choices{display:grid;gap:8px}.StackedLineChart .filter-choices label:has(input[type=radio]:not(:checked)){color:var(--secondary-txt-col)}.StackedLineChart .form-error{margin:0;text-align:center;color:light-dark(#af0000,#ff8e8e)}.Checkbox{display:flex;align-items:center;gap:4px;width:fit-content}.Checkbox,.Checkbox .checkbox{cursor:pointer}.Checkbox .checkbox{width:25px;height:25px;border-radius:6px;border:2px solid var(--accent-col-rgb);padding:0;align-content:center}.Checkbox .checkbox[data-checked=true]{background-color:var(--accent-col-rgb)}.Checkbox .label{line-height:0}.Checkbox .checkbox .checkmark{display:block;opacity:0;font-size:12.5px;line-height:0px;color:#fff}.Checkbox .checkbox[data-checked=true] .checkmark{opacity:1}.Tooltip .activator{--sz: 25px;border-radius:calc(var(--sz) / 2);aspect-ratio:1;background-color:var(--bkg-col);border:var(--bord-col) 2px solid;font-weight:bolder;width:var(--sz);height:var(--sz)}.Tooltip .content{visibility:hidden;width:auto;position:fixed;background-color:var(--bkg-col);padding:16px;border:var(--bord-col) 2px solid;box-shadow:0 10px 25px 0 var(--shadow-col);border-radius:8px;box-sizing:border-box;z-index:999}.Tooltip .content p{margin:0}.Tooltip .activator:hover~:is(.Tooltip .content){visibility:visible}@media (pointer: coarse){.Tooltip .activator{--sz: 40px}.Tooltip .content[data-visible=true]{visibility:visible}}.ShoeCard{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:64px}.ShoeCard p{margin:0}.ShoeCard .data-container{display:flex;align-items:center;gap:32px}.ShoeCard .retired,.ShoeCard .active{border-radius:100px;padding:0 8px}.ShoeCard .retired{background-color:var(--secondary-txt-col);color:var(--bkg-col)}.ShoeCard .active{background-color:var(--txt-col);color:var(--bkg-col)}.ShoeCard :is(.retired,.active) p{font-size:.875em}:root{--accent-col: 255, 90, 0;--accent-col-rgb: rgb(255, 90, 0);--shadow-col: #00000099;--bord-col: light-dark(#ccc, #666);--bkg-col-light: white;--bkg-col-dark: #1f1f1f;--txt-col-light: black;--txt-col-dark: white;--txt-col: light-dark(var(--txt-col-light), var(--txt-col-dark));--bkg-col: light-dark(var(--bkg-col-light), var(--bkg-col-dark));--secondary-txt-col: light-dark(#666, #bbb);accent-color:var(--accent-col-rgb);color-scheme:light dark;font-family:Arial,Helvetica,sans-serif;font-size:16px}body,html,#root,.App{padding:0;margin:0;box-sizing:border-box;height:100%}body{background-color:var(--bkg-col)}.App{display:grid;grid-template-rows:1fr auto}.App h2,.App h3,.App h4{text-align:center}.App h2{font-size:2rem}.App h3{font-size:1.5rem}.App :is(p,li,span){font-size:1.1rem}.App :is(h2,h3,p,li){line-height:1.75rem}@property --x{syntax: "<percentage>"; inherits: false; initial-value: 0%;}@property --y{syntax: "<percentage>"; inherits: false; initial-value: 0%;}@property --stop{syntax: "<percentage>"; inherits: false; initial-value: 0%;}@property --angle{syntax: "<angle>"; inherits: false; initial-value: 0deg;}.App .banner{--fade-h: 100px;background:radial-gradient(circle at var(--x) var(--y),rgba(var(--accent-col),.33),transparent var(--stop)),conic-gradient(from var(--angle) at 150% 150%,rgba(var(--accent-col),.33),transparent,rgba(var(--accent-col),.33));background-color:var(--bkg-col);height:calc(100svh + var(--fade-h));animation:spin ease-in-out infinite 10s alternate;-webkit-mask-image:linear-gradient(black calc(100% - var(--fade-h)),transparent);mask-image:linear-gradient(black calc(100% - var(--fade-h)),transparent);position:relative}@keyframes spin{0%{--angle: 180deg }to{--angle: 360deg}}.App .banner .container{position:relative;display:grid;gap:32px;align-content:center;height:100svh}.App .banner .container *{margin:0;text-align:center}.App .banner .title{font-size:4rem}.App .banner .title .version{font-size:1.5rem}.App .banner .bottom-container{display:grid;gap:32px;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.App .banner .credits-and-repo{display:grid;gap:16px}.App .banner .credits{font-weight:lighter;font-size:1.5rem}.App .banner .repo{width:fit-content;margin:0 auto;text-decoration:none;color:light-dark(black,white);padding:0px 1rem;line-height:3em;height:3em;font-size:1em;border-radius:1.5em;display:flex;align-items:center;gap:8px;-webkit-tap-highlight-color:transparent;background-color:light-dark(rgba(var(--accent-col),.25),rgb(255 255 255 / .1));--hov-act-col: light-dark(rgba(var(--accent-col), .5), rgb(255 255 255 / .2))}@media (hover: hover) and (pointer: fine){.App .banner .repo{transition:background-color .2s linear}.App .banner .repo:hover{background-color:var(--hov-act-col)}}@media (pointer: coarse){.App .banner .repo:active{background-color:var(--hov-act-col)}}.App .banner .repo .icon{width:25px;height:25px;filter:brightness(0) invert(1)}@media (prefers-color-scheme: light){.App .banner .repo .icon{filter:brightness(0) invert(0)}}.App .banner .scroll-hint{font-size:1rem;bottom:32px;width:100%;display:grid;gap:4px;justify-content:center;justify-items:center}.App .banner .scroll-hint .down-arrow{width:15px;height:15px;animation:bob 1s infinite alternate linear}@keyframes bob{0%{transform:translateY(0)}to{transform:translateY(10px)}}@media (prefers-color-scheme: light){.App .banner .scroll-hint img{filter:brightness(0)}}.App main,.App section{margin:0 auto;max-width:750px;width:calc(100% - 32px)}.App .Dashboard .container{display:flex;flex-wrap:wrap;gap:12px}.Dashboard .shoes-container{width:100%;display:grid;gap:12px}footer{margin-top:32px;background-color:light-dark(whitesmoke,#2f2f2f);padding:16px 0}footer .inner-container{margin:0 auto;width:calc(100% - 32px);text-align:center;color:var(--secondary-txt-col)}footer a{color:inherit}footer .contacts-container{display:flex;justify-content:center;align-items:center;gap:32px}footer .contacts-container a:has(.icon){-webkit-tap-highlight-color:transparent}footer .contacts-container .icon{--hov-act-filter: brightness(0) invert(1) brightness(.8);width:30px;height:30px;filter:brightness(0) invert(1) brightness(.6)}@media (prefers-color-scheme: light){footer .contacts-container .icon{--hov-act-filter: brightness(0) invert(1) brightness(.2);filter:brightness(0) invert(1) brightness(.4)}}@media (hover: hover) and (pointer: fine){footer .contacts-container .icon{transition:filter .2s linear}footer .contacts-container .icon:hover{filter:var(--hov-act-filter)}}@media (pointer: coarse){footer .contacts-container .icon:active{filter:var(--hov-act-filter)}}
