@charset "UTF-8";

:root { color-scheme:light; }
html { scroll-behavior:auto; scroll-padding-top:0; }
body { margin:0; background:#f5f0e7; -webkit-font-smoothing:antialiased; }
::selection { background:#dfcdb1; color:#302e2a; }
a, button, summary { touch-action:manipulation; }

.skip-link {
  position:fixed; inset:12px auto auto 16px; z-index:100;
  transform:translateY(-180%); padding:14px 20px; border-radius:12px;
  background:#302e2a; color:#fcfaf5;
  font:500 14px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.skip-link:focus { transform:translateY(0); outline:3px solid #8c6146; outline-offset:3px; }

#yang-personal-space {
  --yp-bg:#f5f0e7;
  --yp-panel:#fcfaf5;
  --yp-ink:#302e2a;
  --yp-muted:#6c655b;
  --yp-line:#ddd4c5;
  --yp-wash:#ebe3d5;
  --yp-focus:#8c6146;
  --yp-radius:26px;
  --yp-section-x:clamp(36px,4.7vw,76px);
  color:var(--yp-ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
}
#yang-personal-space *, #yang-personal-space *::before, #yang-personal-space *::after { box-sizing:border-box; }
#yang-personal-space [hidden] { display:none!important; }
#yang-personal-space :is(button,a,summary) { -webkit-tap-highlight-color:transparent; }
#yang-personal-space button { font:inherit; }
#yang-personal-space :is(button,a,summary):focus-visible {
  outline:3px solid var(--yp-focus); outline-offset:5px;
}
#yang-personal-space :is(.yp-main,.yp-page-section,.yp-contact):focus { outline:none; }
#yang-personal-space :is(.yp-work-detail,#yp-detail-title):focus-visible {
  outline:3px solid var(--yp-focus); outline-offset:6px;
}
#yang-personal-space .yp-shell {
  display:grid; grid-template-columns:240px minmax(0,1fr);
  max-width:1600px; min-height:100vh; margin-inline:auto; background:var(--yp-bg);
}
#yang-personal-space .yp-side {
  min-width:0; padding:36px 22px;
  border-right:1px solid var(--yp-line); background:#eee8dd;
}
#yang-personal-space .yp-side-inner {
  position:sticky; top:36px; padding:8px;
  max-height:calc(100vh - 72px); max-height:calc(100svh - 72px);
  overflow-y:auto; scrollbar-width:thin;
}
#yang-personal-space .yp-logo {
  margin:0 0 30px; font:italic 40px/1.1 Georgia,"Times New Roman",serif; letter-spacing:-1.8px;
}
#yang-personal-space .yp-side-name { margin:0 0 30px; font-size:15px; font-weight:550; line-height:1.45; }
#yang-personal-space nav { display:grid; gap:7px; }
#yang-personal-space .yp-nav {
  display:flex; align-items:center; gap:11px; min-height:48px; width:100%;
  padding:13px 12px; border-radius:13px; color:var(--yp-muted);
  font-size:14px; font-weight:500; line-height:1.4; text-decoration:none;
  transition:background-color 180ms ease,color 180ms ease;
}
#yang-personal-space .yp-nav[aria-current="location"] { background:var(--yp-ink); color:var(--yp-panel); }
#yang-personal-space .yp-main { min-width:0; }

