/* Scoped Academy styles also work on the two standalone learning paths. */
.academy-page { margin: 0; background: #06111f; color: #eef5fa; font: 16px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.academy-page *, #prompt-academy * { box-sizing: border-box; }
.academy-shell { width: min(1200px,calc(100% - 48px)); margin: auto; }
.academy-page a { color: #9be1fc; text-underline-offset: 4px; }
.academy-header { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: space-between; border-bottom: 1px solid #294153; padding-block: 20px; }
.academy-brand img { width: 190px; max-width: 100%; height: 95px; object-fit: contain; display: block; }
.academy-header nav { display: flex; gap: 24px; flex-wrap: wrap; }
.academy-language { display: grid; gap: 5px; color: #c2d2de; }
.academy-page select { background: #0d2334; color: #eef5fa; border: 1px solid #68889c; border-radius: 8px; min-height: 46px; font: inherit; padding: 9px 12px; }
.academy-page .academy-skip { position: absolute; top: -100px; left: 16px; padding: 12px 20px; background: #d8bd8c; color: #06111f; z-index: 10; }
.academy-page .academy-skip:focus { top: 8px; }
.academy-page-title { margin: 56px 0 0; font-size: clamp(2.2rem,5vw,4rem); line-height: 1.12; font-weight: 600; letter-spacing: -.04em; }
.academy-footer { margin-block: 60px 24px; padding-top: 24px; border-top: 1px solid #294153; color: #b7c8d5; font-size: 14px; }
#prompt-academy { color: #eef5fa; margin-block: 90px; scroll-margin-top: 96px; --academy-line: #365264; }
#prompt-academy[hidden], #prompt-academy [hidden] { display: none !important; }
#prompt-academy .academy-kicker { display: block; color: #d8bd8c; font-size: 12px; font-weight: 700; letter-spacing: .18em; margin-bottom: 12px; }
#prompt-academy .academy-heading { max-width: 760px; }
#prompt-academy h2 { font-size: clamp(1.8rem,3.7vw,3.2rem); font-weight: 580; line-height: 1.15; letter-spacing: -.035em; margin: 0 0 16px; }
#prompt-academy .academy-heading p { color: #bfceda; max-width: 650px; margin: 0; }
#prompt-academy .academy-paths { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
#prompt-academy a { color: #a8e6fd; text-underline-offset: 5px; }
#prompt-academy .academy-paths a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid var(--academy-line); border-radius: 30px; text-decoration: none; }
#prompt-academy .academy-paths [aria-current] { border-color: #53cdfa; color: #c7efff; background: #143047; }
#prompt-academy .academy-mode { color: #bfceda; margin: 12px 0 30px; font-size: 14px; }
#prompt-academy .academy-layout { display: grid; grid-template-columns: 1.15fr 1fr; gap: 32px; align-items: start; }
#prompt-academy #academy-form, #prompt-academy .academy-preview { min-width: 0; border: 1px solid var(--academy-line); border-radius: 16px; padding: 26px; background: #0a1b2b; }
#prompt-academy .academy-preview { background: #0b2233; }
#prompt-academy .academy-steps { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 6px; list-style: none; padding: 0; margin: 0 0 18px; }
#prompt-academy button { font: inherit; min-height: 46px; padding: 10px 17px; border: 1px solid #68889c; border-radius: 8px; background: #102b3e; color: #eef5fa; cursor: pointer; line-height: 1.35; transition: border-color .15s ease,background .15s ease; }
#prompt-academy button:hover { background: #17394f; border-color: #92defb; }
#prompt-academy button:disabled { cursor: default; color: #a2b6c5; background: #102330; border-color: #496273; }
#prompt-academy .academy-steps button { display: flex; flex-direction: column; align-items: flex-start; width: 100%; min-height: 70px; font-size: 11px; padding: 9px 5px; border-color: transparent; border-radius: 0; background: transparent; border-bottom: 2px solid #365264; overflow-wrap: anywhere; }
#prompt-academy .academy-steps button span:first-child { font-size: 15px; margin-bottom: 6px; color: #c0d2de; }
#prompt-academy .academy-steps [aria-current] { border-bottom-color: #53cdfa; color: #b4eaff; background: #112c40; }
#prompt-academy .academy-progress { display: flex; justify-content: space-between; align-items: center; gap: 15px; color: #bfceda; font-size: 12px; margin-bottom: 24px; }
#prompt-academy progress { width: 120px; height: 4px; border: 0; appearance: none; background: #365264; border-radius: 4px; }
#prompt-academy progress::-webkit-progress-bar { background: #365264; border-radius: 4px; }
#prompt-academy progress::-webkit-progress-value { background: #53cdfa; border-radius: 4px; }
#prompt-academy progress::-moz-progress-bar { background: #53cdfa; border-radius: 4px; }
#prompt-academy fieldset { padding: 0; margin: 0; min-width: 0; border: 0; }
#prompt-academy legend { padding: 0; font-size: 21px; line-height: 1.4; font-weight: 600; }
#prompt-academy .academy-lesson { color: #bfceda; margin: 14px 0 22px; font-size: 14px; }
#prompt-academy label { display: block; color: #eef5fa; font-size: 14px; font-weight: 600; margin-bottom: 9px; }
#prompt-academy textarea, #prompt-academy select { display: block; width: 100%; max-width: 100%; min-width: 0; border: 1px solid #68889c; border-radius: 8px; background: #061521; color: #eef5fa; font: inherit; padding: 12px 14px; min-height: 48px; line-height: 1.6; }
#prompt-academy textarea { resize: vertical; }
#prompt-academy textarea::placeholder { color: #a6bdcd; opacity: 1; }
#prompt-academy textarea[aria-invalid], #prompt-academy select[aria-invalid] { border-color: #ffa7a7; }
#prompt-academy .academy-hint { color: #bdcfdb; font-size: 12px; line-height: 1.65; margin: 10px 0; }
#prompt-academy .academy-error { min-height: 22px; color: #ffc0bd; font-size: 13px; margin: 10px 0; }
#prompt-academy .academy-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
#prompt-academy .academy-primary { color: #06111f; background: #d8bd8c; border-color: #d8bd8c; font-weight: 650; }
#prompt-academy .academy-primary:hover { background: #eed6ad; border-color: #eed6ad; }
#prompt-academy details { border-top: 1px solid var(--academy-line); margin-top: 28px; padding-top: 20px; }
#prompt-academy summary { cursor: pointer; padding: 8px 0; font-weight: 600; min-height: 44px; }
#prompt-academy .academy-combo-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
#prompt-academy .academy-combo-row label { grid-column: 1/-1; margin: 10px 0 0; }
#prompt-academy .academy-selected { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
#prompt-academy .academy-selected button { font-size: 12px; padding: 8px 12px; max-width: 100%; text-align: left; }
#prompt-academy #academy-prompt { font-size: 14px; min-height: 300px; }
#prompt-academy .academy-status { color: #b3edff; font-size: 13px; min-height: 22px; }
#prompt-academy .academy-naliya { padding-top: 20px; margin-top: 20px; border-top: 1px solid var(--academy-line); }
#prompt-academy .academy-naliya a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; }
#prompt-academy .academy-examples { margin-top: 34px; }
#prompt-academy .academy-example-grid { display: grid; grid-template-columns: 1fr 1.7fr; gap: 24px; padding-top: 18px; }
#prompt-academy .academy-example-grid>div { background: #0a1b2b; border-left: 2px solid #68889c; border-radius: 0 10px 10px 0; padding: 20px 24px; }
#prompt-academy .academy-example-grid>div:last-child { border-color: #53cdfa; background: #0d2538; }
#prompt-academy .academy-example-label { display: block; color: #d8bd8c; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
#prompt-academy .academy-example-grid p { margin-bottom: 0; font-size: 14px; }
#prompt-academy .academy-why { max-width: 900px; color: #bfceda; font-size: 14px; }
#prompt-academy :focus-visible, .academy-page :focus-visible { outline: 3px solid #86ddff; outline-offset: 4px; }
@media (max-width: 850px) { #prompt-academy .academy-layout { grid-template-columns: 1fr; gap: 22px; } #prompt-academy .academy-example-grid { grid-template-columns: 1fr; gap: 14px; } #prompt-academy { margin-block: 60px; } }
@media (max-width: 480px) { .academy-shell { width: calc(100% - 32px); } .academy-header { gap: 16px; } .academy-brand img { width: 140px; height: 70px; } .academy-header nav { gap: 16px; font-size: 14px; } #prompt-academy #academy-form, #prompt-academy .academy-preview { padding: 17px; } #prompt-academy .academy-steps { gap: 3px; } #prompt-academy .academy-steps button { font-size: 10px; padding: 8px 3px; } #prompt-academy .academy-combo-row { grid-template-columns: 1fr; } #prompt-academy .academy-combo-row label { grid-column: auto; } #prompt-academy .academy-actions button { flex: 1 1 auto; } }
@media (prefers-reduced-motion: reduce) { #prompt-academy *, .academy-page * { scroll-behavior: auto !important; transition: none !important; } }