body{margin:0;background:#faf9fb}
[hidden]{display:none!important}
@scope (main){
:scope{box-sizing:border-box;--purple:#74458e;--ink:#24202a;--muted:#6c6573;--line:#e5e0e9;max-width:1000px;margin:auto;padding:44px 28px 48px;font:16px/1.75 system-ui,-apple-system,"Noto Sans TC",sans-serif;color:var(--ink);font-synthesis:none}*{box-sizing:border-box}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.65}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #9565b0;outline-offset:4px}a{color:var(--purple);text-underline-offset:3px}h1,h2,h3,p{margin:0}h1{font-size:clamp(28px,3.6vw,36px);line-height:1.4;letter-spacing:-.035em;font-weight:750}h2{font-size:25px;line-height:1.4;letter-spacing:-.025em}h3{font-size:19px;line-height:1.5}.intro{text-align:center;margin-bottom:30px}.eyebrow{color:var(--purple);font-size:11px;font-weight:700;letter-spacing:.12em;margin-bottom:12px}.lead{font-size:15px;color:var(--muted);line-height:1.85;margin-top:16px}.form-card,.chart-card{border:1px solid var(--line);border-radius:14px;background:#fff;padding:28px}.form-card{max-width:640px;margin:auto}.section-top{display:flex;align-items:center;gap:14px;margin-bottom:22px}.section-top h2{font-size:21px}.section-top p{font-size:13px;color:var(--muted);margin-top:4px}.step-number{display:grid;place-items:center;width:36px;height:36px;flex-shrink:0;border-radius:50%;background:#f1eaf5;color:var(--purple);font-size:12px;font-weight:700}fieldset{padding:0;margin:0 0 22px;border:0;min-width:0}legend,label{font-size:14px;font-weight:650}legend{margin-bottom:10px}label{display:block;margin-bottom:8px}input:not([type=radio],[type=checkbox]),select{display:block;width:100%;min-height:48px;border:1px solid #cfc7d6;border-radius:7px;background:white;color:var(--ink);padding:10px 12px;font-size:16px}input::placeholder{color:#746d7a}input[type=radio],input[type=checkbox]{accent-color:var(--purple)}.segmented{display:flex;gap:4px;max-width:240px;background:#f3eff6;border-radius:8px;padding:4px;margin-bottom:12px}.segmented label{display:flex;flex:1;gap:7px;justify-content:center;align-items:center;min-height:40px;margin:0;border-radius:5px;font-weight:500}.segmented label:has(input:checked){background:white;color:var(--purple);box-shadow:0 1px 3px #24202a12}.date-row{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:12px}.date-row label{margin:0;font-size:12px}.date-row input,.date-row select{margin-top:5px}.check{display:flex;gap:8px;align-items:center;min-height:40px;margin-top:8px}.hint{font-size:12px;line-height:1.7;color:var(--muted);margin:8px 0 18px}fieldset .hint{margin-bottom:0}#period-label,#exact-label{margin-top:12px}.privacy{color:var(--muted);font-size:12px;line-height:1.8;margin:20px 0 16px}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:48px;padding:11px 20px;border-radius:7px;text-decoration:none;font-size:14px;font-weight:650;border:1px solid var(--purple);background:var(--purple);color:#fff}#submit{width:100%;justify-content:space-between}.secondary{background:white;color:var(--purple)}.primary:active{background:#543067}.status{font-size:13px;color:var(--muted);line-height:1.7;margin-top:12px;min-height:22px;overflow-wrap:anywhere}.status.error{color:#99313a}.status:empty{display:none}#result{scroll-margin-top:100px}.result-hero{padding:16px 20px 28px;text-align:center}.result-hero h2{font-size:clamp(26px,4vw,36px)}#result-summary{max-width:580px;margin:14px auto;color:var(--muted)}blockquote{font-size:20px;line-height:1.7;color:var(--purple);margin:24px auto 18px;max-width:600px;font-weight:650;overflow-wrap:anywhere}.entertainment{font-size:11px;color:var(--muted)}.chart-card{max-width:700px;margin:auto}.chart-card .section-top{margin-bottom:18px}.pillars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.pillar{background:#f8f5fa;border-radius:8px;text-align:center;padding:15px 8px}.pillar span{display:block;font-size:12px;color:var(--muted)}.pillar strong{display:block;font-size:25px;font-weight:600;letter-spacing:.08em;margin:7px 0}.pillar small{font-size:11px;color:var(--muted)}.pillar.unknown{background:#f7f7f7}.elements{display:flex;flex-wrap:wrap;gap:8px}.element{padding:5px 12px;background:#f1eaf5;border-radius:99px;font-size:13px;color:#613b75}.chart-card details{font-size:13px;color:var(--muted)}summary{cursor:pointer;min-height:44px;display:list-item;align-content:center}#chart-details p{margin:8px 0}.aspects{max-width:700px;margin:20px auto 0;display:grid;gap:16px}.aspect{padding:24px;background:#fff;border:1px solid var(--line);border-radius:12px}.aspect .eyebrow{margin-bottom:7px;font-size:10px}.aspect h3{margin-bottom:12px}.aspect p{font-size:15px;line-height:1.85;overflow-wrap:anywhere}.aspect .symbol{font-size:12px;color:var(--muted);margin-bottom:10px}.aspect .scene{font-size:13px;color:var(--muted);margin-top:12px}.result-actions{max-width:700px;display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:24px auto 8px}.text-button{border:0;background:transparent;color:var(--muted);text-decoration:underline;text-underline-offset:4px;min-height:48px;padding:8px 14px;font-size:14px}#result>.hint,#share-status,#analysis-status{text-align:center;max-width:700px;margin-left:auto;margin-right:auto}#retry{display:flex;margin:12px auto}.about{max-width:640px;margin:22px auto 0;font-size:13px;color:var(--muted)}.about p{line-height:1.85;margin:10px 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}@media(max-width:600px){:scope{padding:28px 18px 32px}.intro{margin-bottom:24px}.eyebrow{font-size:10px}.form-card,.chart-card{padding:21px 18px;border-radius:11px}.section-top{gap:10px}.section-top h2{font-size:19px}.section-top p{font-size:12px}.date-row{gap:8px}.pillars{gap:6px}.pillar{padding:12px 4px}.pillar strong{font-size:22px;letter-spacing:0}.pillar small{font-size:10px}.result-hero{padding:8px 0 22px}.aspect{padding:20px}.result-actions>*{flex:1 1 calc(50% - 10px)}.result-actions .primary{flex-basis:100%}blockquote{font-size:19px}.lead{font-size:14px}}
}
@scope (main){
textarea{font:inherit;color:var(--ink);font-size:16px;line-height:1.7}textarea:focus-visible{outline:3px solid #9565b0;outline-offset:4px}.result-hero h2{max-width:620px;margin:auto;font-size:clamp(25px,3.2vw,31px)}.result-hero #result-summary{font-size:14px;margin:10px auto 14px}.reading-options{max-width:700px;margin:18px auto 0;padding:26px 28px;background:#f4eef8;border:1px solid #e0d2e9;border-radius:12px}.reading-options .section-top{margin-bottom:12px}.reading-options .eyebrow{font-size:10px;margin-bottom:3px;letter-spacing:.08em}.reading-options h3{font-size:21px;letter-spacing:-.02em}.reading-options .step-number{background:#fff}.handoff-description{font-size:14px;color:#51465a;line-height:1.85}.handoff-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.handoff-actions>*{min-inline-size:10rem;text-align:center}.handoff-actions .secondary{background:transparent}.handoff-actions .primary:active,.handoff-actions .secondary:active{transform:scale(.98)}#chatgpt-hint{margin:10px 0 0}.prompt-details{margin-top:12px;font-size:13px;color:#51465a}.prompt-details textarea{display:block;width:100%;min-height:220px;max-height:480px;padding:14px;border:1px solid #c9bad3;border-radius:7px;resize:vertical;background:#fff;overflow-wrap:anywhere}.prompt-details .hint{margin:8px 0 0}.prompt-privacy{font-size:12px;color:#65556f;line-height:1.8;margin-top:16px}.onsite-panel{margin-top:16px;font-size:13px;color:#51465a}.onsite-panel .hint{margin:6px 0 12px}.onsite-panel #analysis-status{text-align:left;font-size:13px;margin-top:12px}.onsite-panel #retry{margin:12px 0 0}.onsite-panel .secondary:disabled{cursor:not-allowed;opacity:.65}.result-actions{margin-top:18px}.result-actions:has(>#restart:only-child){margin-top:14px}@media(hover:hover) and (pointer:fine){.handoff-actions .secondary:hover{background:#ece2f2}.handoff-actions .primary:hover{background:#63327e}}@media(max-width:600px){.reading-options{padding:22px 18px;margin-top:14px}.reading-options h3{font-size:20px}.handoff-actions>*{flex:1 1 0;min-inline-size:0;padding-left:10px;padding-right:10px;font-size:13px;white-space:nowrap}.result-hero{padding-bottom:20px}}@media(max-width:360px){.handoff-actions{flex-direction:column}.handoff-actions>*{width:100%}}@media(prefers-reduced-motion:reduce){.handoff-actions .primary:active,.handoff-actions .secondary:active{transform:none}}
}

@scope (main){
/* Primary on-site reading, open supporting sections and compact prompt typography. */
.icon{width:18px;height:18px;flex:none}.onsite-panel{max-width:700px;margin:0 auto 20px;padding:26px 28px;background:#f4eef8;border:1px solid #ded1e7;border-radius:12px}.onsite-panel h3{font-size:23px;line-height:1.4}.onsite-panel #onsite-analysis{width:100%;min-height:56px;font-size:17px;margin-top:4px}.reading-options{background:#fff;border-color:var(--line)}.reading-options h3{font-size:19px}.prompt-details h4,.chart-rules h4{font-size:13px;margin:18px 0 8px}.prompt-details textarea{font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;min-height:210px;max-height:300px}.chart-rules{font-size:12px;color:var(--muted)}.about h2{font-size:17px}.about{max-width:700px}.handoff-actions{gap:12px}.handoff-actions .secondary{font-size:13px}@media(max-width:600px){.onsite-panel{padding:22px 18px}.onsite-panel h3{font-size:21px}}

}

@scope (main){
select{appearance:none;-webkit-appearance:none;padding-right:48px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%236c6573' stroke-width='1.6'%3E%3Cpath d='m5 7.5 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center;background-size:16px 16px}
.date-row select{padding-left:8px;padding-right:34px;background-position:right 12px center;background-size:12px 12px}
@media(forced-colors:active){select{appearance:auto;-webkit-appearance:auto;background-image:none;padding-right:12px}}
}

@scope (main){@media(max-width:360px){.date-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}}}

@scope (main){
.handoff-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.handoff-actions .secondary{position:relative;width:100%;min-inline-size:0;min-height:48px;padding:12px 28px;font:650 13px/1.4 system-ui,-apple-system,sans-serif;gap:0;text-align:center;white-space:normal}
#open-chatgpt .icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:14px;height:14px}
.prompt-details textarea{font-size:12px;line-height:1.6}
@media(max-width:360px){.handoff-actions{grid-template-columns:1fr}}
}

@scope (main){@media(max-width:360px){.date-row select{padding-right:30px}}}

@scope (main){
#topic{margin-bottom:20px}
#result-title,#result-summary,.aspect h3{overflow-wrap:anywhere}
:scope:has(#result:not([hidden]))>.intro{display:none}
#aspects:empty{margin:0}
#chart-card{margin-top:22px}
#result-actions{margin-bottom:12px}
#chart-card+#onsite-panel{margin-top:20px}
#result-hero{scroll-margin-top:100px}
@media(max-width:360px){.date-row input{padding-left:8px;padding-right:8px}}
}

.form-card .about{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
