@font-face{font-family:Chicano;src:url('assets/fonts/chicano-fino.ttf')}*{box-sizing:border-box}html,body{margin:0;background:#100910;color:#fbe9c8;font-family:Arial,sans-serif}body{min-height:100dvh;background:radial-gradient(ellipse at top,#56112d66,transparent 65%),#100910}button,a,input,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit;color:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #ffd588;outline-offset:3px}button:disabled{opacity:.5;cursor:default}.arcade{width:min(100%,740px);min-height:100dvh;margin:auto;padding:max(10px,env(safe-area-inset-top)) 14px max(12px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px}header{display:flex;align-items:center;gap:7px}header>div{flex:1;min-width:0}.eyebrow{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#d4ae70}h1{font:400 clamp(19px,4vw,28px)/1.25 Chicano,Georgia,serif;margin:5px 0}h1 span{font:18px Arial}header button,.exit{display:grid;place-items:center;min-width:42px;height:42px;border:1px solid #aa7c4b80;border-radius:12px;background:#321224;color:#ffe6ad;text-decoration:none;font-size:25px}nav{display:flex;gap:6px;overflow-x:auto;padding:3px 2px 7px;scrollbar-width:thin}nav button{flex:1 0 auto;padding:10px;border:1px solid #946e4c77;background:#241220;border-radius:12px;font-size:12px;min-height:44px}nav button[aria-pressed=true]{background:linear-gradient(135deg,#b91d44,#49122e);border-color:#f2ce8d;box-shadow:0 0 14px #d61e4c55}.game{flex:1;border:1px solid #bc8c4e88;border-radius:20px;padding:12px;background:linear-gradient(150deg,#301326cc,#130e17);box-shadow:0 10px 28px #800b3540}.game-heading{display:flex;gap:8px;align-items:center;justify-content:space-between}h2{font:400 24px Chicano,Georgia,serif;margin:0}.game-heading button,#resume,.quiz-listen{border:1px solid #e1b975;background:linear-gradient(120deg,#a7193c,#4d142f);border-radius:12px;padding:10px 13px;min-height:44px}.stats{display:flex;justify-content:space-between;gap:5px;font-size:11px;color:#ccb8b3;margin:12px 0 0}.stats b{color:#ffe1a1;font-size:16px}.game p{font-size:12px;line-height:1.5}#help{color:#d8c7c1;min-height:34px;margin:8px 0}#message{min-height:20px;margin:9px 0 0;color:#ffdc92}#arena{position:relative;width:100%;min-height:230px;outline:none}.welcome{min-height:230px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px}.welcome>span{font-size:60px;filter:drop-shadow(0 0 18px #f0285c55)}.welcome strong{font:30px Chicano,Georgia,serif}.welcome p{max-width:280px;margin:0;color:#ccb8b3}.board{display:grid;gap:5px;max-width:360px;margin:auto}.match-board{grid-template-columns:repeat(6,1fr)}.tile{display:grid;place-items:center;aspect-ratio:1;border:1px solid #d2a76a55;border-radius:12px;background:linear-gradient(140deg,#47283b,#1c1321);font-size:clamp(21px,6vw,32px);padding:0;box-shadow:inset 0 1px 2px #fff1;transition:transform .15s,background .15s}.tile.selected{outline:2px solid #ffe1a1;transform:scale(.91);background:#862545}.tile.hit{animation:gem-pop .28s ease both;background:#b82b56}.tile[data-gem="0"]{background:linear-gradient(145deg,#79253e,#2b1729)}.tile[data-gem="1"]{background:linear-gradient(145deg,#265460,#17202d)}.tile[data-gem="2"]{background:linear-gradient(145deg,#6a4a22,#2c1d19)}.tile[data-gem="3"]{background:linear-gradient(145deg,#443a7d,#22182f)}.tile[data-gem="4"]{background:linear-gradient(145deg,#39715b,#18271f)}.tile[data-gem="5"]{background:linear-gradient(145deg,#663e70,#2d1b35)}.memory-board{grid-template-columns:repeat(4,1fr);max-width:330px}.memory-board .tile{font-size:26px;overflow:hidden}.tile img{width:100%;height:100%;object-fit:cover;border-radius:10px}.tile.matched{border-color:#ffda85;opacity:.6}.lane-field{height:260px;position:relative;overflow:hidden;border-radius:14px;border:1px solid #d4a96944;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(33.333% - 1px),#d7ac6233 calc(33.333% - 1px),#d7ac6233 33.333%),radial-gradient(ellipse at bottom,#861b4755,#130d19)}.hitline{position:absolute;left:0;right:0;bottom:35px;height:40px;background:#db265333;border-top:1px solid #f1c67b66;border-bottom:1px solid #f1c67b66}.falling{position:absolute;top:0;width:33.333%;display:grid;place-items:center;height:36px;font-size:28px;will-change:transform;pointer-events:none;filter:drop-shadow(0 0 8px #f0285c88)}.avatar{position:absolute;bottom:25px;width:33.333%;text-align:center;font-size:36px;transition:left .12s}.lane-controls{display:flex;gap:7px;margin-top:8px}.lane-controls button{flex:1;min-height:44px;border:1px solid #d7b37577;border-radius:12px;background:#48162e;font-size:19px}.quiz{display:flex;align-items:center;flex-direction:column;gap:12px;padding:15px 0}.quiz>span{font-size:46px}.answers{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:8px}.answers button{padding:12px 8px;border-radius:12px;border:1px solid #b58b6177;background:#321727;min-height:58px;font-size:12px;line-height:1.4}.answers button.correct{background:#215846;border-color:#b9edba}.answers button.wrong{background:#7e1c35}.music{border:1px solid #b7834766;border-radius:16px;background:#1e101d;padding:10px 12px;box-shadow:0 4px 20px #6d123440}.music-heading{display:flex;gap:8px;align-items:center}.music-heading img{border-radius:8px;object-fit:cover}.music-heading>div{flex:1;min-width:0}.music small{font-size:10px;color:#c3aeb1}.music select{width:100%;border:0;background:#281322;font-size:12px;padding:5px 0}.volume{font-size:9px;color:#bea4a9;width:48px}.volume input{width:48px}.transport{display:flex;justify-content:center;gap:7px;margin-top:8px}.transport button{min-width:44px;min-height:42px;border:1px solid #a37a5066;border-radius:11px;background:#321625;font-size:11px}.transport button svg{width:20px;height:20px;display:block;margin:auto;fill:#f0ce8d}#play{min-width:62px;border-color:#e9be74;background:linear-gradient(135deg,#bc2149,#5c1838);box-shadow:0 0 15px #bf1a4644}.seek{display:flex;gap:7px;align-items:center;margin-top:4px;font-size:10px;color:#baa4a7}.seek input{flex:1;min-width:0;accent-color:#e5bd7a}input[type=range]{accent-color:#e5bd7a;min-height:24px}.music p{font-size:10px;color:#ccb3b7;text-align:center;margin:3px 0 0;min-height:12px}.sr{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}#pause-layer{position:fixed;inset:0;z-index:10;background:#120a16e8;display:grid;place-items:center;backdrop-filter:blur(12px)}#pause-layer[hidden]{display:none}#pause-layer>div{text-align:center;padding:24px}#pause-layer span{font-size:70px}.burst{position:absolute;inset:25% 0 auto;text-align:center;font-size:42px;pointer-events:none;animation:gem-pop .7s ease both}#arena button{touch-action:manipulation}@keyframes gem-pop{0%{transform:scale(.65);opacity:.3}45%{transform:scale(1.12);opacity:1}100%{transform:scale(1);opacity:1}}@media(min-width:700px){.arcade{padding-top:20px}.lane-field{height:320px}#arena{min-height:300px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* All five choices remain visible; reserve room for music on phones. */
nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow:visible;gap:5px;padding:3px 0 5px}nav button{min-width:0;padding:6px 2px;font-size:10px;line-height:1.5;white-space:pre-line;min-height:48px}
@media(max-width:699px){.board{max-width:clamp(264px,calc(100dvh - 520px),330px)}.lane-field{height:clamp(170px,calc(100dvh - 560px),260px)}[data-mode="duelo"] .lane-field{height:clamp(155px,calc(100dvh - 605px),235px)}.quiz{gap:8px;padding:6px 0}.quiz>span{font-size:36px}.answers button{min-height:48px;padding:9px 7px}}

