:root{--primary-color: #333333;--secondary-color: #666666;--accent-color: #999999;--text-color: #333333;--bg-color: #ffffff;--card-bg: transparent;--border-color: #dddddd;--hover-bg: #f0f0f0;--active-bg: #e0e0e0}*{margin:0;padding:0;box-sizing:border-box}body{font-family:PT Sans,sans-serif;background-color:var(--bg-color);color:var(--text-color);line-height:1.6;min-height:100vh;margin:0;overflow-x:hidden}body:has(#narrative-screen:not(.hidden)){overflow-y:auto}#app{min-height:100vh;position:relative}.screen{display:flex;position:fixed;top:0;left:0;width:100%;height:100%;padding:20px;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center;overflow-y:auto}.screen.hidden{display:none!important}#narrative-screen{position:absolute!important;height:auto!important;min-height:100vh;justify-content:flex-start!important;overflow-y:visible!important}.fade-in-content{opacity:0;transform:translateY(20px);animation:fadeInContent .8s ease-out forwards}@keyframes fadeInContent{to{opacity:1;transform:translateY(0)}}.fade-in-content-delay-1{animation-delay:.2s}.fade-in-content-delay-2{animation-delay:.4s}.fade-in-content-delay-3{animation-delay:.6s}.text-display,.consequence-text,.story-content,.game-header,.circle-container,.options-container,.game-buttons-container,.btn,.option-btn,.continue-btn,.back-button,.next-button,.commit-button{opacity:0;transform:translateY(20px);animation:fadeInContent .8s ease-out forwards}.text-display,.consequence-text,.story-content{animation-delay:.1s}.game-header{animation-delay:.2s}.circle-container{animation-delay:.3s}.options-container{animation-delay:.4s}.game-buttons-container{animation-delay:.5s}.btn,.continue-btn,.back-button{animation-delay:.6s}.option-btn{animation-delay:.7s}.next-button,.commit-button{animation-delay:.6s}#title-screen{text-align:center}#title-screen h1{font-size:4rem;margin-bottom:2rem;color:var(--primary-color)}#play-button,#continue-button{padding:15px 40px;font-size:1.5rem;cursor:pointer;background-color:var(--secondary-color);color:#fff;border:1px solid var(--border-color);border-radius:4px;transition:transform .2s,background-color .2s}#play-button:hover,#continue-button:hover{background-color:#555;transform:scale(1.05)}.score-display{position:fixed;top:20px;right:20px;background-color:#000000d9;color:#fff;padding:12px 20px;border-radius:8px;font-size:15px;box-shadow:0 2px 10px #0000001a;z-index:1000;border:1px solid rgba(255,255,255,.1)}.score-display div{margin:5px 0;display:flex;justify-content:space-between;min-width:160px}#redemption-rate,#round-display{font-weight:700;color:#888;margin-left:10px}.text-display{background-color:transparent;padding:.5rem 3rem;margin:1.5rem 0;text-align:left;line-height:1.7;font-size:.95rem;color:var(--text-color);max-width:1000px;width:100%;min-height:150px}#game-screen{justify-content:flex-start;padding:2rem 4rem}.btn{background-color:var(--secondary-color);color:#fff;border:1px solid var(--border-color);padding:12px 24px;font-size:16px;cursor:pointer;border-radius:4px;transition:all .3s ease;margin:10px 0;font-family:PT Sans,sans-serif;font-weight:500;box-shadow:0 2px 4px #0000001a}.back-button{background-color:#ffffffe6;border:2px solid #4a5258;border-radius:6px;color:#333;padding:10px 20px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 6px #00000026;text-transform:uppercase;letter-spacing:.5px;margin-right:auto;min-width:160px;text-align:center}.back-button:hover{background-color:#4a5258;color:#fff;transform:translateY(-2px);box-shadow:0 4px 10px #00000040}.back-button:active{transform:translateY(0);box-shadow:0 2px 4px #0003}.btn:hover{background-color:#777;transform:translateY(-2px);box-shadow:0 2px 5px #0000001a}.btn:active{transform:translateY(0)}.continue-btn,.show-options-btn{background-color:#777!important;border-color:#666!important;color:#fff!important;margin:20px auto;display:block;padding:12px 30px;font-size:1.1rem;transition:all .2s ease}.continue-btn:hover,.show-options-btn:hover{background-color:#666!important;transform:translateY(-2px);box-shadow:0 2px 5px #0000001a}.hidden{display:none!important}.game-buttons{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:400px;margin:2rem auto 0;gap:1rem;padding:0 1rem}.next-button{position:relative;left:auto;bottom:auto;transform:none;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid #ddd;font-size:1.5rem;cursor:pointer;margin-left:auto}.next-button:hover{background:#f0f0f0}#options-container{display:flex;flex-direction:column;gap:1.1rem;width:100%;max-width:750px;margin:20px auto;padding:20px;opacity:0;transform:translateY(20px);transition:opacity .3s ease,transform .3s ease}#options-container:not(.hidden){opacity:1;transform:translateY(0)}.option-btn{background-color:#fff;color:var(--text-color);border:1px solid var(--border-color);padding:1rem 2rem;border-radius:8px;font-size:1rem;font-family:PT Sans,sans-serif;cursor:pointer;transition:all .2s ease;text-align:left;width:100%;box-shadow:0 2px 5px #0000001a}.option-btn:hover{background-color:var(--hover-bg);transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.option-button:disabled,.option-button.exhausted,.option-btn:disabled,.option-btn.exhausted,.option:disabled,.option.disabled,.option.exhausted{opacity:.6;cursor:not-allowed;background-color:#f0f0f0!important;color:#999!important;border-color:#ddd!important;position:relative;text-decoration:line-through!important;filter:grayscale(100%)}.option-button:disabled,.option-button.exhausted,.option-btn:disabled,.option-btn.exhausted,.option:disabled,.option.disabled,.option.exhausted,#options-container .option-button:disabled,#options-container .option-button.exhausted,#options-container .option-btn:disabled,#options-container .option-btn.exhausted,#options-container .option:disabled,#options-container .option.disabled,#options-container .option.exhausted{pointer-events:none}.option-button:disabled:hover,.option-button.exhausted:hover,.option-btn:disabled:hover,.option-btn.exhausted:hover,.option:disabled:hover,.option.disabled:hover,.option.exhausted:hover{transform:none!important;box-shadow:none!important;background-color:#f0f0f0!important;text-decoration:line-through!important}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-10px)}20%,40%,60%,80%{transform:translate(10px)}}@keyframes flash-red{0%{background-color:#ff000080}to{background-color:transparent}}#shade-game-screen.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both;transform:translateZ(0);backface-visibility:hidden;perspective:1000px}.flash-overlay{position:absolute;inset:0;background-color:transparent;animation:flash-red .5s ease-out;pointer-events:none;z-index:1000}.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}.flash-red{animation:flash-red .5s ease-out}.option-btn:active{transform:translateY(0);box-shadow:0 2px 3px #0000001a}#options-container:not(.hidden){display:flex;opacity:1;visibility:visible;transition:opacity .3s ease,transform .3s ease}.option{opacity:0;transform:translateY(20px) scale(.95)}.option-btn{background-color:#fff;color:var(--text-color);border:1px solid var(--border-color);padding:1rem;margin:.5rem 0;border-radius:5px;cursor:pointer;transition:all .2s ease;text-align:left}.option-btn:hover{background-color:var(--hover-bg);border-color:var(--accent-color)}.option-btn:active{background-color:var(--active-bg)}.story-content{max-width:800px;padding:0 20px;margin-bottom:60px;text-align:center}.story-content p{font-size:18px;line-height:1.6}.options-container{max-width:800px;width:100%;margin-bottom:60px}.options-grid{display:flex;flex-direction:column;gap:15px}.option-button{display:block;width:100%;padding:20px;font-size:16px;font-family:PT Sans,sans-serif;cursor:pointer;border-radius:12px;border:2px solid #333;background:#f5f5f5;transition:all .3s ease}.option-button:hover:not(:disabled):not(.exhausted){background:#e8e8e8;transform:translateY(-2px)}.game-buttons-container{display:flex;flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:500px;padding:2rem;background-color:var(--card-bg);border-radius:10px;box-shadow:0 4px 6px #0000001a;position:relative;margin-bottom:20px}.back-button{position:absolute;top:1rem;left:1rem;background-color:var(--card-bg);border:none;padding:.5rem 1rem;border-radius:5px;cursor:pointer;font-size:1rem;transition:all .2s ease}.back-button:hover{background-color:var(--hover-bg)}#game-container{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%;max-width:800px}.game-header{display:flex;justify-content:center;gap:60px;margin-top:160px;margin-bottom:5px;flex-wrap:wrap}.circle-container{display:flex;flex-direction:column;align-items:center;gap:10px;position:relative;padding-bottom:60px}.circle-label{font-size:14px;font-weight:700;color:var(--text-color);text-align:center}.circle{width:80px;height:80px;border-radius:50%;border:2px solid #333;transition:all .2s ease;flex-shrink:0;box-shadow:0 4px 8px #0000001a}.circle[data-preview=true]{opacity:.8;transform:scale(.95);box-shadow:0 0 10px #0003}#spectrum{width:500px;height:62.5px;background:linear-gradient(to right,#000,#fff);border:2px solid #333;cursor:pointer;position:relative}.commit-button-container{display:flex;justify-content:center;margin:20px 0;width:100%}.commit-button{background-color:#f8f9fa;border:2px solid #4a5258;border-radius:6px;color:#333;cursor:pointer;font-size:1rem;font-weight:500;padding:10px 24px;transition:all .2s ease;text-align:center;min-width:150px;opacity:0;pointer-events:none;white-space:nowrap}.commit-button:not(.hidden){opacity:1;pointer-events:auto;animation:fadeIn .3s ease-out}.commit-button:hover{background-color:#e9ecef;transform:translateY(-2px);box-shadow:0 4px 10px #00000040}.commit-button:active{transform:translateY(0);box-shadow:0 2px 4px #0003}.commit-button:focus{outline:2px solid #4a5258;outline-offset:2px}#consequences-screen{justify-content:flex-start;padding:2rem 192px}.consequences-container{max-width:100%;width:100%}.consequence-text{background-color:transparent;padding:.5rem 3rem;margin:1.5rem 0;text-align:left;line-height:1.7;font-size:.95rem;color:var(--text-color);width:100%;min-height:150px}#interlude-screen{text-align:center}.interlude-content{max-width:600px}.interlude-content p{font-size:18px;line-height:1.6;margin-bottom:30px}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes flashRed{0%{background-color:transparent}50%{background-color:#ff00004d}to{background-color:transparent}}.flash-red{animation:flashRed .5s ease-in-out}.match-the-shade-animation{position:absolute;top:20%;left:50%;transform:translate(-50%);z-index:1000;pointer-events:none;text-align:center;font-size:2.5rem;font-weight:700;color:var(--text-color);text-transform:lowercase;letter-spacing:2px;opacity:0;animation:matchShadeAppear 2s ease-out forwards}@keyframes matchShadeAppear{to{opacity:1}}.match-the-shade-animation.fade-out{animation:matchShadeFadeOut 1s ease-out forwards}@keyframes matchShadeFadeOut{0%{opacity:1;transform:translate(-50%) scale(1)}to{opacity:0;transform:translate(-50%) scale(.9)}}@media(max-width:600px){.screen{padding:1rem}#title-screen h1{font-size:2rem}.btn{padding:.6rem 1.5rem;font-size:.9rem}.score-display{font-size:.9rem;top:.5rem;right:.5rem;padding:8px 12px}.text-display{padding:.5rem 1rem;font-size:.9rem}#consequences-screen{padding:1rem}.consequence-text{padding:.5rem 1rem;font-size:.9rem}#spectrum{width:100%;max-width:400px}.game-header{gap:20px}.circle{width:50px;height:50px}}#game-over-screen{background:linear-gradient(135deg,#fff,#f8f9fa);color:#333;text-align:center}.game-over-container{background:#ffffffe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:3rem 2rem;max-width:500px;width:100%;border:1px solid rgba(0,0,0,.1);box-shadow:0 20px 40px #0000001a;animation:fadeInUp 1s ease-out}#game-over-screen h1{font-size:3.5rem;font-weight:700;margin-bottom:.5rem;text-shadow:0 2px 10px rgba(0,0,0,.1);background:linear-gradient(45deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.game-year{font-size:1.2rem;font-weight:300;margin-bottom:1rem;opacity:.7;letter-spacing:2px}.game-author{font-size:1.1rem;font-weight:400;margin-bottom:.5rem;font-style:italic;opacity:.8}.game-credits{font-size:.9rem;margin-bottom:2rem;opacity:.6;line-height:1.4}.final-stats{font-size:1.3rem;font-weight:600;margin-bottom:2rem;padding:1rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:10px;border:1px solid rgba(102,126,234,.3)}#game-over-screen .btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:1rem 2rem;font-size:1.1rem;font-weight:600;border-radius:50px;transition:all .3s ease;box-shadow:0 10px 25px #667eea4d}#game-over-screen .btn:hover{background:linear-gradient(135deg,#5a6fd8,#6a4190);transform:translateY(-3px);box-shadow:0 15px 35px #667eea66}#game-over-screen .btn:active{transform:translateY(-1px)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media(max-width:600px){.game-over-container{padding:2rem 1.5rem;margin:1rem}#game-over-screen h1{font-size:2.5rem}.game-year,.game-author{font-size:1rem}.game-credits{font-size:.8rem}.final-stats{font-size:1.1rem;padding:.8rem}#game-over-screen .btn{padding:.8rem 1.5rem;font-size:1rem}}