/* Declarations tokens.json cannot hold: composites that use var(), motion, the .h5-light scope, the keyframe.
   Loaded after tokens.css. Values that live in tokens.json are not repeated here. */
:root{
  --radius: var(--radius-none);
  --container: var(--container-lg);
  --button-padding: 8px 32px;
  --input-padding: 8px 12px;
  --border-hairline-rule: 1px solid var(--alpha-rule);
  --border-light-rule: 1px solid var(--ink-150);
  --scrim-photo: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.55) 100%);
  --scrim-photo-bottom: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.75) 100%);
  --duration-instant: 0ms;
  --duration-fast: 150ms;
  --duration-base: 300ms;
  --duration-entrance: 800ms;
  --delay-entrance: 400ms;
  --ease: ease;
  --ease-out: cubic-bezier(.2,.6,.2,1);
  --transition-color: color var(--duration-fast) var(--ease), background-color var(--duration-fast) var(--ease), border-color var(--duration-fast) var(--ease);
  --hover-opacity: .7;
  --press-opacity: .55;
}
/* Opt-in light scope for any container that sits on white. Mirrors the light theme in tokens.json. */
.h5-light{
  --surface-page: var(--ink-000);
  --surface-raised: var(--ink-100);
  --text-heading: var(--ink-950);
  --text-body: var(--ink-1000);
  --text-muted: var(--ink-650);
  --text-subtle: var(--ink-550);
  --text-bright: var(--ink-1000);
  --border-hairline: var(--ink-150);
  --border-strong: var(--ink-1000);
  --link-fg: var(--ink-1000);
  --link-fg-hover: var(--ink-650);
  --focus-ring: var(--ink-1000);
}
@keyframes h5-opacity-bounce{
  0%{opacity:0;transform:translateY(100%)}
  60%{transform:translateY(-20%)}
  100%{opacity:1;transform:translateY(0)}
}
