@import"https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=Orbitron:wght@400;600;900&display=swap";*{box-sizing:border-box;margin:0;padding:0}body{background:#000;color:#c0f0ff;font-family:Share Tech Mono,monospace;min-height:100vh;background-image:linear-gradient(rgba(0,245,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,245,255,.03) 1px,transparent 1px);background-size:40px 40px}.loading{display:flex;justify-content:center;align-items:center;min-height:100vh;color:#00f5ff;font-size:1rem;letter-spacing:.2em;text-shadow:0 0 10px #00f5ff;animation:blink 1.2s step-start infinite}@keyframes blink{50%{opacity:.3}}.landing{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:1rem}.landing-card{background:#000000e0;border:1px solid #00f5ff;border-radius:0;padding:2.5rem 2rem;width:100%;max-width:400px;box-shadow:0 0 0 1px #00f5ff1a,0 0 30px #00f5ff26,inset 0 0 40px #00f5ff08;position:relative;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,16px 100%,0 calc(100% - 16px))}.landing-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,#00f5ff,#ff0066,transparent)}.landing-card h1{text-align:center;font-family:Orbitron,monospace;font-size:1.5rem;font-weight:900;color:#fff;margin-bottom:.3rem;text-shadow:0 0 10px #00f5ff,0 0 30px rgba(0,245,255,.4);letter-spacing:.05em}.subtitle{text-align:center;color:#f06;font-size:.82rem;margin-bottom:2rem;letter-spacing:.15em;text-shadow:0 0 8px rgba(255,0,102,.5)}.field{margin-bottom:1.2rem}.field label{display:block;font-size:.76rem;color:#00f5ff;margin-bottom:.4rem;letter-spacing:.15em;text-transform:uppercase;text-shadow:0 0 6px rgba(0,245,255,.4)}.field input{width:100%;padding:.7rem 1rem;background:#00f5ff0a;border:1px solid rgba(0,245,255,.35);border-radius:0;color:#fff;font-family:Share Tech Mono,monospace;font-size:1rem;outline:none;transition:border-color .2s,box-shadow .2s;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%)}.field input:focus{border-color:#00f5ff;box-shadow:0 0 12px #00f5ff40,inset 0 0 8px #00f5ff0a}.field input::placeholder{color:#00f5ff38}.btn-primary{width:100%;padding:.8rem;background:transparent;border:1px solid #ff0066;border-radius:0;color:#f06;font-family:Orbitron,monospace;font-size:.88rem;font-weight:600;cursor:pointer;margin-top:.5rem;letter-spacing:.1em;text-transform:uppercase;transition:all .2s;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));text-shadow:0 0 8px rgba(255,0,102,.4);box-shadow:0 0 10px #ff006626}.btn-primary:hover:not(:disabled){background:#ff00661f;box-shadow:0 0 20px #ff006659;color:#fff}.btn-primary:disabled{opacity:.4;cursor:not-allowed}.error{color:#f06;font-size:.82rem;margin:.5rem 0;text-align:center;letter-spacing:.05em;text-shadow:0 0 8px rgba(255,0,102,.5)}.room-page{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;padding:1.5rem 1rem 3rem}.room-card{background:#000000e0;border:1px solid rgba(0,245,255,.3);border-radius:0;padding:1.5rem 1.5rem 2rem;width:100%;max-width:600px;box-shadow:0 0 20px #00f5ff14,inset 0 0 40px #00f5ff05;position:relative;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px))}.room-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#00f5ff 30%,#ff0066 70%,transparent)}.room-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;border-bottom:1px solid rgba(0,245,255,.12);padding-bottom:1rem}.header-left{display:flex;align-items:center;gap:.7rem}.btn-back{background:transparent;border:1px solid rgba(0,245,255,.35);border-radius:0;color:#00f5ff;font-size:1.1rem;width:32px;height:32px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px))}.btn-back:hover{border-color:#f06;color:#f06;box-shadow:0 0 10px #ff006640}.room-header h2{font-family:Orbitron,monospace;font-size:1.15rem;font-weight:600;color:#00f5ff;text-shadow:0 0 10px rgba(0,245,255,.5);letter-spacing:.08em}.player-count{background:#ff006614;border:1px solid rgba(255,0,102,.35);padding:.3rem .8rem;font-size:.78rem;color:#f06;letter-spacing:.1em;text-shadow:0 0 6px rgba(255,0,102,.35)}.color-section{margin-bottom:1.8rem}.color-section h3,.summary-section h3,.table-section h3{font-family:Orbitron,monospace;font-size:.7rem;color:#00f5ff;margin-bottom:.8rem;text-transform:uppercase;letter-spacing:.2em;text-shadow:0 0 6px rgba(0,245,255,.35)}.color-grid{display:flex;gap:.8rem;flex-wrap:wrap}.color-block{position:relative;width:80px;height:72px;background:#0009;border:1px solid var(--color-bg);border-radius:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s,opacity .15s;font-size:.78rem;font-weight:600;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8);clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px))}.color-block:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-bg);opacity:.15;pointer-events:none}.color-block:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 4px 20px var(--color-bg)}.color-block.selected{box-shadow:0 0 16px var(--color-bg),0 0 30px var(--color-bg);transform:translateY(-3px);border-width:2px}.color-block.selected:after{opacity:.25}.color-block.taken{opacity:.3;cursor:not-allowed}.color-block:disabled{cursor:not-allowed}.color-label{margin-top:.2rem;position:relative;z-index:1;letter-spacing:.05em}.badge{position:absolute;top:4px;right:4px;background:#000000b3;border:1px solid rgba(255,255,255,.25);border-radius:0;padding:1px 4px;font-size:.6rem;letter-spacing:.05em;z-index:1}.summary-section{margin-bottom:1.8rem}.summary-item{display:flex;align-items:center;gap:.6rem;background:#00f5ff0a;border:1px solid rgba(0,245,255,.18);border-left:3px solid #00f5ff;border-radius:0;padding:.6rem 1rem;box-shadow:inset 0 0 20px #00f5ff05}.summary-dot{width:10px;height:10px;border-radius:0;flex-shrink:0;clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%)}.summary-text{font-size:.95rem;color:#e0ffff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.12em;text-shadow:0 0 6px rgba(0,245,255,.15)}.table-section{display:flex;flex-direction:column;align-items:center}.table-header{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:.8rem}.table-header h3{margin-bottom:0}.btn-reset{padding:.3rem .8rem;background:transparent;border:1px solid rgba(255,0,102,.45);border-radius:0;color:#f06;font-family:Share Tech Mono,monospace;font-size:.78rem;letter-spacing:.1em;cursor:pointer;transition:all .15s;text-transform:uppercase;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,0 100%)}.btn-reset:hover{background:#ff00661f;box-shadow:0 0 12px #ff006640;color:#fff}.table-wrapper{overflow-x:auto;width:100%;display:flex;justify-content:center}.jump-table{border-collapse:collapse;table-layout:fixed}.jump-table th{background:#00f5ff0f;color:#00f5ff;font-family:Share Tech Mono,monospace;font-size:.8rem;padding:.5rem 0;text-align:center;border:1px solid rgba(0,245,255,.13);width:72px;letter-spacing:.08em;text-shadow:0 0 6px rgba(0,245,255,.35)}.row-num-header{width:48px!important;font-size:.58rem!important;color:#00f5ff66!important}.jump-table td{border:1px solid rgba(0,245,255,.1);text-align:center;padding:0;width:72px;height:52px;transition:background .15s}.row-num{background:#00f5ff0a;color:#00f5ff66;font-size:.8rem;width:48px!important;letter-spacing:.05em}.cell{position:relative}.cell.clickable{cursor:pointer}.cell.clickable:not(.filled):hover{background:#00f5ff12!important;box-shadow:inset 0 0 12px #00f5ff14}.cell.filled{box-shadow:inset 0 0 0 1px #fff3,inset 0 0 12px #0000004d}.cell-num{font-size:1rem;font-weight:700;-webkit-user-select:none;user-select:none;pointer-events:none;font-family:Share Tech Mono,monospace;letter-spacing:.05em}.hint{color:#00f5ff4d;font-size:.82rem;margin-bottom:.6rem;align-self:flex-start;letter-spacing:.08em}@media (max-width: 480px){.room-card{padding:1rem .8rem 1.5rem;border-radius:10px}.room-header h2{font-size:1.1rem}.color-block{width:68px;height:62px;font-size:.75rem}.jump-table th{width:58px;font-size:.8rem;padding:.4rem 0}.row-num-header{width:36px!important}.jump-table td{width:58px;height:46px}.row-num{width:36px!important;font-size:.75rem}.cell-num{font-size:1rem}.summary-text{font-size:.85rem}}