body{background-color:#121212;color:#f0f0f0;font-family:Arial,sans-serif;display:flex;flex-direction:column;align-items:center;padding:0 20px 20px;margin:0}#grid{display:grid;grid-template-columns:repeat(3,60px);grid-gap:5px;margin-bottom:20px}.cell{user-select:none;-webkit-user-select:none;width:60px;height:60px;background:#1e1e1e;border:1px solid #333;display:flex;align-items:center;justify-content:center;font-size:24px;cursor:pointer}.cell-win{cursor:not-allowed}.cell-lose{cursor:not-allowed;background:#333!important;color:#666!important;border-color:#444!important;opacity:.6;pointer-events:none}#inputArea{display:flex;flex-direction:column;align-items:center;margin-bottom:20px;position:relative}.inputBox{width:60px;height:60px;background:#222;border:2px solid #555;display:flex;align-items:center;justify-content:center;font-size:24px;margin:4px 0}.inputBoxSmall{width:60px;height:60px;background:#222;border:2px solid #555;display:flex;align-items:center;justify-content:center;font-size:24px;margin:4px 0;transform:scale(.7)}#reset,#share,#howToPlay{padding:10px 20px;background:#333;color:#fff;border:none;cursor:pointer}#rainbowTitle{font-size:36px;margin-bottom:10px;color:#121212;display:flex;gap:4px;justify-content:center}#rainbowTitle span{display:inline-block;animation:rainbow 5s linear infinite;animation-delay:calc(var(--i) * -.3s)}#rainbowTitle span:nth-child(1){--i: 0}#rainbowTitle span:nth-child(2){--i: 1}#rainbowTitle span:nth-child(3){--i: 2}#rainbowTitle span:nth-child(4){--i: 3}#rainbowTitle span:nth-child(5){--i: 4}#rainbowTitle span:nth-child(6){--i: 5}#rainbowTitle span:nth-child(7){--i: 6}#rainbowTitle span:nth-child(8){--i: 7}@keyframes rainbow{0%{color:red}14%{color:orange}28%{color:#ff0}42%{color:green}56%{color:#00f}70%{color:indigo}84%{color:violet}to{color:red}}#howToPlayContainer{display:flex;flex-direction:column;align-items:center;margin-bottom:20px;max-width:300px}#patternTracker{display:flex;flex-direction:column;align-items:center;margin-bottom:20px}#patterns{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;grid-template-rows:1fr;row-gap:8px}#patterns span{margin:0 4px;padding:4px 8px;display:flex;align-items:center;justify-content:center;border:1px solid #444;border-radius:4px}a{color:#aaa;text-decoration:none}a:hover{text-decoration:underline}#modeSelector{display:flex;gap:10px;justify-content:center;margin-bottom:20px;border-bottom:3px solid #444}.modeButton{padding:8px 16px;border:none;color:#fff;cursor:pointer;transition:background-color .2s ease;border-radius:4px 4px 0 0}.modeButton.active{background-color:#5164c8}.modeButton:not(.active){background-color:#333}#howToPlay.active{background-color:#5164c8}#howToPlay:not(.active){background-color:#333}.modeButton:disabled{opacity:.5;cursor:not-allowed}#bottomInfo{display:flex;justify-content:space-between;width:100%}.up-caret{font-size:16px;color:#7f7f7f;margin-bottom:0;position:absolute;top:50%}#bottomButtons{display:flex;gap:10px;justify-content:center;margin-top:15px;border-top:3px solid #444}#bottomButtons button{background-color:#444;border-radius:0 0 4px 4px}#shareButton{background-color:#444;border:none;color:#fff;padding:10px 20px;border-radius:4px;cursor:pointer}.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;animation:fadeIn .3s ease forwards}.popup-overlay.closing{animation:fadeOut .3s ease forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.popup-content{background-color:#1e1e1e;border:2px solid #444;border-radius:8px;padding:20px;max-width:90%;width:350px;position:relative;max-height:80vh;overflow-y:auto;transform:translateY(20px);opacity:0;animation:slideUp .4s ease .1s forwards}.popup-content.win-state{border-color:#4caf50;animation:slideUpAndGlow .4s ease .1s forwards,pulseGlow 2s ease-in-out .5s infinite}.popup-content.closing,.popup-content.win-state.closing{animation:slideDown .3s ease forwards}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideUpAndGlow{0%{transform:translateY(20px);opacity:0;box-shadow:0 0 #4caf5000}to{transform:translateY(0);opacity:1;box-shadow:0 0 5px #4caf5033}}@keyframes slideDown{0%{transform:translateY(0);opacity:1}to{transform:translateY(20px);opacity:0}}@keyframes pulseGlow{0%{box-shadow:0 0 5px #4caf5033}50%{box-shadow:0 0 15px #4caf5080}to{box-shadow:0 0 5px #4caf5033}}.popup-close{position:absolute;top:10px;right:10px;background:none;border:none;color:#fff;font-size:20px;cursor:pointer}.popup-title{margin-top:0;text-align:center;color:#fff;font-size:24px;margin-bottom:15px}.popup-buttons{display:flex;justify-content:center;gap:10px;margin-top:15px}.popup-buttons button{padding:10px 20px;background-color:#444;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s,transform .1s}.popup-buttons button:hover{background-color:#555}.popup-buttons button:active{transform:scale(.95)}.popup-open #gameContainer{pointer-events:none;filter:blur(2px);transition:filter .3s}#gameContainer{filter:blur(0);transition:filter .3s}.popup-content.win-state{border-color:#4caf50}.popup-content.lose-state{border-color:#f44336}.win-state .popup-title{color:#4caf50}.lose-state .popup-title{color:#f44336}.win-state .popup-buttons button{background-color:#4caf50}.win-state .popup-buttons button:hover{background-color:#45a049}.lose-state .popup-buttons button{background-color:#555}.lose-state .popup-buttons button:hover{background-color:#666}.game-over-content pre{background-color:#2a2a2a;border-radius:6px;font-size:20px;padding:15px;margin:10px 0;text-align:center;line-height:1.5;letter-spacing:2px;font-family:monospace;overflow-x:auto;white-space:pre-wrap;box-shadow:inset 0 0 5px #0000004d}.win-state pre{border-left:3px solid #4CAF50}.lose-state pre{border-left:3px solid #F44336}.lose-message{text-align:center;display:flex;justify-content:center;align-items:center;padding:15px;background:#2a1f1f;border:2px solid #ff6b6b;border-radius:8px;color:#ff6b6b;font-weight:700;height:83px;width:276px}.win-message{text-align:center;display:flex;justify-content:center;align-items:center;padding:15px;background:#1e1e1e;border:2px solid #4CAF50;border-radius:8px;color:#4caf50;font-weight:700;height:83px;width:276px}button:disabled{opacity:.5;cursor:not-allowed!important}