.hz-about{--about-ink:#171719;--about-muted:#6f7178;--about-line:#e7e8e7;--about-lime:#dfff6b;--about-violet:#aaa0f5;--about-coral:#ff9371;--about-mint:#dff6ec}

.hz-about-contact,.hz-about-journey,.hz-about-motto,.hz-about-profile,.hz-about-projects,.hz-about-skills,.hz-about-story{border:1px solid #2023290b;border-radius:18px;box-shadow:0 18px 52px #3032420d}
.hz-about-card-heading h2,.hz-about-contact h2,.hz-about-section-heading h2,.hz-about-story-copy h2{color:var(--about-ink);letter-spacing:-.045em;margin:0}
.hz-about-journey{background:radial-gradient(circle at 18% 68%,#dfff6b1a,#0000 18%),radial-gradient(circle at 51% 66%,#aaa0f517,#0000 19%),radial-gradient(circle at 85% 67%,#ff937114,#0000 18%),linear-gradient(120deg,#fbfffd,#fcfcff 54%,#fffaf7);margin-top:12px;padding:23px 25px 10px;overflow:hidden}
.hz-about-section-heading{justify-content:space-between;align-items:center;display:flex}
.hz-about-journey-title{align-items:baseline;gap:9px;display:flex}
.hz-about-section-heading h2{font-size:20px}
.hz-about-journey-title span{color:#65676d;font-size:13px}
.hz-about-journey-title span:before{content:"·";margin-right:9px}
.hz-about-journey-viewport{cursor:grab;overscroll-behavior-x:contain;scrollbar-width:none;outline:none;margin:8px -25px 0;position:relative;overflow-x:auto;touch-action:none!important;overflow-y:hidden!important}
.hz-about-journey-viewport:focus-visible{box-shadow:inset 0 0 0 2px #958bf047}
.hz-about-journey-viewport::-webkit-scrollbar{display:none}
.hz-about-journey-track{backface-visibility:hidden;-webkit-user-select:none;user-select:none;width:max-content;height:168px;padding:0 70px 0 54px;display:flex;position:relative;transform:translateZ(0)}
.hz-about-journey-svg{pointer-events:none;width:2324px;height:190px;display:block;position:absolute;top:0;left:0;right:0;overflow:visible}
.hz-about-journey-path{fill:none;stroke:#d8dddb;stroke-dasharray:4 7;stroke-linecap:round;stroke-width:1.45px;opacity:.94;vector-effect:non-scaling-stroke}
.hz-about-journey-stop{z-index:2;scroll-snap-align:start;flex:0 0 220px;width:220px;height:190px;position:relative}
.hz-about-journey-label{top:calc(var(--journey-node-y) - 60px);text-align:center;width:190px;position:absolute;left:50%;transform:translate(-50%)}
.hz-about-journey-label b{color:#b4d927;font-size:18px;line-height:1;display:block}
.hz-about-journey-stop.is-violet .hz-about-journey-label b{color:#8e84ef}
.hz-about-journey-stop.is-coral .hz-about-journey-label b{color:#f75}
.hz-about-journey-label strong{color:#242529;margin-top:5px;font-size:13px;display:block}
.hz-about-journey-stop>p{top:calc(var(--journey-node-y) + 25px);color:#85878d;text-align:center;width:190px;margin:0;font-size:10px;line-height:1.55;position:absolute;left:50%;transform:translate(-50%)}
.hz-about-journey-node{top:var(--journey-node-y);z-index:3;color:#c4ee27;cursor:pointer;background:0 0;border:0;width:41px;height:41px;padding:0}
.hz-about-journey-node,.hz-about-journey-node>span{border-radius:50%;position:absolute;left:50%;transform:translate(-50%,-50%)}
.hz-about-journey-node>span{background:currentColor;width:11px;height:11px;transition:transform .16s;top:50%;box-shadow:0 0 0 10px #c4ee2729,0 7px 18px #b4d92733}
.hz-about-journey-node>span:after,.hz-about-journey-node>span:before{content:"";opacity:0;pointer-events:none;border:1px solid;border-radius:50%;position:absolute;inset:-6px;transform:scale(.5)}
.hz-about-journey-stop.is-active .hz-about-journey-node>span{transform:translate(-50%,-50%)scale(1.16)}
.hz-about-journey-stop.is-active .hz-about-journey-node>span:after,.hz-about-journey-stop.is-active .hz-about-journey-node>span:before{animation:1.65s ease-out infinite hz-about-node-ripple-cbd7a5fc}
.hz-about-journey-stop.is-active .hz-about-journey-node>span:after{animation-delay:.55s}
.hz-about-journey-node:focus-visible{outline-offset:-5px;outline:1px solid}
.hz-about-journey-node:focus-visible>span:after,.hz-about-journey-node:focus-visible>span:before{animation:1.65s ease-out infinite hz-about-node-ripple-cbd7a5fc}
.hz-about-journey-node:focus-visible>span:after{animation-delay:.55s}
.hz-about-journey-stop.is-violet .hz-about-journey-node{color:#958bf0}
.hz-about-journey-stop.is-violet .hz-about-journey-node>span{box-shadow:0 0 0 10px #958bf026,0 7px 18px #7468d52e}
.hz-about-journey-stop.is-coral .hz-about-journey-node{color:#ff7c5b}
.hz-about-journey-stop.is-coral .hz-about-journey-node>span{box-shadow:0 0 0 10px #ff7c5b26,0 7px 18px #de5c3d2e}
.hz-about-journey-flag{z-index:3;width:19px;height:34px;position:absolute;top:18px;left:2220px}
.hz-about-journey-flag i{background:#dc775d;width:1px;position:absolute;top:0;bottom:0;left:0}
.hz-about-journey-flag em{background:var(--about-coral);clip-path:polygon(0 0,100% 28%,0 100%);width:16px;height:12px;position:absolute;top:1px;left:1px}
.hz-about-work{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:12px;margin-top:12px;display:grid}
.hz-about-projects,.hz-about-skills{background:linear-gradient(145deg,#fbfcfb,#f7faf8);padding:22px 23px}
.hz-about-projects{background:linear-gradient(145deg,#fff,#fafafa)}
.hz-about-card-heading{justify-content:space-between;align-items:center;display:flex}
.hz-about-card-heading p{color:#8b8d93;letter-spacing:.06em;margin:0 0 4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}
.hz-about-card-heading h2{font-size:20px}
.hz-about-card-heading>span{color:#4f665d;background:#eaf8f2;border-radius:50%;place-items:center;width:42px;height:42px;display:grid}
.hz-about-projects .hz-about-card-heading>span{color:#625b91;background:#efedff}
.hz-about-skill-grid{grid-template-columns:repeat(3,1fr);gap:9px;margin-top:17px;display:grid}
.hz-about-skill-grid>span{color:#55575d;white-space:nowrap;background:#ffffffd6;border:1px solid #eceeed;border-radius:10px;align-items:center;gap:9px;min-width:0;padding:10px 11px;font-size:12px;display:flex}
.hz-about-skill-grid i{color:#4d7567;background:#e4f6ef;border-radius:7px;flex:none;place-items:center;width:22px;height:22px;font-size:9px;font-style:normal;font-weight:800;display:grid}
.hz-about-skill-grid>span:nth-child(3n+2) i{color:#665e9b;background:#efedff}
.hz-about-skill-grid>span:nth-child(3n) i{color:#af654f;background:#fff0e9}
.hz-about-project-list{gap:8px;margin-top:15px;display:grid}
.hz-about-project-list a{background:#ffffffe6;border:1px solid #ececef;border-radius:11px;grid-template-columns:38px minmax(0,1fr) 32px;align-items:center;gap:11px;padding:9px 10px;transition:border-color .18s,box-shadow .18s,transform .18s;display:grid}
.hz-about-project-list a:hover{border-color:#d7dad7;transform:translateY(-2px);box-shadow:0 9px 22px #30324212}
.hz-about-project-list a>i{color:#4d7567;background:#e8f8f2;border-radius:10px;place-items:center;width:36px;height:36px;font-size:13px;font-style:normal;font-weight:800;display:grid}
.hz-about-project-list a.is-lime>i{color:#607719;background:#efffba}
.hz-about-project-list a.is-violet>i{color:#6d63a7;background:#eeebff}
.hz-about-project-list a.is-coral>i{color:#ad624d;background:#fff0e9}
.hz-about-project-list a>span{min-width:0}
.hz-about-project-list strong{color:#292a2e;font-size:13px;display:block}
.hz-about-project-list small{color:#85878d;text-overflow:ellipsis;white-space:nowrap;margin-top:2px;display:block;overflow:hidden}
.hz-about-project-list a>b{color:#34353a;background:#f3f4f3;border-radius:50%;place-items:center;width:30px;height:30px;display:grid}
.hz-about-closing{grid-template-columns:minmax(0,1fr) minmax(430px,.9fr);gap:12px;margin-top:12px;display:grid}
.hz-about-contact,.hz-about-motto{background:#fffefb;align-items:center;min-height:102px;padding:19px 22px;display:flex}
.hz-about-quote-mark{color:var(--about-lime);align-self:flex-start;margin-right:15px;font-family:Georgia,serif;font-size:54px;font-weight:800;line-height:.85}
.hz-about-motto h2{color:var(--about-ink);letter-spacing:-.045em;margin:0 auto 0 0;font-size:clamp(22px,2vw,29px)}
.hz-about-life-tags{gap:13px;margin-left:20px;display:flex}
.hz-about-life-tags>a,.hz-about-life-tags>button,.hz-about-life-tags>span{color:#66686d;white-space:nowrap;background:0 0;border:0;flex-direction:column;align-items:center;gap:5px;padding:0;font-family:inherit;font-size:10px;text-decoration:none;display:flex}
.hz-about-life-tags>a,.hz-about-life-tags>button{cursor:pointer}
.hz-about-life-tags>a:hover i,.hz-about-life-tags>button:hover i{transform:translateY(-2px)scale(1.05)}
.hz-about-life-tags>a:focus-visible,.hz-about-life-tags>button:focus-visible{outline-offset:4px;border-radius:10px;outline:2px solid #72a792}
.hz-about-life-tags i{color:#65771e;background:#f0ffbf;border-radius:50%;place-items:center;width:34px;height:34px;transition:transform .16s;display:grid}
.hz-about-life-tags .is-mint i{color:#4b7e6c;background:#e4f7ef}
.hz-about-life-tags .is-violet i{color:#6b61a0;background:#eeebff}
.hz-about-life-tags .is-coral i{color:#ad624d;background:#fff0e9}
.hz-about-life-tags .is-sky i{color:#3e7190;background:#e7f5ff}
.hz-about-life-tags .is-acid i{color:#373923;background:#efff72}
.hz-about-contact{background:linear-gradient(145deg,#fff,#fafafa);display:block}
.hz-about-contact h2{font-size:16px}
.hz-about-contact-links{flex-wrap:wrap;gap:9px 16px;margin-top:14px;display:flex}
.hz-about-contact-links a,.hz-about-contact-links span{color:#55575d;align-items:center;gap:6px;font-size:11px;transition:color .16s;display:inline-flex}
.hz-about-contact-links a:hover{color:#171719}

@keyframes hz-about-node-ripple-cbd7a5fc{0%{opacity:0;transform:scale(.5)}18%{opacity:.42}to{opacity:0;transform:scale(2.35)}}

@media (hover:hover){.hz-about-journey-node:hover>span{transform:translate(-50%,-50%)scale(1.16)}.hz-about-journey-node:hover>span:after,.hz-about-journey-node:hover>span:before{animation:1.65s ease-out infinite hz-about-node-ripple-cbd7a5fc}.hz-about-journey-node:hover>span:after{animation-delay:.55s}}

@media (width<=1180px){.hz-about-skill-grid{grid-template-columns:repeat(2,1fr)}.hz-about-closing{grid-template-columns:1fr}}

@media (width<=960px){.hz-about-intro,.hz-about-work{grid-template-columns:1fr}}

@media (width<=720px){.hz-about-journey{padding-inline:19px}.hz-about-journey-viewport{margin-inline:-19px}.hz-about-projects,.hz-about-skills{padding:20px 18px}.hz-about-skill-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hz-about-motto{grid-template-columns:auto 1fr;display:grid}.hz-about-motto h2{margin-right:0}.hz-about-life-tags{grid-column:1/-1;justify-content:space-around;gap:0;margin:18px 0 0}.hz-about-contact{padding-inline:18px}}

@media (width<=460px){.hz-about-skill-grid{grid-template-columns:1fr 1fr;gap:7px}.hz-about-skill-grid>span{padding-inline:8px}.hz-about-project-list small{max-width:190px}}

@media (prefers-reduced-motion:reduce){.hz-about-primary,.hz-about-project-list a{transition:none}.hz-about-journey-node:focus-visible>span:after,.hz-about-journey-node:focus-visible>span:before,.hz-about-journey-node:hover>span:after,.hz-about-journey-node:hover>span:before,.hz-about-journey-stop.is-active .hz-about-journey-node>span:after,.hz-about-journey-stop.is-active .hz-about-journey-node>span:before{opacity:.28;animation:none;transform:scale(1.55)}}

/* 年度详情弹窗（hz-about-dialog 全量，逐字移植自 about.maErfgJO.css） */
.hz-about-dialog{z-index:1000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#14151880;place-items:center;padding:22px;display:grid;position:fixed;inset:0}
.hz-about-dialog-panel{background:radial-gradient(circle at 12% 12%,#dfff6b24,#0000 28%),linear-gradient(145deg,#fff,#fbfcfb);border:1px solid #ffffffb8;border-radius:24px;outline:none;width:min(590px,100%);max-height:calc(100vh - 44px);padding:24px;overflow-y:auto;box-shadow:0 28px 90px #11121540}
.hz-about-dialog-panel.is-violet{background:radial-gradient(circle at 12% 12%,#aaa0f526,#0000 28%),linear-gradient(145deg,#fff,#fbfaff)}
.hz-about-dialog-panel.is-coral{background:radial-gradient(circle at 12% 12%,#ff937126,#0000 28%),linear-gradient(145deg,#fff,#fffaf8)}
.hz-about-dialog-header{grid-template-columns:76px minmax(0,1fr) auto;align-items:center;gap:15px;display:grid}
.hz-about-dialog-year{color:#586918;background:#f0ffbd;border-radius:19px;align-content:center;justify-items:center;width:76px;height:76px;display:grid}
.hz-about-dialog-panel.is-violet .hz-about-dialog-year{color:#665ca0;background:#efedff}
.hz-about-dialog-panel.is-coral .hz-about-dialog-year{color:#a8543d;background:#ffede7}
.hz-about-dialog-year b{letter-spacing:-.04em;font-size:24px;line-height:1}
.hz-about-dialog-year span{letter-spacing:.12em;opacity:.65;margin-top:6px;font:700 8px/1 ui-monospace,SFMono-Regular,Menlo,monospace}
.hz-about-dialog-header>div:nth-child(2){min-width:0}
.hz-about-dialog-header p{color:#85878d;margin:0 0 5px;font-size:11px}
.hz-about-dialog-header h2{color:#222327;letter-spacing:-.045em;margin:0;font-size:25px}
.hz-about-dialog-header>button{color:#6e7075;cursor:pointer;background:#f1f3f2;border:0;border-radius:11px;place-items:center;width:36px;height:36px;padding:0;transition:color .16s,transform .16s;display:grid}
.hz-about-dialog-header>button:hover{color:#202124;transform:rotate(5deg)}
.hz-about-dialog-lead{color:#55575d;background:#f7faefe0;border-left:3px solid #c4ee27;border-radius:0 12px 12px 0;margin:20px 0 0;padding:14px 16px;font-size:13px;line-height:1.7}
.hz-about-dialog-panel.is-violet .hz-about-dialog-lead{background:#f6f4ffe6;border-left-color:#958bf0}
.hz-about-dialog-panel.is-coral .hz-about-dialog-lead{background:#fff5f1e6;border-left-color:#ff7c5b}
.hz-about-dialog-body{margin-top:18px}
.hz-about-dialog-body h3{color:#303136;margin:0 0 11px;font-size:13px}
.hz-about-dialog-story{color:#55575c;text-align:justify;background:#ffffffc7;border:1px solid #eceeec;border-radius:13px;margin:0;padding:16px 17px;font-size:12px;line-height:1.9}
.hz-about-dialog-body ol{gap:8px;margin:0;padding:0;list-style:none;display:grid}
.hz-about-dialog-body li{background:#ffffffc7;border:1px solid #eceeec;border-radius:12px;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:11px;padding:11px 13px;display:grid}
.hz-about-dialog-body li>span{color:#a0a49d;font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace}
.hz-about-dialog-body li>p{color:#55575c;margin:0;font-size:12px;line-height:1.55}
.hz-about-dialog-tags{flex-wrap:wrap;gap:7px;margin-top:17px;display:flex}
.hz-about-dialog-tags span{color:#63751d;background:#f0ffbd;border-radius:999px;padding:7px 10px;font-size:10px;font-weight:650}
.hz-about-dialog-panel.is-violet .hz-about-dialog-tags span{color:#665ca0;background:#efedff}
.hz-about-dialog-panel.is-coral .hz-about-dialog-tags span{color:#a8543d;background:#ffede7}
.hz-about-dialog-enter-active,.hz-about-dialog-leave-active{transition:opacity .18s}
.hz-about-dialog-enter-active .hz-about-dialog-panel,.hz-about-dialog-leave-active .hz-about-dialog-panel{transition:transform .18s}
.hz-about-dialog-enter-from,.hz-about-dialog-leave-to{opacity:0}
.hz-about-dialog-enter-from .hz-about-dialog-panel,.hz-about-dialog-leave-to .hz-about-dialog-panel{transform:translateY(10px)scale(.98)}
@media (width<=720px){
  .hz-about-dialog{padding:10px}
  .hz-about-dialog-panel{border-radius:19px;max-height:calc(100vh - 20px);padding:18px}
  .hz-about-dialog-header{grid-template-columns:60px minmax(0,1fr) auto;gap:11px}
  .hz-about-dialog-year{border-radius:15px;width:60px;height:60px}
  .hz-about-dialog-year b{font-size:20px}
  .hz-about-dialog-header h2{font-size:21px}
  .hz-about-dialog-lead{margin-top:16px}
}

/* WP 版弹窗容器：SSR 输出全部面板，未 open 时必须隐藏（Next 版由 React 条件渲染达成） */
.hz-about-dialog[hidden]{display:none}
.hz-about-dialog:not(.is-open){display:none}
.hz-about-dialog.is-open{display:grid}

/* 3.1.8：联系链接触控目标 ≥24px */
@media (width <= 768px) { .hz-about-contact-links a { padding-block: 6px; } }