body,html{font-family:Poppins}@font-face{font-family:PeachyKeenJF;src:url(../fonts/peachykeenjf.otf)}*{margin:0;padding:0}:root{--background:260 70% 8%;--foreground:180 100% 95%;--card:260 50% 15%;--card-foreground:180 100% 95%;--popover:260 50% 12%;--popover-foreground:180 100% 95%;--primary:167 80% 50%;--primary-foreground:260 70% 10%;--secondary:280 60% 55%;--secondary-foreground:180 100% 95%;--muted:260 40% 20%;--muted-foreground:260 20% 70%;--accent:180 80% 60%;--accent-foreground:260 70% 10%;--destructive:0 70% 55%;--destructive-foreground:0 0% 100%;--border:260 40% 25%;--input:260 40% 20%;--ring:180 80% 60%;--radius:1rem;--quiz-correct:150 80% 45%;--quiz-wrong:0 75% 55%;--quiz-option:260 45% 22%;--quiz-option-hover:260 50% 28%;--quiz-progress:280 70% 60%}@keyframes shake{0%,to{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-6px)}80%{transform:translateX(6px)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.92)}60%{transform:scale(1.03)}to{opacity:1;transform:scale(1)}}@keyframes gradientGlow{0%,to{box-shadow:0 0 16px rgba(26,230,185,.5),0 0 32px rgba(71,235,235,.25)}50%{box-shadow:0 0 24px rgba(26,230,185,.8),0 0 48px rgba(71,235,235,.4)}}@keyframes progressFill{0%{background-size:0 100%}to{background-size:100% 100%}}@keyframes floating{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.shake{animation:shake .4s ease!important}.container{margin:auto;max-width:90%;padding:0 20px}#quiz{align-items:center;background-image:url(../img/tabi-background_A.png);background-position:50%;background-size:cover;display:flex;justify-content:center;min-height:100vh;position:relative}#quiz .deco-dot{animation:floating 3s ease-in-out infinite;border-radius:9999px;position:absolute}#quiz .dot-1{animation-delay:.5s;right:5rem;top:10rem}#quiz .dot-1,#quiz .dot-2{background-color:hsl(var(--secondary));height:.75rem;opacity:.5;width:.75rem}#quiz .dot-2{animation-delay:2s;bottom:12rem;right:25%}#quiz .dot-3{animation-delay:1.5s;background-color:hsl(var(--accent));height:.5rem;left:25%;opacity:.7;top:15rem;width:.5rem}#quiz .dot-4{animation-delay:1s;background-color:hsl(var(--primary));bottom:8rem;height:1.25rem;left:5rem;opacity:.4;width:1.25rem}#quiz .dot-5{animation-delay:0s;background-color:hsl(var(--accent));height:1rem;left:2.5rem;opacity:.6;top:5rem;width:1rem}#quiz:before{backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);background-color:hsl(var(--background)/.4);content:"";inset:0;position:absolute}#quiz .container{position:relative;z-index:1}#quiz .container .section-wrapper .quiz-intro{align-items:center;animation:fadeInUp .5s ease both;display:flex;flex-direction:column;gap:16px;max-width:360px}#quiz .container .section-wrapper .quiz-intro object{width:224px}#quiz .container .section-wrapper .quiz-intro h2{color:hsl(var(--foreground));font-size:24px;text-align:center}#quiz .container .section-wrapper .quiz-intro p{color:hsl(var(--muted-foreground));font-size:20px;text-align:center}#quiz .container .section-wrapper .quiz-intro h1{color:hsl(var(--foreground));font-family:PeachyKeenJF;font-size:36px;text-align:center;text-shadow:0 0 20px rgba(71,235,235,.6),0 0 40px rgba(71,235,235,.3)}#quiz .container .section-wrapper .quiz-intro .button-wrapper{display:flex;flex-direction:row;gap:16px;justify-content:center;margin-top:16px}#quiz .container .section-wrapper .quiz-intro .button-wrapper a{border-radius:24px;font-size:24px;padding:20px 40px;text-align:center}#quiz .container .section-wrapper .quiz-intro .button-wrapper #intro-yes{animation:gradientGlow 3s ease-in-out infinite;background-image:linear-gradient(to right,hsl(var(--primary)),hsl(var(--accent)));border-radius:calc(var(--radius) + 8px);border-radius:24px;color:hsl(var(--primary-foreground));cursor:pointer;font-size:24px;padding:20px 40px;transition:transform .15s ease,box-shadow .15s ease,opacity .2s ease}#quiz .container .section-wrapper .quiz-intro .button-wrapper #intro-yes:hover{box-shadow:0 0 24px rgba(26,230,185,.6),0 0 48px rgba(71,235,235,.3);transform:translateY(-2px)}#quiz .container .section-wrapper .quiz-intro .button-wrapper #intro-yes:active{transform:translateY(0) scale(.98)}#quiz .container .section-wrapper .quiz-intro .button-wrapper #intro-no{background-color:hsl(var(--card));border:2px solid hsl(var(--border));color:hsl(var(--foreground));transition:background-color .2s ease,border-color .2s ease}#quiz .container .section-wrapper .quiz-intro .button-wrapper #intro-no:hover{background-color:hsl(var(--muted));border-color:hsl(var(--muted-foreground))}#quiz .container .section-wrapper .no-case{align-items:center;animation:fadeInUp .5s ease both;display:flex;flex-direction:column;gap:16px;max-width:448px}#quiz .container .section-wrapper .no-case object{width:224px}#quiz .container .section-wrapper .no-case p{color:hsl(var(--muted-foreground));font-size:20px;line-height:28px;text-align:center}#quiz .container .section-wrapper .no-case .no-case-start{animation:gradientGlow 3s ease-in-out infinite;background-image:linear-gradient(to right,hsl(var(--primary)),hsl(var(--accent)));border-radius:calc(var(--radius) + 8px);color:hsl(var(--primary-foreground));cursor:pointer;font-size:20px;line-height:28px;margin-top:8px;padding:16px 32px;transition:transform .15s ease,box-shadow .15s ease,opacity .2s ease}#quiz .container .section-wrapper .no-case .no-case-start:hover{box-shadow:0 0 24px rgba(26,230,185,.6),0 0 48px rgba(71,235,235,.3);transform:translateY(-2px)}#quiz .container .section-wrapper .no-case .no-case-start:active{transform:translateY(0) scale(.98)}#quiz .container .section-wrapper .quiz-wrapper{animation:fadeInUp .4s ease both;display:flex;flex-direction:column;gap:24px;max-width:672px}#quiz .container .section-wrapper .quiz-wrapper .success-line-wrapper{display:flex;flex-direction:column;gap:8px}#quiz .container .section-wrapper .quiz-wrapper .success-line-wrapper .success-line-header{display:flex;flex-direction:row;justify-content:space-between}#quiz .container .section-wrapper .quiz-wrapper .success-line-wrapper .success-line-header .question-tracker{color:hsl(var(--muted-foreground));font-size:14px;line-height:20px}#quiz .container .section-wrapper .quiz-wrapper .success-line-wrapper .success-line-header .percentage{color:hsl(var(--accent));font-size:14px;line-height:20px}#quiz .container .section-wrapper .quiz-wrapper .success-line-wrapper .success-line{background-color:hsl(var(--muted));border-radius:16px;height:12px;overflow:visible;position:relative;width:100%}#quiz .container .section-wrapper .quiz-wrapper .success-line-wrapper .success-line:after{background-image:linear-gradient(to right,hsl(var(--secondary)),hsl(var(--accent)));border-radius:16px;content:"";height:100%;left:0;position:absolute;top:0;transition:width .6s cubic-bezier(.4,0,.2,1);width:var(--progress,0)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen{align-items:center;animation:popIn .35s ease both;background-color:hsl(var(--card)/.6);border:1px solid hsl(var(--border));border-radius:calc(var(--radius) + 16px);box-shadow:0 0 30px rgba(71,235,235,.302),0 4px 20px rgba(10,4,22,.502);display:flex;flex-direction:column;gap:32px;padding:32px}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .quiz-question-wrapper{align-items:center;display:flex;flex-direction:column;gap:12px;width:100%}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .quiz-question-wrapper .question-type{border-radius:9999px;font-size:14px;font-weight:500;line-height:20px;padding:4px 12px;width:-moz-fit-content;width:fit-content}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .quiz-question-wrapper .quiz-question{color:hsl(var(--foreground));font-size:24px;font-weight:700;line-height:32px;text-align:center}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper{display:flex;flex-direction:column;gap:12px;width:100%}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .answer{align-items:center;animation:fadeInUp .3s ease both;background-color:hsl(var(--quiz-option));border:2px solid transparent;border-radius:calc(var(--radius) + 8px);display:flex;flex-direction:row;gap:16px;padding:16px;text-align:left;transition:background-color .15s ease,border-color .2s ease,transform .15s ease;width:calc(100% - 36px)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .answer:first-child{animation-delay:.06s}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .answer:nth-child(2){animation-delay:.12s}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .answer:nth-child(3){animation-delay:.18s}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .answer:nth-child(4){animation-delay:.24s}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .answer:hover{background-color:hsl(var(--quiz-option-hover));transform:translateX(4px)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .answer p{color:hsl(var(--foreground));font-size:18px}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .answer .answer-letter{align-items:center;background-color:hsl(var(--muted));border-radius:9999px;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .correct{animation:popIn .3s ease both!important;border-color:hsl(var(--quiz-correct));box-shadow:0 0 30px rgba(23,207,115,.502),0 4px 20px rgba(23,207,115,.302)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .answer-wrapper .incorrect{animation:shake .4s ease both!important;border-color:hsl(var(--quiz-wrong));box-shadow:0 0 30px rgba(226,54,54,.502),0 4px 20px rgba(226,54,54,.302)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper{display:flex;flex-direction:row;gap:16px;width:100%}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper .choices-col{display:flex;flex-direction:column;gap:12px;width:calc(50% - 8px)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper .choices-col .choice{animation:fadeInUp .3s ease both;background-color:hsl(var(--muted)/.3);border:2px solid hsl(var(--border));border-radius:calc(var(--radius) + 8px);color:hsl(var(--foreground));flex:1;padding:16px;transition:background-color .2s ease,border-color .2s ease,opacity .2s ease,transform .15s ease}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper .choices-col .choice:first-child{animation-delay:.06s}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper .choices-col .choice:nth-child(2){animation-delay:.12s}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper .choices-col .choice:nth-child(3){animation-delay:.18s}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper .choices-col .choice:nth-child(4){animation-delay:.24s}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper .choices-col .choice:hover{transform:translateY(-2px)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .choices-wrapper .col-2 .choice{opacity:.7}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .match-button-wrapper{display:flex;flex-direction:row;gap:16px}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .match-button-wrapper .reset-button{background-color:hsl(var(--muted));border-radius:calc(var(--radius) + 8px);color:hsl(var(--muted-foreground));font-size:20px;line-height:40px;padding:12px 24px;transition:background-color .2s ease,opacity .2s ease}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .match-button-wrapper .reset-button:hover{background-color:hsl(var(--quiz-option-hover))}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .match-button-wrapper .step-button{animation:gradientGlow 3s ease-in-out infinite;background-image:linear-gradient(to right,hsl(var(--primary)),hsl(var(--accent)));border-radius:calc(var(--radius) + 8px);color:hsl(var(--primary-foreground));cursor:pointer;font-size:20px;line-height:28px;padding:16px 32px;transition:transform .15s ease,box-shadow .15s ease,opacity .2s ease;width:-moz-fit-content;width:fit-content}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .match-button-wrapper .step-button:hover{box-shadow:0 0 24px rgba(26,230,185,.6),0 0 48px rgba(71,235,235,.3);transform:translateY(-2px)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .match-button-wrapper .step-button:active{transform:translateY(0) scale(.98)}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .full-sentence-wrapper{animation:fadeIn .3s ease both;background-color:hsl(var(--muted)/.3);border-radius:calc(var(--radius) + 8px);padding:24px}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .full-sentence-wrapper p{color:hsl(var(--foreground));font-size:18px;text-align:center}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .full-sentence-wrapper p input{background-color:hsl(var(--background));border:2px solid hsl(var(--primary));border-radius:var(--radius);color:hsl(var(--foreground));font-size:18px;height:28px;margin:0 4px;padding:4px 12px;text-align:center;transition:border-color .2s ease,box-shadow .2s ease;width:128px}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .full-sentence-wrapper p input:focus{box-shadow:0 0 0 3px hsl(var(--primary)/.3);outline:none}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .hint-text{animation:fadeIn .4s ease both;color:hsl(var(--muted-foreground));font-size:14px;line-height:20px;text-align:center}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .comment{animation:fadeInUp .35s ease both;border:2px solid transparent;border-radius:calc(var(--radius) + 8px);box-sizing:border-box;color:hsl(var(--foreground));padding:16px;width:100%}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .comment-correct{background-color:hsl(var(--quiz-correct)/.2);border-color:hsl(var(--quiz-correct))}#quiz .container .section-wrapper .quiz-wrapper .quiz-screen .comment-incorrect{background-color:hsl(var(--quiz-wrong)/.2);border-color:hsl(var(--quiz-wrong))}#quiz .container .section-wrapper .quiz-outro{align-items:center;animation:fadeInUp .5s ease both;display:flex;flex-direction:column;gap:32px;justify-content:center;max-width:448px}#quiz .container .section-wrapper .quiz-outro object{width:192px}#quiz .container .section-wrapper .quiz-outro .score-wrapper p{text-align:center}#quiz .container .section-wrapper .quiz-outro .score-wrapper .result-text{color:hsl(var(--foreground));font-family:PeachyKeenJF;font-size:36px;line-height:40px;text-shadow:0 0 20px rgba(71,235,235,.6),0 0 40px rgba(71,235,235,.3)}#quiz .container .section-wrapper .quiz-outro .score-wrapper .result-score{color:hsl(var(--primary));font-size:72px;text-shadow:0 0 20px hsl(var(--primary)/.5)}#quiz .container .section-wrapper .quiz-outro .score-wrapper .result-out-of{color:hsl(var(--muted-foreground));font-size:18px;line-height:28px}#quiz .container .section-wrapper .quiz-outro .comment{background-color:hsl(var(--card)/.5);border:2px solid hsl(var(--border));border-radius:calc(var(--radius) + 8px);color:hsl(var(--foreground));padding:24px;text-align:center}#quiz .container .section-wrapper .quiz-outro .form-wrapper{background-image:linear-gradient(to right,hsl(var(--primary)/.2),hsl(var(--accent)/.2));border:1px solid hsl(var(--primary)/.3);border-radius:calc(var(--radius) + 16px);box-sizing:border-box;display:flex;flex-direction:column;gap:16px;padding:24px;width:100%}#quiz .container .section-wrapper .quiz-outro .form-wrapper .text-wrapper{display:none;flex-direction:column;gap:12px}#quiz .container .section-wrapper .quiz-outro .form-wrapper .text-wrapper p{text-align:center}#quiz .container .section-wrapper .quiz-outro .form-wrapper .text-wrapper .cta-text{color:hsl(var(--primary));font-size:20px;line-height:28px}#quiz .container .section-wrapper .quiz-outro .form-wrapper .text-wrapper .main-info{color:hsl(var(--muted-foreground));font-size:12px;line-height:20px}#quiz .container .section-wrapper .quiz-outro .form-wrapper .input-wrapper{display:flex;flex-direction:column;gap:12px}#quiz .container .section-wrapper .quiz-outro .form-wrapper .input-wrapper input{background-color:hsl(var(--background)/.8);border:1px solid hsl(var(--border));border-radius:calc(var(--radius) + 8px);color:hsl(var(--foreground));font-size:16px;padding:16px 12px;transition:border-color .2s ease,box-shadow .2s ease}#quiz .container .section-wrapper .quiz-outro .form-wrapper .input-wrapper input:focus{border-color:hsl(var(--primary));box-shadow:0 0 0 3px hsl(var(--primary)/.2);outline:none}#quiz .container .section-wrapper .quiz-outro .form-wrapper .input-wrapper button{animation:gradientGlow 3s ease-in-out infinite;background-image:linear-gradient(to right,hsl(var(--primary)),hsl(var(--accent)));border:none;border-radius:calc(var(--radius) + 8px);color:hsl(var(--primary-foreground));cursor:pointer;font-size:16px;padding:12px 24px;transition:transform .15s ease,box-shadow .15s ease,opacity .2s ease}#quiz .container .section-wrapper .quiz-outro .form-wrapper .input-wrapper button:hover{box-shadow:0 0 24px rgba(26,230,185,.6),0 0 48px rgba(71,235,235,.3);transform:translateY(-2px)}#quiz .container .section-wrapper .quiz-outro .form-wrapper .input-wrapper button:active{transform:translateY(0) scale(.98)}#quiz .container .section-wrapper .quiz-outro .try-again-button{animation:gradientGlow 3s ease-in-out infinite;background-image:linear-gradient(to right,hsl(var(--primary)),hsl(var(--accent)));border-radius:calc(var(--radius) + 8px);color:hsl(var(--primary-foreground));cursor:pointer;font-size:20px;line-height:28px;padding:16px 32px;transition:transform .15s ease,box-shadow .15s ease,opacity .2s ease}#quiz .container .section-wrapper .quiz-outro .try-again-button:hover{box-shadow:0 0 24px rgba(26,230,185,.6),0 0 48px rgba(71,235,235,.3);transform:translateY(-2px)}#quiz .container .section-wrapper .quiz-outro .try-again-button:active{transform:translateY(0) scale(.98)}@media screen and (min-width:680px){.quiz-wrapper{width:672px}}