/* Generado por scripts/sprite-maker/art115_web.py (borrador art115). Rutas relativas a client/web/css/.
   9-slice con border-image; en pantallas 2x se cambian fuente (@2x) y slice (x2) por media query. */

.zw-box { box-sizing: border-box; border-style: solid; border-width: 12px; border-image: url(../img/frame/box.png) 12 fill / 12px / 0 stretch; }
.zw-box-title { box-sizing: border-box; border-style: solid; border-width: 0 12px; border-image: url(../img/frame/box-title.png) 0 12 fill / 0 12px / 0 round; }
.zw-btn { box-sizing: border-box; border-style: solid; border-width: 8px; border-image: url(../img/btn/btn-normal.png) 8 fill / 8px / 0 stretch; }
.zw-btn:hover { border-image-source: url(../img/btn/btn-hover.png); }
.zw-btn:active, .zw-btn.is-pressed { border-image-source: url(../img/btn/btn-pressed.png); }
.zw-btn:disabled, .zw-btn.is-disabled { border-image-source: url(../img/btn/btn-disabled.png); }
.zw-playnow { box-sizing: border-box; border-style: solid; border-width: 14px 16px; border-image: url(../img/btn/playnow-normal.png) 14 16 fill / 14px 16px / 0 round; }
.zw-playnow:hover { border-image-source: url(../img/btn/playnow-hover.png); }
.zw-playnow:active, .zw-playnow.is-pressed { border-image-source: url(../img/btn/playnow-pressed.png); }
.zw-playnow:disabled, .zw-playnow.is-disabled { border-image-source: url(../img/btn/playnow-disabled.png); }
.zw-menu { box-sizing: border-box; border-style: solid; border-width: 8px; border-image: url(../img/menu/item-normal.png) 8 fill / 8px / 0 stretch; }
.zw-menu:hover { border-image-source: url(../img/menu/item-hover.png); }
.zw-menu.is-active, .zw-menu[aria-current] { border-image-source: url(../img/menu/item-active.png); }

.zw-box-title { height: 30px; }
.zw-playnow { height: 56px; } .zw-btn { min-height: 28px; }

/* pantallas 2x */
@media (min-resolution: 2dppx), (-webkit-min-device-pixel-ratio: 2) {
  .zw-box { border-image-source: url(../img/frame/box@2x.png); border-image-slice: 24 fill; }
  .zw-box-title { border-image-source: url(../img/frame/box-title@2x.png); border-image-slice: 0 24 fill; }
  .zw-btn { border-image-source: url(../img/btn/btn-normal@2x.png); border-image-slice: 16 fill; }
  .zw-btn:hover { border-image-source: url(../img/btn/btn-hover@2x.png); }
  .zw-btn:active, .zw-btn.is-pressed { border-image-source: url(../img/btn/btn-pressed@2x.png); }
  .zw-btn:disabled, .zw-btn.is-disabled { border-image-source: url(../img/btn/btn-disabled@2x.png); }
  .zw-playnow { border-image-source: url(../img/btn/playnow-normal@2x.png); border-image-slice: 28 32 fill; }
  .zw-playnow:hover { border-image-source: url(../img/btn/playnow-hover@2x.png); }
  .zw-playnow:active, .zw-playnow.is-pressed { border-image-source: url(../img/btn/playnow-pressed@2x.png); }
  .zw-playnow:disabled, .zw-playnow.is-disabled { border-image-source: url(../img/btn/playnow-disabled@2x.png); }
  .zw-menu { border-image-source: url(../img/menu/item-normal@2x.png); border-image-slice: 16 fill; }
  .zw-menu:hover { border-image-source: url(../img/menu/item-hover@2x.png); }
  .zw-menu.is-active, .zw-menu[aria-current] { border-image-source: url(../img/menu/item-active@2x.png); }
}

/* fondo de pagina y de cabecera */
.zw-page { background: #0E0E10 url(../img/tex/page-bg.png) repeat; }
.zw-header { background: #0E0E10 url(../img/logo/header-bg.png) center top / cover no-repeat; }
@media (min-resolution: 2dppx), (-webkit-min-device-pixel-ratio: 2) {
  .zw-page { background-image: url(../img/tex/page-bg@2x.png); background-size: 256px 256px; }
  .zw-header { background-image: url(../img/logo/header-bg@2x.png); }
}

/* tipografias (OFL; copiadas de assets/ui/obsidiana/fonts a client/web/fonts) */
@font-face { font-family: 'Chakra Petch'; font-weight: 700; src: url(../fonts/ChakraPetch-Bold.woff) format('woff'); }
@font-face { font-family: 'Chakra Petch'; font-weight: 600; src: url(../fonts/ChakraPetch-SemiBold.woff) format('woff'); }
@font-face { font-family: 'Chakra Petch'; font-weight: 400; src: url(../fonts/ChakraPetch-Regular.woff) format('woff'); }
@font-face { font-family: 'Inter'; font-weight: 100 900; src: url(../fonts/Inter-variable.woff) format('woff'); }