/* Engineering project workbench: layout and theme only. This scoped layer does
 * not change data, navigation, templates, hidden state, or feature permissions. */
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  color: var(--hw-ui-text, #20252d) !important;
  background: transparent !important;
  line-height: 1.7;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(div, main, section, article, aside, header, footer, ol, ul, li, h2, h3, h4, p, span, strong, em, button, input, textarea, select) {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-practice-page, .project-practice-home, .project-practice-detail) {
  padding: 0 !important;
  gap: 24px;
  background: transparent !important;
  color: var(--hw-ui-text) !important;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(div:not([class]), .project-home-title, .engineering-assets-overview-head, .engineering-assets-kpi-grid, .engineering-lab-hero-main, .project-loop-heading, .project-my-assistant-head, .debug-project-asset-shelf > header, .debug-project-asset-shelf > header > div) { background: transparent !important; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(h2, h3, h4, strong, b, dt, dd, label) {
  color: var(--hw-ui-text) !important;
  font-weight: 650;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(p, span, em, li, small) {
  color: var(--hw-ui-muted) !important;
  font-weight: 400;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(h2, h3, h4, p) { line-height: 1.65; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-home-title, .project-detail-header, .project-card-head) {
  gap: 16px !important;
  flex-wrap: wrap;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-title {
  align-items: flex-start !important;
  margin: 0 0 4px !important;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-title h2 {
  font-size: clamp(25px, 2.5vw, 32px) !important;
  letter-spacing: -.025em;
  line-height: 1.35;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-home-title > span, .project-home-title p, .project-section-kicker) {
  color: var(--hw-ui-muted) !important;
  font-size: 13px !important;
  text-align: left;
  letter-spacing: 0;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-today-card, .project-all-projects, .project-detail-section, .project-practice-card, .project-home-card, .project-coach-panel, .project-architecture-board, .engineering-asset-card, .project-case-grid > article, .engineering-assets-overview, .debug-project-asset-shelf, .debug-project-asset-empty, .debug-project-asset-card, .engineering-lab-hero, .project-my-assistant, .project-loop-board) {
  border: 1px solid var(--hw-ui-line) !important;
  border-radius: 14px !important;
  background: var(--hw-ui-surface) !important;
  background-image: none !important;
  color: var(--hw-ui-text) !important;
  box-shadow: none !important;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-detail-section, .project-all-projects, .project-practice-card, .project-coach-panel) { padding: 24px; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-today-panel, .project-home-loop-strip, .project-loop-step, .project-intro-diagram, .project-coach-answer, .project-case-xiaowen, .project-case-xiaowen-modes > section, .project-debug-layout > aside, .project-waveform-layout > aside, .engineering-asset-card > p, .engineering-lab-task, .project-route-step, .project-case-template-preview, .engineering-asset-kpi, .project-xiaowen-project-preview, .project-route-overview, .project-source-summary, .project-authenticity-card, .project-architecture-note, .project-source-hub, .project-coach-next) {
  border-color: var(--hw-ui-line) !important;
  border-radius: 10px !important;
  background: var(--hw-ui-hover) !important;
  background-image: none !important;
  color: var(--hw-ui-text) !important;
  box-shadow: none !important;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-section-kicker { background: transparent !important; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-debug-steps p > span, .project-context-chip-list > span) {
  color: var(--hw-ui-accent) !important;
  background: var(--hw-ui-soft) !important;
  border-color: var(--hw-ui-line) !important;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-home-loop-strip li, .project-today-meta > div, .project-intro-facts > div, .project-intro-facts > span, .project-xiaowen-architecture li, .project-intro-meta span, .project-intro-specs span, .project-summary-learned span, .project-module-row span, .project-card-head > span, .project-coach-answer em, .project-today-panel span, .project-protection-row, .project-protection-row span, .project-case-xiaowen-prompts span) {
  border-color: var(--hw-ui-line) !important;
  border-radius: 8px;
  color: var(--hw-ui-text) !important;
  background: var(--hw-ui-surface) !important;
  background-image: none !important;
  white-space: normal;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard button {
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--hw-ui-line) !important;
  border-radius: 8px !important;
  color: var(--hw-ui-text) !important;
  background: var(--hw-ui-surface) !important;
  background-image: none !important;
  font-size: 14px !important;
  font-weight: 600;
  line-height: 1.6;
  white-space: normal !important;
  box-shadow: none !important;
  text-shadow: none;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard button :is(span, strong, em, i, b) { color: inherit !important; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard button:hover:not(:disabled) { background: var(--hw-ui-hover) !important; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(button.active, .project-route-step.is-next) {
  color: var(--hw-ui-accent) !important;
  border-color: var(--hw-ui-accent) !important;
  background: var(--hw-ui-soft) !important;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard button.primary-btn {
  color: #fff !important;
  background: var(--hw-ui-primary) !important;
  border-color: var(--hw-ui-primary) !important;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard button.primary-btn:hover:not(:disabled) { background: var(--hw-ui-primary-hover) !important; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(button, a, input, textarea, select, summary):focus-visible {
  outline: 3px solid var(--hw-ui-focus, #a63a32) !important;
  outline-offset: 3px;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(input:not([type="checkbox"]), textarea, select) {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--hw-ui-line) !important;
  border-radius: 8px;
  background: var(--hw-ui-surface) !important;
  color: var(--hw-ui-text) !important;
  font: inherit;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-today-card {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  min-height: 0;
  padding: 24px;
  gap: 24px;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-today-meta {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  width: 100%;
  gap: 10px;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-today-meta > div { padding: 12px; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-today-meta strong {
  font-size: 20px;
  white-space: normal;
  line-height: 1.5;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-loop-strip { padding: 16px; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-loop-strip ol { gap: 10px; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-loop-strip li { min-height: 44px; padding: 8px; font-size: 13px; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-architecture-board {
  flex-wrap: wrap;
  gap: 10px;
  overflow-x: visible;
  padding: 16px;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-architecture-node {
  flex: 1 1 145px;
  min-width: 0;
  padding: 16px;
  color: var(--hw-ui-text) !important;
  border: 1px solid var(--hw-ui-line) !important;
  border-radius: 10px;
  background: var(--hw-ui-hover) !important;
  background-image: none !important;
  box-shadow: none !important;
}
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-architecture-arrow { flex: 0 0 16px; color: var(--hw-ui-muted) !important; }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-section-intro .project-intro-layout, .project-intro-layout, .project-debug-layout, .project-waveform-layout, .project-summary-layout) { grid-template-columns: minmax(0, 1fr) minmax(0, .6fr); }
html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-practice-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 320px); }
@media (max-width: 1200px) {
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-today-card, .project-practice-grid, .project-section-intro .project-intro-layout, .project-intro-layout, .project-debug-layout, .project-waveform-layout, .project-summary-layout) { grid-template-columns: minmax(0, 1fr); }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-today-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-loop-strip ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-case-xiaowen-modes { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-practice-page, .project-practice-home, .project-practice-detail) { gap: 18px; }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-detail-section, .project-all-projects, .project-practice-card, .project-coach-panel, .project-today-card) { padding: 18px 16px; }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-today-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-loop-strip { grid-template-columns: minmax(0, 1fr); }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-loop-strip ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-home-loop-strip li::after { content: none; }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-case-xiaowen-head, .project-route-overview, .project-xiaowen-architecture ol, .project-case-flow, .project-evidence-grid, .project-summary-metrics, .project-ability-gain) { grid-template-columns: minmax(0, 1fr); }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-card-head, .project-home-title) { align-items: flex-start !important; }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard .project-card-head > button { width: 100%; }
  html:root body .panel[data-panel="project-practice"] #projectPracticeBoard :is(.project-section-kicker, .project-card-head > span) { width: auto; }
}
