@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Fredoka:wght@500;600;700&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#17233b;background:#f4f6f8;font-synthesis:none;text-rendering:optimizeLegibility;--navy:#15233b;--muted:#727d8e;--orange:#ffb24a;--green:#40a878;--line:#e8ebef}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(ellipse at 50% -10%,#e7f1f8 0,transparent 45%),#f4f6f8}.app-shell{max-width:1100px;margin:auto;padding:0 30px 40px}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8ebef}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--navy);font-family:Fredoka,sans-serif;font-size:20px;font-weight:600}.brand-mark{width:36px;height:36px;display:grid;place-items:center;background:var(--navy);color:#ffd077;border-radius:12px;font-size:23px}.top-actions{display:flex;align-items:center;gap:14px}.save-status{font-size:12px;color:#5c7186}.icon-button,.close-button{border:0;background:#fff;border-radius:50%;width:38px;height:38px;font-size:19px;color:#66768b;cursor:pointer}.login-screen{max-width:930px;margin:65px auto;display:grid;grid-template-columns:1fr 370px;gap:60px;align-items:center}.login-copy h1,.welcome-row h1{font:700 48px/1.1 Fredoka,sans-serif;color:var(--navy);margin:12px 0}.login-copy p{font-size:17px;line-height:1.65;color:#657286;max-width:440px}.eyebrow{letter-spacing:.13em;font-size:11px;color:#8290a1;font-weight:800}.hero-stats{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.hero-stats span{padding:10px 13px;background:#fff;border:1px solid #e9edf0;border-radius:14px;font-size:12px;color:#526278}.login-card,.journey-card,.tip-card,.profile-card{background:white;border:1px solid #e6e9ed;border-radius:21px;box-shadow:0 10px 35px #17233b0a}.login-card{padding:27px}.login-card h2,.dialog h2{font:600 24px Fredoka,sans-serif;margin:0 0 20px}.login-card label,.dialog label{display:block;margin:13px 0;color:#46546a;font-weight:700;font-size:12px}.login-card input,.dialog input{display:block;margin-top:7px;width:100%;height:45px;padding:0 13px;background:#fbfcfd;border:1px solid #dce2e8;border-radius:11px;font:500 15px 'DM Sans',sans-serif;outline:none}.login-card input:focus,.dialog input:focus{border-color:#6d96bb;box-shadow:0 0 0 3px #8ab8e328}.form-hint{font-size:11px;line-height:1.55;color:#8590a0}.primary-button{border:0;border-radius:12px;padding:13px 17px;background:var(--navy);color:white;font:700 13px 'DM Sans',sans-serif;cursor:pointer;box-shadow:0 5px 12px #15233b1a}.primary-button:hover{background:#263b60}.full-width{width:100%;display:flex;justify-content:space-between;align-items:center}.text-button,.quiet-button{border:0;background:transparent;color:#68778a;font:600 11px 'DM Sans',sans-serif;cursor:pointer}.login-card .text-button{display:block;margin:15px auto 0}.form-error{min-height:16px;margin-top:9px;color:#bd4a42;font-size:12px}.game-screen{padding-top:36px}.welcome-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.welcome-row h1{font-size:34px;margin:6px 0}.journey-card{padding:24px 28px}.journey-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.journey-heading h2{font:600 23px Fredoka,sans-serif;margin:7px 0}.journey-heading p{color:#7b8796;font-size:12px;margin:0}.level-pill{background:#fff7e8;border:1px solid #ffe2ae;color:#a66a0b;padding:11px 14px;border-radius:14px;font-weight:800}.level-pill small{font-weight:600;color:#997d4d;font-size:10px}.map-wrap{margin-top:12px}.map-legend{display:flex;gap:18px;justify-content:flex-end;color:#8390a0;font-size:10px}.map-legend span{display:flex;align-items:center;gap:5px}.dot{width:8px;height:8px;border-radius:50%;background:#ddd}.dot.done{background:var(--green)}.dot.current{background:var(--orange)}.map{position:relative;height:260px;max-width:820px;margin:5px auto 0}.route-line{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.route-line path{fill:none;stroke:#d8e0e7;stroke-width:5;stroke-dasharray:4 11;stroke-linecap:round}.map-node{position:absolute;z-index:1;display:flex;flex-direction:column;align-items:center;gap:5px;width:96px;border:0;background:transparent;cursor:pointer;color:#57667a}.map-node:disabled{cursor:not-allowed;opacity:.53}.node-icon{height:59px;width:59px;border-radius:21px;background:#e9eef3;border:3px solid white;box-shadow:0 3px 0 #cad4dd;display:grid;place-items:center;font:700 24px Fredoka,sans-serif;color:#78889a;transition:transform .15s}.map-node:not(:disabled):hover .node-icon{transform:translateY(-4px)}.map-node.done .node-icon{background:#dff3e9;color:#278153;box-shadow:0 3px 0 #9ed6b8}.map-node.current .node-icon{background:#ffe0a6;color:#81530a;box-shadow:0 4px 0 #eab552;animation:bob 1.7s ease-in-out infinite}.node-caption{font-size:11px;font-weight:700;white-space:nowrap}.node-stars{font-size:10px;color:#eda82f;height:12px}.node-1{left:1%;top:64%}.node-2{left:23%;top:16%}.node-3{left:43%;top:48%}.node-4{left:62%;top:7%}.node-5{left:76%;top:52%}.node-6{right:0%;top:28%}.below-map{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}.tip-card,.profile-card{padding:16px;display:flex;align-items:center;gap:12px;box-shadow:none}.tip-icon,.avatar{width:39px;height:39px;display:grid;place-items:center;background:#fff5db;border-radius:13px;font-size:20px;flex:none}.tip-card strong,.profile-card strong{font-size:12px}.tip-card p,.profile-card small{display:block;font-size:11px;color:#8590a0;margin:4px 0 0}.profile-card{text-align:left;cursor:pointer}.profile-card .avatar{background:#eaf0f7}.profile-card .arrow{margin-left:auto;color:#8491a1}.game-footer{display:flex;justify-content:space-between;align-items:center;color:#9aa3af;font-size:10px;padding:17px 5px}.game-footer .text-button{font-size:10px;color:#a0a9b4}.dialog{border:1px solid #e7eaee;border-radius:21px;padding:28px;width:min(94vw,470px);max-height:88vh;overflow:auto;box-shadow:0 20px 80px #10203c35;color:var(--navy)}.dialog::backdrop{background:#12223b77;backdrop-filter:blur(3px)}.dialog>form:first-child{position:absolute;right:13px;top:13px}.close-button{font-size:25px}.challenge-dialog{width:min(94vw,520px);padding:32px}.challenge-top{display:flex;align-items:center;justify-content:space-between;color:#8390a0;font-size:11px}.challenge-top strong{color:#b87716;background:#fff4dc;padding:8px 10px;border-radius:10px}.challenge-dialog h2{font:600 29px/1.2 Fredoka,sans-serif;margin:17px 0 8px}.challenge-subtitle{color:#788698;font-size:13px}.question-box{background:#f5f7f8;border-radius:16px;padding:22px;text-align:center;margin:18px 0}.question-box .roman{font:700 42px Fredoka,sans-serif;color:#233d63}.question-box .question-text{font-weight:700;font-size:17px}.answers{display:grid;grid-template-columns:1fr 1fr;gap:10px}.answer-button{border:1px solid #dfe5ea;border-radius:12px;background:white;padding:14px 9px;font:700 17px Fredoka,sans-serif;color:#32445f;cursor:pointer}.answer-button:hover{background:#f0f6fb;border-color:#98b2cb}.answer-button:disabled{cursor:default}.explanation{min-height:22px;margin-top:13px;color:#607084;font-size:12px;line-height:1.5}.check-button{width:100%;margin-top:10px}.feedback-good{color:#268052!important}.feedback-wrong{color:#bd554a!important}.result-content{text-align:center}.result-emoji{font-size:51px}.result-content h2{margin:9px 0}.result-content p{color:#718096;line-height:1.6;font-size:13px}.result-stars{font:700 22px Fredoka,sans-serif;color:#eaa630;margin:13px}.result-content button{margin-top:12px}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.stat{padding:15px;background:#f4f7f9;border-radius:13px;text-align:center}.stat strong{display:block;font:700 24px Fredoka}.stat span{font-size:10px;color:#79879a}.weak-topic{font-size:12px;color:#64748b;background:#fff8e9;border-radius:12px;padding:12px}.dialog-actions{display:flex;gap:10px;align-items:center;margin-top:15px}@keyframes bob{50%{transform:translateY(-4px)}}[hidden]{display:none!important}
@media(max-width:720px){.app-shell{padding:0 17px 25px}.topbar{height:65px}.brand{font-size:17px}.save-status{font-size:10px;max-width:115px;text-align:right}.login-screen{grid-template-columns:1fr;gap:20px;margin:36px auto}.login-copy h1{font-size:39px}.login-copy p{font-size:15px}.hero-stats{margin-top:16px}.login-card{padding:22px}.game-screen{padding-top:25px}.welcome-row h1{font-size:29px}.journey-card{padding:19px 14px}.journey-heading{align-items:flex-start}.journey-heading h2{font-size:20px}.journey-heading p{max-width:245px;line-height:1.5}.level-pill{white-space:nowrap;padding:9px 10px;font-size:13px}.level-pill small{display:none}.map-legend{gap:8px;font-size:9px;justify-content:center}.map{height:245px;margin-top:13px}.map-node{width:70px}.node-icon{width:49px;height:49px;border-radius:17px;font-size:20px}.node-caption{font-size:9px}.node-1{left:-2%;top:65%}.node-2{left:17%;top:16%}.node-3{left:36%;top:48%}.node-4{left:54%;top:7%}.node-5{left:69%;top:52%}.node-6{right:-5%;top:28%}.below-map{grid-template-columns:1fr;gap:9px;margin-top:8px}.tip-card,.profile-card{padding:13px}.game-footer{align-items:flex-start;gap:10px;flex-direction:column}.challenge-dialog{padding:26px 21px}.challenge-dialog h2{font-size:25px}.question-box{padding:17px}.question-box .roman{font-size:36px}}
@media(max-width:380px){.hero-stats{gap:6px}.hero-stats span{font-size:10px;padding:8px}.map{height:220px}.map-node{width:62px}.node-icon{width:43px;height:43px}.node-1{left:-4%}.node-2{left:14%}.node-3{left:33%}.node-4{left:51%}.node-5{left:66%}.node-6{right:-8%}}
/* Ranking global con alias y métricas limitadas. */
.below-map{grid-template-columns:repeat(3,minmax(0,1fr))}.ranking-avatar{background:#fff3d5!important}.ranking-dialog h2{font:600 24px Fredoka,sans-serif;margin:0 0 7px}.ranking-note,.ranking-message{font-size:12px;line-height:1.55;color:#758296}.ranking-note{margin:0 0 14px}.ranking-message{margin:16px 0}.leaderboard-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px}.leaderboard-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:9px;padding:10px 11px;background:#f4f7f9;border:1px solid transparent;border-radius:13px}.leaderboard-row.is-current-player{background:#fff8e9;border-color:#f5dfb3}.leaderboard-place{font:700 13px Fredoka,sans-serif;color:#69788b;text-align:center}.leaderboard-identity{min-width:0}.leaderboard-identity strong,.leaderboard-identity small,.leaderboard-stats strong,.leaderboard-stats small{display:block}.leaderboard-identity strong{font-size:12px;overflow-wrap:anywhere}.leaderboard-identity small,.leaderboard-stats small{margin-top:3px;font-size:10px;color:#7c899a}.leaderboard-stats{text-align:right;white-space:nowrap}.leaderboard-stats strong{font-size:11px;color:#9b6c19}.leaderboard-dialog .primary-button{margin-top:10px}@media(max-width:720px){.below-map{grid-template-columns:1fr}}
/* Repaso siempre disponible, mapa de diez etapas y oca despistada. */
.help-button{border:1px solid #e2e9ef;background:#fff;border-radius:12px;padding:9px 12px;color:#32445f;font:700 11px 'DM Sans',sans-serif;cursor:pointer}.help-button:hover,.challenge-help:hover{background:#fff5db}.map{height:365px}.map-node{left:var(--node-left);top:var(--node-top);transform:translateX(-50%);width:min(112px,19%)}.map-node .node-caption{white-space:normal;line-height:1.15;min-height:22px;text-align:center}.map-node.node-1,.map-node.node-2,.map-node.node-3,.map-node.node-4,.map-node.node-5{--node-top:7%}.map-node.node-6,.map-node.node-7,.map-node.node-8,.map-node.node-9,.map-node.node-10{--node-top:67%}.map-node.node-1,.map-node.node-10{--node-left:8%}.map-node.node-2,.map-node.node-9{--node-left:29%}.map-node.node-3,.map-node.node-8{--node-left:50%}.map-node.node-4,.map-node.node-7{--node-left:71%}.map-node.node-5,.map-node.node-6{--node-left:92%}.mission-tag{display:inline-block;margin-top:9px;background:#edf3f8;color:#59718b;padding:6px 9px;border-radius:9px;font-size:9px;font-weight:800;letter-spacing:.08em}.challenge-help{float:right;border:1px solid #e5eaf0;border-radius:10px;background:#fff;padding:7px 9px;color:#53667e;font:700 10px 'DM Sans',sans-serif;cursor:pointer}.phase-scene{height:130px;display:flex;align-items:center;justify-content:center;gap:15px;margin:13px 0 1px}.centurion-goose{width:154px;height:120px;overflow:visible;animation:goose-bob 2.4s ease-in-out infinite}.goose-helmet{transform-origin:95px 28px;animation:helmet-wobble 2.4s ease-in-out infinite}.goose-speech{position:relative;background:#fff4dc;border:1px solid #f4dfb7;border-radius:14px;padding:10px 12px;color:#735321;font:600 12px/1.35 Fredoka,sans-serif;transform:rotate(2deg)}.goose-speech:before{content:"";position:absolute;left:-7px;top:20px;width:12px;height:12px;background:#fff4dc;border-left:1px solid #f4dfb7;border-bottom:1px solid #f4dfb7;transform:rotate(45deg)}@keyframes goose-bob{50%{transform:translateY(-4px) rotate(-2deg)}}@keyframes helmet-wobble{50%{transform:rotate(-8deg)}}.help-dialog{width:min(94vw,560px);max-height:88vh}.help-dialog h2{margin:4px 0 9px}.help-intro{font-size:12px;line-height:1.55;color:#718096}.roman-key{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:14px 0}.roman-key div{padding:9px 3px;text-align:center;background:#f1f5f8;border-radius:10px}.roman-key strong,.roman-key span{display:block}.roman-key strong{font:700 19px Fredoka,sans-serif;color:#304b6e}.roman-key span{margin-top:3px;font-size:9px;color:#6d7c90}.help-rule{margin:11px 0;padding:13px;background:#f8fafb;border:1px solid #edf0f3;border-radius:13px}.help-rule h3{margin:0 0 5px;font:600 15px Fredoka,sans-serif;color:#344a67}.help-rule p,.help-rule li{font-size:11px;line-height:1.5;color:#68798e}.help-rule p{margin:4px 0}.help-example{margin-top:9px;padding:9px 11px;background:#fff;border-radius:9px;color:#425872;font-size:11px;line-height:1.7}.subtraction-pairs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:9px 0}.subtraction-pairs span{padding:7px;background:#fff;border-radius:8px;text-align:center;color:#405979;font:600 12px Fredoka,sans-serif}.help-rule ul{padding-left:18px;margin:7px 0 0}.help-limit{background:#fff8e9;border-color:#f7e5bf}.help-dialog .primary-button{margin-top:13px}.challenge-dialog:has(.phase-scene) h2{margin-top:8px}
@media(max-width:720px){.map{height:310px}.map-node{width:19%;gap:4px}.map-node.node-1,.map-node.node-2,.map-node.node-3,.map-node.node-4,.map-node.node-5{--node-top:8%}.map-node.node-6,.map-node.node-7,.map-node.node-8,.map-node.node-9,.map-node.node-10{--node-top:65%}.map-node.node-1,.map-node.node-10{--node-left:10%}.map-node.node-2,.map-node.node-9{--node-left:30%}.map-node.node-3,.map-node.node-8{--node-left:50%}.map-node.node-4,.map-node.node-7{--node-left:70%}.map-node.node-5,.map-node.node-6{--node-left:90%}.node-caption{font-size:8px!important}.node-icon{width:44px;height:44px}.phase-scene{height:112px;gap:7px}.centurion-goose{width:130px;height:105px}.goose-speech{font-size:10px;padding:8px}.roman-key{gap:4px}.roman-key div{padding:7px 2px}.roman-key span{font-size:8px}.help-dialog{padding:26px 18px}}
@media(max-width:380px){.map{height:285px}.map-node{width:20%}.map-node.node-1,.map-node.node-10{--node-left:10%}.map-node.node-2,.map-node.node-9{--node-left:30%}.map-node.node-3,.map-node.node-8{--node-left:50%}.map-node.node-4,.map-node.node-7{--node-left:70%}.map-node.node-5,.map-node.node-6{--node-left:90%}.node-icon{width:39px;height:39px;border-radius:14px}.node-caption{font-size:7px!important}.goose-speech{font-size:9px}.roman-key strong{font-size:17px}}
