*{box-sizing:border-box}
:root{--bg:#f7f2e8;--card:#fff;--text:#26342f;--muted:#6c756f;--brand:#3f6f5f;--brand2:#dce9e1;--line:#e6e1d8;--D:#d83c43;--I:#f0a51f;--S:#54a45f;--C:#2f7fc1}
body{margin:0;background:var(--bg);color:var(--text);font-family:"Noto Sans TC","Microsoft JhengHei",Arial,sans-serif}
.app{width:min(430px,100%);margin:0 auto;padding:10px}.card{background:var(--card);border-radius:22px;padding:18px;margin:10px 0;box-shadow:0 8px 24px rgba(40,38,30,.1)}
.hidden{display:none!important}h1{font-size:28px;text-align:center;margin:8px 0 10px}h2,h3{text-align:center}.muted{color:var(--muted)}.heroLead{text-align:center;font-size:21px;font-weight:900;color:var(--brand)}
.quickBenefits{display:grid;gap:8px;margin:16px auto}.quickBenefits span{background:#f5f2ec;border-radius:999px;padding:10px 14px;font-weight:800;color:var(--brand);text-align:center}.giftIntro{background:#fff7df;border:1px solid #ead9ad;border-radius:18px;padding:14px;text-align:center;font-weight:800;color:#8a5b00}
.typePreview{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:18px auto}.typePreview div{border:1px solid var(--line);border-radius:16px;background:#fbfaf7;padding:8px;text-align:center}.typePreview img{width:100%;height:48px;object-fit:contain}.typePreview strong{font-size:17px;color:var(--brand)}
button{border:0;border-radius:999px;padding:14px 22px;font-size:17px;font-weight:800;cursor:pointer;min-height:52px}.primary{background:var(--brand);color:#fff}.secondary{background:#999;color:#fff}.outline{background:#fff;color:var(--brand);border:1px solid var(--brand)}.full{width:100%;display:block;margin:12px auto}
.quizTop{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.pill{background:var(--brand2);color:var(--brand);border-radius:999px;padding:6px 10px;font-weight:800;font-size:13px}.progress{height:10px;background:#e3ddd2;border-radius:999px;overflow:hidden;margin:12px 0 20px}.progress div{height:100%;width:0;background:var(--brand)}
.question{font-size:22px;line-height:1.55;text-align:center;margin:22px 0}.scale{display:grid;grid-template-columns:1fr;gap:9px}.choice{min-height:60px;border:2px solid var(--line);background:#fbfaf7;border-radius:18px;padding:14px 12px;text-align:center;display:flex;align-items:center;justify-content:center;font-size:18px;cursor:pointer}.choice.selected{border-color:var(--brand);background:var(--brand2);font-weight:900}.warning{min-height:24px;text-align:center;color:#b00020}.actions{display:grid;gap:8px}
.resultAnimals{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.resultAnimals img{width:120px;height:120px;object-fit:contain}.unknownIcon{font-size:78px;text-align:center}.resultType{text-align:center;font-size:48px;color:var(--brand);font-weight:900}.resultTitle{text-align:center;font-size:22px}.resultDesc{background:#f5f2ec;border-radius:18px;padding:16px;text-align:center;line-height:1.75}.traits{display:grid;gap:8px}.trait{background:var(--brand2);color:var(--brand);border-radius:14px;padding:14px;text-align:center;font-size:17px;font-weight:900}
.resultBrandBooth{margin:26px auto 0;padding-top:22px;border-top:1px solid var(--line);text-align:center}.resultBlessedLogo{width:min(300px,88%);height:auto;margin:0 auto 14px;display:block}.boothCardButton{width:100%;border:2px solid #d8c08b;background:linear-gradient(180deg,#fff7df,#fff);color:#4b3a18;border-radius:24px;padding:20px 15px;display:grid;gap:7px;text-align:center}.boothCardIcon{font-size:40px}.boothCardTitle{font-size:22px;font-weight:900;color:#9b6a00}.boothCardText{font-size:15px;line-height:1.6;color:#6c756f}.boothCardButton strong{display:inline-block;margin:8px auto 0;background:var(--brand);color:#fff;padding:10px 18px;border-radius:999px}
.grid{display:grid;gap:12px}.panel{background:#f5f2ec;border-radius:18px;padding:15px}.scoreRow{display:grid;grid-template-columns:48px 1fr 54px;gap:10px;align-items:center;margin:12px 0}.scoreIcon{width:42px;height:42px;object-fit:contain}.scoreTrack{height:17px;background:#eee;border-radius:999px;overflow:hidden}.scoreFill{height:100%;border-radius:999px}.D{background:var(--D)}.I{background:var(--I)}.S{background:var(--S)}.C{background:var(--C)}#radarChart{width:100%;max-width:370px;display:block;margin:0 auto}
.quadrant{position:relative;width:min(320px,100%);aspect-ratio:1/1;margin:16px auto;background:linear-gradient(to right,transparent 49.5%,#b9b1a4 49.5%,#b9b1a4 50.5%,transparent 50.5%),linear-gradient(to bottom,transparent 49.5%,#b9b1a4 49.5%,#b9b1a4 50.5%,transparent 50.5%);border:1px solid #d8d0c2;border-radius:18px}.q{position:absolute;font-weight:900;font-size:24px;opacity:.42}.qD{left:22%;top:22%}.qI{right:22%;top:22%}.qC{left:22%;bottom:22%}.qS{right:22%;bottom:22%}.axis{position:absolute;color:#6f766f;font-size:13px}.top{top:7px;left:50%;transform:translateX(-50%)}.bottom{bottom:7px;left:50%;transform:translateX(-50%)}.left{left:8px;top:50%;transform:translateY(-50%)}.right{right:8px;top:50%;transform:translateY(-50%)}.dot{position:absolute;width:18px;height:18px;background:#26342f;border:3px solid #fff;border-radius:50%;box-shadow:0 1px 8px rgba(0,0,0,.3);transform:translate(-50%,-50%)}
textarea{width:100%;min-height:150px;border:1px solid var(--line);border-radius:14px;padding:12px;line-height:1.6}
.analyzingOverlay{position:fixed;inset:0;background:rgba(247,242,232,.94);z-index:99999;display:flex;align-items:center;justify-content:center;padding:18px}.analyzingCard{width:min(360px,100%);background:#fff;border-radius:24px;padding:28px;text-align:center;box-shadow:0 18px 48px rgba(0,0,0,.16)}.analyzingIcon{font-size:44px}.analyzingBar{height:12px;background:#eee4d5;border-radius:999px;overflow:hidden;margin:20px 0}.analyzingBar span{display:block;height:100%;width:0;background:var(--brand);border-radius:999px;animation:loadingBar .9s ease forwards}@keyframes loadingBar{from{width:0}to{width:100%}}
.boothModal{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-start;justify-content:center;padding:10px}.boothModalBackdrop{position:absolute;inset:0;background:rgba(0,0,0,.45)}.boothModalCard{position:relative;width:100%;max-width:560px;max-height:96vh;overflow:auto;background:#fff;border-radius:22px;padding:18px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.28);z-index:1}.boothModalClose{position:absolute;right:14px;top:12px;width:38px;height:38px;border-radius:999px;background:#f2eee6;color:#333;font-size:28px;border:0;padding:0}.boothLogo{width:min(300px,86%)}.boothMap{width:100%;height:auto;max-height:58vh;object-fit:contain;border-radius:16px;border:1px solid #eee}.boothLocation{background:#f5f2ec;border-radius:16px;padding:14px;line-height:1.7;margin:10px 0}.boothLocation strong{display:block;font-size:22px;color:var(--brand);font-weight:900}.giftHint{background:#fff0d6;border:1px solid #f0d196;color:#8a5b00;border-radius:18px;padding:12px 16px;font-weight:900}.boothLink{display:flex;min-height:52px;align-items:center;justify-content:center;background:var(--brand);color:white;text-decoration:none;border-radius:999px;padding:14px 22px;font-weight:900;margin-top:12px}.boothFooter{color:var(--muted)}
@media(max-width:380px){.app{padding:8px}.card{padding:16px}h1{font-size:26px}.question{font-size:20px}.resultAnimals img{width:105px;height:105px}.typePreview img{height:42px}#radarChart{max-width:330px}}