*{margin:0;padding:0;box-sizing:border-box}:root{--cream: #faf3e6;--cream-dark: #f0e6d2;--ink: #33302b;--ink-soft: #6f6a60;--green: #3d8b5f;--green-dark: #2e6b49;--red: #cf4436;--red-dark: #a83428;--gold: #f2b134;--card: #ffffff;--shadow: 0 4px 16px rgba(60, 45, 20, .12);--radius: 18px}html,body,#root{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;background:var(--cream);background-image:radial-gradient(rgba(60,45,20,.045) 1px,transparent 1px);background-size:22px 22px;color:var(--ink);-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer;border:none;touch-action:manipulation}input{font-family:inherit}.app{max-width:900px;margin:0 auto;padding:16px 20px 48px;min-height:100%;display:flex;flex-direction:column}.serif{font-family:Georgia,Times New Roman,serif}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border-radius:14px;font-size:16px;font-weight:700;color:#fff;background:var(--green);box-shadow:0 4px 0 var(--green-dark);transition:transform .06s ease,box-shadow .06s ease,filter .15s;-webkit-user-select:none;user-select:none}.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--green-dark)}.btn:disabled{filter:grayscale(.7) opacity(.6);cursor:default}.btn.red{background:var(--red);box-shadow:0 4px 0 var(--red-dark)}.btn.red:active{box-shadow:0 1px 0 var(--red-dark)}.btn.ghost{background:transparent;color:var(--ink-soft);box-shadow:inset 0 0 0 2px #3c2d142e}.btn.ghost:active{transform:translateY(1px)}.btn.small{padding:8px 14px;font-size:14px;border-radius:11px}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.hud{display:flex;align-items:center;flex-wrap:wrap;gap:10px 14px;padding:10px 0 18px}.hud .spacer{flex:1}.hud-pill{display:inline-flex;align-items:center;gap:6px;background:var(--card);border-radius:999px;padding:7px 14px;font-weight:700;font-size:14px;box-shadow:var(--shadow);white-space:nowrap}.xp-bar{width:120px;height:8px;background:var(--cream-dark);border-radius:99px;overflow:hidden}.xp-bar>div{height:100%;background:linear-gradient(90deg,var(--gold),#f7c95c);border-radius:99px;transition:width .5s ease}.tile{display:inline-flex;align-items:center;padding:10px 16px;background:#fff;border-radius:12px;border:2px solid rgba(60,45,20,.15);box-shadow:0 3px #3c2d1426;font-size:17px;font-weight:600;cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform .08s}.tile:hover{transform:translateY(-2px)}.tile.placed{background:#eef7f0;border-color:#3d8b5f66}.tile.ghosted{opacity:.25;pointer-events:none}.tile-row{display:flex;flex-wrap:wrap;gap:10px;min-height:52px;align-items:center}.answer-strip{border:2px dashed rgba(60,45,20,.22);border-radius:14px;padding:12px;background:#ffffff8c}.type-input{font-size:20px;font-weight:700;padding:12px 16px;border-radius:12px;border:2px solid rgba(60,45,20,.25);background:#fff;color:var(--ink);width:100%;max-width:340px;text-align:center;outline:none}.type-input:focus{border-color:var(--green);box-shadow:0 0 0 4px #3d8b5f26}.hp-bar{height:14px;background:var(--cream-dark);border-radius:99px;overflow:hidden;border:2px solid rgba(60,45,20,.15)}.hp-bar>div{height:100%;border-radius:99px;transition:width .45s cubic-bezier(.34,1.56,.64,1)}.feedback{border-radius:14px;padding:14px 18px;font-weight:600;line-height:1.45}.feedback.good{background:#e5f4ea;color:#21603d}.feedback.bad{background:#fbe9e7;color:#94301f}.feedback .why{display:block;font-weight:500;font-size:14px;margin-top:4px;opacity:.85}.map-wrap{position:relative}.city-node{cursor:pointer}.city-node.locked{cursor:default;filter:grayscale(1) opacity(.55)}.vocab-card{border-radius:14px;border:2px solid rgba(60,45,20,.15);background:#fff;box-shadow:0 3px #3c2d141f;padding:12px 10px;font-size:15px;font-weight:600;text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;min-height:58px;display:flex;align-items:center;justify-content:center;transition:transform .08s,background .15s,border-color .15s;width:100%}.vocab-card:hover{transform:translateY(-2px)}.vocab-card.selected{border-color:var(--gold);background:#fdf3dc}.vocab-card.idiom{font-style:italic}.vocab-card.matched{opacity:0;pointer-events:none}.vocab-card.error{animation:shake .4s;border-color:var(--red);background:#fbe9e7}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}50%{transform:translate(6px)}75%{transform:translate(-4px)}}.stars{font-size:15px;letter-spacing:2px}.bubble{position:relative;background:#fff;border-radius:16px;padding:14px 18px;box-shadow:var(--shadow);font-size:17px;line-height:1.5}.bubble .translation{display:block;font-size:13px;color:var(--ink-soft);margin-top:6px;font-style:italic}.bubble:before{content:"";position:absolute;left:-8px;top:22px;border:8px solid transparent;border-right-color:#fff;border-left:0}.timer-bar{height:10px;border-radius:99px;background:var(--cream-dark);overflow:hidden}.timer-bar>div{height:100%;background:linear-gradient(90deg,#58b07a,#f2b134 70%,#cf4436);border-radius:99px}.confetti-piece{position:fixed;top:-12px;width:10px;height:14px;z-index:999;pointer-events:none;animation:confetti-fall linear forwards}@keyframes confetti-fall{to{transform:translateY(105vh) rotate(720deg)}}.center-col{display:flex;flex-direction:column;align-items:center;gap:16px}.game-title{font-size:22px;font-weight:800}.subtle{color:var(--ink-soft);font-size:14px}.combo-badge{display:inline-flex;align-items:center;gap:4px;font-weight:800;color:#b8860b;background:#fdf3dc;padding:4px 12px;border-radius:999px;font-size:14px}@media(max-width:640px){.app{padding:10px 12px 40px}.hud-pill{font-size:12px;padding:6px 10px}.xp-bar{width:56px}.card{padding:14px}.game-title{font-size:18px}.tile{padding:9px 12px;font-size:15px}.tile-row{gap:8px}.vocab-card{font-size:12.5px;padding:10px 6px;min-height:52px}.bubble{font-size:15px;padding:12px 14px}.type-input{font-size:18px;max-width:100%}.btn{padding:11px 18px;font-size:15px}.feedback{font-size:14px;padding:12px 14px}.battle-scene{gap:8px!important}.battle-scene .avatar{font-size:34px!important}.battle-vs{font-size:18px!important}}