/* Canonical visibility and geometry. The router is the only display owner. */
.portfolio-ready body { width:100%; height:100svh; height:100dvh; min-height:0; overflow:hidden; overscroll-behavior:none; }
.portfolio-ready .portfolio { display:none; }
.portfolio-app { position:fixed; z-index:40; inset:0; width:100%; height:100svh; height:100dvh; overflow:hidden; isolation:isolate; background:#fff; }
.portfolio-app *, .portfolio-app *::before, .portfolio-app *::after { animation:none !important; transition:none !important; }
.portfolio-app > [data-app-view] { position:absolute; inset:0; width:100%; height:100%; min-height:0; margin:0; background:#fff; opacity:1; }
.portfolio-app [data-app-view="off"] { display:none !important; }
.portfolio-app > [data-app-view="current"], .portfolio-app > [data-app-view="outgoing"] { display:block; }
.portfolio-app [data-app-view="current"] { z-index:3; }
.portfolio-app [data-app-view="outgoing"] { z-index:2; }
.portfolio-app > .document-desk[data-app-view]:not([data-app-view="off"]) { display:grid; place-items:center; overflow:hidden; }
.portfolio-app > .catalog-screen[data-app-view]:not([data-app-view="off"]) { display:flex; background:transparent; pointer-events:auto; }
.portfolio-app > .work-reader[data-app-view]:not([data-app-view="off"]) { display:flex; flex-direction:column; }
.portfolio-app .profile-title-svg path { fill-opacity:1; stroke:none; stroke-dashoffset:0; }
.portfolio-app .profile-character img { opacity:1; transform:none; filter:none; }
.portfolio-app .profile-footer__content, .portfolio-app [data-profile-reveal] { clip-path:none; }
.portfolio-app .document-desk__surface { clip-path:none; }
.portfolio-app .portfolio-document { opacity:1; transform:rotate(-1.1deg); filter:none; }
.portfolio-app .portfolio-document__flap { display:block; }
.portfolio-app .catalog-backdrop { position:absolute; z-index:0; inset:0; background:#fff; opacity:1; pointer-events:none; }
.portfolio-app .catalog-screen__grid { position:relative; z-index:1; }
.portfolio-app .catalog-screen__title, .portfolio-app .catalog-screen__footer, .portfolio-app .mobile-catalog-intro { z-index:1; }
.portfolio-app .catalog-card { opacity:1; transform:none; }
.portfolio-app .catalog-screen [data-catalog-text] { clip-path:none; }
.portfolio-app .work-image__open:hover img { transform:none; }
.portfolio-app .work-reveal { opacity:1; transform:none; }
/* A scene always owns opaque paper, independent of its decorative gradients. */
.portfolio-app .work-section[data-app-view], .portfolio-app .work-ending[data-app-view] { background-color:#fff; }
.portfolio-app .work-reader__header { background:#fff; }
.portfolio-app[data-phase="transitioning"] .work-scene__body { overflow-y:hidden; }
.portfolio-app .work-type, .portfolio-app .work-swatch { position:relative; isolation:isolate; }
/* The phone crosses the right column before landing in its left-hand slot. */
.portfolio-app .work-showcase { isolation:isolate; }
.portfolio-app .work-showcase > .work-device { position:relative; z-index:2; }
.portfolio-app .work-showcase > .work-system { position:relative; z-index:1; }
.portfolio-app .scene-curtain { position:absolute; z-index:4; inset:0; background:#fff; transform:scaleX(0); transform-origin:left center; pointer-events:none; }
.scene-count { display:inline-flex; height:1.1em; line-height:1.1; vertical-align:bottom; font-variant-numeric:tabular-nums; letter-spacing:inherit; }
.scene-count i, .scene-count { font-style:normal; }
.scene-count__digit { display:block; height:1.1em; overflow:hidden; }
.scene-count__reel { display:flex; flex-direction:column; }
.scene-count__reel > i { display:block; height:1.1em; line-height:1.1; flex:none; }
.scene-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.portfolio-loader { position:fixed; z-index:200; inset:0; align-items:center; justify-content:center; background:#fff; color:#171717; font:14px/1.6 system-ui,sans-serif; }
.portfolio-js .portfolio-loader[hidden] { display:none; }
.portfolio-loader__card { width:min(320px,calc(100vw - 48px)); }
.portfolio-loader__brand { margin:0 0 48px; color:#b85852; font-size:30px; font-weight:700; letter-spacing:-.04em; }
.portfolio-loader__brand span { display:block; margin-top:5px; font-size:10px; font-weight:500; letter-spacing:.16em; }
.portfolio-loader progress { display:block; appearance:none; width:100%; height:3px; margin:18px 0; border:0; background:#eee9e5; accent-color:#b85852; }
.portfolio-loader progress::-webkit-progress-bar { background:#eee9e5; }
.portfolio-loader progress::-webkit-progress-value { background:#b85852; }
.portfolio-loader__detail { color:#85817e; font-size:12px; }
.portfolio-loader button { margin:12px 16px 0 0; padding:6px 0; border:0; border-bottom:1px solid #b85852; background:none; color:#b85852; font:inherit; cursor:pointer; }
.portfolio-loader.is-page-loading { inset:auto 20px 20px auto; width:min(320px,calc(100vw - 40px)); padding:20px; box-shadow:0 6px 40px #251c1420; border:1px solid #ece8e4; border-radius:8px; }
.portfolio-loader.is-page-loading .portfolio-loader__brand { display:none; }
.portfolio-loader.is-page-loading p { margin-block:0 8px; }
.portfolio-app .work-reader__catalog { cursor:pointer; }
.portfolio-app button:disabled { cursor:default; }
.portfolio-app h2:focus, .portfolio-app h3:focus, .portfolio-app section:focus { outline:none; }
.portfolio-app .work-reader.is-paged .work-section[data-app-view="outgoing"] { display:block; }
.portfolio-app .work-reader.is-paged .work-project[data-app-view="outgoing"],
.portfolio-app .work-reader.is-paged .work-chapter[data-app-view="outgoing"],
.portfolio-app .work-reader.is-paged .work-ending[data-app-view="outgoing"] { display:flex; flex-direction:column; justify-content:center; padding:48px 8%; }
@media (max-width:959px) {
  .portfolio-app .work-section[data-app-view="current"], .portfolio-app .work-section[data-app-view="outgoing"],
  .portfolio-app .work-ending[data-app-view="current"], .portfolio-app .work-ending[data-app-view="outgoing"] { display:flex; }
  .portfolio-app .mobile-catalog-intro { position:relative; }
  .portfolio-app .mobile-pager { z-index:10; }
  .portfolio-app .mobile-pager[hidden] { display:none; }
}
