:root{--paper:#fbf0d9;--ink:#221f1a;--black:#000;--white:#fff}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--paper);font-family:'Special Elite',monospace;color:var(--ink)}
.container{max-width:980px;margin:18px auto;padding:12px}
.header{background:linear-gradient(180deg,#fffaf0,#efe0b8);padding:12px;border-radius:8px;border:1px solid #d0b788;text-align:center}
.title{font-size:1.6rem;color:#111}
.subtitle{font-size:0.95rem;color:#4a3a20;margin-top:6px}
.menu{padding:18px;text-align:center}
.missions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:12px}
.mission-btn{background:#000;color:#fff;padding:12px 18px;border-radius:8px;border:none;cursor:pointer;min-width:180px}
.game{background:linear-gradient(180deg,#fffaf0,#f6e7c7);padding:18px;border-radius:10px;border:1px solid #d0b788;min-height:520px;position:relative}
.watermark{position:absolute;top:10px;right:12px;font-size:0.95rem;color:rgba(0,0,0,0.06);transform:rotate(-10deg)}
.status{display:flex;gap:12px;justify-content:center;margin:12px 0}
.timer,.score{background:transparent;padding:6px 10px;border-radius:6px;border:1px solid rgba(0,0,0,0.06);font-weight:700}
.anagram{font-size:2rem;text-align:center;margin:12px 0;min-height:3em;letter-spacing:3px;color:#122}
.clue{color:#5a4a2a;text-align:center;min-height:1.2em}
.inputwrap{display:flex;justify-content:center;margin-top:10px}
input#answer{width:70%;max-width:520px;padding:12px;border-radius:8px;border:1px solid #b7a57a;background:#fffaf0}
.controls{display:flex;gap:10px;justify-content:center;margin-top:14px;flex-wrap:wrap}
.controls button{background:#000;color:#fff;padding:12px 18px;border-radius:8px;border:none;cursor:pointer}
.feedback{margin-top:14px;text-align:center;font-weight:700;min-height:1.2em}
.factbox{display:none;margin-top:14px;padding:12px;border-radius:8px;background:#fffef8;border:1px solid #e0d4b0}
.endcontrols{display:flex;justify-content:center;margin-top:12px}
.footer{position:fixed;left:50%;transform:translateX(-50%);bottom:12px;background:transparent;padding:6px 10px;font-weight:700;font-size:1.4rem}
.howto{position:fixed;inset:0;background:rgba(0,0,0,0.45);display:flex;align-items:center;justify-content:center;z-index:9999}
.howto-box{background:var(--paper);padding:18px;border-radius:10px;max-width:520px;text-align:left;border:1px solid #d0b788}
.howto-box h3{margin-top:0}
@media(max-width:640px){ .anagram{font-size:1.4rem} input#answer{width:90%} .mission-btn{min-width:140px} }