@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=Manrope:wght@500;600;700;800&display=swap');
:root{--ink:#10213f;--muted:#60708c;--paper:#f8f9fd;--line:#dfe6f0;--lime:#d9f99d;--sky:#bde8ff}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,"Noto Sans TC",sans-serif}.shell{min-height:100vh}.login-view{max-width:540px;margin:auto;padding:10vh 28px 44px}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--ink);color:var(--lime);font-weight:800;font-size:22px}.eyebrow,.course-eyebrow{font-family:"DM Mono",monospace;letter-spacing:.1em;font-size:11px;color:#6d7d98;font-weight:700}.login-view h1{font-size:clamp(38px,7vw,60px);line-height:1.12;letter-spacing:-.06em;margin:34px 0 15px}.intro{color:var(--muted);font-size:17px}.login-card{margin-top:42px;padding:24px;border:1px solid var(--line);border-radius:19px;background:#fff;box-shadow:0 14px 45px rgba(30,58,100,.07)}label{display:block;font-weight:700;font-size:14px;margin-bottom:9px}.password-field{display:flex;border:1px solid #b9c6d9;border-radius:11px;overflow:hidden}.password-field:focus-within{border-color:#3766a5;box-shadow:0 0 0 3px #ddecff}input{flex:1;border:0;outline:0;padding:14px;font:inherit;font-size:16px;min-width:0}.password-field button{border:0;background:#fff;padding:0 14px;color:#62738e;cursor:pointer}.primary,.course-link{border:0;border-radius:11px;background:var(--ink);color:#fff;font:700 15px inherit;cursor:pointer;text-decoration:none}.primary{width:100%;padding:15px;margin-top:6px;display:flex;justify-content:space-between}.primary:disabled{opacity:.65}.error{min-height:20px;color:#bd304b;font-size:13px;margin:10px 0}.hint{font-size:12px;color:#8995a9;margin-top:20px;text-align:center}.portal-view{max-width:1120px;margin:auto;padding:30px 28px 70px}header{display:flex;align-items:center;justify-content:space-between}.wordmark{font-weight:800;font-size:17px;letter-spacing:-.05em;color:var(--ink);text-decoration:none}.wordmark em{font-style:normal;color:#486286}.logout{border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);padding:8px 13px;font:700 13px inherit;cursor:pointer}.hero{padding:92px 0 46px}.hero h1{margin:13px 0;font-size:clamp(32px,5vw,54px);letter-spacing:-.06em;line-height:1.1}.hero p:last-child{color:var(--muted);font-size:16px}.course-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:20px}.course-card{min-height:340px;border-radius:20px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;background:#fff;border:1px solid var(--line);overflow:hidden}.course-card.sky{background:linear-gradient(140deg,#fff 15%,#e9f7ff)}.course-top{display:flex;justify-content:space-between;align-items:center}.course-icon{font-size:34px}.status{font:700 11px "DM Mono",monospace;background:var(--lime);padding:6px 8px;border-radius:999px}.course-card h2{font-size:28px;letter-spacing:-.05em;margin:8px 0}.course-card p:not(.course-eyebrow){font-size:14px;line-height:1.7;color:#52627e}.course-link{padding:13px 15px;display:flex;justify-content:space-between}.course-link:hover,.primary:hover{background:#1f3b69}@media(max-width:520px){.login-view{padding-top:54px}.hero{padding:60px 0 34px}.portal-view{padding:24px 20px 55px}}
