:root {
  --bg: #e7e5de;
  --panel: #f0efeb;
  --white: #ffffff;
  --border: #cfcac1;
  --text: #232323;
  --muted: #666b73;
  --tab-blue: #4539d7;
  --tab-green: #3f9345;
  --cyan: #aed2df;
  --warn: #f2d2b7;
  --button-border: #666666;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, Helvetica, sans-serif; color: var(--text); }
.desktop-body { background: #d9d7cf; }
.desktop-window { width: min(1180px, calc(100vw - 24px)); margin: 10px auto; background: #e8e6df; border: 1px solid #cbc6ba; box-shadow: 0 8px 24px rgba(0,0,0,.08); }
.desktop-titlebar { height: 28px; display: flex; align-items: center; padding: 0 12px; font-size: 14px; color: #545454; background: #efede8; border-bottom: 1px solid #d7d2c8; }
.desktop-shell { display: grid; grid-template-columns: 300px 1fr; gap: 14px; padding: 12px; min-height: 760px; }
.left-panel { background: #f5f4f1; border: 1px solid #d9d6cf; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 34px 18px 20px; }
.hero-wrap { width: 100%; display: flex; justify-content: center; }
.hero-image { width: 240px; max-width: 100%; height: auto; display: block; }
.course-mark { text-align: center; color: #1d33ff; font-size: 21px; font-weight: 700; line-height: 1.15; }
.copyright { width: 100%; text-align: left; font-size: 18px; font-weight: 700; color: #151515; line-height: 1.15; }
.main-panel { display: flex; flex-direction: column; }
.top-tabs { display: flex; gap: 18px; padding: 8px 14px 0; }
.tab-pill { min-width: 320px; height: 34px; border-radius: 18px; border: 2px solid #6d6bf6; color: #6d6bf6; background: #faf9ff; font-weight: 700; font-size: 15px; }
.tab-pill.active { background: var(--tab-blue); color: #fff; border-color: #2418a8; box-shadow: inset 0 -2px 0 rgba(0,0,0,.15); }
.tab-pill.green { border-color: #71ac74; color: #4d9b51; }
.tab-pill.green.active { background: var(--tab-green); color: #fff; border-color: #2a6f31; }
.tab-screen { display: none; }
.tab-screen.active { display: block; }
.desktop-card { background: #efefec; border: 1px solid #ddd8cf; margin: 8px 6px 0; padding: 16px 18px; min-height: 662px; }
.ab-top-grid {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) 280px minmax(210px, 1fr);
  gap: 12px 16px;
  align-items: center;
}
.field-label { font-size: 16px; }
.desktop-field { height: 30px; width: 100%; border: 1px solid #c9c5be; background: #f9f8f6; padding: 5px 10px; font-size: 16px; }
.desktop-field[type="number"] { text-align: center; }
.desktop-field.readonly { display: flex; align-items: center; color: #565656; overflow: hidden; white-space: nowrap; }
.field-button { height: 32px; border: 1px solid #6c6c6c; background: #f8f8f5; font-size: 15px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; color: #1e1e1e; text-decoration: none; }
.field-button[disabled] { cursor: default; opacity: .75; }
.field-button.cyan { background: #abd0dd; }
.desktop-check { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; }
.desktop-check.inline { margin-right: 20px; }
.align-left { justify-self: start; }
.section-divider { border-top: 1px solid #c7c1b7; margin: 16px 0 12px; }
.section-divider.with-space { margin-top: 26px; }
.section-title, .c-section-title { text-align: center; font-size: 20px; font-weight: 700; margin-bottom: 12px; }
.ab-bottom-grid {
  display: grid;
  grid-template-columns: minmax(170px, 1fr) 280px minmax(210px, 1fr);
  grid-template-rows: repeat(9, 33px);
  gap: 6px 16px;
  align-items: center;
  justify-items: stretch;
}
.button-stack {
  display: grid;
  grid-column: 2;
  grid-row: 1 / span 9;
  grid-template-rows: subgrid;
  gap: 6px;
  justify-items: center;
  width: 280px;
}
.action-btn { width: 280px; height: 33px; border: 1px solid var(--button-border); background: #f8f8f6; font-size: 16px; cursor: pointer; }
.action-btn.highlight { background: var(--cyan); }
.action-btn.warn { background: var(--warn); }
.action-btn.muted-btn { width: 190px; background: #f4f4f4; }
.action-btn[disabled], .action-btn.disabled-soft { color: #8d8d8d; background: #f2f2f2; cursor: default; }
.ab-option { align-self: center; }
.ab-option-left { grid-column: 1; justify-self: end; }
.ab-option-right { grid-column: 3; justify-self: start; }
.ab-option-nodes { grid-row: 5; }
.ab-option-mts { grid-row: 7; }
.ab-option-mnv { grid-row: 7; }
.diagram-checks { display: flex; gap: 18px; align-items: center; }
.status-strip { margin-top: 18px; border: 1px solid #d1ccc2; background: #f7f5ef; padding: 10px 14px; font-size: 14px; line-height: 1.4; }
.status-strip.info { background: #edf4ff; border-color: #cddcf7; }
.status-strip.success { background: #edf9ef; border-color: #cde8d1; }
.status-strip.warn { background: #fff4dd; border-color: #ead7a3; }
.status-strip.error { background: #fdecea; border-color: #e8c0ba; }
.status-strip.subtle { background: #f8f8f4; border-color: #d8d5cc; }
.c-card { min-height: 662px; }
.c-description { font-size: 17px; line-height: 1.25; margin-bottom: 18px; }
.c-panel-grid { display: grid; grid-template-columns: 260px 1fr; gap: 26px; align-items: start; }
.c-form-side { display: grid; gap: 12px; }
.c-row { display: grid; grid-template-columns: 110px 90px; gap: 16px; align-items: center; font-size: 16px; }
.small-field { width: 90px; height: 28px; border: 1px solid #c8c4bc; background: #f8f8f6; padding: 4px 8px; font-size: 16px; }
.select-field { width: 90px; }
.c-result-box { min-height: 112px; border: 2px solid #585858; background: #fff; padding: 14px 16px; font-size: 18px; line-height: 1.6; font-weight: 700; }
.c-button-row { display: flex; gap: 12px; margin-top: 18px; }
.empty-slot { height: 1px; }

.viewer-body { background: #ece9e0; }
.viewer-shell, .plot-shell { width: min(1240px, calc(100vw - 32px)); margin: 16px auto; background: #f7f5ef; border: 1px solid #d0cbc1; padding: 18px 20px 24px; }
.viewer-header { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; margin-bottom: 18px; }
.viewer-header h1 { margin: 0 0 6px; font-size: 28px; }
.viewer-header p { margin: 0; color: #55606d; }
.viewer-download { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: 0 14px; border: 1px solid #5f656f; background: #fff; color: #1a2430; text-decoration: none; font-weight: 700; }
.viewer-note-stack { display: grid; gap: 8px; margin-bottom: 16px; }
.viewer-note { padding: 10px 12px; border: 1px solid #d6dbe4; background: #f9fbff; color: #405065; }
.viewer-summary-card { border: 1px solid #d6d0c6; background: #fff; padding: 16px; margin-bottom: 18px; }
.viewer-summary-card h2 { margin: 0 0 12px; font-size: 20px; }
.summary-grid { display: grid; grid-template-columns: 240px 1fr; gap: 8px 14px; margin: 0; }
.summary-grid dt { font-weight: 700; }
.summary-grid dd { margin: 0; }
.artifact-line-stack { display: grid; gap: 10px; }
.plot-viewer-frame { border: 1px solid #d4d8df; background: #fff; padding: 14px; overflow: auto; }
.plot-viewer-frame img { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.viewer-sections { display: grid; gap: 16px; }
.sheet-card { border: 1px solid #cfd4dc; border-radius: 10px; background: #fff; overflow: hidden; box-shadow: 0 2px 10px rgba(15,23,42,.04); }
.sheet-card.excel-sheet-fill .sheet-head { color: #0b0c0f; text-shadow: 0 1px 0 rgba(255,255,255,.35); box-shadow: inset 0 -1px 0 rgba(0,0,0,.12); }
.sheet-card.theme-forces .sheet-head{background:linear-gradient(180deg,#d9eef8,#eef8fd)}
.sheet-card.theme-member-forces .sheet-head{background:linear-gradient(180deg,#efe7ff,#f8f4ff)}
.sheet-card.theme-geometry .sheet-head{background:linear-gradient(180deg,#e7f5ea,#f4fbf5)}
.sheet-card.theme-matrix .sheet-head{background:linear-gradient(180deg,#fff4d8,#fffaf0)}
.sheet-card.theme-graph .sheet-head{background:linear-gradient(180deg,#ffe5ef,#fff5f8)}
.sheet-card.theme-generic .sheet-head{background:linear-gradient(180deg,#eef2f7,#f8fafc)}
.sheet-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; padding: 14px 16px; border-bottom: 1px solid #d9dde5; }
.sheet-name { font-weight: 800; font-size: 17px; margin-bottom: 6px; }
.sheet-chip { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.7); border: 1px solid rgba(15,23,42,.08); font-size: 12px; font-weight: 700; color: #334155; }
.sheet-meta { font-size: 12px; font-weight: 700; color: #475569; white-space: nowrap; padding-top: 3px; }
.sheet-note { padding: 10px 16px 0; color: #526071; font-size: 13px; }
.block-card { margin: 14px 16px 16px; border: 1px solid #dde3ea; border-radius: 9px; background: #fcfdff; overflow: hidden; }
.block-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; padding: 10px 12px; border-bottom: 1px solid #e5eaf0; background: #f8fafc; }
.block-head.excel-title-fill, .block-head.excel-header-fill { color: #0b0c0f; text-shadow: 0 1px 0 rgba(255,255,255,.35); box-shadow: inset 0 -1px 0 rgba(0,0,0,.12); }
.block-head.excel-title-fill { border-left: 6px solid rgba(0,0,0,.22); }
.block-head.excel-header-fill { border-left: 6px solid rgba(0,0,0,.16); }
.block-title { font-weight: 800; color: #1f2937; }
.block-meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.block-chip { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px; background: #eef2ff; color: #4338ca; font-size: 11px; font-weight: 800; }
.block-dims { font-size: 11px; font-weight: 700; color: #64748b; }
.table-wrap { overflow: auto; }
.result-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.result-table thead th { position: sticky; top: 0; z-index: 1; background: #f6f8fb; border-bottom: 1px solid #dbe2ea; padding: 9px 10px; text-align: left; white-space: nowrap; }
.result-table td { padding: 8px 10px; border-bottom: 1px solid #edf1f5; vertical-align: top; }
.result-table tbody tr.alt-row td { background: #fbfcfe; }
.empty-table { padding: 12px; color: #667085; }
.table-title-band { text-align: center; font-weight: 700; letter-spacing: .01em; padding: .8rem 1rem; border-bottom: 1px solid rgba(15,23,42,.08); background: linear-gradient(180deg,#edf3fa,#f8fbff); }
.merged-title-band { min-height: 48px; display: flex; align-items: center; justify-content: center; }
.align-center { text-align: center !important; }
.align-right { text-align: right !important; }
.result-table th.spacer-col, .result-table td.spacer-col { min-width: 22px; width: 22px; padding-left: .25rem; padding-right: .25rem; background-image: linear-gradient(90deg, rgba(148,163,184,0.07), rgba(148,163,184,0.03)); }
@media (max-width: 1100px) {
  .desktop-shell { grid-template-columns: 1fr; }
  .left-panel { min-height: 280px; }
  .top-tabs { flex-direction: column; }
  .tab-pill { width: 100%; min-width: 0; }
  .ab-top-grid, .c-panel-grid { grid-template-columns: 1fr; }
  .ab-bottom-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    justify-items: start;
  }
  .button-stack {
    grid-column: 1;
    grid-row: auto;
    grid-template-rows: none;
  }
  .ab-option,
  .ab-option-left,
  .ab-option-right,
  .ab-option-nodes,
  .ab-option-mts,
  .ab-option-mnv {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
  }
  .diagram-checks { flex-wrap: wrap; }
  .c-button-row { flex-wrap: wrap; }
  .viewer-header { flex-direction: column; }
}