/* Original native frame treatment, informed by Arwes' measured SVG contours
   and short assembly transitions. No framework, animation runtime or filters. */
.rp-frame{
  isolation:isolate;
  border-color:transparent!important;
  border-radius:0!important;
  clip-path:none!important;
  background:none!important;
  box-shadow:none!important;
  --frame-fill:var(--frame-base-fill,#0b1914);
  --frame-line:var(--frame-base-line,var(--line,#294237));
  --frame-accent:var(--amber,#ffb454);
}
.rp-frame-relative{position:relative}
.rp-frame-panel{clip-path:var(--frame-clip,none)!important}
.rp-frame-panel::before,.rp-frame-panel::after{content:none!important;display:none!important}
/* The sign-in emblem is typography, separate from its single frame contour. */
.hosted-login.rp-frame::before{content:'◈'!important;display:block!important;position:static;background:none;clip-path:none;width:auto;height:auto;color:var(--mint,#85f4be)}
.rp-frame-art,.rp-frame-surface{
  position:absolute;
  top:calc(-1 * var(--frame-border-top,0px));left:calc(-1 * var(--frame-border-left,0px));
  width:calc(100% + var(--frame-border-left,0px) + var(--frame-border-right,0px));
  height:calc(100% + var(--frame-border-top,0px) + var(--frame-border-bottom,0px));
  max-width:none!important;
  z-index:3;pointer-events:none!important;overflow:hidden;
  contain:strict;
}
.rp-frame-surface{z-index:-1}
button>.rp-frame-art,button>.rp-frame-surface{width:calc(100% + var(--frame-border-left,0px) + var(--frame-border-right,0px));height:calc(100% + var(--frame-border-top,0px) + var(--frame-border-bottom,0px))}
.rp-frame-fill{fill:var(--frame-fill);transition:fill 140ms ease-out}
.rp-frame-outline{stroke:var(--frame-line);stroke-width:1;transition:stroke 140ms ease-out}
.rp-frame-accent,.rp-frame-secondary{stroke:var(--frame-accent);stroke-width:2;opacity:.88;transition:opacity 140ms ease-out}
.rp-frame-secondary{opacity:.42}
.rp-frame:focus-within>.rp-frame-art .rp-frame-accent{opacity:1}
.rp-frame-control{--frame-accent:var(--mint,#85f4be)}
.rp-frame-control:focus-visible{outline:2px solid var(--mint,#85f4be);outline-offset:3px}
.rp-frame-control:active:not(:disabled){--frame-fill:color-mix(in srgb,var(--frame-base-fill) 82%,var(--mint,#85f4be))}
.rp-frame-control:where([aria-pressed=true],[aria-checked=true]){--frame-line:var(--mint,#85f4be);--frame-fill:var(--mint,#85f4be);color:#071510}
@media(hover:hover){
  .rp-frame-panel:hover>.rp-frame-art .rp-frame-accent{opacity:1}
  .rp-frame-control:hover:not(:disabled):not([aria-pressed=true]):not([aria-checked=true]){--frame-line:var(--mint,#85f4be);--frame-fill:color-mix(in srgb,var(--frame-base-fill) 91%,var(--mint,#85f4be))}
}
.rp-frame-surface[data-frame-enter] .rp-frame-fill{animation:rp-frame-fill-in 180ms ease-out var(--frame-delay,0ms) both}
.rp-frame-art[data-frame-enter] .rp-frame-outline{animation:rp-frame-line-in 300ms cubic-bezier(.16,1,.3,1) var(--frame-delay,0ms) both}
.rp-frame-art[data-frame-enter] .rp-frame-accent{animation:rp-frame-accent-in 180ms ease-out calc(var(--frame-delay,0ms) + 140ms) both}
.rp-frame-art[data-frame-enter] .rp-frame-secondary{animation:rp-frame-secondary-in 180ms ease-out calc(var(--frame-delay,0ms) + 140ms) both}
@keyframes rp-frame-fill-in{from{opacity:0}to{opacity:1}}
@keyframes rp-frame-line-in{from{stroke-dasharray:1;stroke-dashoffset:1;opacity:.3}to{stroke-dasharray:1;stroke-dashoffset:0;opacity:1}}
@keyframes rp-frame-secondary-in{from{opacity:0}to{opacity:.42}}
@keyframes rp-frame-accent-in{from{opacity:0}to{opacity:.88}}
@media(prefers-reduced-motion:reduce){
  .rp-frame-art path,.rp-frame-surface path{animation:none!important;transition:none!important}
}
body.reduced-motion .rp-frame-art path,body.reduced-motion .rp-frame-surface path{animation:none!important;transition:none!important}
@media(forced-colors:active){
  .rp-frame-fill{fill:Canvas}.rp-frame-outline,.rp-frame-accent,.rp-frame-secondary{stroke:CanvasText}
}
