/* A calm study space: warm paper, clear actions, expressive accents.
   Color is decorative/supporting; state is always also expressed in text. */
.study-summary { margin-top:28px; border:1px solid #d8cdeb; border-radius:24px; background:#fffdf9; overflow:hidden; }
.study-summary > summary { display:flex; align-items:center; gap:18px; padding:26px; cursor:pointer; list-style:none; background:#f1ebfa; }
.study-summary > summary::-webkit-details-marker { display:none; }
.study-summary > summary strong,.study-summary > summary small { display:block; }
.study-summary > summary strong { font-size:1.2rem; color:#372950; }
.study-summary > summary small { margin-top:6px; color:#62546f; font-size:.85rem; line-height:1.6; }
.summary-toggle { margin-left:auto; font-size:1.65rem; color:#5740bf; }
.summary-toggle::after { content:'+'; }.study-summary[open] .summary-toggle::after { content:'−'; }
.summary-body { padding:clamp(20px,4vw,40px); color:var(--ink-2); line-height:1.8; }
.summary-body h2,.summary-body h3 { color:var(--ink); line-height:1.35; }
.summary-idea { max-width:760px; margin-bottom:25px; }.summary-idea h2 { font-size:clamp(1.6rem,3vw,2.15rem); letter-spacing:-.035em; margin:8px 0 14px; }.summary-idea > p:last-child { font-size:1.02rem; }
.relation-board { padding:26px; border:1px solid #ddd2ed; border-radius:21px; background:#f7f3fc; }
.relation-sentence { margin:0 0 25px; font-size:clamp(1.2rem,2.5vw,1.6rem); color:var(--ink); text-align:center; }
.summary-body mark { background:#e6daf8; color:#43266e; padding:2px 5px; border-radius:5px; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.relation-map { display:grid; grid-template-columns:minmax(0,1fr) minmax(110px,.8fr) minmax(0,1fr); align-items:center; gap:12px; }
.relation-map > div { background:white; border:1px solid #dcd2eb; padding:18px; border-radius:15px; text-align:center; }.relation-map > div:last-child { background:#edf4e4; border-color:#d3dfc5; }
.relation-map small { display:block; color:#645477; font-size:.74rem; line-height:1.5; margin-bottom:7px; }.relation-map strong { color:#38284e; font-size:1.14rem; line-height:1.5; }.relation-map > div:last-child small,.relation-map > div:last-child strong { color:#36522d; }
.relation-bridge { text-align:center; color:#6b547f; font-size:.78rem; line-height:1.5; }.relation-bridge > span { display:block; font-size:1.85rem; line-height:1.1; margin-bottom:7px; }.relation-caption { margin:22px 0 0; font-size:.92rem; }
.summary-section { margin-top:34px; }.summary-section > h3 { display:flex; align-items:center; gap:13px; font-size:1.14rem; margin:0 0 20px; }.summary-section > h3 > span { display:grid; place-items:center; flex-shrink:0; width:34px; height:34px; background:#efe8f8; border-radius:11px; color:#63448b; font-size:.73rem; }
.summary-steps { padding:0; list-style:none; counter-reset:summary-step; display:grid; gap:13px; }.summary-steps li { counter-increment:summary-step; display:flex; align-items:baseline; gap:13px; padding:15px 18px; border:1px solid var(--line); border-radius:13px; background:white; font-size:.92rem; }.summary-steps li::before { content:counter(summary-step); color:#5740bf; font-weight:750; flex-shrink:0; }
.summary-examples { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:15px; }.summary-example { background:#fff; border:1px solid var(--line); padding:22px; border-radius:17px; }.summary-example > small { color:var(--muted); font-size:.7rem; text-transform:uppercase; letter-spacing:.07em; }.summary-example > p:first-of-type { font-size:1.16rem; line-height:1.7; color:var(--ink); padding-bottom:17px; border-bottom:1px solid var(--line); margin:12px 0 16px; }.summary-example > p:last-child { font-size:.88rem; margin:0; }
.summary-section-intro { font-size:.88rem; margin:-7px 0 18px; color:var(--muted); }.summary-contrast .example-tile { background:#f3edf9; padding:23px; border:0; }.summary-contrast .example-tile:nth-child(2) { background:#edf3e5; }.summary-contrast .example-tile:nth-child(2) mark { background:#dce9ca; color:#325029; }.summary-contrast .example-tile > p:last-child { font-size:.9rem; line-height:1.8; }.summary-contrast .example-sentence { font-size:1.13rem; line-height:1.8; }
.summary-care { display:flex; align-items:flex-start; gap:15px; padding:23px; margin-top:28px; background:#fff0df; border:1px solid #ebd4b9; border-radius:17px; color:#654930; }.summary-care > span { flex-shrink:0; margin-top:4px; }.summary-care h3 { color:#654930; font-size:1rem; margin:0 0 8px; }.summary-care p { font-size:.9rem; margin:0; }
.summary-recall { margin-top:28px; border:1px solid var(--line); border-radius:18px; padding:24px; background:white; }.summary-recall h3 { font-size:1.1rem; margin:0 0 12px; }.summary-recall > p { font-size:.9rem; }.summary-recall .recall-sentence { font-size:1.13rem; color:var(--ink); }.summary-recall details { margin-top:18px; border-top:1px solid var(--line); }.summary-recall summary { cursor:pointer; padding-top:16px; font-weight:700; color:#5740bf; list-style:none; }.summary-recall summary::-webkit-details-marker { display:none; }.summary-recall summary span { float:right; }.summary-recall details p { font-size:.9rem; padding:16px 18px; background:#f5f1fb; border-radius:12px; }
.summary-takeaway { border-left:4px solid #8b72b6; padding:3px 0 3px 19px; margin:30px 0 20px; font-size:.95rem; }.summary-takeaway > h3 { margin:0 0 14px; color:#513d6e; font-size:1.05rem; }.summary-takeaway > p { margin:0 0 18px; }
.summary-context-pair { margin-top:20px; }.summary-context-pair .example-tile { background:#f3edf9; padding:20px; }.summary-context-pair .example-tile:nth-child(2) { background:#edf3e5; }.summary-context-pair .example-tile p { background:none; padding:0; border-radius:0; font-size:.9rem; line-height:1.8; }.summary-context-pair .example-tile .example-sentence { font-size:1.08rem; color:var(--ink); }.summary-context-pair .example-tile:nth-child(2) mark { background:#dce9ca; color:#325029; }
@media(max-width:650px) { .summary-context-pair { grid-template-columns:1fr; }.summary-takeaway { padding-left:14px; }.summary-context-pair .example-tile { padding:17px; } }
.summary-steps li { display:block; position:relative; padding-left:43px; }.summary-steps li::before { position:absolute; left:18px; }
.summary-checks { margin-top:32px; padding:clamp(20px,4vw,30px); border:1px solid #d9d0ea; border-radius:20px; background:#f7f3fb; }
.summary-checks > header { display:flex; gap:15px; align-items:flex-start; margin-bottom:23px; }.summary-checks > header > span { display:grid; place-items:center; flex-shrink:0; width:42px; height:42px; border-radius:13px; color:#55408a; background:#e7def6; font-size:1.4rem; }.summary-checks .eyebrow { margin:0 0 3px; }.summary-checks h3 { margin:0 0 6px; font-size:1.25rem; }.summary-checks > header p:last-child { margin:0; font-size:.86rem; color:var(--muted); line-height:1.6; }
.summary-check-card { margin-top:14px; border:1px solid #ded8e7; border-radius:17px; padding:22px; background:white; }.summary-check-card[hidden] { display:none; }.summary-check-count { margin:0 0 10px; color:#735d8e; font-size:.73rem; font-weight:750; text-transform:uppercase; letter-spacing:.05em; }.summary-check-sentence { margin:0 0 13px; font-family:Georgia,serif; font-size:1.2rem; color:var(--ink); line-height:1.6; }.summary-check-prompt { margin:0 0 13px; font-size:.86rem; font-weight:700; }.summary-check-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.summary-check-options button { min-height:48px; padding:9px 12px; border:1px solid #d5cbe6; border-radius:12px; background:#fbf9fe; color:var(--ink); font-weight:650; line-height:1.35; cursor:pointer; }.summary-check-options button:not(:disabled):hover { background:#ebe3f9; }.summary-check-options button.is-correct { background:#e8f4df; border-color:#90ad77; }.summary-check-options button.is-incorrect { background:#fff0e7; border-color:#d89b7d; }.summary-check-options button:disabled { cursor:default; opacity:1; }
.summary-check-feedback { margin-top:16px; padding:17px; border-radius:13px; background:#edf6e7; border-left:4px solid #8bad70; font-size:.88rem; }.summary-check-feedback.is-incorrect { background:#fff2e8; border-left-color:#d89871; }.summary-check-feedback[hidden],.summary-check-finish[hidden] { display:none; }.summary-check-feedback strong { display:block; margin-bottom:6px; }.summary-check-feedback p { margin:0; line-height:1.65; }.summary-check-feedback .summary-check-answer { margin-top:8px; font-weight:700; }.summary-check-finish { margin:18px 0 0; color:#426238; font-weight:700; font-size:.86rem; }
.summary-check-finish { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:17px; border-radius:13px; background:#ecf5e5; }.summary-check-finish p { margin:0; line-height:1.5; }.summary-check-finish .button { flex-shrink:0; }
@media(max-width:650px) { .summary-checks { padding:19px 15px; }.summary-check-card { padding:18px 15px; }.summary-check-options { grid-template-columns:1fr; }.summary-checks > header { gap:11px; }.summary-checks > header > span { width:34px; height:34px; }.summary-checks h3 { font-size:1.1rem; } }
@media(max-width:650px) { .summary-check-finish { display:block; }.summary-check-finish .button { margin-top:12px; width:100%; } }
.nominal-contrast { background:#f4edf9; border:1px solid #dbcee9; }.nominal-contrast h4 { color:#553677; }.nominal-contrast .nominal-link { font-size:.82rem; color:#6b557e; }.nominal-link strong { display:inline-block; background:#fff; border:1px solid #dfd3ed; padding:2px 9px; border-radius:7px; color:#4f356f; }
@media(max-width:650px) { .study-summary > summary { padding:20px 17px; gap:12px; }.study-summary > summary .path-icon { width:35px; height:35px; flex-shrink:0; }.study-summary > summary strong { font-size:1.03rem; }.study-summary > summary small { font-size:.77rem; }.relation-board { padding:20px 16px; }.relation-map { grid-template-columns:1fr; gap:11px; }.relation-map > div { padding:14px; }.relation-bridge { display:flex; gap:10px; align-items:center; justify-content:center; }.relation-bridge > span { transform:rotate(90deg); margin:0; }.summary-contrast .example-pair { grid-template-columns:1fr; }.summary-section > h3 { font-size:1.05rem; align-items:flex-start; }.summary-care,.summary-recall,.summary-example { padding:20px; }.summary-body { font-size:.94rem; } }
:root { --ink:#24223c; --ink-2:#42405b; --canvas:#f8f7f3; --paper:#fff; --blue:#5740bf; --blue-2:#41308e; --mint:#d5f594; --orange:#ef9c7a; --line:#e5e3eb; --muted:#666176; --shadow:0 8px 24px #25213906; }
body { background:var(--canvas); letter-spacing:-.012em; }
button { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible { outline:3px solid #664dd0; outline-offset:4px; }
button:disabled { transform:none!important; }
.topbar { background:#fffdf9; color:var(--ink); border-bottom:1px solid var(--line); min-height:84px; padding-inline:max(24px,calc((100vw - 1200px)/2)); gap:24px; }
.brand { font-size:.96rem; letter-spacing:-.035em; }
.brand-mark { background:transparent; border:0; border-radius:0; flex-shrink:0; width:46px; height:46px; }
.brand-mark img { display:block; width:100%; height:100%; object-fit:contain; }
.guide-reference { margin:48px 0; }
.guide-section-head { display:flex; gap:17px; align-items:flex-start; margin-bottom:24px; }
.guide-section-icon { display:grid; place-items:center; width:48px; height:48px; flex-shrink:0; border-radius:15px; background:#e9e3fb; color:#5740bf; font-size:1.25rem; font-weight:750; }
.guide-section-icon.contrast-icon { background:#ffe8d8; color:#86532f; font-size:1.8rem; }
.guide-section-head .eyebrow { margin:0 0 8px; }
.guide-section-head h2 { font-size:clamp(1.35rem,2.5vw,1.9rem); letter-spacing:-.035em; margin:0 0 10px; line-height:1.2; }
.guide-section-head p:last-child { margin:0; font-size:.9rem; color:var(--muted); line-height:1.6; }
.glossary-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.glossary-card { background:white; padding:27px; border:1px solid var(--line); border-radius:22px; }
.glossary-card h3 { margin:0 0 9px; font-size:1.18rem; }
.glossary-card > p { color:var(--muted); line-height:1.65; font-size:.9rem; margin:0 0 18px; }
.guide-example { background:#f2eef9; color:var(--ink); padding:18px 20px; border-radius:13px; font-family:Georgia,serif; font-size:1.2rem; line-height:1.6; }
.guide-example mark { background:#dfd2f5; color:#45287b; border-radius:4px; padding:1px 4px; }
.example-link { display:block; color:#85729c; font-family:system-ui,sans-serif; line-height:1.2; margin:7px 0; }
.glossary-card > .guide-caption { font-size:.8rem; margin:14px 0 0; }
.word-roles { display:grid; gap:13px; margin:18px 0 0; }.word-roles div { border-left:3px solid #c4b1e7; padding-left:12px; }.word-roles dt { font-weight:700; font-size:.75rem; color:#584192; }.word-roles dd { margin:5px 0 0; font-size:.84rem; color:var(--muted); line-height:1.65; }
.guide-contrasts { display:grid; gap:22px; }
.guide-contrast { padding:28px; border:1px solid var(--line); border-radius:24px; background:white; }
.guide-contrast > h3 { margin:0; font-size:1.14rem; line-height:1.5; }.guide-contrast > h3 > span { color:var(--muted); font-weight:400; margin:0 4px; }
.contrast-question { color:var(--muted); font-size:.86rem; margin:9px 0 20px; line-height:1.65; }
.contrast-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.contrast-pair > section { background:#f5f1fb; border-radius:17px; padding:23px; }
.contrast-pair > section:nth-child(2) { background:#f2f5eb; }
.contrast-pair h4 { margin:0 0 15px; color:#584192; font-size:.78rem; }
.contrast-pair > section:nth-child(2) h4 { color:#476b36; }
.contrast-pair .guide-example { background:#ffffffb0; font-size:1.1rem; padding:15px; margin:0 0 15px; }
.contrast-pair > section:nth-child(2) mark { background:#dbe9c7; color:#34542c; }
.contrast-pair section > p:last-child { font-size:.87rem; line-height:1.75; margin:0; color:var(--ink-2); }
.guide-reminder { display:flex; gap:12px; align-items:flex-start; color:var(--muted); font-size:.84rem; line-height:1.75; margin:22px 4px; }.guide-reminder .icon { flex-shrink:0; width:20px; margin-top:3px; }
@media(max-width:650px) { .glossary-grid,.contrast-pair { grid-template-columns:1fr; }.glossary-card,.guide-contrast { padding:21px; }.guide-section-head { gap:13px; }.guide-section-icon { width:39px; height:39px; border-radius:12px; }.contrast-pair > section { padding:18px; }.guide-reference { margin:36px 0; } }
.method-head .method-intro { max-width:none; }
.worked-example > .method-instruction { padding:0; border:0; background:none; font-size:.9rem; color:var(--muted); }
.method-steps { display:grid; gap:12px; margin-top:22px; }
.method-step { border:1px solid var(--line); background:#faf8fd; border-radius:16px; overflow:hidden; }
.method-step summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 22px; cursor:pointer; list-style:none; }
.method-step summary::-webkit-details-marker { display:none; }
.method-step summary strong { line-height:1.5; }
.method-step summary:focus-visible { outline:3px solid var(--blue); outline-offset:-4px; border-radius:16px; }
.reveal-cue { flex-shrink:0; color:var(--blue); font-size:.78rem; }
.reveal-cue::after { content:'Conferir +'; }
.method-step[open] .reveal-cue::after { content:'Ocultar −'; }
.method-step[open] summary { background:#eee8fa; }
.method-answer { padding:4px 22px 14px; background:white; }
.method-answer p { line-height:1.75; margin:14px 0; }
@media(max-width:580px) { .method-step summary { gap:12px; padding:17px; }.method-step summary strong { font-size:.9rem; }.reveal-cue { font-size:.7rem; }.method-answer { padding-inline:17px; } }
.nav { background:#eeedf2; gap:3px; border-radius:14px; padding:5px; }
.nav button { color:#666176; padding:11px 15px; }
.nav button.is-active { background:#fff; color:var(--ink); box-shadow:0 2px 6px #24223c0a; }
.account-button,.account-button.is-signed-in { background:white; color:var(--ink-2); border-color:var(--line); border-radius:50px; font-weight:650; }
.account-button:hover { background:#efedf7; }
.countdown { gap:5px; }
.countdown strong { color:var(--blue); }
.countdown span { color:var(--muted); font-size:.78rem; }
.app-shell { max-width:1200px; padding:40px 28px 90px; }
.eyebrow { font-size:.7rem; letter-spacing:.13em; color:#6b617f; }
.button { border-radius:14px; font-weight:750; min-height:48px; padding:13px 20px; }
.button.secondary { background:#eee9fb; color:#503698; }
.button.ghost { background:white; }
.card { border-color:var(--line); border-radius:24px; box-shadow:var(--shadow); }
.home-welcome { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:26px; }
.home-welcome h1 { font-size:1.2rem; margin:0; font-weight:650; letter-spacing:-.03em; }
.exam-pill { display:flex; align-items:center; gap:8px; color:var(--muted); white-space:nowrap; font-size:.8rem; }
.exam-pill .icon { width:17px; height:17px; }
.study-hero { position:relative; display:grid; grid-template-columns:1.35fr 1fr; min-height:440px; background:#e9e3fb; border-radius:30px; overflow:hidden; padding:44px 48px; gap:20px; }
.hero-copy { position:relative; z-index:1; }
.hero-kicker { display:flex; align-items:center; gap:8px; margin:0 0 23px; font-size:.8rem; font-weight:700; color:#5a478a; }
.hero-kicker > span { width:7px; height:7px; border-radius:50%; background:#695393; }
.hero-copy h2 { font-size:clamp(2.3rem,4.5vw,3.75rem); line-height:1.06; letter-spacing:-.065em; font-weight:800; margin:0 0 20px; }
.hero-description { max-width:415px; line-height:1.65; color:#5b5074; margin:0 0 25px; font-size:.95rem; }
.hero-duration { padding:0; border:0; margin:0 0 23px; min-width:0; }
.hero-duration legend { font-size:.8rem; font-weight:700; margin-bottom:10px; }
.duration-options { display:flex; gap:8px; }
.duration-options button { display:grid; gap:3px; min-width:76px; border:1px solid #cec5e7; background:#ffffff66; color:#605478; border-radius:13px; padding:10px 12px; transition:background .15s; }
.duration-options strong { font-size:1rem; }
.duration-options strong small { font-size:.75rem; font-weight:500; }
.duration-options button > span { font-size:.66rem; }
.duration-options .is-active { background:var(--ink); border-color:var(--ink); color:#fff; }
.hero-start { display:flex; justify-content:space-between; gap:28px; align-items:center; min-width:300px; background:var(--ink); color:#fff; box-shadow:0 5px 0 #c6bddb; }
.hero-start:hover { background:#39304f; }
.hero-start > span { font-size:1.5rem; line-height:1; color:var(--mint); }
.hero-footnote { font-size:.74rem; color:#655b7d; margin:15px 0 0; }
.study-art { min-height:300px; position:relative; align-self:center; }
.art-orbit { width:290px; height:290px; border:1px dashed #b9aed8; border-radius:50%; position:absolute; top:8px; left:20px; transform:rotate(-15deg); }
.art-note { position:absolute; width:190px; height:230px; border-radius:19px; padding:25px; box-shadow:0 14px 25px #47326e12; }
.note-back { top:6px; left:16px; background:#fffaf0; transform:rotate(-13deg); color:#918283; font-size:.9rem; }
.note-back i { display:block; width:80%; height:6px; margin-top:16px; background:#e9decf; border-radius:4px; }
.note-back i:last-child { width:55%; }
.note-front { top:40px; left:103px; transform:rotate(10deg); background:#d5f594; color:#343e25; display:flex; flex-direction:column; align-items:center; }
.note-front > span { font-size:1.45rem; font-weight:800; letter-spacing:-.06em; }
.note-front svg { width:105px; height:105px; margin:8px 0 3px; }
.note-front small { font-size:.65rem; }
.art-sticker { position:absolute; top:232px; left:18px; border-radius:10px; padding:13px 18px; background:#ffc9ad; transform:rotate(-7deg); font-size:.82rem; font-weight:750; line-height:1.35; color:#613b32; }
.art-spark { position:absolute; color:#594773; font-size:2rem; }
.spark-one { top:-25px; left:240px; }.spark-two { top:236px; left:302px; font-size:1.35rem; }
.focus-strip { display:flex; align-items:center; flex-wrap:wrap; gap:14px; margin:22px 2px 35px; }
.focus-strip > span { font-size:.77rem; color:var(--muted); }
.focus-strip > div { display:flex; flex-wrap:wrap; gap:8px; }
.focus-strip button { background:transparent; border:1px solid #e0dde7; color:var(--ink-2); border-radius:50px; padding:9px 13px; display:flex; align-items:center; gap:12px; font-size:.75rem; }
.focus-strip button:hover { background:white; border-color:#b3a4d4; }
.section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:15px; margin-bottom:16px; }
.section-heading h2 { font-size:1.05rem; margin:0; letter-spacing:-.025em; }.section-heading p { margin:0; color:var(--muted); font-size:.8rem; }
.explore-section { margin-top:30px; }
.explore-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.explore-card { display:grid; grid-template-columns:48px 1fr 28px; align-items:center; gap:16px; text-align:left; border:1px solid #e2e0da; border-radius:21px; background:#fff; padding:25px; color:var(--ink); transition:transform .15s,border-color .15s; }
.explore-card:hover,.subject-tile:hover,.subject-path:hover { transform:translateY(-3px); border-color:#b3a4d4; }
.path-icon { width:46px; height:46px; display:grid; place-items:center; border-radius:14px; background:#eee9fb; color:#584192; flex-shrink:0; }
.path-icon .icon { width:23px; height:23px; }
.explore-challenge .path-icon { background:#ffe8d8; color:#86532f; }
.explore-card strong { display:block; font-size:1rem; margin-bottom:6px; }.explore-card small { display:block; font-size:.78rem; line-height:1.5; color:var(--muted); }.path-arrow { font-size:1.4rem; }
.home-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:18px; border-top:1px solid var(--line); margin-top:30px; padding-top:20px; font-size:.78rem; color:var(--muted); }
.quiet-link { border:0; padding:0; background:none; color:var(--ink-2); font-size:.8rem; text-decoration:underline; text-underline-offset:5px; }
.milestones summary { cursor:pointer; }.milestones ol { list-style:none; padding:0; line-height:1.6; }.milestones li { margin:16px 0; }.milestones strong,.milestones li span { display:block; }
.new-page-head h1,.map-head h1,.method-head h1,.lesson-head h1,.challenge-footnote h2 { font-family:inherit; letter-spacing:-.055em; font-weight:800; line-height:1.1; }
.new-page-head h1 { font-size:clamp(2.3rem,5vw,3.8rem); }.new-page-head p:last-child { max-width:510px; line-height:1.65; }
.subject-groups { margin-top:38px; display:grid; gap:34px; }
.subject-group-head { display:flex; justify-content:space-between; align-items:baseline; gap:20px; margin-bottom:14px; }
.subject-group-head h2 { font-size:1rem; margin:0; }.subject-group-head p { font-size:.78rem; color:var(--muted); margin:0; }
.subject-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.tone-peach .subject-grid { grid-template-columns:repeat(2,1fr); }
.tone-violet { --tone-bg:#eee7fc; --tone-ink:#674697; }.tone-peach { --tone-bg:#ffeadc; --tone-ink:#8b4e2e; }.tone-mint { --tone-bg:#e3f0d7; --tone-ink:#476b36; }
.subject-tile { position:relative; display:flex; align-items:flex-start; gap:16px; text-align:left; background:white; border:1px solid var(--line); border-radius:21px; padding:23px 20px; color:var(--ink); transition:transform .15s,border-color .15s; }
.subject-symbol { display:grid; place-items:center; width:45px; height:45px; border-radius:13px; flex-shrink:0; background:var(--tone-bg); color:var(--tone-ink); font-size:1.45rem; font-weight:700; }
.subject-tile-copy { display:grid; gap:8px; min-width:0; }.subject-tile-copy > strong { font-size:.96rem; line-height:1.3; padding-right:13px; }.subject-tile-copy > span { font-size:.77rem; color:var(--muted); line-height:1.55; }.subject-status { font-size:.66rem; margin-top:6px; color:#7a7287; }.subject-status.secure { color:#316341; }
.tile-arrow { position:absolute; right:16px; top:22px; color:var(--tone-ink); }
.subtle-note { color:var(--muted); font-size:.77rem; line-height:1.6; margin:32px 0 0; }
.subject-detail { max-width:850px; margin:auto; }.subject-detail-head { display:flex; align-items:center; gap:24px; margin:30px 0; }.subject-detail-head > .subject-symbol { width:80px; height:80px; font-size:2.5rem; border-radius:24px; transform:rotate(-5deg); }.subject-detail-head h1 { font-size:clamp(2rem,4vw,3.2rem); letter-spacing:-.055em; margin:0 0 10px; }.subject-detail-head p:last-child { margin:0; line-height:1.6; color:var(--muted); }
.subject-paths { display:grid; gap:14px; }.subject-path { display:flex; align-items:center; gap:22px; text-align:left; border:1px solid var(--line); border-radius:22px; padding:26px; background:white; color:var(--ink); transition:transform .15s,border-color .15s; }.subject-path.main-path { background:var(--tone-bg); border-color:transparent; }.subject-path > span:nth-child(2) { flex:1; display:grid; gap:7px; }.subject-path strong { font-size:1.18rem; letter-spacing:-.025em; }.subject-path small { font-size:.7rem; color:var(--tone-ink); font-weight:700; }.subject-path span span { font-size:.88rem; color:var(--ink-2); line-height:1.6; }.subject-path em { color:var(--muted); font-size:.73rem; font-style:normal; }.subject-path b { font-size:1.5rem; font-weight:500; }.subject-path.main-path .path-icon { background:#ffffffaa; color:var(--tone-ink); }
.lesson-head { display:block; }.lesson-head h1 { font-size:clamp(2rem,4.5vw,3.3rem); }.lesson-head > div > p:last-child { font-size:.88rem; }.lesson-steps { gap:8px; }.lesson-steps button { border:1px solid var(--line); background:transparent; font-size:.82rem; }.lesson-steps button[aria-current] { background:var(--blue); border-color:var(--blue); }.lesson-steps button[aria-current] span { background:white; color:var(--blue); }.lesson-page { padding:clamp(22px,4vw,36px); }.lesson-page > h2 { font-size:1.5rem; letter-spacing:-.035em; }.lesson-takeaway { background:#edf5e7; border-left-color:#739250; }.lesson-details > summary { background:#f1edf7; border-radius:14px; font-size:.88rem; }
.session-shell { max-width:900px; }.session-top { margin-bottom:22px; }.progress-track { background:#e6e1ef; height:7px; }.progress-track > span { background:var(--blue); }.progress-copy { font-size:.78rem; color:var(--muted); }.exercise { padding:clamp(24px,4.5vw,42px); }.exercise-head h1 { font-family:inherit; font-size:clamp(1.6rem,3.5vw,2.4rem); line-height:1.2; letter-spacing:-.045em; }.sentence-card { background:#f2eef9; border-radius:20px; border:0; padding:26px 30px; }.sentence-card p { color:var(--ink); font-size:clamp(1.4rem,3vw,2rem); line-height:1.5; }.sentence-card mark { color:#503193; border-bottom:3px solid #ae91df; background:none; }.answer { border-radius:14px; border-color:#e3dfea; min-height:58px; font-weight:650; }.answer:hover:not(:disabled) { background:#f4f0fc; border-color:#a18cce; }.answer.selected { background:#eee8fa; border-color:#7453b4; color:#462b78; }.answer.correct { background:#e8f3de; border-color:#77915f; color:#34542c; }.answer.wrong { background:#faebe7; border-color:#c98572; color:#7c4133; }.support-zone { margin-top:28px; padding-top:23px; }.support-action { background:#f0edf5; color:#5a4877; border-radius:12px; min-height:42px; font-size:.8rem; }.support-action.primary { background:#eae3f9; color:#50388b; }.help-intro { color:var(--muted); font-size:.82rem; }.confidence-panel { background:#f7f4ec; border-radius:16px; }.confidence button { background:white; border-color:#e6dfd0; border-radius:12px; }.feedback { border-radius:20px; padding:24px; }.feedback.good { background:#f0f6e9; border-color:#d0dfbe; }.feedback.retry { background:#fbf4e9; border-color:#ebdbc2; }.answer-verdict { border-radius:14px; }.teaching-card { border-radius:16px; }.term { background:#eee7f7; color:#4c367c; }.reasoning-steps li::before { background:#e8e0f5; color:#5c408d; }.example-tile { border-radius:14px; }.reflection { background:#fffaf2; }
.challenge-grid { gap:18px; }.challenge-card { border:1px solid #ddd5eb; background:#eee8fa; border-radius:24px; padding:29px; }.challenge-card:nth-child(2) { background:#ffeadc; border-color:#ead8c9; }.challenge-card:nth-child(3) { background:#e6efda; border-color:#d4dfc5; }.challenge-card h2 { font-size:1.45rem; letter-spacing:-.035em; }.challenge-card .eyebrow { min-height:28px; font-size:.65rem; }.challenge-card .button { background:#fff; color:var(--ink); }.challenge-card .button:hover:not(:disabled) { background:var(--ink); color:white; }.challenge-card > p:not(.eyebrow) { font-size:.88rem; }.challenge-setup { border:0; background:#eeece6; padding:23px; }.challenge-setup p { font-size:.82rem; }.challenge-footnote { font-size:.88rem; }.challenge-footnote h2 { font-size:1.2rem; }.map-head h1,.method-head h1 { font-size:clamp(2.3rem,5vw,3.7rem); }.map-head p,.method-head p { max-width:680px; line-height:1.65; color:var(--muted); }
.worked-example { border:1px solid var(--line); margin-bottom:20px; padding:28px; }.worked-example h2 { font-size:1.2rem; letter-spacing:-.03em; }.worked-example > p { color:var(--ink-2); line-height:1.8; }.completion { max-width:800px; margin:auto; padding:40px; }.completion h1,.onboarding-card h1,.auth-card h2 { font-family:inherit; letter-spacing:-.05em; font-weight:800; }.completion-badge { background:#e6efda; color:#476b36; }.result-grid > div { background:#f4f1f8; border-radius:16px; }.result-grid strong { color:var(--blue); }.review-summary { background:#eee8fa; }.review-question { box-shadow:none; }.onboarding-card { background:#fffdf9; }.onboarding-number { background:#e9e3fa; color:var(--blue); }.onboarding-topics span { background:#f2edf8; }.auth-dialog { border-radius:28px; }.auth-card { background:#fffdf9; }.auth-card .eyebrow { color:var(--blue); }.auth-card input { background:white; border-radius:12px; }
@media(min-width:1101px) and (max-width:1250px) { .topbar { gap:12px; padding-inline:24px; }.nav button { padding-inline:11px; }.countdown span { display:none; } }
@media(max-width:1100px) { .topbar { padding-inline:28px; }.study-hero { padding:36px; grid-template-columns:1.4fr 1fr; }.study-art { transform:scale(.85); transform-origin:center; }.subject-grid { grid-template-columns:repeat(2,1fr); } }
@media(max-width:880px) { .nav { background:#fffdf9; border:1px solid var(--line); box-shadow:0 6px 28px #24223c1a; width:calc(100% - 28px); max-width:530px; border-radius:18px; bottom:12px; padding:6px; }.nav button { flex:1; font-size:.78rem; padding:12px 8px; color:#625c70; }.nav button.is-active { background:var(--ink); color:#fff; }.study-hero { grid-template-columns:1fr; }.study-art { position:absolute; right:-70px; top:40px; width:320px; opacity:.5; transform:scale(.7); pointer-events:none; }.hero-copy { max-width:540px; }.hero-description { max-width:340px; }.hero-copy h2 { font-size:2.85rem; }.hero-duration { max-width:370px; }.explore-card { padding:22px; grid-template-columns:40px 1fr 18px; gap:13px; }.path-icon { width:40px; height:40px; }.subject-group-head { display:block; }.subject-group-head p { margin-top:6px; }.exam-pill { display:none; } }
@media(max-width:580px) { .topbar { min-height:70px; padding:0 18px; }.brand > span:last-child { display:block; font-size:.85rem; max-width:95px; }.topbar-actions { gap:10px; }.account-button { padding:8px 10px; font-size:.72rem; }.countdown strong { font-size:.88rem; }.app-shell { padding:27px 18px 115px; }.home-welcome { margin-bottom:20px; }.home-welcome h1 { font-size:1.02rem; }.study-hero { padding:28px 24px; border-radius:25px; min-height:0; }.hero-copy h2 { font-size:2.3rem; letter-spacing:-.06em; }.hero-kicker { font-size:.72rem; margin-bottom:20px; }.hero-description { font-size:.86rem; max-width:100%; }.study-art { display:none; }.hero-duration legend { font-size:.76rem; }.duration-options { gap:6px; }.duration-options button { min-width:0; flex:1; padding:10px 7px; }.hero-start { min-width:0; width:100%; font-size:.83rem; gap:12px; padding-inline:15px; }.hero-footnote { font-size:.68rem; }.focus-strip { gap:10px; margin-bottom:27px; }.focus-strip button { font-size:.7rem; }.section-heading { display:block; }.section-heading h2 { font-size:1rem; }.section-heading p { margin-top:7px; }.explore-grid { grid-template-columns:1fr; gap:12px; }.explore-card strong { font-size:.93rem; }.explore-card small { font-size:.75rem; }.home-bottom { gap:24px; }.subject-grid { grid-template-columns:1fr; gap:10px; }.subject-tile { padding:21px; border-radius:18px; }.subject-tile-copy > strong { font-size:1rem; }.subject-tile-copy > span { font-size:.8rem; }.subject-groups { gap:28px; margin-top:30px; }.subject-detail-head { align-items:flex-start; gap:16px; }.subject-detail-head > .subject-symbol { width:54px; height:54px; font-size:1.8rem; border-radius:17px; }.subject-detail-head h1 { font-size:2rem; }.subject-detail-head p:last-child { font-size:.85rem; }.subject-path { padding:22px 18px; gap:14px; align-items:flex-start; }.subject-path strong { font-size:1.05rem; }.subject-path span span { font-size:.8rem; }.subject-path b { font-size:1.2rem; }.lesson-steps button { padding:12px; }.lesson-page { padding:23px 20px; }.lesson-page > h2 { font-size:1.25rem; }.lesson-intro { font-size:.96rem; }.sentence-card { padding:22px; }.sentence-card p { font-size:1.4rem; }.exercise { padding:24px 20px; }.exercise-head h1 { font-size:1.65rem; }.support-actions { gap:7px; }.support-action { font-size:.76rem; }.feedback { padding:18px 14px; }.source { line-height:1.6; }.source a { margin-left:0; }.challenge-card { padding:25px; }.challenge-card .eyebrow { min-height:0; }.completion { padding:29px 22px; }.worked-example { padding:24px; }.new-page-head h1,.map-head h1,.method-head h1 { font-size:2.4rem; }.nav button { padding:12px 6px; font-size:.72rem; }.onboarding-card { padding:26px 23px; } }
@media(max-width:580px) { .tone-peach .subject-grid { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { .explore-card:hover,.subject-tile:hover,.subject-path:hover { transform:none; } }