* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: var(--page); color: var(--text); font-family: var(--core-font); }
button, input { font: inherit; }
.paint-app { width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 4px 0 64px; }
.paint-hero { padding: 24px 0 20px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: end; }
.paint-back { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: .72rem; font-weight: 760; text-decoration: none; }
.paint-back:hover { color: var(--accent); }
.paint-kicker { margin: 13px 0 5px; color: var(--accent-strong); font-size: .65rem; font-weight: 850; letter-spacing: .14em; }
.paint-hero h1 { margin: 0; font-size: clamp(2.25rem, 4vw, 50px); line-height: 1.04; letter-spacing: -.045em; }
.paint-hero h1 em { display: block; font-style: normal; }
.paint-hero > div > p:last-child { max-width: 710px; margin: 10px 0 0; color: var(--muted); font-size: .86rem; line-height: 1.65; }
.paint-hero-metric { min-width: 220px; padding: 17px 20px; display: grid; gap: 4px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow); }
.paint-hero-metric span { color: var(--muted); font-size: .6rem; font-weight: 850; letter-spacing: .13em; }
.paint-hero-metric strong { color: var(--accent-strong); font-size: 1.65rem; font-variant-numeric: tabular-nums; }
.paint-hero-metric small { max-width: 240px; color: var(--muted); font-size: .64rem; line-height: 1.45; }

