/* The whole landscape is the course; bridge geometry is visible in the art. */
.game-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(275px,.85fr);gap:18px;align-items:center}
.course-shell{min-width:0;background:#f5f6ed;border:1px solid #dfe5d5;border-radius:15px;overflow:hidden}
.course-status{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;gap:10px;font-size:11px;font-weight:650;color:#3c594b}
.course-status>span:first-child{display:flex;align-items:center;gap:7px}.course-status .icon{width:16px;height:16px}.course-status .pill{background:transparent;padding:0}
.world.course-world{width:100%;height:auto;min-height:0;aspect-ratio:3/2;border-radius:0;overflow:hidden;position:relative;isolation:isolate}
.course-world>.world-image{object-fit:fill;object-position:center}.course-world:after{display:none}
.course-landmarks{position:absolute;inset:0;list-style:none;margin:0;padding:0;z-index:3;pointer-events:none}
.course-landmarks .bridge-stop{position:absolute;margin:0;padding:0;width:20px;height:20px;transform:translate(-50%,-50%);border-radius:50%;background:#fffbeaee;border:1px solid #8c8061aa;display:grid;place-items:center;box-shadow:0 1px 5px #172d3426}
.course-landmarks .bridge-stop:before{display:none}
.course-landmarks .bridge-number,.course-landmarks .bridge-stop.current .bridge-number{position:static;transform:none;color:#5b5036;font:600 10px/1 system-ui}
.course-landmarks .bridge-stop.done{background:#2f6454;border-color:#e6eacb}.course-landmarks .bridge-stop.done .bridge-number{color:#fff}
.course-landmarks .bridge-stop.current{background:#e6c676;border:1.5px solid #fff3cc;box-shadow:0 0 0 2px #70533265}
.course-landmarks .bridge-stop.failed{background:#cc9a76;border-color:#ffe6c4}
.course-courier{position:absolute;z-index:4;transform:translate(-50%,-100%);width:44px;height:50px;pointer-events:none}
.course-courier img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(1px 2px 1px #24332760)}
.course-courier.westbound img{transform:scaleX(-1)}
.courier-label{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);padding:3px 5px;border-radius:4px;background:#fffbedee;color:#314e41;font-size:8px;font-weight:700;white-space:nowrap;box-shadow:0 1px 7px #26322225}
.course-start,.course-destination{position:absolute;z-index:3;font-size:8px;letter-spacing:1px;color:#fff9df;text-shadow:0 1px 3px #26301b,0 1px 5px #26301b;font-weight:800;pointer-events:none}.course-start{left:2%;bottom:13%}.course-destination{right:3%;top:3%}
.course-reward{position:absolute;z-index:4;left:50%;bottom:4%;transform:translateX(-50%);background:#fafcece8;border:1px solid #fff;border-radius:30px;padding:7px 12px;font-size:11px;color:#365f46;white-space:nowrap;box-shadow:0 3px 10px #173b2922}
.course-caption{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 13px;font-size:9px;color:#64755e;min-height:38px}.course-caption button{font-size:10px;white-space:nowrap;padding:5px;color:#345b4a}
.game-grid>.question{display:flex;flex-direction:column;align-items:stretch;justify-content:center;padding:20px 8px;gap:20px;min-width:0}.game-grid .word-side{padding:0;border:0}.game-grid .question h3{font-size:53px}.game-grid .question-prompt{font-size:12px}.game-grid .choices{gap:10px;grid-template-columns:1fr}.game-grid .choices button{min-height:49px;font-size:15px}.game-grid .answer-help{gap:10px;flex-wrap:wrap}.game-grid .feedback-intro{padding-left:0}.game-grid .feedback-intro .feedback-symbol{position:static;margin-bottom:14px}.game-grid .question.feedback h3{font-size:29px}.game-grid .feedback-details .word-answer{margin:0 0 12px}.game-grid .result-box{display:block}.game-grid .result-box>div+div{margin-top:18px}
.app-footer{margin-top:20px}
@media(max-width:900px){.game-grid{grid-template-columns:minmax(0,1.55fr) minmax(240px,1fr);gap:12px}.course-courier{width:36px;height:43px}.game-grid>.question{padding:10px 3px}.course-status{padding:9px 10px;font-size:10px}}
@media(max-width:700px){.game-grid{display:flex;flex-direction:column;gap:0;align-items:stretch}.course-shell{border-radius:12px}.world.course-world{height:auto;min-height:0;aspect-ratio:3/2}.course-status{padding:9px 10px;font-size:10px}.course-status .icon{width:15px;height:15px}.course-caption{font-size:8px;padding:5px 9px;min-height:33px;gap:5px}.course-caption button{font-size:9px}.course-landmarks .bridge-stop{width:15px;height:15px}.course-landmarks .bridge-number,.course-landmarks .bridge-stop.current .bridge-number{font-size:8px}.course-courier{width:27px;height:33px}.courier-label{font-size:6px;padding:2px 4px}.course-start,.course-destination{font-size:6px;letter-spacing:.6px}.course-reward{font-size:9px;padding:5px 9px}.game-grid>.question{padding:16px 10px;gap:12px}.game-grid .question h3{font-size:40px}.game-grid .choices{grid-template-columns:1fr 1fr;gap:8px}.game-grid .choices button{min-height:47px;font-size:15px}.game-grid .question-prompt{font-size:11px}.game-grid .question.feedback{gap:13px}.game-grid .feedback-intro{padding-left:46px}.game-grid .feedback-intro .feedback-symbol{position:absolute;left:0;top:0;margin:0}.game-grid .question.feedback h3{font-size:26px}.app-footer{margin-top:0}}

.mission-brief{font-size:13px;line-height:1.5;color:#61705b;margin:-4px 28px 18px;max-width:760px}

@media(max-width:700px){.mission-brief{margin:0 18px 18px;font-size:12px}}

/* Landscape is the playing orientation, including narrow phones. */
.rotate-notice{display:none}
@media(orientation:portrait){
 body>.studio,body>.app,body>.review-bar{display:none}
 .rotate-notice{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px;padding:32px max(26px,env(safe-area-inset-left));background:radial-gradient(ellipse at top,#f8ecc9,transparent 65%),#edf2e5;color:#345b4a}
 .rotate-notice h1{font:38px/1.1 var(--serif);margin:0}
 .rotate-notice p{max-width:310px;font-size:16px;line-height:1.6}
 .rotate-notice small{max-width:290px;font-size:12px;color:#64755e;line-height:1.5}
 .rotate-phone{width:100px;height:60px;border:4px solid #345b4a;border-radius:13px;display:grid;place-items:center;font-size:42px;background:#fffbea;margin-bottom:14px;box-shadow:0 8px 0 #dce4ce}
}
@media(orientation:landscape) and (max-height:600px){
 .studio,.mission-heading,.mission-brief,.app-footer{display:none}
 .app{margin:0 auto;max-width:none;border-radius:0;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);box-shadow:none}
 .app-nav{height:42px;padding:0 16px}.app-nav .logo{font-size:30px}.app-nav nav{gap:18px}.app-nav nav button{font-size:11px}.avatar{padding:2px 7px}.avatar:before{width:23px;height:23px}
 #screen{padding:6px 10px}
 .game-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(240px,1fr);min-height:0;gap:14px;align-items:center}
 .course-shell{width:min(100%,calc((100svh - 108px)*1.5));justify-self:center;border-radius:10px}
 .course-status{padding:6px 9px;font-size:10px}.course-status .icon{width:14px;height:14px}.course-caption{font-size:8px;min-height:29px;padding:4px 7px}.course-caption button{font-size:9px}
 .course-courier{width:34px;height:40px}.courier-label{font-size:7px}.course-landmarks .bridge-stop{width:16px;height:16px}.course-landmarks .bridge-number,.course-landmarks .bridge-stop.current .bridge-number{font-size:9px}
 .game-grid>.question{padding:4px;gap:8px;min-height:0}.question-top{margin-bottom:3px;font-size:10px}.word-side>.eyebrow,.word-kind,.no-timer{display:none}.game-grid .question h3{font-size:36px;margin:3px 0;line-height:1.1}.game-grid .question-prompt{font-size:11px;margin:0 0 8px}
 .game-grid .choices{grid-template-columns:1fr 1fr;gap:8px}.game-grid .choices button{min-height:44px;padding:6px 9px;font-size:14px;gap:7px}.choice-letter{width:20px;height:20px;font-size:9px}.game-grid .answer-help{margin-top:6px;gap:4px}.answer-help button{font-size:10px;min-height:32px;padding:4px 0}
 .game-grid .question.feedback{gap:8px}.game-grid .feedback-intro{padding:0}.game-grid .feedback-intro .feedback-symbol{display:none}.game-grid .feedback-mark{margin-bottom:4px;font-size:11px}.game-grid .mark-teken{width:28px;height:28px;font-size:16px}.game-grid .gekozen-antwoord{margin-bottom:6px;font-size:13px}.game-grid .question.feedback h3{font-size:25px}.feedback-copy{font-size:11px;line-height:1.4}.feedback-details .word-answer{padding:8px 10px}.feedback-details .word-answer strong{font-size:22px}.feedback-details .word-answer small{font-size:10px}.feedback-details .primary{min-height:44px;font-size:12px;padding:9px 12px}
 .game-grid .result-box>div+div{margin-top:8px}.result-box .feedback-symbol{display:none}.result-number{font-size:30px;margin:3px 0}.result-box .stat-row{padding:4px 0;font-size:11px}.result-actions{margin-top:6px}.result-actions .primary{min-height:44px;font-size:11px;padding:8px}.result-actions .text-button{font-size:10px}
}
