*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--primary: #273746;--secondary: #CE986B;--tertiary: #81A8C6;--bg: #FAF8F5;--bg-white: #FFFFFF;--border: #E8E3DC;--text-muted: #8A8078;--text-light: #B5ADA3;--danger: #C0392B;--success: #27AE60}html,body{font-family:Inter,sans-serif;background-color:var(--bg);color:var(--primary);-webkit-font-smoothing:antialiased}.container{max-width:680px;margin:0 auto;padding:40px 24px 60px;min-height:100vh;display:flex;flex-direction:column}.header{text-align:center;margin-bottom:48px}.logo{font-family:Unbounded,sans-serif;font-size:80px;font-weight:700;color:var(--primary);letter-spacing:-2px;line-height:1;margin-bottom:16px}.subtitle{font-size:14px;color:var(--text-muted);margin-bottom:6px;font-weight:400}.date-info{font-size:12px;color:var(--text-light);font-weight:500;letter-spacing:.3px}.game-area{flex:1;display:flex;flex-direction:column;gap:16px}.clue-box{background:var(--bg-white);border:1px solid var(--border);border-radius:12px;padding:24px}.clue-header{display:flex;align-items:center;gap:7px;margin-bottom:14px}.clue-label{font-size:11px;font-weight:600;color:var(--secondary);text-transform:uppercase;letter-spacing:.8px}.clue-text{font-size:16px;line-height:1.65;color:var(--primary);font-weight:400}.clue-text:before{content:'"'}.clue-text:after{content:'"'}.info-section{display:none;animation:fadeUp .35s ease}.info-section.show{display:block}.info-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.info-card{background:var(--bg-white);border:1px solid var(--border);border-radius:12px;padding:18px 20px}.info-card-label{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px}.info-card-label svg{width:12px;height:12px;color:var(--tertiary);flex-shrink:0}.info-card-value{font-size:15px;font-weight:600;color:var(--primary)}.verse-section{display:none;animation:fadeUp .35s ease}.verse-section.show{display:block}.verse-box{background:var(--bg-white);border:1px solid var(--border);border-left:3px solid var(--tertiary);border-radius:12px;padding:20px 24px}.verse-label{font-size:10px;font-weight:600;color:var(--tertiary);text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px}.verse-text{font-size:14px;line-height:1.75;color:var(--text-muted);font-style:italic}.input-section{display:flex;gap:10px;margin-top:4px;align-items:flex-start}.input-wrapper{flex:1;position:relative}.guess-input{width:100%;flex:1;padding:14px 18px;border:1.5px solid var(--border);border-radius:10px;font-family:Inter,sans-serif;font-size:14px;font-weight:500;color:var(--primary);background:var(--bg-white);transition:border-color .2s,box-shadow .2s;outline:none}.guess-input::placeholder{color:var(--text-light);font-weight:400}.guess-input:focus{border-color:var(--secondary);box-shadow:0 0 0 3px #ce986b1f}.guess-input:disabled{background:var(--bg);cursor:not-allowed}.suggestions-dropdown{display:none;position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--bg-white);border:1.5px solid var(--secondary);border-radius:10px;box-shadow:0 8px 24px #2737461a;z-index:100;overflow:hidden;max-height:220px;overflow-y:auto}.suggestions-dropdown.open{display:block}.suggestion-item{padding:11px 18px;font-size:14px;font-weight:500;color:var(--primary);cursor:pointer;transition:background .15s;border-bottom:1px solid var(--border)}.suggestion-item:last-child{border-bottom:none}.suggestion-item:hover,.suggestion-item.active{background:#ce986b14;color:var(--secondary)}.suggestion-item mark{background:none;color:var(--secondary);font-weight:700}.submit-btn{padding:14px 28px;background:var(--primary);color:#fff;border:none;border-radius:10px;font-family:Inter,sans-serif;font-size:13px;font-weight:600;letter-spacing:.3px;cursor:pointer;transition:background .2s,transform .15s;white-space:nowrap}.submit-btn:hover:not(:disabled){background:#1a2a38;transform:translateY(-1px)}.submit-btn:disabled{opacity:.45;cursor:not-allowed}.attempts-section{text-align:center}.attempts-label{font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px}.attempts-container{display:flex;justify-content:center;gap:10px}.attempt-box{width:36px;height:36px;border:1.5px solid var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;transition:all .2s}.attempt-box.remaining{background:var(--bg-white);border-color:var(--border)}.attempt-box.used{background:#c0392b14;border-color:var(--danger);color:var(--danger)}.attempt-box.correct{background:#27ae601a;border-color:var(--success);color:var(--success)}.history-section{display:none;animation:fadeUp .3s ease}.history-section.show{display:block}.history-label{font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px}.history-list{display:flex;flex-direction:column;gap:8px}.history-item{border:none;border-radius:10px;padding:14px 18px;transition:background .2s}.history-item.wrong{background:#c0392b1f}.history-item.correct{background:#27ae601f}.history-item-name{font-size:14px;font-weight:600;color:var(--primary);margin-bottom:6px}.history-item.wrong .history-item-name{color:var(--text-muted)}.history-item.correct .history-item-name{color:var(--success)}.history-item-meta{display:flex;align-items:center;gap:14px;font-size:12px;color:var(--text-muted)}.history-meta-tag{display:flex;align-items:center;gap:5px}.history-meta-tag svg{width:11px;height:11px;flex-shrink:0;color:var(--tertiary)}.game-over{display:none;animation:fadeUp .4s ease}.game-over.show{display:block}.game-over-content{background:var(--bg-white);border:1px solid var(--border);border-radius:16px;padding:36px 28px;text-align:center}.game-over-title{font-size:22px;font-weight:600;color:var(--primary);margin-bottom:10px}.game-over-note{font-size:12px;font-weight:500;color:var(--text-muted);letter-spacing:.3px;margin-bottom:16px}.game-over-answer{font-family:Unbounded,sans-serif;font-size:26px;font-weight:700;color:var(--secondary);margin-bottom:12px;letter-spacing:-.5px}.game-over-message{font-size:14px;color:var(--text-muted);margin-bottom:28px;line-height:1.6}.game-over-text{font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px}.reset-btn{width:100%;padding:14px;background:var(--bg);color:var(--text-muted);border:1.5px solid var(--border);border-radius:10px;font-family:Inter,sans-serif;font-size:13px;font-weight:500;cursor:not-allowed;letter-spacing:.2px}.footer{text-align:center;margin-top:48px;padding-top:24px;border-top:1px solid var(--border);font-size:12px;color:var(--text-light)}.mode-switch{display:inline-flex;gap:4px;padding:4px;margin-top:20px;background:var(--bg-white);border:1px solid var(--border);border-radius:12px}.mode-switch-btn{padding:9px 22px;border:none;background:none;border-radius:8px;font-family:Inter,sans-serif;font-size:13px;font-weight:600;color:var(--text-muted);cursor:pointer;transition:background .2s,color .2s}.mode-switch-btn:hover:not(.active){color:var(--secondary);background:#ce986b14}.mode-switch-btn.active{background:var(--primary);color:#fff}.header{position:relative}.settings{position:absolute;top:0;right:0;z-index:200}.settings-btn{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--bg-white);border:1px solid var(--border);border-radius:10px;color:var(--primary);cursor:pointer;transition:border-color .2s,background .2s}.settings-btn:hover{border-color:var(--secondary);color:var(--secondary)}.settings-btn svg{width:20px;height:20px}.settings-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:160px;background:var(--bg-white);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px #2737461f;overflow:hidden;animation:fadeUp .2s ease}.settings-menu-item{display:block;width:100%;text-align:left;padding:12px 18px;background:none;border:none;border-bottom:1px solid var(--border);font-family:Inter,sans-serif;font-size:14px;font-weight:500;color:var(--primary);cursor:pointer;transition:background .15s,color .15s}.settings-menu-item:last-child{border-bottom:none}.settings-menu-item:hover{background:#ce986b14;color:var(--secondary)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:300;display:flex;align-items:center;justify-content:center;padding:24px;background:#27374673;animation:fadeIn .2s ease}.modal{width:100%;max-width:440px;max-height:85vh;overflow-y:auto;background:var(--bg-white);border-radius:16px;padding:28px;animation:fadeUp .25s ease}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.modal-title{font-family:Unbounded,sans-serif;font-size:20px;font-weight:700;color:var(--primary);letter-spacing:-.5px}.modal-close{width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:8px;color:var(--text-muted);cursor:pointer;transition:background .15s,color .15s}.modal-close:hover{background:var(--bg);color:var(--primary)}.modal-close svg{width:18px;height:18px}.modal-body p{font-size:14px;line-height:1.7;color:var(--text-muted);margin-bottom:12px}.modal-body p:last-child{margin-bottom:0}.modal-body strong{color:var(--primary);font-weight:600}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 600px){.container{padding:28px 16px 48px}.logo{font-size:56px}.header{margin-bottom:32px}.game-area{gap:14px}.info-cards{grid-template-columns:1fr 1fr}.input-section{flex-direction:column}.submit-btn{width:100%;text-align:center}}