:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color-scheme:dark;--bg: #101923;--ink: #f5f1e9;--muted: rgba(203, 213, 225, .68);--muted-soft: rgba(203, 213, 225, .48);--line: rgba(255, 255, 255, .1);--panel: rgba(2, 6, 23, .5);--panel-strong: rgba(15, 23, 42, .72);--stone: #f5f5f4;--slate: #0f172a;--emerald: #a7f3d0;--red: #fecaca;color:var(--ink);background:var(--bg);font-synthesis:none}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;min-width:320px;min-height:100vh;color:var(--ink);background:radial-gradient(circle at 0 0,rgba(143,170,181,.2),transparent 34%),radial-gradient(circle at 100% 100%,rgba(179,106,97,.11),transparent 32%),var(--bg);background-attachment:fixed}button{font:inherit}.app-shell{width:min(72rem,calc(100% - 64px));margin:0 auto;padding:32px 0 64px;position:relative}.app-header{z-index:40;border:1px solid var(--line);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#101923e6;border-radius:32px;margin:0 0 20px;padding:20px 24px}.header-main{display:flex;justify-content:space-between;align-items:center;gap:16px}.header-main p{color:#cbd5e173;letter-spacing:.24em;text-transform:uppercase;margin:0;font-size:.64rem;font-weight:750}.header-main h1{color:var(--ink);letter-spacing:-.035em;margin:4px 0 0;font-size:clamp(1.55rem,6vw,2.7rem);font-weight:720;line-height:1}.trainer-pill{border:1px solid var(--line);text-align:right;background:#ffffff0a;border-radius:18px;padding:8px 16px}.trainer-pill span{color:#cbd5e173;letter-spacing:.2em;text-transform:uppercase;font-size:.64rem;font-weight:750;display:block}.trainer-pill strong{color:var(--ink);margin-top:3px;font-size:.9rem;font-weight:750;display:block}.level-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.level-tabs a{min-width:0;border:1px solid var(--line);color:#cbd5e1b3;text-align:left;background:#ffffff0a;border-radius:18px;padding:10px 12px;text-decoration:none;transition:all .18s}.level-tabs a:hover{color:var(--ink);background:#ffffff0f}.level-tabs a.active{color:#020617;background:var(--stone);border-color:#e2e8f0b8;box-shadow:0 18px 42px #00000038}.level-tabs span{display:block;font-size:.92rem;font-weight:800}.level-tabs small{display:block;margin-top:3px;opacity:.72;font-size:.74rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.eyebrow{margin:0 0 8px;letter-spacing:.12em;font-size:.76rem;font-weight:800;color:var(--muted)}h2{color:var(--ink);margin:4px 0 0;font-size:clamp(1.4rem,3vw,2rem)}.stage{border:1px solid var(--line);border-radius:999px;padding:8px 12px;color:#e2e8f0c7;white-space:nowrap}.mode-panel{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}.mode-panel button,.route-switch button,.trainer-nav button{color:#cbd5e1c7;background:#ffffff0a;border:1px solid var(--line);border-radius:18px;padding:16px;text-align:left;cursor:pointer;transition:all .18s}.mode-panel button:hover,.route-switch button:hover,.trainer-nav button:hover{color:var(--ink);background:#ffffff0f}.mode-panel button.selected,.route-switch button.selected,.trainer-nav button.selected{background:var(--stone);color:#020617;border-color:#e2e8f0b8}.mode-panel small{display:block;margin-top:6px;opacity:.72}.route-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:32px 0 18px}.route-heading>div>p:not(.eyebrow){color:var(--muted)}.route-overview-heading{margin-top:26px}.route-control-menu{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.assistance-menu{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.assistance-menu button{border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:var(--muted);background:#ffffff0a;cursor:pointer;font-size:.72rem;font-weight:800;line-height:1;transition:all .18s}.assistance-menu button:hover{color:var(--ink);background:#ffffff12}.assistance-menu button.active{color:#020617;background:var(--stone);border-color:#e2e8f0b8}.route-switch{display:flex;gap:8px}.route-switch button{padding:10px 14px;border-radius:999px}.consultation-switch{flex-wrap:wrap;max-width:620px;justify-content:flex-end}.consultation-switch button{flex:1 1 118px}.module-grid,.language-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.module-card,.language-card,.training-card{border:1px solid var(--line);border-radius:24px;padding:20px;background:var(--panel-strong)}.module-card h3{color:var(--ink);font-size:1.35rem;margin:16px 0 8px}.module-card p{color:var(--muted);min-height:4.5em}.chips{display:flex;flex-wrap:wrap;gap:5px;margin:18px 0}.chips span,.action-chip{font-size:.7rem;font-weight:800;letter-spacing:.06em;padding:5px 7px;border-radius:8px;background:#ffffff12}.module-card>button,.audio-button,.next-button,.primary-action,.feedback>button{width:100%;border:0;border-radius:18px;padding:11px;font-weight:800;background:var(--stone);color:#020617;cursor:pointer}.module-card>button:disabled{opacity:.35;cursor:not-allowed}.japanese-line{margin-top:24px;font-size:2rem;line-height:1.8}ruby rt{font-size:.42em;color:var(--muted)}.romaji{color:var(--muted);font-style:italic}.spanish{margin:10px 0 22px;font-size:1.05rem}.audio-button:disabled{opacity:.45;cursor:not-allowed}.training-view{max-width:820px;margin:42px auto 0}.training-topbar{display:flex;justify-content:space-between;align-items:center;color:var(--muted)}.text-button,.back-button{border:0;background:transparent;color:#e2e8f0eb;padding:8px 0;cursor:pointer}.back-button{margin-top:4px}.training-header{margin:30px 0 20px}.training-header h2{max-width:720px;font-size:clamp(1.6rem,4vw,2.6rem)}.training-header p:last-child,.training-hint{color:var(--muted)}.trainer-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:22px 0 12px}.trainer-nav button{padding:10px;text-align:center;font-size:.82rem;border-radius:999px}.data-trainer-nav{grid-template-columns:repeat(5,minmax(0,1fr))}.training-card h3{color:var(--ink);font-size:clamp(1.35rem,3vw,2rem);margin:4px 0 20px}.choice-list{display:grid;gap:10px}.choice-list button,.choice{display:flex;justify-content:space-between;align-items:baseline;gap:16px;width:100%;padding:18px;border:1px solid var(--line);border-radius:22px;background:var(--panel-strong);color:var(--ink);text-align:left;cursor:pointer;transition:all .18s}.choice-list button:hover,.choice:hover{background:#1e293bcc;border-color:#cbd5e159}.choice-list button strong,.choice span{font-size:1.45rem}.choice-list button span,.choice small{color:var(--muted)}.choice-list button.selected-answer{outline:2px solid var(--stone)}.feedback{margin-top:18px;border:1px solid var(--line);border-radius:24px;padding:20px;background:#ffffff08}.feedback>strong{font-size:1.15rem}.feedback>.language-card{margin:18px 0}.feedback.correct>strong:after{content:" · respuesta verificada";font-size:.75rem;font-weight:500;opacity:.7}.feedback.incorrect>strong:after{content:" · revisa la función";font-size:.75rem;font-weight:500;opacity:.7}.listen-action{margin:4px 0 18px}.listen-action:disabled{opacity:.45;cursor:not-allowed}.build-zone{min-height:76px;display:flex;align-items:center;justify-content:center;margin:18px 0;padding:16px;border:1px dashed rgba(203,213,225,.32);border-radius:22px;font-size:1.45rem;text-align:center}.token-list{display:flex;flex-wrap:wrap;gap:8px}.token-list button,.trainer-actions button{border:1px solid var(--line);border-radius:999px;background:#ffffff0a;color:var(--ink);padding:11px 14px;cursor:pointer}.token-list button:disabled{opacity:.3}.trainer-actions{display:flex;justify-content:space-between;gap:8px;margin-top:18px}.trainer-actions .success-button{background:var(--stone);color:#020617}.primary-action{margin-top:16px}.scenario-card>p:not(.eyebrow),.module-reference{color:var(--muted)}.module-reference{margin-top:18px;padding:16px;border:1px solid var(--line);border-radius:22px;background:#ffffff08;line-height:1.55}.survival-bank{margin-top:28px;padding:18px;border-top:1px solid var(--line);color:var(--muted)}.survival-bank .chips span{font-size:.9rem;letter-spacing:0}footer{margin-top:48px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted-soft);font-size:.8rem}@media(max-width:820px){.app-shell{width:min(100% - 32px,72rem)}.route-heading{align-items:stretch;flex-direction:column}.route-control-menu{align-items:flex-start}.assistance-menu{justify-content:flex-start}.module-grid,.language-grid{grid-template-columns:1fr 1fr}.data-trainer-nav{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:560px){.app-shell{width:100%;padding:0 16px 48px}.app-header{margin:0 -16px 16px;padding:14px 16px 16px;border-width:0 0 1px;border-radius:0;position:sticky;top:0}.header-main{align-items:flex-start}.trainer-pill{display:none}.level-tabs a{padding:10px 5px;text-align:center}.level-tabs span{font-size:.75rem}.level-tabs small{display:none}.mode-panel,.module-grid,.language-grid{grid-template-columns:1fr}.route-control-menu,.route-switch{width:100%}.route-switch button{flex:1}.assistance-menu{width:100%;gap:5px}.assistance-menu button{flex:0 1 auto}.consultation-switch{max-width:none}.japanese-line{font-size:1.8rem}.choice-list button,.choice{flex-direction:column;gap:5px}.trainer-nav,.data-trainer-nav{grid-template-columns:1fr 1fr}}.unified-shell .academic-level-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.unified-shell .level-tabs button{min-width:0;border:1px solid var(--line);color:#cbd5e1b3;text-align:left;background:#ffffff0a;border-radius:18px;padding:10px 12px;cursor:pointer;transition:all .18s}.unified-shell .level-tabs button:hover{color:var(--ink);background:#ffffff0f}.unified-shell .level-tabs button.active{color:#020617;background:var(--stone);border-color:#e2e8f0b8;box-shadow:0 18px 42px #00000038}.special-route-nav{display:flex;align-items:center;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.special-route-nav>span{color:var(--muted-soft);letter-spacing:.16em;text-transform:uppercase;font-size:.62rem;font-weight:800}.special-route-nav button{display:flex;align-items:baseline;gap:8px;border:1px solid var(--line);color:#cbd5e1c7;background:#ffffff0a;border-radius:999px;padding:7px 12px;cursor:pointer;transition:all .18s}.special-route-nav button:hover{color:var(--ink);background:#ffffff12}.special-route-nav button.active{color:#020617;background:var(--stone);border-color:#e2e8f0b8}.special-route-nav strong{font-size:.8rem}.special-route-nav small{opacity:.7;font-size:.7rem}.area-content{min-height:360px}.route-loading{min-height:220px;display:grid;place-items:center;color:var(--muted)}.academic-source-tabs{border:1px solid var(--line);background:#ffffff08;border-radius:24px;margin:0 0 20px;padding:8px}.academic-source-tabs .tab-scroll{overflow-x:auto;scrollbar-width:none}.academic-source-tabs .tab-scroll::-webkit-scrollbar{display:none}.academic-source-tabs .tab-scroll>div{display:flex;min-width:max-content;gap:8px}.academic-source-tabs button{border:0;border-radius:999px;color:#cbd5e1b8;background:transparent;padding:9px 16px;font-weight:750;cursor:pointer}.academic-source-tabs button.active{color:#020617;background:var(--stone)}.panel{border:1px solid var(--line);background:var(--panel);border-radius:32px;padding:clamp(16px,4vw,24px)}.section-title p{color:var(--muted-soft);letter-spacing:.25em;text-transform:uppercase;margin:0;font-size:.64rem;font-weight:750}.section-title h2{margin:4px 0 0}.section-description{color:var(--muted);max-width:42rem;margin-top:6px;font-size:.92rem;line-height:1.55}.migration-checkpoint{margin-top:20px;border:1px dashed rgba(203,213,225,.28);border-radius:22px;padding:18px;color:var(--muted)}.migration-checkpoint strong{color:var(--ink)}.migration-checkpoint p{margin:6px 0 0;line-height:1.55}@media(max-width:560px){.unified-shell .level-tabs button{padding:10px 5px;text-align:center}.unified-shell .level-tabs span{font-size:.75rem}.unified-shell .level-tabs small{display:none}.special-route-nav{justify-content:space-between}.special-route-nav button{max-width:70%}.special-route-nav button small{display:none}}