@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}.visible{visibility:visible}.static{position:static}.block{display:block}.table{display:table}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.italic{font-style:italic}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}:root{--orange:#ff7a1a;--orange-deep:#e85d04;--orange-light:#ff9a4a;--cream:#fff4e6;--cream-dark:#fddcae;--brown:#5b3527;--brown-light:#8b5e4a;--gold:#ffc857;--pink:#ff6b9d;--white:#fff;--text-dark:#2d1810;--text-mid:#5b3527;--text-light:#8b7355;--success:#2d9e5f;--error:#c0392b;--radius:20px;--shadow:0 8px 32px #5b352726;--shadow-lg:0 16px 48px #5b352733}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{background:var(--cream);color:var(--text-dark);min-height:100dvh;margin:0;padding:0;font-family:Nunito,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow-x:hidden}h1,h2,h3,h4,h5,h6,button{font-family:Fredoka,Nunito,sans-serif}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes float-slow{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-8px)rotate(5deg)}}@keyframes spin-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse-scale{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}@keyframes wave-arm{0%,to{transform-origin:bottom;transform:rotate(0)}25%{transform-origin:bottom;transform:rotate(-20deg)}75%{transform-origin:bottom;transform:rotate(20deg)}}@keyframes bounce-in{0%{opacity:0;transform:scale(.6)translateY(40px)}60%{opacity:1;transform:scale(1.08)translateY(-8px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes slide-up{0%{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes sparkle{0%,to{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1.2)}}@keyframes drift{0%{opacity:.7;transform:translateY(0)translate(0)rotate(0)}50%{opacity:1;transform:translateY(-30px)translate(10px)rotate(180deg)}to{opacity:0;transform:translateY(-60px)translate(-5px)rotate(360deg)}}@keyframes jump-leg{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-6px)rotate(-10deg)}}@keyframes confetti-pop{0%{opacity:1;transform:scale(0)rotate(0)}80%{opacity:1;transform:scale(1.5)rotate(180deg)}to{opacity:.8;transform:scale(1)rotate(360deg)}}@keyframes stage-transition{0%{opacity:0;transform:translateY(16px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.sound-toggle{z-index:100;-webkit-backdrop-filter:blur(6px);cursor:pointer;background:#ffffffbf;border:1.5px solid #ff7a1a40;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:18px;line-height:1;transition:transform .15s,background .15s;display:flex;position:fixed;top:14px;right:14px;box-shadow:0 2px 10px #5b35271f}.sound-toggle:hover{background:#ffffffeb;transform:scale(1.08)}.sound-toggle:focus-visible{outline:3px solid var(--orange);outline-offset:2px}.journey-loading{flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:100dvh;display:flex}.loading-mascot{font-size:56px;animation:1.4s ease-in-out infinite pulse}.loading-text{color:var(--orange);letter-spacing:.01em;font-size:1.1rem;font-weight:600}.journey-experience{background:linear-gradient(160deg,#fff4e6 0%,#ffe8cc 50%,#fff4e6 100%);flex-direction:column;align-items:center;min-height:100dvh;display:flex;position:relative;overflow-x:hidden}.journey--transitioning{pointer-events:none;opacity:0;transition:opacity .3s}.stage{flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:480px;min-height:100dvh;padding:24px 20px 40px;animation:.4s both stage-transition;display:flex;position:relative}.stage-welcome{text-align:center;gap:0}.welcome-content{flex-direction:column;align-items:center;gap:12px;width:100%;display:flex}.brand-wordmark{margin-bottom:4px;animation:.6s both fade-in}.brand-wordmark-text{color:var(--orange-deep);letter-spacing:.5px;font-family:Fredoka,Nunito,sans-serif;font-size:20px;font-weight:700}.mascot-hero{margin:8px 0}.perkop-wind-lines line{animation:.55s ease-in-out infinite alternate perkop-wind-rush}.perkop-wind-lines line:nth-child(2){animation-delay:.1s}.perkop-wind-lines line:nth-child(3){animation-delay:.2s}.perkop-wind-lines line:nth-child(4){animation-delay:50ms}.perkop-wind-lines line:nth-child(5){animation-delay:.15s}.perkop-wind-lines line:nth-child(6){animation-delay:.25s}@keyframes perkop-wind-rush{0%{opacity:.2;transform:scaleX(.4)translate(6px)}to{opacity:1;transform:scaleX(1)translate(0)}}.mascot-blob-wrap{justify-content:center;align-items:center;display:inline-flex;position:relative}.mascot-blob{z-index:0;background:radial-gradient(at 50% 55%,#ffc86459 0%,#ffa0322e 55%,#0000 80%);border-radius:50%;position:absolute;inset:-20px -28px}.mascot-blob-wrap>:last-child{z-index:1;position:relative}.welcome-title{color:var(--brown);letter-spacing:.5px;margin:0;font-family:Fredoka,Nunito,sans-serif;font-size:clamp(32px,9vw,48px);font-weight:700;line-height:1.1;animation:.5s .1s both slide-up}.welcome-sub{color:var(--text-mid);max-width:280px;margin:0;font-size:clamp(14px,4vw,17px);line-height:1.5;animation:.5s .2s both slide-up}.welcome-hint{color:var(--text-light);opacity:0;margin:0;font-size:13px;animation:.6s .5s both fade-in}.btn-primary{background:var(--orange);color:#fff;letter-spacing:.5px;cursor:pointer;border:none;border-radius:50px;min-height:56px;padding:16px 36px;font-family:Fredoka,Nunito,sans-serif;font-size:19px;font-weight:600;transition:transform .15s,box-shadow .15s,background .15s;animation:.5s cubic-bezier(.34,1.56,.64,1) .3s both bounce-in;box-shadow:0 4px 16px #ff7a1a66}.btn-primary:hover:not(:disabled){background:var(--orange-deep);transform:translateY(-2px)scale(1.02);box-shadow:0 8px 24px #ff7a1a80}.btn-primary:active:not(:disabled){transform:translateY(0)scale(.98);box-shadow:0 2px 8px #ff7a1a4d}.btn-primary:disabled{box-shadow:none;cursor:not-allowed;background:#d9c5b2}.btn-primary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.btn-start{padding:18px 44px;font-size:19px;animation:2.5s ease-in-out 1.5s infinite pulse-scale}.btn-start:hover{animation:none}.btn-secondary{color:var(--orange-deep);border:2px solid var(--orange);cursor:pointer;background:#fff;border-radius:50px;min-height:48px;padding:12px 24px;font-size:15px;font-weight:600;transition:transform .15s,background .15s}.btn-secondary:hover{background:#fff4e6;transform:translateY(-1px)}.btn-secondary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.btn-restart{color:var(--brown-light);cursor:pointer;text-underline-offset:3px;background:0 0;border:none;padding:12px 24px;font-size:15px;font-weight:600;text-decoration:underline;transition:color .15s}.btn-restart:hover{color:var(--orange)}.btn-restart:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}.stage-message{justify-content:center}.message-card{border-radius:var(--radius);box-shadow:var(--shadow);text-align:center;opacity:0;background:#fff;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:420px;padding:32px 28px;transition:opacity .4s,transform .4s;display:flex;transform:translateY(24px)}.message-card--in{opacity:1;transform:translateY(0)}.message-mascot{margin-bottom:4px;animation:3s ease-in-out infinite float-slow}.category-badge{letter-spacing:.5px;text-transform:uppercase;border-radius:50px;padding:5px 16px;font-size:12px;font-weight:700;display:inline-block}.cat-keep-going{color:var(--orange-deep);background:#fff0e0}.cat-confidence{color:#2d7a50;background:#e8f5e9}.cat-english{color:#1565c0;background:#e3f2fd}.cat-good-vibes{color:#b8860b;background:#fff9e0}.message-en{color:var(--brown);quotes:"“" "”";margin:0;font-family:Fredoka,Nunito,sans-serif;font-size:clamp(20px,5.5vw,24px);font-weight:600;line-height:1.4}.message-id{color:var(--text-light);margin:0;font-size:15px;font-style:italic;line-height:1.5}.stage-challenge{justify-content:flex-start;padding-top:32px}.challenge-card{border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:420px;padding:28px 24px;animation:.5s cubic-bezier(.34,1.56,.64,1) both bounce-in;display:flex}.challenge-mascot{animation:3.5s ease-in-out infinite float}.challenge-label{color:var(--orange);text-transform:uppercase;letter-spacing:1.5px;background:#fff0e0;border-radius:50px;padding:4px 14px;font-size:12px;font-weight:700}.challenge-prompt{color:var(--brown);text-align:center;margin:0;font-family:Fredoka,Nunito,sans-serif;font-size:clamp(18px,5vw,23px);font-weight:600;line-height:1.4}.options-list{flex-direction:column;gap:10px;width:100%;display:flex}.option-btn{cursor:pointer;text-align:left;background:#fafafa;border:2px solid #e8ddd5;border-radius:14px;align-items:center;gap:14px;width:100%;min-height:54px;padding:14px 16px;transition:all .18s;display:flex}.option-btn:hover:not(:disabled){border-color:var(--orange-light);background:#fff4e6;transform:translate(3px)}.option-btn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.option-btn:disabled{cursor:default}.option-selected{border-color:var(--orange)!important;background:#fff0e0!important;transform:none!important}.option-correct{border-color:var(--success)!important;background:#e8f5ee!important}.option-wrong{border-color:var(--error)!important;background:#fdecea!important}.option-label{background:var(--orange);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;font-size:13px;font-weight:700;display:inline-flex}.option-correct .option-label{background:var(--success)}.option-wrong .option-label{background:var(--error)}.option-text{color:var(--text-dark);font-size:15px;line-height:1.4}.feedback-block{text-align:center;border-radius:16px;flex-direction:column;align-items:center;gap:10px;width:100%;padding:20px 20px 8px;animation:.4s cubic-bezier(.34,1.56,.64,1) both bounce-in;display:flex}.feedback-correct{background:#e8f5ee;border:2px solid #2d9e5f}.feedback-wrong{border:2px solid var(--gold);background:#fff8e1}.feedback-headline{color:var(--brown);margin:0;font-size:20px;font-weight:800}.feedback-en{color:var(--text-dark);margin:0;font-size:14px;line-height:1.5}.feedback-id{color:var(--text-light);margin:0;font-size:13px;font-style:italic;line-height:1.5}.stage-result{justify-content:flex-start;padding-top:24px}.result-content{flex-direction:column;align-items:center;gap:24px;width:100%;max-width:420px;display:flex}.result-card{background:linear-gradient(145deg, var(--orange) 0%, var(--orange-deep) 100%);box-shadow:var(--shadow-lg);text-align:center;color:#fff;border-radius:24px;flex-direction:column;align-items:center;gap:12px;width:100%;padding:28px 24px;animation:.5s cubic-bezier(.34,1.56,.64,1) .1s both bounce-in;display:flex;position:relative;overflow:hidden}.result-card:before{content:"";background:#ffffff14;border-radius:50%;width:120px;height:120px;position:absolute;top:-30px;right:-30px}.result-card__header{width:100%}.result-card__brand-label{letter-spacing:2px;text-transform:uppercase;opacity:.85;background:#00000026;border-radius:50px;padding:4px 14px;font-size:11px;font-weight:800}.result-card__mascot{animation:3.5s ease-in-out infinite float}.result-card__result{text-shadow:0 2px 8px #00000026;margin:0;font-family:Fredoka,Nunito,sans-serif;font-size:30px;font-weight:700}.result-card__question-result{opacity:.85;margin:0;font-size:13px;font-style:italic}.result-card__message{background:#ffffff26;border-radius:14px;width:100%;margin:0;padding:12px 16px;font-size:clamp(16px,4.5vw,19px);font-weight:700;line-height:1.4}.result-card__message-id{opacity:.85;margin:0;font-size:13px;font-style:italic}.result-card__footer{border-top:1px solid #ffffff40;flex-direction:column;gap:4px;width:100%;padding-top:12px;display:flex}.result-card__tagline{opacity:.9;margin:0;font-size:13px;font-weight:600}.result-card__brand{letter-spacing:.5px;margin:0;font-size:16px;font-weight:900}.result-card__url{opacity:.7;margin:0;font-size:11px}.share-actions{flex-direction:column;align-items:center;gap:12px;width:100%;animation:.4s .3s both slide-up;display:flex}.share-secondary{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.share-msg{color:var(--success);margin:0;font-size:13px;font-weight:600;animation:.2s fade-in}.journey-footer{text-align:center;color:var(--text-light);flex-direction:column;gap:6px;padding:20px 16px 32px;font-size:13px;animation:.4s .5s both fade-in;display:flex}.footer-disclaimer{max-width:320px;margin:0 auto;font-size:12px;line-height:1.5}.footer-link{color:var(--orange);font-weight:600;text-decoration:none}.footer-link:hover{text-decoration:underline}.floating-deco{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.deco{position:absolute}.deco-bean-1{animation:5s ease-in-out infinite float-slow;top:8%;left:5%}.deco-bean-2{animation:6s ease-in-out 1s infinite float-slow;top:18%;right:8%}.deco-bean-3{animation:7s ease-in-out 2s infinite drift;bottom:30%;left:6%}.deco-star-1{animation:3s ease-in-out .5s infinite sparkle;top:12%;right:6%}.deco-star-2{animation:4s ease-in-out 1.5s infinite sparkle;bottom:40%;right:4%}.deco-star-3{animation:5s ease-in-out infinite sparkle;top:55%;left:5%}.deco-bubble-1{background:#ff7a1a26;border-radius:50%;width:16px;height:16px;animation:4s ease-in-out .3s infinite float;top:28%;right:10%}.deco-bubble-2{background:#ffc85733;border-radius:50%;width:24px;height:24px;animation:5.5s ease-in-out 1s infinite float;bottom:20%;left:8%}.deco-bubble-3{background:#ff7a1a33;border-radius:50%;width:10px;height:10px;animation:3s ease-in-out 2s infinite float;top:45%;right:5%}.deco-dot-1{background:var(--gold);opacity:.4;border-radius:50%;width:8px;height:8px;animation:4s ease-in-out .7s infinite sparkle;top:70%;left:3%}.deco-dot-2{background:var(--orange);opacity:.3;border-radius:50%;width:6px;height:6px;animation:3.5s ease-in-out 1.2s infinite sparkle;top:35%;right:3%}.perkop-mascot--wave .perkop-wave-arm{transform-origin:90px 78px;animation:1.2s ease-in-out infinite wave-arm}.perkop-mascot--jump .perkop-leg-l,.perkop-mascot--jump .perkop-leg-r,.perkop-mascot--celebrate .perkop-leg-l,.perkop-mascot--celebrate .perkop-leg-r{animation:.6s ease-in-out infinite jump-leg}.perkop-mascot--celebrate .perkop-leg-r{animation-delay:.15s}.perkop-sparkle-1{animation:1.5s ease-in-out infinite sparkle}.perkop-sparkle-2{animation:1.5s ease-in-out .3s infinite sparkle}.perkop-sparkle-3{animation:1.5s ease-in-out .6s infinite sparkle}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.stage>*{z-index:1;position:relative}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}
