:root{--sans:Manrope,'PingFang SC','Microsoft YaHei',Arial,sans-serif;--serif:var(--sans);--mono:var(--sans)}
.site-header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#000!important;color:#f5f5f5!important}
.charm,.keychain-hardware{filter:none!important}.charm{will-change:auto;contain:layout style}#keychain-assembly{will-change:auto}
.charm .tag,.charm .tag-chain{display:none}
#keychain-stage{user-select:none;-webkit-user-select:none}
.tag-sprite{position:absolute;top:32%;width:20.25%;height:54%;background-image:url('./assets/discipline-tags-v3.png');background-size:400% 100%;background-repeat:no-repeat;pointer-events:none;transform:scale(.92,var(--tag-length,1))}
.charm-bloom{--tag-length:.98;--hit-top:40.23%;--hit-height:43.7%}
.charm-travel{--tag-length:1.045;--hit-top:40.78%;--hit-height:46.61%}
.charm-town{--tag-length:1.005;--hit-top:40.44%;--hit-height:44.82%}
.charm-gift{--tag-length:.93;--hit-top:39.81%;--hit-height:41.48%}
.sprite-pde{transform-origin:51.31% 0}.sprite-visual{transform-origin:44.66% 0}.sprite-brand{transform-origin:38.28% 0}.sprite-workflow{transform-origin:32.16% 0}
.sprite-pde{left:39.94%;background-position:0 0}.sprite-visual{left:41.2866%;background-position:33.333333% 0}.sprite-brand{left:42.578%;background-position:66.666667% 0}.sprite-workflow{left:43.8173%;background-position:100% 0}
/* Each photographed split ring stays with its tag and pivots on the main ring. */
.charm{transform-origin:50.33% 36.5%;translate:var(--joint-x,0%) var(--joint-y,0%)}
.charm-gift{--joint-x:2.9%;--joint-y:-.6%}
.charm-town{--joint-x:.95%;--joint-y:0%}
.charm-travel{--joint-x:-.95%;--joint-y:0%}
.charm-bloom{--joint-x:-2.9%;--joint-y:-.6%}
/* Keep the original stack order; the matching near-side ring slices sit above the hardware. */
#keychain-assembly{transform-origin:50.33% 8%}
#keychain-assembly::after{content:none}
.keychain-hardware-back{z-index:0}
.keychain-hardware{inset:0;left:0;top:0;width:100%;height:100%}
.keychain-hardware-front{z-index:8;clip-path:inset(30% 0 0)}
.charm:not(.charm-link-front){filter:drop-shadow(.4cqw .65cqw .4cqw #0007)!important}
.tag-sprite{filter:contrast(1.03) saturate(1.01)}
.keychain-hardware{filter:contrast(1.03)!important}
.charm-link-front{z-index:9;filter:none!important}
.charm-link-front .sprite-pde{clip-path:polygon(52% 1%,62% 1%,62% 15.2%,52% 15.2%)}
.charm-link-front .sprite-visual{clip-path:polygon(44% 1%,54% 1%,54% 15.2%,44% 15.2%)}
.charm-link-front .sprite-brand{clip-path:polygon(37.5% 1%,47% 1%,47% 15.2%,37.5% 15.2%)}
.charm-link-front .sprite-workflow{clip-path:polygon(31.5% 1%,41% 1%,41% 15.2%,31.5% 15.2%)}
.keychain-hotspots{left:50%;right:auto;width:min(45vh,552px);transform:translateX(-50%);height:36%;top:42%}.scroll-prompt span{animation:none}
.keychain-hotspots button:focus-visible{outline:none;background:none}
#keychain-stage:has(.charm-hit:focus-visible) .charm.is-active:not(.charm-link-front) .tag-sprite{filter:contrast(1.08) saturate(1.06) drop-shadow(1px 0 0 #ffe430) drop-shadow(-1px 0 0 #ffe430)}
.charm-hit{position:absolute;left:46.8%;top:var(--hit-top,40.4%);width:11.4%;height:var(--hit-height,44.6%);padding:0;border:0;border-radius:1.3cqw;clip-path:polygon(0 0,67% 0,100% 6%,100% 100%,0 100%);background:transparent;color:inherit;cursor:pointer;pointer-events:auto;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.charm-hit:focus-visible{outline:none}
.charm.is-active .tag-sprite{filter:contrast(1.04) saturate(1.02) brightness(1.05)}
/* The reference uses one quiet mirrored 1.8s sway, with the metalwork moving together. */
#keychain-assembly{animation:keychain-breathe 1.8s cubic-bezier(.44,0,.56,1) infinite alternate}
.charm{--idle-angle:2deg;--sway-duration:1.8s;animation:tag-breathe var(--sway-duration) cubic-bezier(.44,0,.56,1) infinite alternate}
.charm-gift{--idle-angle:-1.8deg;--sway-duration:1.85s}.charm-town{--idle-angle:-.7deg;--sway-duration:2.3s}.charm-travel{--idle-angle:1deg;--sway-duration:2.05s}.charm-bloom{--idle-angle:1.6deg;--sway-duration:1.95s}
#keychain-assembly.is-motion-paused,#keychain-assembly.is-motion-paused .charm{animation-play-state:paused}
@keyframes keychain-breathe{from{translate:0 0}to{translate:0 3px}}
@keyframes tag-breathe{from{rotate:0deg}to{rotate:var(--idle-angle)}}
@media(prefers-reduced-motion:reduce){#keychain-assembly,.charm{animation:none;rotate:0deg}#keychain-assembly{translate:0 0}}
.keychain-selection{position:absolute;left:50%;top:calc(50% + min(32vh,390px));transform:translateX(-50%);margin:0;color:#858585;font:11px/1.6 var(--sans);letter-spacing:.015em;white-space:nowrap;pointer-events:none;transition:color .18s ease,opacity .18s ease}
.keychain-selection.has-selection{color:#ffe430}
.keychain-selection.has-explored:not(.has-selection){opacity:0}
@media(max-width:700px){.keychain-selection{top:calc(49% + 22.5vh);font-size:10px}}
@media(prefers-reduced-motion:reduce){.keychain-selection{transition:none}}
.project-image>img,.cover-card{filter:none!important;will-change:auto}.folder-body{box-shadow:none}
.case-toolbar,#contact-dialog::backdrop{backdrop-filter:none;-webkit-backdrop-filter:none}.tag,.tag-town,.tag-travel{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.hero-caption,.hero-index,.scroll-prompt{font-family:var(--sans)}.hero-caption{font-size:12px;letter-spacing:.01em}
.home-archive-link{display:flex;align-items:center;justify-content:space-between;background:#f5f5f5;color:#171717;padding:36px 32px;font:400 clamp(28px,4vw,64px)/1.2 var(--sans);letter-spacing:-.055em;position:relative;z-index:6}.home-archive-link:hover{background:#ffe430}.home-archive-link span{font-size:.7em}
@media(max-width:700px){.hero-caption{font-size:9px}.keychain-hotspots{width:min(84vw,33.75vh);top:42%;height:29%}.home-archive-link{padding:28px 16px}}
.desktop-nav a span{justify-content:flex-start;padding-inline:32px;font-size:11px}.desktop-nav a span+span{background:#ffe430}
@media(min-width:1800px){.desktop-nav a span{padding-inline:40px}}
@font-face{font-family:'Nothing You Could Do';src:url('./assets/nothing-you-could-do.ttf') format('truetype');font-weight:400;font-display:swap}
.about-section .discipline-word>span{font-family:'Nothing You Could Do',cursive;font-size:34px;letter-spacing:-.045em;line-height:1.1;font-weight:400}.about-section .discipline-word>small{font-family:var(--sans)}
@media(max-width:700px){.about-section .discipline-word>span{font-size:24px;line-height:1.15}}
.footer-projects{grid-template-columns:repeat(5,minmax(0,1fr))}
.footer-projects>a{text-align:left;padding:0;font:400 22px/1.4 var(--sans)}
.footer-projects>a span{display:block;font:9px/20px var(--mono);color:#aaa;margin-bottom:12px}
.footer-projects>a:hover{color:var(--yellow)}
@media(max-width:1100px){.footer-projects>a{font-size:19px}}
@media(max-width:700px){.footer-projects{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-projects>a span{font-size:8px;margin-bottom:8px}}