/* The anchor is the section edge; spacing lives inside each section. */
#yang-personal-space .yp-page-section {
  min-height:100vh; min-height:100svh;
  padding:72px var(--yp-section-x) 80px; scroll-margin:0;
}
#yang-personal-space .yp-section { border-top:1px solid var(--yp-line); }
#yang-personal-space .yp-hello { display:flex; flex-direction:column; }
#yang-personal-space .yp-topline {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
  gap:16px; color:var(--yp-muted); font-size:13px; line-height:1.5;
}
#yang-personal-space .yp-location { display:inline-flex; align-items:center; gap:8px; }
#yang-personal-space .yp-hero-content {
  flex:1; display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
  padding-block:64px 96px;
}
#yang-personal-space .yp-eyebrow {
  margin:0 0 24px; color:var(--yp-muted); font-size:12px; font-weight:500;
  letter-spacing:1.7px; line-height:1.6; text-transform:uppercase;
}
#yang-personal-space h1 {
  margin:0 0 28px; font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(68px,7.6vw,112px); font-weight:400; line-height:1.04; letter-spacing:-.055em;
}
#yang-personal-space .yp-intro { max-width:700px; margin:0; color:var(--yp-muted); font-size:21px; line-height:1.65; letter-spacing:-.25px; }
#yang-personal-space .yp-action-row { display:flex; flex-wrap:wrap; gap:13px; margin-top:36px; }
#yang-personal-space :is(.yp-primary,.yp-secondary) {
  display:inline-flex; align-items:center; justify-content:center; gap:13px;
  min-height:52px; padding:15px 22px; border:1px solid var(--yp-line); border-radius:999px;
  font-size:14px; font-weight:500; line-height:1.4; text-decoration:none;
  transition:background-color 180ms ease,transform 180ms ease;
}
#yang-personal-space .yp-primary { background:var(--yp-ink); border-color:var(--yp-ink); color:var(--yp-panel); }
#yang-personal-space .yp-secondary { background:transparent; color:var(--yp-ink); }
#yang-personal-space .yp-section-title {
  display:flex; align-items:baseline; justify-content:space-between; gap:24px; margin-bottom:38px;
}
#yang-personal-space h2 { margin:0; font-size:clamp(36px,3.5vw,52px); font-weight:600; line-height:1.1; letter-spacing:-.045em; }
#yang-personal-space .yp-section-hint { max-width:220px; color:var(--yp-muted); font-size:14px; line-height:1.5; }

#yang-personal-space .yp-work-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin:0 0 26px; }
#yang-personal-space .yp-filters { display:flex; flex-wrap:wrap; gap:7px; }
#yang-personal-space .yp-filter {
  min-height:44px; padding:11px 16px; border:1px solid var(--yp-line); border-radius:999px;
  background:transparent; color:var(--yp-muted); font-size:13px; font-weight:500; line-height:1.4; cursor:pointer;
  transition:background-color 180ms ease,color 180ms ease,border-color 180ms ease;
}
#yang-personal-space .yp-filter[aria-pressed="true"] { background:var(--yp-ink); border-color:var(--yp-ink); color:var(--yp-panel); }
#yang-personal-space .yp-filter-count { color:var(--yp-muted); font-size:12px; line-height:1.5; white-space:nowrap; }
#yang-personal-space .yp-work-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(max(220px,calc((100% - 36px) / 3)),1fr)); gap:18px; }
#yang-personal-space .yp-work-card { display:flex; flex-direction:column; min-width:0; gap:8px; }
#yang-personal-space .yp-work-card > .yp-work-tile { flex:1; width:100%; }
#yang-personal-space .yp-company-link { display:inline-flex; align-items:center; align-self:flex-start; gap:8px; min-height:44px; padding:8px 12px; border-radius:12px; color:var(--yp-muted); font-size:12px; line-height:1.5; text-decoration:none; }
#yang-personal-space .yp-company-link:hover { color:var(--yp-ink); text-decoration:underline; text-underline-offset:4px; }
#yang-personal-space .yp-company-link .yp-icon { width:15px; height:15px; }
#yang-personal-space .yp-work-tile {
  display:flex; flex-direction:column; gap:24px; min-width:0; min-height:282px;
  padding:28px 25px; border:1px solid var(--yp-line); border-radius:var(--yp-radius);
  background:var(--yp-panel); color:var(--yp-ink); text-align:left; cursor:pointer;
  box-shadow:0 3px 18px rgb(48 46 42 / 3%);
  transition:background-color 180ms ease,color 180ms ease,transform 180ms ease;
}
#yang-personal-space .yp-work-tile[aria-expanded="true"] { background:var(--yp-ink); border-color:var(--yp-ink); color:var(--yp-panel); }
#yang-personal-space .yp-tile-top { display:grid; grid-template-columns:20px minmax(0,1fr) 18px; align-items:center; gap:9px; width:100%; }
#yang-personal-space .yp-work-kind { min-width:0; color:var(--yp-muted); font-size:11px; font-weight:500; line-height:1.45; letter-spacing:.15px; }
#yang-personal-space .yp-tile-toggle { transition:transform 220ms ease; }
#yang-personal-space .yp-work-tile[aria-expanded="true"] .yp-tile-toggle { transform:rotate(45deg); }
#yang-personal-space .yp-work-title { min-width:0; font-size:22px; font-weight:550; line-height:1.25; letter-spacing:-.6px; overflow-wrap:break-word; }
#yang-personal-space .yp-work-role { display:block; }
#yang-personal-space .yp-work-employer { display:block; margin-top:10px; font-size:17px; font-weight:500; line-height:1.4; letter-spacing:-.25px; }
#yang-personal-space .yp-work-source { min-width:0; margin-top:auto; color:var(--yp-muted); font-size:13px; line-height:1.65; }
#yang-personal-space .yp-work-cue { color:var(--yp-muted); font-size:12px; font-weight:500; line-height:1.5; }
#yang-personal-space .yp-work-tile[aria-expanded="true"] :is(.yp-work-source,.yp-work-kind,.yp-work-cue) { color:#e0d9cc; }
#yang-personal-space .yp-work-detail {
  margin-top:22px; padding:34px; border:1px solid var(--yp-line); border-radius:var(--yp-radius);
  background:var(--yp-panel); scroll-margin-top:24px;
}
#yang-personal-space .yp-detail-top { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
#yang-personal-space .yp-detail-label { min-width:0; margin:10px 0 0; color:var(--yp-muted); font-size:13px; line-height:1.6; }
#yang-personal-space .yp-close {
  display:grid; place-items:center; flex:none; width:44px; height:44px; padding:12px;
  border:0; border-radius:50%; background:var(--yp-wash); color:var(--yp-ink); cursor:pointer;
}
#yang-personal-space h3 { margin:14px 0 18px; font-size:32px; font-weight:600; line-height:1.2; letter-spacing:-1px; }
#yang-personal-space .yp-detail-copy { max-width:700px; margin:0; color:var(--yp-muted); font-size:16px; line-height:1.8; }
#yang-personal-space .yp-detail-footer { display:flex; flex-wrap:wrap; gap:9px; margin-top:26px; }
#yang-personal-space .yp-tag { max-width:100%; padding:8px 12px; border-radius:999px; background:var(--yp-wash); color:var(--yp-ink); font-size:12px; line-height:1.5; }
#yang-personal-space .yp-no-script { font-size:15px; line-height:1.7; }
#yang-personal-space .yp-no-script a { color:inherit; }

