body:has(.eg-shell) { padding-bottom:0; }
body:has(.eg-shell) .view-container { max-width:none; padding:12px 26px 16px; }
body:has(.eg-shell) .mobile-nav { display:none; }
body:has(.eg-shell) .main-shell { min-width:0; padding-bottom:0; }
.eg-shell { --eg-ink:#2e3a31; --eg-muted:#7a8476; --eg-line:#dce3d7; --eg-paper:#fffefa; --eg-accent:#4a7951; width:100%; flex:1; min-height:0; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--eg-line); border-radius:22px; background:var(--eg-paper); color:var(--eg-ink); }
.eg-shell * { box-sizing:border-box; }
.eg-shell h2,.eg-shell h3,.eg-shell p { margin:0; }
.eg-shell button,.eg-shell textarea { font:inherit; }
.eg-shell button { cursor:pointer; }
.eg-shell button:disabled { cursor:not-allowed; opacity:.45; }
.eg-shell button:focus-visible,.eg-shell textarea:focus-visible,.eg-shell input:focus-visible,.eg-shell main:focus-visible { outline:3px solid #acbc98; outline-offset:3px; }
.eg-header { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:15px 24px; border-bottom:1px solid var(--eg-line); flex-shrink:0; }
.eg-header>div { display:flex; gap:12px; align-items:center; min-width:0; }
.eg-header>div>div { display:flex; flex-direction:column; gap:4px; min-width:0; }
.eg-header strong { font-size:15px; line-height:1.5; }
.eg-header small { color:var(--eg-muted); font-size:11px; }
.eg-symbol { flex-shrink:0; display:grid; place-items:center; width:38px; height:38px; border-radius:12px; background:#f1e1a0; color:#796b32; font:600 20px Georgia,serif; }
.eg-shell .eg-quiet { padding:7px 2px; background:transparent; border:0; color:var(--eg-muted); font-size:12px; line-height:1.5; white-space:nowrap; }
.eg-shell .eg-quiet:hover { color:var(--eg-accent); }
.eg-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; flex-shrink:0; padding:14px 24px; background:#f7f8f2; border-bottom:1px solid var(--eg-line); }
.eg-steps button { display:flex; align-items:center; justify-content:center; gap:9px; padding:10px; border:1px solid transparent; border-radius:10px; color:var(--eg-muted); background:transparent; font-size:13px; font-weight:600; }
.eg-steps button>span { display:grid; place-items:center; width:24px; height:24px; border:1px solid var(--eg-line); border-radius:50%; font-size:10px; }
.eg-steps button[aria-current="step"] { color:var(--eg-accent); border-color:var(--eg-line); background:#fff; }
.eg-steps button[aria-current="step"]>span { color:white; background:var(--eg-accent); border-color:var(--eg-accent); }
.eg-main { flex:1; min-height:0; overflow:auto; padding:32px max(28px,calc((100% - 1040px)/2)) 38px; scrollbar-gutter:stable; }
.eg-shell .eg-eyebrow { color:var(--eg-accent); font-size:10px; font-weight:600; letter-spacing:.11em; margin-bottom:8px; }
.eg-shell h2 { font-size:25px; font-weight:650; line-height:1.5; letter-spacing:-.035em; }
.eg-shell h3 { font-size:16px; font-weight:650; line-height:1.6; }
.eg-content-heading>p:last-child { color:var(--eg-muted); font-size:12px; line-height:1.9; margin-top:10px; }
.eg-parse-board { margin-top:27px; padding:24px; border:1px solid var(--eg-line); border-radius:16px; background:#f6f8f1; }
.eg-board-label { display:flex; justify-content:space-between; gap:12px; margin-bottom:19px; color:var(--eg-muted); font-size:10px; }
.eg-board-label>span:last-child { display:flex; flex-wrap:wrap; gap:12px; font-size:9px; color:#9aa18f; }
.eg-shell .eg-english { font-family:Georgia,'Times New Roman',serif; font-size:22px; line-height:2.1; color:#314130; overflow-wrap:anywhere; }
.eg-sentence { padding-bottom:20px; }
.eg-shell .eg-word { padding:1px 3px; margin:2px -1px; border:1px solid transparent; border-radius:5px; background:transparent; font:inherit; color:inherit; text-align:left; line-height:1.5; }
.eg-shell .eg-word:hover { background:#e9eddf; }
.eg-shell .role-main { --eg-role-bg:#dbead1; --eg-role-ink:#3f6f36; background:var(--eg-role-bg); color:var(--eg-role-ink); }
.eg-shell .role-clause { --eg-role-bg:#e6e0f1; --eg-role-ink:#75609b; background:var(--eg-role-bg); color:var(--eg-role-ink); }
.eg-shell .role-modifier { --eg-role-bg:#f7eacb; --eg-role-ink:#a28736; background:var(--eg-role-bg); color:var(--eg-role-ink); }
.eg-shell .eg-word.is-selected { border-color:#819675; box-shadow:0 0 0 2px #81967535; background:#e6ecd7; }
.eg-selection-status { min-height:22px; font-size:11px; line-height:1.8; color:#879479; overflow-wrap:anywhere; }
.eg-palette { display:flex; flex-wrap:wrap; gap:10px; padding:14px 0 0; }
.eg-palette>button:not(.eg-quiet) { display:flex; align-items:center; gap:7px; padding:7px 14px; border:1px solid transparent; border-radius:8px; font-size:11px; font-weight:600; }
.eg-palette>button>span { width:6px; height:6px; border-radius:50%; background:var(--eg-role-ink); }
.eg-marks { display:flex; flex-wrap:wrap; gap:9px; border-top:1px solid #e2e7d9; margin-top:18px; padding-top:18px; }
.eg-marks>p { color:#a0a795; font-size:11px; line-height:1.8; }
.eg-marks>button { max-width:100%; display:flex; align-items:center; gap:9px; padding:7px 10px; border:0; border-radius:8px; text-align:left; }
.eg-marks>button>span { font-size:9px; white-space:nowrap; }
.eg-marks strong { font-family:Georgia,serif; font-size:13px; line-height:1.6; font-weight:400; overflow-wrap:anywhere; }
.eg-marks i { margin-left:3px; font-style:normal; font-size:14px; }
.eg-reference { margin-top:25px; padding:25px; border:1px solid var(--eg-line); border-radius:16px; background:#fff; }
.eg-auto-assessment { margin-top:22px; padding:16px 18px; border:1px solid #dce6d5; border-radius:12px; background:#f5f8f0; }
.eg-auto-assessment>div { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.eg-auto-assessment strong { color:#4a7951; font-size:12px; }
.eg-auto-assessment>div>span { color:#77856f; font-size:11px; }
.eg-auto-assessment>i { display:block; height:6px; overflow:hidden; margin-top:11px; border-radius:99px; background:#e2e9dc; }
.eg-auto-assessment>i>b { display:block; height:100%; border-radius:inherit; background:#61905a; }
.eg-auto-assessment.is-review { border-color:#eadfbd; background:#fcf8ea; }
.eg-auto-assessment.is-review strong { color:#947333; }
.eg-auto-assessment.is-review>i>b { background:#c4a246; }
.eg-auto-assessment>p { margin-top:9px; color:#71806b; font-size:11px; line-height:1.8; }
.eg-auto-assessment>p+p { margin-top:3px; }
.eg-shell .eg-analysis { font-size:13px; line-height:2; color:#667460; margin-top:14px; }
.eg-misconception { margin-top:17px; padding:14px 16px; background:#faf6e7; border-radius:10px; }
.eg-misconception>strong { color:#9a8646; font-size:10px; font-weight:600; }
.eg-misconception>p { font-size:11px; color:#8a835e; line-height:1.9; margin-top:6px; }
.eg-checks { border:0; padding:0; margin:23px 0 0; display:flex; flex-direction:column; gap:12px; }
.eg-checks>legend { color:#566d4f; font-size:11px; font-weight:600; margin-bottom:13px; }
.eg-checks label { display:flex; align-items:flex-start; gap:10px; color:#75816c; font-size:12px; line-height:1.8; cursor:pointer; }
.eg-checks input { appearance:auto; width:15px; height:15px; margin:3px 0 0; accent-color:#5f8650; flex-shrink:0; }
.eg-shell .eg-note { font-size:10px; line-height:1.85; color:#98a08e; margin-top:13px; }
.eg-feedback { min-height:20px; font-size:11px; color:#a18048; line-height:1.8; margin-top:16px !important; }
.eg-actions { display:flex; justify-content:flex-end; align-items:center; gap:16px; margin-top:12px; }
.eg-actions>.eg-quiet { margin-right:auto; }
.eg-shell .eg-primary { padding:12px 20px; min-height:44px; border:1px solid var(--eg-accent); border-radius:11px; background:var(--eg-accent); color:white; font-size:13px; font-weight:600; line-height:1.5; }
.eg-shell .eg-primary:hover { background:#3f6943; }
.eg-concept { border-top:1px solid var(--eg-line); margin-top:26px; padding-top:18px; }
.eg-concept summary,.eg-analysis-details summary { color:#849078; font-size:11px; cursor:pointer; }
.eg-concept p,.eg-analysis-details p { margin-top:12px; font-size:12px; line-height:1.9; color:#7a8671; }
.eg-foundation { margin-top:18px; padding:18px; background:#f6f8f0; border-radius:12px; }
.eg-foundation>span { color:#9ba38f; font-size:10px; }
.eg-foundation .eg-english { font-size:18px; }
.eg-prompt { margin-top:27px; padding:24px; border-radius:15px; border:1px solid var(--eg-line); background:#f3f6ed; }
.eg-prompt>span { display:block; color:#849276; font-size:10px; margin-bottom:10px; }
.eg-prompt>p { font-size:17px; line-height:1.95; color:#42553b; }
.eg-draft { margin-top:25px; }
.eg-draft>label { display:block; color:#75856c; font-size:11px; margin-bottom:10px; }
.eg-draft textarea { display:block; width:100%; min-height:145px; padding:18px; resize:vertical; border:1px solid #cdd8c2; border-radius:12px; background:white; color:#35472e; font-size:15px; line-height:1.95; }
.eg-draft textarea[lang="en"] { font-family:Georgia,'Times New Roman',serif; font-size:18px; }
.eg-draft textarea::placeholder { color:#a0a795; font-size:12px; }
.eg-shell .eg-reference-sentence { margin-top:15px; font-size:15px; line-height:2; color:#4a5f40; }
.eg-shell .eg-reference-sentence.eg-english { font-size:20px; }
.eg-analysis-details { margin-top:17px; }
.eg-complete { text-align:center; padding:20px 0; max-width:510px; margin:0 auto; }
.eg-complete-mark { display:inline-grid; place-items:center; width:58px; height:58px; border-radius:50%; background:#e6efd9; color:#598340; font-size:28px; margin-bottom:24px; }
.eg-next-card { padding:28px; border:1px solid var(--eg-line); border-radius:16px; background:#f3f6eb; margin:26px 0 16px; }
.eg-next-card>span { color:#8c9881; font-size:10px; }
.eg-next-card h3 { font-size:19px; margin:9px 0; }
.eg-next-card p { color:#819076; font-size:12px; line-height:1.9; margin-bottom:20px; }
.eg-save-warning { color:#a27638; font-size:11px; margin-top:12px !important; line-height:1.8; }
.eg-footer { display:flex; justify-content:space-between; gap:15px; flex-shrink:0; border-top:1px solid var(--eg-line); padding:12px 24px; color:#99a18e; font-size:10px; line-height:1.6; }
.eg-footer .is-error { color:#a27638; }
[data-theme="dark"] .eg-shell { --eg-ink:#e0e8da; --eg-muted:#acb59f; --eg-line:#424d3a; --eg-paper:#252d21; --eg-accent:#84a772; }
[data-theme="dark"] .eg-steps,[data-theme="dark"] .eg-parse-board,[data-theme="dark"] .eg-reference,[data-theme="dark"] .eg-prompt,[data-theme="dark"] .eg-next-card { background:#2c3726; }
[data-theme="dark"] .eg-steps button[aria-current="step"],[data-theme="dark"] .eg-draft textarea { background:#252d21; color:#dce6d3; }
[data-theme="dark"] .eg-shell .eg-english { color:#d5e1ca; }
@media (max-width:800px) {
  body:has(.eg-shell) .view-container { padding:10px 12px 16px; }
  body:has(.eg-shell) .rc-study-page { height:auto; min-height:calc(100dvh - 100px); }
  .eg-shell { overflow:visible; }
  .eg-main { padding:26px 22px 30px; overflow:visible; }
  .eg-header { padding:15px 20px; }
  .eg-steps { padding:12px 16px; gap:5px; }
  .eg-steps button { font-size:12px; padding:9px 5px; }
  .eg-board-label>span:last-child { display:none; }
  .eg-shell h2 { font-size:23px; }
  .eg-footer { flex-wrap:wrap; gap:5px; }
}
@media (max-width:480px) {
  .eg-header { padding:13px 14px; gap:9px; }
  .eg-header>div { gap:8px; }
  .eg-header strong { font-size:12px; }
  .eg-header small { font-size:9px; line-height:1.8; }
  .eg-symbol { width:30px; height:30px; border-radius:9px; font-size:17px; }
  .eg-header>.eg-quiet { font-size:10px; }
  .eg-steps { padding:10px; gap:4px; }
  .eg-steps button { flex-direction:column; gap:6px; padding:8px 3px; font-size:10px; }
  .eg-steps button>span { width:20px; height:20px; font-size:8px; }
  .eg-main { padding:22px 15px 28px; }
  .eg-shell h2 { font-size:21px; }
  .eg-shell .eg-english { font-size:20px; }
  .eg-content-heading>p:last-child { font-size:11px; }
  .eg-parse-board,.eg-prompt,.eg-reference { padding:18px 15px; }
  .eg-palette { gap:7px; }
  .eg-palette>button:not(.eg-quiet) { padding:8px 12px; font-size:10px; }
  .eg-shell .eg-primary { padding:11px 14px; font-size:12px; }
  .eg-actions { gap:8px; }
  .eg-actions .eg-quiet { font-size:10px; }
  .eg-next-card { padding:22px 18px; }
  .eg-footer { padding:12px 15px; font-size:9px; }
}
@media (prefers-reduced-motion:reduce) { .eg-shell * { scroll-behavior:auto !important; transition:none !important; } }