/* Player hub and classroom missions. No animation in the typing surface. */
.player-summary{padding:25px;border:1px solid #67539e;border-radius:22px;background:linear-gradient(145deg,#31234f,#1d1734);color:#f5f0ff;box-shadow:0 12px 30px #08081722}
.player-summary h3{font-size:1.15rem;margin:10px 0 18px}.player-summary p,.player-summary small{color:#c4badc}.player-summary .primary-btn{margin-top:20px;width:100%;justify-content:center}
.xp-meta{display:flex;justify-content:space-between;gap:20px;font-family:'JetBrains Mono',monospace;font-size:.88rem;margin-bottom:10px}.xp-meta strong{color:#e4fb86}.xp-track{height:10px;background:#ffffff18;border-radius:20px;overflow:hidden;margin-bottom:9px}.xp-track>span{display:block;height:100%;background:linear-gradient(90deg,#a78bfa,#ddf78a);border-radius:inherit}
.arcade-app #player-view{padding-bottom:55px}.player-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:35px 0 25px}.player-heading h1{font-size:clamp(1.65rem,3.5vw,2.8rem);margin:8px 0}.player-heading p{color:#bdb3d3;margin:0}.hub-level{width:min(320px,100%);padding:22px;background:#ffffff08;border:1px solid #ffffff20;border-radius:20px}.hub-level small{color:#bbb0d5}
.hub-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:25px 0 30px}.hub-tabs button{border:1px solid #ffffff22;color:#cfc6e7;background:#ffffff08;border-radius:14px;padding:14px 24px;min-height:52px;font:inherit;font-weight:600;cursor:pointer}.hub-tabs button.active{background:#ddf78a;color:#23213c;border-color:#ddf78a;box-shadow:0 4px 20px #ddf78a18}.hub-tabs button:hover{border-color:#b49afa}
.hub-note{padding:16px 20px;border:1px solid #8370ac4d;border-radius:14px;font-size:.9rem;line-height:1.8;color:#cbbfe4;background:#a58be80c;margin-bottom:20px}.reward-section{margin:32px 0 40px}.reward-section h2{margin-bottom:6px}.reward-section .section-heading p{color:#bbb0d0;margin-top:5px}.reward-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.reward-card{border:1px solid #ffffff20;border-radius:23px;overflow:hidden;background:#211b37;transition:border-color .18s,transform .18s}.reward-card:hover{transform:translateY(-3px);border-color:#a58be8}.reward-card.equipped{border-color:#ddf78a;box-shadow:0 0 0 1px #ddf78a33}.reward-art{height:245px;position:relative;background:radial-gradient(ellipse at 50% 80%,#9163d42e,transparent 68%),linear-gradient(145deg,#32234e,#18172c);display:flex;align-items:center;justify-content:center}.reward-art img{object-fit:contain;width:90%;height:225px;filter:drop-shadow(0 12px 18px #0005)}.reward-locked .reward-art img{opacity:.72}.unlock-tag{position:absolute;bottom:12px;right:14px;background:#131322d9;border:1px solid #ffffff24;border-radius:30px;padding:5px 12px;color:#d6c9f0;font-size:.78rem}.reward-copy{padding:20px}.reward-copy h3{margin:0 0 7px;font-size:1.2rem;color:#fff}.reward-copy p{font-size:.9rem;color:#c0b5d6;margin-bottom:18px}.reward-copy button{width:100%;justify-content:center;min-height:48px}.reward-copy button:disabled{cursor:default;opacity:.7}.reward-card.equipped button{color:#ddf78a;border-color:#ddf78a55}
.skin-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;transform:perspective(500px) rotateX(18deg) rotateZ(-8deg);padding:16px;border-radius:14px;background:#2d2243;box-shadow:0 8px #080b16}.skin-preview i{display:flex;align-items:center;justify-content:center;font:600 20px 'JetBrains Mono',monospace;width:45px;height:42px;border-radius:7px;background:#493960;color:#ddd1f7;box-shadow:0 4px #191425}.skin-mint{background:#0d4242}.skin-mint i{background:#b0f1d5;color:#155650;box-shadow:0 4px #448b74}.skin-carbon{background:#101c29}.skin-carbon i{background:#273342;color:#64edff;box-shadow:0 4px #070e18;border:1px solid #356e89}.skin-sunset{background:#642e51}.skin-sunset i{background:#ffd0b7;color:#743851;box-shadow:0 4px #b26680}.effect-preview{color:var(--reward-color);font-size:80px;filter:drop-shadow(0 0 18px var(--reward-color));display:flex;align-items:center;gap:6px}.effect-preview span{font-size:40px}
.hub-section-intro{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:25px 0}.hub-section-intro h2{font-size:1.7rem;margin:8px 0}.hub-section-intro p{color:#bfb4d5}.hub-count{text-align:right;color:#e2f695;font:700 2rem 'JetBrains Mono',monospace;white-space:nowrap}.hub-count small{display:block;color:#b6aacd;font:400 .8rem 'Kanit',sans-serif;margin-top:6px}.hub-empty{padding:40px 20px;text-align:center;color:#c6badb;border:1px dashed #ffffff25;border-radius:20px;background:#ffffff04}.hub-empty h2,.hub-empty h3{color:#f6f1ff;margin:8px 0}.hub-empty p{margin:8px auto 20px;max-width:540px}.hub-empty-icon{display:block;font-size:3rem;color:#c5a5ff}.mission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.mission-card,.hub-panel{background:#221b38;border:1px solid #ffffff1f;border-radius:22px;padding:25px}.mission-card h3{font-size:1.4rem;margin:18px 0 7px;color:#fff}.mission-top{display:flex;gap:10px;align-items:center;justify-content:space-between}.hub-language{background:#b99aff24;color:#c8acff;padding:4px 13px;border-radius:8px;font:600 .8rem 'JetBrains Mono',monospace}.mission-status{padding:5px 11px;border-radius:30px;font-size:.8rem;color:#b7c9ee;background:#78acff13}.status-on_time{color:#73e5b3;background:#32c98b13}.status-late,.status-overdue{color:#ffbd85;background:#ffa36c13}.mission-deadline{color:#dfd1f5;margin:18px 0}.mission-progress{color:#c6e584;font-size:.9rem;margin:7px 0}.mission-lessons{list-style:none;padding:0;display:grid;gap:8px;margin:20px 0}.mission-lessons li{display:flex;gap:12px;color:#c8bddb;font-size:.9rem}.mission-lessons li span{color:#c7e58c}.mission-card .primary-btn{width:100%;justify-content:center;margin-top:15px}.insight-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:22px}.hub-panel h3{margin:0 0 8px;color:#fff}.hub-panel .muted{color:#b5a8cc}.weak-list{display:grid;gap:17px;margin-top:25px}.weak-row{display:grid;grid-template-columns:75px 1fr;gap:16px;align-items:center}.weak-row code{background:#aa8deb17;border:1px solid #aa8deb44;padding:12px 6px;text-align:center;border-radius:10px;color:#f2dcff;font:600 1rem 'JetBrains Mono',monospace}.weak-row>div>div:first-child{display:flex;justify-content:space-between;gap:12px;font-size:.85rem;margin-bottom:8px}.weak-row span{color:#bcb0cf}.weak-track{height:6px;background:#ffffff0d;border-radius:10px}.weak-track>span{display:block;height:100%;background:linear-gradient(90deg,#b898ff,#ffa3a6);border-radius:10px}.drill-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.drill-card{display:flex;align-items:center;gap:16px;border:1px solid #ffffff18;background:#ffffff04;border-radius:16px;padding:18px;margin-top:14px;min-width:0}.drill-card>div{flex:1;min-width:0}.drill-card h3{font-size:1rem;margin:0 0 4px;color:#eee8ff}.drill-card p,.drill-card small{font-size:.82rem;color:#bcaecf;margin:0}.drill-card .primary-btn{padding:10px 13px;white-space:nowrap;font-size:.85rem;min-height:44px}.drill-symbol{font:600 1rem 'JetBrains Mono',monospace;letter-spacing:2px;color:#dff58a;min-width:44px;max-width:80px;overflow-wrap:anywhere}.victory-xp{background:linear-gradient(110deg,#7956b522,#c9ed781c);border:1px solid #d7ed9455;border-radius:13px;color:#7450a4;font-weight:600;padding:14px;margin-top:12px}
/* Selected skins keep expected/pressed/error key cues stronger than decoration. */
.fx-premium[data-keyboard-skin="mint"] .keyboard-section{background:#103938;border-color:#458e80}.fx-premium[data-keyboard-skin="mint"] .kb-key{background:#c0efde;color:#17483f;border-color:#64a38f;box-shadow:0 4px #347764}.fx-premium[data-keyboard-skin="carbon"] .keyboard-section{background:#111d29;border-color:#385971}.fx-premium[data-keyboard-skin="carbon"] .kb-key{background:#253546;color:#bfeeff;border-color:#446780;box-shadow:0 4px #070e18}.fx-premium[data-keyboard-skin="sunset"] .keyboard-section{background:#54304a;border-color:#b47598}.fx-premium[data-keyboard-skin="sunset"] .kb-key{background:#ffd2bb;color:#6c3450;border-color:#d8939a;box-shadow:0 4px #a75b78}
.fx-premium[data-keyboard-skin] .kb-key.kb-target{background:#defb80;color:#24233b;border-color:#edffab;box-shadow:0 0 18px #dffb7766,0 4px #7e9b42}.fx-premium[data-keyboard-skin] .kb-key.kb-pressed{background:#b59cff;color:#211934}.fx-premium[data-keyboard-skin] .kb-key.kb-error{background:#ffb4a6;color:#5a1926}
.fx-premium[data-effect-color="cyan"] .fx-floating-score{color:#5cf0ef;text-shadow:0 0 16px #22d3ee}.fx-premium[data-effect-color="gold"] .fx-floating-score{color:#ffdb7e;text-shadow:0 0 16px #ffab40}
@media(min-width:1100px){.reward-grid:has(.reward-card:nth-child(4)){grid-template-columns:repeat(4,minmax(0,1fr))}.reward-grid:has(.reward-card:nth-child(4)) .skin-preview{gap:6px;padding:12px}.reward-grid:has(.reward-card:nth-child(4)) .skin-preview i{width:36px;height:38px}}
@media(max-width:900px){.insight-grid{grid-template-columns:1fr}.reward-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.drill-grid{grid-template-columns:1fr}.player-heading{align-items:flex-start;flex-direction:column}.hub-level{width:100%}.hub-section-intro{align-items:flex-start}.hub-section-intro h2{font-size:1.4rem}.hub-count{font-size:1.6rem}.arcade-app .site-nav{flex-wrap:wrap}.hub-tabs button{flex:1;padding:12px 14px}}
@media(max-width:580px){.reward-grid,.mission-grid{grid-template-columns:1fr}.reward-art{height:220px}.reward-art img{height:210px}.hub-tabs{gap:7px}.hub-tabs button{font-size:.82rem;min-width:calc(50% - 7px)}.mission-card,.hub-panel{padding:19px}.hub-section-intro{flex-direction:column;gap:10px}.hub-count{text-align:left}.drill-card{flex-wrap:wrap;gap:12px}.drill-card .primary-btn{width:100%;justify-content:center}.weak-row{grid-template-columns:62px 1fr;gap:10px}.weak-row>div>div:first-child{flex-wrap:wrap;gap:3px}.arcade-app .site-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.arcade-app .site-nav .nav-link{text-align:center;padding:10px 5px;font-size:.82rem}.player-heading{margin-top:20px}.player-summary{padding:20px}}
.arcade-app .reward-copy .primary-btn:disabled{background:#392c51;color:#b9abce;box-shadow:none;border:1px solid #6e568f;opacity:1}.arcade-app .reward-card.equipped .secondary-btn:disabled{background:#293c3a;color:#e0f59a;border:1px solid #91ad5c;box-shadow:none;opacity:1}
@media(prefers-reduced-motion:reduce){.reward-card{transition:none}.reward-card:hover{transform:none}}