/* Zink Design Consultancy — architectural editorial system.
   Loaded last: deliberate, scoped overrides for the website and its four tools. */

:root {
  --paper: #faf9f6;
  --ink: #20211f;
  --green: #20211f;
  --muted: #66615a;
  --line: #d7d4ce;
  --lime: #e7e2d9;
  --soft: #f0ede7;
  --brand-hover: #41413c;
  --brand-edge: #8b857b;
  --brand-focus: #776044;
}

body { background: var(--paper); color: var(--ink); font-size: 16px; line-height: 1.75; }
::selection { background: #dcd3c4; color: #20211f; }
h1, h2, h3, h4 { color: inherit; }
a, button, input, select, textarea { -webkit-tap-highlight-color: #ddd7cc; }
:focus-visible, .tool-workspace :focus-visible {
  outline: 3px solid #776044;
  outline-offset: 4px;
}
a, button { transition: color .18s ease, background-color .18s ease, border-color .18s ease; }

/* Navigation and the clear hierarchy of primary / secondary / reading links. */
.header { background: #faf9f6; border-color: #d7d4ce; }
.header nav { font-size: 12px; }
.header nav a:hover, .language:hover { color: #20211f; text-decoration: underline; text-underline-offset: 5px; }
.nav-cta { background: #20211f; color: #fff; border: 1px solid #20211f; }
.header nav .nav-cta:hover { background: #41413c; color: #fff; text-decoration: none; border-color: #41413c; }
.language { font-size: 12px; }
.language span { color: #66615a; }
.button, .btn { font-size: 14px; font-weight: 500; border-radius: 0; min-height: 52px; line-height: 1.45; }
.btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px 22px; background: transparent; color: #20211f; border: 1px solid #8b857b; text-decoration: none; }
.btn:hover { background: #e7e2d9; border-color: #20211f; }
.btn.primary, .btn.primary:hover { color: #fff; background: #20211f; border-color: #20211f; }
.btn.primary:hover { background: #41413c; border-color: #41413c; }
.button:hover { transform: none; }
.dark { background: #20211f; color: #fff; border-color: #20211f; }
.dark:hover { background: #41413c; color: #fff; border-color: #41413c; }
.light { background: #fff; color: #20211f; border-color: #fff; }
.light:hover { background: #e7e2d9; color: #20211f; border-color: #e7e2d9; }
.outline { color: #20211f; background: transparent; border-color: #8b857b; }
.outline:hover { background: #e7e2d9; color: #20211f; border-color: #20211f; }
.text-link { color: #20211f; border-color: #8b857b; font-size: 14px; line-height: 1.6; font-weight: 500; }
.text-link:hover { color: #20211f; border-color: #20211f; background: #eeeae2; }
.filter { color: #20211f; background: transparent; border-color: #8b857b; font-size: 13px; min-height: 42px; }
.filter:hover { background: #eeeae2; border-color: #20211f; }
.filter.active, .filter[aria-pressed=true] { background: #20211f; color: #fff; border-color: #20211f; }
button:disabled, .button[aria-disabled=true] { opacity: 1; cursor: not-allowed; }

/* Quiet, readable editorial content. */
.hero-aside p, .page-head-grid .lede, .cta p, .contact-aside>p { font-size: 16px; line-height: 1.8; }
.category-row p, .study-card p, .three-cols p, .guide-card p,
.service-card p, .stage-list p, .detail-body li, .contact-box p,
.faq-list p { font-size: 15px; line-height: 1.8; }
.guide-article>.lede { font-size: 20px; line-height: 1.75; }
.article-section p, .prose p { font-size: 17px; line-height: 1.85; color: #45443e; }
.article-section h2 { margin-top: 8px; }
.article-sources a, .source-links a { font-size: 14px; color: #20211f; text-underline-offset: 4px; }
.article-sources a:hover, .source-links a:hover { text-decoration-thickness: 2px; }
.guide-article .text-link, .guide-article .button { font-size: 14px; }
.eyebrow, .section-no, .hero-caption, .card-meta, .study-meta small,
.numbered article>span, .stage-list>li>span, .breadcrumb, .prose .caption { color: #66615a; font-size: 11px; }
.category-row:hover, .service-card:hover { background: #eae6df; }
.service-card { background: #f0ede7; }
.stage-list, .stage-list details { border-color: #d7d4ce; }
.stage-list .stage-no, .stage-list summary>span:first-child { color: #66615a; }
.logo-mark { border-color: #8b857b; }
.category-row .row-no, .large-number { color: #66615a; }
.notice { background: #f0ede7; border-left-color: #8b857b; color: #514d46; font-size: 13px; line-height: 1.75; }
.hero-tool { background: #f3efe8; color: #20211f; }
.hero-tool strong { font-size: 15px; }
.hero-tool small { color: #66615a; font-size: 12px; }
.tool-feature { background: #20211f; color: #fff; }
.tool-feature p { color: #e3dfd7; font-size: 16px; line-height: 1.8; }
.tool-feature .eyebrow, .tool-feature .section-no { color: #d4cec3; }
.tool-preview { border-color: #807c73; }
.tool-preview a { border-color: #807c73; }
.tool-preview a:hover { background: #353632; }
.tool-preview small, .tool-preview a>span { color: #dfdbd3; font-size: 12px; }
.tool-feature .text-link { color: #fff; border-color: #b2ab9e; }
.tool-feature .text-link:hover { color: #fff; background: #41413c; border-color: #fff; }
.footer h4, .footer-bottom { color: #66615a; font-size: 12px; }
.footer a, .footer p { font-size: 13px; }
.footer a:hover { color: #20211f; text-decoration: underline; text-underline-offset: 4px; }

/* Contact and shared reading dialogs. */
.enquiry-form legend, .enquiry-form label>span { font-size: 13px; }
.enquiry-form input:not([type=radio]):not([type=checkbox]), .enquiry-form select, .enquiry-form textarea, .planner-form select {
  color: #20211f; background: #fff; border-color: #8b857b; border-radius: 0; font-size: 16px;
}
.enquiry-form input::placeholder, .enquiry-form textarea::placeholder { color: #716b63; opacity: 1; }
.choice-row label>span { border-color: #8b857b; color: #20211f; background: #fff; }
.choice-row input:checked+span { background: #20211f; color: #fff; border-color: #20211f; }
.choice-row input:focus-visible+span { outline: 3px solid #776044; outline-offset: 3px; }
.check-row>span { font-size: 13px!important; }
input[type=checkbox], input[type=radio] { accent-color: #20211f; }
.estimate-attachment { background: #f0ede7; color: #20211f; font-size: 14px; }
.estimate-attachment pre { font-size: 12px; }
.estimate-attachment button { color: #20211f; font-size: 13px; padding-block: 7px; }
.planning-result { background: #f0ede7; }
.mini-route small { font-size: 12px; }
dialog { background: #faf9f6; color: #20211f; border-color: #8b857b; }
dialog::backdrop { background: #20211fbf; }
dialog p { font-size: 15px; }
dialog pre { background: #f0ede7; color: #45443e; }
.toast { background: #20211f; color: #fff; }

/* Images retain natural colours; surrounding surfaces remain warm and neutral. */
.photo { background: #e9e5de; }
.photo::after { background: linear-gradient(transparent, #20211f70); }
.photo figcaption { font-size: 11px; }
.photo-zoom { background: #faf9f6; color: #20211f; border: 1px solid #8b857b; font-size: 12px; }
.photo-zoom:hover { background: #20211f; color: #fff; border-color: #20211f; }
.image-viewer { background: #faf9f6; }
.image-viewer::backdrop { background: #20211fe8; }
.image-viewer-bar { border-color: #d7d4ce; }
.image-viewer-stage { background: #e9e5de; }
.image-viewer>p { font-size: 12px; color: #66615a; }
.guide-art, .guide-art.variation-1, .guide-art.variation-2 { background: #e9e5de; }
.guide-art>span { color: #66615a; }
.art-block, .variation-1 .art-block, .variation-2 .art-block { background: #f4f1eb; border-color: #8b857b; }
.art-block:before { border-color: #aaa399; background: repeating-linear-gradient(0deg,transparent,transparent 16px,#aaa39988 17px,transparent 18px); }
.art-block:after, .variation-1 .art-block:after, .variation-2 .art-block:after { background: #c6beb0; border-color: #8b857b; }
.article-actions .btn, .article-actions .button { font-size: 14px; }
.article-contents a { color: #20211f; text-underline-offset: 4px; }
.article-contents a:hover { text-decoration: underline; }

/* Tools landing page. */
.tool-hub-card { background: #f3f0ea; border-color: #d7d4ce; border-radius: 0; }
.tool-hub-card:hover { background: #ebe6de; transform: none; border-color: #8b857b; }
.tool-hub-art { background: #e9e5de; border-color: #d7d4ce; }
.tool-card-no, .tool-hub-tags, .tool-hub-notes { color: #66615a; font-size: 12px; }
.tool-card-tag { color: #20211f; background: #faf9f6; border-color: #8b857b; font-size: 11px; }
.tool-hub-copy p { font-size: 15px; line-height: 1.75; }
.tool-hub-action { color: #20211f; border-color: #8b857b; font-size: 14px; }
.tool-local-nav, .tool-page .tool-local-nav>div>a { font-size: 12px; }
.tool-local-nav>div>a { color: #66615a; }
.tool-local-nav>div>a>span:first-child { font-size: 11px; }
.tool-local-nav a:hover { color: #20211f; text-decoration: underline; text-underline-offset: 5px; }
.tool-local-nav a[aria-current] { color: #20211f; }

/* Tool design tokens. */
#extension-app, .xe {
  --xe-paper: #faf9f6; --xe-soft: #f0ede7; --xe-line: #d7d4ce;
  --xe-ink: #20211f; --xe-green: #20211f; --xe-muted: #66615a;
}
#renovation-app {
  --zr-paper: #faf9f6; --zr-ink: #20211f; --zr-muted: #66615a;
  --zr-line: #d7d4ce; --zr-green: #20211f; --zr-lime: #e7e2d9;
}
#planning-app {
  --zp-ink: #20211f; --zp-muted: #66615a; --zp-line: #d7d4ce;
  --zp-paper: #faf9f6; --zp-accent: #e7e2d9;
}
#tools-app {
  --zt-paper: #faf9f6; --zt-ink: #20211f; --zt-green: #20211f;
  --zt-line: #d7d4ce; --zt-muted: #66615a; --zt-tint: #f0ede7;
}
#extension-app, #renovation-app, #planning-app, #tools-app { color: #20211f; font-size: 16px; }
#extension-app :focus-visible, #renovation-app :focus-visible,
#planning-app :focus-visible, #tools-app :focus-visible { outline: 3px solid #776044; outline-offset: 4px; }
#xe-scene, #renovation-app #zr-scene, #planning-app #zp-scene { background: #e9e5de; border-color: #d7d4ce; border-radius: 0; }

/* Extension: charcoal active tabs and precise warm-grey selection cards. */
#extension-app .xe-progress li { color: #66615a; }
#extension-app .xe-progress li span { color: #66615a; font-size: 11px; }
#extension-app .xe-progress li[aria-current] { color: #20211f; font-size: 12px; }
#extension-app .xe-progress li[aria-current] span { background: #20211f; color: #fff; border-color: #20211f; }
#extension-app .xe-text { color: #20211f; font-size: 13px!important; text-decoration-color: #8b857b; }
#extension-app .xe-text:hover { text-decoration-thickness: 2px; }
#extension-app .xe-context { font-size: 13px; }
#extension-app .xe-resume { background: #ede8df; color: #45443e; font-size: 13px; }
#extension-app .xe-overline { color: #66615a!important; font-size: 12px; }
#extension-app .xe-lead { font-size: 16px; line-height: 1.75; }
#extension-app .xe-choice { background: #fff; border-color: #aaa399!important; border-radius: 0; }
#extension-app .xe-choice:hover { background: #f0ede7; border-color: #66615a!important; }
#extension-app .xe-choice.is-selected { background: #ebe6de; border-color: #20211f!important; box-shadow: inset 0 0 0 1px #20211f; }
#extension-app .xe-choice small, #extension-app .xe-tick { color: #66615a; font-size: 13px; }
#extension-app .xe-model-top, #extension-app .xe-model-note { color: #66615a; font-size: 12px; }
#extension-app .xe-live-dot:before { background: #776044; }
#extension-app .xe-model-summary>span { font-size: 12px; }
#extension-app .xe-project-tabs>[role=tab], #extension-app .xe-substeps button {
  color: #20211f; border-color: #8b857b; background: transparent; font-size: 13px; min-height: 42px;
}
#extension-app .xe-project-tabs>[role=tab]:hover, #extension-app .xe-substeps button:hover { background: #eeeae2; }
#extension-app .xe-project-tabs>[aria-selected=true], #extension-app .xe-substeps button[aria-current] {
  color: #fff; background: #20211f; border-color: #20211f;
}
#extension-app .xe-field>span:first-child { font-size: 13px; }
#extension-app .xe-input-wrap { background: #fff; border-color: #8b857b; }
#extension-app .xe-input-wrap>span, #extension-app .xe-input-wrap i { color: #66615a; }
#extension-app input[type=number], #extension-app input[type=text], #extension-app select { background: #fff; color: #20211f; border-color: #8b857b; }
#extension-app input::placeholder { color: #716b63; opacity: 1; }
#extension-app .xe-help, #extension-app .xe-area span, #extension-app .xe-check small { color: #66615a; font-size: 12px; line-height: 1.65; }
#extension-app .xe-info { color: #514d46; background: #f0ede7; font-size: 13px; }
#extension-app .xe-disclosure summary { font-size: 15px; }
#extension-app .xe-disclosure p { font-size: 14px; }
#extension-app .xe-dock { background: #20211f; color: #fff; box-shadow: 0 -8px 25px #20211f0d; }
#extension-app .xe-budget-peek>span, #extension-app .xe-dock-action>small { color: #e3dfd7; font-size: 12px; }
#extension-app .xe-next {
  background: #fff; color: #20211f; border: 1px solid #fff!important; border-radius: 0;
  font-size: 14px!important; font-weight: 500; min-height: 50px;
}
#extension-app .xe-next:hover { background: #e7e2d9; color: #20211f; border-color: #e7e2d9!important; }
#extension-app .xe-contact, #extension-app .xe-report-card .xe-next { background: #20211f; color: #fff; border-color: #20211f!important; }
#extension-app .xe-contact:hover, #extension-app .xe-report-card .xe-next:hover { background: #41413c; color: #fff; border-color: #41413c!important; }
#extension-app .xe-status { color: #85432e!important; font-size: 13px; }
#extension-app .xe-scope-cards p { font-size: 14px; }
#extension-app .xe-scope-cards small, #extension-app .xe-totals small, #extension-app .xe-source-links a { font-size: 12px; }
#extension-app .xe-totals>div { font-size: 14px; }
#extension-app .xe-report-card { background: #f0ede7; }
#extension-app .xe-report-card p { font-size: 14px; }
#extension-app .xe-report-links button { color: #20211f; font-size: 13px; min-height: 36px; }
#extension-app .xe-comparison article>span, #extension-app .xe-comparison summary { font-size: 12px; }
#extension-app .xe-comparison p { font-size: 14px; }

/* Renovation: specificity intentionally wins over its local button reset. */
#renovation-app .zr-progress button { color: #66615a; font-size: 13px; }
#renovation-app .zr-progress button[aria-current=step] { color: #20211f; }
#renovation-app .zr-progress button[aria-current=step]>span { background: #20211f; color: #fff; }
#renovation-app .zr-small, #renovation-app .zr-visual-head, #renovation-app .zr-scene-caption { font-size: 12px; color: #66615a; }
#renovation-app .zr-intro { font-size: 16px; line-height: 1.75; }
#renovation-app button.zr-country { background: #fff; border: 1px solid #aaa399; border-radius: 0; }
#renovation-app button.zr-country:hover { background: #f0ede7; border-color: #66615a; }
#renovation-app button.zr-country.is-selected { background: #ebe6de; border-color: #20211f; box-shadow: inset 0 0 0 1px #20211f; }
#renovation-app .zr-country-symbol { color: #66615a; }
#renovation-app .zr-country>span:last-of-type { font-size: 12px; }
#renovation-app .zr-field>span { font-size: 13px; color: #514d46; }
#renovation-app .zr-field input, #renovation-app .zr-field select { background: #fff; border-color: #8b857b; border-radius: 0; color: #20211f; font-size: 16px; }
#renovation-app .zr-field input::placeholder { color: #716b63; opacity: 1; }
#renovation-app button.zr-primary, #renovation-app a.zr-primary { background: #20211f; color: #fff!important; border: 1px solid #20211f; border-radius: 0; font-size: 14px; }
#renovation-app button.zr-primary:hover, #renovation-app a.zr-primary:hover { background: #41413c; border-color: #41413c; }
#renovation-app button.zr-outline, #renovation-app a.zr-outline { background: transparent; color: #20211f; border: 1px solid #8b857b; border-radius: 0; font-size: 13px; }
#renovation-app button.zr-outline:hover, #renovation-app a.zr-outline:hover { background: #e7e2d9; border-color: #20211f; }
#renovation-app button.zr-text { color: #20211f; font-size: 13px; text-decoration-color: #8b857b; }
#renovation-app button.zr-text:hover { text-decoration-thickness: 2px; }
#renovation-app .zr-room-choice { background: #fff; border-color: #aaa399; border-radius: 0; }
#renovation-app .zr-room-choice.is-selected { background: #ebe6de; border-color: #20211f; }
#renovation-app .zr-room-choice svg { color: #66615a; }
#renovation-app .zr-room-choice .zr-floor, #renovation-app .zr-icon-floor { fill: #e7e2d9; }
#renovation-app .zr-counter button { border: 1px solid #8b857b; color: #20211f; background: #fff; }
#renovation-app .zr-counter button:hover { background: #e7e2d9; }
#renovation-app .zr-segment, #renovation-app .zr-system-card, #renovation-app .zr-comparison-grid article { border-radius: 0; }
#renovation-app .zr-segment button { font-size: 13px; color: #20211f; }
#renovation-app .zr-segment button:hover { background: #eeeae2; }
#renovation-app .zr-segment button[aria-pressed=true] { background: #20211f; color: #fff; box-shadow: inset 0 0 0 1px #20211f; }
#renovation-app .zr-presets button { border: 1px solid #aaa399; border-radius: 0; background: #fff; }
#renovation-app .zr-presets button:hover { background: #f0ede7; border-color: #66615a; }
#renovation-app .zr-presets button[aria-pressed=true] { background: #ebe6de; border-color: #20211f; box-shadow: inset 0 0 0 1px #20211f; }
#renovation-app .zr-presets strong { font-size: 13px; }
#renovation-app .zr-presets small, #renovation-app .zr-check small { font-size: 12px; line-height: 1.65; }
#renovation-app .zr-work-quantity .zr-field>span { font-size: 12px; }
#renovation-app button.zr-quantity-reset, #renovation-app .zr-rate { color: #66615a; font-size: 12px; }
#renovation-app .zr-live-estimate>span, #renovation-app .zr-live-estimate small { font-size: 12px; }
#renovation-app .zr-scope-list article svg { color: #66615a; }
#renovation-app .zr-scope-list small, #renovation-app dl small { font-size: 12px; }
#renovation-app .zr-scope-list article>div>span { font-size: 13px; }
#renovation-app .zr-detail { font-size: 13px; line-height: 1.75; }
#renovation-app dl>div { font-size: 13px; }
#renovation-app .zr-dedup { background: #f0ede7; color: #514d46; border-radius: 0; font-size: 13px; }
#renovation-app .zr-report>p { font-size: 14px; }
#renovation-app .zr-export-links button, #renovation-app .zr-report-links button { color: #20211f; font-size: 13px; min-height: 36px; }
#renovation-app .zr-message { color: #514d46; font-size: 13px; }
#renovation-app .zr-error { color: #85432e; font-size: 13px; }
#renovation-app .zr-comparison-grid article>span, #renovation-app .zr-model-note p { font-size: 12px; }
#renovation-app .zr-comparison-grid article p { font-size: 13px; }

/* Planning: sober status panels, readable explanations, clear yes/no states. */
#planning-app .zp-progress button { color: #66615a; font-size: 13px; }
#planning-app .zp-progress button>span { border-color: #8b857b; }
#planning-app .zp-progress .is-current button>span { background: #20211f; color: #fff; border-color: #20211f; }
#planning-app .zp-progress .is-complete button>span { background: #e7e2d9; color: #20211f; border-color: #8b857b; }
#planning-app .zp-context, #planning-app .zp-context button,
#planning-app .zp-section-head button, #planning-app .zp-edit-row button { font-size: 13px; }
#planning-app .zp-choice { background: #fff; border-color: #aaa399; border-radius: 0; }
#planning-app .zp-choice:hover { background: #f0ede7; border-color: #66615a; }
#planning-app .zp-choice[aria-pressed=true] { background: #ebe6de; border-color: #20211f; box-shadow: inset 0 0 0 .5px #20211f; }
#planning-app .zp-choice>small, #planning-app .zp-nations .zp-choice>small { font-size: 12px; }
#planning-app .zp-house-types .zp-choice>span { font-size: 13px; }
#planning-app .zp-lookup, #planning-app .zp-measure-note { background: #f0ede7; color: #514d46; font-size: 13px; line-height: 1.75; }
#planning-app .zp-field { font-size: 13px; }
#planning-app .zp-field>input, #planning-app .zp-field>select { background: #fff; border-color: #8b857b; }
#planning-app .zp-field>small { font-size: 12px; }
#planning-app .zp-answers button { font-size: 13px; border-color: #8b857b; }
#planning-app .zp-answers button:hover { background: #eeeae2; }
#planning-app .zp-answers button[aria-pressed=true] { background: #20211f; color: #fff; border-color: #20211f; }
#planning-app .zp-callout { background: #f0ede7; border-color: #8b857b; color: #514d46; font-size: 14px; }
#planning-app .zp-primary { background: #20211f; color: #fff; border-color: #20211f; font-size: 14px; }
#planning-app .zp-primary:hover { background: #41413c; color: #fff; border-color: #41413c; }
#planning-app .zp-back, #planning-app .zp-text-button { color: #20211f; font-size: 13px; text-underline-offset: 4px; }
#planning-app .zp-back:hover, #planning-app .zp-text-button:hover { text-decoration: underline; }
#planning-app .zp-live { color: #66615a; font-size: 12px; }
#planning-app .zp-live:before { background: #776044; }
#planning-app .zp-nav small, #planning-app .zp-visual-note { font-size: 12px; }
#planning-app .zp-outcome { background: #f0ede7; border-color: #8b857b; }
#planning-app .zp-outcome-application { background: #f3e9df; border-color: #85432e; }
#planning-app .zp-outcome-review, #planning-app .zp-outcome-national { background: #efe9dd; border-color: #776044; }
#planning-app .zp-outcome p, #planning-app .zp-check p { font-size: 13px; line-height: 1.75; }
#planning-app .zp-check h3 { font-size: 14px; }
#planning-app .zp-check-heading>span { color: #66615a; font-size: 11px; }
#planning-app .zp-status-dot { background: #e7e2d9; color: #61513c; }
#planning-app .zp-check-pass .zp-status-dot { background: #e7e2d9; color: #20211f; }
#planning-app .zp-check-fail .zp-status-dot { background: #efddd1; color: #85432e; }
#planning-app .zp-next-steps { background: #f0ede7; }
#planning-app .zp-report-card p { font-size: 14px; }
#planning-app .zp-status { color: #85432e; font-size: 13px; }

/* Legacy calculator retained for saved / older links. */
#tools-app p { font-size: 15px; line-height: 1.75; }
#tools-app .zt-help { color: #66615a; font-size: 12px; }
#tools-app .zt-switch button[aria-selected=true] { background: #20211f; color: #fff; }
#tools-app .zt-switch button[aria-selected=true]>span { color: #e3dfd7; }
#tools-app .zt-switch button>span { font-size: 12px; }
#tools-app .zt-field input, #tools-app .zt-field select { background: #fff; border-color: #8b857b; font-size: 16px; }
#tools-app .zt-live { font-size: 11px; color: #66615a; }
#tools-app .zt-live:before { background: #776044; }
#tools-app .zt-total>span, #tools-app .zt-dim-total strong { color: #514d46; }
#tools-app .zt-breakdown, #tools-app .zt-line-items, #tools-app .zt-room, #tools-app .zt-part { border-color: #d7d4ce; }
#tools-app .zt-breakdown>div, #tools-app .zt-line { border-color: #d7d4ce; font-size: 13px; }
#tools-app .zt-breakdown small, #tools-app .zt-line small, #tools-app .zt-check small { color: #66615a; font-size: 12px; }
#tools-app .zt-primary { background: #20211f; color: #fff!important; font-size: 14px!important; }
#tools-app .zt-primary:hover { background: #41413c; color: #fff!important; }
#tools-app .zt-link { color: #20211f; border-color: #8b857b; font-size: 13px; }
#tools-app .zt-link:hover { background: #eeeae2; border-color: #20211f; }
#tools-app .zt-room-number { color: #66615a; }
#tools-app .zt-work-item, #tools-app .zt-extra-row { border-color: #d7d4ce; }
#tools-app .zt-rate-edit summary { color: #66615a; font-size: 12px; }
#tools-app .zt-add { color: #20211f; border-color: #8b857b; font-size: 13px!important; }
#tools-app .zt-add:hover { background: #eeeae2; }
#tools-app .zt-comparison-placeholder { background: #f0ede7; }
#tools-app .zt-comparison-placeholder>span { color: #66615a; }
#tools-app .zt-copy-fallback { border-color: #8b857b; }
#tools-app .zt-dim-preview { background: #f0ede7; }
#tools-app .zt-dim-preview text { fill: #66615a; }
#tools-app .zt-dim-apply { background: #e7e2d9; color: #20211f; border-color: #8b857b; font-size: 13px!important; }
#tools-app .zt-error-small { color: #85432e!important; }
#tools-app.zt-on-screen .zt-mobile-budget { background: #20211f; color: #fff; border-color: #8b857b; }
#tools-app.zt-on-screen .zt-mobile-budget span { color: #e3dfd7; font-size: 11px; }

/* Disabled controls stay legible; no transparency washing out labels. */
.button:disabled, .btn:disabled, .filter:disabled,
#extension-app .xe-next:disabled, #extension-app .xe-contact:disabled,
#renovation-app button.zr-primary:disabled, #renovation-app button.zr-outline:disabled,
#planning-app .zp-primary:disabled, #planning-app .zp-answers button:disabled,
#tools-app .zt-primary:disabled {
  background: #e7e2d9; color: #66615a!important; border-color: #aaa399!important;
  opacity: 1; cursor: not-allowed; box-shadow: none;
}
#extension-app button:disabled, #renovation-app button:disabled,
#planning-app button:disabled, #tools-app button:disabled { opacity: 1; cursor: not-allowed; }

/* Compact layouts keep useful labels readable without expanding the page. */
@media (max-width: 1180px) and (min-width: 981px) {
  .header nav { gap: 18px; font-size: 12px; }
  .nav-cta { padding-inline: 12px; }
}
@media (max-width: 980px) {
  .header nav { font-size: 17px; }
}
@media (max-width: 760px) {
  .hero-aside p, .page-head-grid .lede, .cta p, .contact-aside>p { font-size: 15px; }
  .article-section p, .prose p { font-size: 16px; }
  .guide-article>.lede { font-size: 18px; }
  .button { padding-inline: 20px; gap: 22px; }
  .text-link { font-size: 13px; }
  .hero-tool strong { font-size: 14px; }
  .hero-tool small { font-size: 11px; }
  .tool-hub-notes { font-size: 12px; }
  .tool-page .tool-local-nav>div>a { font-size: 12px; }
  #extension-app .xe-context, #extension-app .xe-text { font-size: 12px!important; }
  #extension-app .xe-project-tabs>[role=tab], #extension-app .xe-substeps button { font-size: 12px; padding-inline: 10px; }
  #extension-app .xe-substeps { flex-wrap: wrap; }
  #extension-app .xe-choice small { font-size: 12px; }
  #extension-app .xe-budget-peek>span, #extension-app .xe-dock-action>small { font-size: 11px; }
  #extension-app .xe-next { font-size: 13px!important; padding-inline: 15px; }
  #extension-app .xe-totals>div { font-size: 13px; }
  #renovation-app .zr-progress button, #planning-app .zp-progress button,
  .tool-page #renovation-app .zr-progress button, .tool-page #planning-app .zp-progress button { font-size: 12px; }
  #renovation-app .zr-room-choice strong { font-size: 13px; }
  #renovation-app .zr-room-top .zr-text { font-size: 12px; }
  #renovation-app .zr-presets strong { font-size: 12px; }
  #renovation-app .zr-presets small { font-size: 11px; }
  #planning-app .zp-progress { gap: 8px; }
  #planning-app .zp-progress button { gap: 5px; }
  #planning-app .zp-house-types .zp-choice>span { font-size: 12px; }
  #planning-app .zp-nations .zp-choice>span { font-size: 14px; }
  #planning-app .zp-check-heading { flex-wrap: wrap; gap: 4px 8px; }
  #planning-app .zp-check-heading>span { white-space: normal; }
}
@media (max-width: 390px) {
  #extension-app .xe-dock { gap: 12px; }
  #extension-app .xe-dock-action { min-width: 125px; max-width: 155px; }
  #extension-app .xe-budget-peek strong { font-size: 18px; }
  #extension-app .xe-project-tabs { flex-wrap: wrap; }
  #planning-app .zp-progress button, .tool-page #planning-app .zp-progress button { gap: 4px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  a, button { transition: none; }
}
@media print {
  body, #extension-app, #renovation-app, #planning-app, #tools-app { background: #fff; color: #20211f; }
  .article-section p, .prose p { color: #20211f; }
}