:root{--red: #c8102e;--red-dark: #8c0a1f;--yellow: #ffd93d;--cream: #fff8e7;--paper: #fff3cb;--ink: #111;--ink-soft: rgba(17, 17, 17, .12);--shadow-hard: 6px 6px 0 var(--ink);--shadow-soft: 3px 3px 0 var(--ink);--radius: 14px}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100%}body{font-family:Patrick Hand,system-ui,sans-serif;font-size:19px;color:var(--ink);background-color:var(--cream);background-image:radial-gradient(circle at 1px 1px,rgba(17,17,17,.18) 1px,transparent 0),linear-gradient(180deg,var(--cream) 0%,var(--paper) 100%);background-size:14px 14px,100% 100%;background-attachment:fixed;min-height:100dvh}.page{display:flex;flex-direction:column;min-height:100dvh;padding:24px 16px 16px;max-width:720px;margin:0 auto}.page__content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:22px}.title{font-family:Bangers,Impact,sans-serif;font-weight:400;letter-spacing:2px;margin:12px 0 4px;line-height:.9;display:flex;flex-direction:column;align-items:center;gap:2px}.title__line{display:inline-block}.title__line--red{font-size:clamp(58px,14vw,100px);color:var(--red);text-shadow:3px 3px 0 var(--ink),6px 6px 0 var(--yellow);transform:rotate(-3deg)}.title__line--small{font-size:clamp(22px,5.5vw,36px);color:var(--ink);background:var(--yellow);padding:2px 14px;border:3px solid var(--ink);border-radius:999px;transform:rotate(2deg);margin:2px 0;box-shadow:var(--shadow-soft)}.title__line--black{font-size:clamp(58px,14vw,100px);color:var(--ink);text-shadow:3px 3px 0 var(--red),6px 6px 0 var(--yellow);transform:rotate(2deg)}.headshot{margin:4px 0;width:clamp(130px,30vw,170px);aspect-ratio:1 / 1.1;border:5px solid var(--ink);border-radius:14px;background:var(--yellow);box-shadow:var(--shadow-hard);overflow:hidden;transform:rotate(-2deg);display:flex;align-items:flex-end;justify-content:center}.headshot img{padding-left:28px;width:100%;height:100%;object-fit:contain;display:block}.card{background:var(--cream);border:4px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-hard);padding:16px 20px;max-width:560px;width:100%}.card--rules{max-width:80%}.card--rules p{margin:4px 0;font-size:22px}.card--rules .small{font-size:18px;opacity:.75}.card--reveal{background:var(--paper)}.card--score{background:var(--yellow);text-align:center;padding:28px 20px;transform:rotate(-1deg)}.btn{font-family:Bangers,Impact,sans-serif;letter-spacing:2px;border:4px solid var(--ink);border-radius:var(--radius);padding:14px 28px;font-size:28px;cursor:pointer;background:var(--cream);color:var(--ink);box-shadow:var(--shadow-hard);transition:transform 80ms ease,box-shadow 80ms ease;text-transform:uppercase}.btn:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--ink)}.btn:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}.btn--xl{font-size:36px;padding:16px 40px}.btn--primary{background:var(--red);color:var(--cream)}.btn--slot{background:var(--red);color:var(--cream);transform:rotate(-2deg)}.btn--slop{background:var(--ink);color:var(--yellow);transform:rotate(2deg)}.btn--slot:hover,.btn--slop:hover{transform:rotate(-2deg) translate(-2px,-2px)}.btn--slop:hover{transform:rotate(2deg) translate(-2px,-2px)}.btn--ghost{background:transparent;font-size:22px;padding:10px 22px}.quiz{width:100%;display:flex;flex-direction:column;align-items:center;gap:18px}.quiz__meta{display:flex;gap:10px;justify-content:center;width:100%}.chip{font-family:Bangers,Impact,sans-serif;letter-spacing:2px;background:var(--ink);color:var(--yellow);padding:6px 14px;border-radius:999px;font-size:18px;border:3px solid var(--ink)}.chip--score{background:var(--yellow);color:var(--ink)}.bubble{position:relative;background:var(--cream);border:4px solid var(--ink);border-radius:22px;padding:22px 24px 26px;max-width:600px;width:100%;box-shadow:var(--shadow-hard)}.bubble__text{font-size:clamp(20px,4.5vw,26px);margin:0;line-height:1.35}.bubble__tail{position:absolute;bottom:-22px;left:56px;width:28px;height:28px;background:var(--cream);border-right:4px solid var(--ink);border-bottom:4px solid var(--ink);transform:rotate(45deg);border-bottom-right-radius:4px}.choices{display:flex;gap:22px;margin-top:10px;flex-wrap:wrap;justify-content:center}.choices .btn{min-width:150px;font-size:34px}.reveal{width:100%;display:flex;flex-direction:column;align-items:center;gap:18px;position:relative}.burst{font-family:Bangers,Impact,sans-serif;font-size:48px;letter-spacing:2px;padding:18px 30px;background:var(--yellow);border:4px solid var(--ink);color:var(--ink);box-shadow:var(--shadow-hard);transform:rotate(-4deg);clip-path:polygon(0% 18%,8% 0%,24% 14%,38% 0%,52% 16%,68% 0%,84% 14%,100% 0%,96% 24%,100% 50%,96% 76%,100% 100%,84% 86%,68% 100%,52% 84%,38% 100%,24% 86%,8% 100%,0% 82%,4% 50%);animation:pop .28s ease-out}.burst--good{background:var(--yellow);color:var(--red-dark)}.burst--bad{background:var(--ink);color:var(--yellow)}@keyframes pop{0%{transform:scale(.5) rotate(-4deg);opacity:0}60%{transform:scale(1.12) rotate(-4deg);opacity:1}to{transform:scale(1) rotate(-4deg)}}.reveal__verdict{font-size:22px;margin:0 0 10px}.reveal__match{font-size:18px;margin:0;line-height:1.4}.reveal__source{display:inline-block;margin-top:10px;color:var(--red-dark);font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}.result{width:100%;display:flex;flex-direction:column;align-items:center;gap:22px;margin-top:12px}.result__heading{font-family:Bangers,Impact,sans-serif;font-size:clamp(48px,12vw,84px);letter-spacing:3px;margin:0;color:var(--red);text-shadow:3px 3px 0 var(--ink),6px 6px 0 var(--yellow);transform:rotate(-2deg)}.result__score{font-family:Bangers,Impact,sans-serif;margin:0;line-height:1;display:flex;align-items:baseline;justify-content:center;gap:6px}.result__big{font-size:clamp(80px,22vw,140px);color:var(--red);text-shadow:4px 4px 0 var(--ink)}.result__sep,.result__total{font-size:clamp(40px,10vw,70px);color:var(--ink)}.result__tier{font-family:Bangers,Impact,sans-serif;font-size:clamp(28px,7vw,44px);letter-spacing:2px;margin:6px 0 0}.result__sub{font-size:19px;margin:4px 0 0;opacity:.85}.result__actions{display:flex;flex-direction:column;gap:10px;align-items:center}.intro{display:flex;flex-direction:column;align-items:center;gap:18px}.footer{margin-top:32px;padding:22px 8px 8px;border-top:3px dashed var(--ink-soft);display:flex;flex-direction:row;align-items:center;justify-content:center;gap:14px}.footer__link{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--ink);border-radius:50%;transition:transform .12s ease}.footer__link:hover{transform:translateY(-2px)}.footer__logo{width:28px;height:auto;display:block}.footer__line{font-size:15px;margin:0;opacity:.7}@media (max-width: 380px){.page{padding:16px 10px 10px}.choices .btn{min-width:130px;font-size:28px;padding:12px 22px}.btn--xl{font-size:30px;padding:14px 30px}.burst{font-size:38px;padding:14px 22px}}