.ps-app { width: 100%; max-width: 48rem; margin: 0 auto 2rem; color: var(--site-ink); }
.ps-app *, .ps-app *::before, .ps-app *::after { box-sizing: border-box; }
.ps-app [hidden] { display: none !important; }
.ps-app button, .ps-app input { font: inherit; }
.ps-app button { color: inherit; cursor: pointer; touch-action: manipulation; }
.ps-settings { margin-bottom: .75rem; border: 1px solid var(--site-line); border-radius: .7rem; background: var(--site-paper); }
.ps-settings > summary { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem .6rem; min-height: 3rem; padding: .65rem .8rem; cursor: pointer; font-size: .875rem; }
.ps-current-mode { flex: 1; min-width: 8rem; font-weight: 650; line-height: 1.35; }
.ps-current-level { white-space: nowrap; font-variant-numeric: tabular-nums; }
.ps-settings-label { color: var(--site-green-dark); text-decoration: underline; text-underline-offset: .2em; }
.ps-controls { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: .75rem; padding: .25rem .8rem .8rem; }
.ps-controls fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.ps-controls legend { margin-bottom: .35rem; font-size: .875rem; font-weight: 650; }
.ps-toggle { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; }
.ps-toggle button { min-height: 3rem; padding: .5rem .65rem; border: 1px solid var(--site-line); border-radius: .65rem; background: var(--site-paper); font-size: .9375rem; line-height: 1.3; }
.ps-toggle [aria-pressed="true"] { border: 2px solid var(--site-green); padding: calc(.5rem - 1px) calc(.65rem - 1px); background: var(--site-mint); font-weight: 700; }
.ps-task { padding: clamp(.8rem, 3vw, 1.5rem); border: 1px solid var(--site-line); border-radius: 1rem; background: var(--site-paper); }
.ps-task h2 { margin: 0 0 1rem; font-size: clamp(1.25rem, 4.5vw, 1.65rem); line-height: 1.3; text-align: center; text-wrap: balance; }
.ps-question-objects { max-width: 23rem; margin: 0 auto 1.25rem; }
.ps-objects { display: grid; grid-template-columns: repeat(var(--ps-columns), minmax(0, 1fr)); align-items: center; justify-items: center; gap: .35rem; width: 100%; max-width: calc(var(--ps-columns) * 4rem); margin-inline: auto; }
.ps-object { position: relative; display: grid; place-items: center; width: 100%; max-width: 4rem; aspect-ratio: 1; min-width: 0; }
.ps-object img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ps-object img[hidden] { display: none !important; }
.ps-object-fallback { display: grid; place-items: center; width: 100%; height: 100%; font-size: clamp(1.75rem, 7vw, 2.75rem); line-height: 1; }
.ps-object-word { display: none; }
.ps-image-ready .ps-object-fallback { display: none; }
.ps-text-mode .ps-objects { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 22rem; }
.ps-text-mode .ps-object { max-width: none; aspect-ratio: auto; min-height: 2.75rem; padding: .3rem; border: 1px solid var(--site-line); border-radius: .4rem; }
.ps-text-mode .ps-object img, .ps-text-mode .ps-object-fallback { display: none; }
.ps-text-mode .ps-object-word { display: block; font-size: .875rem; overflow-wrap: anywhere; }
.ps-answers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.ps-answer { min-width: 0; min-height: 4rem; padding: .5rem; border: 2px solid #a7b6a4; border-radius: .8rem; background: #fff; font-size: 2rem; font-weight: 700; line-height: 1.2; }
.ps-answer[data-state="retry"] { border-color: #92652e; background: #fff8e9; }
.ps-answer[data-state="correct"] { border-color: var(--site-green); background: var(--site-mint); }
.ps-answer[aria-disabled="true"] { cursor: default; }
.ps-app[data-mode="find"] .ps-answers { grid-template-columns: minmax(0, 1fr); }
.ps-app[data-mode="find"] .ps-answer { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); align-items: center; gap: .6rem; padding: .65rem; }
.ps-app[data-mode="find"] .ps-objects { max-width: 21rem; }
.ps-group-label { font-size: 1rem; color: var(--site-muted); font-weight: 600; }
.ps-feedback { min-height: 3.2em; margin: .85rem 0 .75rem; font-size: 1rem; line-height: 1.5; }
.ps-feedback[data-state="correct"] { color: var(--site-green-dark); }
.ps-next { display: flex; align-items: center; justify-content: space-between; gap: .75rem; width: 100%; min-height: 3.25rem; padding: .75rem 1rem; border: 1px solid var(--site-green); border-radius: .7rem; background: var(--site-green); color: #fff !important; font-size: 1rem; font-weight: 650; }
.ps-adult { margin-top: .75rem; font-size: .875rem; }
.ps-adult summary { min-height: 2.75rem; padding-block: .65rem; cursor: pointer; }
.ps-adult label { display: flex; align-items: center; gap: .6rem; min-height: 2.75rem; cursor: pointer; }
.ps-adult input { flex: none; width: 1.25rem; height: 1.25rem; accent-color: var(--site-green); }
.ps-adult p { max-width: 65ch; margin: .6rem 0; color: var(--site-muted); }
.ps-hub { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-bottom: 2rem; }
.ps-activity { display: flex; flex-direction: column; min-width: 0; padding: clamp(1rem, 3vw, 1.75rem); border: 1px solid var(--site-line); border-radius: 1rem; background: var(--site-paper); color: var(--site-ink); text-decoration: none; }
.ps-activity-picture { display: flex; align-items: center; gap: 1rem; min-height: 5rem; max-width: 18rem; margin-bottom: 1rem; }
.ps-demo-number { font-size: 2.5rem; font-weight: 700; color: var(--site-green-dark); }
.ps-activity h2 { margin: 0 0 .6rem; font-size: 1.4rem; line-height: 1.3; }
.ps-activity p { margin: 0 0 1.25rem; color: var(--site-muted); }
.ps-activity-start { display: flex; justify-content: space-between; gap: 1rem; margin-top: auto; padding-block: .5rem; color: var(--site-green-dark); font-weight: 650; text-decoration: underline; text-underline-offset: .2em; }
.ps-guide { max-width: 48rem; margin: 2rem auto 3rem; padding-top: 1.5rem; border-top: 1px solid var(--site-line); }
.ps-guide h2 { margin: 0 0 .75rem; font-size: 1.35rem; line-height: 1.3; }
.ps-guide p { color: var(--site-muted); line-height: 1.75; }
.ps-guide a { color: var(--site-green-dark); text-underline-offset: .2em; }
.ps-practice-intro { max-width: 48rem; margin-inline: auto; }
@media (max-width: 36rem) {
  .ps-hub { grid-template-columns: minmax(0, 1fr); }
  .ps-practice-intro { margin-block: .4rem 1rem; }
  .ps-practice-intro h1 { font-size: 1.65rem; }
  .ps-practice-intro p { margin-top: .4rem; font-size: .9375rem; }
  .ps-controls { grid-template-columns: minmax(0, 1fr); gap: .55rem; }
  .ps-level button { font-size: .875rem; }
  .ps-task h2 { margin-bottom: .75rem; }
  .ps-question-objects { margin-bottom: 1rem; }
}
@media (forced-colors: active) {
  .ps-toggle [aria-pressed="true"], .ps-answer[data-state="correct"] { outline: 2px solid Highlight; outline-offset: -4px; }
}