.reading-progress{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;z-index:100;pointer-events:none}
.hero{background-image:radial-gradient(ellipse at 76% 53%,#b1c77b10,transparent 58%)}
.hero h1{animation:title-enter 1.1s cubic-bezier(.2,.7,.2,1) both}.hero h1 em{text-shadow:0 0 65px #d5fa5822}
@keyframes title-enter{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.sculpture canvas{filter:drop-shadow(0 24px 30px #0008)}
.hero-hint{display:flex;align-items:center;gap:12px;font-size:8px;letter-spacing:1.6px;color:#939786;position:absolute;right:6%;top:110px}.hero-hint:before{content:'+';color:var(--accent);font-size:17px}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.reveal.revealed,.reveal:focus-within{opacity:1;transform:translateY(0)}
.project-art{transition:transform .3s ease;transform-origin:center;overflow:hidden}.real-project:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at var(--light-x,50%) var(--light-y,50%),#fff2,transparent 55%);opacity:0;pointer-events:none;transition:opacity .4s}.project:hover .real-project:after{opacity:1}
.work-number{position:absolute;top:19px;left:20px;font-size:10px;color:#fff;letter-spacing:2px;background:#1118;border:1px solid #ffffff30;padding:7px 10px;border-radius:30px}.project:hover .media-badge{background:var(--accent);border-color:var(--accent);color:#111}.media-badge{transition:background .3s,color .3s}.project-caption h3{transition:color .3s}.project:hover .project-caption h3{color:var(--accent)}
.work .project-grid{row-gap:65px}.project:last-child:nth-child(odd){grid-column:1/-1}.project:last-child:nth-child(odd) .project-art{aspect-ratio:2.15}.project:last-child:nth-child(odd) .project-art img{object-position:center 45%}
.chapter-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 5%;display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:9px;letter-spacing:1.5px}.chapter-strip>span:last-child{color:var(--accent)}
nav a[aria-current]{color:var(--accent)}
.project-navigation{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:24px;margin:35px 0 20px;gap:15px}.project-navigation button{border:1px solid #555846;background:none;color:var(--ink);padding:12px 20px;border-radius:30px;font-size:12px;transition:background .2s,color .2s}.project-navigation button:hover:not(:disabled){background:var(--accent);color:#111}.project-navigation button:disabled{opacity:.3;cursor:default}#project-position{font-size:11px;letter-spacing:2px;color:var(--muted)}
#project-dialog[open]{animation:dialog-enter .3s ease}#project-dialog::backdrop{background:#080907e8;backdrop-filter:blur(14px)}@keyframes dialog-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.contact-star{transition:transform .9s cubic-bezier(.2,.7,.2,1)}.contact:hover .contact-star{transform:rotate(90deg)}.contact-bottom button{transition:transform .25s,box-shadow .25s}.contact-bottom button:hover{transform:translateY(-4px);box-shadow:0 8px 0 #171a1020}
@media(max-width:600px){.hero-hint{display:none}.chapter-strip{font-size:7px;padding:16px 6%}.chapter-strip>span:nth-child(2){display:none}.work .project-grid{row-gap:32px}.project:last-child:nth-child(odd) .project-art{aspect-ratio:1.32}.project-navigation button{padding:10px 13px;font-size:11px}.project-navigation{gap:8px}}
@media(prefers-reduced-motion:reduce){.hero h1,#project-dialog[open]{animation:none}.reveal{opacity:1;transform:none}.project-art,.contact-star,.contact-bottom button{transform:none!important}.reveal,.project-art{transition:none}}