:root{font-family:system-ui,SF Pro,Roboto,Helvetica Neue,sans-serif;font-size:100%;line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--white);background-color:var(--grey-900);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--white: #fcf5f7;--black: #0a0a0a;--blue: #007aff;--grey-100: #eeeeee;--grey-400: #9a9a9a;--grey-500: #797979;--grey-700: #3a3a3a;--grey-800: #2a2a2a;--grey-900: #1a1a1a;--gold-700: #ffcc00;--gold-900: #cc9900}*,*:before,*:after{box-sizing:border-box}a{font-weight:500;color:var(--blue);text-decoration:inherit}a:hover{cursor:pointer;text-decoration:underline}body{margin:0;display:flex;justify-content:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{font-size:1rem;cursor:pointer}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}input{font-family:system-ui,SF Pro,Roboto,Helvetica Neue,sans-serif}@media (prefers-color-scheme: light){:root{background-color:var(--grey-100)}body{color:var(--black)}}#root{max-width:1280px;margin:0 auto;padding:2rem}h1{grid-column:1/3}.wheely-wrapper{display:grid;gap:2rem;grid-template-rows:auto 1fr;grid-template-columns:1fr auto}.wheel-wrapper{overflow:hidden}.board-wrapper{display:flex;flex-direction:column;gap:1rem}.board-header{font-weight:400;font-size:16px;color:var(--grey-400);margin-left:16px;text-transform:uppercase}.board{display:flex;flex-direction:column;background:var(--grey-800);padding:8px 0 8px 8px;border-radius:8px;max-height:500px;overflow-y:auto}.board-item{display:flex;align-items:center;color:var(--white);padding:4px}.board-item:not(:last-child){border-bottom:1px solid var(--grey-700)}@media (prefers-color-scheme: light){.board{background:var(--white)}.board-item:not(:last-child){color:var(--grey-700);border-bottom:1px solid var(--grey-100)}.board-header{color:var(--grey-500)}}.wheel{display:flex;justify-content:center;align-items:center;height:530px;width:530px;border-radius:50%;position:relative;background:var(--gold-700);background-image:linear-gradient(90deg,transparent 90%,#fff 120%),linear-gradient(180deg,transparent 90%,#fff 120%),linear-gradient(270deg,transparent 90%,#fff 120%),linear-gradient(0deg,transparent 90%,#fff 120%)}.wheel:after{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:40px;height:50px;clip-path:polygon(0% 0%,0% 20%,50% 100%,100% 20%,100% 0%);background:#a80008;background-image:linear-gradient(64deg,var(--gold-900) 40%,transparent 0%),linear-gradient(295deg,var(--gold-900) 39%,transparent 0%),linear-gradient(180deg,var(--gold-900) 12%,transparent 0%),linear-gradient(90deg,var(--gold-900) 16%,transparent 0%),linear-gradient(270deg,var(--gold-900) 16%,transparent 0%)}.wheel-button{position:absolute;border-radius:50%;width:100px;height:100px;font-weight:700;border:2px solid var(--white);background:#a80008;box-shadow:inset 0 0 20px 5px #511;text-transform:uppercase;transition:transform .25s}.wheel-button:hover:not(:disabled){transform:scale(1.1)}@keyframes spinWheel{0%{transform:rotate(var(--start-rot))}to{transform:rotate(var(--end-rot))}}.spin{animation:spinWheel 8s cubic-bezier(.05,.8,.2,1) forwards;transform-box:fill-box;transform-origin:center}.wheel-setup-header{font-weight:400;font-size:16px;color:var(--grey-400);margin-left:16px;text-transform:uppercase}.wheel-setup{display:flex;flex-direction:column;background:var(--grey-800);min-width:340px;border-radius:8px;row-gap:8px}.wheel-setup label{display:grid;grid-template-columns:60px 1fr;color:var(--white);margin-left:16px;align-items:baseline}.wheel-setup label:first-child{margin-top:8px}.wheel-setup input{margin-left:8px;padding:8px 8px 8px 0;border:none;color:var(--white);background-color:transparent;outline:none;font-size:1rem}.wheel-setup input[type=color]{-webkit-appearance:none;border:none;width:28px;height:28px;border-radius:8px;padding:0;cursor:pointer;align-self:center}.wheel-setup input[type=color]::-webkit-color-swatch-wrapper{padding:0}.wheel-setup input[type=color]::-webkit-color-swatch{border:none}.wheel-setup button{background:transparent;border:none;color:var(--blue);padding:16px;border-top:1px solid var(--grey-700)}.wheel-setup input::placeholder{color:var(--grey-400);font-size:14px;font-weight:300}.wheel-setup label input:focus:not([type=color]){border-bottom:1px solid var(--blue)}.wheel-setup label:not(:last-of-type) input:not(:focus){border-bottom:1px solid var(--grey-700)}@media (prefers-color-scheme: light){.wheel-setup{background:var(--white)}.wheel-setup label,.wheel-setup input{color:var(--black)}.wheel-setup input::placeholder{color:var(--grey-500)}.wheel-setup-header{color:var(--grey-500)}.wheel-setup label:not(:last-of-type) input:not(:focus){border-bottom:1px solid var(--grey-100)}.wheel-setup button{border-top:1px solid var(--grey-100)}}