/* QXter V76: text follows its local surface, independently of the page scene.
   Keep image artwork, the full-page canvas and trade colours intact. */
:root {
  --qx-text:#142e49;
  --qx-text-secondary:#425a73;
  --qx-paper:#f5f2eb;
  --qx-reading:#f4f6fa;
  --qx-text-on-dark:#f5f7ff;
  --qx-secondary-on-dark:#d6e1f7;
  --qx-link:#174e87;
  --qx-focus:#1967b8;
  --qx-font-ui:'Inter','Noto Sans TC','PingFang TC','Microsoft JhengHei',sans-serif;
}
body[data-page],body.studio-body {font-family:var(--qx-font-ui);font-synthesis:none;text-rendering:optimizeLegibility}
body[data-page] :is(button,input,select,textarea),body.studio-body :is(button,input,select,textarea) {font-family:var(--qx-font-ui)}
body[data-page] :is(h1,h2,h3,h4),body.studio-body :is(h1,h2,h3,h4) {font-family:var(--qx-font-ui);letter-spacing:-.025em}
body[data-page]:not([data-page="/"]) main {--canvas-ink:var(--qx-text-on-dark);--canvas-muted:var(--qx-secondary-on-dark)}
/* Existing pale panels must establish a local text context too. Nested notes,
   photo overlays and calls to action establish their own context below. */
body[data-page][data-trade]:not([data-page="/"]) main :is(
  .contact,.contact-page,.tainan-path-grid article,.tainan-course-grid article,
  .tainan-course-note,.tainan-address,.department-card,.person-focus li,
  .instructor-photo-grid figure,.instructor-film,.liu-story-grid article,
  .course-schedule-gallery figure,.seo-related,.knowledge-grid article,
  .video-card,.material-note,.field-board,.class-card,.course-panel,
  .product-body,.course-body,.about-base aside,.course-teachers,.department-about,
  .offering-body,.archive-body,.enrollment-panel,.shop-empty,.faq,.level-stage,
  .offering-card,.resource-feature,.archive-card,.journal-card,.teacher-card,
  .course-videos,.offering-facts,.offering-cities>div,.offering-summary,
  .about-principles article,.teaching-base-card,.base-card,.reading,
  .archive-controls,.archive-sidebar,.search-panel,.search-results,.enrollment-card
) {
  --canvas-ink:var(--qx-text);--canvas-muted:var(--qx-text-secondary);
  color:var(--qx-text);background-color:var(--qx-reading)!important;
}
body[data-page][data-trade]:not([data-page="/"]) main :is(.person-highlights li,.teacher-specialties li,.notice,.offering-empty,.archive-notice) {
  --canvas-ink:var(--qx-text);--canvas-muted:var(--qx-text-secondary);
  color:var(--qx-text)!important;
}
body[data-page][data-trade]:not([data-page="/"]) main :is(.teaching-base-hero,.person-portrait,.instructor-film-frame,.experience-hero .offering-hero-note,.experience-hero .enrollment-note,.experience-hero .registration-base-choices) {
  --canvas-ink:var(--qx-text-on-dark);--canvas-muted:var(--qx-secondary-on-dark);
}
body[data-page][data-trade]:not([data-page="/"]) main :is(h1,h2,h3,h4,dt,dd,summary,legend,figcaption,strong,b) {color:var(--canvas-ink)!important}
body[data-page][data-trade]:not([data-page="/"]) main :is(p,.intro,.eyebrow,small,time,.material-text,.trade-link-window) {color:var(--canvas-muted)!important}
body[data-page][data-trade]:not([data-page="/"]) main a:not(.button):not(.enrollment-form-link) {color:var(--canvas-ink)}
body[data-page][data-trade]:not([data-page="/"]) main :is(.person-focus li,.course-schedule-gallery figcaption,.seo-related a,.instructor-film a:not(.button),.reading .intro,.reading .eyebrow) {color:var(--canvas-ink)!important}
/* Contact information occupies the full reading panel, rather than an empty
   second grid column; text measure stays comfortable on wide screens. */
