/* ============================================================
   base.css — structural skeleton shared by every style page.
   No colors, no fonts, no personality here: style sheets own那些.
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
/* Every transform/animation on the page collapses for reduced-motion users.
   (eve.js guards itself in JS; this covers the page's own hover motion + smooth scroll.) */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font:inherit;background:none;border:0;cursor:pointer;color:inherit}
body{-webkit-font-smoothing:antialiased;overflow-x:hidden;line-height:1.6}

/* language switching */
html[data-lang="en"] .zh{display:none !important}
html[data-lang="zh"] .en{display:none !important}

/* shell */
.r-shell{max-width:1140px;margin:0 auto;padding:0 36px}

/* nav */
.r-nav{position:sticky;top:0;z-index:40}
.r-nav-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;height:68px}
.r-nav-left{display:flex;align-items:center;gap:18px;min-width:0}
.r-back{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.r-nav-links{display:flex;gap:22px;white-space:nowrap}
.r-controls{display:flex;align-items:center;gap:10px}
.r-seg{display:flex;overflow:hidden}
.r-seg button{padding:6px 12px;line-height:1}

/* hero */
.r-hero-grid{display:grid;grid-template-columns:1fr 360px;gap:64px;align-items:center;padding-top:72px;padding-bottom:96px}
.r-portrait{position:relative}
.r-portrait img{width:100%;object-fit:cover;aspect-ratio:4/4.6}
.r-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.r-btn{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.r-meta-links{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:26px}
.r-stats{display:flex;flex-wrap:wrap;gap:14px 34px;margin-top:40px}
.r-stat{display:flex;align-items:center;gap:12px}
.r-stat-l{max-width:110px;line-height:1.4}

/* sections */
.r-sec{padding:88px 0}
.r-h2{margin:10px 0 18px}
.r-sub{max-width:60ch}

/* experience */
.r-xp-list{margin-top:34px}
.r-xp-item{display:grid;grid-template-columns:190px 1fr 190px;gap:36px;padding:38px 0}
.r-xp-when{display:flex;flex-direction:column;gap:6px}
.r-xp-desc{margin-top:14px;max-width:62ch}
.r-xp-side{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.r-tags{display:flex;flex-wrap:wrap;gap:6px}
.r-tag{display:inline-block;white-space:nowrap;line-height:1}

/* works directory */
.r-work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:34px}
.r-work{position:relative;display:flex;flex-direction:column}
.r-work-cover{display:block}
.r-work-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px}

/* skills */
.r-skill-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:38px}
.r-skill-title{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.r-skill-list li{padding:8px 0 8px 18px;position:relative}
.r-tools{margin-top:48px}
.r-tool-row{display:flex;align-items:flex-start;gap:18px;flex-wrap:wrap;padding:16px 0}
.r-tool-label{flex:0 0 140px;padding-top:7px}
.r-pills{display:flex;flex-wrap:wrap;gap:8px;flex:1}
.r-pill{display:inline-block;line-height:1;white-space:nowrap}

/* education */
.r-edu-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:34px}
.r-edu-item{position:relative}
.r-edu-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.r-edu-deg{margin:4px 0 12px}
.r-edu-desc{padding-right:84px}
.r-edu-gpa{position:absolute;right:24px;bottom:22px}
.r-langs{display:flex;flex-wrap:wrap;gap:14px 36px;align-items:flex-start;margin-top:26px}
.r-lang b{display:block}
.r-lang small{display:block;margin-top:2px}

/* contact + footer */
.r-based{margin-top:30px}
.r-foot-inner{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:44px;padding-bottom:36px}
.r-foot-meta{display:flex;gap:24px;align-items:baseline}

/* responsive */
@media (max-width:1000px){
  .r-shell{padding:0 26px}
  .r-nav-links{display:none}
  .r-hero-grid{grid-template-columns:1fr;gap:44px;padding-top:48px;padding-bottom:64px}
  .r-portrait{order:-1;max-width:360px;justify-self:start}
  .r-xp-item{grid-template-columns:1fr;gap:12px;padding:30px 0}
  .r-xp-when{flex-direction:row;align-items:baseline;justify-content:space-between}
  .r-xp-side{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px}
  .r-work-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .r-edu-grid,.r-skill-grid{grid-template-columns:1fr}
  .r-sec{padding:64px 0}
}
@media (max-width:680px){
  .r-work-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .r-shell{padding:0 18px}
  .r-back span.en,.r-back span.zh{display:none !important}
  .r-tool-label{flex-basis:100%;padding-top:0}
}

/* EVE cursor demo toggle (lives in the Motion & 3D skill card) */
.r-eve-toggle{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:8px 15px;border-radius:999px;border:1px solid var(--accent-line);background:var(--accent-dim);color:var(--accent-on-tint);font-size:12.5px;font-weight:600;cursor:pointer;transition:background-color var(--t),color var(--t),border-color var(--t),box-shadow var(--t),transform var(--t);font-family:inherit}
.r-eve-toggle:hover{background:var(--accent-fill);color:var(--on-accent)}
.r-eve-toggle.on{background:var(--accent-fill);color:var(--on-accent);border-color:transparent}
.r-eve-toggle .eve-dot{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.5;transition:opacity var(--t),box-shadow var(--t)}
.r-eve-toggle.on .eve-dot{opacity:1;box-shadow:0 0 8px currentColor}
.r-eve-toggle .eve-b{display:none}
.r-eve-toggle.on .eve-a{display:none}
.r-eve-toggle.on .eve-b{display:inline}
@media (pointer:coarse){.r-eve-toggle{display:none}}