.fg-page { --fg-green: #28795d; --fg-blue: #287ca4; --fg-gold: #a66a24; --fg-rose: #b45e6e; }
.fg-heading { display: flex; align-items: center; justify-content: space-between; padding: 18px 0 12px; }
.fg-heading h1 { margin: 0; font-size: 32px; letter-spacing: 0; }
.fg-heading img { width: 86px; height: 86px; object-fit: contain; }
.fg-subjects { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); border-bottom: 1px solid #bfd4ce; margin-bottom: 24px; gap: 8px; }
.fg-subjects a { display: flex; align-items: center; gap: 8px; justify-content: center; padding: 14px 8px; text-decoration: none; color: #315a57; border-bottom: 3px solid transparent; font-size: 15px; font-weight: 700; }
.fg-subjects a[aria-current="page"] { border-color: var(--fg-green); background: #e7f3ec; }
.fg-subjects a[data-subject="language"][aria-current] { border-color: var(--fg-blue); background: #e5f2fc; }
.fg-subjects a[data-subject="science"][aria-current] { border-color: var(--fg-gold); background: #fff1d6; }
.fg-subjects a[data-subject="community"][aria-current] { border-color: var(--fg-rose); background: #fceaf0; }
.fg-subjects svg { width: 19px; height: 19px; flex-shrink: 0; }
.fg-title-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.fg-title-row h2 { font-size: 25px; margin: 0; }
.fg-filters { display: grid; grid-template-columns: minmax(160px,2fr) minmax(140px,1fr) minmax(140px,1fr); gap: 16px; padding: 18px 0; border-block: 1px solid #cfddd6; }
.fg-filters label, .fg-note label { display: grid; gap: 7px; font-size: 14px; font-weight: 600; }
.fg-filters input, .fg-filters select, .fg-note select, .fg-note textarea { width: 100%; min-width: 0; border: 1px solid #93aaa5; border-radius: 4px; padding: 11px; font: inherit; background: white; color: #203c3a; min-height: 44px; }
.fg-catalog { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 38px; }
.fg-group { min-width: 0; }
.fg-group h3 { font-size: 19px; color: var(--fg-green); margin: 14px 0 8px; }
.fg-group ol { margin: 0; padding: 0; list-style: none; }
.fg-group li { border-bottom: 1px solid #d9e4df; }
.fg-group a { display: grid; grid-template-columns: 38px minmax(0,1fr) 20px; gap: 10px; padding: 13px 4px; color: #294843; text-decoration: none; align-items: start; line-height: 1.5; }
.fg-group a:hover { background: #edf5f1; }
.fg-group a > small { color: #5c736d; padding-top: 3px; font-size: 12px; }
.fg-group a span small { display: block; font-size: 12px; color: #78602c; margin-top: 3px; }
.fg-group a svg { width: 17px; height: 17px; margin-top: 4px; }
.fg-lesson { max-width: 850px; margin: 0 auto; }
.fg-lesson h2 { font-size: 28px; line-height: 1.3; letter-spacing: 0; overflow-wrap: anywhere; }
.fg-lesson section { padding: 18px 0; border-bottom: 1px solid #d6e3dc; }
.fg-lesson h3 { font-size: 19px; margin: 0 0 10px; }
.fg-lesson p { line-height: 1.8; margin: 0 0 14px; }
.fg-lesson-art { float: right; width: 120px; height: 120px; object-fit: contain; margin: 0 0 16px 20px; }
.fg-coverage { border-left: 3px solid #b38633; background: #fff6e5; padding: 12px 16px; font-size: 14px; line-height: 1.6; margin-bottom: 20px; }
.fg-note { display: grid; gap: 16px; padding: 20px 0; }
.fg-note textarea { min-height: 110px; resize: vertical; }
.fg-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-block: 1px solid #bbd2c6; padding: 20px 0; margin: 20px 0; gap: 20px; }
.fg-metrics strong { display: block; font-size: 30px; color: var(--fg-green); }
.fg-metrics span { font-size: 14px; }
.fg-history { list-style: none; padding: 0; }
.fg-history li { border-bottom: 1px solid #d6e3dc; padding: 16px 0; }
.fg-history a { color: #176d77; font-weight: 600; }
.fg-history small, .fg-history p { display: block; line-height: 1.6; margin: 6px 0 0; }
.fg-path { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.fg-path section { border-top: 2px solid #96baaa; padding-top: 16px; }
.fg-path h3 { font-size: 20px; }
.fg-path a { display: block; padding: 8px 0; color: #176d77; line-height: 1.6; }
.fg-workshop { max-width: 800px; margin: auto; }
.fg-work-controls { display: flex; gap: 24px; justify-content: center; flex-wrap: wrap; margin: 24px 0; }
.fg-work-controls > div { display: grid; grid-template-columns: 44px 90px 44px; align-items: center; text-align: center; gap: 8px; }
.fg-work-controls button { width: 44px; height: 44px; border: 1px solid #76a795; background: white; border-radius: 4px; display: grid; place-items: center; }
.fg-work-number { text-align: center; font-size: 26px; margin: 16px 0; }
.fg-work-model { min-height: 270px; display: flex; gap: 18px; flex-wrap: wrap; padding: 20px 0; border-block: 1px solid #bcd2c8; }
.fg-tens { display: flex; gap: 10px; flex-wrap: wrap; }
.fg-rod { display: grid; grid-template-rows: repeat(10,20px); width: 20px; }
.fg-rod img, .fg-ones img { width: 20px; height: 20px; }
.fg-ones { display: flex; flex-wrap: wrap; align-items: flex-end; align-content: flex-end; gap: 4px; max-width: 100%; }
#fg-reset-dialog { max-width: min(480px,calc(100% - 32px)); padding: 24px; border: 1px solid #abc6bc; border-radius: 8px; }
#fg-reset-dialog::backdrop { background: #193b3a66; }
#fg-reset-dialog form { display: flex; gap: 12px; flex-wrap: wrap; }
.fg-page .km-big-word { font-size: 26px; line-height: 1.6; overflow-wrap: anywhere; }
.fg-page .km-equation { white-space: normal; font-size: 36px; }
.fg-page .km-practice-heading h1 { font-size: 26px; letter-spacing: 0; }
.fg-page .km-answers label > span { overflow-wrap: anywhere; font-size: 17px; }
@media(max-width:760px) {
  .fg-page .kg-toolbar > div { flex-wrap: wrap; overflow: visible; }
  .fg-subjects { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .fg-subjects a { padding: 10px 4px; font-size: 13px; flex-direction: column; text-align: center; }
  .fg-filters, .fg-catalog, .fg-path { grid-template-columns: 1fr; }
  .fg-title-row { align-items: flex-start; flex-direction: column; }
  .fg-lesson-art { width: 85px; height: 85px; }
  .fg-lesson h2 { font-size: 23px; }
  .fg-metrics { gap: 10px; }
  .fg-metrics strong { font-size: 25px; }
  .fg-page .km-equation { font-size: 28px; }
}