.syntax-illustration{margin:1rem auto;max-width:100%;width:min(100%,28rem);display:flex;justify-content:center}
.syntax-illustration img{display:block;max-width:100%;width:auto;height:auto;max-height:19rem;object-fit:contain}
.syntax-illustration[data-illustration="pants"] img{max-height:32rem}
.syntax-illustration[data-illustration="birthday"],.syntax-illustration[data-illustration="dawn"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="fonetika-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="fonetika-"] img{max-height:20rem}
.syntax-illustration[data-illustration^="morfologija-1-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="morfologija-1-"] img{max-height:20rem}
.syntax-illustration[data-illustration^="morfologija-2-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="morfologija-2-"] img{max-height:20rem;object-fit:contain}
.syntax-illustration[data-illustration^="morfologija-3-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="morfologija-3-"] img{max-height:20rem;object-fit:contain}
.syntax-illustration[data-illustration^="akcenat-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="akcenat-"] img{max-height:20rem;object-fit:contain}
.syntax-illustration[data-illustration^="pravopis-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="pravopis-"] img{max-height:20rem;object-fit:contain}
.syntax-illustration[data-illustration^="od-cirila-do-vuka-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="od-cirila-do-vuka-"] img{max-height:20rem;object-fit:contain}
.syntax-illustration[data-illustration^="stilska-sredstva-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="stilska-sredstva-"] img{max-height:20rem;object-fit:contain}
.syntax-illustration[data-illustration^="podela-knjizevnosti-"]{width:min(100%,34rem)}
.syntax-illustration[data-illustration^="podela-knjizevnosti-"] img{max-height:20rem;object-fit:contain}
.pravopis-illustration-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:end;margin:1rem auto;max-width:42rem}
.pravopis-illustration-group .pravopis-illustration{margin:0;width:100%}
.pravopis-illustration-group .pravopis-illustration img{max-height:17rem}
.syntax-illustration[data-illustration="fonetika-f4-07"]{width:min(100%,40rem)}
.syntax-illustration[data-illustration="fonetika-f5-17"] img{max-height:22rem}
.achievements-content{display:grid;grid-template-columns:minmax(0,1fr) 13rem;gap:1.5rem;align-items:start}
.achievements-content>.jana-progress{grid-column:2;grid-row:1}
.achievements-content>.badge-grid{grid-column:1;grid-row:1;min-width:0}
.jana-progress{text-align:center;min-width:0}
.jana-progress .syntax-illustration{margin:0 auto}
.jana-progress .syntax-illustration img{max-height:21rem}
.jana-progress p{font-weight:bold;margin:.5rem 0 1rem}
@media(max-width:900px){.achievements-content{display:flex;flex-direction:column}.achievements-content>.jana-progress{align-self:center;width:min(100%,22rem)}.achievements-content>.badge-grid{width:100%}.jana-progress .syntax-illustration img{max-height:15rem}}
@media(max-width:600px){.syntax-illustration img{max-height:14rem}.syntax-illustration[data-illustration="pants"] img{max-height:27rem}.syntax-illustration[data-illustration^="fonetika-"] img,.syntax-illustration[data-illustration^="morfologija-1-"] img,.syntax-illustration[data-illustration^="morfologija-2-"] img,.syntax-illustration[data-illustration^="morfologija-3-"] img,.syntax-illustration[data-illustration^="akcenat-"] img,.syntax-illustration[data-illustration^="pravopis-"] img,.syntax-illustration[data-illustration^="od-cirila-do-vuka-"] img,.syntax-illustration[data-illustration^="stilska-sredstva-"] img,.syntax-illustration[data-illustration^="podela-knjizevnosti-"] img{max-height:14rem}.syntax-illustration[data-illustration="fonetika-f5-17"] img{max-height:16rem}.pravopis-illustration-group{grid-template-columns:1fr;gap:.75rem}.pravopis-illustration-group .pravopis-illustration img{max-height:13rem}}

/* Завршни преглед 2 (Б4): одломак и наслов задатка имају исту величину у свим режимима и областима (мера: УЧИМ и ВЕЖБАМ). */
.layout .assessment-task h2{font-size:1.3rem;line-height:1.5}
.layout .assessment-task .task-example{font-size:clamp(1.25rem,2vw,1.65rem);line-height:1.7}
/* Завршни преглед 2 (Б9): главни део добија фокус програмски (после избора области); оквир се не црта, јер до њега тастатура не долази табулатором. */
#main[tabindex="-1"]:focus,#main[tabindex="-1"]:focus-visible{outline:none!important}
