.flat-shapes-page .math-workspace-bar { padding:12px 0; gap:12px; }
.flat-shapes-page .math-workspace-bar > strong { font-size:clamp(1.1rem,2vw,1.4rem); }
.flat-shapes-page .math-workspace-links { gap:8px; }
.flat-shapes-page .math-workspace-links a,.flat-shapes-page .math-workspace-links button { display:inline-flex; align-items:center; min-height:40px; padding:8px 12px; border:1px solid var(--line); border-radius:8px; background:var(--paper); color:var(--ink); font:700 .85rem/1.3 Arial,Helvetica,sans-serif; text-decoration:none; }
.flat-shapes-page .math-frame-shell { background:transparent; box-shadow:none; border:0; }
.le-math-embed--flat-shapes { --fs-accent:#167c73; --fs-fill:#e8f6f3; padding:0; font-family:Arial,Helvetica,sans-serif; }
.le-math-embed--flat-shapes .quiz-wrapper { all:unset; display:block; height:100%; color:var(--le-ink); font-family:Arial,Helvetica,sans-serif; }
.le-math-embed--flat-shapes .quiz-container { width:100%; max-width:1100px; height:100%; margin:0 auto; padding:24px; overflow:auto; display:block; border:1px solid var(--le-line)!important; border-radius:8px!important; background:var(--le-paper)!important; box-shadow:0 10px 24px #1d2a380a!important; overscroll-behavior:contain; }
.le-math-embed--flat-shapes :is(#fs-heading,#questionList) .fs-eyebrow { font-size:.72rem; line-height:1.4; font-weight:800; text-transform:uppercase; color:var(--fs-accent)!important; margin:0 0 6px; text-align:left; }
.le-math-embed--flat-shapes .fs-heading h1 { font-size:clamp(1.3rem,3vw,1.8rem); line-height:1.2; margin:0 0 12px; color:var(--le-ink); }
.le-math-embed--flat-shapes .fs-intro { color:var(--le-muted)!important; text-align:left; font-size:.95rem; line-height:1.6; margin:0 0 24px; }
.le-math-embed--flat-shapes .quiz-container.is-playing .fs-heading { display:none; }
.le-math-embed--flat-shapes .level-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:0; overflow:visible; }
/* ID scope outranks the legacy shared primary-button rule, including its
   :is(#startButton) specificity; the picker must use the current theme. */
.le-math-embed--flat-shapes #levelButtons button { display:grid; grid-template-columns:64px minmax(0,1fr); grid-template-rows:auto auto; align-content:center; align-items:center; gap:6px 18px; min-height:128px; padding:20px; border:1px solid var(--le-line)!important; border-radius:8px!important; background:var(--le-paper)!important; color:var(--le-ink)!important; text-align:left; font-family:Arial,Helvetica,sans-serif; box-shadow:none; }
.le-math-embed--flat-shapes #levelButtons button:hover { border-color:var(--fs-accent)!important; background:var(--le-soft)!important; }
.le-math-embed--flat-shapes #levelButtons button:active { background:var(--fs-fill)!important; }
.le-math-embed--flat-shapes #levelButtons button:focus-visible { outline:3px solid var(--fs-accent)!important; outline-offset:3px; }
.le-math-embed--flat-shapes #levelButtons button:last-child { grid-column:1/-1; }
.le-math-embed--flat-shapes #levelButtons .fs-option-icon { grid-column:1; grid-row:1/-1; display:grid; place-items:center; width:64px; height:64px; border-radius:12px; background:var(--fs-fill); color:var(--fs-accent); }
.le-math-embed--flat-shapes #levelButtons .fs-option-icon svg { width:44px; height:44px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linejoin:round; }
.le-math-embed--flat-shapes #levelButtons .fs-option-title { grid-column:2; grid-row:1; color:var(--le-ink)!important; font-size:1.15rem; line-height:1.35; font-weight:800; white-space:normal; }
.le-math-embed--flat-shapes #levelButtons small { grid-column:2; grid-row:2; color:var(--le-muted)!important; font-size:1rem; font-weight:400; line-height:1.5; white-space:normal; }
.le-math-embed--flat-shapes #quizContent { display:block; }
.le-math-embed--flat-shapes .fs-progress-heading { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-bottom:10px; }
.le-math-embed--flat-shapes .fs-progress-heading > span { font-size:.85rem; color:var(--le-muted); }
.le-math-embed--flat-shapes .progress-info { margin:0; gap:8px; justify-content:flex-start; }
.le-math-embed--flat-shapes .progress-info span { padding:6px 10px; border:1px solid var(--le-line); border-radius:999px; color:var(--le-muted); font-size:.8rem; }
.le-math-embed--flat-shapes .progress-container { margin:0 0 20px; height:6px; border:0; background:var(--le-soft); }
.le-math-embed--flat-shapes .progress-bar { height:6px; line-height:6px; }
.le-math-embed--flat-shapes #quizForm { display:block; }
.le-math-embed--flat-shapes .fs-workspace { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(260px,.8fr); gap:24px; align-items:start; }
.le-math-embed--flat-shapes #questionList { overflow:visible; list-style:none; padding:0; margin:0; }
.le-math-embed--flat-shapes #questionList > li.highlight { display:block; padding:0; margin:0; background:transparent!important; border:0; }
.le-math-embed--flat-shapes .fs-task-title { margin:0 0 6px; color:var(--le-ink); font-size:clamp(1.5rem,3vw,2rem); line-height:1.2; }
.le-math-embed--flat-shapes .fs-task-instruction { margin:0 0 16px; font-size:.95rem; line-height:1.55; color:var(--le-muted)!important; text-align:left; }
.le-math-embed--flat-shapes .fs-diagram-card { display:block; width:100%; border:1px solid var(--le-line); border-radius:8px; padding:12px; background:var(--le-soft); cursor:zoom-in; }
.le-math-embed--flat-shapes .fs-diagram { display:block; width:100%; max-width:650px; height:auto; margin:auto; overflow:visible; }
.fs-polygon { fill:var(--fs-fill); stroke:var(--fs-accent); stroke-width:3; stroke-linejoin:round; }
.fs-height { stroke:var(--fs-accent); stroke-width:2; stroke-dasharray:6 5; }
.fs-dimension { stroke:var(--le-muted); stroke-width:1.5; }
.fs-right-angle { fill:none; stroke:var(--fs-accent); stroke-width:2; }
.fs-diagram-label { fill:var(--le-ink); font:italic 26px Georgia,serif; paint-order:stroke; stroke:var(--le-soft); stroke-width:5px; stroke-linejoin:round; }
.le-math-embed--flat-shapes .fs-givens { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.le-math-embed--flat-shapes .fs-given { padding:8px 12px; border:1px solid var(--le-line); border-radius:8px; background:var(--le-paper); font-size:1rem; line-height:1.3; color:var(--le-ink); }
.le-math-embed--flat-shapes .fs-given strong { color:var(--fs-accent); font-style:italic; }
.le-math-embed--flat-shapes .fs-diagram-note { margin:12px 0 0; color:var(--le-muted)!important; font-size:.8rem; text-align:left; line-height:1.5; }
.le-math-embed--flat-shapes .fs-expand { min-height:44px; padding:8px 12px; margin-top:14px; border:1px solid var(--le-line); border-radius:8px; color:var(--le-ink); background:var(--le-paper); font:700 .85rem/1.3 Arial,Helvetica,sans-serif; cursor:pointer; }
.le-math-embed--flat-shapes .fs-answer { margin-top:36px; padding:24px; border:1px solid var(--le-line); border-radius:8px; background:var(--le-soft); }
.le-math-embed--flat-shapes .fs-answer label { display:block; font-size:1.15rem; font-weight:800; margin:0 0 8px; color:var(--le-ink); }
.le-math-embed--flat-shapes .fs-answer-help { margin:0 0 16px; color:var(--le-muted)!important; font-size:.85rem; line-height:1.55; text-align:left; }
.le-math-embed--flat-shapes .input-group { justify-content:flex-start; gap:12px; flex-wrap:nowrap; }
.le-math-embed--flat-shapes #q1 { width:100%; min-width:0; min-height:52px; font-size:1.25rem!important; padding:12px; background:var(--le-paper)!important; }
.le-math-embed--flat-shapes #q1:disabled { opacity:1; }
.le-math-embed--flat-shapes #fs-unit { flex-shrink:0; color:var(--le-muted); font-size:1rem; }
.le-math-embed--flat-shapes .buttons { display:grid; grid-template-columns:minmax(0,1fr); justify-content:stretch; gap:8px; margin-top:16px; }
.le-math-embed--flat-shapes .buttons button { min-height:46px; width:100%; padding:10px 14px; font-size:.9rem; }
.le-math-embed--flat-shapes .buttons #nextQuestionBtn { background:var(--le-coral)!important; color:#20242a!important; border:1px solid var(--le-coral-dark)!important; border-radius:8px!important; }
.le-math-embed--flat-shapes .buttons #fs-reset { background:var(--le-paper)!important; color:var(--le-ink)!important; border:1px solid var(--le-line)!important; border-radius:8px!important; }
.le-math-embed--flat-shapes #result1 { display:block; text-align:left; line-height:1.55; font-size:.9rem; margin:16px 0 0; }
.le-math-embed--flat-shapes #result1:empty { display:none; }
.le-math-embed--flat-shapes .fs-answer:has(.result.correct) { border-color:var(--fs-accent); }
.le-math-embed--flat-shapes .fs-answer:has(.result.incorrect) { border-color:var(--le-error); }
.le-math-embed--flat-shapes #result { font-size:.95rem; padding:12px 0; text-align:left; }
.le-math-embed--flat-shapes .modal { background:#142536a8; padding:12px; }
.le-math-embed--flat-shapes .modal-content { width:min(760px,100%); max-width:none; max-height:calc(100dvh - 24px); gap:12px; padding:20px; border:1px solid var(--le-line); border-radius:8px; background:var(--le-paper); }
.le-math-embed--flat-shapes .fs-modal-tools { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; width:100%; }
.le-math-embed--flat-shapes .modal-content button { min-height:44px; padding:8px 12px; border:1px solid var(--le-line); border-radius:8px; background:var(--le-paper); color:var(--le-ink); font:700 .85rem/1.3 Arial,Helvetica,sans-serif; }
.le-math-embed--flat-shapes .zoom-buttons { gap:8px; align-items:center; }
.le-math-embed--flat-shapes .close-button { position:static; }
.le-math-embed--flat-shapes .fs-modal-stage { width:100%; max-height:65dvh; overflow:auto; background:var(--le-soft); border-radius:8px; border:1px solid var(--le-line); }
.le-math-embed--flat-shapes .fs-modal-art { width:100%; }
.le-math-embed--flat-shapes .fs-modal-art .fs-diagram { max-width:none; }
html[data-theme=dark] .le-math-embed--flat-shapes { --fs-accent:#91e0d0; --fs-fill:#244b48; }
@media(max-width:700px) {
  .le-math-embed--flat-shapes .quiz-container { padding:16px; }
  .le-math-embed--flat-shapes .fs-workspace { grid-template-columns:minmax(0,1fr); gap:16px; }
  .le-math-embed--flat-shapes .fs-answer { margin:0; padding:16px; }
  .le-math-embed--flat-shapes .fs-diagram-card { padding:4px; }
  .le-math-embed--flat-shapes .fs-diagram-card .fs-diagram { height:180px; }
  .le-math-embed--flat-shapes .level-buttons { grid-template-columns:minmax(0,1fr); gap:10px; }
  .le-math-embed--flat-shapes #levelButtons button { grid-template-columns:52px minmax(0,1fr); min-height:116px; padding:16px; gap:6px 14px; }
  .le-math-embed--flat-shapes #levelButtons .fs-option-icon { width:52px; height:52px; }
  .le-math-embed--flat-shapes #levelButtons .fs-option-icon svg { width:36px; height:36px; }
  .le-math-embed--flat-shapes .fs-given { padding:7px 10px; }
  .flat-shapes-page .math-workspace-bar { padding:6px 0; }
  .flat-shapes-page .math-workspace-bar { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 10px; }
  .flat-shapes-page .math-workspace-bar > strong { grid-column:1; grid-row:1; }
  .flat-shapes-page .math-workspace-bar > .exercise-utility-tools { grid-column:2; grid-row:1; }
  .flat-shapes-page .math-workspace-links { grid-column:1/-1; grid-row:2; }
  .flat-shapes-page .math-workspace-links a,.flat-shapes-page .math-workspace-links button { padding:6px 8px; font-size:.75rem; }
}