/* PC 3.1 web OCR board. Presentation only; shared workspace remains authoritative. */
:root { --math-base: 1.75rem; }
:root[data-theme=nordisk-ritning] { --divider: #D3DEE1; }
:root[data-theme=precision] { --line: #738C95; }
:root[data-theme=arbetsblad] { --divider: #8e877a; }
:root[data-theme=verkstad] { --divider: #778790; }
:root[data-equalib-web=true][data-theme=precision] {
  color-scheme: dark; --bg:#10191e; --surface:#18252c; --ink:#f0f4f3;
  --muted:#b2c1c5; --line:#738C95; --divider:#3e5059; --accent:#a8dfd1;
  --accent-ink:#102c27; --hover:#233740; --inactive:#1E2830; --input:#18252c; --danger:#ffb4b4;
}
:root[data-equalib-web=true][data-theme=nordisk-ritning] {
  color-scheme:light; --bg:#F3F6F7; --surface:#FFFFFF; --ink:#17282D;
  --muted:#51646B; --line:#667E85; --divider:#D3DEE1; --accent:#176B60;
  --accent-ink:#FFFFFF; --hover:#E4EFED; --inactive:#E9EDEF; --input:#FFFFFF; --danger:#AD3434;
}
:root[data-equalib-web=true][data-theme=arbetsblad] {
  color-scheme:light; --bg:#eee9de; --surface:#fffdf8; --ink:#302f28;
  --muted:#68645a; --line:#315e50; --divider:#8e877a; --accent:#315e50;
  --accent-ink:#fffdf8; --hover:#e8e4d9; --inactive:#e8e4d9; --input:#fffdf8; --danger:#a12626;
}
:root[data-equalib-web=true][data-theme=verkstad] {
  color-scheme:dark; --bg:#14181b; --surface:#1e252a; --ink:#eff2f4;
  --muted:#b9c3c9; --line:#778790; --divider:#778790; --accent:#edcd90;
  --accent-ink:#31230d; --hover:#303a41; --inactive:#303a41; --input:#14181b; --danger:#ffb4b4;
}
html[data-equalib-web=true] .webSourceEditor, html[data-equalib-web=true] .webImageTools { margin-block: 16px; }
.webSourceEditor summary, .webImageTools summary { min-height:48px; cursor:pointer; align-content:center; color:var(--accent); }
.webSourceEditor .eqinput { margin-top:12px; }
.webImageTools .imageTools { margin-top:12px; }
html[data-equalib-web=true] .imageCanvasWrap { min-height:240px; }
html[data-equalib-web=true] .imageEditor { background:var(--surface); border-color:var(--divider); }
html[data-equalib-web=true] .formulaCard .mathpreview { background:var(--surface); border:1px solid var(--divider); }
html[data-equalib-web=true] .mathpreview mjx-container { margin-inline:auto; }
html[data-equalib-web=true] :is(.mathpreview,.miniMath,.resultMath,.candidateMath,
.targetChip,#inputs label,.expression,#cloudLibrary .libraryItem .mathpreview) { font-size: var(--math-base); }
html[data-equalib-web=true] :is(#inputs label .math,.targetChip .math,.usedValues .math) { font-size:var(--math-base); }
html[data-equalib-web=true] .usedValues dd { font-size:var(--math-base); }
html[data-equalib-web=true] :is(.mathpreview,.miniMath,.resultMath,.expression,.candidateMath) {
  overflow-x: auto;
  overflow-y: hidden;
  max-width: 100%;
}
html[data-equalib-web=true] :is(.mathpreview,.miniMath,.resultMath,.expression,
.targetChip,#inputs label) mjx-container { font-size: 100% !important; }
html[data-equalib-web=true] :is(.mathpreview,.resultMath,.expression,
.candidateMath):focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
@media (min-width: 1080px) {
  html:not([data-equalib-native=true]) main {
    max-width: 1440px; display: block; padding: 32px 40px 56px;
  }
  html:not([data-equalib-native=true]) .appHeader {
    padding-bottom: 24px; border-bottom: 1px solid var(--divider);
  }
  html:not([data-equalib-native=true]) .appNav {
    display: flex; gap: 16px; padding: 8px 0 0;
    border-bottom: 1px solid var(--divider); margin-bottom: 24px;
  }
  html:not([data-equalib-native=true]) .appNav button {
    flex: 0 1 auto; min-width: 160px; text-align: center;
    border-radius: 0; padding: 16px 24px;
  }
  html:not([data-equalib-native=true]) .steps { max-width: 720px; margin: 24px 0; }
  html:not([data-equalib-native=true]) #formulaStep {
    display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: 24px; align-items: start;
  }
  html:not([data-equalib-native=true]) #formulaStep > .captureCard { order: 0; }
  html:not([data-equalib-native=true]) #formulaStep > .formulaCard { order: 1; }
  html:not([data-equalib-native=true]) #formulaStep > #ocrReviewCard { order: 2; }
  html:not([data-equalib-native=true]) #formulaStep:not(:has(.captureCard:not(.hidden))) > .formulaCard { grid-column: 1 / -1; }
  html:not([data-equalib-native=true]) #formulaStep > .card { margin-top: 0; }
  html:not([data-equalib-native=true]) .formulaCard .mathpreview { min-height: 240px; }
  html:not([data-equalib-native=true]) .captureCard .preview { height: 240px; max-height: 240px; object-fit: contain; }
  html:not([data-equalib-native=true]) #inputs { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html:not([data-equalib-native=true]) #setupCard,
  html:not([data-equalib-native=true]) #resultCard { max-width: 100%; }
}