#project-detail{position:fixed;inset:0;z-index:20;background:#fff;overflow:hidden;overscroll-behavior:none;color:#262626}
body[data-view=detail]{overflow:hidden;overscroll-behavior:none}body[data-view=detail] #portfolio-shell{visibility:hidden}
.detail-header{position:absolute;left:32px;right:32px;top:28px;display:grid;grid-template-columns:130px 1fr auto;align-items:start;gap:28px;z-index:3}
.detail-back{justify-self:start;font-size:9px;letter-spacing:.04em;min-height:32px}.detail-information h1{font-size:14px;letter-spacing:.025em;font-weight:400;text-transform:uppercase;margin:7px 0 10px;line-height:1.3}.detail-subtitle{font-size:11px;color:#858585;margin:0;line-height:1.45}.detail-year{font-size:10px;margin-top:9px;font-variant-numeric:tabular-nums}
.board-stage{position:absolute;top:132px;bottom:78px;left:0;right:0;padding:0 clamp(56px,5vw,90px);overflow:visible;touch-action:pan-y pinch-zoom;user-select:none}
.board-window{position:absolute;overflow:hidden;contain:paint;cursor:zoom-in;touch-action:pan-y pinch-zoom}
.board-stage.dragging .board-window{cursor:grabbing}.board-track{position:absolute;inset:0;will-change:transform}.board-slide{position:absolute;top:0;width:100%;height:100%;display:grid;place-items:center}
.board-slide img{display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain;user-select:none;pointer-events:none;border:0;border-radius:0;box-shadow:none}
.board-slide img[hidden]{display:none}.board-load-message{position:absolute;inset:50% 15% auto;margin:0;text-align:center;font-size:11px;color:#888}.board-load-message[hidden]{display:none}.board-load-message button{display:block;margin:20px auto 0;font-size:9px;padding:12px}
.board-arrow{position:absolute;z-index:2;top:var(--board-mid);transform:translate(-50%,-50%);width:96px;height:128px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .16s;cursor:pointer;touch-action:pan-y pinch-zoom}
.board-prev{left:calc(var(--board-left) - 36px)}.board-next{left:calc(var(--board-right) + 36px)}.board-arrow span{display:grid;place-items:center;width:24px;height:48px;font-size:26px;font-weight:300;line-height:1}
#project-detail[data-edge=left] .board-prev:not(:disabled),#project-detail[data-edge=right] .board-next:not(:disabled),.board-arrow:focus-visible{opacity:.85}.board-arrow:disabled{opacity:0;cursor:default;pointer-events:none}.board-stage.dragging .board-arrow{opacity:0}
.board-counter{position:absolute;left:50%;bottom:29px;transform:translateX(-50%);font-size:10px;letter-spacing:.05em;font-variant-numeric:tabular-nums;color:#777}.board-empty{position:absolute;inset:48% 24px auto;text-align:center;font-size:12px;color:#888}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.index-cover-link{position:fixed;display:block;color:transparent;background:transparent;touch-action:none}.index-cover-link:focus-visible{outline:1px solid #333;outline-offset:6px}#project-title-link{font:inherit;color:inherit;text-decoration:none;pointer-events:auto}#project-title-link:hover{text-decoration:underline;text-underline-offset:4px}
body:not([data-phase=drum]) #project-title-link{visibility:hidden;pointer-events:none}
@media(max-width:650px){.detail-header{left:20px;right:20px;top:18px;grid-template-columns:1fr auto;gap:12px}.detail-back{grid-column:1;grid-row:1;min-height:28px}.detail-information{grid-column:1 / -1;grid-row:2}.detail-information h1{font-size:12px;margin:0 0 7px}.detail-subtitle{font-size:10px;max-width:88%}.detail-year{grid-row:1;grid-column:2;margin-top:8px;font-size:9px}.board-stage{top:146px;bottom:72px;padding:0 58px}.board-arrow{width:44px;height:80px}.board-arrow span{font-size:22px}.board-counter{bottom:29px;font-size:9px}}
@media(hover:none){.board-arrow:not(:disabled){opacity:.55}}
@media(max-height:500px){.detail-header{top:12px;left:24px;right:24px;grid-template-columns:90px 1fr auto;gap:18px}.detail-back{grid-column:1;grid-row:1}.detail-information{grid-column:2;grid-row:1}.detail-information h1{font-size:11px;margin:5px 0}.detail-subtitle{font-size:9px;max-width:none}.detail-year{grid-column:3;grid-row:1}.board-stage{top:82px;bottom:46px;padding:0 60px}.board-counter{bottom:17px}}
@media(prefers-reduced-motion:reduce){.board-arrow{transition:none}}

.detail-header,.board-counter{transition:opacity .35s}
#project-detail.inspecting>.detail-header,#project-detail.inspecting>.board-counter{opacity:.08}
#project-detail.inspecting>.board-stage>.board-arrow{opacity:0;pointer-events:none}
.board-inspection{position:fixed;inset:0;z-index:10;overflow:hidden;touch-action:none;user-select:none;overscroll-behavior:none}
.board-inspection[hidden]{display:none}
.inspection-backdrop{position:absolute;inset:0;background:rgba(255,255,255,.96);opacity:0;transition:opacity .4s;cursor:zoom-out}
.inspecting .inspection-backdrop{opacity:1}
.inspection-frame{position:absolute;transform-origin:0 0;overflow:visible;will-change:transform}
.inspection-frame.switching{overflow:hidden}
.inspection-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;transform-origin:center;cursor:zoom-in;max-width:none;border:0;border-radius:0;box-shadow:none;user-select:none;touch-action:none;will-change:transform}
.board-inspection[data-zoomed=true] .inspection-image{cursor:grab}.board-inspection.panning .inspection-image{cursor:grabbing}
.inspection-close,.inspection-prev,.inspection-next{position:absolute;z-index:2;display:grid;place-items:center;width:44px;height:44px;background:rgba(255,255,255,.9);cursor:pointer;font-weight:300;font-size:25px}
.inspection-close{top:12px;right:16px;font-size:28px}.inspection-prev{left:12px;top:calc(50% - 22px)}.inspection-next{right:12px;top:calc(50% - 22px)}
.inspection-prev:disabled,.inspection-next:disabled{visibility:hidden;pointer-events:none}
.inspection-footer{position:absolute;z-index:2;bottom:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:24px;white-space:nowrap;font-size:9px;letter-spacing:.04em;color:#777;background:rgba(255,255,255,.92);padding:0 10px;min-height:28px}
.inspection-fit{font:inherit;letter-spacing:inherit;min-height:32px;padding:0 6px;cursor:pointer;color:#444}
.inspection-counter{font-variant-numeric:tabular-nums}
.inspection-close,.inspection-prev,.inspection-next,.inspection-footer{opacity:0;transition:opacity .25s}
.inspecting .inspection-close,.inspecting .inspection-prev,.inspecting .inspection-next,.inspecting .inspection-footer{opacity:1}
.board-window:focus-visible{outline:1px solid #888;outline-offset:5px}
@media(max-width:650px){.inspection-prev{left:0}.inspection-next{right:0}.inspection-prev,.inspection-next{width:30px}.inspection-close{right:8px;top:8px}.inspection-help{display:none}.inspection-footer{bottom:14px}}
@media(max-height:500px){.inspection-footer{bottom:5px}.inspection-close{top:2px}}
@media(prefers-reduced-motion:reduce){.detail-header,.board-counter,.inspection-backdrop,.inspection-close,.inspection-prev,.inspection-next,.inspection-footer{transition:none}}
