:root{--paper:#efe6d6;--ink:#352d28;--muted:#73675b;--line:#d0bfaa;--accent:#bd8959}*{box-sizing:border-box}body{background:var(--paper);color:var(--ink);margin:0;font-family:Arial,Apple SD Gothic Neo,Malgun Gothic,sans-serif;font-size:16px;line-height:1.6}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline-offset:4px;outline:3px solid #915f36}h1:focus{outline:none}button:disabled{cursor:not-allowed;color:#796b60;background:#d8cabc}button,a{touch-action:manipulation}.site-shell{max-width:1080px;margin:auto;padding:0 24px}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:24px 0;display:flex}.wordmark{letter-spacing:-.6px;font-size:17px;font-weight:800;text-decoration:none}.wordmark span{margin-right:8px;font-size:24px}.edition{color:var(--muted);font-size:12px}main{padding:42px 0 24px}.panel,.result-wrap{max-width:520px;margin:0 auto}.intro{text-align:center}.eyebrow{letter-spacing:.02em;font-size:14px;font-weight:600}.dot{background:#a47249;border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block}.intro h1{letter-spacing:-3px;margin:24px 0 16px;font-size:clamp(48px,8vw,68px);font-weight:850;line-height:1.17}.intro h1 em{z-index:0;font-style:normal;display:inline-block;position:relative}.intro h1 em:after{content:"";z-index:-1;background:#d5ad80;height:13px;position:absolute;bottom:4px;left:-8px;right:-8px;transform:rotate(-3deg)}.intro-copy{color:#746351;margin:0;font-size:19px;line-height:1.6}.landscape{width:100%;max-width:480px;height:auto;margin:15px auto 2px;display:block}.intro-bottom{padding:0 26px}.intro-bottom p{margin:18px 0 13px}.meta{color:#73675b;justify-content:center;gap:0;margin:0 0 23px;font-size:13px;display:flex}.meta span+span:before{content:"·";padding:0 12px}.primary{background:var(--ink);color:#fff7ea;border:0;border-radius:12px;justify-content:space-between;align-items:center;gap:18px;min-height:58px;padding:16px 22px;font-weight:700;transition:background .15s,transform .15s;display:flex}.primary:hover:not(:disabled){background:#211c19;transform:translateY(-1px)}.intro .primary,.share-section .primary{width:100%}.primary span{font-size:21px}.fineprint{color:var(--muted);text-align:center;margin:20px 0;font-size:12px;line-height:1.7}.site-footer{color:var(--muted);border-top:1px solid var(--line);justify-content:space-between;gap:14px;padding:20px 0;font-size:12px;display:flex}.quiz{padding-top:6px}.progress-label{color:var(--muted);justify-content:space-between;align-items:center;font-size:14px;display:flex}.progress-label strong{color:var(--ink);font-size:20px}progress{appearance:none;background:#d8cbbb;border:0;border-radius:10px;width:100%;height:5px;margin:13px 0 36px;display:block;overflow:hidden}progress::-webkit-progress-bar{background:#d8cbbb}progress::-webkit-progress-value{background:var(--ink)}progress::-moz-progress-bar{background:var(--ink)}.scene{color:var(--muted);align-items:center;gap:12px;margin-bottom:20px;font-size:14px;display:flex}.scene span{font-size:30px}.question{letter-spacing:-1px;word-break:keep-all;overflow-wrap:anywhere;margin:0 0 30px;font-size:clamp(25px,5.6vw,32px);line-height:1.5}.answers{border:0;gap:12px;margin:0;padding:0;display:grid}.answer{cursor:pointer;background:#faf4e9;border:1px solid #cfbfad;border-radius:12px;align-items:center;gap:14px;min-height:74px;padding:18px;line-height:1.55;transition:background .15s,border-color .15s;display:flex;position:relative}.answer:hover{border-color:#a18465}.answer.selected{border:2px solid var(--ink);background:#e5d8c4;padding:17px}.answer input{opacity:0;width:22px;height:22px;position:absolute;left:18px}.answer:has(input:focus-visible){outline-offset:3px;outline:3px solid #915f36}.option-mark{border:1px solid #ccbaa5;border-radius:50%;flex-shrink:0;place-items:center;width:28px;height:28px;font-size:12px;font-weight:700;display:grid}.selected .option-mark{background:var(--ink);color:#fff;border-color:var(--ink)}.quiz-nav{align-items:center;gap:18px;margin-top:30px;display:flex}.quiz-nav .primary{flex:1}.back{color:var(--muted);background:0 0;border:0;padding:16px 8px;font-size:14px}.result-card{--card-bg:#e5d8c4;background:var(--card-bg);border:1px solid #c9b398;border-radius:20px;padding:28px;position:relative;overflow:hidden}.result-card.orange{--card-bg:#e8d0b5}.result-card.blue{--card-bg:#dfdbce}.result-card.rose{--card-bg:#e5d3c7}.result-top{border-bottom:1px solid #352d2830;justify-content:space-between;gap:12px;padding-bottom:16px;font-size:12px;display:flex}.result-emoji{text-align:center;margin:22px 0 8px;font-size:64px;line-height:1.4}.result-card>.eyebrow{text-align:center;color:#745e48;margin:8px 0}.result-title{text-align:center;letter-spacing:-1.4px;word-break:keep-all;margin:10px 0 18px;font-size:clamp(27px,6vw,35px);line-height:1.35}.quote{text-align:center;word-break:keep-all;overflow-wrap:anywhere;max-width:360px;margin:0 auto 25px;font-size:18px;font-weight:650;line-height:1.7}.card-rule{background:repeating-linear-gradient(90deg,#352d2855 0 6px,#0000 6px 12px);height:1px;margin:22px -28px}.description{word-break:keep-all;overflow-wrap:anywhere;margin:0 0 23px;font-size:16px;line-height:1.85}.traits{gap:20px;display:grid}.traits h2{color:#715b47;margin:0 0 5px;font-size:13px}.traits p{margin:0;font-size:15px}.meters{gap:14px;margin-top:28px;display:grid}.meter>div{justify-content:space-between;margin-bottom:5px;font-size:12px;display:flex}.meter meter{appearance:none;background:#fff8;border-radius:8px;width:100%;height:7px;display:block;overflow:hidden}.meter meter::-webkit-meter-bar{background:#fff8;border:0;height:7px}.meter meter::-webkit-meter-optimum-value{background:var(--ink)}.meter meter::-moz-meter-bar{background:var(--ink)}.tip{background:#ffffff60;border-radius:10px;align-items:flex-start;gap:12px;margin-top:24px;padding:16px;font-size:14px;display:flex}.tip span{font-size:23px}.tip p{margin:0}.card-footer{text-align:center;letter-spacing:1px;margin:22px 0 0;font-size:10px;display:block}.share-section{margin:24px 0 15px}.share-caption{text-align:center;color:var(--muted);margin-bottom:15px;font-size:14px}.secondary-actions{justify-content:center;gap:16px;margin-top:15px;display:flex}.secondary-actions button{text-underline-offset:4px;color:var(--ink);background:0 0;border:0;padding:10px;font-size:14px;text-decoration:underline}.notice{text-align:center;min-height:20px;color:var(--muted);font-size:13px}.brand-cta{border:1px solid var(--line);background:#e5d8c5;border-radius:14px;padding:24px}.brand-cta .eyebrow{font-size:12px}.brand-cta>p{letter-spacing:-.8px;margin:12px 0 20px;font-size:23px;font-weight:700;line-height:1.55}.brand-cta>p span{letter-spacing:0;margin-top:6px;font-size:14px;font-weight:500;display:block}.cta-links{flex-wrap:wrap;gap:18px;display:flex}.cta-links a{text-underline-offset:5px;font-size:14px;font-weight:650}.manual-copy{font:inherit;border:1px solid var(--line);width:100%;color:var(--ink);background:#faf4e9;border-radius:10px;padding:15px;font-size:14px}.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}@media (min-width:760px){main{padding:48px 0 36px}.quiz{border:1px solid var(--line);background:#f5ede1;border-radius:20px;max-width:584px;padding:28px 32px 10px}.intro-bottom{padding:0 44px}.result-card{padding:32px}.card-rule{margin-left:-32px;margin-right:-32px}}@media (max-width:380px){.site-shell{padding:0 18px}.edition{font-size:11px}.intro-bottom{padding:0 10px}.result-card{padding:22px}.card-rule{margin-left:-22px;margin-right:-22px}.answer{gap:10px;padding:16px 12px}.answer.selected{padding:15px 11px}.primary{padding:15px 18px}.site-footer{flex-direction:column;gap:3px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}.hero-portrait{border:1px solid #ab8b6960;border-radius:14px;width:100%;max-width:440px;height:auto;margin:26px auto 0;display:block;box-shadow:0 8px 24px #352d2810}.intro .intro-bottom{padding:0 26px}.intro h1{margin-top:20px}.intro .intro-copy{font-size:18px}@media (max-width:600px){main{padding-top:30px}.intro h1{margin-top:18px;font-size:48px}.hero-portrait{margin-top:24px}.intro-bottom p{margin-top:18px}}
