/* Basis borders, radii, shadows, motion, z-index.
   Shadows include Polaris's signature layered button bevels — the crisp,
   physical button look. Radii top out at 16px for cards. */
:root{
/* Radii */
--p-border-radius-0:0px;--p-border-radius-050:2px;--p-border-radius-100:4px;--p-border-radius-150:6px;--p-border-radius-200:8px;--p-border-radius-300:12px;--p-border-radius-400:16px;--p-border-radius-500:20px;--p-border-radius-750:30px;--p-border-radius-full:9999px;
/* Border widths */
--p-border-width-0:0px;--p-border-width-0165:0.66px;--p-border-width-025:1px;--p-border-width-050:2px;--p-border-width-100:4px;

/* Elevation shadows */
--p-shadow-0:none;
--p-shadow-100:0px 1px 0px 0px rgba(26,26,26,0.07);
--p-shadow-200:0px 3px 1px -1px rgba(26,26,26,0.07);
--p-shadow-300:0px 4px 6px -2px rgba(26,26,26,0.20);
--p-shadow-400:0px 8px 16px -4px rgba(26,26,26,0.22);
--p-shadow-500:0px 12px 20px -8px rgba(26,26,26,0.24);
--p-shadow-600:0px 20px 20px -8px rgba(26,26,26,0.28);
--p-shadow-bevel-100:1px 0px 0px 0px rgba(0,0,0,0.13) inset,-1px 0px 0px 0px rgba(0,0,0,0.13) inset,0px -1px 0px 0px rgba(0,0,0,0.17) inset,0px 1px 0px 0px rgba(204,204,204,0.5) inset;
--p-shadow-inset-100:0px 1px 2px 0px rgba(26,26,26,0.15) inset,0px 1px 1px 0px rgba(26,26,26,0.15) inset;
--p-shadow-inset-200:0px 2px 1px 0px rgba(26,26,26,0.20) inset,1px 0px 1px 0px rgba(26,26,26,0.12) inset,-1px 0px 1px 0px rgba(26,26,26,0.12) inset;
/* Signature layered button shadows */
--p-shadow-button:0px -1px 0px 0px #b5b5b5 inset,0px 0px 0px 1px rgba(0,0,0,0.1) inset,0px 0.5px 0px 1.5px #FFF inset;
--p-shadow-button-hover:0px 1px 0px 0px #EBEBEB inset,-1px 0px 0px 0px #EBEBEB inset,1px 0px 0px 0px #EBEBEB inset,0px -1px 0px 0px #CCC inset;
--p-shadow-button-inset:-1px 0px 1px 0px rgba(26,26,26,0.122) inset,1px 0px 1px 0px rgba(26,26,26,0.122) inset,0px 2px 1px 0px rgba(26,26,26,0.2) inset;
--p-shadow-button-primary:0px -1px 0px 1px rgba(0,0,0,0.8) inset,0px 0px 0px 1px rgba(48,48,48,1) inset,0px 0.5px 0px 1.5px rgba(255,255,255,0.25) inset;
--p-shadow-button-primary-hover:0px 1px 0px 0px rgba(255,255,255,0.24) inset,1px 0px 0px 0px rgba(255,255,255,0.20) inset,-1px 0px 0px 0px rgba(255,255,255,0.20) inset,0px -1px 0px 0px #000 inset,0px -1px 0px 1px #1A1A1A;
--p-shadow-border-inset:0px 0px 0px 1px rgba(0,0,0,0.08) inset;

/* Motion — durations */
--p-motion-duration-0:0ms;/* @kind other */
--p-motion-duration-50:50ms;/* @kind other */
--p-motion-duration-100:100ms;/* @kind other */
--p-motion-duration-150:150ms;/* @kind other */
--p-motion-duration-200:200ms;/* @kind other */
--p-motion-duration-250:250ms;/* @kind other */
--p-motion-duration-300:300ms;/* @kind other */
--p-motion-duration-350:350ms;/* @kind other */
--p-motion-duration-400:400ms;/* @kind other */
--p-motion-duration-500:500ms;/* @kind other */
/* Motion — easing */
--p-motion-ease:cubic-bezier(0.25,0.1,0.25,1);/* @kind other */
--p-motion-ease-in:cubic-bezier(0.42,0,1,1);/* @kind other */
--p-motion-ease-out:cubic-bezier(0.19,0.91,0.38,1);/* @kind other */
--p-motion-ease-in-out:cubic-bezier(0.42,0,0.58,1);/* @kind other */
--p-motion-linear:cubic-bezier(0,0,1,1);/* @kind other */

/* z-index */
--p-z-1:100;/* @kind other */
--p-z-2:400;/* @kind other */
--p-z-3:510;/* @kind other */
--p-z-4:512;/* @kind other */
--p-z-5:513;/* @kind other */
--p-z-6:514;/* @kind other */
--p-z-7:515;/* @kind other */
--p-z-8:516;/* @kind other */
--p-z-9:517;/* @kind other */
--p-z-10:518;/* @kind other */
--p-z-11:519;/* @kind other */
--p-z-12:520;/* @kind other */
}
@keyframes p-fade-in{to{opacity:1}}
@keyframes p-spin{to{transform:rotate(1turn)}}
@keyframes p-appear-above{from{transform:translateY(4px);opacity:0}to{transform:none;opacity:1}}
@keyframes p-appear-below{from{transform:translateY(-4px);opacity:0}to{transform:none;opacity:1}}