#yang-personal-space :is(.yp-about-cards,.yp-interests) { display:grid; gap:18px; }
#yang-personal-space .yp-fold-card {
  min-width:0; padding-inline:30px; border:1px solid var(--yp-line);
  border-radius:var(--yp-radius); background:var(--yp-panel);
}
#yang-personal-space .yp-fold-card > summary {
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  min-height:112px; padding-block:28px; border-radius:12px; list-style:none; cursor:pointer;
}
#yang-personal-space .yp-fold-card > summary::-webkit-details-marker { display:none; }
#yang-personal-space .yp-fold-label { min-width:0; }
#yang-personal-space .yp-fold-title { display:block; font-size:26px; font-weight:550; line-height:1.3; letter-spacing:-.7px; }
#yang-personal-space .yp-fold-preview { display:block; margin-top:8px; color:var(--yp-muted); font-size:13px; line-height:1.6; }
#yang-personal-space .yp-round {
  display:grid; place-items:center; flex:none; width:44px; height:44px;
  border:1px solid var(--yp-line); border-radius:50%; transition:transform 220ms ease;
}
#yang-personal-space .yp-fold-card[open] > summary .yp-round { transform:rotate(45deg); }
#yang-personal-space .yp-fold-body { padding-block:26px 30px; border-top:1px solid var(--yp-line); }
#yang-personal-space .yp-fold-body > p { max-width:760px; margin:0; color:var(--yp-muted); font-size:16px; line-height:1.8; }
#yang-personal-space .yp-fold-body > p + p { margin-top:22px; }
#yang-personal-space .yp-values { display:grid; gap:22px; max-width:760px; margin:0; }
#yang-personal-space .yp-values dt { font-size:15px; font-weight:550; line-height:1.5; }
#yang-personal-space .yp-values dd { margin:6px 0 0; color:var(--yp-muted); font-size:16px; line-height:1.7; }
#yang-personal-space .yp-language-list { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 22px; padding:0; list-style:none; }
#yang-personal-space .yp-language-list li { padding:8px 14px; border-radius:999px; background:var(--yp-wash); font-size:13px; line-height:1.5; }

