.experience-gallery{--experience-blue:#082bb9;padding:72px 3.8% 28px;background:#fff;color:#111;font-family:Arial,'Helvetica Neue','Microsoft Yahei',sans-serif;border-top:1px solid #e0e3e8}
.experience-gallery [hidden]{display:none!important}
.experience-kicker,.experience-baseline{display:flex;align-items:center;justify-content:space-between;gap:20px;font:10px/1.5 monospace;letter-spacing:.12em}
.experience-kicker>span:first-child{color:var(--experience-blue)}
.experience-gallery h2{font-size:clamp(34px,4.1vw,64px);line-height:1.08;letter-spacing:-.035em;font-weight:400;margin:38px 0 58px}
.experience-layout{display:grid;grid-template-columns:minmax(210px,24%) minmax(0,1fr);gap:30px}
.experience-index{display:flex;flex-direction:column;min-width:0}
.experience-tabs{display:flex;flex-direction:column;flex:1}
.experience-tab{display:block;width:100%;text-align:left;padding:28px 22px 32px 0;border-top:1px solid #cdd0d6;min-height:112px;flex:1}
.experience-name{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:clamp(19px,1.9vw,29px);font-weight:500;letter-spacing:-.035em;line-height:1.2}

.experience-selected-arrow{opacity:0;transition:opacity .2s,transform .2s;font-weight:400}
.experience-tab[aria-selected=true] .experience-name{color:var(--experience-blue)}
.experience-tab[aria-selected=true] .experience-selected-arrow{opacity:1}
.experience-tab:hover .experience-name{color:var(--experience-blue)}






.experience-stage{display:flex;min-width:0;align-items:flex-start;border-left:1px solid #d5d8dd;padding-left:26px}
.experience-panels{flex:1;min-width:0;border:1px solid #d5d8dd;padding:7px 7px 0}
.experience-panel{animation:experience-appear .28s ease}
.experience-image-button{display:block;padding:0;width:100%;overflow:hidden;cursor:zoom-in;background:#f5f5f5}
.experience-image-button img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform .45s ease}
.experience-image-button:hover img{transform:scale(1.015)}
.experience-caption{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px;padding:12px 0;font-size:10px}
.experience-caption>span{max-width:40%;line-height:1.6;text-transform:uppercase}
.experience-caption p{color:#777;font:10px/1.5 monospace;max-width:25%;margin:0}
.experience-open{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;background:transparent;color:var(--experience-blue);min-height:44px;padding:10px 0 8px;border-bottom:1px solid #b7c2e3;font-size:13px;font-weight:400;text-decoration:none;white-space:nowrap;transition:border-color .2s}
.experience-open span{font-size:22px;transition:transform .2s}.experience-open:hover span{transform:translateX(4px)}.experience-open:hover{border-bottom-color:var(--experience-blue)}
.experience-spines{display:flex;align-self:stretch;padding-top:6px;max-width:62px;flex:0 0 62px}
.experience-spines button{display:flex;flex-direction:column;align-items:center;width:31px;padding:0;overflow:hidden;border:1px solid #d5d8dd;background:#f8f8f8;margin-bottom:80px}
.experience-spines button+button{margin-top:8px;margin-bottom:88px}
.experience-spines span{writing-mode:vertical-rl;text-transform:uppercase;font-size:9px;letter-spacing:.06em;margin:22px 0;white-space:nowrap}
.experience-spines img{height:100%;width:100%;object-fit:cover;min-height:0;opacity:.65}
.experience-spines button:hover{color:var(--experience-blue);border-color:var(--experience-blue)}
.experience-baseline{border-top:1px solid #cdd0d6;margin-top:44px;padding-top:20px;font-size:9px}
.experience-dialog{padding:0;border:1px solid #d5d8dd;background:white;width:min(1200px,92vw);max-width:92vw;max-height:92dvh;color:#111}
.experience-dialog::backdrop{background:rgb(12 18 28 / .65)}
.experience-dialog-bar{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;font:14px Arial}
.experience-dialog-bar button{min-height:44px;padding:8px 12px}
.experience-dialog>img{display:block;width:100%;height:auto}
.experience-gallery :is(button,a):focus-visible{outline:2px solid var(--experience-blue);outline-offset:3px}
@keyframes experience-appear{from{opacity:.55;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(max-width:1050px){.experience-layout{grid-template-columns:23% minmax(0,1fr);gap:20px}.experience-stage{padding-left:16px}.experience-name{font-size:21px}.experience-tab{min-height:120px;padding:20px 10px 24px 0}.experience-caption p{display:none}.experience-caption>span{max-width:50%}.experience-open{padding:10px 0 8px;gap:16px}.experience-spines{max-width:44px;flex-basis:44px}.experience-spines button{width:22px}}
@media(max-width:700px){.experience-gallery{padding:44px 5% 24px}.experience-kicker>span:last-child{display:none}.experience-gallery h2{font-size:clamp(31px,7vw,45px);margin:26px 0 32px}.experience-layout{display:flex;flex-direction:column;gap:24px}.experience-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.experience-tab{padding:14px 0;min-height:68px;border-bottom:1px solid #d5d8dd}.experience-name{font-size:16px;line-height:1.3;letter-spacing:-.02em}.experience-selected-arrow{display:none}.experience-stage{border:0;padding-left:0}.experience-spines{max-width:30px;flex-basis:30px}.experience-spines button{width:15px;margin-bottom:72px}.experience-spines button+button{margin-bottom:80px}.experience-spines span{font-size:7px;margin:12px 0}.experience-panels{padding:4px 4px 0}.experience-caption{gap:8px;min-height:68px;font-size:8px}.experience-open{font-size:11px;gap:12px;padding:10px 0 8px;min-height:44px}.experience-baseline{margin-top:28px}.experience-dialog-bar{padding:6px 10px}}
@media(prefers-reduced-motion:reduce){.experience-panel{animation:none}.experience-gallery *{transition:none!important}}

/* Keep the original index and preview layout for one selected work. */
.experience-single .experience-tabs{flex:none}
.experience-single .experience-tab{flex:none;min-height:112px}
.experience-single .experience-image-button{cursor:pointer}
@media(max-width:700px){.experience-single .experience-tabs{grid-template-columns:1fr}.experience-single .experience-tab{min-height:60px}}