:root{--bg: #0f0e10;--paper: #1b1a1e;--ink: #f6f3ea;--muted: #b8b1a0;--gold: #e9c46a}*{box-sizing:border-box}body{font-family:ui-serif,Georgia,serif;color:var(--ink);background:linear-gradient(#0b0a0d,#19171f);min-height:100vh;overflow:auto;display:flex;align-items:center;justify-content:center}.topnav{display:flex;gap:.75rem;padding:12px 16px;background:#151419;position:sticky;top:0}.topnav a{color:var(--muted);text-decoration:none;padding:6px 10px;border-radius:8px}.topnav a:hover{background:#222129;color:var(--ink)}:root{--bg: #0b1020;--bg-2: #111735;--card: rgba(255,255,255,.08);--border: rgba(255,255,255,.18);--text: #e9edf5;--muted: #b8c2d9;--accent: #8fd3ff;--accent-strong: #34b5ff;--success: #88d498;--danger: #ff6b6b;--shadow: 0 10px 30px rgba(0,0,0,.35);--radius: 18px;--ring: 0 0 0 3px rgba(52,181,255,.35)}.login-page{display:grid;place-items:center;position:relative;overflow:hidden;padding:32px 16px}.login-page:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.28) .9px,transparent 1px),radial-gradient(circle,rgba(255,255,255,.18) .8px,transparent 1px);background-size:18px 18px,28px 28px;background-position:0 0,9px 14px;opacity:.07;pointer-events:none;animation:drift 28s linear infinite}@keyframes drift{0%{transform:translateY(-2%)}to{transform:translateY(2%)}}.login-card{width:min(560px,100%);background:var(--card);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px;color:var(--text)}.login-header{display:flex;align-items:center;gap:14px;margin-bottom:18px}.login-logo{width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-strong));box-shadow:0 6px 18px #1482dc59}.login-title{font-size:clamp(1.35rem,2.6vw,1.8rem);font-weight:700;letter-spacing:.2px}.login-subtitle{margin-top:2px;color:var(--muted);font-size:.95rem}.login-form{display:grid;gap:14px;margin-top:8px}.form-row{display:grid;gap:6px}.label{font-size:.9rem;color:var(--muted)}.input{appearance:none;width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:#ffffff0a;color:var(--text);outline:none;transition:border-color .15s ease,box-shadow .15s ease,background .2s}.input::placeholder{color:color-mix(in oklab,var(--muted) 65%,transparent)}.input:focus{border-color:var(--accent);box-shadow:var(--ring);background:#ffffff0f}.actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;flex-wrap:wrap}.hint{font-size:.9rem;color:var(--muted);display:flex;align-items:center;gap:8px}.hint .dot{width:8px;height:8px;border-radius:999px;background:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}.message{padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:#ffffff0a;font-size:.95rem}.message.error{border-color:color-mix(in oklab,var(--danger) 60%,var(--border));color:var(--danger);background:color-mix(in oklab,var(--danger) 12%,transparent)}.message.success{border-color:color-mix(in oklab,var(--success) 60%,var(--border));color:var(--success);background:color-mix(in oklab,var(--success) 10%,transparent)}.button{cursor:pointer;border:none;padding:12px 16px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#fff;font-weight:600;letter-spacing:.2px;box-shadow:0 8px 20px #1e8cf059;transition:transform .06s ease,filter .15s ease,box-shadow .15s ease,opacity .2s}.is-validated .button{animation:twinkle 2.2s ease-in-out 1 .2s}@keyframes twinkle{0%,to{box-shadow:0 8px 20px #1e8cf059}50%{box-shadow:0 0 0 3px #ffffff2e,0 10px 28px #1e8cf08c}}.login-footer{margin-top:18px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;color:var(--muted);font-size:.9rem}.login-footer a{color:var(--accent);text-decoration:none;border-bottom:1px dashed color-mix(in srgb,var(--accent) 40%,transparent)}.login-footer a:hover{color:var(--accent-strong);border-bottom-color:currentColor}@media(max-width:420px){.login-card{padding:22px}}.container{display:flex;flex-direction:column;align-items:center;padding:20px;font-family:monospace;position:relative;background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));border-radius:20px;box-shadow:inset 0 0 20px #e9c46a1a,0 10px 40px #00000080,0 0 80px #e9c46a0d;border:2px solid rgba(233,196,106,.3);overflow:hidden}.title{font-size:2.5rem;font-weight:700;margin:0 0 20px;letter-spacing:.3rem;display:inline-block;background:linear-gradient(135deg,var(--gold),var(--bronze));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:titleGlow 3s ease-in-out infinite;text-shadow:0 2px 4px rgba(0,0,0,.5),0 0 20px rgba(233,196,106,.3)}.grid-container{display:grid;grid-template-columns:auto repeat(10,60px);grid-template-rows:auto repeat(10,60px);gap:1px;position:relative;padding:15px;background:#0f0e1080;border-radius:10px;box-shadow:inset 0 2px 10px #0000004d}.clue-top{background:linear-gradient(145deg,var(--bronze),var(--dark-bronze));display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--ink);border-radius:4px;box-shadow:inset 0 -2px #0003,0 2px 4px #0000004d;transition:all .2s ease}.clue-cell{background:linear-gradient(145deg,#b8733366,#cd7f324d);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--ink);border-radius:4px;box-shadow:inset 0 -1px #0003,0 1px 2px #0000004d;transition:all .2s ease}.clue-cell:hover,.clue-top:hover{transform:scale(1.05);box-shadow:inset 0 -2px #0003,0 3px 6px #0006}.cell{width:60px;height:60px;border:2px solid rgba(184,177,160,.3);border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;position:relative;transition:all .3s ease;box-shadow:inset 0 -2px #0003,0 2px 4px #0000004d;transform-style:preserve-3d}.cell.empty{background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));color:var(--muted)}.cell.empty:hover{transform:translateY(-2px);box-shadow:inset 0 -2px #0003,0 4px 8px #0006;border-color:#e9c46a66}.cell.filled{background:linear-gradient(145deg,var(--green-dark),var(--green-light));border-color:var(--green-light);color:var(--ink);animation:correctPulse .6s}.cell.marked{background:linear-gradient(145deg,#3a3a3c,#2c2c2e);border-color:#3a3a3c;color:var(--muted);opacity:.8}.cell.marked:before{content:"✕";font-size:24px;color:#b8b1a099}.cell.complete{animation:completePulse 1s ease}@keyframes completePulse{0%{transform:scale(1) rotate(0)}25%{transform:scale(1.1) rotate(5deg)}50%{transform:scale(1.15) rotate(-5deg)}75%{transform:scale(1.1) rotate(5deg)}to{transform:scale(1) rotate(0)}}.cell.filled:after{content:"";position:absolute;bottom:100%;left:50%;transform:translate(-50%);width:10px;height:10px;background:#ffffff4d;border-radius:50%;animation:steamRise 2s ease-out forwards;pointer-events:none}@keyframes steamRise{0%{transform:translate(-50%) translateY(0) scale(.5);opacity:.8}to{transform:translate(-50%) translateY(-30px) scale(1.5);opacity:0}}.grid-container>div{box-sizing:border-box}.grid-container>div:nth-child(11n+1){border-left:2px solid var(--gold)}.grid-container>div:nth-child(n+1):nth-child(-n+11){border-top:2px solid var(--gold)}.button{margin-top:20px;padding:12px 24px;font-size:16px;font-weight:700;background:linear-gradient(145deg,var(--bronze),var(--dark-bronze));color:var(--ink);border:2px solid rgba(233,196,106,.5);border-radius:20px;cursor:pointer;transition:all .3s ease;box-shadow:0 3px 10px #0000004d,inset 0 1px #fff3;position:relative;overflow:hidden}.button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #0006,inset 0 1px #ffffff4d}.button:active{transform:translateY(0);box-shadow:inset 0 -1px #0000004d,0 1px 2px #0000004d}.status{margin-top:15px;padding:15px;font-size:1.2rem;font-weight:700;color:var(--ink);text-align:center;border-radius:10px;background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));border:2px solid var(--green-light);box-shadow:0 4px 10px #0000004d,inset 0 0 20px #4a7c2e33;animation:slideDown .5s ease-out}.level-select{width:100%;display:flex;align-items:center;justify-content:center;padding:10px;margin:10px 0;background:linear-gradient(145deg,#b8733333,#cd7f321a);border:2px solid rgba(233,196,106,.3);border-radius:10px;color:var(--ink);font-weight:700;transition:all .3s ease;box-shadow:inset 0 1px #ffffff1a,0 2px 4px #0000004d}.level-select:hover{cursor:pointer;background:linear-gradient(145deg,var(--bronze),var(--dark-bronze));border-color:var(--gold);transform:translateY(-2px);box-shadow:0 4px 8px #0006,inset 0 1px #fff3}.level-select:active{transform:translateY(0)}.hide{display:none;opacity:0;transition:opacity .3s ease}.snowflake{position:absolute;top:-10px;font-size:1rem;color:#fffc;animation:snowfall linear infinite}@media(max-width:480px){.container{padding:15px}.title{font-size:2rem;letter-spacing:.2rem}.grid-container{grid-template-columns:auto repeat(10,45px);grid-template-rows:auto repeat(10,45px)}.cell{width:45px;height:45px;font-size:14px}.clue-top,.clue-cell{font-size:10px}.button{padding:10px 20px;font-size:14px}}.button{cursor:pointer;border:none;padding:12px 16px;border-radius:12px;background:linear-gradient(135deg,var(--bronze),var(--dark-bronze));color:#fff;font-weight:600;letter-spacing:.2px;transition:transform .06s ease,filter .15s ease,box-shadow .15s ease,opacity .2s}.button:hover{filter:brightness(1.04)}.button:active{transform:translateY(1px)}.button:focus-visible{outline:none;box-shadow:var(--ring)}.button[disabled],.is-loading .button{opacity:.7;cursor:not-allowed;filter:saturate(.7)}.completion-conatiner{display:grid;grid-template-columns:auto;grid-template-rows:repeat(2,1fr) auto}.grid-container.flower .cell.filled{background:linear-gradient(145deg,#ff69b4,#ff1493);border-color:#ff1493}.grid-container.flower .cell.marked{background:linear-gradient(145deg,#ffe4e1,pink);border-color:pink}.grid-container.chocolate .cell.filled{background:linear-gradient(145deg,#8b4513,sienna);border-color:#8b4513}.grid-container.chocolate .cell.marked,.grid-container.chocolate .cell.empty{background:linear-gradient(145deg,tan,#deb887);border-color:#deb887}.riddle-card{position:relative;width:100%;max-width:320px;background:linear-gradient(145deg,#1b1a1ef2,#151419f2);border:2px solid rgba(233,196,106,.3);border-radius:20px;padding:20px;cursor:pointer;transition:all .4s ease;box-shadow:inset 0 0 20px #e9c46a1a,0 5px 20px #0006,0 0 40px #e9c46a0d;overflow:hidden;transform-style:preserve-3d}.riddle-card:hover:not(.locked):not(.completed){transform:translateY(-8px) rotateX(2deg);box-shadow:inset 0 0 30px #e9c46a33,0 15px 40px #00000080,0 0 60px #e9c46a26;border-color:#e9c46a}.riddle-card.locked{opacity:.7;cursor:not-allowed;background:linear-gradient(145deg,#141316f2,#0f0e11f2)}.riddle-card.completed{background:linear-gradient(145deg,#2d50164d,#4a7c2e33);border-color:#4a7c2e80}.riddle-card.in-progress{border-color:#e9c46a80;box-shadow:inset 0 0 25px #e9c46a26,0 5px 20px #0006,0 0 50px #e9c46a1a}.lock-overlay{position:absolute;inset:0;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;border-radius:18px}.lock-icon{font-size:3rem;animation:lockPulse 2s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}@keyframes lockPulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.unlock-timer{margin-top:10px;font-size:.9rem;font-weight:700;color:#e9c46a;text-shadow:0 2px 4px rgba(0,0,0,.5);background:#0006;padding:5px 15px;border-radius:20px;border:1px solid rgba(233,196,106,.3)}.completed-overlay{position:absolute;top:20px;right:-40px;transform:rotate(15deg);z-index:10}.completed-stamp{background:linear-gradient(145deg,#2d5016,#4a7c2e);color:#f4f3ee;padding:8px 50px;font-weight:700;font-size:.9rem;border:2px solid #4a7c2e;box-shadow:0 4px 10px #0000004d;letter-spacing:.1em}.card-header{display:flex;align-items:center;gap:15px;margin-bottom:20px}.card-icon{font-size:2.5rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));animation:iconFloat 3s ease-in-out infinite}@keyframes iconFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.card-title{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#e9c46a,#cd7f32);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 2px 4px rgba(0,0,0,.3);margin:0}.card-body{position:relative}.progress-section{margin-bottom:15px}.progress-label{font-size:.9rem;color:#b8b1a0;margin-bottom:8px;font-weight:600}.progress-bar{position:relative;height:12px;background:linear-gradient(145deg,#0f0e1099,#0a090b99);border-radius:20px;overflow:hidden;box-shadow:inset 0 2px 4px #0000004d;border:1px solid rgba(184,177,160,.2)}.progress-fill{height:100%;background:linear-gradient(90deg,#cd7f32,#e9c46a);border-radius:20px;transition:width .5s ease;box-shadow:0 0 10px #e9c46a66;position:relative;overflow:hidden}.progress-fill:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 2s infinite}@keyframes shimmer{to{left:100%}}.progress-gears{position:absolute;top:-2px;right:5px;display:flex;gap:2px}.gear{font-size:16px;color:#e9c46a99;animation:rotate 4s linear infinite}.gear-2{animation-direction:reverse;animation-duration:3s}.status-section{margin-bottom:10px}.status-badge{display:inline-block;padding:6px 15px;border-radius:20px;font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;transition:all .3s ease;box-shadow:0 2px 5px #0003}.status-badge.locked{background:linear-gradient(145deg,#3a3a3c,#2c2c2e);color:#999;border:1px solid rgba(100,100,100,.3)}.status-badge.available{background:linear-gradient(145deg,#cd7f32,#e9c46a);color:#1a1a1a;border:1px solid rgba(233,196,106,.5);animation:availablePulse 2s ease-in-out infinite}@keyframes availablePulse{0%,to{box-shadow:0 2px 5px #0003}50%{box-shadow:0 2px 15px #e9c46a80}}.status-badge.in-progress{background:linear-gradient(145deg,#b87333,#cd7f32);color:#f4f3ee;border:1px solid rgba(184,115,51,.5)}.status-badge.completed{background:linear-gradient(145deg,#2d5016,#4a7c2e);color:#f4f3ee;border:1px solid rgba(74,124,46,.5)}.help-button{position:absolute;top:-10px;right:-10px;width:32px;height:32px;border-radius:50%;background:linear-gradient(145deg,#cd7f32,#b87333);border:2px solid rgba(233,196,106,.5);color:#f4f3ee;font-size:1.2rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0000004d,inset 0 1px #fff3;display:flex;align-items:center;justify-content:center}.help-button:hover{transform:scale(1.1) rotate(-10deg);box-shadow:0 4px 12px #0006,inset 0 1px #ffffff4d}.card-decorations{pointer-events:none}.snowflake{position:absolute;color:#ffffff1a;animation:snowfallCard 10s linear infinite;pointer-events:none}.snowflake-1{top:10%;left:80%;font-size:1.2rem;animation-delay:0s}.snowflake-2{top:60%;left:10%;font-size:1rem;animation-delay:5s}@keyframes snowfallCard{0%{transform:translateY(0) rotate(0);opacity:.1}50%{opacity:.3}to{transform:translateY(50px) rotate(360deg);opacity:.1}}.help-modal{position:fixed;inset:0;background:#000c;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease}.help-content{max-width:500px;width:90%;max-height:80vh;overflow-y:auto;background:linear-gradient(145deg,#1b1a1efa,#151419fa);border:2px solid #e9c46a;border-radius:20px;padding:30px;position:relative;box-shadow:0 20px 60px #00000080,inset 0 0 30px #e9c46a1a;animation:slideUp .4s ease}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.help-content h2{background:linear-gradient(135deg,#e9c46a,#cd7f32);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-top:0;font-size:1.8rem}.help-content h3{color:#e9c46a;margin-top:20px;font-size:1.2rem}.help-description{color:#b8b1a0;line-height:1.6;margin-bottom:20px}.rules-list{list-style:none;padding:0}.rules-list li{color:#f4f3ee;margin-bottom:12px;padding-left:25px;position:relative;line-height:1.5}.rules-list li:before{content:"⚙";position:absolute;left:0;color:#e9c46a}.close-button{position:absolute;top:15px;right:15px;width:36px;height:36px;background:linear-gradient(145deg,#cd7f32,#b87333);border:2px solid rgba(233,196,106,.5);border-radius:50%;color:#f4f3ee;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.close-button:hover{transform:rotate(90deg) scale(1.1);box-shadow:0 4px 12px #0006}.game-container{max-width:700px;margin:0 auto;padding:20px;position:relative;background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));border-radius:20px;box-shadow:inset 0 0 20px #e9c46a1a,0 10px 40px #00000080,0 0 80px #e9c46a0d;border:2px solid rgba(233,196,106,.3);overflow:hidden}.image-group{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr) auto;gap:20px;padding:20px;margin-bottom:20px;background:#0f0e1080;border-radius:10px;box-shadow:inset 0 2px 10px #0000004d}.image-frame{width:100%;aspect-ratio:1;max-width:305px;position:relative;border:3px solid;border-image:linear-gradient(135deg,var(--gold),var(--bronze)) 1;border-radius:15px;overflow:hidden;background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));box-shadow:inset 0 0 20px #0000004d,0 4px 10px #0006,0 0 30px #e9c46a1a;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.image-frame:before,.image-frame:after{content:"";position:absolute;width:20px;height:20px;border:2px solid var(--gold);border-radius:50%;opacity:.5}.image-frame:before{top:5px;left:5px;background:radial-gradient(circle at center,transparent 40%,var(--gold) 40%,var(--gold) 45%,transparent 45%)}.image-frame:after{bottom:5px;right:5px;background:radial-gradient(circle at center,transparent 40%,var(--gold) 40%,var(--gold) 45%,transparent 45%)}.image-frame img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease,filter .3s ease}.image-frame:hover{transform:translateY(-5px) scale(1.02);box-shadow:inset 0 0 25px #e9c46a33,0 8px 20px #00000080,0 0 40px #e9c46a33;border-color:var(--gold)}.image-frame:hover img{transform:scale(1.05);filter:brightness(1.1)}.image-frame.revealed{animation:revealPulse .6s ease;border-color:var(--green-light);box-shadow:inset 0 0 25px #4a7c2e4d,0 8px 20px #00000080,0 0 40px #4a7c2e4d}@keyframes revealPulse{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.05) rotate(2deg)}50%{transform:scale(1.08) rotate(-2deg)}75%{transform:scale(1.05) rotate(1deg)}}.input-area{grid-area:3 / 1 / 4 / 3;margin:20px auto;display:flex;gap:15px;align-items:center;padding:15px;background:linear-gradient(145deg,#0f0e1099,#0a090b99);border-radius:15px;box-shadow:inset 0 2px 8px #0006,0 2px 4px #0000004d}.input-area input{width:300px;height:60px;padding:0 20px;font-size:2rem;font-weight:700;font-family:monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));border:2px solid rgba(184,177,160,.3);border-radius:12px;box-shadow:inset 0 2px 8px #0000004d,0 2px 4px #0003;transition:all .3s ease}.input-area input:focus{outline:none;border-color:var(--gold);background:linear-gradient(145deg,#1b1a1e,#151419);box-shadow:inset 0 2px 8px #0000004d,0 2px 4px #0003,0 0 20px #e9c46a33;transform:translateY(-2px)}.input-area input::placeholder{color:#b8b1a080;font-size:1.5rem;text-transform:none;letter-spacing:normal}.btn{height:60px;padding:0 30px;font-size:1.1rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);background:linear-gradient(145deg,var(--bronze),var(--dark-bronze));border:2px solid rgba(233,196,106,.5);border-radius:30px;cursor:pointer;transition:all .3s ease;box-shadow:0 3px 10px #0000004d,inset 0 1px #fff3;position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient(circle,rgba(255,255,255,.3),transparent);transform:translate(-50%,-50%);transition:width .5s,height .5s}.btn button:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0006,inset 0 1px #ffffff4d}.btn:hover:before{width:200%;height:200%}.btn:active{transform:translateY(-1px);box-shadow:inset 0 2px 4px #0000004d,0 1px 2px #0000004d}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.input-area.correct input{border-color:var(--green-light);background:linear-gradient(145deg,#2d50164d,#4a7c2e33);animation:correctShake .5s ease}@keyframes correctShake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.input-area.wrong input{border-color:#dc143c;animation:wrongShake .5s ease}@keyframes wrongShake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.hint-text{font-size:1.1rem;color:var(--gold);font-weight:700;padding:10px 20px;background:linear-gradient(145deg,#b8733333,#cd7f321a);border-radius:10px;border:1px solid rgba(233,196,106,.3);display:inline-block;animation:slideDown .5s ease-out}.game-info{display:flex;justify-content:space-between;padding:15px 20px;margin-bottom:20px;background:linear-gradient(145deg,#0f0e1099,#0a090b99);border-radius:10px;border:1px solid rgba(184,177,160,.2)}.game-info .score,.game-info .level{font-size:1.2rem;font-weight:700;color:var(--gold);text-shadow:0 2px 4px rgba(0,0,0,.5)}.gear-decoration{position:absolute;width:40px;height:40px;opacity:.1;animation:rotate 10s linear infinite}.gear-decoration:nth-child(odd){top:10px;right:10px;animation-direction:reverse}.gear-decoration:nth-child(2n){bottom:10px;left:10px}.victory-effect{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1000}.confetti-particle{position:absolute;width:10px;height:10px;background:var(--gold);animation:confettiFall 3s ease-out forwards}@keyframes confettiFall{0%{transform:translateY(-100vh) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}@media(max-width:640px){.game-container{padding:15px}.image-group{gap:15px;padding:15px}.image-frame{max-width:150px}.input-area{flex-direction:column;gap:10px}.input-area input{width:100%;max-width:280px;height:50px;font-size:1.5rem}.input-area button{width:100%;max-width:280px;height:45px}}@media(max-width:480px){.image-frame:before,.image-frame:after{display:none}.input-area input{font-size:1.2rem}}.completion-modal{position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:#0006;animation-name:fadeIn;animation-duration:.4s;display:flex;align-items:center;justify-content:center}.modal-content{display:grid;grid-template-columns:repeat(1,1fr);padding:20px;grid-template-rows:repeat(2,1fr);max-width:400px;background-color:var(--dark-bg);border-radius:3px;width:100%;animation-name:slideIn;animation-duration:.4s}.modal-content h1{margin:0}@keyframes slideIn{0%{bottom:-300px;opacity:0}to{bottom:0;opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.wordle-container{width:100%;max-width:700px;margin:0 auto;padding:20px;position:relative;background:linear-gradient(145deg,#1b1a1ef2,#151419f2);border-radius:20px;box-shadow:inset 0 0 20px #e9c46a1a,0 10px 40px #00000080,0 0 80px #e9c46a0d;border:2px solid rgba(233,196,106,.3);overflow:hidden}@keyframes rotate{to{transform:rotate(360deg)}}.wordle-header{text-align:center;margin-bottom:20px;position:relative;z-index:1}.wordle-title{font-size:2.5rem;font-weight:700;margin:0;letter-spacing:.3rem;display:flex;justify-content:center;gap:.2rem;text-shadow:0 2px 4px rgba(0,0,0,.5),0 0 20px rgba(233,196,106,.3)}.title-letter{display:inline-block;background:linear-gradient(135deg,var(--gold),#cd7f32);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:titleGlow 3s ease-in-out infinite}.title-letter:nth-child(2n){animation-delay:.5s}@keyframes titleGlow{0%,to{filter:brightness(1)}50%{filter:brightness(1.3) drop-shadow(0 0 10px rgba(233,196,106,.5))}}.subtitle{font-size:.9rem;color:var(--muted);font-style:italic;margin-top:5px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.hint-container{text-align:center;margin-bottom:15px}.hint-button{background:linear-gradient(145deg,#cd7f32,#b87333);color:var(--ink);border:2px solid rgba(233,196,106,.5);padding:8px 16px;border-radius:20px;font-size:.9rem;font-weight:700;cursor:pointer;transition:all .3s ease;box-shadow:0 3px 10px #0000004d,inset 0 1px #fff3;position:relative;overflow:hidden}.hint-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 15px #0006,inset 0 1px #ffffff4d}.hint-button:disabled{opacity:.5;cursor:not-allowed}.coin-icon{display:inline-block;margin-right:5px;animation:coinSpin 3s ease-in-out infinite}@keyframes coinSpin{0%,to{transform:rotateY(0)}50%{transform:rotateY(180deg)}}.wordle-grid{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;position:relative;padding:15px;background:#0f0e1080;border-radius:10px;box-shadow:inset 0 2px 10px #0000004d}.grid-row{display:flex;gap:8px;justify-content:center}.grid-row.shake{animation:shake .6s}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-3px)}20%,40%,60%,80%{transform:translate(3px)}}.grid-tile{width:58px;height:58px;border:2px solid rgba(184,177,160,.3);background:linear-gradient(145deg,#1b1a1ee6,#151419e6);border-radius:8px;position:relative;transition:all .3s ease;box-shadow:inset 0 -2px #0003,0 2px 4px #0000004d;transform-style:preserve-3d}.grid-tile.hinted{border-color:var(--gold);box-shadow:inset 0 -2px #0003,0 2px 4px #0000004d,0 0 15px #e9c46a66}.tile-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:1.8rem;font-weight:700;color:var(--ink);position:relative;transform-style:preserve-3d;transition:transform .6s}.grid-tile.flip .tile-inner{animation:flipTile .6s forwards}@keyframes flipTile{0%{transform:rotateX(0)}50%{transform:rotateX(90deg)}to{transform:rotateX(0)}}.tile-front,.tile-back{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;backface-visibility:hidden}.tile-back{transform:rotateX(180deg)}.grid-tile.correct{background:linear-gradient(145deg,#2d5016,#4a7c2e);border-color:#4a7c2e;animation:correctPulse .6s}.grid-tile.present{background:linear-gradient(145deg,#b87333,var(--gold));border-color:var(--gold)}.grid-tile.incorrect{background:linear-gradient(145deg,#3a3a3c,#2c2c2e);border-color:#3a3a3c}@keyframes correctPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.steam-effect{position:absolute;bottom:100%;left:50%;transform:translate(-50%);width:20px;height:20px;pointer-events:none}.steam-effect:before,.steam-effect:after{content:"";position:absolute;width:10px;height:10px;background:#ffffff4d;border-radius:50%;animation:steamRise 2s ease-out forwards}.steam-effect:after{left:5px;animation-delay:.3s}@keyframes steamRise{0%{transform:translateY(0) scale(.5);opacity:.8}to{transform:translateY(-30px) scale(1.5);opacity:0}}.keyboard{display:flex;flex-direction:column;gap:8px;margin-top:20px}.keyboard-row{display:flex;justify-content:center;gap:6px}.key{min-width:32px;height:50px;padding:0 8px;border:none;border-radius:8px;font-size:.9rem;font-weight:700;cursor:pointer;position:relative;overflow:hidden;transition:all .2s ease;color:var(--ink);background:linear-gradient(145deg,#3a3a3c,#2c2c2e);box-shadow:inset 0 -2px #0000004d,0 2px 4px #0000004d,inset 0 0 0 1px #b8b1a033}.key.special{min-width:60px;font-size:.85rem;background:linear-gradient(145deg,#cd7f32,#b87333)}.key:hover{transform:translateY(-2px);box-shadow:inset 0 -2px #0000004d,0 4px 8px #0006,inset 0 0 0 1px #b8b1a04d}.key:active{transform:translateY(0);box-shadow:inset 0 -1px #0000004d,0 1px 2px #0000004d}.key.correct{background:linear-gradient(145deg,#2d5016,#4a7c2e)}.key.present{background:linear-gradient(145deg,#b87333,var(--gold))}.key.incorrect{background:linear-gradient(145deg,#1a1a1c,#141416);opacity:.6}.key-gear{position:absolute;bottom:2px;right:2px;width:12px;height:12px;opacity:.3;background:radial-gradient(circle,transparent 30%,currentColor 30%,currentColor 40%,transparent 40%);display:none}.key-gear:after{content:"";position:absolute;inset:-2px;background:repeating-conic-gradient(currentColor 0deg 30deg,transparent 30deg 60deg)}.key-label{position:relative;z-index:1}.game-message{text-align:center;padding:15px;margin:15px 0;border-radius:10px;animation:slideDown .5s ease-out;background:linear-gradient(145deg,#1b1a1ef2,#151419f2);border:2px solid var(--gold);box-shadow:0 4px 10px #0000004d,inset 0 0 20px #e9c46a1a}.game-message.won{border-color:#4a7c2e;box-shadow:0 4px 10px #0000004d,inset 0 0 20px #4a7c2e33}.message-text{font-size:1.2rem;font-weight:700;color:var(--ink);margin-bottom:5px}.message-subtext{font-size:.9rem;color:var(--muted);font-style:italic}@keyframes slideDown{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.snowflakes{position:absolute;top:0;left:0;right:0;height:100%;pointer-events:none;overflow:hidden}.snowflake{position:absolute;top:-10px;font-size:1rem;animation:snowfall linear;animation-duration:calc(5s + random()*5s);animation-iteration-count:infinite;opacity:.8}.snowflake:nth-child(odd){left:10%;animation-duration:7s}.snowflake:nth-child(2n){left:20%;animation-duration:8s}.snowflake:nth-child(3n){left:30%;animation-duration:6s}.snowflake:nth-child(4n){left:40%;animation-duration:9s}.snowflake:nth-child(5n){left:50%;animation-duration:7.5s}.snowflake:nth-child(6n){left:60%;animation-duration:8.5s}.snowflake:nth-child(7n){left:70%;animation-duration:6.5s}.snowflake:nth-child(8n){left:80%;animation-duration:9.5s}.snowflake:nth-child(9n){left:90%;animation-duration:7.8s}.snowflake:nth-child(10n){left:95%;animation-duration:8.2s}@keyframes snowfall{0%{transform:translateY(-100px) rotate(0);opacity:0}10%{opacity:.8}90%{opacity:.8}to{transform:translateY(calc(100vh + 100px)) rotate(360deg);opacity:0}}.confetti-particle{position:absolute;width:10px;height:10px;top:50%;animation:confettiFall 3s ease-out forwards;z-index:100}@keyframes confettiFall{0%{transform:translateY(0) rotate(0) scale(1);opacity:1}to{transform:translateY(300px) rotate(720deg) scale(0);opacity:0}}@media(max-width:480px){.wordle-container{padding:15px}.wordle-title{font-size:2rem;letter-spacing:.2rem}.grid-tile{width:50px;height:50px}.tile-inner{font-size:1.5rem}.key{min-width:28px;height:45px;font-size:.85rem;padding:0 6px}.key.special{min-width:50px;font-size:.75rem}}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;z-index:9999}.spinner{width:50px;height:50px;border:5px solid rgba(255,255,255,.3);border-top:5px solid white;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.container_3c0354{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;height:var(--uib-size);width:var(--uib-size)}.inner_2872d0{position:relative;display:flex;flex-direction:column;width:100%;height:100%;transform:rotate(45deg);animation:rotate_f64a1b calc(var(--uib-speed) * 2) ease-in-out infinite}.half_ce1369{--uib-half-size: calc(var(--uib-size) * .435);position:absolute;display:flex;align-items:center;justify-content:center;width:var(--uib-half-size);height:var(--uib-half-size);overflow:hidden;isolation:isolate}.half_ce1369:first-child{top:8.25%;left:8.25%;border-radius:50% 50% calc(var(--uib-size) / 15)}.half_ce1369:last-child{bottom:8.25%;right:8.25%;transform:rotate(180deg);align-self:flex-end;border-radius:50% 50% calc(var(--uib-size) / 15)}.half_ce1369:last-child:after{animation-delay:calc(var(--uib-speed) * -1)}.half_ce1369:before{content:"";height:110%;width:110%;position:absolute;top:0;left:0;background-color:var(--uib-color);opacity:var(--uib-bg-opacity);transition:background-color .3s ease}.half_ce1369:after{content:"";position:relative;z-index:1;display:block;background-color:var(--uib-color);height:110%;width:110%;transform:rotate(45deg) translate(-3%,50%) scaleX(1.2);transform-origin:bottom right;border-radius:0 0 calc(var(--uib-size) / 20) 0;animation:flow_017d88 calc(var(--uib-speed) * 2) linear infinite both;transition:background-color .3s ease}@keyframes flow_017d88{0%{transform:rotate(45deg) translate(-3%,50%) scaleX(1.2)}30%{transform:rotate(45deg) translate(115%,50%) scaleX(1.2)}30.001%,50%{transform:rotate(0) translate(-85%,-85%) scaleX(1)}80%,to{transform:rotate(0) translate(0) scaleX(1)}}@keyframes rotate_f64a1b{0%,30%{transform:rotate(45deg)}50%,80%{transform:rotate(225deg)}to{transform:rotate(405deg)}}:root{--gold: #e9c46a;--bronze: #cd7f32;--dark-bronze: #b87333;--ink: #f4f3ee;--muted: #b8b1a0;--green-dark: #2d5016;--green-light: #4a7c2e;--dark-bg: rgba(27, 26, 30, .95);--darker-bg: rgba(21, 20, 25, .95)}.dashboard-container{min-height:100vh;background:linear-gradient(135deg,#0f0e10,#1a1919,#0f0e10);position:relative;overflow-x:hidden;padding:20px}.dashboard-container:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 20% 80%,rgba(233,196,106,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(205,127,50,.1) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(74,124,46,.05) 0%,transparent 50%);pointer-events:none}.background-gears{position:fixed;inset:0;pointer-events:none;z-index:0;display:none}.gear{position:absolute;border-radius:50%;opacity:.05;background:radial-gradient(circle at center,transparent 30%,var(--gold) 30%,var(--gold) 35%,transparent 35%),repeating-conic-gradient(var(--gold) 0deg 30deg,transparent 30deg 60deg)}.gear-large{width:400px;height:400px;top:-100px;right:-100px;animation:rotateSlow 30s linear infinite}.gear-medium{width:250px;height:250px;bottom:50px;left:-50px;animation:rotateMedium 20s linear infinite reverse}.gear-small{width:150px;height:150px;top:50%;left:70%;animation:rotateFast 10s linear infinite}@keyframes rotateSlow{to{transform:rotate(360deg)}}@keyframes rotateMedium{to{transform:rotate(360deg)}}@keyframes rotateFast{to{transform:rotate(360deg)}}.snowflakes{position:fixed;top:0;left:0;right:0;height:100vh;pointer-events:none;z-index:1}.snowflake{position:absolute;color:#fffc;font-size:1rem;animation:snowfall linear infinite}.snowflake:nth-child(1){left:10%;animation:snowfall 10s linear infinite}.snowflake:nth-child(2){left:20%;animation:snowfall 15s linear infinite 2s}.snowflake:nth-child(3){left:30%;animation:snowfall 12s linear infinite 1s}.snowflake:nth-child(4){left:40%;animation:snowfall 18s linear infinite 3s}.snowflake:nth-child(5){left:50%;animation:snowfall 13s linear infinite 2s}.snowflake:nth-child(6){left:60%;animation:snowfall 16s linear infinite 4s}.snowflake:nth-child(7){left:70%;animation:snowfall 11s linear infinite 1s}.snowflake:nth-child(8){left:80%;animation:snowfall 14s linear infinite 3s}.snowflake:nth-child(9){left:90%;animation:snowfall 19s linear infinite 2s}.snowflake:nth-child(10){left:95%;animation:snowfall 17s linear infinite 0s}@keyframes snowfall{0%{transform:translateY(-100px) rotate(0);opacity:0}10%{opacity:.8}90%{opacity:.8}to{transform:translateY(100vh) rotate(360deg);opacity:0}}.dashboard-header{text-align:center;margin-bottom:40px;position:relative;z-index:10;animation:fadeInDown 1s ease}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.dashboard-title{font-size:3.5rem;font-weight:700;margin:0 0 10px;display:flex;flex-direction:column;align-items:center;gap:.2rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}.title-word{display:inline-block;background:linear-gradient(135deg,var(--gold),var(--bronze),var(--gold));background-size:200% 200%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:shimmerText 3s ease-in-out infinite;letter-spacing:.1em}.title-word:nth-child(2){animation-delay:.2s;font-size:4rem}.title-word:nth-child(3){animation-delay:.4s}@keyframes shimmerText{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.dashboard-subtitle{font-size:1.2rem;color:var(--muted);font-style:italic;margin:0;opacity:0;animation:fadeIn 1s ease .5s forwards}@keyframes fadeIn{to{opacity:1}}.welcome-banner{max-width:800px;margin:0 auto 30px;padding:20px 30px;background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));border:2px solid rgba(233,196,106,.3);border-radius:20px;position:relative;z-index:10;box-shadow:inset 0 0 20px #e9c46a1a,0 5px 20px #0006;animation:slideIn .5s ease}@keyframes slideIn{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.welcome-banner h2{color:var(--gold);margin:0 0 10px;font-size:1.5rem}.welcome-banner p{color:var(--ink);margin:0;line-height:1.6}.welcome-close{position:absolute;top:10px;right:10px;background:transparent;border:none;color:var(--muted);font-size:1.5rem;cursor:pointer;transition:all .3s ease;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.welcome-close:hover{color:var(--gold);transform:rotate(90deg)}.overall-progress{max-width:800px;margin:0 auto 40px;padding:25px;background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));border:2px solid rgba(233,196,106,.3);border-radius:20px;position:relative;z-index:10;box-shadow:inset 0 0 20px #e9c46a1a,0 5px 20px #0006}.overall-progress h3{color:var(--gold);margin:0 0 20px;font-size:1.3rem;text-align:center;text-transform:uppercase;letter-spacing:.1em}.progress-container{position:relative}.progress-bar-large{height:30px;background:linear-gradient(145deg,#0f0e10cc,#0a090bcc);border-radius:25px;overflow:hidden;box-shadow:inset 0 3px 8px #00000080,0 1px #ffffff0d;border:1px solid rgba(184,177,160,.2);position:relative}.progress-fill-large{height:100%;background:linear-gradient(90deg,var(--bronze) 0%,var(--gold) 25%,var(--bronze) 50%,var(--gold) 75%,var(--bronze) 100%);background-size:200% 100%;border-radius:25px;transition:width .8s ease;position:relative;animation:progressGradient 3s ease-in-out infinite}@keyframes progressGradient{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.progress-shine{position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3) 50%,transparent);animation:progressShine 2s infinite}@keyframes progressShine{to{left:100%}}.progress-stats{display:flex;justify-content:space-between;align-items:center;margin-top:15px;padding:0 5px}.progress-text{color:var(--ink);font-size:1rem;font-weight:600}.progress-percentage{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,var(--gold),var(--bronze));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.completion-message{text-align:center;margin-top:20px;padding:15px;background:linear-gradient(145deg,#2d50164d,#4a7c2e33);border:2px solid var(--green-light);border-radius:15px;color:var(--ink);font-size:1.2rem;font-weight:700;animation:completionPulse 2s ease-in-out infinite}@keyframes completionPulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.riddles-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;max-width:1200px;margin:0 auto 40px;position:relative;z-index:10;animation:fadeInUp 1s ease}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.dashboard-footer{margin-top:60px;padding:30px 20px;background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));border-top:2px solid rgba(233,196,106,.2);position:relative;z-index:10}.footer-content{text-align:center}.footer-text{color:var(--muted);font-style:italic;font-size:1.1rem;margin:0 0 15px}.footer-decorations{display:flex;justify-content:center;gap:20px;font-size:1.5rem}.footer-decorations span{animation:decorationFloat 3s ease-in-out infinite}.footer-decorations span:nth-child(2n){animation-delay:1.5s}@keyframes decorationFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media(max-width:768px){.dashboard-title{font-size:2.5rem}.title-word:nth-child(2){font-size:3rem}.riddles-grid{grid-template-columns:1fr;gap:20px}.overall-progress{padding:20px 15px}}@media(max-width:480px){.dashboard-container{padding:15px}.dashboard-title{font-size:2rem}.title-word:nth-child(2){font-size:2.3rem}.dashboard-subtitle{font-size:1rem}.welcome-banner{padding:15px 20px}}.sound-controls{margin:20px 0;padding:15px;background:linear-gradient(145deg,var(--dark-bg),var(--darker-bg));border:1px solid rgba(233,196,106,.2);border-radius:10px;box-shadow:0 4px 10px #0000004d}.sound-controls h3{margin-bottom:10px;color:var(--muted)}.control-group{margin-bottom:15px}.control-group label{display:block;margin-bottom:5px;font-size:.9rem;color:var(--muted)}.control-group input[type=range]{width:100%;cursor:pointer}.mute-button{padding:10px 20px;background:var(--primary);color:#fff;border:none;border-radius:5px;cursor:pointer;transition:background .3s}.mute-button:hover{background:var(--primary-dark)}
