/* INDEX — hand, paper, steel. The baseline owns composition and colour. */
:root{--workshop-ease:cubic-bezier(.2,.8,.22,1);--workshop-settle:cubic-bezier(.17,.9,.25,1.08)}
.mobile-nav{max-height:calc(100dvh - var(--header-height));overflow-y:auto;overscroll-behavior:contain}
.motion-ready:not(.workshop-motion) .returned-photo{opacity:1}
html{scrollbar-color:#77816a #e8e4da;scrollbar-width:thin}
body::-webkit-scrollbar{width:10px}body::-webkit-scrollbar-track{background:#e8e4da}body::-webkit-scrollbar-thumb{background:#77816a;border:2px solid #e8e4da;border-radius:8px}
::selection{background:#b6d1d8;color:#222a24}
.workshop-motion .reading-line{height:3px;background:repeating-linear-gradient(90deg,#59644d 0 12px,transparent 12px 15px);transition:opacity .2s}
.workshop-motion .hero{--paper-turn:0deg;--paper-lift:0px}
.hero-brand,.hero-note,.hero-corner{z-index:2}
.workshop-motion .hero-note{transform-origin:50% 7%;transform:translate(-50%,calc(-5% + var(--paper-lift))) rotate(calc(-3deg + var(--paper-turn)));transition:transform .5s var(--workshop-settle),box-shadow .5s;box-shadow:0 2px 2px #28302120,3px 8px 11px #28302135}
.hero-note:before{content:'';position:absolute;left:50%;top:-4px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:radial-gradient(circle at 35% 25%,#f4f2db,#767d68 60%,#343d2d);box-shadow:1px 2px 2px #26332250}
.hero-note:after{content:'';position:absolute;right:0;bottom:0;width:17px;height:17px;background:linear-gradient(135deg,transparent 48%,#c9c3b5 50%,#f8f4e6 67%);opacity:.85;transition:width .4s,height .4s;pointer-events:none}
.workshop-motion .hero-note:hover,.workshop-motion .hero-note:focus-visible{--paper-lift:-5px;--paper-turn:3deg;box-shadow:1px 13px 18px #28302140}
.hero-note:hover:after{width:23px;height:23px}
.workshop-motion .introduction{position:relative;isolation:isolate;overflow:hidden}
.workshop-motion .check-list li{position:relative}
.workshop-motion .check-list li:after{content:'';position:absolute;left:31px;right:0;bottom:-5px;height:1px;background:linear-gradient(90deg,#74776a,transparent);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--workshop-ease);pointer-events:none}
.workshop-motion .check-list li:hover:after{transform:scaleX(1)}
.workshop-motion .small-rule{position:relative}.workshop-motion .small-rule:after{content:'';position:absolute;left:0;top:-3px;width:4px;height:7px;background:#59644d;transform:translateX(var(--intro-mark,0px));transition:transform .55s var(--workshop-ease)}
.service-tabs{position:relative;isolation:isolate}
.service-index-marker{position:absolute;left:-18px;top:0;width:3px;height:30px;background:linear-gradient(90deg,#9da58c,#4b5740,#e7e9d3);transform:translateY(var(--index-y,0px));transition:transform .55s var(--workshop-settle),opacity .2s;pointer-events:none;box-shadow:1px 1px 2px #0002}
.service-index-marker:before{content:'';position:absolute;width:6px;height:6px;border:1px solid #606953;top:12px;left:-2px;transform:rotate(45deg);background:#ede9de}
.service-tabs button{position:relative;isolation:isolate}
.service-tabs button:before{content:'';position:absolute;inset:4px -8px;z-index:-1;background:linear-gradient(100deg,#dfe3d3a0,transparent);transform:scaleX(0);transform-origin:left;transition:transform .42s var(--workshop-ease)}
.service-tabs button[aria-selected=true]:before{transform:scaleX(1)}
.workshop-motion .service-tabs button:hover{padding-left:0}
.workshop-motion .service-visual{--lens-size:170px;isolation:isolate}
.service-file-edge{position:absolute;inset:0;pointer-events:none;border-left:5px solid #e6e0d1;opacity:0;z-index:3}
.service-visual.is-switching .service-file-edge{opacity:1}
.workshop-motion .service-visual>img{transition:opacity .26s,transform .65s var(--workshop-ease);transform-origin:50% 55%}
.workshop-motion .service-visual.is-switching>img{transform:translateX(12px) scale(1.015)}
.service-visual .photo-caption{z-index:4;gap:14px;align-items:center;min-height:52px;flex-wrap:wrap}
.caption-detail{display:inline-flex;align-items:center;gap:7px;padding:4px 0;margin-left:auto;background:transparent;color:inherit;border-bottom:1px solid #ece8da70;font-size:10px;letter-spacing:.6px;min-height:30px;white-space:nowrap}
.caption-detail svg{width:14px;height:14px;flex:none}
.photo-caption #service-photo-index{white-space:nowrap}
.service-stamp{transition:transform .55s var(--workshop-settle),box-shadow .4s;transform-origin:15% 0}
.scene-image-status{z-index:5;background:#e4dccd;min-height:100px}.scene-image-status:empty{display:none}
.scene-image-status.has-retry{gap:15px;align-content:center}.scene-image-status button{pointer-events:auto;background:transparent;border-bottom:1px solid currentColor;padding:6px 2px;font-size:12px}
.workshop-motion .button{position:relative;overflow:hidden;isolation:isolate}
.workshop-motion .button:before{content:'';position:absolute;top:-100%;bottom:-100%;width:35%;left:-70%;background:linear-gradient(90deg,transparent,#ffffdf18,transparent);transform:rotate(20deg);transition:left .65s var(--workshop-ease);pointer-events:none;z-index:-1}
.workshop-motion .button:hover:before,.workshop-motion .button:focus-visible:before{left:145%}
.workshop-motion .text-link{position:relative}
.workshop-motion .text-link:after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .38s var(--workshop-ease)}
.workshop-motion .text-link:hover:after,.workshop-motion .text-link:focus-visible:after{transform:scaleX(1)}
.motion-toggle{display:inline-flex;align-items:center;gap:8px;color:inherit;background:none;padding:8px 0;font-size:9px;letter-spacing:1px;min-height:32px;white-space:nowrap}
.motion-toggle .motion-indicator{width:10px;height:10px;border:1px solid currentColor;position:relative;display:inline-block}.motion-toggle:disabled{opacity:.8}
.motion-toggle[aria-pressed=true] .motion-indicator:after{content:'';position:absolute;width:4px;height:4px;background:currentColor;left:2px;top:2px}
.workshop-motion .footer-bottom{position:relative;flex-wrap:wrap;padding-bottom:45px}
.workshop-motion .footer-bottom .motion-toggle{position:absolute;left:0;bottom:0}
.tool-cursor-orbit{position:fixed;left:0;top:0;width:48px;height:48px;border:0;border-radius:1px;pointer-events:none;z-index:2147480000;opacity:0;transform:translate3d(-100px,-100px,0);transition:opacity .2s,width .25s,height .25s;mix-blend-mode:multiply}
.tool-cursor-orbit:before,.tool-cursor-orbit:after{content:'';position:absolute;width:9px;height:17px;top:15px;border:1px solid #56684aaa;transition:transform .2s}.tool-cursor-orbit:before{left:4px;border-right:0;transform:translateX(-2px)}.tool-cursor-orbit:after{right:4px;border-left:0;transform:translateX(2px)}
.tool-cursor-orbit.on-control{opacity:.65}.tool-cursor-orbit.on-dark{border-color:#e9e6ceaa;mix-blend-mode:normal}.tool-cursor-orbit.on-dark:before,.tool-cursor-orbit.on-dark:after{border-color:#e9e6ceaa}
.tool-cursor-orbit.is-pressed:before,.tool-cursor-orbit.is-pressed:after{transform:translateX(0)}
.return-piece{position:absolute;inset:0;pointer-events:none;opacity:0;z-index:0}
.return-piece>picture{display:block;width:100%;height:100%}.return-piece img{display:block;width:100%;height:100%;object-fit:cover}
.return-wrench{clip-path:polygon(19.7% 51.9%,20.3% 49.6%,21.9% 48.2%,24.2% 48.1%,27.5% 50.1%,63.9% 50.1%,64.8% 48.9%,79.1% 48.9%,80.1% 50.5%,80.1% 54.6%,79.1% 55.8%,64.5% 55.8%,63.6% 54.8%,27.3% 54.8%,24.4% 56.7%,21.9% 56.9%,20.2% 55.4%)}
.return-keys{clip-path:polygon(81.9% 26%,83.1% 26%,83.4% 28.8%,85.1% 31%,87.4% 44.7%,84% 47%,81.7% 44.7%,79% 44.7%,78.5% 41%,79.4% 34.1%,80.3% 31%,81.7% 29%);transform-origin:82.3% 29%}
.return-is-playing .return-piece{opacity:1}
.workshop-motion .closing-photo-area .returned-photo{opacity:0;transition:opacity .45s ease}
.workshop-motion .closing-board.is-returned .returned-photo{opacity:1}
.workshop-motion .closing-board.return-is-playing .returned-photo{opacity:0;transition:none}
.workshop-motion .closing-board .key-hotspot{z-index:3;min-width:44px;min-height:44px}
.workshop-motion .closing-photo-area{isolation:isolate}
.closing-photo-area .return-glint{position:absolute;top:46%;height:13%;left:18%;width:63%;pointer-events:none;z-index:1;opacity:0;background:linear-gradient(105deg,transparent 35%,#fff7d767 47%,transparent 59%);mix-blend-mode:soft-light}
.workshop-motion-paused *,.workshop-motion-paused *:before,.workshop-motion-paused *:after{animation:none!important;transition:none!important}
.workshop-motion-paused .tool-cursor-orbit{display:none}
.workshop-motion-paused .hero-note{transform:translate(-50%,-5%) rotate(-3deg)!important}
.workshop-motion-paused .returned-photo{opacity:1!important}
.workshop-motion-paused .return-piece{opacity:0!important}
@media(hover:hover) and (pointer:fine){
 .workshop-motion,.workshop-motion a,.workshop-motion button,.workshop-motion summary,.workshop-motion label,.workshop-motion select,.workshop-motion [role=tab],.workshop-motion [tabindex]{cursor:url('assets/tool-pointer.svg') 6 5,auto}
 .workshop-motion input,.workshop-motion textarea,.workshop-motion [contenteditable=true]{cursor:text}
 .workshop-motion button:disabled,.workshop-motion [aria-disabled=true]{cursor:not-allowed}
}
@media(max-width:800px){.service-index-marker{left:-12px}.service-visual{--lens-size:140px}.caption-detail{font-size:9px}}
@media(max-width:540px){
 .hero-note:after{width:13px;height:13px}.hero-note:before{width:5px;height:5px}
 .service-index-marker{display:none}.service-tabs button:before{inset:4px 5px 4px 0}
 .workshop-motion .service-tabs button+button:hover{padding-left:13px}
 .service-visual .photo-caption{padding:12px 16px;gap:8px;font-size:7px;min-height:52px}.photo-caption #service-photo-label{max-width:54%;line-height:1.6}.caption-detail{font-size:9px;min-height:32px}.photo-caption #service-photo-index{margin-left:0}
 .workshop-motion .service-visual{margin:0 0 20px;--lens-size:130px}
 .return-wrench{clip-path:polygon(12.2% 51.8%,12.8% 50.5%,14.1% 49.5%,17.3% 49.1%,20% 49.8%,22.6% 50.7%,64.6% 50.6%,65.5% 49.9%,87.8% 49.9%,88.5% 50.7%,88.5% 53.7%,87.5% 54.1%,65.4% 54.1%,64.6% 53.4%,22.6% 53.4%,20.4% 54.7%,17.3% 55.1%,14.3% 54.8%,12.7% 53.6%)}
 .return-keys{clip-path:polygon(78.6% 35.1%,80.5% 35.1%,80.5% 36.7%,82.4% 38.9%,84.6% 46.4%,80% 47%,79.5% 45.9%,76.4% 45.9%,74.1% 44.9%,74% 42.8%,76% 40%,77.3% 39%,78.5% 37%);transform-origin:79.8% 36.3%}
 .workshop-motion .closing-board .key-hotspot{display:block;left:74%;top:36%;width:11%;height:11%;transform:none}.key-hotspot>span{font-size:7px;right:90%;padding:7px;transform:none}
 .closing-photo-area .return-glint{top:48%;height:9%;left:10%;width:80%}
 .workshop-motion .closing-intro .replay-return{display:inline-flex;margin-top:20px;min-height:32px;font-size:11px}
 .motion-toggle{font-size:8px}.tool-cursor-orbit{display:none}
}
@media(max-width:360px){.workshop-motion .service-tabs button+button:hover{padding-left:10px}.service-visual .photo-caption{padding:10px 12px;gap:6px}.caption-detail{font-size:8px}}
@media(prefers-reduced-motion:reduce){.tool-cursor-orbit{display:none}.workshop-motion .hero-note{transform:translate(-50%,-5%) rotate(-3deg)}.workshop-motion .returned-photo{opacity:1!important}.return-piece{display:none}.service-stamp{transform:rotate(5deg)!important}}
@media(forced-colors:active){.workshop-motion,.workshop-motion a,.workshop-motion button,.workshop-motion summary,.workshop-motion select{cursor:auto}.tool-cursor-orbit{display:none}.motion-indicator{border:1px solid ButtonText}}