/* Each card reserves room for both faces, so longer captions never clip. */
#yang-personal-space .yp-gallery-body > .yp-gallery-guidance { margin-bottom:22px; font-size:14px; }
#yang-personal-space .yp-photo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
#yang-personal-space .yp-diy-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
#yang-personal-space .yp-flip-feature { grid-column:span 2; }
#yang-personal-space .yp-flip-card {
  display:block; min-width:0; width:100%; padding:0; border:0; border-radius:24px;
  background:transparent; color:var(--yp-ink); text-align:left; cursor:pointer;
  perspective:1400px; -webkit-appearance:none; appearance:none;
}
#yang-personal-space .yp-flip-inner {
  display:grid; height:100%; min-height:350px; border-radius:inherit;
  transform-style:preserve-3d; transition:transform 360ms cubic-bezier(.2,.7,.2,1);
}
#yang-personal-space .yp-flip-card[aria-pressed="true"] .yp-flip-inner { transform:rotateY(180deg); }
#yang-personal-space .yp-flip-face {
  grid-area:1 / 1; position:relative; display:flex; flex-direction:column; min-width:0;
  overflow:hidden; border-radius:inherit; -webkit-backface-visibility:hidden; backface-visibility:hidden;
}
#yang-personal-space .yp-flip-front { background:var(--yp-wash); transform:rotateY(0deg); }
#yang-personal-space .yp-flip-face > img {
  position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover;
  pointer-events:none; user-select:none; -webkit-user-drag:none;
}
#yang-personal-space .yp-photo-caption {
  position:relative; display:flex; flex-direction:column; gap:14px; margin-top:auto;
  padding:70px 24px 24px; color:#fff; background:linear-gradient(transparent, rgb(0 0 0 / 76%));
}
#yang-personal-space .yp-photo-name { display:block; font-size:20px; font-weight:550; line-height:1.35; letter-spacing:-.3px; }
#yang-personal-space .yp-flip-hint { display:flex; align-items:center; justify-content:space-between; gap:14px; font-size:12px; font-weight:450; line-height:1.5; }
#yang-personal-space .yp-flip-hint .yp-icon { width:18px; height:18px; }
#yang-personal-space .yp-flip-back {
  padding:28px; border:1px solid var(--yp-line); background:var(--yp-panel); transform:rotateY(180deg);
}
#yang-personal-space .yp-flip-category { display:block; margin-bottom:32px; color:var(--yp-muted); font-size:11px; line-height:1.6; letter-spacing:1.2px; text-transform:uppercase; }
#yang-personal-space .yp-flip-title { display:block; margin-bottom:18px; font-size:26px; font-weight:550; line-height:1.2; letter-spacing:-.7px; overflow-wrap:break-word; }
#yang-personal-space .yp-flip-description { display:block; max-width:440px; font-size:16px; line-height:1.65; }
#yang-personal-space .yp-flip-back > .yp-flip-description { color:var(--yp-muted); }
#yang-personal-space .yp-flip-back > .yp-flip-hint { margin-top:auto; padding-top:32px; color:var(--yp-muted); }
#yang-personal-space .yp-diy-grid .yp-flip-inner { min-height:420px; }
#yang-personal-space .yp-contact-content { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:48px; width:100%; }
#yang-personal-space .yp-contact-intro { min-width:0; }
#yang-personal-space .yp-contact-intro .yp-contact-links { margin-top:32px; }
#yang-personal-space .yp-riverside-card { max-width:480px; justify-self:end; }
#yang-personal-space .yp-riverside-card .yp-flip-inner { min-height:440px; }
#yang-personal-space .yp-question-face { padding:32px; border:1px solid var(--yp-line); background:var(--yp-panel); }
#yang-personal-space .yp-question { display:block; max-width:360px; margin-block:auto; font:400 35px/1.2 Georgia,"Times New Roman",serif; letter-spacing:-1px; }
#yang-personal-space .yp-question-face > .yp-flip-hint { margin-top:36px; color:var(--yp-muted); }
#yang-personal-space .yp-riverside-card .yp-answer-face { padding:0; border:0; }
#yang-personal-space .yp-answer-face .yp-flip-description { font-size:26px; line-height:1.3; }

