:root{--bg:#fff8ef;--bg-card:#fff;--bg-sunk:#f6ead9;--ink:#3a2a22;--ink-soft:#7d6a58;--ink-faint:#ab9986;--line:#6b4b3a;--line-soft:#e6d5c0;--red:#e2897a;--red-bg:#fbe9e5;--yellow:#e8b756;--yellow-bg:#fbf1dd;--green:#8fac86;--green-bg:#eaf1e7;--blue:#7b9bbd;--blue-bg:#e8eff5;--purple:#a68bc2;--purple-bg:#f0e9f5;--font-display:"Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Hiragino Kaku Gothic ProN", "Yu Gothic", "YuGothic", "Noto Sans JP", sans-serif;--font-body:"Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "YuGothic", "Noto Sans JP", sans-serif;--font-scribble:"Yomogi", "Zen Maru Gothic", var(--font-body);--font-mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--tape-red:#e2897a99;--tape-yellow:#e8b75699;--tape-green:#8fac8699;--tape-blue:#7b9bbd99;--tape-purple:#a68bc299;--ink-shadow:3px 3px 0 var(--ink);--ink-shadow-lg:5px 5px 0 var(--ink)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background-color:var(--bg);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 6px 6px,#6b4b3a17 1.6px,#0000 1.6px),radial-gradient(circle at 26px 22px,#e2897a1f 1.4px,#0000 1.4px),radial-gradient(circle at 16px 34px,#7b9bbd1f 1.4px,#0000 1.4px);background-size:40px 40px;min-height:100vh;line-height:1.8}.wrap{flex-direction:column;max-width:480px;min-height:100vh;margin:0 auto;padding:28px 20px 60px;display:flex}h1,h2,h3{font-family:var(--font-display);text-wrap:balance;margin:0 0 12px;font-weight:900}p{color:var(--ink-soft);margin:0 0 14px}.eyebrow{font-family:var(--font-scribble);color:var(--red);margin-bottom:10px;font-size:16px;font-weight:400;display:inline-block;transform:rotate(-3deg)}.btn{border:3px solid var(--ink);width:100%;font-family:var(--font-display);cursor:pointer;box-shadow:var(--ink-shadow);border-radius:18px;justify-content:center;align-items:center;padding:18px 20px;font-size:16px;font-weight:700;text-decoration:none;transition:transform .12s,box-shadow .12s;display:inline-flex}.btn:active{box-shadow:0 0 0 var(--ink);transform:translate(3px,3px)}.btn-primary{background:var(--red);color:#fff8ef}.btn-secondary{background:var(--bg-card);color:var(--ink)}.btn:disabled{opacity:.4;cursor:not-allowed}.progress-label{font-family:var(--font-body);color:var(--ink-faint);text-align:center;margin-bottom:10px;font-size:13px;font-weight:700}.progress{background:var(--bg-sunk);border:2px solid var(--ink);border-radius:8px;height:12px;margin-bottom:32px;overflow:hidden}.progress-bar{background:repeating-linear-gradient(-45deg, var(--yellow), var(--yellow) 8px, #f2c877 8px, #f2c877 16px);height:100%;transition:width .3s}.question-text{font-size:23px;font-weight:900;font-family:var(--font-display);color:var(--ink);text-align:center;margin:8px 0 32px;line-height:1.5}.option-list{flex-direction:column;gap:18px;display:flex}.option-card{text-align:center;border:3px solid var(--ink);background:var(--bg-card);width:100%;color:var(--ink);font-size:16px;font-weight:700;font-family:var(--font-body);cursor:pointer;box-shadow:var(--ink-shadow);border-radius:20px;padding:22px 20px;transition:border-color .12s,background .12s,transform .12s,box-shadow .12s;display:block}.option-list .option-card:nth-child(odd){transform:rotate(-.6deg)}.option-list .option-card:nth-child(2n){transform:rotate(.6deg)}@media (hover:hover){.option-card:hover{border-color:var(--ink);background:var(--yellow-bg)}}.option-card:focus-visible{border-color:var(--ink);background:var(--yellow-bg)}.option-card.selected{background:var(--red-bg);box-shadow:0 0 0 var(--ink);transform:translate(3px,3px)rotate(0)!important}.card{background:var(--bg-card);border:3px solid var(--ink);box-shadow:var(--ink-shadow);border-radius:20px;margin:24px 0 26px;padding:24px 24px 22px;position:relative}.card:before{content:"";background:var(--tape-yellow);border:1px solid #3a2a222e;width:52px;height:24px;position:absolute;top:-13px;left:24px;transform:rotate(-4deg)}.card:nth-of-type(2n){transform:rotate(-.7deg)}.card:nth-of-type(odd){transform:rotate(.7deg)}.card:nth-of-type(2n):before{background:var(--tape-blue);left:auto;right:26px;transform:rotate(6deg)}.card:nth-of-type(3n):before{background:var(--tape-green);transform:rotate(-9deg)}.callout{background:var(--yellow-bg);border:2.5px dashed var(--ink);color:var(--ink-soft);border-radius:16px;margin-bottom:20px;padding:16px 18px;font-size:13.5px;position:relative;transform:rotate(-.5deg)}.reveal-duo{justify-content:center;align-items:center;gap:18px;margin:28px 0;display:flex}.reveal-slot{background:var(--bg-card);border:3px solid var(--ink);width:108px;height:108px;box-shadow:var(--ink-shadow);border-radius:50%;justify-content:center;align-items:center;display:flex;overflow:hidden}.reveal-slot svg{width:88%;height:88%}.reveal-slot.known{border-color:var(--ink);background:var(--yellow-bg)}.reveal-slot.mystery{box-shadow:none;color:var(--ink-faint);font-family:var(--font-display);border-style:dashed;font-size:34px;font-weight:900}.reveal-plus{color:var(--ink-faint);font-size:22px}.reveal-caption{text-align:center;color:var(--ink-faint);margin-top:-18px;margin-bottom:12px;font-size:13px}.hero-peek{justify-content:center;align-items:center;height:180px;margin-bottom:8px;display:flex;position:relative}.hero-peek .peek-left,.hero-peek .peek-right{filter:drop-shadow(4px 5px #3a2a2229);width:156px;height:156px;position:absolute;top:4px}.hero-peek .peek-left{left:-22px;transform:rotate(-8deg)}.hero-peek .peek-right{right:-22px;transform:rotate(8deg)scaleX(-1)}.hero-peek .peek-plus{z-index:1;font-family:var(--font-scribble);color:var(--ink);background:var(--yellow);border:3px solid var(--ink);border-radius:50%;justify-content:center;align-items:center;width:46px;height:46px;font-size:34px;display:flex;position:relative;transform:rotate(-8deg)}.cat-label{text-align:center;color:var(--ink-soft);margin-bottom:8px;font-size:13px;font-weight:700}.cat-dots{justify-content:center;gap:8px;margin-bottom:30px;display:flex}.cat-dot{background:var(--line-soft);border:1.5px solid var(--ink);border-radius:50%;width:10px;height:10px;transition:background .2s}.cat-dot.filled{background:var(--yellow)}.cat-toast{background:var(--bg);z-index:10;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:fixed;inset:0}.cat-toast .toast-mascot{width:84px;height:84px}.cat-toast .toast-text{font-family:var(--font-display);color:var(--ink);font-size:20px;font-weight:700}.result-hero{text-align:center;padding:8px 0 4px}.brand-mark{font-family:var(--font-scribble);color:var(--ink-faint);margin-bottom:18px;font-size:20px;display:inline-block;transform:rotate(-2deg)}.result-eyebrow{color:var(--ink-soft);margin-bottom:6px;font-size:14px;font-weight:700}.result-duo{justify-content:center;align-items:flex-end;gap:6px;margin-bottom:4px;display:flex}.result-duo .mascot{width:108px;height:108px}.result-duo .duo-plus{font-family:var(--font-display);color:var(--ink-faint);margin-bottom:40px;font-size:20px}.result-name{font-family:var(--font-display);color:var(--ink);text-shadow:3px 3px 0 var(--yellow);margin:4px 0 14px;font-size:44px;font-weight:900;transform:rotate(-1.5deg)}.result-tagline{color:var(--ink-soft);max-width:32ch;margin:0 auto 18px;font-size:15px;line-height:1.7}.hashtag-tag{font-family:var(--font-scribble);color:var(--ink);background:var(--bg-card);border:2.5px solid var(--ink);border-radius:20px;margin-bottom:28px;padding:5px 18px;font-size:17px;display:inline-block;transform:rotate(2deg)}.carousel{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:14px;margin:0 -4px 8px;padding:4px 4px 12px;display:flex;overflow-x:auto}.carousel::-webkit-scrollbar{display:none}.finding-card{scroll-snap-align:center;background:var(--bg-card);border:2px solid var(--line-soft);border-radius:24px;flex:0 0 88%;padding:22px}.finding-card.locked{text-align:center;background:var(--bg-sunk);border-style:dashed;flex-direction:column;justify-content:center;align-items:center;min-height:180px;display:flex}.locked-emoji{margin-bottom:10px;font-size:26px}.locked-teaser{color:var(--ink-soft);font-size:14.5px;font-weight:700}.finding-kicker{font-family:var(--font-display);border:2px solid var(--ink);border-radius:20px;margin-bottom:12px;padding:4px 13px;font-size:12.5px;font-weight:700;display:inline-block;transform:rotate(-1.5deg)}.finding-kicker.tone-gap{background:var(--red-bg);color:var(--red)}.finding-kicker.tone-match{background:var(--green-bg);color:var(--green)}.finding-title{color:var(--ink);margin-bottom:10px;font-size:15.5px;font-weight:700;line-height:1.6}.finding-body{color:var(--ink-soft);margin:0 0 14px;font-size:13.5px}.finding-tip{color:var(--ink);background:var(--bg-sunk);border-radius:12px;padding:12px 14px;font-size:12.5px}.carousel-dots{font-family:var(--font-mono);color:var(--ink-faint);justify-content:center;gap:6px;margin-bottom:24px;font-size:12px;display:flex}.lock-note{text-align:center;color:var(--ink-faint);margin:-12px 0 24px;font-size:12.5px}.share-box{background:var(--bg-sunk);font-family:var(--font-mono);color:var(--ink-soft);word-break:break-all;border-radius:16px;margin-bottom:16px;padding:16px 18px;font-size:12.5px}.stack{flex-direction:column;gap:12px;display:flex}.spacer{flex:1}.quiz-counter{text-align:center;font-family:var(--font-mono);color:var(--ink-faint);margin-bottom:14px;font-size:12px}.axis-pill{border-radius:20px;margin:0 auto 14px;padding:5px 14px;font-size:12px;font-weight:700;display:inline-flex}.axis-pill.axis-D{color:var(--blue);background:var(--blue-bg)}.axis-pill.axis-E{color:var(--red);background:var(--red-bg)}.axis-pill.axis-R{color:var(--green);background:var(--green-bg)}.axis-pill.axis-C{color:var(--yellow);background:var(--yellow-bg)}.axis-pill.axis-S{color:var(--purple);background:var(--purple-bg)}.axis-pill-wrap{justify-content:center;display:flex}.stage-center{text-align:center;padding:20px 0}.gate-line-wrap{margin:24px 0 14px}.whoami-grid{gap:14px;margin:24px 0;display:flex}.whoami-card{border:3px solid var(--ink);background:var(--bg-card);cursor:pointer;font-family:var(--font-display);color:var(--ink);box-shadow:var(--ink-shadow);border-radius:20px;flex-direction:column;flex:1;align-items:center;gap:10px;padding:20px 12px;font-size:15px;font-weight:700;transition:background .12s,transform .12s,box-shadow .12s;display:flex}.whoami-card:first-child{transform:rotate(-2deg)}.whoami-card:nth-child(2){transform:rotate(2deg)}@media (hover:hover){.whoami-card:hover{background:var(--yellow-bg)}}.whoami-card:focus-visible{background:var(--yellow-bg)}.whoami-card:active{box-shadow:0 0 0 var(--ink);transform:translate(3px,3px)rotate(0)}.whoami-card .mascot-thumb{width:84px;height:84px}.mascot-duo-anim{justify-content:center;align-items:center;gap:4px;margin-bottom:8px;display:flex}.mascot-duo-anim .mascot-lg{filter:drop-shadow(4px 5px #3a2a2229);width:164px;height:164px}.mascot-duo-anim .mascot-left{animation:.6s cubic-bezier(.34,1.56,.64,1) both pop-in-left}.mascot-duo-anim .mascot-right{animation:.6s cubic-bezier(.34,1.56,.64,1) .12s both pop-in-right}.mascot-duo-anim .duo-heart{z-index:1;margin:0 -6px;font-size:26px;animation:1.4s ease-in-out .5s infinite heart-pulse;position:relative}@keyframes pop-in-left{0%{opacity:0;transform:translate(-26px)rotate(-8deg)scale(.7)}to{opacity:1;transform:translate(0)rotate(-4deg)scale(1)}}@keyframes pop-in-right{0%{opacity:0;transform:translate(26px)rotate(8deg)scale(.7)}to{opacity:1;transform:translate(0)rotate(4deg)scale(1)}}@keyframes heart-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}.result-reveal{animation:.5s .3s both fade-up}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.profile-compare{gap:12px;margin-bottom:16px;display:flex}.profile-card{background:var(--bg-card);border:3px solid var(--ink);text-align:center;box-shadow:var(--ink-shadow);border-radius:20px;flex:1;padding:18px 16px}.profile-card:first-child{transform:rotate(-1.5deg)}.profile-card:nth-child(2){transform:rotate(1.5deg)}.profile-card.is-me{background:var(--red-bg)}.profile-card .mascot-thumb{width:64px;height:64px;margin:0 auto 8px}.profile-card .profile-who{color:var(--ink-faint);margin-bottom:2px;font-size:11.5px;font-weight:700}.profile-card .profile-type-name{font-family:var(--font-display);color:var(--ink);margin-bottom:2px;font-size:17px;font-weight:700}.profile-card .profile-type-tag{color:var(--ink-faint);margin-bottom:10px;font-size:11.5px}.profile-card .profile-desc{color:var(--ink-soft);text-align:left;font-size:12.5px}.locked-teaser{background:var(--bg-sunk);border:3px dashed var(--ink);text-align:center;border-radius:20px;margin-bottom:16px;padding:26px 22px;transform:rotate(-.8deg)}.locked-teaser .locked-emoji{justify-content:center;margin-bottom:10px;display:flex}.locked-teaser .locked-teaser-text{color:var(--ink-soft);margin-bottom:18px;font-size:14.5px;font-weight:700}.unlock-reveal{animation:.4s both fade-up}.axis-legend{color:var(--ink-faint);gap:18px;margin-bottom:14px;font-size:11.5px;display:flex}.axis-legend .dot{vertical-align:middle;border-radius:50%;width:9px;height:9px;margin-right:5px;display:inline-block}.axis-legend .dot.me{background:var(--red)}.axis-legend .dot.partner{background:var(--blue)}.axis-insights{flex-direction:column;gap:12px;margin-bottom:16px;display:flex}.axis-insight-row{background:var(--bg-card);border:2px solid var(--ink);border-radius:16px;padding:18px 20px}.axis-insight-row .axis-name{font-family:var(--font-display);color:var(--ink);background:var(--yellow-bg);border:1.5px solid var(--ink);border-radius:20px;margin-bottom:12px;padding:2px 10px;font-size:12.5px;font-weight:700;display:inline-block}.axis-track-labels{color:var(--ink-faint);justify-content:space-between;margin-bottom:8px;font-size:11px;display:flex}.axis-track{background:var(--bg-sunk);border:1.5px solid var(--ink);border-radius:6px;height:7px;margin-bottom:16px;position:relative}.axis-marker{border:2.5px solid var(--ink);border-radius:50%;width:16px;height:16px;position:absolute;top:50%;transform:translate(-50%,-50%)}.axis-marker.me{background:var(--red);z-index:2}.axis-marker.partner{background:var(--blue);z-index:1}.axis-insight-row .interpretation{color:var(--ink-soft);margin:0;font-size:13px}.doodle-field{position:relative}.doodle{pointer-events:none;z-index:1;position:absolute}@media (prefers-reduced-motion:no-preference){.doodle.spin{animation:3.4s ease-in-out infinite doodle-wiggle}}@keyframes doodle-wiggle{0%,to{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}