/* Portfolio Displays — Desk: surface, window chrome, content types. */

/* ---------- Surface + slots ---------- */
.pfd-surface { position: relative; }
.e-con > .e-con-inner.pfd-surface { flex: 1 1 auto; min-height: 100%; }

.pfd-slot { --pfd-win-w: 360px; }

@media (min-width: 768px) {
  .pfd-surface > .pfd-slot,
  .pfd-surface > .elementor-element.pfd-slot {
    position: absolute; left: 0; top: 0;
    width: var(--pfd-win-w) !important; max-width: calc(100% - var(--pfd-surface-pad) * 2);
    margin: 0 !important; flex: none !important;
    z-index: var(--pfd-z, 1);
  }
  .pfd-surface:not(.is-laid-out) > .pfd-slot { opacity: 0; }
  /* Entry animation, once. It must not outlive itself: a finished animation that still holds
     `transform` would pin the slot in place and undo every drag. */
  .pfd-surface.is-laid-out > .pfd-slot:not(.is-in) { animation: pfd-win-in var(--pfd-dur) var(--pfd-ease) backwards; animation-delay: calc(var(--pfd-i, 0) * 50ms); }
  .pfd-surface > .pfd-slot.is-dragging, .pfd-surface > .pfd-slot.is-in { animation: none; }
  .pfd-slot.is-dragging .pfd-win { transition: none; }
}
@media (max-width: 767.98px) {
  /* Phones: two columns. Cards span both; tiles and icons take one each. */
  .pfd-surface { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--pfd-surface-gap); align-content: start; }
  .e-con.pfd-surface { padding: max(20px, var(--padding-top, 0px)) max(20px, var(--padding-right, 0px)) max(20px, var(--padding-bottom, 0px)) max(20px, var(--padding-left, 0px)) !important; }
  html.pfd-has-dock .e-con.pfd-surface { padding-bottom: max(124px, var(--padding-bottom, 0px)) !important; }
  .pfd-surface > * { grid-column: 1 / -1; min-width: 0; }
  .pfd-surface > .pfd-slot { position: static !important; width: 100% !important; transform: none !important; order: var(--pfd-morder, 0); margin: 0 !important; }
  .pfd-surface > .pfd-slot.pfd-mobile-hide { display: none !important; }
  .pfd-surface > .pfd-slot.pfd-mobile-large .pfd-win__body { max-height: none; }
  .pfd-surface > .pfd-slot.pfd-mobile-tile, .pfd-surface > .pfd-slot.pfd-slot--icon { grid-column: auto; }
}
@keyframes pfd-win-in { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes pfd-win-out { to { opacity: 0; transform: scale(.96); } }

/* ---------- Window chrome ---------- */
.pfd-win {
  position: relative; display: flex; flex-direction: column;
  background: var(--pfd-bg); color: var(--pfd-fg);
  border-radius: var(--pfd-radius);
  box-shadow: var(--pfd-shadow-soft), 0 0 0 1px var(--pfd-line);
  overflow: hidden; font-family: var(--pfd-font-body);
  transition: box-shadow var(--pfd-dur) var(--pfd-ease);
}
.pfd-slot.is-active .pfd-win, .pfd-child.is-active .pfd-win { box-shadow: var(--pfd-shadow-lift), 0 0 0 1px var(--pfd-line); }
.pfd-win.is-closing { animation: pfd-win-out 180ms var(--pfd-ease) forwards; }

.pfd-win__bar {
  position: relative; flex: none; height: var(--pfd-bar-h);
  display: flex; align-items: center; justify-content: center;
  font: 500 12px/1 var(--pfd-font-ui); letter-spacing: .005em; color: var(--pfd-fg);
  cursor: grab; user-select: none; -webkit-user-select: none; touch-action: none;
}
.pfd-win__bar:active { cursor: grabbing; }
@media (min-width: 768px) and (hover: hover) and (pointer: fine) {
  /* The whole card moves; controls inside keep their own cursors. */
  .pfd-slot:not([data-pfd-draggable="0"]) > .elementor-widget-container > .pfd-win, .pfd-slot:not([data-pfd-draggable="0"]) > .pfd-win, .pfd-child .pfd-win { cursor: grab; }
  .pfd-slot.is-dragging .pfd-win, .pfd-child.is-dragging .pfd-win, .pfd-slot.is-dragging .pfd-win * { cursor: grabbing !important; }
  .elementor-editor-active .pfd-slot .pfd-win { cursor: default; }
}
.pfd-win--mac .pfd-win__bar { border-bottom: 1px solid var(--pfd-line); background: color-mix(in srgb, var(--pfd-fg) 3%, var(--pfd-bg)); }
@supports not (background: color-mix(in srgb, red 1%, blue)) { .pfd-win--mac .pfd-win__bar { background: rgba(0, 0, 0, .03); } }
.pfd-win__title { padding: 0 44px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.pfd-win__lights { position: absolute; left: 10px; top: 0; height: 100%; display: flex; align-items: center; gap: 7px; }
.pfd .pfd-win__light { width: 12px; height: 12px; border-radius: 50%; box-shadow: inset 0 0 0 .5px rgba(0, 0, 0, .14); position: relative; }
.pfd .pfd-win__light--close { background: #ff5f57; }
.pfd .pfd-win__light--min { background: #febc2e; }
.pfd .pfd-win__light--max { background: #28c840; }
.pfd-win__light::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: rgba(0, 0, 0, .35); opacity: 0; transition: opacity 120ms; }
.pfd-win__bar:hover .pfd-win__light::after { opacity: 1; }
.pfd-win__light[disabled] { opacity: .35; cursor: default; }

.pfd-win--minimal .pfd-win__x,
.pfd-win--none .pfd-win__x {
  position: absolute; right: 8px; top: 8px; width: 22px; height: 22px; border-radius: 50%;
  display: grid; place-items: center; background: var(--pfd-bg); color: var(--pfd-fg);
  box-shadow: 0 0 0 1px var(--pfd-line); opacity: 0; transition: opacity 140ms; z-index: 2;
}
.pfd-win--minimal .pfd-win__x { top: 5px; }
.pfd-win:hover .pfd-win__x, .pfd-win__x:focus-visible { opacity: 1; }
.pfd-win__x svg { width: 10px; height: 10px; }

.pfd-win--none { cursor: grab; }
.pfd-win--none.is-dragging, .pfd-slot.is-dragging .pfd-win--none { cursor: grabbing; }

.pfd-win__body { position: relative; flex: 1 1 auto; min-height: 0; }
.pfd-win__body.is-scroll { overflow: auto; max-height: var(--pfd-win-maxh, 70vh); overscroll-behavior: contain; }
.pfd-win.is-min .pfd-win__body { display: none; }
.pfd-win.is-min .pfd-win__bar { border-bottom: 0; }

/* Child windows (gallery expand, folder files) */
.pfd-child { position: absolute; left: 0; top: 0; width: var(--pfd-win-w, 420px); max-width: calc(100vw - 32px); z-index: 500; }
.pfd-child.is-fixed { position: fixed; }
.pfd-child .pfd-win { animation: pfd-win-in var(--pfd-dur) var(--pfd-ease) both; }
.pfd-child .pfd-win__body img { width: 100%; height: auto; }
.pfd-child .pfd-win__body video { width: 100%; }
.pfd-child .pfd-win__body iframe { width: 100%; aspect-ratio: 16 / 9; }
.pfd-child .pfd-note { padding: 18px 20px; font-size: 14px; line-height: 1.5; }
.pfd-child .pfd-note p + p { margin-top: .75em; }
@media (max-width: 767.98px) {
  /* Above an open sheet; tall content scrolls inside the window. */
  .pfd-child { position: fixed !important; left: 16px !important; top: 16px !important; width: calc(100vw - 32px) !important; transform: none !important; z-index: 2147483100 !important; }
  .pfd-child .pfd-win { max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); }
  .pfd-child .pfd-win__body { overflow-y: auto; }
}

/* ---------- Content: text ---------- */
.pfd-text { padding: 20px 22px 22px; }
.pfd-text__img { margin: -20px -22px 16px; }
.pfd-text__img img { width: 100%; }
.pfd-text h3 { font-family: var(--pfd-font-heading); font-size: 17px; margin-bottom: 8px; }
.pfd-text__body { font-size: 13.5px; line-height: 1.5; color: var(--pfd-fg); }
.pfd-text__body p + p { margin-top: .7em; }
.pfd-text__body a { text-decoration: underline; text-underline-offset: 2px; }
.pfd-text__cta { margin-top: 14px; }
.pfd-text--overlay { position: relative; padding: 0; }
.pfd-text--overlay .pfd-text__img { margin: 0; }
.pfd-text--overlay .pfd-text__inner { position: absolute; inset: auto 0 0 0; padding: 22px; color: #fff; background: linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,0)); }
.pfd-text--overlay.pfd-text--top .pfd-text__inner { inset: 0 0 auto 0; background: linear-gradient(to bottom, rgba(0,0,0,.72), rgba(0,0,0,0)); }
.pfd-text--overlay .pfd-text__body { color: inherit; }

/* ---------- Content: links ---------- */
.pfd-links { padding: 8px 0; }
.pfd-links a { display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; font-size: 14px; }
.pfd-links a:hover { background: color-mix(in srgb, var(--pfd-fg) 4%, transparent); }
.pfd-links a span:last-child { color: var(--pfd-muted); font-size: 12px; }
.pfd-links li + li a { border-top: 1px solid var(--pfd-line); }

/* ---------- Content: clock ---------- */
.pfd-clock { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 0; }
.pfd-clock__city { padding: 16px 18px; text-align: center; }
.pfd-clock__city + .pfd-clock__city { border-left: 1px solid var(--pfd-line); }
.pfd-clock__label { font: 500 11px/1.2 var(--pfd-font-ui); color: var(--pfd-muted); margin-bottom: 6px; }
.pfd-clock__time { font: 500 22px/1 var(--pfd-font-heading); font-variant-numeric: tabular-nums; }
.pfd-clock__time small { font-size: 11px; color: var(--pfd-muted); margin-left: 3px; }
.pfd-clock--stack { grid-auto-flow: row; }
.pfd-clock--stack .pfd-clock__city { display: flex; align-items: baseline; justify-content: space-between; padding: 12px 18px; text-align: left; }
.pfd-clock--stack .pfd-clock__city + .pfd-clock__city { border-left: 0; border-top: 1px solid var(--pfd-line); }
.pfd-clock--stack .pfd-clock__label { margin: 0; }

/* ---------- Content: projects carousel ---------- */
.pfd-carousel { position: relative; overflow: hidden; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.pfd-carousel__track { display: flex; transition: transform 420ms var(--pfd-ease); will-change: transform; }
.pfd-carousel.is-dragging .pfd-carousel__track { transition: none; }
.pfd-carousel__slide { flex: 0 0 100%; position: relative; aspect-ratio: var(--pfd-slide-ratio, 4 / 3); background: #111; }
.pfd-carousel__slide img { width: 100%; height: 100%; object-fit: cover; }
.pfd-carousel__slide a.pfd-carousel__link { position: absolute; inset: 0; }
.pfd-carousel__cap { position: absolute; left: 0; right: 0; top: 0; padding: 22px 20px 40px; color: #fff; background: linear-gradient(to bottom, rgba(0,0,0,.6), rgba(0,0,0,0)); pointer-events: none; }
.pfd-carousel__cap .pfd-carousel__client { font: 500 14px/1.3 var(--pfd-font-ui); }
.pfd-carousel__cap .pfd-carousel__title { font: 500 14px/1.3 var(--pfd-font-ui); opacity: .8; }
.pfd-carousel__cap .pfd-pill { margin-top: 10px; pointer-events: auto; }
.pfd-carousel__dots { position: absolute; left: 20px; right: 20px; top: 8px; display: flex; gap: 6px; z-index: 2; }
.pfd-carousel__dots button { flex: 1; height: 14px; display: flex; align-items: center; }
.pfd-carousel__dots button::before { content: ""; width: 100%; height: 3px; border-radius: 2px; background: rgba(255,255,255,.4); transition: background 200ms; }
.pfd-carousel__dots button.is-on::before { background: #fff; }
.pfd .pfd-carousel__arrow { position: absolute; bottom: 14px; width: 30px; height: 30px; border-radius: 50%; background: #fff; color: #000; display: grid; place-items: center; z-index: 2; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform 160ms var(--pfd-ease); }
.pfd-carousel__arrow:hover { transform: scale(1.06); }
.pfd-carousel__arrow--prev { left: 14px; }
.pfd-carousel__arrow--next { right: 14px; }
.pfd-carousel__arrow svg { width: 12px; height: 12px; }

/* ---------- Content: posts list ---------- */
.pfd-posts { padding: 6px 0 0; }
.pfd-posts__item a { display: grid; grid-template-columns: 1fr 48px; gap: 14px; align-items: center; padding: 12px 18px; }
.pfd-posts__item a:hover { background: color-mix(in srgb, var(--pfd-fg) 4%, transparent); }
.pfd-posts__item + .pfd-posts__item a { border-top: 1px solid var(--pfd-line); }
.pfd-posts__title { font: 500 13.5px/1.3 var(--pfd-font-ui); margin-top: 3px; }
.pfd-posts__thumb { width: 48px; height: 48px; border-radius: 6px; object-fit: cover; background: var(--pfd-line); }
.pfd-posts__all { display: block; margin: 8px 14px 14px; text-align: center; height: 36px; line-height: 36px; border-radius: 999px; background: color-mix(in srgb, var(--pfd-fg) 6%, transparent); font: 500 12px/36px var(--pfd-font-ui); color: var(--pfd-muted); }
.pfd-posts__all:hover { color: var(--pfd-fg); }

/* ---------- Content: gallery ---------- */
.pfd-gallery { display: grid; grid-template-columns: repeat(var(--pfd-gal-cols, 3), 1fr); gap: var(--pfd-gal-gap, 4px); padding: var(--pfd-gal-gap, 4px); }
.pfd-gallery button { position: relative; aspect-ratio: 1; overflow: hidden; border-radius: 6px; background: var(--pfd-line); }
.pfd-gallery button img { width: 100%; height: 100%; object-fit: cover; transition: transform 300ms var(--pfd-ease); }
.pfd-gallery button:hover img { transform: scale(1.04); }
.pfd-gallery button::after { content: ""; position: absolute; right: 6px; top: 6px; width: 18px; height: 18px; border-radius: 4px; background: rgba(255,255,255,.9) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M9 4H4v5M15 4h5v5M4 15v5h5M20 15v5h-5'/%3E%3C/svg%3E") center/10px no-repeat; opacity: 0; transition: opacity 160ms; }
.pfd-gallery button:hover::after { opacity: 1; }
.pfd-gallery--masonry { display: block; columns: var(--pfd-gal-cols, 3); column-gap: var(--pfd-gal-gap, 4px); }
.pfd-gallery--masonry button { display: block; width: 100%; aspect-ratio: auto; margin-bottom: var(--pfd-gal-gap, 4px); break-inside: avoid; }

/* ---------- Content: embed / video ---------- */
.pfd-embed { position: relative; }
.pfd-embed iframe { width: 100%; height: var(--pfd-embed-h, 352px); }
.pfd-embed--ratio iframe { height: auto; aspect-ratio: var(--pfd-embed-ratio, 16 / 9); }
.pfd-video video { width: 100%; height: auto; }

/* ---------- Content: audio ---------- */
.pfd-audio { display: grid; grid-template-columns: 84px 1fr; gap: 16px; align-items: center; padding: 16px 18px 16px 16px; }
.pfd-audio__disc { width: 84px; height: 84px; border-radius: 50%; position: relative; overflow: hidden; background: #111; box-shadow: 0 0 0 1px var(--pfd-line), 0 6px 14px -6px rgba(0,0,0,.4); }
.pfd-audio__disc img { width: 100%; height: 100%; object-fit: cover; }
.pfd-audio__disc::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: repeating-radial-gradient(circle at center, rgba(255,255,255,.06) 0 1px, transparent 1px 3px); pointer-events: none; }
.pfd-audio__disc::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 14px; border-radius: 50%; background: var(--pfd-bg); translate: -50% -50%; box-shadow: 0 0 0 3px rgba(0,0,0,.6); }
.pfd-audio.is-playing .pfd-audio__disc { animation: pfd-spin 4s linear infinite; }
@keyframes pfd-spin { to { transform: rotate(360deg); } }
.pfd-audio__title { font: 600 14px/1.25 var(--pfd-font-heading); }
.pfd-audio__artist { font-size: 12px; color: var(--pfd-muted); margin-top: 2px; }
.pfd-audio__ctl { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.pfd-audio__ctl button { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; }
.pfd-audio__ctl button svg { width: 12px; height: 12px; }
.pfd .pfd-audio__play { background: var(--pfd-fg); color: var(--pfd-bg); width: 30px !important; height: 30px !important; }
.pfd-audio__time { font: 500 11px/1 var(--pfd-font-ui); color: var(--pfd-muted); font-variant-numeric: tabular-nums; min-width: 34px; }
.pfd-audio__bar { flex: 1; height: 14px; display: flex; align-items: center; cursor: pointer; }
.pfd-audio__bar::before { content: ""; width: 100%; height: 3px; border-radius: 2px; background: linear-gradient(to right, var(--pfd-fg) var(--pfd-prog, 0%), var(--pfd-line) 0); }

/* ---------- Content: hotspots ---------- */
.pfd-hotspots { position: relative; }
.pfd-hotspots img { width: 100%; }
.pfd-hotspot { position: absolute; translate: -50% -50%; }
.pfd-hotspot a, .pfd-hotspot span { display: inline-block; padding: 5px 9px; border-radius: 6px; background: rgba(255,255,255,.92); color: #000; font: 500 11px/1 var(--pfd-font-ui); box-shadow: 0 1px 3px rgba(0,0,0,.25); white-space: nowrap; transition: transform 160ms var(--pfd-ease); }
.pfd-hotspot a:hover { transform: scale(1.06); }
.pfd-hotspot--dot a::before, .pfd-hotspot--dot span::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--pfd-accent); margin-right: 6px; vertical-align: 1px; }
.pfd-hotspots__footer { padding: 16px 18px; font-family: var(--pfd-font-heading); font-size: 15px; line-height: 1.2; }

/* ---------- Content: folder (icons grid) ---------- */
.pfd-folder { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 6px; padding: 14px; }
.pfd .pfd-folder__item { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px 8px; border-radius: 8px; text-align: center; }
.pfd .pfd-folder__item:hover, .pfd .pfd-folder__item:focus-visible { background: color-mix(in srgb, var(--pfd-fg) 6%, transparent); }
.pfd-folder__icon { width: 56px; height: 56px; display: grid; place-items: center; }
.pfd-folder__icon img { width: 56px; height: 56px; object-fit: contain; }
.pfd-folder__thumb { width: 56px; height: 56px; border-radius: 6px; object-fit: cover; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.pfd-folder__label { font: 500 11.5px/1.25 var(--pfd-font-ui); max-width: 100%; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.pfd-folder--list { display: block; padding: 6px 0; }
.pfd .pfd-folder--list .pfd-folder__item { flex-direction: row; justify-content: flex-start; gap: 12px; padding: 8px 16px; border-radius: 0; text-align: left; }
.pfd-folder--list .pfd-folder__icon, .pfd-folder--list .pfd-folder__icon img, .pfd-folder--list .pfd-folder__thumb { width: 32px; height: 32px; }

/* CSS-drawn icons: folder, doc, image, video, link, note */
.pfd-ico { width: 56px; height: 44px; position: relative; }
.pfd-ico--folder { background: linear-gradient(180deg, color-mix(in srgb, var(--pfd-ico-color, #5aa0ff) 80%, #fff), var(--pfd-ico-color, #5aa0ff)); border-radius: 5px 5px 6px 6px; box-shadow: inset 0 -1px 0 rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.5), 0 2px 3px rgba(0,0,0,.18); }
.pfd-ico--folder::before { content: ""; position: absolute; left: 0; top: -6px; width: 42%; height: 10px; background: var(--pfd-ico-color, #5aa0ff); border-radius: 4px 6px 0 0; filter: brightness(.92); }
.pfd-ico--folder::after { content: ""; position: absolute; inset: 7px 0 0 0; background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0) 60%); border-radius: 4px 4px 6px 6px; }
.pfd-ico--doc { width: 40px; height: 50px; margin: 0 auto; background: #fff; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0,0,0,.12), 0 2px 4px rgba(0,0,0,.18); background-image: repeating-linear-gradient(180deg, transparent 0 14px, rgba(0,0,0,.1) 14px 15px); background-size: 60% 100%; background-position: 50% 14px; background-repeat: no-repeat; }
.pfd-ico--doc::before { content: ""; position: absolute; right: 0; top: 0; width: 12px; height: 12px; background: linear-gradient(225deg, var(--pfd-bg) 50%, rgba(0,0,0,.15) 50%); border-radius: 0 3px 0 2px; }
.pfd-ico--link { width: 44px; height: 44px; margin: 0 auto; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff, #cfd6e6 70%); box-shadow: 0 0 0 1px rgba(0,0,0,.12), 0 2px 4px rgba(0,0,0,.18); }
.pfd-ico--link::before { content: "↗"; position: absolute; inset: 0; display: grid; place-items: center; font: 600 18px/1 var(--pfd-font-ui); color: #000; }
.pfd-ico--note { width: 44px; height: 44px; margin: 0 auto; background: #fff6a8; box-shadow: 0 2px 4px rgba(0,0,0,.2); transform: rotate(-3deg); }
.pfd-ico--video { width: 52px; height: 36px; margin: 4px auto; background: #111; border-radius: 6px; box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 2px 4px rgba(0,0,0,.2); }
.pfd-ico--video::before { content: ""; position: absolute; left: 50%; top: 50%; translate: -40% -50%; border-left: 12px solid #fff; border-top: 8px solid transparent; border-bottom: 8px solid transparent; }

/* ---------- Content: html ---------- */
.pfd-html { padding: 16px 18px; font-size: 14px; line-height: 1.5; }

/* ---------- Dock (menu) ---------- */
/* The Elementor wrapper of a floating dock takes no room in the surface's flow. */
body:not(.elementor-editor-active) .elementor-widget.pfd-dock-wrap--fixed { position: absolute; left: 0; top: 0; width: 0; height: 0; margin: 0 !important; overflow: visible; }
.pfd-dock {
  --pfd-dock-icon: 26px; --pfd-dock-gap: 10px; --pfd-dock-offset: 20px; --pfd-dock-pad: 10px;
  --pfd-dock-bg: #fff; --pfd-dock-fg: var(--pfd-fg); --pfd-dock-fg-hover: var(--pfd-dock-fg); --pfd-dock-label: var(--pfd-dock-fg);
  --pfd-dock-radius: var(--pfd-radius); --pfd-dock-shadow: var(--pfd-shadow-soft), 0 0 0 1px var(--pfd-line);
  --pfd-dock-stroke: 1.5;
  --pfd-dock-item: calc(var(--pfd-dock-icon) + 22px);
  --pfd-dock-lift: calc((var(--pfd-dock-item) - var(--pfd-dock-icon)) / 2);
  display: inline-flex; padding: var(--pfd-dock-pad);
  background: var(--pfd-dock-bg); color: var(--pfd-dock-fg);
  border-radius: var(--pfd-dock-radius); box-shadow: var(--pfd-dock-shadow);
  font-family: var(--pfd-font-ui); z-index: 900;
}
.pfd-dock--pill { --pfd-dock-radius: 999px; --pfd-dock-pad: 8px; --pfd-dock-icon: 22px; }
.pfd-dock--fixed { position: fixed; left: 50%; bottom: var(--pfd-dock-offset); transform: translateX(-50%); }
.pfd-dock--inline { position: relative; }
.pfd-global-dock .pfd-dock { position: fixed; left: 50%; bottom: var(--pfd-dock-offset); transform: translateX(-50%); }
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
  .pfd-dock--blur { -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px); }
}
.pfd-dock ul { display: flex; align-items: flex-end; gap: var(--pfd-dock-gap); }
.pfd-dock li { position: relative; }
.pfd-dock__item {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: var(--pfd-dock-item); height: var(--pfd-dock-item); border-radius: 12px;
  color: var(--pfd-dock-fg); transform-origin: 50% 100%;
  transition: transform var(--pfd-dur) var(--pfd-ease), color 140ms, background 140ms;
}
.pfd .pfd-dock__item, .pfd-dock a.pfd-dock__item { color: var(--pfd-dock-fg); }
.pfd .pfd-dock__item:hover, .pfd-dock a.pfd-dock__item:hover { color: var(--pfd-dock-fg-hover); }
.pfd-dock--pill .pfd-dock__item { border-radius: 999px; }
.pfd-dock--pill .pfd-dock__item:hover { background: rgba(0, 0, 0, .05); }
.pfd-dock__glyph { display: grid; place-items: center; width: var(--pfd-dock-icon); height: var(--pfd-dock-icon); flex: none; }
.pfd-dock__glyph i, .pfd-dock__glyph svg { width: var(--pfd-dock-icon); height: var(--pfd-dock-icon); font-size: var(--pfd-dock-icon); line-height: 1; display: block; fill: currentColor; }
.pfd-dock__glyph svg.pfd-line-icon { fill: none; stroke-width: var(--pfd-dock-stroke); }
.pfd-dock__img { width: calc(var(--pfd-dock-icon) * 1.3); height: calc(var(--pfd-dock-icon) * 1.3); max-width: none; object-fit: contain; }
.pfd-dock__dot-icon { width: .6em; height: .6em; border-radius: 50%; background: currentColor; font-size: var(--pfd-dock-icon); }
.pfd-dock__label { font: 500 10px/12px var(--pfd-font-ui); white-space: nowrap; letter-spacing: .01em; color: var(--pfd-dock-label); }
/* Names, "lift": the icon hops up and its name fades in underneath, inside the bar. */
.pfd-dock--labels-lift .pfd-dock__glyph { transition: transform var(--pfd-dur) var(--pfd-ease); }
.pfd-dock--labels-lift .pfd-dock__label {
  position: absolute; left: 50%; top: calc(var(--pfd-dock-icon) + 3px); transform: translate(-50%, var(--pfd-dock-lift));
  opacity: 0; pointer-events: none; transition: transform var(--pfd-dur) var(--pfd-ease), opacity var(--pfd-dur) var(--pfd-ease);
}
@media (hover: hover) and (pointer: fine) {
  .pfd-dock--labels-lift .pfd-dock__item:hover .pfd-dock__glyph { transform: translateY(calc(var(--pfd-dock-lift) * -1)); }
  .pfd-dock--labels-lift .pfd-dock__item:hover .pfd-dock__label { transform: translate(-50%, 0); opacity: 1; }
}
.pfd-dock--labels-lift .pfd-dock__item:focus-visible .pfd-dock__glyph { transform: translateY(calc(var(--pfd-dock-lift) * -1)); }
.pfd-dock--labels-lift .pfd-dock__item:focus-visible .pfd-dock__label { transform: translate(-50%, 0); opacity: 1; }
/* Names, "hover": a tooltip above the item. */
.pfd-dock--labels-hover .pfd-dock__label {
  position: absolute; left: 50%; bottom: calc(100% + 12px); transform: translate(-50%, 4px);
  padding: 6px 10px; border-radius: 999px; background: var(--pfd-fg); color: var(--pfd-bg); font-size: 11px;
  opacity: 0; pointer-events: none; transition: opacity 140ms var(--pfd-ease), transform 140ms var(--pfd-ease);
}
.pfd-dock--labels-hover .pfd-dock__item:hover .pfd-dock__label,
.pfd-dock--labels-hover .pfd-dock__item:focus-visible .pfd-dock__label { opacity: 1; transform: translate(-50%, 0); }
/* Names, "always": under the icon. */
.pfd-dock--labels-always .pfd-dock__item { width: auto; height: auto; min-width: var(--pfd-dock-item); padding: 4px 4px 2px; gap: 5px; }
.pfd-dock--labels-never .pfd-dock__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* Current page: a small dot under the item. */
.pfd-dock li.is-active::after { content: ""; position: absolute; left: 50%; bottom: -7px; width: 4px; height: 4px; border-radius: 50%; background: var(--pfd-dock-fg); transform: translateX(-50%); opacity: .75; }
/* Magnify: only for pointers that can hover. */
@media (hover: hover) and (pointer: fine) and (min-width: 768px) {
  .pfd-dock--magnify .pfd-dock__item:hover { transform: translateY(-6px) scale(1.15); background: transparent; }
  .pfd-dock--magnify li:hover + li > .pfd-dock__item,
  .pfd-dock--magnify li:has(+ li:hover) > .pfd-dock__item { transform: translateY(-2px) scale(1.05); }
}
.pfd-dock__item:focus-visible { outline: 2px solid var(--pfd-accent); outline-offset: 2px; }
/* Editor canvas: never fixed, so Elementor's handles wrap the real thing. On a desk a floating dock
   is pinned to the bottom of the section, where visitors will see it; anywhere else it sits where it was dropped. */
.pfd-dock--editor { position: relative; left: auto; bottom: auto; transform: none; margin: 8px auto; }
.elementor-editor-active .pfd-dock-wrap--fixed .elementor-widget-container { display: flex; justify-content: center; }
.elementor-editor-active .pfd-surface > .elementor-widget.pfd-dock-wrap--fixed { position: absolute; left: 50%; top: auto; bottom: 12px; transform: translateX(-50%); width: auto !important; max-width: none; margin: 0 !important; z-index: 900; }
@media (max-width: 767.98px) {
  /* Phones: always floating at the bottom, as wide as it needs up to the screen, names under the icons. */
  .pfd-dock, .pfd-dock--inline, .pfd-global-dock .pfd-dock {
    position: fixed; left: 50%; right: auto; bottom: max(16px, env(safe-area-inset-bottom)); transform: translateX(-50%);
    display: flex; width: max-content; max-width: calc(100vw - 32px);
  }
  .pfd-dock ul { width: 100%; justify-content: space-between; align-items: stretch; gap: min(var(--pfd-dock-gap), 2.5vw); }
  .pfd-dock li { flex: 1 1 auto; min-width: 0; display: flex; justify-content: center; }
  .pfd-dock li.is-active::after { bottom: -6px; }
  .pfd-dock__item, .pfd-dock__glyph { transform: none !important; }
  .pfd-dock__label { display: none; }
  .pfd-dock--mlabels .pfd-dock__item { width: auto; height: auto; min-width: var(--pfd-dock-item); max-width: 100%; padding: 5px 2px 3px; gap: 5px; }
  .pfd-dock--mlabels .pfd-dock__label {
    display: block; position: static; opacity: 1; transform: none; padding: 0; background: none; color: var(--pfd-dock-label);
    font-size: 10px; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
  }
  .elementor-editor-active .pfd-dock--editor { position: relative; left: auto; right: auto; bottom: auto; transform: none; }
}
@media (max-width: 339.98px) { .pfd-dock--mlabels .pfd-dock__label { display: none; } }

/* ---------- Phones: tiles and the full-screen sheet ---------- */
.pfd-tile { display: none; }
.pfd-sheet__bar { display: none; }
@media (max-width: 767.98px) {
  .pfd-slot.pfd-mobile-tile .pfd-tile { display: block; }
  .pfd-slot.pfd-mobile-tile:not(.is-sheet) .pfd-win { display: none; }
  .pfd-tile__btn { display: flex !important; flex-direction: column; align-items: center; gap: 8px; width: 100% !important; text-align: center; -webkit-tap-highlight-color: transparent; }
  .pfd-tile__img {
    position: relative; display: block; width: 100%; aspect-ratio: 1; border-radius: var(--pfd-radius); overflow: hidden;
    background: var(--pfd-tile-bg, var(--pfd-bg)); box-shadow: var(--pfd-shadow-soft), 0 0 0 1px var(--pfd-line);
    transition: transform var(--pfd-dur) var(--pfd-ease);
  }
  .pfd-tile__btn:active .pfd-tile__img { transform: scale(.97); }
  .pfd-tile__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .pfd-tile__title { position: absolute; inset: 0; display: grid; place-items: center; padding: 14px; font: 600 17px/1.15 var(--pfd-font-heading); color: var(--pfd-fg); }
  .pfd-tile__img img + .pfd-tile__title { display: none; }
  .pfd-tile--play .pfd-tile__img::after {
    content: ""; position: absolute; left: 50%; top: 50%; width: 34%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%;
    background: rgba(255, 255, 255, .86) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.5 7.5v9l7.5-4.5z' fill='%23111'/%3E%3C/svg%3E") center/70% no-repeat;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .18);
  }
  .pfd-tile--play .pfd-tile__title { display: none; }
  .pfd-tile__label { display: block; max-width: 100%; padding: 6px 12px; border-radius: 999px; background: var(--pfd-bg); color: var(--pfd-fg); font: 500 12px/16px var(--pfd-font-ui); box-shadow: var(--pfd-shadow-soft); }
  .pfd-tile__label span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .pfd-tile__btn:focus-visible { outline: none; }
  .pfd-tile__btn:focus-visible .pfd-tile__img { outline: 2px solid var(--pfd-accent); outline-offset: 2px; }

  /* The sheet: the slot itself goes full screen, so the window keeps every style set on it. */
  html.pfd-sheet-open, html.pfd-sheet-open body { overflow: hidden !important; }
  /* Ancestors must not trap a fixed child or sit under a neighbour while the sheet is open. */
  .pfd-sheet-anc { transform: none !important; filter: none !important; perspective: none !important; contain: none !important; will-change: auto !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; opacity: 1 !important; z-index: 2147483000 !important; }
  .pfd-surface > .pfd-slot.is-sheet {
    position: fixed !important; inset: 0; z-index: 2147483000 !important; width: 100% !important; height: 100vh; height: 100dvh;
    display: flex !important; flex-direction: column; background: var(--pfd-sheet-bg, #000); color: var(--pfd-sheet-fg, #fff);
    overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    animation: pfd-sheet-in var(--pfd-dur) var(--pfd-ease) both;
  }
  .pfd-slot.is-sheet .pfd-tile { display: none; }
  .pfd-slot.is-sheet .pfd-sheet__bar {
    position: sticky; top: 0; z-index: 3; flex: none; display: flex; align-items: center; justify-content: center;
    height: 48px; padding: 0 52px; background: var(--pfd-sheet-bg, #000); color: var(--pfd-sheet-fg, #fff);
    border-bottom: 1px solid var(--pfd-sheet-fg, #fff); font: 500 14px/1 var(--pfd-font-ui);
  }
  .pfd-sheet__title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .pfd-sheet__bar .pfd-sheet__close { position: absolute; right: 4px; top: 4px; width: 40px; height: 40px; display: grid; place-items: center; color: inherit; }
  .pfd-sheet__close svg { width: 14px; height: 14px; }
  .pfd-slot.is-sheet .pfd-sheet__content { margin: auto 0; padding: 24px 20px calc(24px + env(safe-area-inset-bottom)); width: 100%; }
  .pfd-slot.is-sheet .pfd-win.pfd-sheet__content { margin: auto 20px; padding: 0; width: auto; }
  .pfd-slot.is-sheet .pfd-win { display: flex; animation: pfd-win-in var(--pfd-dur) var(--pfd-ease) both; }
  .pfd-slot.is-sheet .pfd-win__bar, .pfd-slot.is-sheet .pfd-win__x { display: none; }
  .pfd-slot.is-sheet .pfd-win__body.is-scroll { max-height: none; overflow: visible; }
}
@keyframes pfd-sheet-in { from { opacity: 0; } to { opacity: 1; } }

/* ---------- Wordmark ---------- */
/* The Elementor wrapper pins to an edge of the surface, behind every slot (z 0). Not a slot: never dragged or laid out. */
.pfd-wordmark { --pfd-wm-size: 24vw; --pfd-wm-offset: -0.12em; display: flex; font-size: var(--pfd-wm-size); font-family: var(--pfd-font-heading); font-weight: 700; letter-spacing: -.04em; line-height: .8; color: var(--pfd-fg); white-space: nowrap; pointer-events: none; user-select: none; -webkit-user-select: none; }
.pfd-wordmark > span { display: block; }
.pfd-wordmark[data-pfd-fit] { white-space: nowrap !important; }
.pfd-wordmark--bottom, .pfd-wordmark--top { flex-direction: row; }
.pfd-wordmark--left, .pfd-wordmark--right { flex-direction: column; }
.pfd-wordmark--bottom { padding-top: .3em; }
.pfd-wordmark--top { padding-bottom: .3em; }
.pfd-wordmark--left { padding-right: .3em; }
.pfd-wordmark--right { padding-left: .3em; }
.pfd-wordmark--bottom > span { transform: translateY(calc(var(--pfd-wm-offset) * -1)); }
.pfd-wordmark--top > span { transform: translateY(var(--pfd-wm-offset)); }
.pfd-wordmark--left > span { writing-mode: vertical-rl; transform: rotate(180deg) translateY(calc(var(--pfd-wm-offset) * -1)); }
.pfd-wordmark--right > span { writing-mode: vertical-rl; transform: translateX(calc(var(--pfd-wm-offset) * -1)); }
.pfd-wm-align-start .pfd-wordmark { justify-content: flex-start; }
.pfd-wm-align-center .pfd-wordmark { justify-content: center; }
.pfd-wm-align-end .pfd-wordmark { justify-content: flex-end; }
.pfd-wm-clip-yes { overflow: hidden; }
@media (min-width: 768px) {
  .pfd-surface > .pfd-wordmark-slot, .e-con > .pfd-wordmark-slot, .e-con-inner > .pfd-wordmark-slot {
    position: absolute; z-index: 0; margin: 0 !important; pointer-events: none; width: auto !important; max-width: none;
  }
  .pfd-wm-edge-bottom.pfd-wordmark-slot { left: 0; right: 0; bottom: 0; top: auto; }
  .pfd-wm-edge-top.pfd-wordmark-slot { left: 0; right: 0; top: 0; bottom: auto; }
  .pfd-wm-edge-left.pfd-wordmark-slot { top: 0; bottom: 0; left: 0; right: auto; }
  .pfd-wm-edge-right.pfd-wordmark-slot { top: 0; bottom: 0; right: 0; left: auto; }
  .pfd-wm-edge-left .pfd-wordmark, .pfd-wm-edge-right .pfd-wordmark { height: 100%; }
}
@media (max-width: 767.98px) {
  .pfd-surface > .pfd-wordmark-slot, .e-con > .pfd-wordmark-slot, .e-con-inner > .pfd-wordmark-slot { position: static; order: 999; width: 100% !important; margin: 0 !important; }
  .pfd-wm-mobile-hide.pfd-wordmark-slot { display: none !important; }
  .pfd-wordmark { padding: 0; white-space: normal; }
  .pfd-wordmark > span { writing-mode: horizontal-tb; transform: none; }
  .pfd-wordmark--left, .pfd-wordmark--right { flex-direction: row; }
  /* "At the top": one line, bleeding off the right edge, with the first card tucked over its feet. */
  .pfd-surface > .pfd-wm-mobile-top.pfd-wordmark-slot { order: -999; overflow: visible; overflow-x: clip; }
  .pfd-wm-mobile-top .pfd-wordmark { white-space: nowrap; margin: -.08em 0 calc(-.3em - var(--pfd-surface-gap)); }
  /* A word fitted to the width is small enough to read whole: only its feet go under the first card. */
  .pfd-wm-mobile-top .pfd-wordmark[data-pfd-fit] { margin: .06em 0 calc(-.1em - var(--pfd-surface-gap)); }
}

/* ---------- Desk Icon ---------- */
.pfd-slot.pfd-slot--icon { --pfd-win-w: auto; }
@media (min-width: 768px) {
  /* Icons live under the windows (never raised by a click), except while being dragged. */
  .pfd-surface > .pfd-slot.pfd-slot--icon { z-index: var(--pfd-z, 1) !important; }
  .pfd-surface > .pfd-slot.pfd-slot--icon.is-dragging { z-index: 2000 !important; }
}
.pfd-icon {
  --pfd-icon-size: 72px;
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px;
  width: calc(var(--pfd-icon-size) + 36px); min-width: 92px; padding: 8px 6px 6px; border-radius: 10px;
  font-family: var(--pfd-font-ui); color: var(--pfd-fg);
  cursor: default; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; touch-action: none;
}
.pfd-icon:focus-visible { outline: 2px solid var(--pfd-accent); outline-offset: 2px; border-radius: 10px; }
.pfd-icon__glyph {
  position: relative; display: grid; place-items: center;
  font-size: var(--pfd-icon-size); width: 1em; height: 1em;
  filter: drop-shadow(0 .05em .07em rgba(0, 0, 0, .22));
  transition: transform var(--pfd-dur) var(--pfd-ease), filter var(--pfd-dur) var(--pfd-ease);
}
.pfd-icon:hover .pfd-icon__glyph { transform: translateY(-2px); filter: drop-shadow(0 .09em .12em rgba(0, 0, 0, .26)) brightness(1.04); }
.pfd-slot.is-dragging .pfd-icon__glyph { transform: scale(1.04); filter: drop-shadow(0 .14em .18em rgba(0, 0, 0, .3)); transition: none; }
.pfd-icon__img { width: 1em; height: 1em; object-fit: contain; }
.pfd-icon__label {
  max-width: 100%; padding: 3px 8px; border-radius: 6px;
  background: rgba(255, 255, 255, .6); color: var(--pfd-fg);
  font: 500 12px/1.25 var(--pfd-font-ui); text-align: center;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  transition: background 120ms, color 120ms;
}
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) { .pfd-icon__label { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } }
.pfd-icon.is-selected .pfd-icon__label { background: var(--pfd-accent); color: #fff; }
.pfd-icon.is-selected .pfd-icon__glyph { filter: brightness(.86) drop-shadow(0 .05em .07em rgba(0, 0, 0, .22)); }
.pfd-icon.is-selected .pfd-icon__glyph::after { content: ""; position: absolute; inset: -.06em; border-radius: .12em; background: rgba(0, 0, 0, .08); }
@media (max-width: 767.98px) {
  /* One grid cell: the glyph over a pill label, like the tiles beside it. */
  .pfd-icon { width: 100%; min-width: 0; padding: 14px 0 0; touch-action: auto; }
  .pfd-icon__glyph { font-size: min(var(--pfd-icon-size), 24vw); }
  .pfd-icon__label { padding: 6px 12px; border-radius: 999px; background: var(--pfd-bg); font: 500 12px/16px var(--pfd-font-ui); box-shadow: var(--pfd-shadow-soft); -webkit-backdrop-filter: none; backdrop-filter: none; display: block; white-space: nowrap; text-overflow: ellipsis; }
  .pfd-icon.is-selected .pfd-icon__label { background: var(--pfd-bg); color: var(--pfd-fg); }
}

/* Large CSS-drawn icons (em units scale with --pfd-icon-size): crisp, modern, soft contact shadow via the glyph. */
.pfd-icon__glyph .pfd-ico { position: relative; width: 1em; height: .78em; margin: 0; transform: none; background: none; box-shadow: none; border-radius: 0; }
.pfd-icon__glyph .pfd-ico::before, .pfd-icon__glyph .pfd-ico::after { filter: none; }
/* folder */
.pfd-icon__glyph .pfd-ico--folder { --c: var(--pfd-ico-color, #5aa0ff); height: .74em; margin-top: .1em; background: linear-gradient(180deg, color-mix(in srgb, var(--c) 78%, #000), color-mix(in srgb, var(--c) 90%, #000)); border-radius: .07em .07em .1em .1em; }
.pfd-icon__glyph .pfd-ico--folder::before { content: ""; position: absolute; left: 0; top: -.09em; width: .42em; height: .14em; background: color-mix(in srgb, var(--c) 80%, #000); border-radius: .06em .1em 0 0; }
.pfd-icon__glyph .pfd-ico--folder::after { content: ""; position: absolute; inset: .13em 0 0 0; background: linear-gradient(180deg, color-mix(in srgb, var(--c) 70%, #fff) 0%, var(--c) 48%, color-mix(in srgb, var(--c) 86%, #000) 100%); border-radius: .06em .06em .1em .1em; box-shadow: inset 0 .012em 0 rgba(255, 255, 255, .6), inset 0 -.012em 0 rgba(0, 0, 0, .14); }
@supports not (color: color-mix(in srgb, red, blue)) {
  .pfd-icon__glyph .pfd-ico--folder { background: var(--c); filter: brightness(.85); }
  .pfd-icon__glyph .pfd-ico--folder::before { background: var(--c); }
  .pfd-icon__glyph .pfd-ico--folder::after { background: linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, 0) 55%), var(--c); }
}
/* document */
.pfd-icon__glyph .pfd-ico--doc { width: .72em; height: .92em; border-radius: .05em; box-shadow: inset 0 0 0 .012em rgba(0, 0, 0, .1); background-image: repeating-linear-gradient(180deg, transparent 0 .11em, rgba(0, 0, 0, .12) .11em .13em), linear-gradient(180deg, #fff, #f3f4f6); background-size: 56% 50%, 100% 100%; background-position: 50% .36em, 0 0; background-repeat: no-repeat; }
.pfd-icon__glyph .pfd-ico--doc::before { content: ""; position: absolute; right: 0; top: 0; width: .22em; height: .22em; background: linear-gradient(225deg, transparent 50%, #d8dbe0 50%, #c3c7cf); border-radius: 0 .05em 0 .04em; }
.pfd-icon__glyph .pfd-ico--doc::after { content: ""; position: absolute; left: 22%; top: .14em; width: 36%; height: .07em; border-radius: .03em; background: var(--pfd-ico-color, #5aa0ff); }
/* photo */
.pfd-icon__glyph .pfd-ico--image { width: .92em; height: .76em; margin-top: .06em; background: #fff; border-radius: .06em; box-shadow: inset 0 0 0 .012em rgba(0, 0, 0, .1); }
.pfd-icon__glyph .pfd-ico--image::before { content: ""; position: absolute; inset: .06em; border-radius: .03em; background: linear-gradient(180deg, #8ec5ff 0%, #d9ecff 52%, #3f8f4f 52%, #2f6f3c 100%); }
.pfd-icon__glyph .pfd-ico--image::after { content: ""; position: absolute; left: .62em; top: .16em; width: .14em; height: .14em; border-radius: 50%; background: #ffe27a; box-shadow: 0 0 .06em rgba(255, 226, 122, .9); }
/* video */
.pfd-icon__glyph .pfd-ico--video { width: .96em; height: .64em; margin-top: .08em; background: linear-gradient(180deg, #2b2f36, #0f1115); border-radius: .1em; box-shadow: inset 0 .012em 0 rgba(255, 255, 255, .14); }
.pfd-icon__glyph .pfd-ico--video::before { content: ""; position: absolute; left: 50%; top: 50%; translate: -38% -50%; border-left: .22em solid #fff; border-top: .14em solid transparent; border-bottom: .14em solid transparent; }
.pfd-icon__glyph .pfd-ico--video::after { content: ""; position: absolute; left: .08em; right: .08em; bottom: .07em; height: .03em; border-radius: .02em; background: linear-gradient(90deg, #fff 38%, rgba(255, 255, 255, .25) 38%); }
/* link */
.pfd-icon__glyph .pfd-ico--link { width: .78em; height: .78em; border-radius: 50%; background: radial-gradient(circle at 36% 32%, #fff, #e3e7ef 62%, #c9cfdb); box-shadow: inset 0 0 0 .012em rgba(0, 0, 0, .1); }
.pfd-icon__glyph .pfd-ico--link::before { content: "↗"; position: absolute; inset: 0; display: grid; place-items: center; font: 600 .36em/1 var(--pfd-font-ui); color: #0b0b0c; }
/* sticky note */
.pfd-icon__glyph .pfd-ico--note { width: .78em; height: .78em; background: linear-gradient(180deg, #fff6a8, #ffe878); transform: rotate(-3deg); box-shadow: inset 0 -.012em 0 rgba(0, 0, 0, .08); }
.pfd-icon__glyph .pfd-ico--note::before { content: ""; position: absolute; left: .12em; right: .12em; top: .2em; height: .3em; background: repeating-linear-gradient(180deg, rgba(0, 0, 0, .18) 0 .025em, transparent .025em .1em); }
.pfd-icon__glyph .pfd-ico--note::after { content: ""; position: absolute; right: 0; bottom: 0; width: .16em; height: .16em; background: linear-gradient(315deg, transparent 50%, rgba(0, 0, 0, .12) 50%, #e9d460); }

/* ---------- Viewer: a framed page opened over this one ---------- */
html.pfd-viewer-open, html.pfd-viewer-open body { overflow: hidden !important; }
.pfd-viewer { position: fixed; inset: 0; z-index: 2147483200; }
.pfd-viewer[hidden] { display: none; }
.pfd-viewer__shade { position: absolute; inset: 0; background: rgba(0, 0, 0, .5); animation: pfd-sheet-in var(--pfd-dur) var(--pfd-ease) both; }
.pfd-viewer__frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: transparent; opacity: 1; transition: opacity 160ms var(--pfd-ease); }
.pfd-viewer.is-loading .pfd-viewer__frame { opacity: 0; pointer-events: none; }
/* The stand-in window matches the real frame (pfd-frame.css): 16px margin, 36px dark tab bar, 12px top corners. */
.pfd-viewer__ghost { position: absolute; inset: 16px 16px 0; display: none; flex-direction: column; border-radius: 12px 12px 0 0; background: var(--pfd-bg); box-shadow: var(--pfd-shadow-lift); overflow: hidden; animation: pfd-win-in var(--pfd-dur) var(--pfd-ease) both; }
.pfd-viewer.is-loading .pfd-viewer__ghost, .pfd-viewer.is-settling .pfd-viewer__ghost { display: flex; }
/* Going from one page to another inside the viewer: the window is already open, so it does not open again. */
.pfd-viewer.is-switching .pfd-viewer__ghost { animation: none; }
.pfd-viewer.is-switching .pfd-viewer__shade { animation: none; }
.pfd-viewer__tabs { flex: none; height: 36px; display: flex; align-items: center; gap: 4px; padding: 0 4px; background: #111; color: #fff; }
.pfd-viewer__tabs .pfd-viewer__close { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: rgba(255, 255, 255, .12); color: #fff; }
.pfd-viewer__tab { height: 28px; max-width: 60vw; padding: 0 12px; display: inline-flex; align-items: center; border-radius: 8px; background: #fff; color: #000; font: 500 13px/1 var(--pfd-font-ui); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pfd-viewer__tab[hidden] { display: none; }
.pfd-viewer__body { flex: 1 1 auto; display: grid; place-items: center; }
.pfd-viewer__spinner { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--pfd-line); border-top-color: var(--pfd-fg); animation: pfd-spin .8s linear infinite; }
/* The menu stays reachable above an open page, as it does on a framed page of its own. */
html.pfd-viewer-open .pfd-dock { z-index: 2147483400; }
@media (max-width: 767.98px) { .pfd-viewer__ghost { inset: 0; border-radius: 0; } }
@media (prefers-reduced-motion: reduce) { .pfd-viewer__spinner { animation-duration: 2.4s; } }
