@import"https://fonts.googleapis.com/css2?family=Major+Mono+Display&family=Roboto:wght@400;500;600;700&display=swap";html,body{overflow-x:hidden;width:100%}body{margin:0;font-family:Roboto,-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;background-image:linear-gradient(135deg,#f5f5f5,#ebebeb);color:var(--text-color);min-height:100vh;display:flex;flex-direction:column;align-items:center;width:100%}:root{--primary-color: #2c3e50;--primary-color-dark: #1a252f;--secondary-color: #3498db;--background-color: #F1F5F9;--text-color: #2c3e50;--success-color: #2ecc71;--error-color: #e74c3c}*{margin:0;padding:0;box-sizing:border-box}.game-container{display:flex;flex-direction:column;align-items:center;width:100%;max-width:1200px;margin:70px auto 0;padding:20px;height:auto;min-height:calc(100vh - 70px);overflow:hidden}body.intro-active .game-container,body.intro-active .header-banner,body.intro-active .modal-overlay{display:none}body:not(.intro-active) .game-container{opacity:1}.game-main-content{width:100%;display:flex;flex-direction:column;align-items:center;gap:10px;flex:1;justify-content:space-between}.center-content{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;max-width:800px}.left-sidebar{background:var(--card-bg);border-radius:8px;padding:20px;box-shadow:0 2px 4px #0000001a}.right-sidebar{position:sticky;top:80px;height:fit-content;padding:0 20px}.stats{display:flex;flex-direction:column;gap:12px;width:180px;margin-bottom:20px}.image-section{position:relative;width:100%;display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.image-container{position:relative;width:400px;max-width:400px;aspect-ratio:16/9;border-radius:4px;overflow:hidden;box-shadow:0 4px 20px #0000001f,0 2px 8px #00000014;margin:0 auto;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:none}.image-container img{width:100%;height:100%;object-fit:cover;transition:filter .5s ease-out;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}.guess-log{position:relative;width:520px;min-height:300px;perspective:1000px;margin-bottom:12px;cursor:pointer}.guess-log .card-front,.guess-log .card-back{position:absolute;width:180px;min-height:300px;height:auto;backface-visibility:hidden;transition:transform .6s;transform-style:preserve-3d;border-radius:4px;padding:16px;background:#2c2c2c;box-shadow:0 2px 8px #00000014,0 1px 4px #0000000a}.guess-log h3{margin:0 0 16px;font-size:16px;color:#fff;font-weight:600;letter-spacing:.5px;text-align:center;text-transform:uppercase}.guess-entry{padding:0;background:none;border-radius:0;font-size:24px;font-weight:700;color:#ffffffe6;transition:all .2s ease;border-left:4px solid transparent;display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center}.guess-entry.has-correct-letters{background:#4caf5033;border-left:4px solid #4CAF50;color:#4caf50}.dark-mode .guess-entry{background:#ffffff0d;color:#ffffffe6}.dark-mode .guess-entry.has-correct-letters{background:#4caf5026;border-left:4px solid #4CAF50;color:#81c784}.input-section{margin:12px auto;padding:16px;width:100%;max-width:600px;display:flex;flex-direction:column;align-items:center;gap:12px;z-index:10;background:#fffc;border-radius:16px;border:3px solid rgba(255,255,255,.95);box-shadow:0 8px 24px #0000001f,0 4px 12px #00000014;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.current-guess{display:flex;gap:8px;justify-content:center;align-items:center}.letter-block{display:none}@keyframes jiggle{0%{transform:translate(0)}25%{transform:translate(-5px)}50%{transform:translate(5px)}75%{transform:translate(-5px)}to{transform:translate(0)}}@keyframes errorPopup{0%{opacity:0;transform:translate(-50%,10px)}20%{opacity:1;transform:translate(-50%)}80%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-10px)}}.error-message{position:absolute;top:-40px;left:50%;transform:translate(-50%);background-color:var(--error-color);color:#fff;padding:8px 16px;border-radius:4px;font-size:14px;font-weight:500;white-space:nowrap;animation:errorPopup 2s ease-out forwards;z-index:100}.jiggle{animation:jiggle .5s ease-in-out}.previous-guesses-container{position:relative;margin:10px 0;padding:0;width:100%;display:flex;justify-content:center;outline:none}.game-header{display:flex;justify-content:center;align-items:center;position:relative;margin-bottom:1.5rem}.header-banner{position:fixed;top:0;left:0;right:0;height:60px;background:linear-gradient(to right,#690b22,#7d1a2d);display:flex;justify-content:center;align-items:center;padding:0 20px;z-index:100;box-shadow:0 2px 10px #0000001a}body:not(.intro-active) .header-banner{opacity:1;transform:translateY(0)}.header-content{display:grid;grid-template-columns:200px 1fr 200px;align-items:center;width:100%;max-width:1200px;padding:0 20px;margin:0 auto}.header-center{display:flex;align-items:center;justify-content:center;width:513px;margin:0 auto}.header-stats{display:flex;justify-content:center;align-items:center}.stat-text{color:#fff;font-size:16px;font-weight:500;font-family:Major Mono Display,monospace;letter-spacing:1px}.stat-number{font-weight:700;color:#fffffff2;text-shadow:0 0 8px rgba(255,255,255,.3);transition:all .3s ease}@keyframes attemptChange{0%{transform:scale(1)}50%{transform:scale(1.2);text-shadow:0 0 15px rgba(255,255,255,.6)}to{transform:scale(1)}}.attempt-change{animation:attemptChange .5s ease-out}.header-buttons{display:flex;gap:32px;align-items:center;justify-content:flex-end}.header-content h1{margin:0;color:#fff;font-size:32px;font-weight:800;letter-spacing:3px;text-transform:uppercase;font-family:Major Mono Display,monospace;position:relative;background:linear-gradient(to bottom,#fff,#ffffffe6,#fffc);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 10px rgba(255,255,255,.3),0 0 20px rgba(255,255,255,.2),0 0 30px rgba(255,255,255,.1);transition:all .3s ease;filter:blur(0px)}.header-content h1:hover{animation:textBlur 3s ease-in forwards}@keyframes textBlur{0%{filter:blur(0px);opacity:1}to{filter:blur(8px);opacity:.7}}.header-buttons button{width:38px;height:38px;border-radius:50%;background:#fff3;border:none;cursor:pointer;color:#fff;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.header-buttons button:hover{background:#ffffff4d;transform:scale(1.1)}.header-buttons button:active{transform:scale(.95)}.header-buttons button svg{width:24px;height:24px;color:#fff}.mode-toggle,.dark-mode-toggle,.switch-container,.switch-label,.switch-description,.switch-slider{display:none}.tips-button{position:relative;width:40px;height:40px;border-radius:50%;background:#fff3;border:none;cursor:pointer;color:#fff;font-size:20px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.tips-button:hover{background:#ffffff4d;transform:scale(1.1)}.tips-button:active{transform:scale(.95)}.help-button{position:relative;width:40px;height:40px;border-radius:50%;background:none;border:none;cursor:pointer;color:#fff;font-size:20px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.help-button:hover{transform:scale(1.1);color:#fffc}.help-button:active{transform:scale(.95)}h1{color:var(--primary-color);margin-bottom:0}.stat-card{position:relative;width:180px;min-height:90px;perspective:1000px;margin-bottom:8px;cursor:pointer}.stat-card .card-front,.stat-card .card-back{position:absolute;width:180px;min-height:90px;height:auto;backface-visibility:hidden;transition:transform .6s;transform-style:preserve-3d;border-radius:4px;padding:16px;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:0 2px 8px #00000014,0 1px 4px #0000000a}.stat-card .card-front{transform:rotateY(0)}.stat-card .card-back{position:absolute;width:180px;height:auto;backface-visibility:hidden;transition:transform .6s;transform-style:preserve-3d;transform:rotateY(180deg);text-align:left;justify-content:flex-start;padding:16px;background:#2c2c2c;border-radius:0;box-shadow:0 2px 8px #0000001a}.stat-card .card-back p{font-size:15px;line-height:1.5;font-weight:500;color:#fff;margin:0;padding:0}.stat-card:hover .card-front{transform:rotateY(180deg)}.stat-card:hover .card-back{transform:rotateY(360deg)}.stat-card .stat-label{color:#ffffffe6;font-size:12px;margin-bottom:4px;text-align:center;line-height:1.2;word-wrap:break-word;width:100%;text-transform:uppercase;letter-spacing:.5px;font-weight:600}.stat-card .stat-value{color:#fff;font-size:24px;font-weight:700;text-align:center;line-height:1.2;word-wrap:break-word;width:100%;text-shadow:0 1px 2px rgba(0,0,0,.2)}.guess-log .card-front{transform:rotateY(0)}.guess-log .card-back{position:absolute;width:180px;height:auto;backface-visibility:hidden;transition:transform .6s;transform-style:preserve-3d;transform:rotateY(180deg);text-align:left;justify-content:flex-start;padding:16px;background:#2c2c2c;border-radius:4px;box-shadow:0 2px 8px #00000014,0 1px 4px #0000000a}.guess-log .card-back p{font-size:15px;line-height:1.5;font-weight:500;color:#fff;margin:0;padding:0}.guess-list{display:flex;flex-direction:column;gap:8px;width:100%;padding:0;margin:0;list-style:none}.stat-card.streak .card-front,.stat-card.attempts .card-front{background:#2c2c2c}.stat-card.flipped,.guess-log.flipped{transform:none}.stat-card .stat-label{color:#ffffffe6}.stat-card .stat-value{color:#fff}.guess-log .guess-list{max-height:none;overflow:visible}.stat-label{font-size:14px;color:#666;margin-bottom:4px;font-weight:500}.stat-value{font-size:24px;font-weight:600;color:#333}.stat-card.streak,.stat-card.attempts{background:none}.feedback{margin:1rem 0;font-weight:700;min-height:1.5rem;color:var(--primary-color)}.previous-guesses{margin:1rem 0;text-align:left}.previous-guesses h3{color:var(--primary-color);margin-bottom:.5rem}.previous-guesses ul{list-style:none}.previous-guesses li{padding:.5rem;margin:.25rem 0;border-radius:4px;background-color:var(--background-color)}.similarity-4{background-color:#2ecc7133;border-left:4px solid var(--success-color)}.similarity-3{background-color:#2ecc711a;border-left:4px solid #27ae60}.similarity-2{background-color:#f1c40f1a;border-left:4px solid #f1c40f}.similarity-1{background-color:#e67e221a;border-left:4px solid #e67e22}.similarity-0{background-color:#e74c3c1a;border-left:4px solid var(--error-color)}.guesses-container{width:100%;display:flex;flex-direction:column;gap:8px;margin:12px 0}.letter-blocks{display:flex;justify-content:center;gap:6px}.letter-space{width:20px}.game-over{display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:0}.game-over h2{margin-bottom:16px;color:#333}.game-over button{padding:12px 24px;font-size:16px;font-weight:600;border-radius:12px;border:none;cursor:pointer;transition:all .2s ease;background:#f8f9fa;color:#2c3e50;box-shadow:0 2px 8px #0000000d,0 1px 4px #0000001a}.game-over .share-button{background:#4caf50;color:#fff}.game-over button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0000001a,0 2px 6px #00000014}.game-over button:active{transform:translateY(0);box-shadow:0 2px 6px #0000000d,0 1px 3px #0000001a}.share-button{background:#4caf50!important}.share-button:hover{background:#388e3c!important}@media (max-width: 1024px){.game-main-content{grid-template-columns:180px 1fr 180px;gap:8px}}@media (max-width: 768px){.game-container{margin:60px auto 0;padding:8px;height:auto;min-height:calc(100vh - 60px);display:flex;flex-direction:column;justify-content:space-between}.game-main-content{flex:1;display:flex;flex-direction:column;justify-content:space-between}.image-section{margin-top:10px;margin-bottom:8px}.image-container{width:100%;max-width:280px;aspect-ratio:16/9;margin:0 auto}.previous-guesses-container{margin:6px 0}.previous-guess-box{min-width:32px;max-width:32px;width:32px;height:32px;font-size:1.1rem}.keyboard{margin-top:4px;padding:3px;gap:2px;position:relative;bottom:0}.keyboard-row{gap:2px}.keyboard-key{min-width:26px;height:38px;font-size:.85rem;padding:0 3px}.keyboard-key.enter-key{min-width:45px}.keyboard-key.backspace-key{min-width:38px}.tutorial-content{padding:8px}.tutorial-content h2{font-size:16px;margin-bottom:6px}.tutorial-content .tutorial-tagline{font-size:11px;margin-bottom:8px}.tutorial-content li{font-size:11px;padding:6px 10px;margin-bottom:3px}.modal-content{padding:12px;margin:8px}.win-title{font-size:20px;margin-bottom:8px}.win-description{font-size:16px;margin:6px 0}.win-challenge{font-size:18px;margin:8px 0 3px}.win-prompt{font-size:14px;margin:0 0 6px}.share-button{padding:8px 20px;font-size:13px;margin-top:3px}.game-over-modal{padding:16px;gap:8px}.game-over-modal h2{font-size:20px}.game-over-modal p{font-size:16px}.game-over-modal button{padding:8px 20px;font-size:14px}.header-content{grid-template-columns:1fr 1fr;padding:0 10px}.header-center{display:none}.header-left{justify-content:flex-start}.header-buttons{justify-content:flex-end}.header-content h1{font-size:24px;text-align:left}.header-tagline{font-size:10px}.header-hints{display:flex;gap:16px;margin-top:4px;font-family:Major Mono Display,monospace;font-size:14px;color:#ffffffe6;letter-spacing:1px}.header-hints span{background:#ffffff1a;padding:4px 8px;border-radius:4px}.header-hints{font-size:12px;gap:8px}.header-hints span{padding:2px 6px}}@media (max-width: 480px){.game-container{margin:50px auto 0;padding:6px}.image-container{max-width:240px}.previous-guess-box{min-width:28px;max-width:28px;width:28px;height:28px;font-size:1rem}.keyboard-key{min-width:22px;height:34px;font-size:.8rem}.keyboard-key.enter-key{min-width:40px}.keyboard-key.backspace-key{min-width:34px}}.banner{width:100%;padding:10px 20px;text-align:center;margin-bottom:20px;border-radius:4px;animation:slideDown .3s ease-in-out}.banner.info{background-color:#e3f2fd;color:#1976d2;border:1px solid #bbdefb}.banner.success{background-color:#e8f5e9;color:#2e7d32;border:1px solid #c8e6c9}.banner.error{background-color:#ffebee;color:#c62828;border:1px solid #ffcdd2}@keyframes slideDown{0%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease-out;opacity:0;visibility:hidden}body:not(.intro-active) .modal-overlay{opacity:1;visibility:visible}@keyframes fadeIn{0%{opacity:0;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}to{opacity:1;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.modal-content{background:#faf9f6;padding:24px;border-radius:20px;max-width:95%;width:700px;position:relative;box-shadow:0 4px 30px #00000026;margin:16px;height:auto;overflow:hidden}.intro-text{font-size:24px;font-weight:700;color:#1b4d3e;text-align:center;margin:24px 0 20px;line-height:1.4;letter-spacing:.3px;padding:0 20px;text-shadow:0 1px 2px rgba(0,0,0,.05)}.modal-header{text-align:center;margin-bottom:16px;position:relative}.modal-header h2{font-family:Major Mono Display,monospace;font-size:24px;letter-spacing:1px;margin:0;color:#1b4d3e}.modal-content p{margin:0 0 12px;font-size:15px;line-height:1.4;color:#1b4d3e;text-align:center}.modal-content li{margin:0;padding:12px 16px;font-size:16px;line-height:1.4;color:#1b4d3e;font-weight:500;background:#ffffff80;border-radius:12px;box-shadow:0 2px 8px #0000000d;display:flex;align-items:center;justify-content:center;text-align:center;gap:8px}.modal-content ul{list-style:none;padding:0;margin:0 0 16px;display:grid;grid-template-columns:1fr;gap:12px}.examples-section{display:flex;flex-direction:row;justify-content:center;gap:16px;margin:30px auto;max-width:600px}.example-item{flex:0 0 auto;width:160px;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px;background:#ffffffb3;border-radius:12px;box-shadow:0 2px 8px #1b4d3e1a}.example-image{width:100%;height:90px;border-radius:8px;overflow:hidden;position:relative}.example-image img{width:100%;height:100%;object-fit:cover}.example-letter-boxes{display:flex;gap:4px;margin:4px 0}.example-letter-box{width:28px;height:28px;border:2px solid rgba(153,0,17,.3);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:#901;background:#fff;text-transform:uppercase}.example-letter-box.correct{background:#4caf50;color:#fff;border:2px solid #4CAF50}.example-label{position:absolute;bottom:4px;right:4px;padding:3px 8px;background:#ffffffe6;border-radius:6px;font-size:11px;font-weight:500;color:#1b4d3e;z-index:2}@media (max-width: 480px){.examples-section{flex-direction:column;align-items:center}.example-item{width:200px}}.modal-close{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:50%;border:none;background:#ffffff80;color:#901;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px;transition:all .2s ease;z-index:10}.modal-close:hover{background:#ffffffb3;transform:rotate(90deg)}.modal h2{color:#333;margin-bottom:15px;text-align:center}.modal p{margin-bottom:20px;text-align:center}.share-button{background-color:var(--success-color);color:#fff;border:none;padding:1rem 2rem;border-radius:8px;font-size:1.2rem;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:.5rem;box-shadow:0 2px 8px #2ecc7133;animation:fadeInUp .6s ease-out .8s both}.share-button:hover{background-color:#27ae60;transform:translateY(-2px);box-shadow:0 4px 12px #2ecc714d}.share-button:active{transform:translateY(0);box-shadow:0 2px 4px #2ecc7133}@keyframes fadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}.high-contrast .letter-block.correct{background-color:#ff8c00!important;border-color:#ff8c00!important}.contrast-toggle{position:relative}.contrast-dropdown{position:absolute;top:100%;right:0;background:#fff;border-radius:8px;box-shadow:0 2px 10px #0000001a;padding:12px;margin-top:8px;width:220px;z-index:1000;animation:dropdownFade .2s ease-out}.contrast-dropdown:before{content:"";position:absolute;top:-6px;right:14px;width:12px;height:12px;background:#fff;transform:rotate(45deg);box-shadow:-2px -2px 4px #0000000d}.image-container,.letter-blocks,.guess-form{animation:fadeIn .5s ease-out}@keyframes flickerIn{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.1);opacity:.5}to{transform:scale(1);opacity:1}}.letter-block.animate-in{animation:flipIn .4s cubic-bezier(.4,0,.2,1) forwards}.clarity-progress{margin-top:10px;padding:0 10px}.clarity-bar-container{width:100%;height:8px;background-color:#e0e0e0;border-radius:4px;overflow:hidden}.clarity-bar{height:100%;background:linear-gradient(90deg,#4caf50,#8bc34a);width:0%;border-radius:4px}.clarity-labels{display:flex;justify-content:space-between;margin-top:4px;font-size:12px;color:#666}@keyframes flipIn{0%{transform:rotateX(-90deg);opacity:0}to{transform:rotateX(0);opacity:1}}.stat-card:hover,.guess-log:hover{transform:translateY(-2px)}.stat-card:hover .card-front,.guess-log:hover .card-front{box-shadow:none}.stat-card:hover .card-back,.guess-log:hover .card-back{box-shadow:0 4px 12px #0000001a,0 2px 4px #00000014}.stat-card:active,.guess-log:active{transform:translateY(0)}.tips-dropdown{position:absolute;top:calc(100% + 8px);right:0;background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;padding:16px;width:280px;z-index:1000;animation:dropdownFade .2s ease-out}@keyframes tipsDropdownFade{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.tips-dropdown h3{font-size:16px;color:#2c3e50;margin-bottom:12px;font-weight:600}.tips-list{list-style:none;padding:0;margin:0}.tips-list li{display:flex;align-items:flex-start;gap:10px;padding:8px 0;font-size:14px;color:#4a5568;line-height:1.4;border-bottom:1px solid rgba(0,0,0,.06)}.tips-list li:last-child{border-bottom:none}.tips-list li svg{width:16px;height:16px;margin-right:8px;color:#000;flex-shrink:0}@keyframes dropdownFade{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.tips-dropdown:before{content:"";position:absolute;top:-6px;right:14px;width:12px;height:12px;background:inherit;transform:rotate(45deg);box-shadow:-2px -2px 4px #0000000d}.dark-mode .header-banner{background:linear-gradient(to right,#c2410c,#ea580c)}.dark-mode .header-content h1{color:#fff}.share-modal-content{display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px;text-align:center;background:#faf9f6;border-radius:20px}.win-title{font-family:Major Mono Display,monospace;font-size:32px;letter-spacing:1px;text-align:center;margin-bottom:20px;color:#1b4d3e}.win-description{font-size:28px;color:#1b4d3e;margin:12px 0;line-height:1.4}.win-description strong{color:#901;font-weight:700}.win-subtext{font-size:18px;color:#1b4d3e;margin:4px 0}.win-challenge{font-size:28px;color:#901;font-weight:600;margin:20px 0 8px}.win-prompt{font-size:24px;color:#1b4d3e;margin:0 0 12px}.win-arrow{font-size:36px;margin:12px 0;animation:bounce 1s infinite}.share-button{padding:14px 32px;font-size:16px;background:#901!important;color:#fff;border:none;border-radius:50px;cursor:pointer;transition:all .3s ease;white-space:nowrap;box-shadow:0 0 15px #9900114d!important;text-transform:uppercase;font-weight:500;letter-spacing:.5px;margin-top:8px;animation:pulsate 2s ease-in-out infinite;font-family:Major Mono Display,monospace}.share-button:hover{background:#7d000e!important;animation:none;transform:translateY(-2px);box-shadow:0 0 25px #99001180!important}.share-button:active{transform:translateY(0);box-shadow:0 0 15px #9900114d!important}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}.intro-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#690b22;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:3000;cursor:pointer;transition:opacity .4s ease-out,visibility .4s ease-out;opacity:1;visibility:visible}.intro-overlay.fade-out{opacity:0;visibility:hidden;pointer-events:none}.eye-container{position:relative;width:400px;height:160px;margin-bottom:40px;overflow:visible;animation:floatEye 4s ease-in-out infinite}.eye{position:absolute;width:400px;height:160px;background:linear-gradient(135deg,#f0f0f0,#fff,#f0f0f0);border-radius:200px/80px;display:flex;justify-content:center;align-items:center;overflow:visible;transform-origin:center;box-shadow:inset 0 0 50px #0000001a,inset 0 0 20px #0000000d,0 0 30px #0000001a;transition:transform .1s ease-out}.eye.blinking{animation:blink .8s ease-in-out}@keyframes blink{0%{transform:scaleY(1)}20%{transform:scaleY(0)}40%{transform:scaleY(0)}60%{transform:scaleY(0)}80%{transform:scaleY(0)}to{transform:scaleY(1)}}.eye:before{content:"";position:absolute;width:380px;height:140px;background:radial-gradient(circle at center,#fff,#f0f0f0);border-radius:190px/70px;opacity:.7}.eye:after{content:"";position:absolute;width:380px;height:140px;background:radial-gradient(circle at 30% 30%,#fffc,#fff0 60%);border-radius:190px/70px;opacity:.5}.eye-pupil{width:80px;height:80px;background:radial-gradient(circle at 30% 30%,#000,#1a1a1a);border-radius:50%;position:relative;transition:transform .1s ease;z-index:2;box-shadow:inset 0 0 20px #00000080,0 0 10px #0000004d}.eye-pupil:before{content:"";position:absolute;width:100%;height:100%;background:radial-gradient(circle at 30% 30%,#2a2a2a,#000);border-radius:50%;opacity:.5}.eye-pupil:after{content:"";position:absolute;width:35px;height:35px;background:radial-gradient(circle at center,#fff,#fffc,#fff0);border-radius:50%;top:15px;right:15px;opacity:.9;box-shadow:0 0 10px #ffffff80}@keyframes floatEye{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.intro-welcome{font-family:Major Mono Display,monospace;font-size:36px;color:#fff;text-align:center;margin-bottom:80px;letter-spacing:3px;opacity:0;transform:translateY(20px);animation:welcomeFadeIn .4s ease-out forwards;animation-delay:.2s;z-index:2001;position:relative;text-shadow:0 2px 4px rgba(0,0,0,.2);background:none}.intro-welcome:before{display:none}.intro-welcome:after{display:none}@keyframes welcomeFadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.intro-title{font-family:Major Mono Display,monospace;font-size:48px;color:#fff;text-align:center;margin-bottom:40px;letter-spacing:4px;opacity:0;transform:translateY(20px);animation:fadeInUp .6s ease-out .3s forwards}.intro-subtitle{font-family:Major Mono Display,monospace;font-size:20px;color:#ffffffb3;text-align:center;margin-top:20px;letter-spacing:2px;opacity:0;transform:translateY(20px);animation:fadeInUp .6s ease-out .6s forwards}.intro-click{font-family:Major Mono Display,monospace;font-size:16px;color:#ffffff80;text-align:center;margin-top:40px;letter-spacing:2px;opacity:0;transform:translateY(20px);animation:fadeInUp .6s ease-out .9s forwards,pulse 2s ease-in-out infinite 2s}@keyframes pulse{0%{opacity:.5;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}to{opacity:.5;transform:scale(1)}}.header-left{display:flex;flex-direction:column;align-items:flex-start}.header-tagline{color:#ffffffb3;font-size:12px;margin:0;font-family:Major Mono Display,monospace;letter-spacing:1px}.tutorial-content{padding:24px;max-width:800px;margin:0 auto;text-align:center}.tutorial-content h2{font-size:22px;color:#1b4d3e;font-family:Major Mono Display,monospace;letter-spacing:1px;margin-bottom:12px;text-align:center}.tutorial-content .tutorial-tagline{font-size:14px;color:#4a3c31;text-align:center;margin-bottom:20px;font-style:italic}.tutorial-content .examples-section{display:flex;flex-direction:row;justify-content:center;gap:12px;margin:16px auto;max-width:540px}@media (max-width: 768px){.tutorial-content .examples-section{display:none}}.tutorial-content .example-item{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px;background:#ffffffb3;border-radius:8px}.tutorial-content ul{list-style:none;padding:0;margin:16px 0 0;display:flex;flex-direction:column;gap:8px}.tutorial-content li{font-size:14px;line-height:1.5;color:#1b4d3e;padding:12px 16px;background:#ffffff80;border-radius:8px;text-align:left;display:block}.tutorial-content strong{color:#901;font-weight:700;display:inline}.dark-mode .tutorial-content{background:#0006}.dark-mode .tutorial-content h2,.dark-mode .tutorial-content li{color:#f1e3d3}.dark-mode .tutorial-content .tutorial-tagline{color:#e8917a}.dark-mode .tutorial-content li{background:#ffffff1a}@media (max-width: 480px){.tutorial-content .examples-section{flex-direction:column;align-items:center}.tutorial-content .example-item{width:100%;max-width:200px}}.dark-mode .modal-content{background:#242424}.dark-mode .tutorial-content h2,.dark-mode .tutorial-content li,.dark-mode .example-label{color:#f1e3d3}.dark-mode .tutorial-tagline{color:#e8917a}.dark-mode .tutorial-content li,.dark-mode .example-item{background:#ffffff1a}.dark-mode .example-letter-box{background:#ffffff1a;color:#e8917a;border-color:#e8917a4d}.dark-mode .example-letter-box.correct{background:#e8917a33;border-color:#e8917a}.dark-mode .example-label{background:#000000b3}@keyframes pulsate{0%{transform:scale(1);box-shadow:0 0 15px #1b4d3e4d}50%{transform:scale(1.05);box-shadow:0 0 25px #1b4d3e80}to{transform:scale(1);box-shadow:0 0 15px #1b4d3e4d}}.hard-mode .guess-log,.hard-mode .clarity-progress{display:none}.dark-mode .image-section img{border-color:#0000004d;box-shadow:0 4px 20px #0000004d,0 2px 8px #0003}.dark-mode .input-section{border-color:#ffffff1a;background:#0009;box-shadow:0 8px 24px #00000040,0 4px 12px #00000026}.mode-dropdown{position:absolute;top:calc(100% + 8px);right:0;transform:none;background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;padding:16px;width:280px;z-index:1000;animation:dropdownFade .2s ease-out}.mode-dropdown:before{content:"";position:absolute;top:-6px;right:14px;transform:rotate(45deg);width:12px;height:12px;background:inherit;box-shadow:-2px -2px 4px #0000000d}.switch-container{display:flex;align-items:center;gap:12px}.switch-label{font-size:14px;color:var(--text-color);flex:1}.switch{position:relative;display:inline-block;width:44px;height:24px}.switch input{opacity:0;width:0;height:0}.switch-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.3s;border-radius:24px}.switch-slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}input:checked+.switch-slider{background-color:var(--success-color)}input:checked+.switch-slider:before{transform:translate(20px)}.switch-description{font-size:12px;color:#666;margin-top:8px;line-height:1.4}.dark-mode .mode-dropdown,.dark-mode .tips-dropdown{background:#2a2a2a;border:1px solid rgba(255,255,255,.1)}.dark-mode .mode-dropdown:before,.dark-mode .tips-dropdown:before{background:#2a2a2a;border-left:1px solid rgba(255,255,255,.1);border-top:1px solid rgba(255,255,255,.1)}.dark-mode .switch-label{color:#ffffffe6}.dark-mode .switch-description{color:#fff9}.enter-button{height:44px;min-width:64px;padding:0 18px;margin-left:18px;background:#2c2c2c!important;color:#fff!important;font-weight:700;font-size:1.1rem;border:none;border-radius:4px;cursor:pointer;transition:background .2s,box-shadow .2s,opacity .2s;box-shadow:0 2px 4px #2c2c2c14,0 1px 2px #2c2c2c0a;display:flex;align-items:center;justify-content:center}.enter-button:disabled{opacity:.5;cursor:not-allowed}.enter-button:hover:not(:disabled){background:#3a3a3a!important;box-shadow:0 4px 12px #2c2c2c1f,0 2px 6px #2c2c2c14}@media (max-width: 700px){.enter-button{height:28px;min-width:40px;font-size:.9rem;border-radius:8px;padding:0 8px;margin-left:6px}}.guess-form{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;outline:none}.guess-form:focus{outline:none}.previous-guesses-container{margin:10px 0;padding:0;width:100%;display:flex;justify-content:center;outline:none}.previous-guesses-grid{display:flex;flex-direction:column;gap:4px;width:fit-content}.previous-guess-row{display:flex;gap:4px;justify-content:center;width:fit-content}.previous-guess-box{min-width:45px;max-width:45px;width:45px;height:45px;display:flex;align-items:center;justify-content:center;background:#f7f9f8;border:1px solid #b0b6bb;border-radius:4px;color:#23423b;font-size:1.5rem;font-weight:700;transition:all .3s ease}.previous-guess-box.empty{background:#f7f9f880;border:1px dashed #b0b6bb}.previous-guess-box.current{background:#fff;border:1px solid #b0b6bb}.previous-guess-box.completed{background:#e0e0e0;border:1px solid #b0b6bb;color:#666}.previous-guess-box.active{border:2px solid #1B4D3E;box-shadow:0 0 5px #1b4d3e4d}.previous-guess-box.correct-position,.previous-guess-box.correct-letter{background:#e0e0e0;border:1px solid #b0b6bb;color:#666}.dark-mode .previous-guess-box{background:#333;border-color:#444;color:#fff}.game-over-modal{display:flex;flex-direction:column;align-items:center;gap:20px;padding:32px;text-align:center}.game-over-modal h2{font-family:Major Mono Display,monospace;font-size:32px;color:#1b4d3e;margin:0}.game-over-modal p{font-size:24px;color:#1b4d3e;margin:0}.game-over-modal strong{color:#901;font-weight:700}.game-over-modal button{padding:12px 32px;font-size:18px;font-weight:600;color:#fff;background:#1b4d3e;border:none;border-radius:50px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #1b4d3e33}.game-over-modal button:hover{transform:translateY(-2px);background:#153d32;box-shadow:0 6px 16px #1b4d3e4d}.game-over-modal button:active{transform:translateY(0);box-shadow:0 4px 12px #1b4d3e33}.dark-mode .game-over-modal h2,.dark-mode .game-over-modal p{color:#f1e3d3}.dark-mode .game-over-modal strong{color:#e8917a}.share-button-header{width:38px;height:38px;border-radius:50%;background:#fff3;border:none;cursor:pointer;color:#fff;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.share-button-header:hover{background:#ffffff4d;transform:scale(1.1)}.share-button-header:active{transform:scale(.95)}.share-button-header svg{width:24px;height:24px;color:#fff}.keyboard{margin-top:10px;width:100%;max-width:500px;display:flex;flex-direction:column;gap:4px;padding:8px;background:#ffffff1a;border-radius:16px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);outline:none;position:relative;bottom:0}.keyboard-row{display:flex;justify-content:center;gap:6px}.keyboard-key{min-width:35px;height:45px;border:none;border-radius:8px;background:#f7f9f8;color:#23423b;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;padding:0 8px;box-shadow:0 2px 4px #23423b0d,0 1px 2px #23423b08;position:relative}.keyboard-key:hover{background:#eaf6f2;transform:translateY(-2px);box-shadow:0 4px 8px #23423b14,0 2px 4px #23423b0a}.keyboard-key:active{transform:translateY(0);background:#1b4d3e1a}.keyboard-key.enter-key{min-width:65px;background:#1b4d3e;color:#fff}.keyboard-key.enter-key:hover{background:#153d32}.keyboard-key.backspace-key{min-width:50px;background:#901;color:#fff}.keyboard-key.backspace-key:hover{background:#7d000e}.keyboard-key.correct-letter{background:#4caf50;color:#fff}.keyboard-key.correct-letter:hover{background:#388e3c}.keyboard-key.wrong-letter{background:#b0b6bb;color:#fff}.keyboard-key.wrong-letter:hover{background:#a0a5aa}@media (max-width: 600px){.keyboard{padding:5px;gap:4px}.keyboard-key{min-width:32px;height:45px;font-size:1rem;padding:0 8px}.keyboard-key.enter-key{min-width:60px}.keyboard-key.backspace-key{min-width:50px}}.win-image-container{width:100%;max-width:400px;aspect-ratio:16/9;border-radius:12px;overflow:hidden;margin:0 auto 20px;box-shadow:0 4px 20px #0000001f,0 2px 8px #00000014}.win-image-container img{width:100%;height:100%;object-fit:cover}.share-modal-content .share-button{margin:0}.share-modal-content .share-button+.share-button{background:#901}.share-modal-content .share-button+.share-button:hover{background:#7d000e}.game-over-modal p.completion-message{font-size:20px;color:#1b4d3e;margin:10px 0;font-weight:500}.dark-mode .game-over-modal p.completion-message{color:#f1e3d3}.next-puzzle-button{background:var(--primary-color);color:#fff;border:none;padding:8px 16px;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.5px}.next-puzzle-button:hover{background:var(--primary-color-dark);transform:translateY(-1px)}.next-puzzle-button:active{transform:translateY(0)}.header-buttons .next-puzzle-button{margin:0 8px}.header-buttons .next-puzzle-button:hover{background:var(--primary-color-dark)}.header-buttons .next-puzzle-button:active{transform:translateY(0)}.play-now-button{margin-top:24px;padding:16px 48px;font-size:20px;font-weight:700;color:#fff;background:#901;border:none;border-radius:50px;cursor:pointer;transition:all .3s ease;animation:pulsate 2s ease-in-out infinite;box-shadow:0 4px 12px #9013;font-family:Major Mono Display,monospace;letter-spacing:1px}.play-now-button:hover{transform:translateY(-2px);background:#7d000e;box-shadow:0 6px 16px #9900114d;animation:none}.play-now-button:active{transform:translateY(0);box-shadow:0 4px 12px #9013}.dark-mode .play-now-button{background:#901;box-shadow:0 4px 12px #9013}.dark-mode .play-now-button:hover{background:#7d000e;box-shadow:0 6px 16px #9900114d}@keyframes pulsate{0%{transform:scale(1);box-shadow:0 0 15px #9900114d}50%{transform:scale(1.05);box-shadow:0 0 25px #99001180}to{transform:scale(1);box-shadow:0 0 15px #9900114d}}.clue-button{font-family:Major Mono Display,monospace;font-size:18px;letter-spacing:2px;background:none;color:#fff;border:none;border-radius:0;padding:0;height:auto;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .2s ease;font-weight:700;text-transform:uppercase}.clue-button:hover{color:#ffe0e6;background:none;transform:none}.clue-button:active{color:#ffb3c6;background:none;transform:none}.clue-modal-button{background:#901!important;color:#fff!important;font-family:Major Mono Display,monospace!important;font-size:22px!important;font-weight:700;border:none;border-radius:50px;padding:14px 40px;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s;box-shadow:0 2px 8px #99001114;animation:pulsate 2s ease-in-out infinite;letter-spacing:1px}.clue-modal-button:hover{background:#7d000e!important;color:#fff!important;box-shadow:0 4px 16px #99001126}.clue-modal-button:active{background:#60000a!important;color:#fff!important}.header-buttons .clue-button{transition:all .2s ease}.header-buttons .clue-button:hover{transform:scale(1.1);color:#ffe0e6}.header-buttons .clue-button:active{transform:scale(.95)}.header-buttons button.clue-button{width:auto;height:auto;border-radius:0;background:none;padding:0 8px;color:#fff;font-family:Major Mono Display,monospace;font-size:18px;letter-spacing:2px;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:color .2s ease;font-weight:700;text-transform:uppercase}.header-buttons button.clue-button:hover{color:#ffe0e6;background:none;transform:none}.header-buttons button.clue-button:active{color:#ffb3c6;background:none;transform:none}.clue-modal-title{font-size:2.2rem;font-family:Major Mono Display,monospace;font-weight:700;color:#1b4d3e;margin-bottom:12px}.clue-modal-desc{font-size:1.35rem;color:#1b4d3e;margin-bottom:28px;font-family:inherit}.example-letter-box.wrong{background:#b0b6bb;color:#fff;border:2px solid #b0b6bb}.header-buttons .help-button{background:none!important;box-shadow:none!important}.header-buttons .help-button:hover{background:none!important}.share-modal-content .next-puzzle-button,.game-over-modal .next-puzzle-button{width:100%;max-width:300px;height:50px;font-size:16px;font-weight:600;background:var(--primary-color);color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.5px;margin-top:10px}.share-modal-content .next-puzzle-button:hover,.game-over-modal .next-puzzle-button:hover{background:var(--primary-color-dark);transform:translateY(-1px)}.share-modal-content .next-puzzle-button:active,.game-over-modal .next-puzzle-button:active{transform:translateY(0)}