:root{--green:#28594f;--orange:#c66c38;--cream:#fff9ed;--ink:#443c35}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:"Microsoft JhengHei","PingFang TC",sans-serif}header{background:white}header img{display:block;width:100%;height:auto;max-height:34vh;object-fit:contain}main{max-width:1000px;margin:auto;padding:24px 28px 40px}h1{color:var(--green);font-size:32px;margin:8px 0 20px}h2{font-size:27px;line-height:1.5}p{font-size:21px;line-height:1.65;margin:12px 0}button{font:inherit;font-size:22px;min-height:64px;border:0;border-radius:14px;padding:16px 24px;cursor:pointer;touch-action:manipulation}button:focus-visible{outline:4px solid #c66c38;outline-offset:4px}.primary{background:var(--green);color:white;margin-top:16px;min-width:220px}.secondary{background:#f0dec2;color:var(--ink);margin:16px 12px 0 0}.options{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}.option{background:white;border:2px solid #9caf9a;text-align:left;line-height:1.5;display:flex;align-items:center;gap:16px}.option:disabled{cursor:default;color:var(--ink);opacity:1}.option.selected{border:3px solid var(--orange);background:#fff0da}.letter{font-weight:bold;color:var(--green);font-size:26px}.meta{display:flex;justify-content:space-between;color:var(--green);font-size:20px;font-weight:bold}.track{height:9px;background:#e4dfce;border-radius:9px;margin:16px 0 24px;overflow:hidden}.track div{height:100%;background:#cf9748}.card{background:white;border-radius:20px;padding:26px;margin:16px 0;border:1px solid #e7dcc6}.feedback{font-size:23px;font-weight:bold;color:var(--green)}.result{text-align:center}.result h1{font-size:38px}.symbol{font-size:54px;color:var(--orange)}[hidden]{display:none!important}@media(max-width:650px){main{padding:20px}.options{grid-template-columns:1fr}h1{font-size:28px}h2{font-size:24px}p{font-size:19px}header img{max-height:28vh}}@media(orientation:landscape) and (max-height:850px){header img{max-height:25vh}main{padding-top:16px}.card{padding:18px}h2{margin:14px 0}.options{margin:18px 0}}

body.in-question header img{max-height:15vh}
.quiz-layout{display:grid;grid-template-columns:minmax(240px,0.9fr) minmax(0,1.3fr);gap:28px;align-items:start;margin-top:20px}
.artwork{margin:0;background:white;border:1px solid #e7dcc6;border-radius:16px;padding:14px;text-align:center}
.artwork img{display:block;width:100%;height:44vh;min-height:220px;max-height:490px;object-fit:contain}
.artwork figcaption{font-size:18px;line-height:1.5;margin-top:10px}
.zoom-art{font-size:18px;min-height:48px;padding:10px 16px;background:#f0dec2;color:var(--ink);margin-top:12px}
.quiz-content h2{margin-top:0;font-size:25px}.quiz-content .options{grid-template-columns:1fr;gap:12px}.quiz-content .option{font-size:21px;min-height:66px;padding:12px 18px}
dialog{border:0;border-radius:18px;padding:18px;max-width:96vw;max-height:96vh;width:1000px;background:var(--cream);color:var(--ink)}dialog::backdrop{background:#152c27d9}.art-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:20px;margin-bottom:12px}.art-dialog-head button{min-height:48px;font-size:19px;padding:10px 20px;background:var(--green);color:white}.art-dialog-image{display:block;width:100%;height:73vh;object-fit:contain;background:white}
@media(max-width:720px){.quiz-layout{grid-template-columns:1fr;gap:20px}.artwork img{height:32vh;min-height:180px}.quiz-content h2{font-size:23px}.quiz-content .option{font-size:20px}body.in-question header img{max-height:12vh}}