/* Shared fixes both directions need: replaces kit v0.1 hardcoded colors,
   calms shadows and pills, and hides prototype chrome in review mode. */
@layer canary.theme {
  [data-theme] .cn-root{font-size:17px;line-height:1.6;color:var(--ink);background:var(--surface);font-feature-settings:"kern","liga"}
  [data-theme] .cn-root :focus-visible{outline:3px solid var(--color-primary);outline-offset:3px}
  [data-theme] .cn-lead{font-size:18px;line-height:1.55}

  /* surfaces: re-pointed to roles; muted text tuned per surface for contrast */
  [data-theme] .cn-surface{--surface-bg:var(--surface);--surface-heading:var(--color-primary);--surface-text:var(--ink);--surface-muted:var(--ink-muted);--surface-accent:var(--color-primary);--surface-line:var(--line);--card-bg:var(--surface-raised);
    --btn-primary-bg:var(--color-accent);--btn-primary-hover:var(--color-accent-hover);--btn-primary-text:var(--color-accent-ink);--btn-outline:var(--color-primary)}
  [data-theme] .cn-surface[data-surface="forest"],[data-theme] .cn-surface[data-surface="footer"],[data-theme] .cn-utility{--surface-bg:var(--color-primary);--surface-heading:#FFFFFF;--surface-text:#EEF1F6;--surface-muted:#C3CCDB;--surface-accent:var(--color-accent);--surface-line:rgba(255,255,255,.14);--btn-outline:#FFFFFF;--card-bg:rgba(255,255,255,.05)}
  [data-theme] .cn-surface[data-surface="footer"]{--surface-bg:var(--color-primary-strong)}

  /* buttons: rounded rectangles, not pills; quiet motion */
  [data-theme] .cn-btn{border-radius:var(--radius-md);font-weight:650;letter-spacing:.005em;transition:background-color var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease),transform var(--dur-1) var(--ease)}
  [data-theme] .cn-btn:active{transform:translateY(1px)}
  [data-theme] .cn-btn--outline{border-width:1.5px}
  [data-theme] .cn-btn--primary .cn-icon{transition:transform var(--dur-2) var(--ease)}
  [data-theme] .cn-btn--primary:hover .cn-icon{transform:translateX(3px)}

  /* two-column tables fit a phone; numbers right-aligned */
  [data-theme] .cn-table:not(:has(th:nth-child(3))){min-width:0}
  [data-theme] .cn-table:not(:has(th:nth-child(3))) :is(th,td):last-child{text-align:right;white-space:nowrap}

  /* 3+ column tables stack into rows on phones (labels come from the header) */
  @media (max-width:599px){
    [data-theme] .cn-table--stack{min-width:0}
    [data-theme] .cn-table--stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
    [data-theme] .cn-table--stack tr{display:grid;gap:6px;padding:14px 16px;border-bottom:1px solid var(--surface-line)}
    [data-theme] .cn-table--stack tr:last-child{border-bottom:0}
    [data-theme] .cn-table--stack td{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:0;border:0}
    [data-theme] .cn-table--stack td:first-child{display:block;font-weight:700;margin-bottom:2px}
    [data-theme] .cn-table--stack td:not(:first-child)::before{content:attr(data-label);font-size:12px;line-height:20px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--surface-muted)}
    [data-theme] .cn-table--stack td:nth-child(2){color:var(--surface-heading);font-weight:600}
  }

  /* numbers line up */
  [data-theme] .cn-price__fig,[data-theme] .cn-booking__time,[data-theme] .cn-table{font-variant-numeric:tabular-nums lining-nums}

  /* kit v0.1 hardcoded hexes -> roles */
  [data-theme] .cn-price{background:var(--surface-raised);border:1px solid var(--line)}
  [data-theme] .cn-price__line{max-width:none}
  [data-theme] .cn-booking{background:var(--surface-raised);border:1px solid var(--line)}
  [data-theme] .cn-booking__icon{color:var(--color-primary)}
  [data-theme] .cn-booking__alt-btn{color:var(--color-primary);text-decoration-color:color-mix(in srgb,var(--color-primary) 30%,transparent)}
  @media (min-width:960px){[data-theme] .cn-booking__actions{border-left-color:var(--line)}}
  [data-theme] .cn-tile{border:1px solid var(--line-strong);border-radius:var(--radius-md)}
  [data-theme] .cn-tile:has(input:checked){border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary)}
  [data-theme] .cn-addon{border:1px solid var(--line)}
  [data-theme] .cn-addon:has(input:checked){border-color:var(--color-primary);background:var(--color-primary-soft)}
  [data-theme] .cn-benefit .cn-icon,[data-theme] .cn-trustline .cn-icon{color:var(--color-primary)}
  [data-theme] .cn-surface[data-surface="forest"]:not(#reviews-our-work) .cn-benefit .cn-icon{color:var(--color-accent)}
  [data-theme] .cn-gallery__badge{border-radius:var(--radius-sm);background:var(--color-primary);color:#fff;font-size:13px;padding:6px 10px 6px 8px}
  [data-theme] .cn-gallery__badge .cn-icon{width:18px;height:18px}
  [data-theme] .cn-stars--empty{opacity:.35}
  [data-theme] .cn-sticky{background:color-mix(in srgb,var(--surface-raised) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line)}

  /* image placeholders: calm tinted frames; spec text only in Specs mode */
  [data-theme] .cn-ph{--ph-bg:var(--surface-2);outline:0;background-image:none}
  [data-theme] .cn-surface[data-surface="forest"]:not(#reviews-our-work) .cn-ph{--ph-bg:rgba(255,255,255,.06)}
  [data-theme][data-cn-specs="off"] .cn-ph__card{background:transparent;box-shadow:none;padding:0}
  [data-theme][data-cn-specs="off"] .cn-ph__row,[data-theme][data-cn-specs="off"] .cn-ph__pri,[data-theme][data-cn-specs="off"] .cn-ph__id{display:none}
  [data-theme][data-cn-specs="off"] .cn-ph__name{font:500 12px/16px var(--font-sans);color:var(--ink-muted);letter-spacing:.02em;text-align:center}
  [data-theme][data-cn-specs="off"] .cn-ph__mini{display:none}

  /* review mode: hide the prototype toolbar */
  [data-theme]:not([data-dev]) .cn-dev{display:none!important}

  /* the stand-in wordmark (real logo is a commissioned asset) */
  [data-theme] .cn-wordmark{display:inline-grid;line-height:1;color:var(--color-primary);text-decoration:none}
  [data-theme] .cn-wordmark b{font-family:var(--font-display);font-weight:inherit}
  [data-theme] .cn-wordmark i{font-style:normal;font-family:var(--font-sans)}
  [data-theme] .cn-surface[data-surface="footer"] .cn-wordmark{color:#fff}
}