/* Readable controls, compact mobile flow and clear ongoing attempts. */
.mission-bar .category-label{background:#0759b5;border-color:#ffffff50;font-size:.875rem;line-height:1.4}
.art-caption{color:#536b86;font-size:.875rem}
.date-label,.eyebrow,.small-category,.level-tag,.library-meta,.category-field-label,.topic-label,.topic-buttons button,.card-bottom,.card-bottom .level-tag,.library-card .small-category,.library-card-image .card-number,.status-tag,.below-card,.below-card a,.share-link,.progress-info p,.progress-summary p,.success-count,.success-hint,.storage-note,.under-instructions,.help,.share-dialog .dialog-note{font-size:.875rem;line-height:1.6}
.mission-copy h1{font-size:clamp(2rem,4vw,3rem);letter-spacing:-.035em;overflow-wrap:anywhere}
.mission-intro,.step-list li{font-size:1rem}
.step-list .quote{font-size:1.125rem}
.primary{font-size:1rem}.small-button,.back-link,.text-link,.variant-link,.undo-button{font-size:.875rem;min-height:44px}
.home-level{max-width:400px;margin-bottom:20px}.home-level .level-select{margin:0}
.level-select{margin:0;padding:0;min-inline-size:0}
.level-select label{flex:1;min-width:0}.level-select span{font-size:.875rem;white-space:normal;line-height:1.5;min-height:48px;display:flex;align-items:center;justify-content:center}
.later-button{display:block;margin:18px auto 0;padding:10px 14px;min-height:44px;border:0;background:transparent;color:var(--link);font-size:.875rem;line-height:1.5;text-decoration:underline;text-underline-offset:4px}
.offline-note{font-size:.875rem;color:var(--muted);margin:20px 0 0;line-height:1.65}
.help summary{min-height:44px;display:flex;align-items:center;gap:8px}.help summary::before{content:'+';font-size:1.25rem}.help[open] summary::before{content:'−'}
.help p{font-size:1rem}
.scene-art{display:block;width:100%;height:auto;object-fit:contain;aspect-ratio:1;min-width:0}
.art-panel:has(.scene-art){padding:0;min-height:0;width:100%;max-width:340px;aspect-ratio:1;margin:auto;border:0;overflow:hidden}.art-panel .scene-art{width:100%;height:100%;object-fit:cover;object-position:center top}
.mini-art .scene-art{width:100%;height:100%;object-fit:cover;object-position:center top}
.library-card-image:has(.scene-art){border:0;overflow:hidden;height:auto;aspect-ratio:4/3}
.library-card-image .scene-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.library-card-image:has(.scene-art) .card-number{background:var(--surface);padding:3px 6px;border-radius:5px}
.success-art.scene-art{width:190px;max-width:100%;margin:20px auto;border-radius:12px}
.library-card,.mission-copy,.progress-action,.progress-info,.dialog-secondary .small-button{min-width:0}
.library-card h2,.progress-info h3{overflow-wrap:anywhere}
.card-bottom,.page-topline,.mission-bar,.below-card,.progress-action{flex-wrap:wrap}
.card-bottom{gap:8px}.card-bottom>span:last-child{display:inline-flex;align-items:center;gap:5px}
.bottom-nav a{font-size:.875rem;overflow-wrap:anywhere}
.share-dialog .dialog-note[data-dialog-status]{padding:12px;background:var(--surface-soft);border-radius:8px;font-weight:700}
.share-dialog .primary{font-size:1rem}
.share-message-details summary{min-height:44px}
.share-message-details .message-preview{font-size:1rem}
@media(max-width:600px){
 /* Vaste kaartvolgorde: opdracht, illustratie, startactie. */
 .mission-body{padding:22px}.mission-copy{order:0}.mission-aside{order:1;margin-top:22px}.mission-actions{order:2;margin-top:22px}
 .mission-copy h1{font-size:2rem;line-height:1.18}.mission-bar{padding:14px 18px}.mission-number{font-size:.875rem}
 .mission-bar .category-label{font-size:.875rem}.variant-link,.share-link{font-size:.875rem;min-height:44px}
 .art-panel{min-height:120px;max-height:none}.art-panel:has(.scene-art){max-width:210px;margin:auto}.art-panel .scene-art{max-height:210px}
 .home-level{max-width:none}.home-level .level-select{width:100%}
 .library-grid{grid-template-columns:minmax(0,1fr);gap:14px}
 .library-card{display:grid;grid-template-columns:40% minmax(0,1fr)}
 .library-card-image{height:100%;min-height:156px;border-bottom:0;overflow:hidden}
 .library-card-image:has(.scene-art){height:100%;aspect-ratio:auto}
 .library-card-image .card-number{display:none}.library-card-image .art{width:92px}
 .library-card-content{padding:12px}.library-card h2{font-size:1rem;margin:5px 0 10px}
 .library-card .status-tag{font-size:.875rem;top:auto;bottom:8px;right:4px;left:4px;text-align:center;padding:5px 3px}
 .card-bottom,.card-bottom .level-tag,.library-card .small-category{font-size:.875rem}
 .topic-buttons button,.category-options button,.category-summary,.search-field input{font-size:1rem}
 .category-field-label,.topic-label{font-size:.875rem}
 .below-card,.below-card a,.date-label,.eyebrow,.success-count,.progress-info p,.progress-summary p,.under-instructions,.storage-note,.help,.resume-banner,.resume-banner .text-link{font-size:.875rem}
 .instructions-body{padding:24px 18px}.instructions-body h1{font-size:1.625rem}.step-list li{font-size:1rem;grid-template-columns:28px minmax(0,1fr);gap:10px}.step-list .quote{font-size:1.125rem;padding:12px}
 .success-body h1{font-size:2rem}.success-result{font-size:1rem}.progress-info h3{font-size:1rem}
 .share-dialog{padding:20px}.dialog-heading{align-items:flex-start}.dialog-heading h2{font-size:1.375rem;overflow-wrap:anywhere}
 .whatsapp-primary,.share-dialog .primary{font-size:1rem;line-height:1.5}.dialog-secondary{display:grid;grid-template-columns:minmax(0,1fr);width:100%}
 .bottom-nav a{font-size:.875rem}.bottom-nav-inner{gap:3px}
}
@media(max-width:360px){.library-card{grid-template-columns:40% minmax(0,1fr)}.library-card-content{padding:12px}.mission-copy h1{font-size:1.875rem}.mission-body{padding:20px 18px}.header-inner{gap:12px}}

/* Compact saved missions: picture left, action below the text on the right. */
.progress-list{gap:10px}
.progress-item{display:grid;grid-template-columns:56px minmax(0,1fr);grid-template-rows:auto auto;gap:0 12px;padding:10px 12px}
.progress-item .mini-art{grid-column:1;grid-row:1 / 3;width:56px;min-width:0;height:56px;border-radius:8px;align-self:center}
.progress-item .progress-info{grid-column:2;grid-row:1}
.progress-item .progress-info h3{font-size:1rem;line-height:1.35}
.progress-item .progress-info p{margin-top:3px;font-size:.875rem;line-height:1.4}
.progress-item .progress-action{grid-column:2;grid-row:2;width:auto;justify-content:flex-end;gap:4px 12px}
.progress-item .progress-action .text-link{margin:0;font-size:.875rem;min-height:44px}
.progress-item .undo-button{min-height:44px}

/* Equal level choices at desktop, tablet and phone widths. */
.level-select{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;width:100%;min-width:0}
.level-select label{display:flex;min-width:0}
.level-select span{width:100%;height:100%;padding:12px 14px;text-align:center}
.library-controls{display:grid;grid-template-columns:minmax(0,1fr) 320px;align-items:stretch}
.library-controls .search-field{min-width:0}
.library-controls .search-field input{height:100%;min-height:48px}
@media(max-width:760px){.library-controls{grid-template-columns:minmax(0,1fr)}}