:root{color:#111;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--paper:#f4f0e7;--paper-bright:#fffdf7;--ink:#111;--muted:#d9d2c4;--red:#ff4438;--blue:#2945ff;--lime:#d8ff38;background:#d8ff38;font-family:PingFang SC,Microsoft YaHei,Noto Sans CJK SC,Arial,sans-serif}*{box-sizing:border-box}html{background:var(--lime);min-width:320px;min-height:100%}body{background:var(--lime);min-width:320px;min-height:100svh;margin:0}#root{min-height:100svh}button,input{font:inherit}button{cursor:pointer}button:focus-visible{outline:4px solid var(--blue);outline-offset:4px}.option:has(input:focus-visible){outline:4px solid var(--blue);outline-offset:4px}.screen{border-inline:3px solid var(--ink);background:var(--paper);width:min(100%,920px);min-height:100svh;margin:0 auto;padding:28px 20px 52px}.eyebrow,.quiz-header{letter-spacing:.14em;text-transform:uppercase;margin:0;font-size:.75rem;font-weight:950}.intro-screen{flex-direction:column;justify-content:center;display:flex;overflow:hidden}.intro-top{align-items:center;gap:8px;display:grid}.intro-copy{z-index:2;position:relative}.intro-screen h1{letter-spacing:-.075em;margin:16px 0 0;font-family:Impact,Arial Black,sans-serif;font-size:clamp(6.8rem,36vw,13.5rem);font-weight:950;line-height:.7}.hero-copy{letter-spacing:-.045em;max-width:620px;margin:30px 0 22px;font-size:clamp(1.6rem,6vw,2.9rem);font-weight:950;line-height:1.04}.intro-visual{border:3px solid var(--ink);background:var(--red);min-height:278px;box-shadow:8px 8px 0 var(--ink);isolation:isolate;place-items:center;margin:4px 0 24px;display:grid;position:relative}.intro-visual:before{z-index:-1;border:2px solid var(--ink);content:"";position:absolute;inset:13px}.intro-visual img{object-fit:contain;filter:drop-shadow(5px 6px #1111113d);width:min(78vw,310px);height:284px;animation:3.4s ease-in-out infinite verdict-hover;transform:translateY(7px)rotate(1deg)}.visual-stamp,.visual-note{z-index:3;border:2px solid var(--ink);background:var(--lime);letter-spacing:.06em;padding:6px 9px;font-size:.72rem;font-weight:950;position:absolute}.visual-stamp{top:15px;left:-7px;transform:rotate(-4deg)}.visual-note{background:var(--paper-bright);bottom:16px;right:-7px;transform:rotate(3deg)}@keyframes verdict-hover{0%,to{transform:translateY(7px)rotate(1deg)}50%{transform:translateY(0)rotate(-1deg)}}.intro-stats{border:3px solid var(--ink);background:var(--paper-bright);grid-template-columns:repeat(3,1fr);margin:4px 0 16px;display:grid}.intro-stats span{border-right:2px solid var(--ink);text-align:center;padding:12px 5px;font-size:.74rem;line-height:1.2}.intro-stats span:last-child{border-right:0}.intro-stats strong{letter-spacing:.02em;margin-bottom:4px;font-family:Impact,Arial Black,sans-serif;font-size:1.65rem;display:block}.disclaimer{opacity:.72;margin:0;font-size:.8rem;line-height:1.55}.primary-action,.secondary-action,.text-action{border:3px solid var(--ink);border-radius:0;width:100%;min-height:56px;margin-top:13px;padding:12px 16px;font-weight:950}.primary-action{color:#fff;background:var(--ink);box-shadow:7px 7px 0 var(--red);transition:box-shadow .14s,transform .14s}.secondary-action{color:var(--ink);background:var(--paper-bright);box-shadow:4px 4px 0 var(--ink);transition:box-shadow .14s,transform .14s}.text-action{text-underline-offset:4px;background:0 0;border:0;min-height:40px;text-decoration:underline}.primary-action:active,.secondary-action:active{box-shadow:1px 1px 0 var(--ink);transform:translate(4px,4px)}button:disabled{cursor:not-allowed;opacity:.34;box-shadow:none}.question-screen{flex-direction:column;display:flex}.quiz-header{justify-content:space-between;display:flex}.progress-track{border:1px solid var(--ink);background:var(--muted);height:8px;margin:14px 0 clamp(38px,8vh,82px)}.progress-track span{background:var(--red);height:100%;transition:width .24s;display:block}fieldset{border:0;min-width:0;margin:0;padding:0}legend{letter-spacing:-.04em;max-width:780px;margin-bottom:30px;font-size:clamp(1.65rem,6vw,3.2rem);font-weight:950;line-height:1.08}.option-list{gap:12px;display:grid}.option{border:2px solid var(--ink);background:var(--paper-bright);cursor:pointer;grid-template-columns:38px 1fr 22px;align-items:center;gap:13px;min-height:76px;padding:14px 15px;font-weight:680;line-height:1.45;transition:background .14s,box-shadow .14s,transform .14s;display:grid;position:relative}.option input{opacity:0;pointer-events:none;position:absolute}.option-key{border:2px solid var(--ink);border-radius:50%;place-items:center;width:36px;height:36px;font-weight:950;display:grid}.option-mark{font-size:1.35rem;font-weight:950;transition:transform .14s}.option.is-selected{z-index:1;background:var(--lime);box-shadow:6px 6px 0 var(--ink);transform:translate(-2px,-2px)}.option.is-selected .option-key{color:#fff;background:var(--ink)}.option.is-selected .option-mark{transform:rotate(45deg)}.quiz-actions{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:12px;margin-top:30px;display:grid}.quiz-actions button{height:100%}.result-screen{padding-top:24px}.result-screen>.eyebrow{margin-bottom:14px}.result-card{border:3px solid var(--ink);background:var(--paper-bright);box-shadow:9px 9px 0 var(--ink);isolation:isolate;padding:22px 17px 26px;position:relative;overflow:hidden}.result-card:before,.result-card:after{display:none}.result-code{letter-spacing:-.055em;overflow-wrap:anywhere;max-width:80%;font-family:Impact,Arial Black,sans-serif;font-size:clamp(3.4rem,15vw,7.4rem);font-weight:950;line-height:.84;position:relative}.result-character{aspect-ratio:1;object-fit:contain;filter:drop-shadow(6px 7px #1113);width:min(82%,390px);margin:-8px auto -12px;display:block}.result-card h1{letter-spacing:-.05em;max-width:94%;margin:14px 0;font-size:clamp(2.35rem,10vw,5rem);font-weight:950;line-height:.96;position:relative}.original-result{color:#fff;background:var(--blue);margin:0;padding:6px 9px;font-size:.82rem;font-weight:900;display:inline-block}.verdict{max-width:650px;margin:18px 0;font-size:clamp(1.15rem,4vw,1.55rem);font-weight:850;line-height:1.42}.gg-index{border-block:3px solid var(--ink);align-items:baseline;gap:8px;margin:32px 0 10px;padding:17px 0;display:flex}.gg-index span{letter-spacing:.1em;font-size:.86rem;font-weight:950}.gg-index strong{color:var(--red);margin-left:auto;font-family:Impact,Arial Black,sans-serif;font-size:clamp(4rem,17vw,6.8rem);line-height:.75}.gg-index small{font-weight:950}.dimension-bars{gap:13px;margin:32px 0;display:grid}.dimension-row{grid-template-columns:42px 1fr 44px;align-items:center;gap:10px;font-size:.78rem;font-weight:950;display:grid}.dimension-track{border:1px solid var(--ink);background:var(--muted);height:16px}.dimension-track span{background:var(--red);height:100%;display:block}.result-facts{border:2px solid var(--ink);gap:0;margin:0;display:grid}.result-facts div{border-bottom:2px solid var(--ink);grid-template-columns:96px 1fr;display:grid}.result-facts div:last-child{border-bottom:0}.result-facts dt,.result-facts dd{margin:0;padding:11px}.result-facts dt{border-right:2px solid var(--ink);font-weight:950}.result-facts dd{font-weight:650}.result-description{margin:28px 0;font-size:1.03rem;line-height:1.75}.badge-list{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.badge-list li{border:2px solid var(--ink);background:var(--lime);padding:7px 9px;font-size:.76rem;font-weight:950}blockquote{color:#fff;background:var(--ink);margin:28px 0 0;padding:18px;font-size:1.12rem;font-weight:900;line-height:1.5}@media (hover:hover){.option:hover{box-shadow:4px 4px 0 var(--ink);background:#fff;transform:translate(-2px,-2px)}.option.is-selected:hover{background:var(--lime);box-shadow:6px 6px 0 var(--ink)}.primary-action:hover,.secondary-action:hover{transform:translate(-2px,-2px)}}@media (width>=720px){.screen{padding:42px 50px 64px}.intro-top{grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);gap:38px}.intro-screen h1{font-size:clamp(9rem,21vw,13rem)}.intro-visual{min-height:430px;margin:0}.intro-visual img{width:360px;height:410px}.intro-stats{margin-top:32px}.intro-stats span{padding:16px 8px;font-size:.82rem}.option{min-height:82px;padding-inline:20px}.result-card{padding:42px 44px 48px}.result-character{width:min(62%,420px)}.result-facts div{grid-template-columns:120px 1fr}}@media (width<=719px){.screen{border-inline-width:0}.quiz-actions .secondary-action{padding-inline:6px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
