*{box-sizing:border-box}body{margin:0;background:#f5f1ea;color:#17211b;font-family:system-ui,"Noto Sans TC",sans-serif}.wrap{max-width:980px;margin:auto;padding:28px 18px 64px}.brand{font-size:13px;letter-spacing:.16em;color:#6d766f}.hero{background:#183d2f;color:#fff;border-radius:24px;padding:34px;margin:16px 0 24px;box-shadow:0 16px 40px #183d2f22}h1{margin:5px 0 8px;font-size:clamp(30px,6vw,54px)}.card{background:#fff;border:1px solid #ded8ce;border-radius:18px;padding:22px;margin:14px 0;box-shadow:0 6px 22px #2c302a0b}.chooser,.grid,.metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.choose{text-decoration:none;color:inherit}.grade,.name{font-size:28px;font-weight:900;color:#b04736}.grade{font-size:42px}.field{padding:12px 0;border-top:1px solid #eee8df}.field b{display:block;font-size:12px;color:#777f78}.wide{grid-column:1/-1}form{max-width:600px}input,select,textarea,button{width:100%;padding:13px;border-radius:12px;border:1px solid #c9c3b8;font:inherit;margin:5px 0 12px;background:#fff}button{background:#d3543c;color:#fff;border:0;font-weight:800}.logout{float:right;color:#fff;background:#ffffff20;padding:8px 13px;border-radius:9px;text-decoration:none}.hero-link{color:#fff;font-weight:700}.msg{padding:12px;border-radius:10px;background:#e4f5e9}.error{background:#ffe7e1;color:#8a2b1c}.metric{background:#fff;border:1px solid #ded8ce;border-radius:16px;padding:20px}.metric strong{font-size:34px;color:#b04736;display:block}.metric span{color:#687168}.google-box{text-align:center}.google-button{display:inline-block;background:#fff;color:#263238;border:1px solid #c7c7c7;border-radius:10px;padding:12px 18px;text-decoration:none;font-weight:800;box-shadow:0 2px 8px #00000012}.bind{border-left:5px solid #4285f4}.bound{border-left:5px solid #2e7d32;background:#f3fbf5}@media(max-width:650px){.chooser,.grid,.metrics{grid-template-columns:1fr}.hero{padding:25px}}