/* Generated by tools/prep-assets.py from GUI Pro - Casual Game (Layer Lab). Do not edit by hand.
   Each .s-* class is a 9-slice sprite; set --k on the element to scale the caps (1 = sprite pixels). */
.s { border: 0; border-image-repeat: stretch; --k: 1; }
.s-btn-yellow-l { --t: 28px; --r: 31px; --b: 166px; --l: 32px; border-image: url('btn-yellow-l.png') 28 31 166 32 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-sky-l { --t: 30px; --r: 30px; --b: 164px; --l: 33px; border-image: url('btn-sky-l.png') 30 30 164 33 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-blue-l { --t: 30px; --r: 30px; --b: 164px; --l: 33px; border-image: url('btn-blue-l.png') 30 30 164 33 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-gray-l { --t: 30px; --r: 31px; --b: 164px; --l: 32px; border-image: url('btn-gray-l.png') 30 31 164 32 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-red-l { --t: 27px; --r: 32px; --b: 167px; --l: 31px; border-image: url('btn-red-l.png') 27 32 167 31 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-green-l { --t: 30px; --r: 31px; --b: 164px; --l: 32px; border-image: url('btn-green-l.png') 30 31 164 32 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-purple-l { --t: 28px; --r: 31px; --b: 166px; --l: 32px; border-image: url('btn-purple-l.png') 28 31 166 32 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-yellow-s { --t: 29px; --r: 26px; --b: 115px; --l: 28px; border-image: url('btn-yellow-s.png') 29 26 115 28 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-blue-s { --t: 32px; --r: 27px; --b: 112px; --l: 27px; border-image: url('btn-blue-s.png') 32 27 112 27 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-sky-s { --t: 27px; --r: 26px; --b: 117px; --l: 28px; border-image: url('btn-sky-s.png') 27 26 117 28 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-red-s { --t: 29px; --r: 28px; --b: 115px; --l: 26px; border-image: url('btn-red-s.png') 29 28 115 26 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-purple-s { --t: 29px; --r: 26px; --b: 115px; --l: 28px; border-image: url('btn-purple-s.png') 29 26 115 28 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-gray-s { --t: 30px; --r: 27px; --b: 114px; --l: 27px; border-image: url('btn-gray-s.png') 30 27 114 27 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-white-s { --t: 30px; --r: 26px; --b: 114px; --l: 28px; border-image: url('btn-white-s.png') 30 26 114 28 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-bluegray-s { --t: 28px; --r: 27px; --b: 116px; --l: 27px; border-image: url('btn-bluegray-s.png') 28 27 116 27 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-btn-green-s { --t: 28px; --r: 27px; --b: 116px; --l: 27px; border-image: url('btn-green-s.png') 28 27 116 27 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-panel-navy { --t: 25px; --r: 25px; --b: 38px; --l: 26px; border-image: url('panel-navy.png') 25 25 38 26 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-panel-purple { --t: 25px; --r: 25px; --b: 38px; --l: 26px; border-image: url('panel-purple.png') 25 25 38 26 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-panel-white { --t: 27px; --r: 28px; --b: 38px; --l: 28px; border-image: url('panel-white.png') 27 28 38 28 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-frame-round { --t: 25px; --r: 25px; --b: 24px; --l: 25px; border-image: url('frame-round.png') 25 25 24 25 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-frame-navy-tile { --t: 23px; --r: 22px; --b: 36px; --l: 24px; border-image: url('frame-navy-tile.png') 23 22 36 24 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-frame-sky { --t: 12px; --r: 11px; --b: 11px; --l: 12px; border-image: url('frame-sky.png') 12 11 11 12 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-card-blue { --t: 72px; --r: 22px; --b: 71px; --l: 22px; border-image: url('card-blue.png') 72 22 71 22 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-card-green { --t: 35px; --r: 22px; --b: 108px; --l: 22px; border-image: url('card-green.png') 35 22 108 22 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-card-orange { --t: 25px; --r: 22px; --b: 118px; --l: 22px; border-image: url('card-orange.png') 25 22 118 22 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-card-purple { --t: 28px; --r: 22px; --b: 115px; --l: 22px; border-image: url('card-purple.png') 28 22 115 22 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-card-dim { --t: 32px; --r: 21px; --b: 111px; --l: 23px; border-image: url('card-dim.png') 32 21 111 23 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-card-white { --t: 19px; --r: 19px; --b: 39px; --l: 19px; border-image: url('card-white.png') 19 19 39 19 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-sleeve-blue { --t: 30px; --r: 30px; --b: 133px; --l: 30px; border-image: url('sleeve-blue.png') 30 30 133 30 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-sleeve-purple { --t: 30px; --r: 35px; --b: 133px; --l: 25px; border-image: url('sleeve-purple.png') 30 35 133 25 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-sleeve-yellow { --t: 31px; --r: 30px; --b: 132px; --l: 30px; border-image: url('sleeve-yellow.png') 31 30 132 30 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-bar-bg { --t: 19px; --r: 18px; --b: 26px; --l: 19px; border-image: url('bar-bg.png') 19 18 26 19 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-bar-yellow { --t: 0px; --r: 17px; --b: 0px; --l: 17px; border-image: url('bar-yellow.png') 0 17 0 17 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-bar-white { --t: 34px; --r: 15px; --b: 32px; --l: 17px; border-image: url('bar-white.png') 34 15 32 17 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-seg-bg { --t: 9px; --r: 8px; --b: 8px; --l: 9px; border-image: url('seg-bg.png') 9 8 8 9 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-seg-green { --t: 13px; --r: 6px; --b: 6px; --l: 6px; border-image: url('seg-green.png') 13 6 6 6 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-seg-white { --t: 12px; --r: 6px; --b: 7px; --l: 6px; border-image: url('seg-white.png') 12 6 7 6 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-ribbon-yellow { --t: 0px; --r: 127px; --b: 0px; --l: 129px; border-image: url('ribbon-yellow.png') 0 127 0 129 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-ribbon-blue { --t: 0px; --r: 127px; --b: 0px; --l: 129px; border-image: url('ribbon-blue.png') 0 127 0 129 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }
.s-label-white { --t: 33px; --r: 29px; --b: 33px; --l: 30px; border-image: url('label-white.png') 33 29 33 30 fill; border-image-width: calc(var(--t) * var(--k)) calc(var(--r) * var(--k)) calc(var(--b) * var(--k)) calc(var(--l) * var(--k)); }