/* sk-ui-v1.css — shakalakaa UI layer, v422.
   Loaded AFTER skweb-page-css-v1.2.0.css so it wins the cascade on its own
   selectors without !important. Never merge into the skweb files:
   scripts/refresh-skweb-css.sh re-pulls those from plixitt.com.

   v422 §4.3: color-scheme:light is declared on :root so browsers do not
   flip form controls, scrollbars and system surfaces to dark against
   light page chrome. Do not add @media (prefers-color-scheme:dark) blocks.

   v423 D-5 blast radius note: this stylesheet loads on 256 files (via
   default-header-sections.php) including 42 CJK pages. Component classes
   (.sk-*) only apply where they are set; the color-scheme declaration
   is the one deliberately-global rule. Per v423 T-5.2 (Part 129) this
   file MUST NOT carry bare element selectors (p, h2, ul, li, a, table,
   img, body) outside a .sk- scope.
*/

:root{
  --sk-ink:#193340;                 /* 13.2:1 on white */
  --sk-ink-82:rgba(25,51,64,.82);   /* 7.3:1  — emphasis */
  --sk-ink-70:rgba(25,51,64,.70);   /* 5.0:1  — body floor */
  --sk-ink-67:rgba(25,51,64,.67);   /* 4.6:1  — caption floor, smallest text token */
  --sk-ink-45:rgba(25,51,64,.45);   /* 2.6:1  — NON-TEXT ONLY: rules, dividers, icon strokes */

  --sk-accent:#1f8adf;              /* NON-TEXT ONLY: fills, icons, borders, rules */
  --sk-accent-text:#1e77bc;         /* accent used AS TEXT — 4.8:1 on white */
  --sk-accent-solid:#1e7ac2;        /* accent BEHIND white text — 4.6:1 */
  --sk-accent-tint:rgba(31,138,223,.06);
  --sk-accent-line:rgba(31,138,223,.22);

  --sk-surface:#ffffff;
  --sk-surface-2:#f8fafc;
  --sk-rule:#e5e7eb;
  --sk-radius:14px;
  --sk-gap:clamp(1rem,2.4vw,1.75rem);
  --sk-measure:68ch;

  color-scheme:light;               /* v422 §4.3 */
}

/* ---- Prose layer (v422 §3 T1.2) ----
   .sk-prose does not replace .blog-content. Both coexist; market-service.php
   gets class="blog-content sk-prose" so existing rules still apply and .sk-prose
   narrows measure and adjusts rhythm on top. */

.sk-prose{max-width:var(--sk-measure);font-weight:300;color:var(--sk-ink-70);background:transparent;}
.sk-prose p{font-size:clamp(1rem,.95rem + .2vw,1.075rem);line-height:1.75;margin:0 0 1.15em;}
.sk-prose h2{font-size:clamp(1.4rem,2.8vw,1.9rem);font-weight:900;text-transform:uppercase;
  letter-spacing:-.03em;color:var(--sk-ink);margin:2.75rem 0 1rem;}
.sk-prose h3{font-size:clamp(1.05rem,1.8vw,1.25rem);font-weight:800;color:var(--sk-ink);margin:2rem 0 .65rem;}
.sk-prose ul{list-style:disc;margin:.75rem 0 1.5rem 1.35rem;}
.sk-prose li{font-size:clamp(1rem,.95rem + .2vw,1.075rem);line-height:1.7;margin-bottom:.55rem;}
.sk-prose a{color:var(--sk-accent-text);font-weight:600;text-decoration:underline;
  text-underline-offset:.18em;text-decoration-thickness:.06em;}
.sk-prose strong{color:var(--sk-ink-82);font-weight:700;}
.sk-prose > *:first-child{margin-top:0;}

/* ---- v423 D-7 T-7.1 CJK typography guard ----
   42 pages under /zh/ and /zh-hant/ receive this stylesheet via
   default-header-sections.php. --sk-measure:68ch is wrong for CJK (yields
   ~34 chars for Han glyphs); em is full-width-safe. Line-height needs to be
   larger for Han ink density; italics and negative letter-spacing are wrong
   for Han. Scoped by both :lang() and attribute selector because :lang()
   alone has been unreliable where a partial re-declares lang mid-document.
   v423 T-7.3: NO CJK page is populated with components in v422 — the guard
   exists so the stylesheet arriving on those 42 pages is harmless. */
:lang(zh) .sk-prose,
[lang^="zh"] .sk-prose{
  --sk-measure:40em;
  line-height:1.95;
}
:lang(zh) .sk-prose p,
[lang^="zh"] .sk-prose p{line-height:1.95;}
:lang(zh) .sk-prose h2, :lang(zh) .sk-prose h3,
[lang^="zh"] .sk-prose h2, [lang^="zh"] .sk-prose h3{letter-spacing:0;}
:lang(zh) .sk-figure figcaption,
[lang^="zh"] .sk-figure figcaption{font-style:normal;}

/* ---- :focus-visible per v422 §4.5 ---- */
.sk-prose a:focus-visible,
.sk-tldr a:focus-visible,
.sk-card a:focus-visible,
.sk-btn:focus-visible{outline:2px solid var(--sk-accent-text);outline-offset:2px;}

/* ---- Reduced motion per v422 §4.5 ---- */
@media (prefers-reduced-motion:reduce){
  .sk-prose *,
  .sk-tldr *,
  .sk-card *,
  .sk-stat *,
  .sk-callout *{transition:none !important;animation:none !important;}
}
