:root{--ink:#252b34;--muted:#89909a;--blue:#6989b6;--line:#e9ecf1}*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font:14px/1.6 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}button:disabled{cursor:default}a{text-decoration:none;color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:6px}svg{fill:none;stroke:currentColor;stroke-width:1.5}header{height:96px;display:flex;justify-content:space-between;align-items:center;padding:0 5.5vw;position:relative;z-index:5}.logo{display:flex;align-items:center;gap:9px;font-weight:600;font-size:16px;letter-spacing:-.5px}.logo svg{width:23px;height:23px;stroke:#778aa4;stroke-width:1.8}.history-toggle{display:flex;align-items:center;gap:9px;font-size:13px;padding:12px 0}.history-toggle svg{width:17px;height:17px;stroke:#7a8492}.history-toggle span{display:flex;align-items:center;justify-content:center;width:23px;height:23px;border-radius:50%;background:#f1f4f8;color:#6c7e98;font-size:11px;margin-left:2px}main{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;align-items:center;position:relative}.intro{text-align:center;padding-top:20px}.small-text{color:var(--muted);font-size:12px}h1{font-size:30px;font-weight:500;letter-spacing:-1.2px;margin:10px 0 8px;line-height:1.4}.intro p{font-size:13px;color:var(--muted);margin:0}.stage{width:420px;height:445px;position:relative;margin-top:15px;isolation:isolate}.machine-button{display:block;width:100%;height:100%;padding:0;cursor:pointer}.machine{height:100%;width:100%;overflow:visible}.machine-button:hover #handle{filter:brightness(1.05)}#handle{transform-origin:210px 308px;transform-box:view-box}#chute-ball{opacity:0}.actions{text-align:center;position:relative;z-index:2;margin-top:3px}.draw-button{display:flex;gap:36px;align-items:center;justify-content:center;background:var(--ink);color:#fff;min-width:194px;padding:15px 22px;border-radius:7px;font-size:13px;transition:background .2s,transform .2s}.draw-button svg{width:17px;height:17px;stroke:#fff}.draw-button:hover:not(:disabled){background:#44556d;transform:translateY(-2px)}.draw-button:active:not(:disabled){transform:translateY(0)}.draw-button:disabled{background:#98a3b2}.actions p{font-size:11px;color:var(--muted);min-height:20px;margin:13px 0 0}footer{text-align:center;font-size:10px;color:#a0a6ae;letter-spacing:.2px;padding:44px 0 23px}.history-panel{position:absolute;right:5.5vw;top:79px;z-index:10;background:white;width:320px;padding:23px;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 40px #29344412;max-height:70vh;overflow:auto}.history-heading{display:flex;align-items:center;justify-content:space-between}.history-heading h2{font-size:16px;font-weight:500;margin:0}.history-heading button{font-size:24px;line-height:1;padding:4px 0 4px 12px;color:#8e96a1}.history-note{font-size:10px;color:var(--muted);margin:5px 0 20px}#history-list{list-style:none;padding:0;margin:0}#history-list li{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid #f1f3f6}.history-ball{width:29px;height:29px;border-radius:50%;background:#d3dfed;position:relative;flex-shrink:0}.history-ball:after{content:'';position:absolute;top:50%;left:0;width:100%;height:1px;background:#a7bad3}.history-copy strong{display:block;font-size:12px;font-weight:500}.history-copy time{font-size:10px;color:var(--muted)}.history-index{margin-left:auto;color:#a3aab4;font-size:10px}#empty-history{font-size:12px;color:var(--muted);line-height:1.9;text-align:center;margin:27px 0}#history-clear{font-size:10px;color:var(--muted);display:block;margin:14px 0 0 auto;text-decoration:underline;padding:6px}#history-clear[hidden]{display:none}.result{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;pointer-events:none;opacity:0;z-index:3}.result-capsule{width:170px;height:170px;position:relative;transform:translateY(112px) scale(.24)}.capsule-top{position:absolute;left:0;top:0;width:170px;height:85px;border-radius:100px 100px 0 0;background:#91acd1;border:2px solid #7e9ac1;z-index:3;transform-origin:center bottom}.capsule-top:after{content:'';position:absolute;width:37px;height:15px;top:21px;left:28px;border-radius:50%;background:#c3d5ed;transform:rotate(-33deg)}.capsule-bottom{position:absolute;bottom:0;width:170px;height:85px;border-radius:0 0 100px 100px;background:#d4e1f2;border:2px solid #9eb7d8;z-index:4}.capsule-bottom:after{content:'';position:absolute;left:9px;right:9px;top:3px;height:7px;background:#adc4e2;border-radius:50%}.paper{position:absolute;left:-15px;top:18px;width:200px;height:210px;background:#fffef9;border:1px solid #e8e4d9;padding:25px 10px;text-align:center;z-index:2;display:flex;flex-direction:column;align-items:center;opacity:0;transform:translateY(40px) scaleY(.1);transform-origin:center bottom;box-shadow:0 8px 28px #3647600c}.paper:before{content:'';position:absolute;left:12px;right:12px;top:12px;bottom:12px;border:1px solid #ece8dd;pointer-events:none}.paper-caption{font-size:10px;color:#a09b8e;margin-top:12px}.paper strong{font-size:29px;letter-spacing:-1px;font-weight:500;margin:20px 0 14px;color:#3e4550}.paper-bottom{font-size:10px;color:#a09b8e}.spinning #handle{animation:handle-turn 1.4s cubic-bezier(.4,0,.2,1) forwards}.spinning #machine-body{animation:machine-rattle .13s ease-in-out .6s 6}.spinning .ball{animation:ball-shake .27s ease-in-out .35s 4}.spinning .b2,.spinning .b5,.spinning .b7{animation-direction:reverse}.spinning #chute-ball{animation:chute .65s ease-in 1.35s both}.revealing .machine-button,.revealed .machine-button{opacity:.12;transform:scale(.95);transition:opacity .65s,transform .65s;pointer-events:none}.revealing .result,.revealed .result{opacity:1}.revealing .result-capsule{animation:ball-arrive .9s cubic-bezier(.18,.75,.3,1) forwards}.opening .result-capsule,.revealed .result-capsule{transform:translateY(30px) scale(1)}.opening .capsule-top,.revealed .capsule-top{transform:translate(-42px,-103px) rotate(-24deg);transition:transform .85s cubic-bezier(.2,.8,.2,1)}.opening .capsule-bottom,.revealed .capsule-bottom{transform:translate(25px,92px) rotate(17deg);transition:transform .85s cubic-bezier(.2,.8,.2,1)}.opening .paper,.revealed .paper{opacity:1;transform:translateY(-55px) scaleY(1) rotate(-3deg);transition:transform 1s cubic-bezier(.15,.8,.2,1) .2s,opacity .5s .1s}.revealed .paper{animation:paper-rest 3.5s ease-in-out 1s infinite}.resetting .result{opacity:0;transition:opacity .2s}.resetting .machine-button{opacity:1;transform:scale(1);transition:opacity .3s}.history-toggle.bump span{animation:count-pop .4s ease}
@keyframes handle-turn{0%{transform:rotate(0)}20%{transform:rotate(-20deg)}80%,100%{transform:rotate(360deg)}}@keyframes machine-rattle{0%,100%{transform:translateX(0)}50%{transform:translateX(2px)}}@keyframes ball-shake{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(3px,-7px) rotate(2deg)}}@keyframes chute{0%{opacity:0;transform:translateY(-15px)}25%,80%{opacity:1}100%{opacity:0;transform:translateY(23px)}}@keyframes ball-arrive{0%{transform:translateY(112px) scale(.24) rotate(-30deg)}45%{transform:translateY(83px) scale(.7) rotate(8deg)}75%{transform:translateY(14px) scale(1.04) rotate(-4deg)}100%{transform:translateY(30px) scale(1) rotate(0)}}@keyframes paper-rest{0%,100%{transform:translateY(-55px) rotate(-3deg)}50%{transform:translateY(-59px) rotate(-2deg)}}@keyframes count-pop{50%{transform:scale(1.25)}}
@media(min-height:900px){.intro{padding-top:5vh}.stage{height:480px;margin-top:20px}footer{padding-top:50px}}@media(max-width:600px){header{height:78px;padding:0 22px}.logo{font-size:14px;gap:7px}.logo svg{width:21px}.history-toggle{font-size:12px;gap:7px}.history-toggle svg{width:16px}.intro{padding-top:28px}h1{font-size:27px}.intro p{font-size:12px}.stage{width:340px;height:408px;margin-top:12px}.actions{margin-top:0}.history-panel{right:18px;left:18px;width:auto;top:69px;max-height:65vh}footer{padding-top:35px}.result-capsule{width:150px;height:150px}.capsule-top{width:150px;height:75px}.capsule-bottom{width:150px;height:75px}.paper{left:-18px;width:186px;height:200px}.paper strong{font-size:27px}.draw-button{min-width:190px}}@media(max-height:750px) and (min-width:601px){header{height:76px}.intro{padding-top:0}.stage{height:360px;margin-top:3px}h1{font-size:27px}footer{padding-top:22px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.opening .result-capsule,.revealed .result-capsule{transform:translateY(30px) scale(1)}}

.machine{stroke:none}

.prize-panel{position:absolute;left:12px;top:180px;width:205px;padding:22px 0;z-index:4}.prize-panel h2{font-size:15px;font-weight:500;letter-spacing:-.4px;margin:0 0 5px}.prize-panel>p{font-size:11px;color:var(--muted);margin:0 0 20px}.prize-panel ul{list-style:none;margin:0;padding:0}.prize-panel li{display:flex;align-items:center;gap:9px;padding:12px 0;font-size:12px;border-bottom:1px solid #f1f3f6}.prize-panel li:last-child{border-bottom:0}.prize-panel .prize-dot{width:10px;height:10px;flex-shrink:0;border-radius:50%;background:#a3b9df}.prize-panel li[data-prize=exempt] .prize-dot{background:#d3c5df}.prize-panel li[data-prize=halfday] .prize-dot{background:#dfdfa9}.prize-panel li[data-prize=dayoff] .prize-dot{background:#e3b9ab}.prize-panel .prize-probability{margin-left:auto;font-variant-numeric:tabular-nums;color:#7b8491}.prize-panel small{display:block;font-size:10px;color:#a0a6ae;margin-top:18px}.history-ball[data-prize=exempt]{background:#d3c5df}.history-ball[data-prize=halfday]{background:#dfdfa9}.history-ball[data-prize=dayoff]{background:#e3b9ab}
@media(max-width:1000px) and (min-width:701px){.prize-panel{left:30px;width:170px;top:200px}}@media(max-width:700px){.prize-panel{position:static;order:4;width:calc(100% - 48px);max-width:340px;margin:27px 0 30px;padding:20px 0 0;border-top:1px solid var(--line)}.prize-panel h2{font-size:14px}.prize-panel>p{margin-bottom:10px}.prize-panel ul{display:grid;grid-template-columns:1fr 1fr;column-gap:25px}.prize-panel li{font-size:11px;padding:11px 0}.prize-panel small{margin-top:10px}.actions{order:3}.stage{order:2}.intro{order:1}}

.prize-mosaic{display:inline-block;width:66px;height:14px;overflow:hidden;color:transparent;user-select:none;border-radius:2px;background:conic-gradient(#939aa4 25%,#c8cdd3 0 50%,#aab1ba 0 75%,#dde0e4 0) 0 0/8px 8px;image-rendering:pixelated}