/* Contact and résumé are separate destinations; page metadata stays last. */
#yang-personal-space .yp-contact {
  min-height:100vh; min-height:100dvh; padding:88px var(--yp-section-x) 36px; scroll-margin:0;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:36px;
  border-top:1px solid var(--yp-line); background:var(--yp-bg); color:var(--yp-ink);
}
#yang-personal-space .yp-contact h2 { margin-bottom:24px; font-size:clamp(64px,7.5vw,108px); letter-spacing:-.055em; }
#yang-personal-space .yp-contact p { max-width:560px; margin:0; color:var(--yp-muted); font-size:21px; line-height:1.65; }
#yang-personal-space .yp-contact-links { display:flex; flex-wrap:wrap; align-items:center; gap:14px; }
#yang-personal-space .yp-contact-links a {
  display:inline-flex; align-items:center; justify-content:space-between; gap:30px;
  min-height:56px; padding:16px 22px; border:1px solid var(--yp-line); border-radius:999px;
  color:var(--yp-ink); font-size:16px; line-height:1.4; text-decoration:none;
  transition:background-color 180ms ease,color 180ms ease,border-color 180ms ease;
}
#yang-personal-space .yp-resume-card {
  max-width:760px; padding:clamp(24px,4vw,48px);
  border:1px solid var(--yp-line); border-radius:var(--yp-radius); background:var(--yp-panel);
}
#yang-personal-space .yp-resume-document { display:flex; align-items:center; gap:12px; margin-bottom:28px; color:var(--yp-muted); font-size:13px; }
#yang-personal-space .yp-resume-document .yp-icon { width:28px; height:28px; }
#yang-personal-space .yp-resume-card h3 { margin-top:0; }
#yang-personal-space .yp-resume-card p { margin:0; color:var(--yp-muted); font-size:17px; line-height:1.7; }
#yang-personal-space .yp-site-footer { padding:0 var(--yp-section-x) 28px; }
#yang-personal-space .yp-footer-meta {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px;
  width:100%; margin-top:auto; padding-top:24px; border-top:1px solid var(--yp-line);
  color:var(--yp-muted); font-size:12px; line-height:1.5;
}
#yang-personal-space .yp-back-top { display:inline-flex; align-items:center; gap:9px; min-height:44px; color:inherit; text-decoration:none; }
#yang-personal-space .yp-icon { display:block; flex:none; width:18px; height:18px; }
#yang-personal-space .yp-tile-top > .yp-icon:first-child { width:20px; height:20px; }

@media (hover:hover) {
  #yang-personal-space .yp-nav:hover { background:var(--yp-wash); color:var(--yp-ink); }
  #yang-personal-space .yp-nav[aria-current="location"]:hover { background:#454037; color:var(--yp-panel); }
  #yang-personal-space .yp-back-top:hover { color:var(--yp-ink); text-decoration:underline; text-underline-offset:4px; }
  #yang-personal-space .yp-primary:hover { background:#484237; transform:translateY(-1px); }
  #yang-personal-space .yp-secondary:hover { background:var(--yp-wash); }
  #yang-personal-space .yp-work-tile:hover { transform:translateY(-3px); box-shadow:0 10px 28px rgb(48 46 42 / 9%); }
  #yang-personal-space .yp-filter:not([aria-pressed="true"]):hover { background:var(--yp-wash); color:var(--yp-ink); }
  #yang-personal-space .yp-close:hover { background:#dfd4c2; }
  #yang-personal-space .yp-contact-links a:hover { background:var(--yp-wash); }
}

