:root{--bg:#f6f2e7;--paper:#fffefa;--ink:#183128;--muted:#65766e;--green:#176b51;--deep:#0d4c3a;--soft:#e3f2eb;--line:#d7e1db;--yellow:#f2c94c;--red:#a82d3b;--shadow:0 16px 42px rgba(18,67,49,.12);font-family:"Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;color:var(--ink);background:var(--bg)}
*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 15% 0,#fff 0,transparent 38%),var(--bg)}button,input{font:inherit}button{cursor:pointer;min-height:44px}.primary,.secondary{border:0;border-radius:14px;padding:.85rem 1rem;font-weight:800}.primary{width:100%;background:var(--green);color:#fff}.secondary{background:var(--soft);color:var(--deep)}button:focus-visible,input:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}button:disabled{cursor:not-allowed;opacity:.62}
.login-page,.student-page{width:min(100%,768px);min-height:100vh;margin:auto;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1.5rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}.login-page{display:grid;place-items:center}.login-panel{width:min(100%,430px);padding:clamp(1rem,5vw,2.25rem);background:rgba(255,254,250,.92);border:1px solid #fff;border-radius:28px;box-shadow:var(--shadow)}.brand-lockup{width:150px;height:135px;margin:0 auto 1rem;position:relative}.score-logo{position:absolute;left:7px;top:4px;width:104px;height:104px;border-radius:27px;display:grid;place-items:center;background:linear-gradient(145deg,#3e9470,var(--deep));color:#fff;font-size:2rem;font-weight:900;letter-spacing:.08em;box-shadow:0 12px 26px rgba(23,107,81,.2)}.magnifier{position:absolute;width:64px;height:64px;border:10px solid var(--yellow);border-radius:50%;right:2px;bottom:14px;transform:rotate(-40deg);filter:drop-shadow(0 5px 5px rgba(0,0,0,.1))}.magnifier:after{content:"";position:absolute;width:13px;height:54px;background:var(--green);border-radius:8px;left:16px;top:47px}.login-panel header{text-align:center}.login-panel h1{margin:.3rem 0;font-size:clamp(1.6rem,6vw,2.2rem)}.login-panel header p,.login-panel header span{color:var(--muted)}form{display:grid;gap:1rem;margin-top:1.5rem}label{display:grid;gap:.45rem;font-weight:800}input{width:100%;min-height:48px;padding:.75rem;border:1px solid var(--line);border-radius:13px;background:#fff}.password-field{display:grid;grid-template-columns:1fr auto}.password-field input{border-radius:13px 0 0 13px}.password-field button{border:1px solid var(--line);border-left:0;border-radius:0 13px 13px 0;background:#fff;color:var(--deep);font-weight:800}.login-message{min-height:1.5em;margin:0;color:var(--red);text-align:center}
.toolbar,.welcome,.section-title,.score-card header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.toolbar{padding:.2rem 0 1rem}.mini-brand{display:flex;align-items:center;gap:.65rem}.mini-brand span{padding:.5rem;border-radius:10px;background:var(--green);color:#fff;font-weight:900}.icon-button{border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--deep);padding:.5rem .8rem;font-weight:800}.welcome{margin:.5rem 0 1rem}.welcome small,.welcome p,.section-title span,.score-card small,.updated{color:var(--muted)}.welcome h1{margin:.15rem 0;font-size:clamp(1.7rem,7vw,2.5rem)}.welcome p{margin:0}.avatar{width:54px;height:54px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;background:var(--soft);font-size:1.3rem;font-weight:900}.profile-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:1rem;padding:1.1rem;border-radius:21px;background:linear-gradient(135deg,var(--green),var(--deep));color:#fff;box-shadow:0 12px 26px rgba(23,107,81,.2)}.profile-card strong{display:block;margin:.25rem 0;font-size:1.25rem}.profile-card small{opacity:.82}.seat{width:64px;height:64px;border-radius:17px;display:grid;place-items:center;text-align:center;background:rgba(255,255,255,.16)}.seat b{display:block;font-size:1.4rem}.seat span{font-size:.75rem}.section-title{margin:1.25rem 0 .65rem}.section-title h2{margin:0;font-size:1rem}.scope{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}.scope button,.subject{border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--deep);font-weight:800}.scope button.active{border-color:var(--green);background:var(--green);color:#fff}.subjects{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}.subject{min-height:68px;padding:.45rem .2rem;display:grid;place-items:center;gap:.15rem}.subject span{font-size:1.15rem}.subject.active{border-color:var(--green);background:var(--soft);box-shadow:inset 0 0 0 1px var(--green)}.result{margin-top:1rem}.feedback,.score-card{border:1px solid var(--line);border-radius:20px;background:#fff;padding:1rem;box-shadow:0 8px 22px rgba(20,50,38,.06)}.feedback{min-height:150px;display:grid;place-items:center;align-content:center;text-align:center;gap:.7rem}.feedback span{color:var(--muted)}.feedback.offline,.feedback.timeout,.feedback.recovered{border-color:#dfc269;background:#fffaf0}.feedback.error,.feedback.disabled{border-color:#df9ca4;background:#fff7f7}.spinner{display:inline-block;width:1.25rem;height:1.25rem;border:3px solid #bad7ca;border-top-color:var(--green);border-radius:50%;vertical-align:middle;animation:spin .8s linear infinite}.score-card h3{margin:0}.avg{padding:.5rem .7rem;border-radius:99px;background:var(--soft);color:var(--deep);font-weight:900}.avg.muted{color:var(--muted)}.score-card ul{margin:.75rem 0 0;padding:0;list-style:none}.score-card li{display:grid;grid-template-columns:1fr auto auto;gap:.65rem;align-items:center;padding:.7rem .1rem;border-bottom:1px solid var(--line)}.score-card li:last-child{border:0}.score-card li b{font-size:1.1rem;font-variant-numeric:tabular-nums}.grade-state{padding:.2rem .4rem;border-radius:99px;background:var(--soft);color:var(--deep);font-size:.75rem}.updated{text-align:center;font-size:.75rem;margin:.75rem 0 0}@keyframes spin{to{transform:rotate(360deg)}}
@media (min-width:600px){.student-page{padding-inline:2rem}.selector{display:grid;grid-template-columns:1fr 1.5fr;column-gap:1.5rem}.selector .section-title:nth-of-type(2),.subjects{grid-column:2}.scope{grid-column:1;grid-row:2}.result{margin-top:1.5rem}.profile-card{padding:1.4rem}}
@media (max-width:350px){.subjects{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){.spinner{animation:none}}
/* Phase 16: resilient narrow-screen and 200% text layout. */
html{overflow-x:hidden;text-size-adjust:100%;-webkit-text-size-adjust:100%}body{overflow-x:hidden}.mini-brand,.welcome>div,.profile-card>div,.score-card header>div{min-width:0}.mini-brand b,.welcome h1,.welcome p,.profile-card strong,.profile-card small,.updated{overflow-wrap:anywhere}.mini-brand span,.icon-button{flex:0 0 auto}.profile-card{grid-template-columns:minmax(0,1fr) auto}.score-card li{grid-template-columns:minmax(0,1fr) auto auto}
