@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600&family=Noto+Serif+JP:wght@400;500;600&display=swap');
:root{--paper:#f5f1e9;--ink:#333b35;--muted:#787b70;--red:#a54c3b;--line:#d8d5c9;--serif:'Noto Serif JP','Yu Mincho',serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Sans JP',sans-serif;font-size:14px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23877e68' opacity='.045' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ac7951;outline-offset:5px}header{height:110px;margin:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:13px;align-items:center;text-decoration:none;color:var(--ink);font:28px var(--serif);letter-spacing:5px}.brand small{display:block;font:8px sans-serif;letter-spacing:3px;margin-top:5px}.seal{font:23px var(--serif);color:var(--red);border:1px solid var(--red);border-radius:50%;width:43px;height:43px;display:grid;place-items:center;letter-spacing:0}.header-note{font:13px var(--serif);letter-spacing:3px}.edition{font-size:10px;color:var(--muted);letter-spacing:2px}.hero{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:1.1fr 1fr;min-height:650px;align-items:center;padding:65px 35px 55px;gap:35px}.eyebrow{font-size:10px;color:var(--red);letter-spacing:3px;display:flex;align-items:center;gap:12px}.eyebrow:before{content:'';display:block;width:27px;height:1px;background:var(--red)}h1{font:500 clamp(32px,3.8vw,49px)/1.85 var(--serif);letter-spacing:5px;margin:22px 0}h1 em{font-style:normal;color:var(--red)}.intro{font-family:var(--serif);line-height:2.3;color:#63695e;font-size:14px;letter-spacing:1px}.meta{display:flex;gap:18px;align-items:center;margin:29px 0 17px;color:var(--muted);font-size:11px;letter-spacing:1px}.meta span+span{border-left:1px solid var(--line);padding-left:18px}.primary{background:var(--ink);color:#faf8ef;border:1px solid var(--ink);padding:20px 27px;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:45px;letter-spacing:2px;text-decoration:none;width:min(100%,365px);transition:.2s}.primary:hover{background:#4d584a;transform:translateY(-2px)}.arrow{font-size:23px;font-weight:400}.micro{font-size:10px;color:var(--muted);line-height:1.9;margin:13px 0}.art{position:relative;height:485px;display:grid;place-items:center}.orb{width:340px;height:340px;border-radius:50%;background:radial-gradient(circle at 30% 28%,#e7d9b5,#d3bc86 65%,#b5a079);opacity:.8;box-shadow:inset -18px -10px 45px #91845725;position:relative}.orb:before,.orb:after{content:'';position:absolute;border:1px solid #b8ae9660;border-radius:50%;inset:-26px;transform:rotate(-25deg) scaleX(1.12)}.orb:after{inset:-47px;transform:rotate(30deg) scaleX(.95)}.art-verse{position:absolute;right:0;top:25px;writing-mode:vertical-rl;font:14px/2 var(--serif);letter-spacing:5px}.art-caption{position:absolute;bottom:4px;font:10px var(--serif);color:var(--muted);letter-spacing:4px}.thread{position:absolute;width:370px;height:135px;border:1.5px solid var(--red);border-radius:50%;transform:rotate(-33deg);opacity:.85}.thread:after{content:'';position:absolute;width:170px;height:76px;border:1px solid var(--red);border-radius:50%;right:-40px;top:65px;transform:rotate(68deg)}.art-mark{position:absolute;font:62px var(--serif);color:#f9f5e6;letter-spacing:10px}.overview{max-width:1070px;margin:0 auto 70px;border-top:1px solid var(--line);padding-top:27px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:25px}.overview>div{display:flex;gap:17px}.overview b{font:12px var(--serif);color:var(--red);margin-top:5px}.overview h3{font:16px var(--serif);margin:0 0 8px;letter-spacing:2px}.overview p{font-size:11px;line-height:1.9;color:var(--muted);margin:0}footer{margin:0 5%;border-top:1px solid var(--line);padding:24px 0;display:flex;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:1px}footer small{font-size:9px}.quiz{max-width:740px;margin:0 auto;padding:48px 25px 75px;min-height:720px}.quiz-top{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;letter-spacing:2px}.progress{display:flex;gap:7px;margin:16px 0 43px}.progress i{height:3px;background:#deded2;flex:1}.progress i.done{background:var(--red)}.step{font:12px var(--serif);color:var(--red);letter-spacing:2px}.quiz h2,.result h1{font:500 26px/1.9 var(--serif);letter-spacing:2px;margin:14px 0 12px}.hint{color:var(--muted);font-size:12px;line-height:1.9}.options{display:grid;gap:12px;margin-top:27px}.option{display:flex;gap:20px;text-align:left;align-items:center;width:100%;background:#fffdf650;border:1px solid var(--line);padding:19px 22px;line-height:1.85;color:var(--ink);transition:.15s}.option:hover{border-color:#83917d;background:#fffdf6}.option[aria-pressed=true]{border-color:var(--red);background:#f0e5d9}.letter{font:16px var(--serif);color:var(--red)}.quiz-nav{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:26px}.quiz-nav .primary{width:210px;min-height:54px;padding:13px 22px}.primary:disabled{opacity:.35;cursor:not-allowed;transform:none}.back{background:none;border:0;color:var(--muted);padding:15px 0;font-size:12px}.result{max-width:750px;padding:52px 25px 65px;margin:auto;text-align:center}.result .eyebrow{justify-content:center}.result-symbol{margin:28px auto 18px;height:110px;width:110px;border:1px solid #b9aa87;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#e7ddbd,#c7b382);font:44px var(--serif);color:#fff9e9}.result h1{font-size:35px;margin:4px 0}.reading{letter-spacing:4px;color:var(--muted);font-size:10px}.tag{display:inline-block;font-size:12px;color:var(--red);margin:20px 0}.result-body{text-align:left;border-top:1px solid var(--line);padding-top:24px;line-height:2.2;color:#5e675b}.result-body h2{font:19px var(--serif);letter-spacing:2px;color:var(--ink)}.practice{padding:21px 25px;background:#e9eade;margin:25px 0}.practice small{font-size:10px;letter-spacing:2px;color:var(--red)}.cta{margin:34px 0 20px;padding:30px 25px;background:#fffdf580;border:1px solid var(--line)}.cta h2{font:23px/1.8 var(--serif);letter-spacing:2px}.cta p{font-size:12px;line-height:2;color:var(--muted)}.cta .primary{margin:20px auto 10px}.result-actions{display:flex;justify-content:center;gap:30px}#notice{font-size:12px;color:var(--red);min-height:22px}.fade{animation:appear .4s ease-out}@keyframes appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){header{height:83px;margin:0 6%}.brand{font-size:23px}.header-note{display:none}.edition{font-size:9px}.hero{display:flex;flex-direction:column;padding:33px 27px 37px;gap:10px;min-height:0}.hero-copy{width:100%;order:1}.art{height:255px;width:100%;order:0}.orb{width:185px;height:185px}.orb:before{inset:-15px}.orb:after{inset:-28px}.thread{width:225px;height:80px}.thread:after{width:100px;height:47px;top:35px;right:-16px}.art-mark{font-size:40px}.art-verse{font-size:10px;right:8px;top:10px;letter-spacing:3px}.art-caption{font-size:8px;bottom:0}.eyebrow{font-size:9px;letter-spacing:2px}h1{font-size:31px;line-height:1.7;letter-spacing:3px;margin:17px 0}.intro{font-size:12px;line-height:2.1}.meta{margin-top:23px}.primary{width:100%}.overview{margin:0 27px 35px;grid-template-columns:1fr;gap:22px;padding-top:25px}.overview p{font-size:11px}footer{gap:10px;flex-wrap:wrap;font-size:9px}footer>span:nth-child(2){display:none}.quiz{padding-top:30px;min-height:680px}.progress{margin-bottom:30px}.quiz h2{font-size:21px}.option{padding:16px;gap:14px;font-size:13px}.result{padding-top:35px}.result-body{font-size:13px}.result h1{font-size:30px}.cta{padding:23px 15px}.cta h2{font-size:20px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.keyword-box{padding:20px 12px 4px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:23px 0;font-size:12px}.keyword-box>span{display:block}.keyword{display:block;font:500 35px var(--serif);letter-spacing:8px;margin:12px 0 15px;user-select:all}.copy-keyword{background:transparent;border:1px solid #b9b6a8;color:var(--ink);padding:10px 24px;font-size:12px}.copy-keyword:hover{background:#e9eade}.keyword-box #notice{font-size:11px;line-height:1.7;margin:8px 0}.result-body>p{margin:0 0 18px}.result-body h2{margin-top:24px}.result .cta{margin-top:24px}.result .result-symbol{width:85px;height:85px;margin-top:22px}.result .tag{margin:12px 0 20px}
#start{width:min(100%,440px);gap:16px;letter-spacing:1px;text-align:left;font-size:13px}#start .arrow{flex-shrink:0}

/* Rich gold moon and readable typography across all screens. */
:root{--muted:#5f6559;--red:#98402e}
body{font-size:16px}
.orb{opacity:1;background:radial-gradient(circle at 30% 24%,#fff0a5 0%,#f3cb58 38%,#dda426 75%,#bf821a 100%);box-shadow:inset -16px -12px 40px #9c620c24,0 0 65px #e9bb4426}
.orb:before,.orb:after{border-color:#b08a426b}
.art-mark{font-size:88px;font-weight:600;letter-spacing:0;color:#45321e;text-shadow:0 1px 1px #fff0ad80}
.thread{border-width:2px;opacity:1}
.art-verse{font-size:16px}.art-caption{font-size:13px;letter-spacing:3px}
.header-note{font-size:16px}.edition{font-size:13px;letter-spacing:1px}.brand small{font-size:10px}
.eyebrow{font-size:13px;letter-spacing:2px}.intro{font-size:18px;color:#414b3e;line-height:2.1;letter-spacing:.5px}
.meta{font-size:14px}.micro{font-size:13px;line-height:1.9}
.primary{font-size:16px;letter-spacing:1px}#start{font-size:16px;width:min(100%,500px);line-height:1.8;padding:18px 22px}
.overview h3{font-size:20px}.overview p{font-size:15px}.overview b{font-size:16px}
.quiz-top,.step{font-size:14px}.hint,.back{font-size:15px}.quiz h2{font-size:28px}.option{font-size:17px}.letter{font-size:20px}
.result-body{font-size:17px;color:#414b3e}.result-body h2{font-size:23px}.reading{font-size:14px}.tag{font-size:15px}
.cta h2{font-size:27px}.cta p{font-size:16px}.cta .micro{font-size:13px}.keyword-box{font-size:15px}.copy-keyword{font-size:15px}.keyword-box #notice{font-size:13px}
.result-symbol{background:radial-gradient(circle at 30% 24%,#ffed99,#e2af38);color:#45321e;font-weight:600}
footer,footer small{font-size:12px}
@media(max-width:700px){
 .hero{padding-left:22px;padding-right:22px}.art{height:290px}.orb{width:210px;height:210px}.art-mark{font-size:66px}
 .art-verse{font-size:12px;right:0;letter-spacing:2px}.art-caption{font-size:12px;letter-spacing:2px}
 .eyebrow{font-size:12px;letter-spacing:1px;gap:8px}.eyebrow:before{width:18px;flex-shrink:0}
 h1{font-size:clamp(28px,5.2vw,36px);letter-spacing:1px}.intro{font-size:16px;line-height:2}
 .edition{font-size:11px}.meta{font-size:14px;gap:14px}.meta span+span{padding-left:14px}
 #start{font-size:16px;gap:10px;padding:17px 18px}.primary{font-size:16px}
 .overview{margin-left:22px;margin-right:22px}.overview p{font-size:15px}
 .quiz{padding-left:20px;padding-right:20px}.quiz h2{font-size:24px;letter-spacing:1px}.option{font-size:16px;padding:17px 15px}
 .quiz-nav{gap:12px}.quiz-nav .primary{width:190px;gap:12px}.quiz-top{letter-spacing:1px}
 .result{padding-left:20px;padding-right:20px}.result-body{font-size:16px}.result-body h2{font-size:21px;letter-spacing:1px}
 .cta h2{font-size:24px}.cta p{font-size:15px}.cta .micro{font-size:13px}.keyword-box{font-size:14px}
}
.result-body .gift-heading{color:var(--red);font-weight:600;background:#eddb9e52;border-left:3px solid #c89935;padding:13px 16px;line-height:1.7}
.cta .primary{width:min(100%,440px);gap:12px;padding:18px 20px}
.continuation-label{line-height:1.9;text-align:center;flex:1}
.continuation-label small{font-size:.78em;display:inline-block;letter-spacing:0}
.result-entry{margin:24px 0 32px}
.result-entry .primary{width:min(100%,440px);margin:0 auto;gap:12px;padding:18px 20px}
.keyword{background:#a83e28;color:#fff9e8;border:1px solid #8a311e;width:fit-content;max-width:100%;margin:18px auto;padding:8px 16px 8px 20px;font-size:34px;font-weight:600;line-height:1.4;letter-spacing:4px;box-shadow:0 4px 12px #a83e2818}
.result-invitation,.result-bonus{font-size:15px;line-height:2;color:var(--ink);margin:18px 0}
.result-bonus{margin-top:24px}
#start,.result-entry .primary{justify-content:center;text-align:center}
.button-lines,.continuation-label{display:block;width:100%;text-align:center;line-height:1.9}
@media(max-width:420px){#start,.result-entry .primary{font-size:14px;letter-spacing:0;padding-left:10px;padding-right:10px}}

#start,.result-entry #line{background:#a63225;border-color:#8e291e;color:#fff0af;font-weight:600;box-shadow:0 5px 16px #a6322526}#start:hover,.result-entry #line:hover{background:#88271d;border-color:#772217;color:#fff5ce}

