/* These short visual experiments fit the illustrated room's empty board. */
.discovery-board{position:absolute;inset:0;padding:3% 6%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#2e594b;text-align:center}
.discovery-task{font-family:'Shantell Sans','Trebuchet MS',sans-serif;font-size:18px;line-height:1.2;font-weight:800;margin:0}
.discovery-heading{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px}
.discovery-progress{flex:none;font-size:12px;color:#60795d;border-radius:10px;background:#e6edc9;padding:4px 7px}
.training-main,.trick-visual{display:flex;align-items:center;justify-content:center;gap:18px;width:100%;min-height:0;flex:1}
.animal-card{width:150px;max-width:48%;min-height:0;height:124px;display:grid;place-items:center;background:#e6edcc88;border:2px solid #c0b88b;border-radius:18px;padding:3px;flex:none}
.animal-card svg{display:block;width:100%;height:100%;max-height:116px}
.training-memory,.trick-memory{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:7px;font-size:14px;min-width:94px}
.training-memory>span{padding:3px 8px;border-radius:9px;background:#e6edc9;white-space:nowrap}
.training-memory b{padding-left:7px;font-size:17px}
.training-memory small,.trick-memory small{font-size:12px;line-height:1.35;color:#6b7a5c}
.discovery-status{margin:0;min-height:2.6em;display:flex;align-items:center;justify-content:center;font-size:14px;line-height:1.3;font-weight:600;width:100%}
.room-actions.discovery-actions{top:71%;left:13%;width:61%;gap:8px;align-items:center;flex-direction:row}
.room-actions.discovery-actions button{min-height:44px;padding:9px 14px;min-width:90px;font-family:'Shantell Sans','Trebuchet MS',sans-serif;font-weight:800;font-size:14px}
.room-actions.discovery-actions button.primary{min-width:116px}
.room-actions.discovery-actions button:focus-visible,.trick-changes button:focus-visible{outline:3px solid #19776b;outline-offset:3px}
.trick-board{gap:5px;padding:2% 5%}
.object-card{width:158px;max-width:52%;height:106px;border:2px solid #bba778;border-radius:14px;overflow:hidden;flex:none;background:#bbe3e7}
.object-card svg{width:100%;height:100%;display:block}
.trick-visual{gap:13px}
.trick-memory{font-size:12px;gap:5px;min-width:92px}
.trick-memory b{font-size:15px}
.trick-changes{display:flex;justify-content:center;gap:7px;width:100%}
.trick-changes button{position:relative;min-height:44px;min-width:88px;padding:6px 10px;background:#fff2ce;border:2px solid #9b8558;border-radius:12px;font-family:'Shantell Sans','Trebuchet MS',sans-serif;font-size:13px;font-weight:700;color:#335b4b;box-shadow:0 2px 0 #b69c6833}
.trick-changes button[data-change='background']::before{content:'';width:11px;height:11px;display:inline-block;margin-right:5px;background:var(--change-color,#bbe3e7);border:1px solid #66816d;border-radius:50%}
.trick-changes button.change-active{background:#dce9b9;border-color:#568c70}
.trick-board .discovery-status{font-size:13px;min-height:2.6em}
@media(max-width:900px){.discovery-task{font-size:16px}.animal-card{width:134px;height:112px}.discovery-board{gap:5px}.training-main{gap:14px}.object-card{width:142px;height:98px}.room-actions.discovery-actions button{font-size:13px;padding-inline:11px}.trick-board .discovery-status{font-size:12px}}
@media(max-width:600px){.discovery-board{padding:3% 5%}.discovery-task{font-size:16px}.discovery-status{font-size:13px}.animal-card{height:103px;width:126px}.training-memory{font-size:13px;gap:5px}.training-memory b{font-size:16px}.training-memory small,.trick-memory small{font-size:11px}.discovery-progress{font-size:11px}.object-card{width:134px;height:92px}.trick-changes{gap:6px}.trick-changes button{min-width:83px;font-size:12px;padding-inline:7px}.trick-board{padding:2% 4%;gap:3px}.trick-visual{gap:12px}.trick-memory{font-size:11px}.room-actions.discovery-actions{left:calc(var(--scene-scroll,0px) + 12px);width:calc(100vw - 24px);top:71%;gap:6px}.room-actions.discovery-actions button{padding-inline:8px;min-width:87px;font-size:13px}.room-actions.discovery-actions button.primary{min-width:110px}}
@media(max-width:360px){.room-actions.discovery-actions{gap:4px}.room-actions.discovery-actions button{font-size:12px;min-width:81px;padding-inline:5px}.room-actions.discovery-actions button.primary{min-width:102px}}
/* Real photos and a finite examples → training → test lesson. */
.photo-training{gap:6px;padding:2.5% 5%}
.training-steps{display:flex;justify-content:center;gap:8px;font-size:11px;line-height:1.2;color:#72836a;flex:none}
.training-steps span{padding:4px 6px;border-radius:8px}.training-steps .is-current{background:#dce9b9;color:#2d6650;font-weight:800}
.photo-workspace{display:flex;flex:1;align-items:center;justify-content:center;width:100%;gap:18px;min-height:0}
.photo-current{height:165px;width:215px;max-width:64%;border:3px solid #fff9e8;border-radius:10px;box-shadow:0 1px 5px #435a4b45;background:#eeecd8;overflow:hidden;flex:none}
.photo-current img{display:block;width:100%;height:100%;object-fit:contain}
.photo-notebook{display:flex;flex-direction:column;align-items:flex-start;gap:6px;line-height:1.2;font-size:13px;text-align:left}.photo-notebook small{font-size:11px}
.photo-credit{font-size:10px;color:#61735c;line-height:1.2;flex:none}
.photo-examples,.photo-summary{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;align-items:center}
.photo-examples button{border:2px solid #baa77b;border-radius:10px;padding:4px;background:#fff6dc;color:#355d4c;min-height:105px;font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.photo-examples img,.photo-summary img{width:100%;height:85px;object-fit:contain;display:block;border-radius:6px;background:#eeecd8}
.photo-examples span{display:block;padding-top:3px}.photo-summary figure{margin:0;font-size:11px;line-height:1.2}.photo-summary figcaption{padding-top:5px}
.photo-correction{font-size:12px;line-height:1.3}.photo-correction span{display:block}.photo-correction div{display:flex;gap:5px;margin-top:5px}.photo-correction button{border:2px solid #aa945f;border-radius:9px;background:#fff2ce;color:#335d4d;padding:7px;min-height:44px;font:inherit;font-size:12px;font-weight:700}
.photo-correction button:focus-visible,.photo-examples button:focus-visible{outline:3px solid #19776b;outline-offset:2px}
@media(max-width:900px){.photo-current{height:142px;width:190px}.photo-training .discovery-status{font-size:12px;min-height:2.2em}.photo-training .discovery-task{font-size:16px}.photo-training{gap:4px}.training-steps{font-size:10px;gap:3px}.photo-examples img,.photo-summary img{height:74px}}
@media(max-width:600px){.photo-current{height:124px;width:150px;max-width:57%}.photo-workspace{gap:12px}.photo-notebook{font-size:11px;gap:5px}.photo-notebook small{font-size:10px}.photo-training{padding:2% 4%;gap:3px}.photo-training .discovery-task{font-size:15px}.photo-training .discovery-status{font-size:11px}.photo-credit{font-size:9px}.training-steps span{padding:3px 4px}.training-steps{font-size:9px}.photo-examples,.photo-summary{grid-template-columns:repeat(4,1fr);gap:4px}.photo-examples button{min-height:85px;padding:3px;font-size:10px}.photo-examples img,.photo-summary img{height:66px}.photo-summary figure{font-size:9px}.photo-correction{font-size:11px}.photo-correction div{flex-direction:column;gap:4px}.photo-correction button{font-size:11px;padding:5px}.room-actions.training-actions button{min-width:70px;max-width:calc((100vw - 40px)/3);font-size:12px;line-height:1.2}.room-actions.training-actions button.primary{min-width:95px;max-width:154px}}
@media(max-width:600px){body[data-room='train'] .room-axel,body[data-room='trick'] .room-axel{width:56px}body[data-room='train'] #exercise,body[data-room='trick'] #exercise{left:calc(var(--scene-scroll,0px) + 8px);width:calc(100vw - 16px)}}
/* Choose the experiment before collecting labels; eight examples fit in two rows. */
.photo-sets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;width:100%;max-height:100%;overflow:auto;align-items:center}
.photo-sets button{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 5px;border:2px solid #baa77b;border-radius:12px;background:#fff6dc;color:#355d4c;min-height:125px;font:inherit;font-size:13px;line-height:1.2;cursor:pointer}
.photo-sets button:hover{background:#e6edcc}.photo-sets button:focus-visible,.photo-set-back:focus-visible{outline:3px solid #19776b;outline-offset:2px}
.photo-set-pictures{display:flex;width:100%;gap:3px;justify-content:center}.photo-set-pictures img{display:block;width:48%;height:70px;object-fit:contain;border-radius:5px;background:#eeecd8}.photo-sets button>span:last-child{font-size:10px}
.photo-footer{display:flex;align-items:center;justify-content:center;gap:14px;flex:none}.photo-set-back{background:none;border:0;padding:3px;color:#466d55;font:inherit;font-size:10px;text-decoration:underline;cursor:pointer;min-height:26px}
.photo-examples,.photo-summary{max-height:100%;overflow:auto;align-content:start}.photo-examples button{min-height:80px}.photo-examples img,.photo-summary img{height:62px}
@media(max-width:600px){.photo-sets{gap:4px}.photo-sets button{font-size:11px;min-height:106px;padding:5px 3px}.photo-set-pictures{flex-direction:column;align-items:center;gap:2px}.photo-set-pictures img{width:92%;height:37px}.photo-sets button>span:last-child{font-size:9px}.photo-footer{gap:9px}.photo-set-back{font-size:9px;min-height:22px}.photo-examples button{min-height:63px;font-size:9px}.photo-examples img,.photo-summary img{height:47px}}
/* Keep both rows visible inside the room board at every viewport height. */
.photo-examples,.photo-summary{height:100%;grid-template-rows:repeat(2,minmax(0,1fr));overflow:auto}
.photo-examples button,.photo-summary figure{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.photo-examples img,.photo-summary img{height:0;min-height:0;flex:1;object-fit:contain}
.photo-examples span,.photo-summary figcaption{flex:none}
/* A visible before/after experiment rather than a hidden classifier challenge. */
.trick-lab{padding:2% 5%;gap:5px}
.trick-steps{display:flex;gap:8px;font-size:11px;color:#72836a;flex:none}
.trick-steps span{padding:4px 7px;border-radius:8px}.trick-steps .is-current{background:#dce9b9;color:#2d6650;font-weight:800}
.trick-workspace{display:flex;align-items:center;justify-content:center;width:100%;min-height:0;flex:1}
.trick-subjects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%;height:100%;max-height:172px}
.trick-subjects button{min-height:0;display:flex;flex-direction:column;align-items:center;padding:6px;border:2px solid #baa77b;border-radius:12px;background:#fff6dc;color:#355d4c;font:inherit;font-size:14px;cursor:pointer}
.trick-subjects img{height:0;min-height:0;flex:1;width:100%;object-fit:contain}.trick-subjects b{padding:3px}
.trick-start{margin:0;height:100%;max-height:170px;display:flex;flex-direction:column;align-items:center;min-height:0}.trick-start canvas{min-height:0;flex:1;width:auto;max-width:100%;object-fit:contain;border:2px solid #baa77b;border-radius:12px;background:var(--trick-fill,#bbe3e7)}.trick-start figcaption{font-size:14px;padding-top:3px}
.trick-comparison{width:100%;height:100%;display:flex;align-items:center;justify-content:center;gap:10px;min-height:0}
.trick-comparison figure{margin:0;display:flex;flex-direction:column;align-items:center;height:100%;min-height:0;flex:1;max-width:215px;gap:4px;font-size:13px;line-height:1.2}
.trick-comparison canvas{width:100%;height:0;min-height:0;flex:1;object-fit:contain;border:2px solid #baa77b;border-radius:10px;background:var(--trick-fill,#bbe3e7)}
.trick-comparison figcaption{min-height:2.4em;font-weight:700}.trick-comparison b{flex:none}.trick-arrow{font-size:26px;color:#7d9a65}
.trick-lab .trick-changes{flex:none}.trick-lab .trick-changes button{min-width:0;font-size:12px;padding:5px 9px}
.trick-lab .discovery-status{font-size:12px;min-height:2.6em;flex:none}.trick-other{background:none;border:0;text-decoration:underline;color:#466d55;font:inherit;font-size:10px;min-height:24px;padding:3px;cursor:pointer;flex:none}
.trick-subjects button:focus-visible,.trick-other:focus-visible{outline:3px solid #19776b;outline-offset:2px}
.room-actions.trick-actions button{min-width:0;max-width:210px;font-size:12px;padding-inline:10px}.room-actions.trick-actions button.primary{min-width:0}
@media(max-width:900px){.trick-lab{gap:3px}.trick-steps{font-size:10px}.trick-comparison{gap:7px}.trick-comparison figure{font-size:12px}.trick-lab .trick-changes button{font-size:11px;min-height:36px}.trick-lab .discovery-status{font-size:11px}.room-actions.trick-actions{gap:6px}.room-actions.trick-actions button{font-size:11px}}
@media(max-width:600px){.trick-lab{padding:2% 4%}.trick-steps{font-size:9px;gap:3px}.trick-lab .discovery-task{font-size:14px}.trick-subjects{gap:5px}.trick-subjects button{font-size:12px;padding:4px}.trick-comparison{gap:5px}.trick-comparison figure{font-size:10px;gap:3px}.trick-comparison figcaption{min-height:2.4em}.trick-arrow{font-size:18px}.trick-lab .trick-changes{gap:4px}.trick-lab .trick-changes button{font-size:10px;padding:4px 6px;min-height:32px}.trick-lab .discovery-status{font-size:10px;min-height:3em}.trick-other{font-size:9px;min-height:22px}.room-actions.trick-actions button{font-size:11px;line-height:1.2;max-width:calc((100vw - 32px)/3);padding-inline:5px}.room-actions.trick-actions button:only-child{max-width:190px}.room-actions.trick-actions{left:calc(var(--scene-scroll,0px) + 8px);width:calc(100vw - 16px)}}
.trick-topline{display:flex;align-items:center;justify-content:space-between;width:100%;flex:none;gap:5px}
.trick-topline .trick-other{min-height:22px;padding:2px;white-space:nowrap}
.trick-comparison figcaption{min-height:1.2em}
