/* Page color roles only; reusable component variants below do not name a skill. */
.is-style-skill-gongwen { --hub-page:#f4f0e7;--hub-paper:#fffdf8;--hub-ink:#202722;--hub-muted:#5e665f;--hub-accent:#a63d32;--hub-accent-hover:#8e3028;--hub-accent-soft:#f5e8e3;--hub-green:#527f70;--hub-green-text:#466f61;--hub-green-soft:#e7f0eb;--hub-line:#d8d0c2;--hub-accent-light:#e6a79f; }
.is-style-skill-wensheng { --hub-page:#fff;--hub-paper:#fff;--hub-ink:#0f1f1c;--hub-muted:#5b6b67;--hub-accent:#0e7c6b;--hub-accent-hover:#0b6457;--hub-accent-soft:#e2f2ee;--hub-green:#0e7c6b;--hub-green-text:#0b6457;--hub-green-soft:#e2f2ee;--hub-line:#e3eae8;--hub-accent-light:#f2a93b;--hub-surface:#f4f7f6; }
.is-style-skill-kaikoudu { --hub-page:#fff;--hub-paper:#fff;--hub-ink:#1d1715;--hub-muted:#6b605b;--hub-accent:#e0582f;--hub-accent-hover:#c4441f;--hub-accent-soft:#ffe9df;--hub-green:#c4441f;--hub-green-text:#c4441f;--hub-green-soft:#ffe9df;--hub-line:#f0e2da;--hub-accent-light:#ff8a5c;--hub-surface:#fff6f1; }
:is(.is-style-skill-gongwen,.is-style-skill-wensheng,.is-style-skill-kaikoudu) {
 --wp--preset--color--page:var(--hub-page);--wp--preset--color--paper:var(--hub-paper);--wp--preset--color--ink:var(--hub-ink);--wp--preset--color--muted:var(--hub-muted);--wp--preset--color--accent:var(--hub-accent);--wp--preset--color--accent-soft:var(--hub-accent-soft);--wp--preset--color--green:var(--hub-green-text);--wp--preset--color--line:var(--hub-line);
 --hub-font-ui:var(--wp--custom--font--ui,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif);
 --hub-font-paper:var(--wp--custom--font--paper,"Songti SC","STSong","SimSun",serif);
 --hub-content-width:1180px;--hub-reading-width:680px;--hub-radius-card:20px;--hub-radius-small:12px;
 --hub-shadow-paper:0 20px 60px rgb(66 53 39 / 10%);--hub-shadow-card:0 10px 28px rgb(66 53 39 / 7%);
 color:var(--hub-ink);background:var(--hub-page);font-family:var(--hub-font-ui);font-size:16px;line-height:1.65;
}
body.skills-hub-blocks { margin:0;min-width:320px;padding-bottom:96px;overflow-x:hidden;color:var(--hub-ink);background:var(--hub-page);text-rendering:optimizeLegibility; }
.skills-hub-canvas { margin:0; }
.skills-hub-canvas > .wp-block-group { margin:0;padding:0; }
.skills-hub-canvas *, .editor-styles-wrapper :is(.is-style-skill-gongwen,.is-style-skill-wensheng,.is-style-skill-kaikoudu) * { box-sizing:border-box; }
:is(.skills-hub-canvas,.editor-styles-wrapper) :is(.hub-section,.hub-hero) { width:100%;max-width:none;margin:0;padding-inline:max(22px,env(safe-area-inset-left)); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .hub-section { padding-top:72px;padding-bottom:72px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .hub-section > * { width:min(100%,var(--hub-content-width));margin-inline:auto; }
:is(.skills-hub-canvas,.editor-styles-wrapper) :is(.hub-section,.hub-hero) :is(h1,h2,h3,p) { overflow-wrap:anywhere; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-hero { position:relative;min-height:92vh;padding-bottom:72px;overflow:hidden;background:linear-gradient(180deg,rgb(255 253 248 / 75%),transparent 70%),var(--hub-page); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-hero::after { position:absolute;right:-7rem;top:6rem;width:20rem;height:20rem;border:1px solid rgb(166 61 50 / 13%);border-radius:50%;content:"";pointer-events:none; }
:is(.skills-hub-canvas,.editor-styles-wrapper) :is(.is-style-hub-site-header,.is-style-hub-hero-layout) { width:min(100%,var(--hub-content-width));margin-inline:auto; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-site-header { display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-site-header > * { margin:0; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-brand { margin:0;font-size:15px;font-weight:800; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-brand a { display:inline-flex;align-items:center;gap:10px;color:var(--hub-ink);text-decoration:none; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .hub-brand-mark { display:grid;width:38px;height:38px;place-items:center;border-radius:10px;color:var(--hub-paper);background:var(--hub-accent);font-family:var(--hub-font-paper);font-size:20px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-hero-layout { position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr);gap:48px;align-items:center;padding-top:44px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-hero-layout > * { margin:0;min-width:0; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-eyebrow { margin:0 0 14px;color:var(--hub-accent);font-size:13px;font-weight:800;letter-spacing:.08em; }
:is(.skills-hub-canvas,.editor-styles-wrapper) :is(.is-style-hub-hero-title,.hub-hero h1) { max-width:760px;margin:0;font-size:clamp(38px,10vw,72px);line-height:1.08;letter-spacing:-.01em;font-weight:700;overflow-wrap:normal;word-break:normal;line-break:strict;text-wrap:initial; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .hub-nowrap { white-space:nowrap; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-hero-lead { max-width:650px;margin:24px 0 0;color:var(--hub-muted);font-size:clamp(17px,4.5vw,21px); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-actions { display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px;margin-top:30px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-actions > * { margin:0; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .wp-block-button__link { display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border:1px solid transparent;border-radius:999px;font-weight:800;line-height:1.2;text-decoration:none;cursor:pointer;transition:transform 180ms ease,background-color 180ms ease,border-color 180ms ease; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .wp-block-button__link:hover { transform:translateY(-2px); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-capsule-primary .wp-block-button__link { color:#fffdf8;background:var(--hub-accent);box-shadow:0 12px 28px rgb(166 61 50 / 20%); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-capsule-primary .wp-block-button__link:hover { background:var(--hub-accent-hover); }
:is(.skills-hub-canvas,.editor-styles-wrapper) :is(.is-style-hub-capsule-secondary,.is-style-hub-capsule-quiet) .wp-block-button__link { color:var(--hub-ink);border-color:var(--hub-line);background:rgb(255 253 248 / 68%); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-promises { display:flex;flex-wrap:wrap;gap:10px 18px;padding:0;margin:26px 0 0;color:var(--hub-muted);font-size:14px;list-style:none; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-promises li::before { margin-right:7px;color:var(--hub-green);content:"✓";font-weight:900; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-document-preview { position:relative;width:min(100%,560px);margin-inline:auto; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-document-paper { position:relative;padding:clamp(24px,6vw,50px);border:1px solid var(--hub-line);border-radius:4px;color:#242824;background:var(--hub-paper);box-shadow:var(--hub-shadow-paper);font-family:var(--hub-font-paper);transform:rotate(1.2deg); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-document-paper p { margin:10px 0; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-paper-title { margin:16px 0 24px;font-family:var(--hub-font-paper);font-size:clamp(23px,5.5vw,34px);line-height:1.32;text-align:center;font-weight:700; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-paper-number { text-align:center; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-paper-indent { text-indent:2em; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-paper-heading { font-family:var(--hub-font-ui);font-weight:800; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-paper-signature { display:grid;justify-items:end;gap:4px;margin-top:28px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-paper-signature p { margin:0; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-paper-caption { margin-top:20px!important;color:var(--hub-muted);font-family:var(--hub-font-ui);font-size:12px;text-align:center; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-document-preview::after { position:absolute;right:-4px;bottom:-18px;display:grid;width:72px;height:72px;place-items:center;border:2px solid var(--hub-accent);color:var(--hub-accent);background:rgb(255 253 248 / 92%);font-family:var(--hub-font-paper);font-weight:800;line-height:1.1;text-align:center;white-space:pre;content:"格式\A已校";transform:rotate(-8deg);pointer-events:none; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-heading { max-width:var(--hub-reading-width);margin-bottom:34px;text-align:center; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-heading h2 { margin:0;font-size:clamp(30px,8vw,48px);line-height:1.18;letter-spacing:-.03em;font-weight:700; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-heading > p:last-child { margin:18px 0 0;color:var(--hub-muted);font-size:17px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-heading-left { text-align:left; }
:is(.skills-hub-canvas,.editor-styles-wrapper) :is(.is-style-hub-problem-grid,.is-style-hub-capability-grid,.is-style-hub-boundary-grid) { display:grid;grid-template-columns:minmax(0,1fr);gap:16px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) :is(.is-style-hub-feature-card,.is-style-hub-positive-card) { padding:24px;border:1px solid var(--hub-line);border-radius:var(--hub-radius-card);background:rgb(255 253 248 / 60%); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-feature-card h3 { margin:12px 0 8px;font-size:20px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-feature-card p { margin:0;color:var(--hub-muted); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-feature-card .is-style-hub-card-index { color:var(--hub-accent);font-size:12px;font-weight:900;letter-spacing:.08em; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-soft { background:rgb(255 253 248 / 50%); }
:is(.skills-hub-canvas,.editor-styles-wrapper) :is(.is-style-hub-demo-layout,.is-style-hub-boundaries-layout) { display:grid;grid-template-columns:minmax(0,1fr);gap:24px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-note-panel { align-self:start;padding:28px;border:1px solid var(--hub-line);border-radius:24px;background:var(--hub-ink);color:#fffdf8;box-shadow:var(--hub-shadow-card); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-note-panel h3 { margin-top:0;font-size:28px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-note-panel .is-style-hub-eyebrow { color:var(--hub-accent-light); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-numbered-points { display:grid;gap:15px;padding:0;margin:28px 0 0;list-style:none;counter-reset:hub-note; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-numbered-points li { display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;color:#e6e5df;counter-increment:hub-note; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-numbered-points li::before { display:grid;width:26px;height:26px;place-items:center;border:1px solid rgb(255 253 248 / 30%);border-radius:50%;content:counter(hub-note);font-size:12px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-dark { color:#fffdf8;background:var(--hub-ink); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-dark .is-style-hub-eyebrow { color:var(--hub-accent-light); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-dark .is-style-hub-feature-card { border-color:rgb(255 253 248 / 16%);background:rgb(255 253 248 / 4%); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-dark .is-style-hub-feature-card p { color:#c7cbc7; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-section-dark .is-style-hub-feature-card .is-style-hub-card-index { color:var(--hub-accent-light); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-positive-card { border-color:rgb(82 127 112 / 45%);background:var(--hub-green-soft); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-faq-list { width:min(100%,820px);margin-inline:auto; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-faq-list details { border-top:1px solid var(--hub-line); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-faq-list details:last-child { border-bottom:1px solid var(--hub-line); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-faq-list summary { min-height:56px;padding:18px 40px 18px 0;cursor:pointer;font-size:17px;font-weight:800; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-faq-list details p { max-width:680px;margin:0 0 22px;color:var(--hub-muted); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-contact-panel { max-width:900px;padding:clamp(30px,8vw,72px);margin-inline:auto;text-align:center;border:1px solid var(--hub-line);border-radius:24px;background:linear-gradient(145deg,rgba(255,253,248,1),rgb(231 240 235 / 70%));box-shadow:var(--hub-shadow-card); }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-contact-panel h2 { max-width:700px;margin:0 auto;font-size:clamp(30px,8vw,50px);line-height:1.18; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-contact-panel > p { margin:18px 0;color:var(--hub-muted); }
:is(.skills-hub-canvas,.skills-hub-page-footer,.editor-styles-wrapper) .is-style-hub-site-footer { padding:30px max(22px,env(safe-area-inset-left)) 130px;border-top:1px solid var(--hub-line);color:var(--hub-muted);font-size:13px;text-align:center; }
:is(.skills-hub-canvas,.skills-hub-page-footer,.editor-styles-wrapper) .is-style-hub-site-footer p { margin:5px auto; }
.skills-hub-blocks [hidden] { display:none!important; }
.skills-hub-blocks :is(a,button,summary,[tabindex]):focus-visible { outline:3px solid var(--hub-green);outline-offset:4px; }
.skills-hub-blocks img { max-width:100%;height:auto; }
.skills-hub-blocks-footer { padding:0 22px 24px;text-align:center;font-size:13px; }
.skills-hub-blocks-footer a { color:var(--hub-muted); }
/* In the shell footer the directory link follows the editable footer, so the mobile-bar clearance sits below the link. */
footer.skills-hub-page-footer .is-style-hub-site-footer { padding-bottom:12px; }
footer.skills-hub-page-footer .skills-hub-blocks-footer { padding-bottom:130px; }
.hub-skip { position:absolute;left:1rem;top:1rem;z-index:50;padding:.75rem;background:#fffdf8;color:#202722;transform:translateY(-180%); }
.hub-skip:focus { transform:none; }
.hub-preview-notice { margin:0;padding:1rem;background:#fffdf8;color:#202722;border-bottom:1px solid #d8d0c2; }
.editor-styles-wrapper .hub-editor-preview { padding:0;border:0;background:transparent;border-radius:0; }
@media(min-width:760px) {
 body.skills-hub-blocks { padding-bottom:0; }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-hero { padding-bottom:96px; }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .hub-section { padding-top:92px;padding-bottom:92px; }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-problem-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-capability-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 :is(.skills-hub-canvas,.skills-hub-page-footer,.editor-styles-wrapper) .is-style-hub-site-footer { padding-bottom:50px; }
 footer.skills-hub-page-footer .skills-hub-blocks-footer { padding-bottom:50px; }
}
@media(min-width:980px) {
 :is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-hero-layout { grid-template-columns:minmax(0,1.06fr) minmax(380px,.94fr);gap:72px;min-height:calc(92vh - 120px);padding-top:56px; }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .hub-section { padding-top:112px;padding-bottom:112px; }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-demo-layout { grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:32px; }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-boundaries-layout { grid-template-columns:minmax(300px,.7fr) minmax(0,1.3fr);gap:64px; }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-boundary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 :is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-capability-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media(prefers-reduced-motion:reduce) { .skills-hub-blocks *, .skills-hub-blocks *::before, .skills-hub-blocks *::after { scroll-behavior:auto!important;transition-duration:0ms!important;animation-duration:0ms!important;animation-iteration-count:1!important; } }
.skills-hub-canvas *::before,.skills-hub-canvas *::after,
.editor-styles-wrapper :is(.is-style-skill-gongwen,.is-style-skill-wensheng,.is-style-skill-kaikoudu) *::before,
.editor-styles-wrapper :is(.is-style-skill-gongwen,.is-style-skill-wensheng,.is-style-skill-kaikoudu) *::after { box-sizing:border-box; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-brand { display:inline-flex;align-items:center;gap:10px; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-hero > :is(.is-style-hub-site-header,.is-style-hub-hero-layout) { margin-block-start:0;margin-block-end:0; }
:is(.skills-hub-canvas,.editor-styles-wrapper) .is-style-hub-promises li { margin:0; }