:root{--ink:#2b211b;--muted:#706052;--blue:#800000;--line:#d8c8ae;--paper:#f8f0df;--soft:#f3e8d3;--red:#800000;--radius:12px;background:var(--paper);font-family:"Microsoft JhengHei","PingFang TC",sans-serif}
body{background:radial-gradient(ellipse at top,#fffcf3 0,#f8f0df 62%,#eadbc0 100%);min-height:100vh}
h1,h2,h3,.brand,.eyebrow{font-family:"Noto Serif TC","PMingLiU","MingLiU",serif}
.topbar{background:#fbf6e9;border-top:5px solid #800000;border-bottom:1px solid #d8c8ae;gap:18px}
.brand{color:#590000;font-size:20px;letter-spacing:.05em}
.topbar nav a{color:#590000}.student-nav{font-size:14px}
.hero{position:relative;display:block;isolation:isolate;margin:32px 0 24px;padding:46px 42px 300px;border-radius:14px;overflow:hidden;background:#eadbc0 url('cover.png') center 66%/cover no-repeat;box-shadow:0 12px 40px #49311b17}
.hero>div{position:relative;max-width:760px;padding:28px 34px;margin:auto;text-align:center;border:1px solid #d8c8ae;border-radius:12px;background:#f8f0dff2}
.hero .eyebrow{display:block;color:#800000;font-size:15px;letter-spacing:.13em;border-bottom:2px solid #800000;padding-bottom:18px}
.hero h1{font-size:clamp(25px,3.1vw,40px);font-weight:500;letter-spacing:.07em;line-height:1.6;margin:20px 0 16px;color:#2b211b}
.hero h1 span{display:block;color:inherit}.hero p{font-size:15px;line-height:1.9;color:#51463d;margin:0 auto}
.hero-note{position:absolute;bottom:24px;left:42px;right:42px;border:0;border-radius:8px;padding:18px 24px;background:#590000ed;color:#f8f0df;transform:none;max-width:none}
.hero-note{text-align:center}.hero-note strong{display:block;font-family:"PMingLiU","MingLiU",serif;letter-spacing:.1em;font-size:18px}.hero-note p{color:#f8f0df;font-size:13px;margin:8px auto 0;max-width:none}
.library-tools{background:#fffcf5;border:1px solid var(--line);border-radius:12px;padding:20px 26px;margin-top:0}
#banks{padding:24px 0 0;text-align:center}#f1-start{min-width:200px;font-size:18px;letter-spacing:.08em}
button{border-radius:7px}button.secondary{background:#fffaf0;color:#590000;border-color:#d8c8ae}
input,select,textarea{background:#fffdf8!important;border-color:#c8b797!important;color:#2b211b}
:focus-visible{outline:3px solid #bd8550;outline-offset:3px}
.panel,.review-list details{background:#fffdf7;border:1px solid #d8c8ae;box-shadow:0 8px 24px #49311b08;border-radius:12px}
.quiz-card{border-top:5px solid #800000}.quiz-card h2{line-height:1.7;font-size:clamp(22px,3vw,30px)}
.choice{background:#fffdf7;border-color:#d8c8ae;color:#2b211b}.choice.chosen{background:#f7e8dd;border-color:#800000}.letter{background:#f0e4d0;color:#590000}
.choice.right{background:#e9f3e8;border-color:#427546}.choice.wrong{background:#f9e4dd;border-color:#800000}
.feedback{border-radius:8px}.result-score{color:#800000}progress{accent-color:#800000}
progress::-webkit-progress-bar{background:#ecdfc8}progress::-webkit-progress-value{background:#800000}
.manual-dialog{background:#fffaf0;color:#2b211b;border:1px solid #cfb38b;border-top:6px solid #800000;border-radius:12px;box-shadow:0 20px 70px #27190f55}
.manual-dialog::backdrop{background:linear-gradient(#342315c9,#5900008c)}
.manual-dialog h2{color:#590000;line-height:1.5;letter-spacing:.06em}.manual-dialog p{line-height:1.85}
.manual-dialog th{background:#590000;color:#fff8e9}.manual-dialog th,.manual-dialog td{padding:12px 10px}.manual-dialog tr:nth-child(even){background:#f2e7d1}
.footer{border-top:1px solid #cdb998;color:#706052}
.quiz-timer{display:flex;justify-content:space-between;gap:16px;padding:12px 16px;background:#f3e8d3;border-radius:8px;color:#590000}.quiz-timer strong{font-variant-numeric:tabular-nums;font-family:monospace;font-size:21px;letter-spacing:.04em}
@media(max-width:700px){.hero{margin-top:20px;padding:22px 16px 265px}.hero>div{padding:20px 17px}.hero h1{font-size:25px;letter-spacing:.03em}.hero-note{left:16px;right:16px;bottom:16px;padding:16px}.hero .eyebrow{font-size:12px}.brand{font-size:17px}.library-tools{padding:18px}#banks{padding:0 0 24px}#f1-start{width:100%}.manual-dialog{padding:22px;width:calc(100% - 28px)}}