body[data-page="/contact/"] main .contact-page {grid-template-columns:minmax(0,1fr);border-radius:28px 42px 26px 36px;padding:clamp(26px,4vw,52px)}
body[data-page="/contact/"] main .contact-page>div {max-width:800px}
body[data-page="/contact/"] main .contact-page p {max-width:70ch}
body[data-page] main :is(.notice,.offering-note,.level-note,.teacher-assignment) {font-size:16px!important;line-height:1.85}
body[data-page] main :is(.archive-meta,.archive-source-note,.journal-meta,.journal-tags,.archive-tags,.course-video-meta,.resource-visual figcaption,.instructor-film-attribution,.instructor-film-help) {font-size:14px;line-height:1.75}
body[data-page] :is(.eyebrow,.site-copyright),body.studio-body :is(.eyebrow,.studio-footer,.studio-sidebar-bottom p,.studio-workflow small) {font-size:12px!important;line-height:1.7}
body[data-page] main :is(input,select,textarea) {font-size:17px;line-height:1.6;color:var(--qx-text);background-color:#fff}
body[data-page] main :is(input,textarea)::placeholder,body.studio-body :is(input,textarea)::placeholder {color:#52677d;opacity:1}
body[data-page] main :is(.enrollment-panel,.search-panel) label {color:var(--qx-text);font-size:16px;font-weight:600}
body[data-page] main a.text-link {text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em}
body[data-page] :is(a,button,input,select,textarea,summary):focus-visible {outline:3px solid #79b9ff;outline-offset:4px}
body[data-page] main :is(.reading,.enrollment-panel,.search-panel,.contact-page) :is(a,button,input,select,textarea,summary):focus-visible {outline-color:var(--qx-focus)}
body[data-page] main :is(a.button,button.button):disabled {opacity:1;background:#dce2ea!important;color:#49586c!important;border-color:#a8b6c6!important;cursor:not-allowed;box-shadow:none}
/* Admin uses the same family and a compact, readable scale. */
body.studio-body {font-size:17px;line-height:1.75;--muted:var(--studio-muted);--navy:var(--studio-ink)}
body.studio-body :is(.studio-panel,.intake-editor,.management-card,.studio-gate,.studio-session-pending,.studio-course,.intake-card,.intake-toolbar) {--studio-ink:var(--qx-text);--studio-muted:var(--qx-text-secondary);color:var(--studio-ink)}
body.studio-body :is(.studio-stat,.studio-quick-actions>.studio-panel) {--studio-ink:var(--qx-text-on-dark);--studio-muted:var(--qx-secondary-on-dark)}
body.studio-body :is(.studio-panel,.studio-course,.studio-gate,.intake-card,.intake-editor,.management-card) :is(h1,h2,h3,h4,legend,label,strong) {color:var(--studio-ink)}
body.studio-body :is(.studio-panel,.studio-course,.studio-gate,.intake-card,.intake-editor,.management-card) :is(p,small,dt,.studio-field-help) {color:var(--studio-muted)}
body.studio-body :is(.form-grid label,.intake-field,.management-toolbar label,.studio-course-filters label) {font-size:16px;line-height:1.65}
body.studio-body :is(input,select,textarea) {font-size:17px;line-height:1.6;min-height:52px;background:#fff;color:var(--qx-text)}
body.studio-body :is(.button,button.button) {font-size:16px;line-height:1.5;min-height:48px}
body.studio-body .studio-workflow strong {font-size:16px}
body.studio-body .studio-course small {font-size:14px;line-height:1.65}
body.studio-body .studio-editor-actions {--studio-ink:var(--qx-text);--studio-muted:var(--qx-text-secondary)}
body.studio-body .studio-editor-actions span {color:var(--qx-text-secondary);font-size:14px}
body.studio-body .studio-skip:focus {color:var(--qx-text);background:#fff}
body.studio-body :is(input,select,textarea):focus-visible {outline:3px solid var(--qx-focus);outline-offset:3px}
@media(max-width:760px) {
 body[data-page] main :is(input,select,textarea),body.studio-body :is(input,select,textarea) {font-size:16px}
 body[data-page] main :is(.notice,.offering-note,.level-note,.teacher-assignment) {font-size:15px!important}
 body.studio-body .studio-workflow strong {font-size:15px}
 body.studio-body :is(.button,button.button) {font-size:16px}
}
body[data-page][data-trade]:not([data-page="/"]) main :is(.learning-unit,.about-jump a) {--canvas-ink:var(--qx-text);--canvas-muted:var(--qx-text-secondary);color:var(--qx-text)}
body[data-page][data-trade]:not([data-page="/"]) main .experience-hero .tainan-address {--canvas-ink:var(--qx-text-on-dark);--canvas-muted:var(--qx-secondary-on-dark);background:#07152de8!important;color:var(--canvas-ink)}
body[data-page][data-trade]:not([data-page="/"]) main .experience-hero .tainan-address :is(p,.eyebrow,.tainan-fine-print) {color:var(--canvas-muted)!important}
body[data-page][data-trade] main .button {background:#edf2fc!important;color:#142e49!important;border-color:#9bacc4!important}
body[data-page][data-trade] main .button.primary {background:#142e49!important;color:#fff!important;border-color:#142e49!important}
body[data-page][data-trade] main :is(.experience-hero,.flow-hero,.offering-callout,.flow-department,.trade-collaboration,.yeto-context) .button.primary {background:var(--scene-soft)!important;color:#142e49!important;border-color:var(--scene-soft)!important}
body[data-page][data-trade] main .button :is(span,strong,b,small) {color:inherit!important}
body[data-page][data-trade]:not([data-page="/"]) main .about-jump a {color:#142e49!important}
body[data-page] main small {font-size:12px!important;line-height:1.7}
body[data-page] main :is(.archive-tags span,.archive-card-tags span,.journal-tags span,.archive-filter,.archive-count,.offering-tags span,.department-level-tags span) {font-size:13px!important;line-height:1.75}
body[data-page] main :is(.resource-visual figcaption,.archive-date,.course-video-tags span,.instructor-gallery-hint) {font-size:14px!important;line-height:1.75}

body[data-page][data-trade]:not([data-page="/"]) main .experience-hero .archive-notice {color:var(--qx-text-secondary)!important;font-size:16px;line-height:1.85}
body[data-page][data-trade]:not([data-page="/"]) main .directory-location-link>span {color:var(--canvas-muted)!important}
body[data-page]>header .brand-name small {font-size:12px;letter-spacing:.03em}
body[data-page] main :is(.offering-index,.teaching-base-image-label) {font-size:12px!important}
body.studio-body .studio-skip {color:var(--qx-text-on-dark)}

body[data-page][data-trade]:not([data-page="/"]) main .archive-sidebar a.button.primary {color:#fff!important;background:#142e49!important}
body[data-page][data-trade]:not([data-page="/"]) main .reading a.button.primary {color:#fff!important;background:#142e49!important}
body[data-page] #crane-native :is(.qxc-cover-scene figcaption span,.qxc-cover-proof a,.qxc-opening>p,.qxc-edge label) {font-size:12px!important}
body[data-page][data-trade]:not([data-page="/"]) main .seo-related a.button.primary {color:#fff!important;background:#142e49!important}

body[data-page][data-trade]:not([data-page="/"]) main .archive-video {--canvas-ink:var(--qx-text);--canvas-muted:var(--qx-text-secondary);color:var(--qx-text)}
body[data-page][data-trade]:not([data-page="/"]) main .experience-hero .tainan-address address {color:var(--qx-text-on-dark)!important}
body[data-page][data-trade]:not([data-page="/"]) main .experience-hero .tainan-address a.button {color:#142e49!important;background:#edf2fc!important}
body[data-page] #crane-native :is(.qxc-cover-scene figcaption a,.qxc-edge button,.qxc-edge a) {font-size:12px!important}
body[data-page][data-trade] main .resource-feature .eyebrow {font-size:12px!important}
body[data-page][data-trade] main :is(.enrollment-steps b,.form-grid label>span) {font-size:12px!important}
body[data-page] main :is(.flow-course-state,.teaching-base-kicker span) {font-size:12px!important}
body[data-page] #crane-native .qxc-cover-copy>p:first-child {font-size:14px!important}
/* Imported post titles can contain an unbroken social URL. */
body[data-page][data-trade]:not([data-page="/"]) main :is(h1,h2,h3,p,a,dd,address) {overflow-wrap:anywhere}
body[data-page][data-trade]:not([data-page="/"]) main>.archive-article-heading.experience-hero {padding-inline:40px!important}
@media(max-width:760px) {body[data-page][data-trade]:not([data-page="/"]) main>.archive-article-heading.experience-hero {padding-inline:22px!important}}
/* Keep the brightest raster highlights behind dark tint, not behind copy. */
body[data-page][data-trade]:not([data-page="/"])::before {background-image:linear-gradient(#030a1c94,#030a1c94),var(--scene)}
body.studio-body::before {background-image:linear-gradient(#030a1c94,#030a1c94),url('/assets/course-art/fluid-navy.webp')}
body[data-page][data-trade] main :is(h1,h2,h3,h4),body[data-page] #teaching-bases-heading {font-family:var(--qx-font-ui)!important;font-weight:700;letter-spacing:-.025em}
body[data-page][data-trade] main :is(.teaching-bases-heading>p,.teaching-base-official,.teaching-base-description) {font-family:var(--qx-font-ui)!important;letter-spacing:.01em}
body[data-page] main .teaching-base-kicker {font-size:12px!important;letter-spacing:.12em}
body.studio-body .studio-main .eyebrow {color:var(--studio-muted)!important}
/* The course-art preview is a dark island inside a pale editor panel. */
body.studio-body .studio-course-appearance {--studio-ink:#f5f7ff;--studio-muted:#d6e1f7;color:var(--studio-ink)}
body.studio-body .studio-course-appearance :is(h3,p) {color:var(--studio-ink)!important}
body.studio-body .studio-course-appearance .studio-appearance-kicker {font-size:12px;color:var(--studio-muted)!important}
body.studio-body .studio-image {font-size:13px;line-height:1.65}
body[data-page]>header .department-menu .flow-menu-item small {font-size:12px;line-height:1.6}