@media (max-width:1100px) {
  #yang-personal-space { --yp-section-x:40px; }
  #yang-personal-space .yp-shell { grid-template-columns:204px minmax(0,1fr); }
  #yang-personal-space .yp-side { padding:32px 15px; }
  #yang-personal-space .yp-side-inner { top:32px; max-height:calc(100vh - 64px); max-height:calc(100svh - 64px); }
  #yang-personal-space .yp-nav { gap:9px; padding-inline:10px; font-size:13px; }
  #yang-personal-space .yp-work-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #yang-personal-space .yp-work-tile { min-height:268px; padding:26px 22px; gap:22px; }
  #yang-personal-space .yp-work-title { font-size:21px; }
  #yang-personal-space .yp-section-title { align-items:flex-start; flex-direction:column; gap:12px; }
  #yang-personal-space .yp-photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:1000px) {
  #yang-personal-space .yp-contact-content { grid-template-columns:1fr; gap:48px; }
  #yang-personal-space .yp-riverside-card { justify-self:start; }
}
@media (max-width:800px) {
  #yang-personal-space .yp-photo-grid { grid-template-columns:1fr; }
  #yang-personal-space .yp-flip-feature { grid-column:auto; }
  #yang-personal-space .yp-flip-inner { min-height:400px; }
  #yang-personal-space { --yp-section-x:28px; }
  #yang-personal-space .yp-shell { grid-template-columns:176px minmax(0,1fr); }
  #yang-personal-space .yp-side { padding-inline:10px; }
  #yang-personal-space .yp-side-name { font-size:14px; }
  #yang-personal-space .yp-nav { gap:8px; padding-inline:8px; }
  #yang-personal-space .yp-page-section { padding-block:64px 72px; }
  #yang-personal-space h1 { font-size:clamp(58px,8.4vw,70px); }
  #yang-personal-space .yp-intro { font-size:19px; }
  #yang-personal-space .yp-work-grid { grid-template-columns:1fr; gap:15px; }
  #yang-personal-space .yp-work-tile {
    display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px 18px;
    min-height:0; padding:24px;
  }
  #yang-personal-space .yp-tile-top { grid-column:1 / -1; grid-row:auto; }
  #yang-personal-space .yp-work-title { grid-column:1 / -1; font-size:20px; line-height:1.3; }
  #yang-personal-space .yp-work-source { grid-column:1; margin-top:0; }
  #yang-personal-space .yp-work-cue { grid-column:2; align-self:end; white-space:nowrap; }
  #yang-personal-space :is(.yp-work-title,.yp-work-source) br { display:none; }
  #yang-personal-space .yp-work-detail { padding:26px; }
  #yang-personal-space .yp-fold-card { padding-inline:26px; }
  #yang-personal-space .yp-fold-title { font-size:24px; }
}
@media (max-width:620px) {
  html { scroll-padding-bottom:calc(108px + env(safe-area-inset-bottom,0px)); }
  #yang-personal-space { --yp-section-x:24px; --yp-radius:23px; --yp-dock-clearance:calc(108px + env(safe-area-inset-bottom,0px)); }
  #yang-personal-space .yp-shell { grid-template-columns:1fr; }
  #yang-personal-space .yp-side { padding:20px 18px 14px; border-right:0; border-bottom:1px solid var(--yp-line); }
  #yang-personal-space .yp-side-inner { position:static; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; max-height:none; overflow:visible; padding:0; }
  #yang-personal-space .yp-logo { margin:0; font-size:32px; }
  #yang-personal-space .yp-side-name { display:none; }
  #yang-personal-space nav {
    position:fixed; z-index:50; left:50%; bottom:calc(12px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%);
    display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:3px;
    width:calc(100% - 24px); max-width:580px; padding:7px; border:1px solid rgb(221 212 197 / 90%); border-radius:22px;
    background:var(--yp-bg);
    box-shadow:0 8px 32px rgb(48 46 42 / 15%);
  }
  #yang-personal-space .yp-nav { flex-direction:column; justify-content:center; width:100%; min-height:60px; gap:5px; padding:8px 4px; font-size:10.5px; line-height:1.25; text-align:center; border-radius:15px; }
  #yang-personal-space .yp-nav:focus-visible { outline-offset:1px; }
  #yang-personal-space .yp-nav .yp-icon { width:18px; height:18px; }
  #yang-personal-space .yp-page-section { padding-block:56px calc(64px + var(--yp-dock-clearance)); scroll-margin-bottom:16px; }
  #yang-personal-space :is(.yp-work-detail,.yp-flip-card,.yp-fold-card) { scroll-margin-bottom:16px; }
  #yang-personal-space .yp-topline { font-size:12px; }
  #yang-personal-space .yp-hero-content { padding-block:48px 64px; }
  #yang-personal-space .yp-eyebrow { margin-bottom:20px; font-size:11px; letter-spacing:1.4px; }
  #yang-personal-space h1 { margin-bottom:24px; font-size:clamp(48px,11.3vw,68px); letter-spacing:-.055em; }
  #yang-personal-space .yp-intro { font-size:18px; }
  #yang-personal-space .yp-action-row { margin-top:30px; gap:12px; }
  #yang-personal-space :is(.yp-primary,.yp-secondary) { padding-inline:19px; }
  #yang-personal-space .yp-section-title { margin-bottom:28px; gap:10px; }
  #yang-personal-space h2 { font-size:36px; }
  #yang-personal-space .yp-section-hint { font-size:13px; }
  #yang-personal-space .yp-work-controls { gap:12px; margin-bottom:22px; }
  #yang-personal-space .yp-filters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; gap:6px; }
  #yang-personal-space .yp-filter { min-width:0; min-height:50px; padding:10px 8px; border-radius:16px; font-size:12px; }
  #yang-personal-space .yp-work-tile { padding:22px 20px; gap:14px; }
  #yang-personal-space .yp-work-title { font-size:19px; }
  #yang-personal-space .yp-work-detail { padding:22px; }
  #yang-personal-space .yp-detail-top { gap:12px; }
  #yang-personal-space h3 { font-size:28px; }
  #yang-personal-space .yp-detail-copy { font-size:15px; }
  #yang-personal-space .yp-fold-card { padding-inline:22px; }
  #yang-personal-space .yp-fold-card > summary { min-height:100px; gap:16px; padding-block:24px; }
  #yang-personal-space .yp-fold-title { font-size:22px; }
  #yang-personal-space .yp-fold-body { padding-block:24px 26px; }
  #yang-personal-space .yp-values dd, #yang-personal-space .yp-fold-body > p { font-size:15px; }
  #yang-personal-space .yp-contact { gap:36px; padding-block:72px calc(24px + var(--yp-dock-clearance)); }
  #yang-personal-space .yp-contact h2 { font-size:clamp(60px,12vw,74px); }
  #yang-personal-space .yp-flip-back, #yang-personal-space .yp-question-face { padding:26px; }
  #yang-personal-space .yp-question { font-size:32px; }
  #yang-personal-space .yp-riverside-card .yp-flip-inner { min-height:420px; }
  #yang-personal-space .yp-contact p { font-size:19px; }
  #yang-personal-space .yp-contact-links { gap:12px; }
  #yang-personal-space .yp-contact-links a { gap:20px; padding-inline:20px; font-size:15px; }
  #yang-personal-space .yp-site-footer { padding-bottom:calc(24px + var(--yp-dock-clearance)); }
  #yang-personal-space .yp-resume-card .yp-action-row { flex-direction:column; align-items:stretch; }
}
@media (max-width:380px) {
  #yang-personal-space { --yp-section-x:20px; }
  #yang-personal-space .yp-side { padding-inline:14px; }
  #yang-personal-space .yp-nav { padding-inline:3px; font-size:10px; }
  #yang-personal-space .yp-fold-card { padding-inline:20px; }
  #yang-personal-space .yp-round { width:38px; height:38px; }
  #yang-personal-space .yp-work-detail { padding:20px; }
  #yang-personal-space .yp-tag { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  #yang-personal-space *, #yang-personal-space *::before, #yang-personal-space *::after { transition:none!important; animation:none!important; }
  #yang-personal-space :is(.yp-work-tile,.yp-primary):hover { transform:none; }
}
@media print {
  html { scroll-behavior:auto; }
  body { background:white; }
  #yang-personal-space .yp-shell { display:block; }
  #yang-personal-space :is(.yp-side,.yp-action-row,.yp-close,.yp-footer-meta) { display:none; }
  #yang-personal-space :is(.yp-page-section,.yp-contact) { min-height:0; padding:22px 0; break-inside:avoid; }
  #yang-personal-space .yp-hero-content { padding:20px 0; }
  #yang-personal-space h1 { font-size:44px; }
  #yang-personal-space h2 { font-size:30px; }
  #yang-personal-space .yp-work-detail { break-inside:avoid; }
}

.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }