.project-panel { position:fixed; inset:0; margin:0; padding:0; border:0; box-sizing:border-box; width:100vw; max-width:none; height:100vh; height:100svh; max-height:none; overflow:hidden; color:#fff; background:#292929; transform:translate3d(-100%,0,0); transition:transform .75s cubic-bezier(.22,1,.36,1); overscroll-behavior:contain; }
.project-panel[open] { display:block; }
.project-panel.is-visible { transform:translate3d(0,0,0); }
body:has(#project-panel[open]) #main .section.show .bg,
body:has(#project-panel[open]) #main .section.show .detail::before,
body:has(#project-panel[open]) #main .section.show .detail .line::before { animation-play-state:paused; }
.project-panel::backdrop { background:transparent; transition:background-color .75s ease; }
.project-panel.is-visible::backdrop { background:rgba(0,0,0,.35); }
.project-panel-title { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.project-panel iframe { display:block; width:100%; height:100%; border:0; background:#292929; opacity:0; transform:translate3d(20px,0,0); transition:opacity .5s ease,transform .7s cubic-bezier(.22,1,.36,1); }
.project-panel.is-loaded iframe { opacity:1; transform:translate3d(0,0,0); }
.project-panel-close, .image-viewer .viewer-close { position:absolute; z-index:2; top:32px; right:24px; display:grid; place-items:center; width:44px; height:44px; margin:0; padding:0; border:0; outline:none; box-shadow:none; background:transparent; color:#fff; cursor:pointer; }
.project-panel-close[hidden] { display:none; }
.project-panel-close svg, .viewer-close svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.2; filter:drop-shadow(0 1px 3px #0008); transition:transform .25s,stroke-width .25s; }
.project-panel-close:hover svg, .project-panel-close:focus-visible svg, .viewer-close:hover svg, .viewer-close:focus-visible svg { transform:scale(1.1); stroke-width:1.8; }
.project-panel-close:focus-visible, .image-viewer .viewer-close:focus-visible { outline:none; }
.project-panel-status { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; padding:30px; font:300 13px/1.6 Roboto,Arial,sans-serif; text-align:center; }
.project-panel-status .panel-wordmark { font-size:28px; font-weight:500; letter-spacing:.01em; }
.project-panel-status .panel-wordmark small { margin-left:5px; font-size:13px; font-weight:400; }
.project-panel.is-loaded .project-panel-status { display:none; }
.project-panel-error, .project-panel.is-error .project-panel-loading { display:none; }
.project-panel.is-error .project-panel-error { display:block; }
.project-panel-error button { display:inline-block; min-height:44px; margin-top:14px; padding:8px 0; border:0; border-bottom:1px solid #ffffff80; color:#fff; background:transparent; cursor:pointer; font:inherit; }
.project-panel-error button:focus-visible { outline:1px solid #fff; outline-offset:4px; }
.project-embedded { scrollbar-gutter:auto; scrollbar-width:none; }
.project-embedded::-webkit-scrollbar { display:none; }
.project-embedded .menu { display:none; }
.project-embedded .meunRBox { display:none; }
@media(max-width:767px) {
  .project-panel-close, .image-viewer .viewer-close { top:14px; right:12px; }
  .project-panel-close svg, .viewer-close svg { width:20px; height:20px; }
}
@media(prefers-reduced-motion:reduce) { .project-panel, .project-panel iframe, .project-panel::backdrop, .project-panel-close svg, .viewer-close svg { transition:none; } }

/* Office and project details use X controls; Office retains its rail position. */
.project-panel-close .panel-back-icon { display:none; }
.project-panel.is-office .project-panel-close { top:13px; right:13px; background:#292929; }
.project-panel.is-office .panel-close-icon { display:none; }
.project-panel.is-office .panel-back-icon { display:block; }
.project-panel-close:focus-visible { outline:1px solid #fff; outline-offset:-5px; }
.project-embedded .office-page .meunRBox { display:block; pointer-events:none; }

@media(max-width:767px) { .project-panel.is-office .project-panel-close { top:8px; right:0; } }
