@import "https://fonts.googleapis.com/css2?family=Nunito:wght@800&display=swap";
.taskPageContainer{text-align:center;margin-top:2rem}.taskPageButton{margin-top:1rem;font-size:1.25rem}.jspsych-book{--sprite-image:url(../media/book.922c1c6b.webp);--sprite-c:5;--sprite-h:clamp(1000,calc(400vw/1px),5000);--sprite-w:calc(var(--sprite-h)*3.2);--sprite-f:7;--sprite-anim-f:6;--sprite-fr:12;--sprite-as:calc(var(--sprite-anim-f)/var(--sprite-fr)*1s);--sprite-r:round(up,calc(var(--sprite-f)/var(--sprite-c)),1);--sprite-sh:calc(var(--sprite-h)/var(--sprite-r));--sprite-th:calc(var(--sprite-sh)/2);--sprite-ar:calc(var(--sprite-th)/var(--sprite-sh));--sprite-uh:calc(var(--sprite-h)*var(--sprite-ar));--sprite-uw:calc(var(--sprite-w)*var(--sprite-ar));--sprite-tw:calc(var(--sprite-uw)/var(--sprite-c));justify-content:center;width:100%;display:flex}@property --sprite-fs{syntax:"<integer>";inherits:true;initial-value:0}.jspsych-book .jspsych-content{width:calc(1px*(var(--sprite-tw)*.7042));height:calc(1px*(var(--sprite-th)*.6107));color:#1a1a1a;background:0 0;grid-template-columns:1fr 1fr;align-items:center;column-gap:clamp(1.5rem,3vw,3rem);padding:clamp(1.5rem,3vw,3rem) clamp(2rem,4vw,4.5rem);display:grid;position:relative;overflow:hidden}.jspsych-book .jspsych-content:before{content:"";margin:calc(-1px*calc((var(--sprite-th) - (var(--sprite-th)*.6107))/2))calc(-1px*calc((var(--sprite-tw) - (var(--sprite-tw)*.7042))/2));background-image:var(--sprite-image);background-repeat:no-repeat;background-size:calc(1px*var(--sprite-uw))calc(1px*var(--sprite-uh));--sprite-fs-n:mod(var(--sprite-fs),var(--sprite-f));--row:calc(round(down,calc(calc(var(--sprite-tw)*var(--sprite-fs-n))/var(--sprite-uw)),1)*var(--sprite-th));--col:mod(calc(var(--sprite-tw)*var(--sprite-fs-n)),var(--sprite-uw));background-position:calc(-1px*var(--col))calc(-1px*var(--row));z-index:-10;pointer-events:none;position:absolute;inset:0}.jspsych-book--flip .jspsych-content:before{animation:book-flip var(--sprite-as)steps(var(--sprite-anim-f))1 both}.jspsych-book .jspsych-image-button-response-stimulus,.jspsych-book .jspsych-image-button-response-button-container,.jspsych-book .jspsych-image-button-response-prompt{z-index:1;margin:0}.jspsych-book .jspsych-image-button-response-stimulus{grid-column:2;justify-content:center;align-items:center;padding-right:clamp(.5rem,2vw,1.5rem);display:flex}.jspsych-book .jspsych-image-button-response-stimulus img{object-fit:contain;border-radius:.75rem;max-width:100%;max-height:60vh;box-shadow:0 12px 30px #0000002e}.jspsych-book .jspsych-image-button-response-button-container{flex-direction:column;grid-column:1;justify-content:center;align-items:stretch;gap:1rem;padding-left:clamp(.5rem,2vw,1.5rem);display:flex}.jspsych-book .jspsych-image-button-response-button-container .jspsych-btn{cursor:pointer;background:#ffffffeb;border:1px solid #0000001f;border-radius:24px;padding:.9rem 1.25rem;font-size:1.1rem;transition:all .2s ease-in-out;box-shadow:0 6px 16px #0000001f}.jspsych-book .jspsych-image-button-response-prompt{text-align:left;color:#1a1a1a;grid-column:1;align-self:end;margin-bottom:1rem;font-size:1rem}.jspsych-book .jspsych-html-button-response-stimulus,.jspsych-book .jspsych-html-button-response-button-container{text-align:center;z-index:1;grid-column:1/-1}.jspsych-book .jspsych-html-button-response-button-container .jspsych-btn{background:#fffffff2;border:1px solid #0000001f;border-radius:.75rem;padding:.9rem 1.5rem;font-size:1.1rem;box-shadow:0 6px 16px #0000001f}@media (max-width:900px){.jspsych-book .jspsych-content{grid-template-columns:1fr;row-gap:1.5rem}.jspsych-book .jspsych-image-button-response-stimulus,.jspsych-book .jspsych-image-button-response-button-container,.jspsych-book .jspsych-image-button-response-prompt{grid-column:1}}@keyframes book-flip{0%{--sprite-fs:1}to{--sprite-fs:6}}#jspsych-image-button-response-stimulus{opacity:0;background-color:#fdfdfd;border:10px solid #e5b686;border-radius:28px;animation:1s ease-in-out .5s forwards fade-in,.5s ease-in-out 3s forwards fade-out;box-shadow:2px 3px 4px #00000026,6px 8px 12px #0000001f}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}.jspsych-book .jspsych-btn{all:unset;text-align:center;text-transform:uppercase;letter-spacing:1px;cursor:pointer;width:100%;max-width:200px;transition:transform .1s,box-shadow .1s;display:block;color:#3d2610!important;font-family:var(--font-nunito)!important;background:linear-gradient(#f4ede4,#e2d1ba)!important;border:3px solid #5d3a1a!important;border-radius:20px!important;margin:10px auto!important;padding:15px 25px!important;font-size:1.2rem!important;font-weight:900!important;box-shadow:0 5px #3d2610,0 8px 15px #0003!important}.jspsych-book .jspsych-btn:hover{transform:translateY(-2px);background:#fdfaf5!important;box-shadow:0 7px #3d2610,0 10px 20px #0003!important}.jspsych-book .jspsych-btn:active{transform:translateY(4px)!important;box-shadow:0 1px #3d2610,0 2px 5px #0003!important}.book-wrapper{transform-origin:top;justify-content:center;margin:60px auto 0;display:flex;position:relative;transform:scale(.95)}.style-bookmark{z-index:2000;background:#f4ede4;border:4px solid #5d3a1a;border-top:none;border-radius:0 0 20px 20px;flex-direction:column;width:260px;height:0;transition:height .5s cubic-bezier(.19,1,.22,1);display:flex;position:absolute;top:0;left:23%;overflow:visible;box-shadow:0 8px 25px #00000026}.style-bookmark.open{height:440px}.style-tab{color:#fff;font-family:var(--font-nunito);letter-spacing:1px;cursor:pointer;white-space:nowrap;background:#a63d2d;border:3px solid #5d3a1a;border-bottom:none;border-radius:12px 12px 0 0;padding:8px 20px;font-size:.8rem;font-weight:900;position:absolute;top:-42px;left:50%;transform:translate(-50%)}.jspsych-book{overflow:visible!important}.style-content{opacity:0;pointer-events:none;flex-direction:column;align-items:center;width:100%;padding:20px 15px;transition:opacity .3s;display:flex}.style-bookmark.open .style-content{opacity:1;pointer-events:auto}.peter-zone{flex-direction:column;align-items:center;margin-bottom:25px;display:flex}.fashion-bubble{color:#f4ede4;text-align:center;background:#5d3a1a;border-radius:10px;width:90%;margin-bottom:15px;padding:10px;font-size:.75rem;font-weight:700;position:relative}.bubble-arrow{background:#5d3a1a;width:10px;height:10px;position:absolute;bottom:-5px;left:50%;transform:translate(-50%)rotate(45deg)}.petr-shuffle{width:90px;height:auto;animation:4s ease-in-out infinite shuffle}@keyframes shuffle{0%,to{transform:translate(-4px)rotate(-1deg)}50%{transform:translate(4px)rotate(1deg)}}.cat-list{width:100%;padding:0 10px}.cat-row{justify-content:space-between;align-items:center;width:100%;margin-bottom:12px;display:flex}.cat-name{color:#5d3a1a;margin-right:20px;font-size:.85rem;font-weight:800}.slot-box{color:#5d3a1a;cursor:pointer;background:#e2d1ba;border:2px dashed #5d3a1a;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;font-weight:900;display:flex}.slot-box:hover{background:#d8c3a9}