/* Paper Flight Academy: emerald flight instruments and luminous mint trim. */
.pa {
  --pa-ink: #f2efda;
  --pa-muted: #91b5a4;
  --pa-accent: #9ce2c4;
  --pa-line: #3f6b59;
  color-scheme: dark;
  color: var(--pa-ink);
  background: radial-gradient(ellipse at 45% 15%, #10271f55, transparent 60%), #061711;
  padding: 0;
}
.pa-academy { position: relative; display: flex; align-items: center; padding: 13px 3.4%; border-bottom: 1px solid #96ddba; box-shadow: 0 1px 5px #81d9ad45; }
.pa-academy::after { content: '✦'; position: absolute; right: 3%; bottom: -20px; font-size: 38px; line-height: 1; color: #a4e8ca; text-shadow: 0 0 16px #8fdbb5; }
.pa-academy-brand { display: flex; align-items: center; gap: 20px; min-width: 0; }
.pa-academy-badge { width: 72px; height: 72px; flex: 0 0 72px; fill: none; stroke: #9ae4c2; stroke-width: 1.5; filter: drop-shadow(0 0 3px #72c6a033); }
.pa .pa-academy h1 { margin: 0; font: italic 900 28px/1.1 'Arial Black', 'Helvetica Neue', sans-serif; text-transform: uppercase; letter-spacing: -.035em; }
.pa-academy p { margin: 6px 0 0; color: #9cc4b0; font: 10px/1.5 ui-monospace, monospace; letter-spacing: .09em; text-transform: uppercase; }
.pa-academy-motto { display: none; }
.pa-workbench { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.pa-stage-heading { padding: 25px 5.4% 16px; align-items: center; gap: 20px; }
.pa-stage-heading .pa-eyebrow { color: #b4e6ce; font-size: 11px; }
.pa-stage-heading h2 { margin-top: 3px; font: italic 900 34px/1.1 'Arial Black', 'Helvetica Neue', sans-serif; text-transform: uppercase; letter-spacing: -.025em; }
.pa-stage-actions { gap: 15px; }
.pa-stage-actions button, .pa-paper-label { padding: 10px 18px; color: #f2efda; background: linear-gradient(135deg, #17382b, #0a1c15); border: 1px solid #648f7a; border-radius: 25px; box-shadow: inset 0 0 0 1px #91c5a912, 0 2px 2px #0009; font-size: 12px; }
.pa-paper-label { font: 12px ui-monospace, monospace; }.pa select { color: #f2efda; min-width: 65px; }.pa select option { color: #f2efda; background: #10271d; }
.pa-stage-actions button[aria-pressed="true"] { background: #275d46; color: #edffe9; border-color: #9de3bf; }
.pa-stage { margin: 0 3.4%; height: clamp(360px, 38vw, 470px); border: 1px solid #668e78; border-radius: 16px; isolation: isolate; background-color: #0a1e17; background-image: linear-gradient(#4d765c26 1px, transparent 1px), linear-gradient(90deg, #4d765c26 1px, transparent 1px), radial-gradient(ellipse at center, #163a292e, transparent 75%); background-size: 26px 26px, 26px 26px, 100% 100%; box-shadow: inset 0 0 0 2px #90d4a719, 0 0 0 2px #52866a20, inset 0 0 60px #0004; }
.pa-canvas { position: relative; z-index: 0; }
.pa-flight-reticle { position: absolute; width: 300px; height: 300px; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 1px solid #65977320; border-radius: 50%; z-index: -1; pointer-events: none; }
.pa-flight-reticle::before { content: ''; position: absolute; inset: 14px; border: 1px dashed #65977330; border-radius: 50%; box-shadow: 0 0 0 6px #65977309, 0 0 0 11px #6597730a; }
.pa-flight-reticle::after { content: ''; position: absolute; inset: -10px; border: 7px solid transparent; border-left-color: #5e9e753a; border-right-color: #5e9e753a; border-radius: 50%; }
.pa-arrow { width: 60px; height: 60px; top: 43%; border: 1px solid #a1e4c3; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #26583e, #0b281c 75%); box-shadow: inset 0 0 0 2px #91d7b035, 0 3px 2px #0009, 0 0 9px #88dfb41a; color: #eaffe7; font-size: 30px !important; }
.pa-arrow:hover:enabled { background: #306649; box-shadow: 0 0 16px #8cd2a544; }.pa-arrow:disabled { opacity: .4; }
.pa-corner { border-color: #94d8af70; width: 24px; height: 24px; }
.pa-corner-tl { top: 36px; left: 32%; }.pa-corner-br { bottom: 37px; right: 32%; }
.pa-view-controls { left: 28px; bottom: 17px; gap: 13px; }
.pa-view-controls button { background: linear-gradient(#163527, #081b12); border: 1px solid #749d86; border-radius: 20px; padding: 8px 13px; color: #eeefdb; box-shadow: 0 2px 2px #0009; font: 11px ui-monospace, monospace; }
.pa-drag-hint { color: #9edbbd; right: 28px; bottom: 26px; font-size: 9px; }
.pa-loading { border-radius: 25px; background: #0a1e17ef; color: #d7f5df; }
.pa-instruction { display: grid; grid-template-columns: .8fr 1.2fr; gap: 12px 35px; padding: 23px 5.4% 8px; border: 0; background: transparent; min-height: 0; }
.pa-instruction > div { grid-column: 1; grid-row: 1; }
.pa-instruction h3 { margin: 2px 0 0; font-size: 28px; line-height: 1.15; font-weight: 800; letter-spacing: -.04em; }
.pa-instruction .pa-eyebrow { color: #b4ecd0; font-size: 12px; }
.pa-instruction p { grid-column: 2; grid-row: 1 / 3; align-self: start; padding-top: 10px; max-width: none; color: #dedfd1; font-size: 14px; line-height: 1.75; }
.pa-replay { grid-column: 1; grid-row: 2; justify-self: start; border-radius: 22px; padding: 8px 15px; color: #f2efda; background: linear-gradient(#143526, #06170f); border: 1px solid #81b697; box-shadow: 0 2px 2px #0008; font-size: 12px !important; }
.pa-timeline { margin: 0 5.4%; padding: 9px 0 13px; background: transparent; border-top: 1px solid #70b08d; }
.pa-steps { max-width: none; padding: 3px 8px; border: 1px solid #366e50; border-radius: 6px; background: #0a2017; box-shadow: inset 0 2px 4px #0007, 0 0 8px #80cf9f12; gap: 8px; }
.pa-steps button::after { height: 13px; border: 1px solid #4d7b62; border-radius: 3px; background: linear-gradient(#17392a, #0c2118); }
.pa-steps button.pa-complete::after { background: #3e8260; }
.pa-steps button[aria-current="step"]::after { height: 13px; background: #9be1bc; border-color: #b2f2d0; box-shadow: 0 0 10px #9ae8bd44; }
.pa-scrub { color: #9ac5ad; font-size: 9px; white-space: nowrap; }.pa-scrub input { accent-color: #9cdeba; }
.pa-tip { margin: 0 3.4%; padding: 13px 2%; border-top: 1px solid #618f74; border-bottom: 1px solid #618f74; background: transparent; gap: 26px; }
.pa-tip > span { color: #b6f0d1; font-size: 10px; font-weight: 400; }.pa-tip p { color: #9abdac; font-size: 12px; }
.pa-hangar { max-width: 1320px; margin: 0 auto; padding: 32px 5.4%; }
.pa-hangar-heading { padding-bottom: 10px; border-bottom: 4px double #a0debc; gap: 15px; margin-bottom: 18px; }
.pa-hangar-heading .pa-eyebrow { color: #b4ebd0; font-size: 10px; }
.pa-hangar h2 { margin-top: 3px; font: italic 900 34px/1.1 'Arial Black', 'Helvetica Neue', sans-serif; letter-spacing: -.025em; text-transform: uppercase; }
.pa-hangar h2 span { color: #a1c8b1; font: 11px ui-monospace, monospace; text-transform: none; }
.pa-hangar-heading > span { color: #94bba5; font-size: 9px; }
.pa-gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.pa-card { padding: 0 16px 13px; border: 1px solid #689a7d; border-radius: 17px; background: linear-gradient(140deg, #132c20, #071b13); box-shadow: inset 0 0 0 1px #c1f4d20b; color: #f1eed7; }
.pa-card canvas { object-fit: contain; margin: 0 -16px 10px; width: calc(100% + 32px); height: 130px; background: radial-gradient(ellipse at 50% 70%, #2b4a37, #10261c); border-bottom: 1px solid #4b795e; }
.pa-card strong { text-transform: uppercase; font: italic 800 14px/1.2 'Arial Black', 'Helvetica Neue', sans-serif; }
.pa-card small { font-size: 12px; color: #d3dbc9; line-height: 1.45; margin-top: 6px; min-height: 35px; }
.pa-card-meta { color: #acd9be; border-top: 1px solid #355d44; padding-top: 8px; font-size: 9px; letter-spacing: .03em; }.pa-card-meta span:last-child { color: #c4f4d9; }
.pa-card-number { width: 28px; height: 28px; top: 11px; left: 12px; border: 1px solid #78b798; background: #061b12; border-radius: 50%; display: grid; place-items: center; color: #f7f5db; font: bold 10px ui-monospace, monospace; z-index: 1; }
.pa-card[aria-pressed="true"] { border-color: #b1f2d1; background: linear-gradient(145deg, #173b28, #071c12); box-shadow: 0 0 0 1px #9ae4bb, 0 0 15px #70c39816; }
.pa-card[aria-pressed="true"] canvas { background: radial-gradient(ellipse at center, #285f41, #0b2318); }
.pa-card:hover { border-color: #a2ddbc; transform: translateY(-2px); }
.pa-footer { margin: 0 3.4%; padding: 22px 1.6% 32px; border-top: 1px solid #9addb9; color: #e7edda; display: flex; flex-wrap: wrap; gap: 15px; }
.pa-footer .pa-labs-credit { font: 11px/1.6 ui-monospace, monospace; color: #ecebd8; letter-spacing: .04em; }
.pa-footer .pa-labs-credit a { font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #92ccab; }
.pa-footer .pa-footer-motto { color: #8db49d; font: 10px/1.6 ui-monospace, monospace; letter-spacing: .08em; }
@media (max-width: 720px) {
  .pa-academy { padding: 12px 16px; }.pa-academy-brand { gap: 13px; }.pa-academy-badge { width: 52px; height: 52px; flex-basis: 52px; }
  .pa .pa-academy h1 { font-size: 22px; }.pa-academy p { font-size: 8px; letter-spacing: .025em; }
  .pa-stage-heading h2 { font-size: 27px; }.pa-stage-actions { gap: 8px; }.pa-stage-actions button, .pa-paper-label { padding: 8px 12px; font-size: 10px; }
  .pa-instruction h3 { font-size: 24px; }.pa-instruction p { font-size: 12px; }.pa-gallery { gap: 12px; }.pa-card { padding: 0 12px 12px; }.pa-card canvas { margin-left: -12px; margin-right: -12px; width: calc(100% + 24px); height: 115px; }.pa-card small { font-size: 11px; }
}
@media (max-width: 620px) {
  .pa .pa-academy h1 { font-size: 20px; }.pa-academy-badge { width: 44px; height: 44px; flex-basis: 44px; }.pa-academy::after { font-size: 28px; bottom: -14px; }
  .pa-stage-heading { padding: 22px 5% 15px; }.pa-stage-heading .pa-eyebrow { font-size: 8px; }.pa-stage-heading h2 { font-size: 24px; }.pa-stage-actions { flex-direction: column; }.pa-stage-actions button { font-size: 9px; }
  .pa-stage { margin: 0 3%; height: 320px; border-radius: 12px; }.pa-flight-reticle { width: 220px; height: 220px; }.pa-arrow { width: 40px; height: 40px; font-size: 22px !important; }.pa-previous { left: 12px; }.pa-next { right: 12px; }
  .pa-view-controls { left: 17px; bottom: 28px; gap: 8px; }.pa-view-controls button { font-size: 8px; padding: 6px 9px; }.pa-drag-hint { left: 18px; right: auto; bottom: 10px; font-size: 7px; }
  .pa-instruction { display: grid; grid-template-columns: 1fr; gap: 12px; padding: 20px 5% 14px; }.pa-instruction > div { grid-row: 1; }.pa-instruction p { grid-column: 1; grid-row: 2; padding: 0; min-width: 0; }.pa-replay { grid-column: 1; grid-row: 3; }
  .pa-timeline { display: block; margin: 0 5%; }.pa-steps { gap: 5px; }.pa-scrub { margin-top: 14px; }.pa-tip { display: block; padding: 11px 2%; }.pa-tip p { margin-top: 6px; font-size: 11px; }
  .pa-hangar { padding-top: 29px; }.pa-hangar h2 { font-size: 28px; }.pa-hangar-heading > span { display: none; }.pa-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }.pa-card strong { font-size: 12px; }.pa-card small { min-height: 34px; }.pa-card-meta { font-size: 8px; }.pa-footer .pa-footer-motto { width: 100%; font-size: 9px; }
}

.pa-fleet-divider { grid-column: 1 / -1; padding: 26px 0 12px; margin-top: 8px; border-top: 1px solid #57755f; }
.pa-fleet-divider h3 { margin: 0; color: #ecd6aa; font: italic 800 24px/1.2 'Arial Black', sans-serif; text-transform: uppercase; letter-spacing: -.03em; }
.pa-fleet-divider p { margin: 7px 0 0; color: #a6b8a7; font-size: 12px; line-height: 1.6; }
.pa-card-experimental { border-color: #8b9370; }
