@font-face{font-family:LaixinSans;src:url("./fonts/NotoSansSC-subset.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:block}
*{box-sizing:border-box}html{color-scheme:light;scroll-behavior:smooth}body{margin:0;background:#f4f6fd;color:#101325;font-family:LaixinSans,"Microsoft YaHei","PingFang SC",sans-serif}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:#316ad0}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #143fad;outline-offset:4px}#app{max-width:460px;min-width:320px;min-height:100dvh;margin:auto;background:#fff;padding:18px 14px 26px;container-type:inline-size;overflow-wrap:anywhere}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(28px,8cqi,38px);line-height:1.4;font-weight:900;text-align:center}h2{font-size:23px;line-height:1.45;font-weight:900}h3{font-size:18px;line-height:1.5}p{line-height:1.75}small,.hint{color:#67718c;font-size:14px;line-height:1.65}.center{text-align:center}.eyebrow{display:block;text-align:center;font-size:15px;color:#67718c;margin:8px auto 14px}.brand{max-width:94%;margin:20px auto 14px}.home h1{font-size:clamp(24px,6.7cqi,31px);margin-bottom:8px}.home .subtitle{color:#67718c;text-align:center;font-size:clamp(14px,4cqi,18px);margin:0 auto 8px}.scene{margin:12px -5px 0}.crop{width:100%;position:relative;overflow:hidden}.crop img{position:absolute;max-width:none;height:auto}.full-art{width:100%;height:auto;display:block}.primary{position:relative;display:block;width:100%;padding:0;border:0;background:none;aspect-ratio:2172/724;container-type:inline-size}.primary img{width:100%;height:auto;display:block}.primary span{position:absolute;left:17%;right:17%;top:22.1%;height:38.7%;display:flex;align-items:center;justify-content:center;font-size:clamp(15px,5.8cqi,26px);font-weight:900;line-height:1;white-space:nowrap;color:#fff;gap:10px}.primary:active img{filter:brightness(.92) saturate(1.12)}.primary:disabled img{filter:grayscale(1) brightness(1.35)}.secondary{display:block;text-align:center;border:0;background:none;color:#686b7d;font-size:15px;margin:0 auto 12px;padding:9px 12px}.topbar{display:flex;justify-content:space-between;align-items:center;margin:0 0 15px}.topbar button{border:0;background:none;color:#6b7187;padding:8px 0;font-size:13px}.paper{border:1.5px solid #ffe09a;border-radius:16px;padding:16px;background:linear-gradient(120deg,#fff8e9,#fffdf7);margin:12px 0}.paper.blue{border-color:#b7d7ff;background:linear-gradient(120deg,#f0f7ff,#fff)}.paper.pink{border-color:#ffc5dc;background:linear-gradient(120deg,#fff0f6,#fff)}.paper.green{border-color:#bbebdf;background:#f4fffa}.paper.purple{border-color:#d4ccff;background:#f7f4ff}.gender-options{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:28px 10px}.gender-choice{position:relative;border:2px solid #c8d8f9;background:#f4f8ff;border-radius:18px;padding:16px 8px;text-align:center;cursor:pointer}.gender-choice:has(input:checked){background:#fff0f6;border-color:#ff6396}.gender-choice input{position:absolute;opacity:0;width:1px;height:1px}.gender-choice:has(input:focus-visible){outline:3px solid #143fad}.gender-art{height:145px;display:flex;align-items:center;justify-content:center}.gender-art img{max-width:100%;max-height:100%;object-fit:contain}.gender-choice strong{font-size:24px;display:block;margin:10px 0}.chapter .scene{margin-top:15px}.chapter h1,.question h1{color:#fb694f}.chapter:nth-child(even) h1{color:#3776ea}.chapter .hint{text-align:center}.progress-row{display:flex;align-items:center;gap:12px;margin:6px 4px 16px;font-size:19px;font-weight:700;color:#687494}.progress-row strong{font-size:24px;color:#ff5485}.track{flex:1;height:10px;background:#dbe6f8;border-radius:20px;overflow:hidden}.track span{display:block;height:100%;background:#ff5485;border-radius:20px}.question h1{font-size:30px;margin:2px 0 12px}.question-panel{padding:17px 15px 13px;margin-bottom:13px;border:2px solid #ffe29a;border-radius:19px;background:radial-gradient(#f6dfaa55 .6px,transparent .8px) 0 0/4px 4px,#fff9e8}.question-panel h2{font-size:clamp(19px,5.8cqi,25px);line-height:1.55;margin-bottom:10px}.question-panel .hint{margin:0}.options{border:0;padding:0;margin:0;min-width:0}.option{position:relative;display:block;width:100%;aspect-ratio:2020/435;margin:8px 0;container-type:inline-size;cursor:pointer}.option input{position:absolute;opacity:0;width:1px;height:1px}.option:has(input:focus-visible){outline:3px solid #173db3;outline-offset:3px;border-radius:16px}.option>.crop{height:100%}.option:has(input:checked)>.crop img{filter:hue-rotate(115deg) saturate(1.3)}.radio{position:absolute;left:5%;top:50%;transform:translateY(-50%);width:7%;aspect-ratio:1;border:2px solid #8799c5;border-radius:50%;background:white}.option:has(input:checked) .radio{background:#ff5485;border-color:#ff5485;box-shadow:inset 0 0 0 3px white}.option-text{position:absolute;left:16%;top:50%;transform:translateY(-50%);width:78%;font-size:5.6cqi;font-weight:800;line-height:1.32;text-wrap:balance}.question-nav{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8px;margin-top:10px}.question-nav .back-button{border:2px solid #8ca0c2;border-radius:40px;background:#f4f8ff;color:#687ca6;font-size:19px;font-weight:800;padding:10px 0;margin:0 8px;box-shadow:inset 0 -4px 0 #e1e9fa}.question-nav .primary span{font-size:clamp(15px,9.5cqi,22px);gap:4px}.question-nav .primary{width:118%;margin-left:-9%}.autosave{text-align:center;font-size:12px;color:#8590a8;margin:8px 0 0}.dual{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.role-card{position:relative;container-type:inline-size;min-width:0}.frame{width:100%;height:auto;display:block}.role-heading{position:absolute;left:10%;top:6%;width:80%}.role-card h3{position:absolute;top:18%;left:9%;width:82%;margin:0;text-align:center;font-size:clamp(16px,12cqi,26px);line-height:1.4;font-weight:900;background:color-mix(in srgb,var(--role-color) 24%,white);border-radius:30px;padding:3px 0;color:#101325}.hero-slot{position:absolute;left:0%;top:27%;width:100%;height:52%;display:flex;align-items:center;justify-content:center;padding:0 3%}.hero-slot img{max-width:100%;max-height:100%;object-fit:contain;display:block}.role-tags{position:absolute;left:9%;top:80%;width:82%;display:flex;flex-direction:column;gap:4px;align-items:center}.role-tags span{font-size:clamp(11px,7.1cqi,16px);line-height:1.5;font-weight:800;white-space:nowrap;background:#ffffffdd;border:1px solid color-mix(in srgb,var(--role-color) 65%,white);border-radius:7px;padding:2px 10px}.combination{font-size:clamp(16px,5cqi,22px);font-weight:900;line-height:1.65;text-align:center;margin:18px 3px 6px}.result .brand{margin:4px auto 15px}.exception-card h3{font-size:clamp(14px,10cqi,23px);line-height:1.45;padding:5px 7px}.exception-card .hero-slot>.crop{max-height:100%;height:auto}.exception-card .role-tags span{font-size:clamp(10px,6.9cqi,14px)}.dual-motifs{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:2px;align-items:center}.dual-motifs .crop{width:100%}.report>h1{margin:10px 0 20px}.report .compact .role-card{max-height:none}.report section h2{display:flex;align-items:center;gap:9px;font-size:21px;margin-bottom:10px}.number{display:inline-flex;align-items:center;justify-content:center;flex:none;border-radius:50%;width:30px;height:30px;background:#ffa659;color:#fff;font-size:18px}.blue .number{background:#60a6fa}.pink .number{background:#ff709c}.green .number{background:#30c5a2}.purple .number{background:#a38beb}.report p{font-size:15px;line-height:1.8;margin-bottom:10px}.subgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.subgrid>div{border:1px solid #e6e9f5;border-radius:10px;padding:10px;background:#ffffffb0}.subgrid h3{font-size:16px;margin:0 0 7px}.count-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.count-item{border:1px solid #d6e3f7;border-radius:11px;background:#ffffffd0;padding:12px 8px}.count-item strong{display:block;font-size:30px;color:#fc5388;line-height:1.5}.count-item span{font-size:15px;font-weight:800}.count-item p{font-size:13px;margin:3px 0}.count-item .crop{width:42px;float:right}.bar{height:6px;background:#e0e9f8;border-radius:10px;margin:5px 0}.bar span{display:block;background:#8da6e9;height:100%;border-radius:10px}.evidence{border-left:3px solid #bdd7ff;padding:8px 0 8px 12px;margin:10px 0;background:#ffffffaa}.evidence small{display:block;font-size:12px}.evidence p{font-size:14px;margin:4px 0}.evidence b{color:#3274d8;font-size:14px}.record{margin:12px 0;padding:15px;border:1px solid #d4e5ff;border-radius:14px}.record h2{font-size:17px;line-height:1.7}.record p{color:#3274d8;font-weight:700}.record button{background:#fff0f6;border:1px solid #ffb6d1;color:#c33767;border-radius:16px;padding:7px 14px}.loading{padding:35px 18px;text-align:center;color:#687494}.loading:before{content:'✦';display:block;font-size:50px;color:#ff5485;animation:pulse 1s ease-in-out infinite alternate}.warning{border:1px solid #ffd886;background:#fff9e8;padding:15px;border-radius:13px;margin:15px 0;font-size:14px;line-height:1.7}.overlay{position:fixed;inset:0;background:#14214866;z-index:10;display:grid;place-items:center;padding:18px;overflow-y:auto;backdrop-filter:blur(2px)}dialog.modal{position:relative;margin:auto;border:2px solid #b7d5ff;border-radius:24px;background:white;width:min(410px,100%);max-height:90dvh;overflow-y:auto;padding:24px 20px;box-shadow:0 12px 48px #1e335533;container-type:inline-size}.modal h2{text-align:center;padding-right:15px}.modal .close{position:absolute;right:13px;top:10px;border:0;background:#f1f5fb;border-radius:50%;width:30px;height:30px;font-size:20px}.poster-preview{display:block;width:auto;max-width:100%;max-height:50dvh;margin:15px auto;box-shadow:0 3px 14px #24416c22}.download{display:block;text-align:center;text-decoration:none;background:#ff5485;color:white;border:2px solid #24243f;border-radius:30px;font-size:21px;font-weight:800;padding:13px;margin:12px auto}.modal .hint{text-align:center;margin:7px 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}#app[data-ready="loading"] .page{opacity:.25;pointer-events:none}#app[data-ready="loading"] .load-notice{display:block}.load-notice{display:none;text-align:center;font-size:13px;color:#6b7896}.question-panel{position:relative}.question-symbol{float:right;width:22%;margin:0 0 6px 10px}.question-symbol .crop{border-radius:10px}details{margin:10px 0}summary{cursor:pointer;font-weight:700;font-size:14px}@keyframes pulse{to{transform:scale(.9);opacity:.6}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}}@media(min-width:600px){#app{margin:24px auto;border-radius:24px;min-height:calc(100dvh - 48px);box-shadow:0 8px 48px #18397015}}

.option input,.gender-choice input{inset:0;width:100%;height:100%;margin:0;z-index:3;cursor:pointer}

.question-nav .primary{width:100%;margin-left:0}
/* D1-2: reference-led question layout, poster characters in every status. */
.question .topbar{margin-bottom:8px}.question .chapter-badge{display:flex;justify-content:center;align-items:center;gap:14px;margin:0 auto 14px;background:#fff8e8;border-radius:40px;padding:7px 12px;color:#111;font-size:clamp(19px,5.7cqi,26px);width:max-content;max-width:100%;line-height:1.25}
.chapter-badge span{border:1px solid #ffd69b;color:#ff7a24;border-radius:25px;padding:5px 11px;font-weight:900;white-space:nowrap}.chapter-badge b{white-space:nowrap}
.question .progress-row{flex-direction:row-reverse;gap:18px;margin:5px 6px 12px;font-size:16px;font-weight:500}.question .progress-row strong{color:#202749;font-size:16px;font-weight:500}.question .track{height:9px;background:#eef0fa;border:1px solid #e0e7f7;overflow:visible}.question .track span{position:relative;min-width:5px;height:7px}.question .track span:after{content:'';position:absolute;right:-4px;top:-1px;width:9px;height:9px;border-radius:50%;background:#ff6a95}
.question .question-panel{padding:15px 18px 10px;border:1.5px solid #bfd8ff;border-radius:24px;background:linear-gradient(130deg,#eff7ff,#fff);margin-bottom:12px}.question-panel h2{font-size:clamp(19px,5.7cqi,25px);line-height:1.45;margin-bottom:13px}.question .question-panel .hint{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:24px;background:#fff5dc;color:#263460;font-size:clamp(12px,3.8cqi,16px);line-height:1.5}.question .question-panel .hint:before{content:'💡';font-size:27px;flex:none}
.option{aspect-ratio:auto;min-height:40px;border:1.3px solid #dce4ff;border-radius:30px;background:linear-gradient(110deg,#fff,#fcfdff);padding:9px 13px 9px 46px;margin:7px 0}.option>.crop{display:none}.option-text{position:static;transform:none;width:auto;display:block;font-size:clamp(13px,4.45cqi,18px);font-weight:500;line-height:1.42;text-wrap:initial}.radio{left:15px;width:21px;border:1.4px solid #a6a7c7}.option:has(input:checked){background:linear-gradient(100deg,#fff1f5,#ffeef3);border:1.6px solid #ff5789;box-shadow:inset 0 0 0 2px #fff}.option:has(input:checked) .option-text{color:#f82a6a;font-weight:800}.option:has(input:checked) .radio{background:#fb4f87;border-color:#fb4f87;box-shadow:inset 0 0 0 6px #fb4f87}.option:has(input:checked) .radio:after{content:'';position:absolute;inset:6px;background:#fff;border-radius:50%}
.question-nav{gap:0;margin-top:8px;grid-template-columns:44% 56%}.question-nav .back-button{padding:12px 0;margin:0 5px;border:1.5px solid #aaa7c8;background:#fff;color:#263151;box-shadow:none;font-size:17px;font-weight:500}.question-nav .primary span{font-size:clamp(17px,10cqi,24px);font-weight:600}.question .autosave{margin-top:0;font-size:11px}
.chapter .brand{width:68%;margin:0 auto 13px}.chapter .eyebrow{margin:4px auto 10px;font-size:13px}.chapter h1{margin:0 auto 8px;font-size:30px}.chapter>.hint{max-width:90%;margin:0 auto 8px}.chapter .scene{width:90%;margin:8px auto 0}.chapter .primary{width:90%;margin:0 auto}.chapter{padding-top:0}
.ensemble-card .hero-slot{padding:0;position:absolute}.ensemble-card .hero-slot img{position:absolute;width:70%;height:80%;object-fit:contain;max-width:none;max-height:none}.ensemble-card .hero-slot img:first-child{left:0;top:0}.ensemble-card .hero-slot img:last-child{right:0;bottom:0}.ensemble-card h3{font-size:clamp(13px,9.6cqi,22px);line-height:1.4;padding:4px 6px}.ensemble-card .role-tags span{font-size:clamp(10px,6.8cqi,14px);padding:2px 6px}.visual-note{position:absolute;left:5%;top:93%;width:90%;font-size:clamp(9px,5.4cqi,11px);text-align:center;line-height:1}
.number{display:grid;place-items:center;padding:0;line-height:1;font-family:Arial,sans-serif;font-weight:700;font-size:18px;letter-spacing:0}
.access-page h1{font-size:clamp(24px,6.5cqi,30px);margin-bottom:8px}.access-page .brand{width:80%;margin:4px auto 16px}.access-page .subtitle{text-align:center;font-size:15px;color:#64718b}.access-art{width:75%;margin:0 auto 8px}.access-form>label{display:block;text-align:center;font-size:16px;font-weight:700;margin:8px 0 12px}.code-field{position:relative;margin:0 14px}.code-cells{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.code-cells span{height:52px;border:1.5px solid #cbd9ff;border-radius:12px;background:#f8faff;display:grid;place-items:center;font:700 26px Arial;color:#24365e}.code-field:focus-within .code-cells span{border-color:#ff6092}.code-field input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:text;font-size:20px}.access-form [role=status]{min-height:22px;margin:12px 5px 0;text-align:center;color:#67718c;font-size:13px;line-height:1.65}.access-submit{width:90%;margin:auto}

/* D3: measured poster proportions from the confirmed 941×1672 reference. */
.result{margin:0 -10px}.result>.brand{width:91%;max-width:none;margin:18px auto 5px}.result .dual{gap:5px}.poster-card{overflow:hidden;border-radius:22px}.poster-card h3{left:15%;top:16.5%;width:72%;height:7%;background:none!important;border-radius:0;display:flex;align-items:center;justify-content:center;padding:0;font-size:clamp(14px,10.5cqi,25px);line-height:1.15;z-index:2}.poster-card.long-name-card h3{font-size:clamp(11px,7.9cqi,19px);line-height:1.2}.poster-card .hero-slot{left:-5%;top:25%;width:110%;height:62%;padding:0;z-index:1}.poster-card .hero-slot>img{width:100%;height:100%;object-fit:contain;max-width:none;max-height:none}.poster-card .role-tags{inset:0;width:100%;height:100%;display:block;pointer-events:none;z-index:3}.poster-card .role-tags>span{position:absolute;display:flex;align-items:center;justify-content:center;gap:3%;left:7%;top:83.3%;width:42%;height:7%;padding:0;border:0;background:none;font-size:clamp(10px,7.8cqi,18px);line-height:1.15;transform:rotate(-11deg);white-space:normal;text-align:center}.poster-card .role-tags>span:last-child{left:52%;top:86%;width:41%;transform:rotate(10deg)}.poster-card .role-tags i{display:block;width:22%;flex:none}.poster-card .role-tags b{max-width:75%;font-weight:900}.poster-card .role-tags i .crop{border-radius:3px}.poster-card .visual-note{top:96.5%;font-size:9px;z-index:4}.result .combination{font-size:clamp(17px,5.6cqi,27px);margin:12px 8px 3px;line-height:1.5}.result-actions{margin:0 5%;display:flex;flex-direction:column;align-items:stretch}.result-actions .primary{margin-bottom:-8px}.result-actions .secondary{margin:0 auto 8px;padding:0 12px 6px;font-size:15px}.report .dual{margin:0 -7px}.question-nav{grid-template-columns:1fr 1fr;gap:0}.question-nav .primary span{font-size:clamp(15px,9.8cqi,22px)}.option:has(input:disabled){cursor:default}.option input:disabled{cursor:default}.poster-card.exact-card .crop{aspect-ratio:455/990}

/* D6: type centered in the actual artwork panels; paired names share the same size. */
.intro-instruction{display:grid;place-items:center;min-height:78px;text-align:center}.intro-instruction p{margin:0;width:100%;line-height:1.6}
.poster-card h3,.poster-card.long-name-card h3{left:16%;top:15.4%;width:72%;height:8%;font-size:10.5cqi;line-height:1;white-space:nowrap}
.poster-card[data-side="inner"] h3{left:16%;top:14.2%;width:69%;height:7.8%}
.poster-card .role-tags>span{left:6%;top:81.8%;width:43%;height:8%;transform:rotate(-12deg);gap:3%}
.poster-card .role-tags>span:last-child{left:51%;top:85%;width:43%;height:8%;transform:rotate(6deg)}
.poster-card[data-side="inner"] .role-tags>span{left:6%;top:84.2%;width:43%;height:8%;transform:rotate(-11deg)}
.poster-card[data-side="inner"] .role-tags>span:last-child{left:53%;top:87%;width:41%;height:8%;transform:rotate(8deg)}
.poster-card .role-tags b{display:block;text-align:center;line-height:1.15}
.result .combination,.report .combination{font-size:clamp(14px,4cqi,18px);line-height:1.65;margin:14px 10px 8px;text-wrap:balance;word-break:normal;overflow-wrap:normal}
