body{font-family:Source Code Pro,monospace;background-color:#0d1635;color:#f3d854;text-shadow:0 0 2px #f3d854}p{color:#f0f8ff;text-shadow:none}#all-states{display:grid;grid-template-columns:repeat(auto-fit,minmax(77px,1fr));grid-auto-rows:auto;gap:20px;padding:20px;font-size:10px}.state{padding:8px;border-radius:8px;background-color:#1a2540;aspect-ratio:1;display:block;white-space:pre;align-items:center;justify-self:center;transition:all .3s ease}.state.unclaimed{opacity:.3;filter:grayscale(100%)}.state.claimed{opacity:1;filter:grayscale(0%);animation:glow-pulse 2s ease-in-out infinite;cursor:pointer}.state.claimed:hover{transform:scale(1.1);box-shadow:0 0 15px #f3d85480;z-index:10}.state.just-claimed{animation:claim-reveal 2s ease-out forwards,glow-pulse 2s ease-in-out infinite 2s}@keyframes claim-reveal{0%{opacity:.3;filter:grayscale(100%);transform:scale(1)}50%{opacity:1;filter:grayscale(0%);transform:scale(4);box-shadow:0 0 30px #f3d854cc}to{opacity:1;filter:grayscale(0%);transform:scale(1);box-shadow:none}}@keyframes glow-pulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.2)}}.grid{white-space:pre}.state-terminal .grid{text-shadow:0 0 5px #f3d854,0 0 10px #f3d854}.mark-x,.mark-o,[class*=mark-]{white-space:pre}.mark-x{color:#ff4c4c;text-shadow:0 0 2px #ff4c4c}.mark-o{color:#4c9aff;text-shadow:0 0 2px #4c9aff}.mark-winning{font-weight:700}.mark-winning.mark-x{text-shadow:0 0 5px #ff4c4c,0 0 10px #ff4c4c,0 0 15px #ff4c4c}.mark-winning.mark-o{text-shadow:0 0 5px #4c9aff,0 0 10px #4c9aff,0 0 15px #4c9aff}button{margin-top:20px;padding:10px 20px;font-size:16px;background-color:#f3d854;color:#0d1635;border:none;border-radius:5px;cursor:pointer;box-shadow:#f3d854 0 0 5px,#f3d854 0 0 10px}.text-content{text-align:center;max-width:800px;margin:auto}.stats{font-size:14px;color:#4c9aff;margin-top:10px}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000}.modal.active{display:block}.modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:#0d1635f2;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1}.modal-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#1a2540;border:0px solid #f3d854;border-radius:16px;padding:40px 40px 60px;max-width:800px;width:90%;max-height:90vh;overflow-y:auto;overflow-x:hidden;box-shadow:0 0 7px #f3d8544d;z-index:2}.modal-step{display:none}.modal-step.active{display:block}.modal h2{color:#f3d854;text-align:center;margin-bottom:20px;font-size:24px}.modal p{text-align:center;margin-bottom:20px;color:silver}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0d1635;z-index:9999;display:flex;align-items:center;justify-content:center;transition:opacity .5s ease}.loading-overlay.hidden{opacity:0;pointer-events:none}.loading-orbital{text-align:center;padding:40px}.orbital-container{position:relative;width:150px;height:150px;margin:0 auto 20px}.orbit{position:absolute;border:1px solid rgba(243,216,84,.2);border-radius:50%;animation:rotate 3s linear infinite;top:50%;left:50%}.orbit-1{width:60px;height:60px;margin-left:-30px;margin-top:-30px}.orbit-2{width:100px;height:100px;margin-left:-50px;margin-top:-50px;animation-duration:4s}.orbit-3{width:140px;height:140px;margin-left:-70px;margin-top:-70px;animation-duration:5s}.particle{position:absolute;width:8px;height:8px;background:#4c9aff;border-radius:50%;box-shadow:0 0 10px #4c9aff;top:50%;left:50%;margin-top:-4px;margin-left:-4px;transform:translate(calc(var(--orbit-radius) / 2 - 4px))}.orbit-1 .particle{--orbit-radius: 60px}.orbit-2 .particle{--orbit-radius: 100px}.orbit-3 .particle{--orbit-radius: 140px}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.state-options{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}.state-option{background:#0d1635;border:2px solid #f3d854;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;text-align:center;min-height:180px;display:flex;flex-direction:column;justify-content:center}.state-option.spinning{cursor:default;opacity:.7}.state-option.stopped{animation:slot-stop .5s ease-out;border-color:#4c9aff;box-shadow:0 0 15px #4c9aff66}.state-option:not(.spinning):not(.stopped):hover{transform:translateY(-3px);box-shadow:0 3px 15px #f3d8544d;border-color:#ff4c4c}.state-option.selected{border-color:#4c9aff;box-shadow:0 0 20px #4c9aff99}@keyframes slot-stop{0%{transform:scale(1.15);opacity:.7}50%{transform:scale(.95);opacity:1}to{transform:scale(1);opacity:1}}.state-option .state-board{font-family:Source Code Pro,monospace;font-size:12px;line-height:1.2;margin-bottom:15px;white-space:pre}.state-option .state-info{font-size:11px;color:#4c9aff;margin-top:10px}.form-group{margin-bottom:20px;text-align:left}.form-group label{display:block;margin-bottom:8px;color:#f3d854;font-size:14px}.form-group input{width:100%;padding:12px;background:#0d1635;border:1px solid #f3d854;border-radius:8px;color:#f3d854;font-family:Source Code Pro,monospace;font-size:14px;box-sizing:border-box}.form-group input:focus{outline:none;border-color:#4c9aff;box-shadow:0 0 10px #4c9aff4d}.form-group input[type=checkbox]{width:auto;padding:0;margin:0;cursor:pointer}.form-group .checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;color:#fff;font-size:14px;margin-bottom:0;text-shadow:none}.form-note{font-size:12px;color:#4c9aff;text-align:center;margin-top:15px}.claim-submit,.back-button,.modal-done,.retry-button{width:100%;padding:14px;margin-top:10px;margin-bottom:20px;font-size:15px;border:none;border-radius:6px;cursor:pointer;font-family:Source Code Pro,monospace;transition:all .2s ease}.claim-submit{background:#f3d854;color:#0d1635;font-weight:500}.claim-submit:hover{background:#fde68a;transform:translateY(-1px)}.back-button,.retry-button{background:transparent;color:#f3d854;border:1px solid #f3d854}.back-button:hover,.retry-button:hover{background:#f3d8541a}.modal-done{background:transparent;color:silver;border:1px solid #c0c0c0;font-weight:400}.modal-done:hover{background:#c0c0c01a;color:#e8e8e8;border-color:#e8e8e8}#step-success{position:relative;overflow:visible;padding-bottom:20px}.success-background{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:hidden}.success-content{position:relative;z-index:1;padding-bottom:10px}.star{position:absolute;width:3px;height:3px;background:#f3d854;border-radius:50%;box-shadow:0 0 8px #f3d854;animation:twinkle 2s ease-in-out infinite}.star:nth-child(1){top:10%;left:15%;animation-delay:0s}.star:nth-child(2){top:20%;left:85%;animation-delay:.3s}.star:nth-child(3){top:35%;left:10%;animation-delay:.6s}.star:nth-child(4){top:45%;left:90%;animation-delay:.9s}.star:nth-child(5){top:60%;left:20%;animation-delay:1.2s}.star:nth-child(6){top:70%;left:75%;animation-delay:1.5s}.star:nth-child(7){top:85%;left:40%;animation-delay:1.8s}.star:nth-child(8){top:15%;left:50%;animation-delay:2.1s}.star:nth-child(9){top:55%;left:60%;animation-delay:2.4s}.star:nth-child(10){top:90%;left:80%;animation-delay:2.7s}@keyframes twinkle{0%,to{opacity:.2;transform:scale(1)}50%{opacity:.8;transform:scale(1.4)}}.error-animation{font-size:64px;text-align:center;margin-bottom:20px;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}#selected-state-display{background:#0d1635;border:1px solid #f3d854;border-radius:12px;padding:20px;margin:20px 0;font-family:Source Code Pro,monospace;text-align:center;overflow-x:auto}#selected-state-display>*{display:inline-block;white-space:pre;text-align:left}#claimed-state-display{position:relative;padding:40px;margin:30px auto;font-family:Source Code Pro,monospace;text-align:center;font-size:24px;line-height:1.4;max-width:400px;-webkit-user-select:none;user-select:none}#claimed-state-display>*{display:inline-block;white-space:pre;text-align:left}#claimed-state-display .grid-content{display:inline-block;transform-style:preserve-3d;transition:transform .1s ease-out;white-space:pre}@keyframes float-grid{0%,to{transform:perspective(1000px) translateY(0)}50%{transform:perspective(1000px) translateY(-8px)}}#claimed-state-display .grid-content.floating{animation:float-grid 3s ease-in-out infinite}#claimed-state-display .grid{color:#f3d854;text-shadow:0 0 5px #f3d854,0 0 10px #f3d854;font-weight:700}#success-message{color:silver;font-size:16px;margin-top:30px}#success-message strong{color:#e8e8e8}.modal-content{perspective:1000px}footer{text-align:center;padding:20px;font-size:14px;color:silver}