.action-canvas{display:block;width:100%;height:clamp(210px,calc(100dvh - 590px),330px);object-fit:contain;background:#0d1624;border:1px solid #b5896555;border-radius:12px;touch-action:none;outline:none}.action-controls{display:flex;gap:7px;margin-top:8px}.action-controls button{flex:1;min-height:46px;padding:7px 4px;border:1px solid #d6ae6d88;border-radius:10px;background:linear-gradient(145deg,#6c1b3b,#291526);font-size:11px;font-weight:600;color:#ffe4b2;touch-action:none;user-select:none}.action-controls button:active{background:#a32a50;box-shadow:0 0 15px #d5236055}#modes{grid-template-columns:repeat(5,minmax(0,1fr))}#modes button{min-height:42px;padding:3px 2px}.arcade:has(.action-canvas) #help{min-height:0;margin:6px 0}.arcade:has(.action-canvas) #message{min-height:18px;font-size:11px}.arcade:has(.action-canvas) .game{padding:10px}#arena:has(.action-canvas){min-height:0}@media(min-width:700px){.action-canvas{height:360px}}

.action-controls.battle-controls{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(100px,1fr);gap:14px;align-items:stretch;margin-top:12px}
.battle-move-pad{min-height:104px;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:10px;border:1px solid #d3ac6a88;border-radius:16px;background:radial-gradient(ellipse at center,#63213755,#1a1522);touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:ew-resize}
.battle-move-caption{font-size:10px;font-weight:700;letter-spacing:.12em;color:#f6dba8}.battle-move-pad small,.battle-fire small{font-size:9px;color:#d6b9bd;font-weight:400}
.battle-move-track{position:relative;width:100%;max-width:155px;height:40px;border-radius:30px;background:#0e0d17;border:1px solid #9d725a55;display:grid;place-items:center}
.battle-move-track>svg{position:absolute;width:100%;height:30px;stroke:#e6c88e;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.battle-move-thumb{width:36px;height:36px;border-radius:50%;border:1px solid #ffe4ae;background:radial-gradient(circle at 35% 25%,#ffe0a4,#b58b51 50%,#67432d);box-shadow:0 0 13px #efbe6655;transform:translateX(var(--stick-x,0px));pointer-events:none}
.battle-move-pad.is-held{border-color:#ffe2aa;box-shadow:0 0 15px #b93b6655}.battle-move-pad:focus-visible{outline:2px solid #ffe4ae;outline-offset:3px}
.action-controls .battle-fire{min-height:104px;border-radius:20px;background:radial-gradient(at 50% 0,#a63154,#48162c 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px solid #f2bc7aaa;-webkit-touch-callout:none}
.battle-fire svg{width:30px;height:30px;fill:none;stroke:#ffe2a7;stroke-width:1.8;stroke-linecap:round}.battle-fire strong{font-size:12px;letter-spacing:.05em}
.action-controls .battle-fire.is-held{background:#a52c50;box-shadow:inset 0 0 15px #ffd38c33,0 0 18px #dc3c6877;border-color:#ffe5ad}
@media(max-width:370px){.action-controls.battle-controls{gap:9px;grid-template-columns:minmax(0,1.4fr) minmax(96px,1fr)}}