.teacher-credit{display:inline-flex;margin:0 0 14px 12px;padding:5px 11px;border:1px solid #315747;border-radius:999px;color:#ade3be;background:#172d24;font-size:13px;font-weight:650;letter-spacing:.04em}.language-switch{display:flex;gap:10px;margin:0 0 24px;flex-wrap:wrap}.language-option{display:flex;align-items:center;gap:12px;min-width:210px;padding:13px 20px;border:1px solid var(--border,#303744);border-radius:12px;color:var(--muted,#a9b3c2);background:var(--panel,#171e29);text-decoration:none;font-weight:650}.language-option small{display:block;margin-top:3px;font-weight:400;font-size:12px;color:var(--muted,#a9b3c2)}.language-option.selected{border-color:#83c99c;background:#20332c;color:#c6efcf;box-shadow:inset 0 0 0 1px #83c99c33}.language-option:focus-visible{outline:3px solid #a6d6ff;outline-offset:3px}.java-dot{background:#f0a272!important}.sql-dot{background:#8cb5ec!important}.runner-disclaimer a{color:inherit;text-decoration:underline}.topbar-inner{gap:14px}#primary-navigation .nav-link{white-space:nowrap}@media(max-width:600px){.teacher-credit{margin-left:0;margin-right:12px}.language-switch{gap:8px}.language-option{flex:1;min-width:0;padding:12px 14px;gap:8px}.language-option small{font-size:11px}}@media(min-width:1101px) and (max-width:1500px){#primary-navigation .nav-link{font-size:12px;padding-left:7px;padding-right:7px}.topbar-inner{gap:10px}}

.ui-language-form{display:flex;align-items:center;margin:0}.topbar .ui-language-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:7px 10px;border:1px solid #424b4d;border-radius:8px;background:#272d2e;color:var(--text,#edf0ed);font-size:12px;white-space:nowrap;cursor:pointer}.topbar .ui-language-toggle:hover{background:#30383a}.topbar .ui-language-toggle:focus-visible{outline:3px solid #a6d6ff;outline-offset:3px}.topbar .ui-language-toggle .icon{width:16px;height:16px;flex:none}@media(max-width:540px){.topbar .ui-language-toggle{min-height:44px;padding:8px 10px}}

/* Keep the language button and main navigation reachable on phones. */
@media(max-width:540px){.topbar{height:auto}.topbar-inner{height:auto;min-height:70px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px;gap:8px}.topbar .brand{flex:1;min-width:0}.topbar .account-area{display:contents}.topbar .ui-language-form{order:3;flex-basis:100%;justify-content:flex-end}.topbar .nav-toggle{order:1}}