.paint-workspace { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: var(--surface); box-shadow: var(--shadow); }
.paint-input-card { min-width: 0; padding: 22px; }
.paint-input-card > header { display: flex; justify-content: space-between; gap: 16px; align-items: start; margin-bottom: 18px; }
.paint-input-card > header span, .paint-formula-card > span { color: var(--accent-strong); font-size: .6rem; font-weight: 850; letter-spacing: .13em; }
.paint-input-card h2, .paint-formula-card h2 { margin: 5px 0 0; font-size: 1.2rem; letter-spacing: -.025em; }
.paint-fields { display: grid; gap: 11px; }
.paint-identification-fields { grid-template-columns: minmax(160px, 1.25fr) minmax(95px, .45fr) minmax(160px, 1fr); }
.paint-calculation-fields { margin-top: 11px; grid-template-columns: repeat(4, minmax(120px, 1fr)); }
.paint-input-card label { display: grid; gap: 5px; color: var(--muted); font-size: .66rem; font-weight: 800; }
.paint-input-card label span { display: flex; justify-content: space-between; gap: 8px; }
.paint-input-card label small { color: var(--accent-strong); font-size: .61rem; }
.paint-input-card input, .paint-project-meta input, .paint-row-input { width: 100%; min-width: 0; min-height: 40px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; outline: 0; background: var(--surface-2); color: var(--text); transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease; }
.paint-input-card input:focus, .paint-project-meta input:focus, .paint-row-input:focus { border-color: var(--accent); background: var(--surface); box-shadow: 0 0 0 3px var(--accent-soft); }
.paint-remarks { margin-top: 11px; }
.paint-live-results { margin-top: 18px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.paint-live-results > div { min-width: 0; padding: 13px; display: grid; gap: 3px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); }
.paint-live-results > div.primary { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: var(--accent-soft); }
.paint-live-results span { color: var(--muted); font-size: .61rem; font-weight: 760; }
.paint-live-results strong { font-size: 1.22rem; font-variant-numeric: tabular-nums; }
.paint-live-results .primary strong { color: var(--accent-strong); }
.paint-live-results small { color: var(--muted); font-size: .6rem; }
.paint-validation { min-height: 18px; margin: 11px 0; color: var(--muted); font-size: .68rem; }
.paint-validation.error { color: #c0374f; }
.paint-button { min-height: 40px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid transparent; border-radius: 10px; cursor: pointer; font-size: .73rem; font-weight: 800; }
.paint-button.primary { background: linear-gradient(135deg, #0b57d0, #536dfe); color: #fff; box-shadow: 0 10px 23px rgba(31, 81, 196, .2); }
.paint-button.secondary { border-color: var(--line); background: var(--surface); color: var(--text); box-shadow: none; }
.paint-button:disabled { opacity: .46; cursor: not-allowed; }

.paint-formula-card { min-width: 0; padding: 28px; display: flex; flex-direction: column; background: radial-gradient(circle at 90% 4%, rgba(124, 77, 255, .28), transparent 16rem), var(--inverse-surface); color: var(--inverse-text); }
.paint-formula-card > span { color: #8ab4f8; }
.paint-formula-card h2 { margin-bottom: 20px; color: #fff; font-size: 1.35rem; }
.paint-equation { padding: 13px 0; display: grid; gap: 5px; border-top: 1px solid rgba(255, 255, 255, .13); }
.paint-equation small { color: #9eabd0; font-size: .57rem; font-weight: 800; letter-spacing: .1em; }
.paint-equation strong { color: #eef3ff; font-size: .79rem; line-height: 1.45; }
.paint-equation.highlight strong { color: #9ebcff; }
.paint-formula-card > p { margin: 16px 0; color: #aeb9d6; font-size: .69rem; line-height: 1.65; }
.paint-worked-example { margin-top: auto; padding: 15px; display: grid; gap: 5px; border: 1px solid rgba(138, 180, 248, .24); border-radius: 12px; background: rgba(255, 255, 255, .055); }
.paint-worked-example b { color: #fff; font-size: .72rem; }
.paint-worked-example span { color: #aeb9d6; font-size: .64rem; line-height: 1.45; }
.paint-worked-example strong { color: #8ab4f8; font-size: 1.12rem; }

.paint-report { margin-top: 20px; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow); }
.paint-report-header { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.paint-report-header h2 { margin: 4px 0 0; font-size: 1.45rem; letter-spacing: -.035em; }
.paint-report-description { margin: 6px 0 0; color: var(--muted); font-size: .72rem; }
.paint-report-side { display: grid; justify-items: end; gap: 11px; }
.paint-report-side > img { display: block; width: 168px; height: 40px; object-fit: contain; object-position: right center; }
.paint-report-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.paint-project-meta { margin-top: 16px; display: grid; grid-template-columns: .75fr 1.25fr .8fr .65fr; gap: 9px; }
.paint-project-meta label, .paint-project-meta > div { display: grid; gap: 4px; color: var(--muted); font-size: .62rem; font-weight: 800; }
.paint-project-meta > div { align-content: start; }
.paint-project-meta > div strong { min-height: 40px; padding: 0 10px; display: flex; align-items: center; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); color: var(--text); font-size: .75rem; }
.paint-summary-cards { margin-top: 13px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }
.paint-summary-cards > div { padding: 12px; display: grid; gap: 4px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); }
.paint-summary-cards > div.primary { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: var(--accent-soft); }
.paint-summary-cards span { color: var(--muted); font-size: .6rem; font-weight: 760; }
.paint-summary-cards strong { font-size: 1rem; font-variant-numeric: tabular-nums; }
.paint-summary-cards .primary strong { color: var(--accent-strong); }
.paint-empty { margin: 16px 0 0; padding: 22px; border: 1px dashed var(--line); border-radius: 12px; color: var(--muted); text-align: center; font-size: .75rem; }
.paint-report-section-heading { margin: 22px 0 9px; display: flex; align-items: center; gap: 10px; }
.paint-report-section-heading span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; background: var(--accent-soft); color: var(--accent-strong); font-size: .58rem; font-weight: 850; }
.paint-report-section-heading h3 { margin: 0; font-size: .88rem; }
.paint-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 11px; }
.paint-detail-table, .paint-matrix-table { width: 100%; border-collapse: collapse; font-size: .67rem; }
.paint-detail-table { min-width: 990px; }
.paint-detail-table th, .paint-detail-table td, .paint-matrix-table th, .paint-matrix-table td { padding: 7px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.paint-detail-table thead th, .paint-matrix-table thead th { background: var(--surface-2); color: var(--muted); font-size: .57rem; letter-spacing: .04em; text-transform: uppercase; }
.paint-detail-table td:nth-child(n+3), .paint-detail-table th:nth-child(n+3), .paint-matrix-table td:not(:first-child), .paint-matrix-table th:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.paint-detail-table tfoot th, .paint-matrix-table tfoot th { border-bottom: 0; background: var(--accent-soft); color: var(--text); }
.paint-detail-table tfoot th:first-child, .paint-matrix-table tfoot th:first-child { text-align: right; }
.paint-row-input { min-height: 31px; height: 31px; padding: 0 6px; border-radius: 7px; font-size: .68rem; }
.paint-row-category { min-width: 130px; }
.paint-row-name { min-width: 125px; }
.paint-row-description { display: grid; gap: 4px; }
.paint-row-remarks { color: var(--muted); font-size: .62rem; }
.paint-row-remarks::placeholder { color: var(--muted); opacity: .75; }
.paint-row-number { min-width: 58px; text-align: right; }
.paint-row-actions { display: flex; gap: 4px; min-width: 92px; }
.paint-row-action { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); color: var(--muted); cursor: pointer; }
.paint-row-action:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.paint-row-action.remove { color: #b4233c; }
.paint-row-action:disabled { opacity: .35; cursor: not-allowed; }
.paint-row-invalid { background: color-mix(in srgb, #d93025 6%, transparent); }
.paint-row-invalid .paint-row-litres { color: #b4233c; font-weight: 800; }
.paint-matrix-table td:first-child { font-weight: 760; }
.paint-report-method { break-inside: avoid; }
.paint-report-method > p { margin: 0; color: var(--text); font-size: .7rem; line-height: 1.6; }
.paint-report-method > small { display: block; margin-top: 8px; color: var(--muted); font-size: .62rem; line-height: 1.55; }
[hidden] { display: none !important; }

@media (max-width: 930px) {
  .paint-hero { grid-template-columns: 1fr; }
  .paint-hero-metric { min-width: 0; }
  .paint-workspace { grid-template-columns: 1fr; }
  .paint-formula-card { min-height: 420px; }
  .paint-project-meta { grid-template-columns: repeat(2, 1fr); }
  .paint-report-header { display: grid; }
  .paint-report-side { justify-items: start; }
  .paint-report-side > img { object-position: left center; }
  .paint-report-actions { justify-content: start; }
}
@media (max-width: 720px) {
  .paint-input-card > header { display: grid; }
  .paint-identification-fields, .paint-calculation-fields { grid-template-columns: repeat(2, 1fr); }
  .paint-live-results, .paint-summary-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .paint-app { width: min(100% - 22px, 1180px); }
  .paint-input-card, .paint-formula-card, .paint-report { padding: 17px; }
  .paint-input-card > header { display: grid; }
  .paint-identification-fields, .paint-calculation-fields, .paint-live-results, .paint-summary-cards, .paint-project-meta { grid-template-columns: 1fr; }
}

@page { size: A4 portrait; margin: 10mm; }
@media print {
  html, body { background: #fff !important; color: #111 !important; }
  .global-header, .paint-hero, .paint-workspace, .paint-screen-only, .stru-feedback-assistant, .donation-popup, .stru-ad-rail { display: none !important; }
  .paint-app { width: 100%; margin: 0; padding: 0; }
  .paint-report { margin: 0; padding: 0; border: 0; border-radius: 0; background: #fff; box-shadow: none; color: #111; }
  .paint-report-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5mm; margin-bottom: 4mm; }
  .paint-report-header h2 { color: #111; font-size: 17pt; }
  .paint-report-description { display: none; }
  .paint-kicker { color: #245fd4 !important; }
  .paint-report-side { display: block; justify-self: end; }
  .paint-report-side > img { width: 40mm; height: 10mm; object-position: right center; }
  .paint-project-meta { margin: 0 0 4mm; grid-template-columns: repeat(4, 1fr); gap: 2mm; }
  .paint-project-meta.paint-print-three { grid-template-columns: repeat(3, 1fr); }
  .paint-project-meta.paint-print-two { grid-template-columns: repeat(2, 1fr); }
  .paint-project-meta.paint-print-one { grid-template-columns: 1fr; }
  .paint-project-meta label.paint-print-omit { display: none !important; }
  .paint-project-meta label, .paint-project-meta > div { color: #333; }
  .paint-project-meta input, .paint-project-meta > div strong { min-height: 7mm; padding: 0 1.5mm; border: 1px solid #aaa; border-radius: 0; background: #fff; color: #111; }
  .paint-summary-cards { margin: 0 0 4mm; gap: 2mm; }
  .paint-summary-cards > div { padding: 2.2mm; border-color: #aaa; border-radius: 0; background: #fff !important; color: #111; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .paint-summary-cards span { color: #444; }
  .paint-summary-cards strong, .paint-summary-cards .primary strong { color: #111; }
  .paint-report-section-heading { margin: 4mm 0 2mm; }
  .paint-report-section-heading span { background: #e9eef8 !important; color: #245fd4; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .paint-table-wrap { overflow: visible; border-color: #888; border-radius: 0; }
  .paint-detail-table { min-width: 0; table-layout: fixed; font-size: 6.3pt; color: #111; }
  .paint-detail-table th, .paint-detail-table td, .paint-matrix-table th, .paint-matrix-table td { padding: 1.35mm .75mm; border-color: #aaa; overflow-wrap: anywhere; }
  .paint-detail-table :is(th, td):nth-child(1) { width: 5%; }
  .paint-detail-table :is(th, td):nth-child(2) { width: 18%; }
  .paint-detail-table :is(th, td):nth-child(3) { width: 6%; }
  .paint-detail-table :is(th, td):nth-child(4) { width: 19%; }
  .paint-detail-table :is(th, td):nth-child(5) { width: 10%; }
  .paint-detail-table :is(th, td):nth-child(6) { width: 8%; }
  .paint-detail-table :is(th, td):nth-child(7) { width: 9%; }
  .paint-detail-table :is(th, td):nth-child(8) { width: 9%; }
  .paint-detail-table :is(th, td):nth-child(9) { width: 16%; }
  .paint-detail-table thead th, .paint-matrix-table thead th { background: #e9eef8 !important; color: #222; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .paint-detail-table tfoot th, .paint-matrix-table tfoot th { background: #eef3ff !important; color: #111; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .paint-row-input { height: auto; min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: #111; box-shadow: none; }
  .paint-row-description { display: grid; gap: .6mm; }
  .paint-row-remarks:placeholder-shown { display: none; }
  .paint-report-method > p { color: #111; font-size: 6.8pt; }
  .paint-report-method > small { color: #444; font-size: 6.2pt; }
}