body[data-page="visual"] .detail-hero{isolation:isolate}
body[data-page="visual"] .detail-hero::before{content:"";position:absolute;z-index:-1;right:7%;top:14%;width:min(28vw,340px);aspect-ratio:1;border:1px solid rgba(255,101,219,.12);border-radius:50%;box-shadow:0 0 0 44px rgba(255,101,219,.025),0 0 0 88px rgba(255,101,219,.018);pointer-events:none}
body[data-page="visual"] .detail-hero::after{content:"✦  VISUAL ARCHIVE  /  2026";display:block;margin-top:56px;color:#a577a5;font:600 .67rem/1.5 ui-monospace,Consolas,monospace;letter-spacing:.2em}
body[data-page="visual"] .collection{position:relative}
body[data-page="visual"] .collection::before{content:"";position:absolute;z-index:-1;left:0;right:0;top:0;bottom:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),rgba(255,255,255,.025) calc(25% - 1px),rgba(255,255,255,.025) 25%);mask-image:linear-gradient(180deg,transparent,#000 9%,#000 89%,transparent)}
body[data-page="visual"] .collection-section{--rail-accent:#ff65db;position:relative}
body[data-page="visual"] #reel{--rail-accent:#ad83ff}
body[data-page="visual"] #brand{--rail-accent:#53ffe0}
body[data-page="visual"] #digital{--rail-accent:#d4ff48}
body[data-page="3d"] .collection-section{--rail-accent:#d4ff48;position:relative}
body[data-page="3d"] #modeling{--rail-accent:#53ffe0}
body[data-page="3d"] #rigging{--rail-accent:#ad83ff}
body[data-page="3d"] #layout{--rail-accent:#ff65db}
body[data-page="ue5"] .collection-section{--rail-accent:#53ffe0;position:relative}
body[data-page="3d"] .collection-head{margin-bottom:24px}
body[data-page="3d"] .collection-number{color:var(--rail-accent)}
body[data-page="visual"] .collection-head{margin-bottom:24px}
body[data-page="visual"] .collection-number{color:var(--rail-accent)}
body[data-page="visual"] .collection-section::before{content:"";position:absolute;right:2px;top:14px;width:62px;height:62px;border:1px solid color-mix(in srgb,var(--rail-accent) 38%,transparent);border-radius:50%;pointer-events:none;opacity:.6}
body[data-page="visual"] .collection-section::after{content:"✦";position:absolute;right:24px;top:29px;color:var(--rail-accent);font-size:18px;pointer-events:none;opacity:.8}
.visual-carousel-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:0 0 16px;padding:12px 0;border-top:1px solid rgba(255,255,255,.16)}
.visual-carousel-toolbar[hidden],.visual-carousel-progress[hidden]{display:none}
.visual-carousel-kicker{color:#b7b8c2;font:600 .68rem/1.6 ui-monospace,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase}
.visual-carousel-actions{display:flex;align-items:center;gap:10px}
.visual-carousel-count{min-width:71px;margin-right:8px;color:var(--rail-accent);font:700 .8rem/1 ui-monospace,Consolas,monospace;letter-spacing:.12em;text-align:right}
.visual-carousel-arrow{display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid color-mix(in srgb,var(--rail-accent) 43%,#44454b);border-radius:50%;background:#111218;color:#f2f3f8;font:400 1.3rem/1 Arial,sans-serif;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.visual-carousel-arrow:hover:not(:disabled),.visual-carousel-arrow:focus-visible{background:color-mix(in srgb,var(--rail-accent) 17%,#111218);border-color:var(--rail-accent);transform:translateY(-2px)}
.visual-carousel-arrow:disabled{opacity:.33;cursor:default}
.visual-carousel-window{position:relative;min-width:0}
.visual-carousel-window .project-grid{position:relative;display:flex;gap:22px;margin:0;padding:0 0 13px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:none;scrollbar-width:none;overscroll-behavior-inline:contain;touch-action:pan-x pan-y}
.visual-carousel-window .project-grid::-webkit-scrollbar{display:none}
.visual-carousel-window .project-slot,.visual-carousel-window .uploaded-work{flex:0 0 calc((100% - 22px)/2);width:auto;min-width:0;grid-column:auto;scroll-snap-align:start;scroll-snap-stop:always}
.visual-carousel-window .project-slot{min-height:340px;border-color:color-mix(in srgb,var(--rail-accent) 45%,#353741);background:radial-gradient(ellipse at 79% 13%,color-mix(in srgb,var(--rail-accent) 13%,transparent),transparent 45%),linear-gradient(145deg,#171720,#0d0e12)}
.visual-carousel-window .project-slot .media-slot{border-color:color-mix(in srgb,var(--rail-accent) 37%,#464852)}
.work-page:is([data-page="visual"],[data-page="3d"]) .visual-carousel-window .uploaded-work{background:linear-gradient(150deg,#1d1a24,#0c0d12);border-color:color-mix(in srgb,var(--rail-accent) 30%,#343640)}
.visual-carousel-window .uploaded-work:hover{border-color:var(--rail-accent)}
.visual-carousel-window .uploaded-work>img,.visual-carousel-window .uploaded-work>video{height:300px;object-fit:contain;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--rail-accent) 8%,#111218),#08090b 68%)}
body[data-page="ue5"] .visual-carousel-window .uploaded-work>img,body[data-page="ue5"] .visual-carousel-window .uploaded-work>video{object-fit:cover;background:#08090b}
.work-page:is([data-page="visual"],[data-page="3d"]) .visual-carousel-window .uploaded-caption{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:22px 25px;border-top:1px solid rgba(255,255,255,.1)}
.work-page:is([data-page="visual"],[data-page="3d"]) .visual-carousel-window .uploaded-caption h3{margin:0}
.work-page:is([data-page="visual"],[data-page="3d"]) .visual-carousel-window .uploaded-caption>span{color:var(--rail-accent);text-align:right}
.visual-carousel-window .gallery-empty{flex:1 0 100%;border-top:0;padding:60px 10px 70px;text-align:center}
.visual-carousel-progress{height:2px;margin-top:2px;background:rgba(255,255,255,.1);overflow:hidden}
.visual-carousel-progress>span{display:block;width:0;height:100%;background:var(--rail-accent);box-shadow:0 0 12px var(--rail-accent)}
.visual-carousel-hint{margin:13px 0 0;color:#8e919c;font:500 .7rem/1.6 ui-monospace,Consolas,monospace;letter-spacing:.06em}
.visual-carousel-hint::before{content:"↔";margin-right:9px;color:var(--rail-accent);font-size:1rem}
@media(max-width:700px){
  body[data-page="visual"] .detail-hero::before{right:10%;top:20%;width:38vw}
  body[data-page="visual"] .detail-hero::after{margin-top:34px}
  body[data-page="visual"] .collection-section::before,body[data-page="visual"] .collection-section::after{display:none}
  .visual-carousel-toolbar{padding-top:10px}
  .visual-carousel-kicker{font-size:.58rem;letter-spacing:.08em}
  .visual-carousel-arrow{width:37px;height:37px}
  .visual-carousel-count{min-width:57px;margin-right:1px;font-size:.7rem}
  .visual-carousel-window .project-grid{gap:13px}
  .visual-carousel-window .project-slot,.visual-carousel-window .uploaded-work{flex-basis:calc(100% - 38px)}
  body[data-page="ue5"] .visual-carousel-window .project-slot,body[data-page="ue5"] .visual-carousel-window .uploaded-work{flex-basis:100%}
  .visual-carousel-window .project-slot{min-height:325px}
  .visual-carousel-window .uploaded-work>img,.visual-carousel-window .uploaded-work>video{height:235px}
  .work-page:is([data-page="visual"],[data-page="3d"]) .visual-carousel-window .uploaded-caption{display:block;padding:19px}
  .work-page:is([data-page="visual"],[data-page="3d"]) .visual-carousel-window .uploaded-caption>span{display:block;margin-top:8px;text-align:left}
  .visual-carousel-hint{font-size:.62rem}
}
@media(prefers-reduced-motion:reduce){.visual-carousel-arrow{transition:none}.visual-carousel-window .project-grid{scroll-behavior:auto;scroll-snap-type:x mandatory}}
