@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root { color-scheme:light; font-family:Manrope,Arial,sans-serif; color:#182a4b; background:#f7f9fc; font-synthesis:none; }
* { box-sizing:border-box; } body { margin:0; } button,select { font:inherit; } button { cursor:pointer; } a { color:inherit; }
.site-header { background:#fff; border-bottom:1px solid #e1e8f2; }.header-inner { max-width:1120px; margin:auto; height:76px; padding:0 32px; display:flex; align-items:center; gap:25px; }.brand { display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:800; font-size:19px; letter-spacing:-.05em; }.brand-symbol { display:grid; place-items:center; width:35px; height:35px; border-radius:10px; background:#2557cc; color:#fff; font-size:20px; }.header-note { color:#8492aa; font-size:13px; border-left:1px solid #dce4f0; padding-left:25px; }.github { margin-left:auto; color:#60728d; font-size:13px; text-decoration:none; }
.workspace { max-width:970px; padding:54px 32px 60px; margin:auto; }.page-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:42px; }.kicker { color:#315fbb !important; font-weight:700; font-size:13px !important; margin:0 0 9px !important; } h1 { font-size:clamp(26px,4vw,38px); line-height:1.2; letter-spacing:-.045em; margin:0; }.page-heading p { color:#71809a; font-size:14px; margin:11px 0 0; }.review-count { display:flex; align-items:baseline; gap:8px; white-space:nowrap; color:#74839b; font-size:12px; }.review-count strong { color:#2557cc; font-size:25px; }
.toolbar { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:16px; }.toolbar label { display:grid; gap:8px; color:#677893; font-weight:700; font-size:12px; }.toolbar select { min-width:220px; border:1px solid #dbe4f1; border-radius:8px; padding:11px 36px 11px 13px; color:#243b60; background:#fff; }.position { display:flex; gap:12px; align-items:center; color:#74839b; font-size:12px; }.progress-track { width:110px; height:6px; background:#e1e9f5; border-radius:10px; overflow:hidden; }.progress-track div { height:100%; background:#3569dc; }
.study-card { background:#fff; border:1px solid #dce5f2; border-radius:14px; box-shadow:0 12px 30px rgba(30,65,125,.045); padding:27px 34px 22px; }.card-top,.card-bottom { display:flex; justify-content:space-between; align-items:center; color:#8291a8; font-size:12px; }.card-top span:first-child { color:#4268a8; font-weight:700; }.card-content { min-height:300px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:38px 0; }.prompt-label { margin:0 0 17px; color:#7788a2; font-size:13px; }.card-content h2 { max-width:690px; font-size:clamp(24px,3.5vw,34px); line-height:1.4; letter-spacing:-.035em; font-weight:700; margin:0 0 30px; }.blank { color:#2c5dcc; white-space:nowrap; }.primary { background:#2458ce; border:1px solid #2458ce; border-radius:8px; color:white; padding:13px 24px; font-weight:700; font-size:13px; }.primary:hover { background:#1948b3; }.card-bottom { border-top:1px solid #edf1f7; padding-top:18px; }.text-button { border:0; background:none; color:#315fbb; font-weight:700; font-size:13px; padding:5px 0; }.text-button span { margin-right:7px; }.answer { max-width:620px; margin:-5px auto 23px; color:#4a607f; font-size:14px; line-height:1.6; }.answer span { color:#315fbb; font-size:12px; font-weight:700; }.answer p { margin:5px 0; }.answer #card-back { color:#182a4b; font-size:20px; font-weight:700; }.answer[hidden],.ratings[hidden] { display:none; }
.ratings { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-top:16px; padding:17px 20px; background:#eaf0fb; border-radius:10px; font-size:13px; font-weight:700; }.ratings div { display:flex; flex-wrap:wrap; gap:8px; }.ratings button,.card-navigation button { border:1px solid #d7e2f1; background:#fff; color:#34547e; border-radius:7px; padding:9px 15px; font-size:12px; font-weight:700; }.ratings button:hover,.card-navigation button:hover { border-color:#6389dc; color:#2458ce; }.card-navigation { display:flex; justify-content:space-between; align-items:center; margin-top:20px; }.card-navigation span { color:#9ba9ba; font-size:12px; }.card-navigation button:disabled { opacity:.4; cursor:default; }.privacy-note { text-align:center; color:#91a0b3; font-size:12px; margin-top:42px; }.privacy-note a { color:#5376b2; margin-left:4px; }
:focus-visible { outline:3px solid #8caef4; outline-offset:3px; }
.brand-symbol { background:transparent; object-fit:contain; border-radius:0; }
@media(max-width:600px) { .header-inner { height:64px; padding:0 20px; }.header-note { display:none; }.workspace { padding:36px 18px; }.page-heading { align-items:start; margin-bottom:30px; }.review-count { display:grid; gap:0; text-align:right; }.review-count span { max-width:75px; }.toolbar select { min-width:0; max-width:190px; }.progress-track { width:52px; }.study-card { padding:22px 20px 18px; }.card-content { min-height:290px; }.ratings { align-items:start; flex-direction:column; }.ratings div { width:100%; }.ratings button { flex:1; padding:9px 7px; }.keyboard-hint { display:none; } }