/* Bounded, composited handoffs; no blur, particles, or animation loops. */
@view-transition { navigation:auto; }
/* One temporary, independently captured veil sits underneath both page snapshots. */
.histi-history-veil { position:fixed; inset:0; z-index:10000; pointer-events:none; view-transition-name:histi-intermediate; }
.histi-history-veil::before,.histi-history-veil::after { content:""; position:fixed; inset:0; pointer-events:none; }
html:is(.histi-native-back,.histi-native-forward)::view-transition-group(histi-intermediate) { animation:none; z-index:0; }
html:is(.histi-native-back,.histi-native-forward)::view-transition-new(histi-intermediate) { animation:none; mix-blend-mode:normal; }
html:is(.histi-native-back,.histi-native-forward)::view-transition-group(root) { animation:none; z-index:1; }
html:is(.histi-native-back,.histi-native-forward)::view-transition-image-pair(root) { isolation:auto; }
html:is(.histi-native-back,.histi-native-forward)::view-transition-old(root) { mix-blend-mode:normal; z-index:2; }
html.histi-native-back::view-transition-old(root) { animation:histi-browser-back 460ms cubic-bezier(.4,0,.2,1) both; }
html.histi-native-forward::view-transition-old(root) { animation:histi-browser-forward 460ms cubic-bezier(.4,0,.2,1) both; }
html:is(.histi-native-back,.histi-native-forward)::view-transition-new(root) { mix-blend-mode:normal; z-index:1; animation:histi-browser-reveal 380ms 520ms cubic-bezier(.22,1,.36,1) both; }
@keyframes histi-browser-back { from { transform:none; } to { transform:translateX(100%); } }
@keyframes histi-browser-forward { from { transform:none; } to { transform:translateX(-100%); } }
@keyframes histi-browser-reveal { from { opacity:0; } to { opacity:1; } }
html.histi-url-motion::after,html.histi-url-motion::before {
  content:""; position:fixed; inset:0; opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity 420ms cubic-bezier(.22,1,.36,1),transform 500ms cubic-bezier(.22,1,.36,1),visibility 0s 500ms;
}
html.histi-url-motion::after {
  z-index:10000; transform:translateY(-12px) scale(1.035);
}
html.histi-url-motion::after,.histi-history-veil::after {
  background:radial-gradient(ellipse at 8% 90%,#bce6fb 0,transparent 50%),radial-gradient(ellipse at 92% 8%,#ffd3e1 0,transparent 52%),#fff8ef;
}
/* Shared appearance: ordinary navigation, refresh and browser history are identical. */
html.histi-url-motion::before,.histi-history-veil::before {
  content:"A little space. Just for you."; z-index:10001; display:grid; place-content:center;
  padding:150px 24px 0; color:#52616a; font-family:var(--font-ui); font-size:14px; text-align:center;
  background:url('/histi-logo.webp?v=facelift-1') center calc(50% - 25px) / 118px auto no-repeat;
  filter:brightness(.18);
}
html.histi-url-motion::before {
  transform:translateY(14px);
}
html.histi-url-covered::after,html.histi-url-covered::before { opacity:1; visibility:visible; transform:none; transition-delay:0s; }
/* Do not capture the ordinary fade veil into the incoming history snapshot. */
html:is(.histi-native-back,.histi-native-forward)::before,html:is(.histi-native-back,.histi-native-forward)::after { opacity:0!important; visibility:hidden!important; animation:none!important; transition:none!important; }
html.histi-url-leaving::after { pointer-events:auto; }
/* Refresh is one continuous handoff: fade the old page out, hold, then softly reveal the new page. */
html.histi-refresh::before,html.histi-refresh::after {
  transform:none;
  transition:opacity 560ms cubic-bezier(.22,1,.36,1),visibility 0s 560ms;
}
html.histi-refresh-outgoing::before,html.histi-refresh-outgoing::after { transition:opacity 260ms ease,visibility 0s 260ms; }
html.histi-refresh-prime::before,html.histi-refresh-prime::after { transition:none; }
html.histi-url-card.histi-url-covered::after { animation:histi-card-veil 680ms ease both; }
html.histi-url-card.histi-url-covered::before { animation:histi-card-brand 680ms ease both; }
.histi-card-morph {
  position:fixed; inset:0; z-index:9999; pointer-events:none; overflow:hidden; contain:layout paint;
}
.histi-card-morph::before { content:""; position:absolute; inset:0; background:#25343d1a; animation:histi-card-dim 680ms ease both; }
.histi-card-surface {
  position:absolute; inset:0; overflow:hidden; transform-origin:0 0; background:#fff8ef;
  animation:histi-card-open 680ms cubic-bezier(.22,.85,.25,1) both;
}
.histi-card-surface::after {
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse at 8% 90%,#bce6fb 0,transparent 50%),radial-gradient(ellipse at 92% 8%,#ffd3e1 0,transparent 52%),#fff8ef;
  animation:histi-card-tint 680ms ease both;
}
.histi-card-face {
  position:absolute!important; margin:0!important; max-width:none!important; min-height:0!important;
  overflow:hidden!important; pointer-events:none!important; transform-origin:center!important;
  transition:none!important; box-shadow:none!important; animation:histi-card-face 680ms ease both!important;
}
@keyframes histi-card-open {
  0% { transform:translate(var(--card-x),var(--card-y)) scale(var(--card-sx),var(--card-sy)); border-radius:var(--card-radius-x) / var(--card-radius-y); }
  9% { transform:translate(var(--card-press-x),var(--card-press-y)) scale(var(--card-press-sx),var(--card-press-sy)); border-radius:var(--card-radius-x) / var(--card-radius-y); }
  78% { transform:translate(-3px,-2px) scale(1.005); border-radius:5px; }
  100% { transform:none; border-radius:0; }
}
@keyframes histi-card-face { 0% { opacity:1; transform:none; } 9% { opacity:1; transform:scale(.97); } 28% { opacity:1; transform:translateY(-2px); } 53%,100% { opacity:0; transform:translateY(-14px); } }
@keyframes histi-card-dim { 0% { opacity:0; } 25%,65% { opacity:1; } 100% { opacity:0; } }
@keyframes histi-card-tint { 0%,25% { opacity:0; } 70%,100% { opacity:1; } }
@keyframes histi-card-veil { 0%,75% { opacity:0; } 100% { opacity:1; } }
@keyframes histi-card-brand { 0%,40% { opacity:0; transform:translateY(10px) scale(.94); } 78% { opacity:1; transform:translateY(-2px) scale(1.015); } 100% { opacity:1; transform:none; } }

/* Full-screen fades for assessment handoffs and confirmed resets. */
html body .h4-transition,.reset-transition {
  position:fixed; inset:0; z-index:9999; display:grid; place-items:center; padding:24px;
  background:radial-gradient(ellipse at 0% 100%,#bce6fb 0,transparent 56%),radial-gradient(ellipse at 100% 0%,#ded8ff 0,transparent 55%),#fff8ef;
  color:#25343d; opacity:0; overflow:auto; isolation:isolate; transition:opacity 320ms ease;
}
html body .h4-transition.is-visible,.reset-transition.is-visible { opacity:1; }
html body .h4-transition-inner,.reset-transition-inner {
  width:min(100%,570px); text-align:center; opacity:0; transform:translateY(18px) scale(.975);
  transition:opacity 320ms ease,transform 450ms cubic-bezier(.22,1,.36,1);
}
html body .h4-transition.is-visible .h4-transition-inner,.reset-transition.is-visible .reset-transition-inner { opacity:1; transform:none; }
html body .h4-transition h2,.reset-transition h2 { color:#25343d; font-size:clamp(32px,5vw,54px); line-height:1.2; margin:14px 0; }
html body .h4-transition-detail,.reset-transition p { color:#52616a; font-size:15px; line-height:1.65; }
html body .h4-transition-kicker { color:#27668e; }
html body .h4-transition-line { height:1px; background:#27668e33; }
html body .h4-transition-line::after { background:#27668e; }
.reset-transition[hidden],html body .h4-transition[hidden] { display:none!important; }
.reset-transition img { display:block; width:118px; height:auto; margin:0 auto 26px; }
.reset-transition-symbol { display:grid; place-items:center; width:84px; height:84px; margin:0 auto 22px; border-radius:36% 64% 58% 42%; background:#ded8ff; color:#554596; font-size:46px; }
.reset-transition.is-visible .reset-transition-symbol { animation:histi-reset-turn 800ms cubic-bezier(.22,1,.36,1) both; }
@keyframes histi-reset-turn { from { opacity:0; transform:rotate(-130deg) scale(.8); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) {
  @view-transition { navigation:none; }
  html::view-transition-group(*),html::view-transition-old(*),html::view-transition-new(*) { animation:none!important; }
  html.histi-url-motion::before,html.histi-url-motion::after,.histi-card-morph,.histi-history-veil { display:none; transition:none; animation:none!important; }
  html body .h4-transition,.reset-transition,html body .h4-transition-inner,.reset-transition-inner { transition:none; }
  .reset-transition-symbol { animation:none!important; }
}