:root{--paper:#faf9f6;--ink:#282530;--muted:#66616c;--line:#e3e0e5;--accent:#7c3aed;font-family:Inter,'Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,'Noto Sans CJK SC',system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}button,select,summary{cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #7c3aed;outline-offset:4px}header{max-width:1180px;margin:auto;padding:28px 40px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-family:Georgia,serif;font-size:34px;letter-spacing:-1.6px;font-weight:bold;color:var(--ink);text-decoration:none}.brand-dot{color:#db2777}.language{display:flex;align-items:center;gap:8px;border:1px solid #d4cfd9;background:white;border-radius:99px;padding:8px 12px;color:var(--ink)}select{border:0;background:transparent;color:inherit;min-height:28px;font-size:14px;max-width:125px}main{max-width:1080px;margin:auto;min-height:75vh;padding:0 40px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(30px,4.5vw,52px);line-height:1.45;letter-spacing:-.035em;font-weight:650;margin-bottom:20px}h1:focus{outline:none}h2{font-size:22px;line-height:1.5}h3{font-size:17px;line-height:1.6}p{font-size:16px;line-height:1.9}.eyebrow{font-size:14px;font-weight:600;color:var(--muted);letter-spacing:.08em;margin-bottom:24px}.intro{padding:64px 0 20px;max-width:920px;margin:auto}.intro-lead{font-size:18px;color:var(--muted);line-height:1.8;margin-bottom:28px}.five-lines{display:flex;gap:6px;width:160px;margin:32px 0 40px}.five-lines span{height:4px;flex:1;border-radius:2px}.intro-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:64px}.instructions{line-height:2.1}.meta{font-size:14px;color:var(--muted)}.primary,.secondary{border:1px solid var(--ink);border-radius:9px;padding:16px 23px;min-height:54px;font-size:16px;font-weight:550;display:inline-flex;align-items:center;justify-content:center;gap:24px;transition:background .15s,transform .15s}.primary{background:var(--ink);color:white}.primary:hover{background:#443d50}.secondary{background:transparent;color:var(--ink);border-color:#d7d3dc}.secondary:hover{background:#efedf2}.primary:disabled{background:#e4e0e8;border-color:#e4e0e8;color:#89838e;cursor:not-allowed}.start{display:flex;margin-top:16px;width:100%;justify-content:space-between}.intro aside{border-left:1px solid var(--line);padding-left:36px}.style-name{display:flex;align-items:center;gap:13px;font-size:16px;padding:11px 0}.swatch{width:10px;height:10px;border-radius:3px;flex-shrink:0}.intro-notes{border-top:1px solid var(--line);margin-top:40px;padding-top:22px}.intro-notes p,.small{font-size:14px;color:var(--muted);line-height:1.8}.intro-notes p{margin-bottom:8px}footer{max-width:1180px;margin:35px auto 0;padding:24px 40px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:13px;color:var(--muted)}footer span:first-child{font-family:Georgia,serif;font-weight:bold}.quiz{max-width:700px;margin:auto;padding:32px 0}.quiz-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.text-button{border:0;background:transparent;padding:8px 0;color:var(--muted);font-size:14px;text-decoration:underline;text-underline-offset:4px}.progress{height:3px;background:#e7e3e9;margin:18px 0 35px}.progress span{display:block;height:100%;background:var(--ink);transition:width .2s}.question-number{font-family:Georgia,serif;font-size:42px;margin-bottom:12px;line-height:1}.question-number span{font-family:inherit;font-size:18px;color:#8d8695}.quiz h1{font-size:30px}.scene{font-size:18px;line-height:2;max-width:660px;margin-bottom:14px}.adapt{font-size:14px;line-height:1.8;color:var(--muted);margin-bottom:28px}fieldset{border:0;padding:0;margin:0;min-width:0}legend{font-size:16px;font-weight:600;margin-bottom:14px;line-height:1.7}.option{background:white;border:1px solid var(--line);border-radius:9px;display:flex;align-items:center;gap:14px;min-height:58px;padding:14px 18px;margin-bottom:10px;cursor:pointer;font-size:16px;line-height:1.6}.option:hover{border-color:#99909e}.option.selected{background:#f3eefb;border-color:#7c3aed}.option input{accent-color:#7c3aed;width:18px;height:18px;flex-shrink:0;margin:0}.option span:nth-child(2){flex:1}.choice-mark{width:8px;height:8px;border-radius:50%}.selected .choice-mark{background:#7c3aed}.comment{margin:22px 0}.comment summary,details>summary{font-size:14px;line-height:1.8;color:var(--muted);padding:10px 0}textarea,input[type=text],#nickname{width:100%;border:1px solid #d8d2de;border-radius:8px;padding:14px;background:white;color:var(--ink);font-size:16px;line-height:1.7}textarea{min-height:105px;margin-top:10px;resize:vertical}.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.quiz-actions{justify-content:space-between;margin-top:24px}.quiz-actions .primary{min-width:160px}.results{padding:50px 0 10px}.results h1{font-size:clamp(28px,4vw,42px)}.result-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:30px;align-items:center;margin:35px 0 40px}.chart-card{min-width:0}.radar{display:block;width:100%;overflow:visible}.chart-note{text-align:center;margin:0 25px}.ranking{display:flex;flex-direction:column;gap:10px}.rank-card{background:white;border:1px solid var(--line);border-left:4px solid var(--trait);border-radius:9px;padding:16px 14px;display:flex;gap:12px;align-items:flex-start}.rank-num{font-family:Georgia,serif;color:var(--trait);font-size:21px;line-height:1.4}.rank-content{flex:1;min-width:0}.rank-content h2{font-size:16px;margin:0 0 2px;color:var(--trait)}.rank-content p{font-size:14px;margin:0;line-height:1.5}.rank-content small{font-size:12px;color:var(--muted);line-height:1.6;display:block;margin-top:5px}.score{font-family:Georgia,serif;font-size:30px;line-height:1.1;font-variant-numeric:tabular-nums}.score small{font-family:system-ui,sans-serif;display:block;font-size:12px;text-align:right;color:var(--muted);margin-top:5px}.level-pips{display:flex;align-items:center;gap:4px;margin-top:9px}.level-pips>span:not(.level-text){height:4px;width:17px;background:#e9e6ed;border-radius:2px}.level-pips>span.on{background:var(--trait)}.level-text{font-size:12px;color:var(--muted);margin-left:5px}.reading{background:white;border:1px solid var(--line);border-radius:12px;padding:30px;margin-bottom:24px}.reading p:last-child{margin-bottom:0}.scene-lists{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:25px 0}.scene-lists ul{padding-left:20px;margin-bottom:0}.scene-lists li{font-size:14px;line-height:1.9}.review,.scoring{border-bottom:1px solid var(--line);padding:8px 0}.review-row{display:flex;gap:20px;padding:15px 0;border-top:1px solid var(--line)}.review-row strong{font-size:16px}.review-row p{margin:3px 0;font-size:14px}.scoring p{font-size:14px;color:var(--muted)}.share{max-width:620px;margin:35px auto 10px}.share label{display:block;font-size:14px;margin-bottom:10px}.share .actions{margin:20px 0 12px}.share .primary{flex:1}.share .text-button{display:block;margin:20px auto 0}.share textarea{min-height:230px}dialog{border:1px solid var(--line);border-radius:16px;padding:30px;max-width:500px;width:calc(100% - 40px);color:var(--ink);background:var(--paper)}dialog::backdrop{background:#28253066}dialog h2{font-size:21px}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:12px 24px;border-radius:99px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:100;white-space:nowrap}#toast.visible{opacity:1}@media(max-width:760px){header{padding:20px 22px}.brand{font-size:30px}main{padding:0 22px}.intro{padding-top:40px}.intro-grid{grid-template-columns:1fr;gap:30px}.intro aside{border-left:0;border-top:1px solid var(--line);padding:24px 0 0;display:flex;flex-wrap:wrap;gap:3px 20px}.intro aside .eyebrow{width:100%;margin-bottom:10px}.style-name{font-size:14px;padding:7px 0}.intro h1{font-size:34px;line-height:1.5}.intro-lead{font-size:16px}.five-lines{margin:25px 0}.intro-notes{margin-top:25px}.quiz{padding-top:20px}.quiz h1{font-size:26px}.scene{font-size:16px;line-height:1.95}.question-number{font-size:36px}.progress{margin-bottom:28px}.option{padding:13px 14px}.result-grid{grid-template-columns:1fr;gap:24px;margin-top:20px}.chart-card{max-width:500px;width:100%;margin:auto}.ranking{gap:9px}.reading{padding:22px}.scene-lists{grid-template-columns:1fr;gap:20px}.results{padding-top:35px}footer{padding:22px;font-size:12px}.share .actions{align-items:stretch}.share .primary,.share .secondary{flex:1;gap:12px;padding:15px 12px}.rank-card{padding:15px}.language{padding:7px 10px}.results h1{font-size:28px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}@media(min-width:761px){html[lang=en] .intro h1{font-family:Georgia,serif;font-size:56px;font-weight:400;line-height:1.15}}@media(max-width:370px){header{padding:18px 16px}main{padding:0 16px}.intro h1{font-size:28px}.quiz-actions .primary{min-width:130px}.rank-card{gap:8px;padding:12px}.score{font-size:26px}}
/* Version 2: expressive profiles, a quiet welcome, and progressive detail */
.welcome{text-align:center;max-width:640px;padding-top:32px;padding-bottom:40px}.hero-logo{display:block;width:min(100%,420px);height:auto;margin:0 auto 28px}.welcome .eyebrow{font-size:13px;margin-bottom:12px}.welcome h1{font-size:clamp(27px,4vw,42px)!important;font-family:inherit!important;font-weight:650!important;line-height:1.5!important;margin-bottom:12px}.welcome-line{font-size:18px;line-height:1.7}.welcome .five-lines{margin:24px auto}.welcome .start{max-width:380px;margin:24px auto 0}.instructions-page{max-width:700px;padding-top:45px}.instruction-styles{display:flex;flex-wrap:wrap;gap:6px 24px;margin-top:25px}.instructions-page .intro-notes{margin:24px 0}.instructions-page .start{margin-bottom:12px}.creative-profile{max-width:810px;margin:0 auto 28px}.creative-kicker{font-size:14px;color:var(--muted);margin-bottom:15px}.creative-profile h1{font-size:clamp(28px,4vw,44px);line-height:1.55}.trait-tags{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.trait-tags span{font-size:15px;border:1px solid color-mix(in srgb,var(--trait),transparent 65%);color:var(--trait);background:color-mix(in srgb,var(--trait),white 96%);border-radius:99px;padding:8px 14px;font-weight:600}.profile-paragraph{font-size:17px;line-height:2.05}.profile-closing{font-size:16px;font-weight:600}.creative-note{display:block;color:var(--muted);font-size:12px;line-height:1.7}.tie-message{font-weight:600}.share-feature{max-width:810px;background:white;border:1px solid #d6cde4;border-top:4px solid #7c3aed;padding:28px;border-radius:13px;margin:30px auto 42px;box-shadow:0 9px 30px #30204006}.share-feature h2{font-size:24px;margin-bottom:22px}.share-feature>label{font-size:16px}.share-feature .primary{width:100%;justify-content:space-between;font-size:19px;padding:19px 22px;background:#6540a0;border-color:#6540a0}.share-feature .primary:hover{background:#523084}.share-feature .include-answers{display:flex;align-items:center;gap:10px;font-size:14px;margin:18px 0;line-height:1.7}.include-answers input{width:18px;height:18px;accent-color:#7c3aed;flex-shrink:0}.share-feature .small{margin:15px 0 0}.rank-card{align-items:center;min-height:94px}.letter-grade{font-family:Georgia,serif;font-size:42px;line-height:1;color:var(--trait);min-width:55px;text-align:center}.letter-grade.perfect{background:linear-gradient(145deg,#b45309,#db2777,#7c3aed);color:transparent;background-clip:text;-webkit-background-clip:text}.chart-note{font-size:12px;line-height:1.65;text-align:right;margin:0 0 0 auto;max-width:310px;color:#77717d}.favorite-scenes{margin:48px 0 36px;padding:0 4px}.favorite-scenes h2{font-size:clamp(23px,3vw,31px);margin-bottom:22px}.favorite-scenes ul{list-style:none;margin:0;padding:0}.favorite-scenes li{font-size:clamp(21px,3vw,29px);font-weight:650;line-height:1.65;padding:9px 0;letter-spacing:-.025em}.declined-scenes{margin:25px 0 35px;color:#797680}.declined-scenes h3{font-size:16px;font-weight:500}.declined-scenes ul{list-style:none;margin:0;padding:0}.declined-scenes li{font-size:16px;text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:#b3afb8;line-height:2}.score-details,.response-details{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:9px 0}.score-table>div{display:grid;grid-template-columns:1fr auto;gap:7px 20px;padding:14px 0;border-top:1px solid var(--line);font-size:15px}.score-table small{grid-column:1/-1;color:var(--muted);font-size:13px}.detail-content{padding:14px 0}.detail-content p{font-size:14px;color:var(--muted)}.result-bottom{justify-content:center;margin:35px 0}.page-exit{opacity:0;transform:translateY(-6px);transition:opacity .16s ease,transform .16s ease}.page-enter>section{animation:pageIn .38s ease both}.radar{transform-origin:center;animation:chartIn .85s cubic-bezier(.2,.7,.2,1) both}.page-exit .radar{opacity:0;transform:scale(.88);transition:opacity .16s ease,transform .16s ease}@keyframes pageIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes chartIn{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:scale(1)}}@media(max-width:760px){.welcome{padding-top:30px}.hero-logo{max-width:330px;margin-bottom:28px}.welcome h1{font-size:29px!important}.welcome-line{font-size:16px}.creative-profile h1{font-size:29px}.profile-paragraph{font-size:16px}.share-feature{padding:22px 18px}.share-feature h2{font-size:21px}.trait-tags span{font-size:14px;padding:7px 12px}.rank-card{min-height:84px}.letter-grade{font-size:37px}.favorite-scenes{margin-top:35px}.chart-note{max-width:265px;font-size:12px}.instructions-page{padding-top:30px}.result-grid{margin-top:32px}}@media(prefers-reduced-motion:reduce){.page-enter>section,.radar{animation:none!important}.page-exit{opacity:1;transform:none}.page-exit .radar{opacity:1;transform:none}}
/* Approved macaron direction */
:root{--paper:#fcfbfd;--ink:#302a38;--muted:#696170;--line:#e6dfeb;--accent:#70428c}.language{border-color:#d9c8e5}.primary{background:#473951;border-color:#473951}.primary:hover{background:#604969}.option.selected{background:#f5eafb;border-color:#70428c}.option input,.include-answers input{accent-color:#70428c}.selected .choice-mark{background:#70428c}.instructions-page{background:linear-gradient(140deg,#fff8fc,#fbfffd 50%,#f7fcff);padding:28px;border:1px solid var(--line);border-radius:16px;margin-top:30px}.quiz{border-top:3px solid #e4c1f9}.question-number{color:#70428c}.progress span{background:linear-gradient(90deg,#ff99c8,#a9def9,#e4c1f9)}.option{border-color:#e7dfeb}.quiz .option:nth-of-type(2){border-left:3px solid #d0f4de}.quiz .option:nth-of-type(3){border-left:3px solid #fcf6bd}.quiz .option:nth-of-type(1){border-left:3px solid #ff99c8}.quiz .option:nth-of-type(4){border-left:3px solid #a9def9}.quiz .option:nth-of-type(5){border-left:3px solid #e4c1f9}
body[data-stage=intro]{background:#08080a;padding:12px}body[data-stage=intro] header{background:#fcfbfd;border-radius:20px 20px 0 0;border:0;padding:20px 28px;max-width:1000px}body[data-stage=intro] main{background:#fcfbfd;max-width:1000px;padding:0;border-radius:0 0 20px 20px;overflow:hidden;min-height:0}body[data-stage=intro] footer{color:#e5dfe9;border-color:#353039;margin-top:12px;padding:15px 12px;max-width:1000px}.welcome{isolation:isolate;position:relative;max-width:none;padding:36px 24px 30px;overflow:hidden}.flow-colors{position:absolute;inset:-50%;z-index:-2;background:radial-gradient(ellipse at 20% 25%,#ff99c8 0,transparent 40%),radial-gradient(ellipse at 80% 20%,#fcf6bd 0,transparent 38%),radial-gradient(ellipse at 75% 70%,#d0f4de 0,transparent 45%),radial-gradient(ellipse at 20% 80%,#a9def9 0,transparent 43%),radial-gradient(ellipse at 50% 45%,#e4c1f9 0,transparent 50%);animation:pastelFlow 20s ease-in-out infinite alternate;opacity:.8}.welcome:after{content:'';position:absolute;inset:0;background:#ffffff55;z-index:-1}.welcome .hero-logo{width:min(78%,370px);margin-bottom:22px}.welcome .start{background:#302a38;border-color:#302a38}.welcome .eyebrow,.welcome-line,.motion-toggle{color:#473951}.welcome .five-lines{margin:16px auto}.motion-toggle{margin-top:12px;font-size:12px}.motion-paused .flow-colors{animation-play-state:paused}@keyframes pastelFlow{0%{transform:translate(-5%,-3%) rotate(-8deg) scale(1)}50%{transform:translate(5%,3%) rotate(5deg) scale(1.08)}100%{transform:translate(-2%,5%) rotate(12deg) scale(1.02)}}
.results{max-width:650px;margin:auto;padding-top:22px}.capture-panel{background:#fff;border:1px solid #e4dcea;border-radius:16px;margin:0 auto 24px;padding:20px;box-shadow:0 8px 28px #46305204;scroll-margin-top:12px}.capture-brand{font-family:Georgia,serif;font-weight:bold;font-size:17px;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;color:#514558}.capture-brand span{font-family:system-ui,sans-serif;font-size:12px;font-weight:400;color:#746a7b}.result-overview h1{font-size:23px;line-height:1.5;margin:0 0 2px}.result-overview .chart-card{max-width:400px;margin:auto}.radar{opacity:0;animation:none;transform:scale(.82)}.radar.chart-visible{animation:chartIn .85s cubic-bezier(.2,.7,.2,1) both}.chart-note{font-size:12px;line-height:1.5;max-width:290px;text-align:right;margin:-6px 0 10px auto}.ranking{gap:6px}.rating{border:1px solid #e5dfeb;border-left:4px solid var(--pastel);border-radius:8px;background:linear-gradient(100deg,color-mix(in srgb,var(--pastel),white 78%),white 70%);overflow:hidden}.rating summary{display:flex;align-items:center;gap:12px;padding:8px 12px;list-style:none;min-height:43px;color:var(--trait)}.rating summary::-webkit-details-marker{display:none}.rating .rank-num{font-size:17px;min-width:21px}.rating-name{font-size:15px;font-weight:650;flex:1;line-height:1.4}.rating .letter-grade{font-size:26px;min-width:43px;color:var(--trait);background:none}.expand-sign{font-size:15px;font-weight:400;color:#81738a;transition:transform .2s}.rating[open] .expand-sign{transform:rotate(45deg)}.rating-detail{padding:8px 15px 14px;border-top:1px solid #ece5f1}.rating-detail strong{font-size:19px;color:var(--trait)}.rating-detail p{font-size:14px;line-height:1.6;margin:5px 0}.creative-profile{max-width:none;--profile-ink:#473e52;margin-top:0;padding:24px}.creative-profile h2{font-size:25px;line-height:1.5;letter-spacing:-.03em;color:var(--profile-ink);margin:16px 0}.creative-profile strong,.creative-profile b{color:var(--profile-ink)}.trait-tags{gap:6px;margin:16px 0}.trait-tags span{font-size:13px;font-weight:650;line-height:1.5;padding:5px 10px;background:var(--pastel);color:var(--trait);border:0}.profile-paragraph{font-size:16px;line-height:1.85;margin-bottom:18px}.creative-note{font-size:12px;line-height:1.6}.share-feature{border-color:#d8c2e6;border-top-color:#e4c1f9;background:linear-gradient(120deg,#fff9fc,#f6fcff);box-shadow:none;margin:28px auto}.share-feature .primary{background:#70428c;border-color:#70428c}.share-feature .primary:hover{background:#603276}.favorite-scenes h2{font-size:25px}.favorite-scenes li{font-size:23px}.result-bottom{margin:25px 0}#contact{max-width:760px;margin:35px auto 10px;padding:24px 30px;border-top:1px solid var(--line);color:var(--muted)}#contact h2{font-size:15px;margin-bottom:8px}#contact p{font-size:14px;line-height:1.8;margin-bottom:12px}#contact div{display:flex;flex-wrap:wrap;gap:10px 24px}#contact a{font-size:14px;color:#70428c;overflow-wrap:anywhere;text-underline-offset:3px}#contact[hidden]{display:none}@media(max-width:760px){main{padding:0 16px}header{padding:18px 22px}.results{padding-top:15px}.capture-panel{padding:14px;border-radius:12px;margin-bottom:22px}.result-overview h1{font-size:21px}.capture-brand{font-size:16px;margin-bottom:7px}.capture-brand span{font-size:12px}.result-overview .chart-card{max-width:360px}.chart-note{font-size:12px;margin-top:-3px;max-width:270px}.rating summary{padding:7px 10px;gap:9px;min-height:42px}.rating-name{font-size:14px}.rating .letter-grade{font-size:25px}.creative-profile{padding:20px}.creative-profile h2{font-size:24px;line-height:1.55;margin:15px 0}.profile-paragraph{font-size:16px;line-height:1.8}.trait-tags span{font-size:13px;padding:5px 9px}.instructions-page{padding:23px 18px;margin-top:20px}body[data-stage=intro]{padding:10px}body[data-stage=intro] header{padding:16px 18px}.welcome{padding:25px 18px}.welcome .hero-logo{max-width:300px}.welcome h1{font-size:27px!important}body[data-stage=intro] footer{font-size:12px}#contact{padding:22px;margin-top:24px}.share-feature{padding:22px 18px}.favorite-scenes li{font-size:22px}}@media(prefers-reduced-motion:reduce){.flow-colors{animation:none!important}.radar,.radar.chart-visible{animation:none!important;opacity:1;transform:none}}