body.deck-learning-open{overflow:hidden;background:#102417}.deck-learning-open .learn-wrap>.back,body.deck-learning-open .learn-wrap>.hero,body.deck-learning-open #catalog{display:none}.deck-learning-open .learn-wrap{max-width:none;padding:0}.deck-learning-open #trainer{display:block;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:#102417;color:#f7fbf4;min-height:100vh}
.deck-session{min-height:100vh;position:relative;padding:18px}.deck-hud{position:fixed;z-index:20;top:16px;left:16px;right:16px;display:flex;justify-content:space-between;gap:12px;pointer-events:none}.deck-hud>*{pointer-events:auto;background:#102417e8;border:1px solid #78966c;border-radius:12px;padding:10px 14px;font-weight:700}.deck-close,.deck-nav button,.deck-confirm,.deck-next{border:0;border-radius:10px;background:#397d40;color:#fff;font:700 15px Montserrat;padding:12px 16px;cursor:pointer}.deck-close{background:#fff;color:#253328}.deck-study-panels,.deck-recall-panels{min-height:calc(100vh - 36px);display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;padding:54px max(24px,6vw) 112px}.deck-panel{min-width:0;text-align:center}.deck-panel h2{font-size:clamp(20px,2.4vw,34px);margin:10px 0}.deck-panel p{color:#cfe0c9;margin:5px auto;max-width:480px}.deck-card-image{max-width:min(100%,510px);max-height:58vh;object-fit:contain;border-radius:16px;cursor:pointer;filter:drop-shadow(0 16px 20px #0008)}.deck-artifact-open{display:inline-block;border:0;background:transparent;color:#fff;font:inherit;cursor:pointer}.deck-artifact-open small{display:block;color:#d6e4d0;margin-top:9px}.deck-nav{position:fixed;z-index:20;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:9px;align-items:center;background:#102417e8;border:1px solid #78966c;border-radius:14px;padding:8px}.deck-nav span{min-width:92px;text-align:center;font-weight:800}.deck-nav button[disabled]{opacity:.42;cursor:default}
.deck-options{height:calc(100vh - 108px);overflow-y:auto;display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:12px;padding:0 8px 90px}.deck-option{position:relative;border:2px solid #d5e4d0;border-radius:12px;background:#fff;padding:4px;cursor:pointer}.deck-option img{display:block;width:100%;height:210px;object-fit:contain}.deck-option.selected{border-color:#72b754;box-shadow:0 0 0 3px #72b754}.deck-option small{display:block;color:#26352b;font:600 11px Montserrat;padding:4px}.deck-action{position:fixed;right:30px;bottom:28px;z-index:25;display:flex;gap:10px;align-items:center}.deck-tip{background:#f4f9ee;color:#284f2d;border-radius:10px;padding:10px 13px;font-size:13px;box-shadow:0 7px 20px #0005}
.deck-feedback{position:fixed;z-index:30;inset:0;background:#102417eF;display:grid;place-items:center;padding:20px}.deck-feedback-card{max-width:610px;text-align:center;background:#fff;color:#26352b;border-radius:18px;padding:24px}.deck-start-card{margin:15vh auto;max-width:680px}.deck-start-card label{display:inline-block;margin-top:8px;font-weight:700}.deck-start-card select{margin-left:8px;padding:8px}.deck-start-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:22px}.deck-feedback-card.good h2{color:#2b7c3a}.deck-feedback-card.bad h2{color:#a24739}.deck-correct-card{max-width:200px;max-height:280px;object-fit:contain}
.deck-modal{position:fixed;z-index:50;inset:0;background:#0009;display:grid;place-items:center;padding:20px}.deck-modal-box{max-width:690px;max-height:90vh;overflow:auto;background:#fff;color:#26352b;border-radius:18px;padding:26px;position:relative;line-height:1.6}.deck-modal-box h2{margin-top:0;color:#2d713a}.deck-modal-close{position:absolute;top:10px;right:12px;border:0;background:none;font-size:28px;cursor:pointer}.deck-tutorial-note{position:fixed;z-index:30;left:50%;bottom:94px;transform:translateX(-50%);width:min(620px,calc(100% - 32px));box-sizing:border-box;background:#fff;color:#26352b;border-radius:16px;padding:17px 20px;text-align:center;box-shadow:0 10px 34px #0008}.deck-tutorial-note p{margin:8px 0 14px;line-height:1.45}.deck-tutorial-highlight{outline:4px solid #cde557;outline-offset:7px;border-radius:14px}
.deck-results{min-height:100vh;padding:82px max(20px,6vw) 50px;background:#f4f8f1;color:#26352b}.deck-results h1{text-align:center;color:#2d713a}.deck-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:1100px;margin:22px auto}.deck-stats div{background:#fff;border:1px solid #dce9d8;border-radius:12px;padding:15px;text-align:center}.deck-stats b{display:block;font-size:26px;color:#2d713a;margin-top:4px}.deck-result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;max-width:1300px;margin:25px auto}.deck-result-item{position:relative;background:#fff;border:2px solid #dce9d8;border-radius:12px;padding:10px;text-align:center}.deck-result-item.wrong{border-color:#ce7567}.deck-result-item.correct{border-color:#70af5c}.deck-result-item img{max-width:100%;height:230px;object-fit:contain}.deck-result-item .expected{display:none}.deck-result-item.wrong:hover .selected{display:none}.deck-result-item.wrong:hover .expected{display:block}.deck-result-item .tag{font-size:12px;font-weight:700}.deck-result-item.wrong .tag{color:#a24739}.deck-result-item.correct .tag{color:#2d713a}
@media(max-width:760px){
body.deck-learning-open{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}
.deck-learning-open #trainer{min-height:100dvh}
.deck-session{min-height:100dvh;padding-bottom:24px}
.deck-study-panels,.deck-recall-panels{grid-template-columns:1fr;padding:70px 14px 100px;gap:10px}.deck-study-panels .deck-panel:first-child{display:none}.deck-card-image{max-height:54vh}.deck-options{height:auto;max-height:52vh;grid-template-columns:repeat(2,minmax(120px,1fr))}.deck-option img{height:170px}.deck-hud{top:7px;left:7px;right:7px}.deck-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.deck-action{right:14px;bottom:82px}.deck-nav{width:calc(100% - 18px);justify-content:center}.deck-nav button{padding:10px}.deck-nav span{min-width:72px}.deck-tutorial-note{bottom:88px}.deck-start-card{margin:76px 0 24px}}
.deck-results{height:100vh;overflow-y:auto;box-sizing:border-box}

.deck-start-actions .deck-action-secondary,.deck-start-actions .deck-action-primary{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 20px;border-radius:10px;font:700 15px/1.25 Montserrat,Arial,sans-serif;text-align:center;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s}.deck-start-actions .deck-action-secondary{border:1px solid #9fbea0;background:#fff;color:#2e6e38}.deck-start-actions .deck-action-primary{border:1px solid #397d40;background:#397d40;color:#fff;box-shadow:0 5px 14px rgba(38,96,48,.22)}.deck-start-actions .deck-action-secondary:hover,.deck-start-actions .deck-action-primary:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(38,96,48,.2)}.deck-start-actions .deck-action-primary small{display:block;margin-top:3px;font:600 11px/1.2 Montserrat,Arial,sans-serif;opacity:.9}

/* Navigation must stay inside the visible browser viewport, including mobile safe areas. */
.deck-nav{z-index:40;bottom:max(28px,calc(env(safe-area-inset-bottom) + 16px));box-shadow:0 8px 26px #0008}
@media(max-width:760px){.deck-study-panels,.deck-recall-panels{padding-bottom:118px}.deck-nav{bottom:max(16px,calc(env(safe-area-inset-bottom) + 10px))}}