body{margin:0;background:#71c6e2;font-family:Manrope,sans-serif;display:flex;justify-content:center;align-items:center;min-height:100vh}.outer-bg{width:100vw;height:100vh;background:linear-gradient(107.96deg,#becfee,#71c6e2 50%,#d9f4fa,#becfee);display:flex;justify-content:center;align-items:center}.outer-box{width:80vw;height:90vh;background:#fff6;-webkit-backdrop-filter:blur(80px);backdrop-filter:blur(80px);border-radius:2rem;border:2px solid white;display:flex;justify-content:center;align-items:center;padding:5vh;box-sizing:border-box}.quiz-card{width:100%;height:100%;background:#f4fdff;border-radius:2rem;border:1px solid rgba(255,255,255,.4);position:relative;display:flex;flex-direction:column;align-items:center;padding:4vh 6vw;box-sizing:border-box}.qp-heading{font-family:"DM Serif Display",serif;font-size:3.5rem;font-style:italic;background:linear-gradient(90deg,#15313d,#3cabda);-webkit-background-clip:text;color:transparent;margin:0}.qp-subheading{font-size:1.1rem;margin-top:1rem;padding:.5rem 1rem;background:#fff;border-radius:1rem;color:#15313d}.qp-multi-bars{display:flex;justify-content:center;gap:1.5rem;margin-top:1.5rem;margin-bottom:2rem}.qp-bar-segment{width:165px;height:3px;background:#15313d2e;border-radius:999px;position:relative;overflow:hidden}.qp-bar-segment-fill{position:absolute;top:0;left:0;height:100%;background:#15313d;border-radius:999px;transition:width .35s ease-out}.qp-question-box{width:80%;height:3.8rem;line-height:3.8rem;background:linear-gradient(89.72deg,#c6e9f7,#e5f8ff);border:1px solid #96e5ff;border-radius:10px;text-align:center;font-size:1.2rem;margin-bottom:1.4rem;color:#15313d;display:flex;justify-content:center;align-items:center}.qp-options{width:80%;display:flex;flex-direction:column;gap:1rem}.qp-option{height:3.8rem;border-radius:10px;border:1px solid rgba(150,229,255,.5);background:#c6e9f71a;display:flex;justify-content:center;align-items:center;font-size:1.1rem;color:#15313d;cursor:pointer;transition:.2s}.qp-option-selected{background:linear-gradient(89.72deg,#c6e9f7,#e5f8ff);border-color:#96e5ff}.qp-option:hover{transform:translateY(-2px);box-shadow:0 4px 12px #04223f1f}.qp-nav-row{display:flex;justify-content:flex-end;width:80%;margin-top:2rem;gap:1rem}.qp-nav-btn{width:3.2rem;height:3rem;border-radius:10px;background:linear-gradient(89.72deg,#c6e9f7,#e5f8ff);border:1px solid rgba(150,229,255,.2);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s}.qp-submit-btn{min-width:8rem;height:3rem;background:linear-gradient(89.72deg,#c6e9f7,#e5f8ff);border-radius:10px;border:1px solid rgba(150,229,255,.05);font-size:1rem;font-weight:600;color:#15313d;cursor:pointer}.disabled-prev{opacity:.3;pointer-events:none}.qp-nav-btn:hover:not(.disabled-prev){transform:translateY(-2px)}.nav-icon{max-width:16px;max-height:16px;object-fit:contain}.paw-img{position:absolute;bottom:0vh;left:5vh;width:173px;height:173px;object-fit:contain}.bol-img{position:absolute;bottom:calc(-4vh + 180px);left:-10vh;width:193px;height:90px;object-fit:contain}.fade-in{animation:fadeIn .25s ease-out forwards}.fade-out{animation:fadeOut .2s ease-out forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-5px)}}.score-page-bg{width:100vw;height:100vh;background:#f4fdff;display:flex;justify-content:center;align-items:center}.score-container{text-align:center;width:100%;display:flex;flex-direction:column;align-items:center}.score-chip{padding:.4rem 1.4rem;background:#fff;border-radius:999px;font-size:20px;font-weight:500;margin-bottom:2rem}.score-heading{font-size:60px;font-family:"DM Serif Display";font-style:italic;background:linear-gradient(90deg,#15313d,#3cabda);-webkit-background-clip:text;color:transparent;letter-spacing:-4px}.score-number{font-size:214px;font-family:"DM Serif Display";color:#266580;line-height:1}.score-percent{font-size:.35em}.score-restart-btn{width:200px;height:50px;border-radius:10px;background:linear-gradient(89deg,#c6e9f7,#e5f8ff);border:1px solid rgba(150,229,255,.05);display:flex;align-items:center;justify-content:center;margin-top:3rem;cursor:pointer;font-weight:600}