/* Jade studio: shared presentation layer. Business tables and forms stay planar. */
.qms-jade {
    --jade-canvas: #f6f5f0;
    --jade-surface: #ffffff;
    --jade-ink: #203c35;
    --jade-text: #344c48;
    --jade-muted: #5f736d;
    --jade-primary: #16758a;
    --jade-sage: #6c998a;
    --jade-line: #e1e8e3;
    --jade-soft: #edf5f1;
    --jade-radius: 16px;
    --jade-shadow: 0 2px 5px rgba(32,60,53,.025), 0 12px 32px rgba(32,60,53,.045);
    --jade-float: 0 6px 14px rgba(32,60,53,.065), 0 20px 42px rgba(32,60,53,.08);
    --apple-canvas: var(--jade-canvas);
    --apple-ink: var(--jade-ink);
    --apple-text: var(--jade-text);
    --apple-muted: var(--jade-muted);
    --apple-line: var(--jade-line);
    --apple-radius: var(--jade-radius);
    --qms-canvas: var(--jade-canvas);
    --qms-ink: var(--jade-ink);
    --qms-text: var(--jade-text);
    --qms-muted: var(--jade-muted);
    --qms-line: var(--jade-line);
    --qms-radius: var(--jade-radius);
    --qms-primary: var(--jade-primary);
    --qms-primary-soft: var(--jade-soft);
    --qms-shadow-1: var(--jade-shadow);
    --bg: var(--jade-canvas);
    --line: var(--jade-line);
    --text: var(--jade-ink);
    --muted: var(--jade-muted);
    background: var(--jade-canvas);
    color: var(--jade-text);
    font-family: "Microsoft YaHei", "Segoe UI", -apple-system, sans-serif;
    font-size: 14px;
    line-height: 1.6;
}
.qms-jade:not(.login-body):not(.setup-body) { background: var(--jade-canvas); }
.qms-jade *, .qms-jade *::before, .qms-jade *::after { box-sizing: border-box; }
.qms-jade .jade-icon { width: 22px; height: 22px; flex: 0 0 22px; stroke: currentColor; }
.qms-jade h1, .qms-jade h2, .qms-jade h3 { color: var(--jade-ink); letter-spacing: -.025em; }
.qms-jade h2 { font-size: 18px; line-height: 1.45; }
.qms-jade a { color: var(--jade-primary); }
.qms-jade .content { padding: 18px 24px 48px; min-width: 0; }
.qms-jade .topbar { padding: 12px 24px 4px; min-height: 64px; background: transparent; border: 0; backdrop-filter: none; }
.qms-jade .topbar h1 { font-size: 28px; font-weight: 750; margin: 0 0 3px; }
.qms-jade .topbar p { font-size: 14px; color: var(--jade-muted); }
.qms-jade :is(.panel, .metric-card, .command-kpi, .attachment-group) {
    border: 1px solid var(--jade-line);
    border-radius: var(--jade-radius);
    background: var(--jade-surface);
    box-shadow: var(--jade-shadow);
}
.qms-jade .panel { padding: 22px; margin-bottom: 20px; }
.qms-jade .panel:hover { box-shadow: var(--jade-shadow); border-color: var(--jade-line); }
.qms-jade :is(.metric-grid, .record-summary-grid, .dashboard-split, .statistics-chart-grid) { gap: 16px; }
.qms-jade .metric-card { padding: 20px; min-height: 122px; }
.qms-jade .metric-card :is(span, small) { color: var(--jade-muted); }
.qms-jade .metric-card strong { color: var(--jade-ink); font-size: 30px; font-weight: 730; font-variant-numeric: tabular-nums; }
.qms-jade :is(.metric-card, .command-kpi)::before,
.qms-jade :is(.metric-card, .command-kpi)::after { display: none; }
.qms-jade .metric-card.is-alert { border-color: #edddd4; }
.qms-jade .metric-card.is-positive { border-color: #dce9e1; }
.qms-jade :is(input, select, textarea, button, .button) { font: inherit; }
.qms-jade :is(input, select, textarea) {
    border-radius: 9px; border-color: #d5dfda; background: #fff; color: var(--jade-ink);
}
.qms-jade :is(input, select, textarea):focus { border-color: var(--jade-primary); }
.qms-jade :is(button, .button) { border-radius: 9px; min-height: 38px; box-shadow: none; }
.qms-jade :is(button, .button):active { transform: translateY(1px); }
.qms-jade :is(a, button, input, select, textarea, summary):focus-visible {
    outline: 2px solid var(--jade-primary); outline-offset: 3px;
}
.qms-jade .tabs {
    gap: 20px; border-bottom: 1px solid var(--jade-line); background: transparent;
    padding: 0; margin-bottom: 18px; flex-wrap: wrap;
}
.qms-jade .tabs a { padding: 10px 4px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; color: var(--jade-muted); background: transparent; font-size: 14px; }
.qms-jade .tabs a.active { color: var(--jade-primary); background: transparent; border-bottom-color: var(--jade-primary); }
.qms-jade .filter-bar { gap: 12px; align-items: end; }
.qms-jade .filter-bar label { color: var(--jade-muted); font-size: 13px; }
.qms-jade .table-wrap { border-radius: 10px; overflow-x: auto; max-width: 100%; }
.qms-jade .data-table { border-color: var(--jade-line); font-size: 14px; }
.qms-jade .data-table th { background: #edf3f1; color: #44605a; font-weight: 600; border-color: var(--jade-line); }
.qms-jade .data-table td { border-color: #e9eeeb; }
.qms-jade .data-table tbody tr:hover td { background: #f7faf8; }
.qms-jade .data-table :is(th,td) { padding: 11px 12px; }
.qms-jade .empty-state, .qms-jade .empty-cell { color: var(--jade-muted); background: #f7faf8; line-height: 1.8; }
.qms-jade :is(.panel-note, .module-head p, .supporting-analysis-head p) { color: var(--jade-muted); font-size: 13px; }
.qms-jade :is(.notice-banner, .license-banner, .flash) { border-radius: 12px; box-shadow: none; }
.qms-jade .qms-home-category, .qms-jade .qms-launch-tile {
    border-radius: 16px; border-color: var(--jade-line); box-shadow: var(--jade-shadow); background: white;
}
.qms-jade .qms-home-work-rail { border-radius: 16px; border-color: var(--jade-line); background: #fbfcfa; }
.qms-jade .qms-home-welcome h1 { color: var(--jade-ink); }
.qms-jade .qms-app-home-layout { gap: 24px; }
.qms-jade .jade-inspection-overview { margin-bottom: 24px; min-width: 0; }
.qms-jade .jade-overview-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.qms-jade .jade-overview-head h2 { margin: 0 0 3px; }
.qms-jade .jade-overview-head p { margin: 0; color: var(--jade-muted); font-size: 13px; }
.qms-jade .jade-overview-head label { max-width: 380px; min-width: 180px; font-size: 12px; color: var(--jade-muted); }
.qms-jade .jade-overview-head select { width: 100%; margin-top: 4px; }
.qms-jade .jade-group-identity { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; padding: 12px 16px; border: 1px solid var(--jade-line); border-radius: 12px; background: #fbfcfa; color: var(--jade-muted); font-size: 13px; overflow-wrap: anywhere; }
.qms-jade .jade-group-identity .jade-icon { color: var(--jade-primary); }
.qms-jade .jade-month-detail { margin-top: 8px; font-size: 12px; }
.qms-jade .jade-month-detail > summary { cursor: pointer; color: var(--jade-primary); }
.qms-jade .jade-month-detail .table-wrap { margin-top: 10px; }
.qms-jade .jade-analysis-grid { display: grid; grid-template-columns: minmax(280px,.42fr) minmax(0,1fr); gap: 20px; align-items: start; }
.qms-jade .jade-analysis-metrics { display: grid; gap: 12px; min-width: 0; }
.qms-jade .jade-analysis-content { display: grid; gap: 18px; min-width: 0; }
.qms-jade .jade-analysis-content > .panel { margin-bottom: 0; }
.qms-jade .jade-primary-metric {
    padding: 24px; min-height: 210px; border: 1px solid #dce9e3; border-radius: 18px;
    box-shadow: 0 3px 8px rgba(54,110,97,.06), 0 16px 32px rgba(54,110,97,.12);
    background: #f4faf7; position: relative;
}
.qms-jade .jade-primary-metric h3 { display: flex; align-items: center; gap: 12px; font-size: 16px; margin: 0 0 14px; }
.qms-jade .jade-primary-metric h3 .jade-icon { color: var(--jade-primary); }
.qms-jade .jade-primary-metric strong { display: block; font-size: clamp(32px,3.2vw,44px); line-height: 1.2; letter-spacing: -.035em; color: #123f38; font-variant-numeric: tabular-nums; }
.qms-jade .jade-primary-metric p { margin: 8px 0 0; color: var(--jade-muted); font-size: 13px; }
.qms-jade .jade-primary-metric strong + p { color: var(--jade-ink); font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.qms-jade .jade-primary-metric .jade-source-link { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; margin-top: 8px; font-weight: 600; }
.qms-jade .jade-quantity-card { display: flex; gap: 16px; align-items: center; padding: 10px 20px; min-height: 78px; }
.qms-jade .jade-quantity-card .jade-icon { width: 24px; height: 24px; color: var(--jade-primary); flex-basis: 24px; }
.qms-jade .jade-quantity-card span { display: block; font-size: 13px; }
.qms-jade .jade-quantity-card strong { font-size: 25px; line-height: 1.4; }
.qms-jade .jade-quantity-card strong small { margin-left: 6px; font-size: 13px; font-weight: 400; }
.qms-jade .jade-quantity-card strong small { display: inline; }
.qms-jade .jade-sample-chart { min-height: 330px; }
.qms-jade .jade-sample-chart h2 { margin: 0; font-size: 18px; }
.qms-jade .jade-chart-heading { display: flex; justify-content: space-between; gap: 12px; align-items: start; }
.qms-jade .jade-chart-heading small { color: var(--jade-muted); font-size: 12px; }
.qms-jade .jade-chart-heading p { margin: 3px 0 10px; color: var(--jade-muted); font-size: 12px; }
.qms-jade .jade-trend { display: block; width: 100%; height: 210px; min-height: 0; }
.qms-jade .jade-trend .trend-grid-line { stroke: #dce6e2; stroke-dasharray: 3 4; }
.qms-jade .jade-trend .rate-trend-line { stroke: #16758a; stroke-width: 2.5; fill: none; }
.qms-jade .jade-trend .rate-trend-point { fill: #fff; stroke: #16758a; stroke-width: 2.5; }
.qms-jade .jade-trend text { font-family: inherit; font-size: 15px; fill: var(--jade-muted); }
.qms-jade .jade-trend .trend-value-label { fill: #203c35; font-weight: 600; }
.qms-jade .jade-month-values { margin: 4px 0 0; color: var(--jade-muted); font-size: 12px; }
.qms-jade .jade-context-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.qms-jade .jade-context-grid > .panel { margin: 0; padding: 18px 22px; min-width: 0; }
.qms-jade .jade-context-grid h3 { margin: 0 0 6px; font-size: 15px; display: flex; gap: 10px; align-items: center; }
.qms-jade .jade-context-grid strong { font-size: 26px; color: var(--jade-ink); font-variant-numeric: tabular-nums; }
.qms-jade .jade-context-grid strong small { font-size: 13px; font-weight: 400; }
.qms-jade .jade-context-grid p { margin: 4px 0 0; color: var(--jade-muted); font-size: 12px; }
.qms-jade .jade-estimate-card { background: #fffcf7; border-color: #efdfc9; }
.qms-jade .jade-estimate-card .jade-icon { color: #b57b29; }
.qms-jade .jade-loss-card { background: #f5fafb; border-color: #d6e7eb; }
.qms-jade .jade-data-disclosure { padding: 0; overflow: hidden; }
.qms-jade .jade-data-disclosure > summary { cursor: pointer; padding: 16px 22px; color: var(--jade-ink); font-size: 15px; font-weight: 600; }
.qms-jade .jade-data-disclosure > .jade-disclosure-content { padding: 0 22px 22px; }
.qms-jade .inspection-analysis-scope p { font-size: 13px; }
.qms-jade .jade-filter-options { margin-top: 10px; font-size: 12px; }
.qms-jade .jade-filter-options > summary { cursor: pointer; color: var(--jade-muted); }
.qms-jade .jade-filter-editor > summary { display: flex; justify-content: space-between; gap: 12px; cursor: pointer; color: var(--jade-muted); font-size: 13px; }
.qms-jade .jade-filter-editor > summary b { flex: 0 0 auto; color: var(--jade-primary); font-weight: 600; }
.qms-jade .jade-filter-editor[open] > summary { margin-bottom: 14px; }
.qms-jade .jade-inspection-tabs { margin-bottom: 14px; }
.qms-jade.jade-inspection-dashboard .content > .panel { padding: 14px 20px; margin-bottom: 18px; }
.qms-jade .jade-inspection-overview [hidden] { display: none !important; }
.qms-jade.jade-inspection-dashboard .content > .module-head { display: none; }
.qms-jade.jade-inspection-dashboard .jade-overview-head h2 { display: none; }
.qms-jade .jade-motion-card {
    --jade-rx: 0deg; --jade-ry: 0deg;
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}
@media (hover:hover) and (pointer:fine) {
    .qms-jade .jade-motion-card:hover {
        transform: perspective(1000px) rotateX(var(--jade-rx)) rotateY(var(--jade-ry)) translateY(-3px);
        box-shadow: var(--jade-float); border-color: #b7d7ca;
    }
}
.qms-jade .content > .qms-enter { animation: none; }
.qms-jade .jade-enter, .qms-jade .content > .jade-enter { animation: jade-appear 280ms ease backwards; animation-delay: var(--jade-delay,0ms); }
@keyframes jade-appear { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (min-width:901px) {
    .qms-jade:not(.product-photo-terminal-body) .command-header { margin-left: 196px; min-height: 52px; background: rgba(246,245,240,.96); border: 0; box-shadow: none; backdrop-filter: none; }
    .qms-jade:not(.product-photo-terminal-body) .command-topline { padding: 8px 24px; min-height: 52px; border: 0; justify-content: flex-end; gap: 10px; }
    .qms-jade:not(.product-photo-terminal-body) .command-topline > .brand { position: fixed; z-index: 44; left: 18px; top: 25px; width: 162px; min-width: 0; align-items: start; gap: 8px; }
    .qms-jade .brand-title { font-size: 17px; font-weight: 650; line-height: 1.35; }
    .qms-jade .brand-subtitle { display: block; font-size: 10px; margin-top: 6px; line-height: 1.5; overflow-wrap: anywhere; }
    .qms-jade:not(.product-photo-terminal-body) .command-nav-row { position: fixed; z-index: 41; top: 0; left: 0; bottom: 0; width: 196px; padding: 130px 10px 18px; background: #fbfcfa; border-right: 1px solid var(--jade-line); }
    .qms-jade .command-nav-row .nav { display: flex; flex-direction: column; gap: 8px; height: auto; max-height: calc(100dvh - 148px); overflow-y: auto; overflow-x: hidden; align-items: stretch; scrollbar-width: thin; }
    .qms-jade .command-nav-row .nav > a, .qms-jade .command-nav-row .nav-accordion > summary { gap: 10px; padding: 12px 10px; min-height: 46px; border: 0; border-radius: 10px; font-weight: 600; font-size: 14px; color: var(--jade-ink); }
    .qms-jade .command-nav-row .nav-accordion > summary .jade-icon:last-child { width: 14px; height: 14px; flex-basis: 14px; margin-left: auto; }
    .qms-jade .command-nav-row .nav-accordion[open] > summary .jade-icon:last-child { transform: rotate(180deg); }
    .qms-jade .command-nav-row .nav > a.active, .qms-jade .command-nav-row .nav-accordion[open] > summary { background: #e8f1ed; color: var(--jade-primary); }
    .qms-jade .command-nav-row .nav > a:hover, .qms-jade .command-nav-row .nav-accordion > summary:hover { background: #f0f5f2; color: var(--jade-primary); }
    .qms-jade .command-nav-row .nav-accordion { width: 100%; }
    .qms-jade .command-nav-row .nav-menu { position: static; width: 100%; min-width: 0; max-height: none; overflow: visible; padding: 5px 0 2px 14px; border: 0; border-radius: 0; box-shadow: none; background: transparent; backdrop-filter: none; }
    .qms-jade .command-nav-row .nav-accordion:not([open]) > .nav-menu { display: none !important; }
    .qms-jade .command-nav-row .nav-accordion[open] > .nav-menu { display: block; }
    .qms-jade .command-nav-row .nav-menu a { min-height: 32px; padding: 7px 10px; font-size: 12px; border-radius: 8px; overflow-wrap: anywhere; }
    .qms-jade .command-nav-row .nav-menu a.active { background: #e7f0ed; color: var(--jade-primary); font-weight: 600; }
    .qms-jade:not(.product-photo-terminal-body) .main { margin-left: 196px; }
    .qms-jade .command-search { width: clamp(180px,22vw,320px); }
    .qms-jade .command-tools { gap: 10px; }
    .qms-jade .user-menu { gap: 8px; font-size: 12px; }
    .qms-jade .notification-trigger { font-size: 12px; border-radius: 9px; }
    .qms-jade .qms-app-home-layout { grid-template-columns: minmax(0,1fr) 280px; }
}
@media (max-width:1100px) and (min-width:901px) {
    .qms-jade .command-search { width: 180px; }
    .qms-jade .user-menu .role-badge { display: none; }
    .qms-jade .jade-analysis-grid { grid-template-columns: minmax(220px,.38fr) minmax(0,1fr); gap: 16px; }
    .qms-jade .qms-app-home-layout { grid-template-columns: 1fr; }
}
@media (max-width:900px) {
    .qms-jade .command-header { background: #fbfcfa; backdrop-filter: none; }
    .qms-jade .command-topline { padding: 16px 18px; min-height: 76px; }
    .qms-jade .brand-subtitle { font-size: 10px; }
    .qms-jade .command-nav-row { padding: 0; min-height: 0; display: block; }
    .qms-jade .command-nav-row .nav { top: 76px; background: #fbfcfa; border-color: var(--jade-line); height: calc(100dvh - 76px); max-height: none; overflow-y: auto; }
    .qms-jade .command-nav-row .nav > a, .qms-jade .command-nav-row .nav-accordion > summary { gap: 10px; }
    .qms-jade .command-nav-row .nav-accordion > summary .jade-icon:last-child { width: 14px; height: 14px; flex-basis: 14px; margin-left: auto; }
    .qms-jade .topbar { padding: 20px 16px 6px; }
    .qms-jade .topbar h1 { font-size: 24px; }
    .qms-jade .content { padding: 14px 16px 36px; }
    .qms-jade .qms-mobile-status { top: calc(126px + env(safe-area-inset-top,0px)); margin: 0 -6px 18px; background: #fbfcfa; backdrop-filter: none; }
    .qms-jade.jade-inspection-dashboard .filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .qms-jade.jade-inspection-dashboard .filter-bar > button { grid-column: 1/-1; }
    .qms-jade .panel { padding: 18px; }
    .qms-jade .jade-analysis-grid { grid-template-columns: 1fr; }
    .qms-jade .jade-analysis-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .qms-jade .jade-primary-metric { grid-column: 1/-1; min-height: 190px; padding: 22px; }
    .qms-jade .jade-quantity-card { display: block; padding: 14px 10px; min-height: 100px; }
    .qms-jade .jade-quantity-card .jade-icon { width: 20px; height: 20px; margin-bottom: 5px; }
    .qms-jade .jade-quantity-card strong { font-size: 20px; overflow-wrap: anywhere; }
    .qms-jade .jade-quantity-card strong small { display: block; margin: 0; font-size: 12px; }
    .qms-jade .jade-overview-head { align-items: stretch; flex-direction: column; gap: 10px; }
    .qms-jade .jade-overview-head label { max-width: none; }
    .qms-jade .jade-sample-chart { min-height: 280px; }
    .qms-jade .jade-trend { height: 180px; min-height: 0; }
    .qms-jade .jade-trend text { font-size: 30px; }
    .qms-jade .jade-trend .trend-month-label:not(.jade-mobile-tick), .qms-jade .jade-trend:not(.jade-single-point) .trend-value-label { display: none; }
    .qms-jade .jade-context-grid > .panel { padding: 16px; }
    .qms-jade .jade-context-grid strong { font-size: 22px; }
    .qms-jade .jade-data-disclosure { padding: 0; }
    .qms-jade .jade-data-disclosure > summary { padding: 16px 18px; }
    .qms-jade .jade-data-disclosure > .jade-disclosure-content { padding: 0 18px 18px; }
}
@media (max-width:480px) {
    .qms-jade .jade-context-grid { grid-template-columns: 1fr; }
    .qms-jade .jade-quantity-card span { font-size: 12px; }
    .qms-jade .tabs { gap: 10px; }
    .qms-jade .tabs a { font-size: 13px; }
}
@media (prefers-reduced-motion:reduce) {
    .qms-jade .jade-enter, .qms-jade .content > .jade-enter { animation: none; }
    .qms-jade .jade-motion-card, .qms-jade .jade-motion-card:hover { transform: none; transition: none; }
    .qms-jade :is(button, .button):active { transform: none; }
}
@media print {
    .qms-jade .command-header { display: none !important; }
    .qms-jade .main { margin: 0 !important; }
    .qms-jade .jade-motion-card { transform: none !important; }
    .qms-jade .panel { box-shadow: none; }
}