/* atma-bengali-600-normal */
@font-face {
  font-family: 'Atma';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(../490f5ccb97cd794c3b95.woff2) format('woff2'), url(../6c6d6454ca80fe052888.woff) format('woff');
  unicode-range: U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0,U+1CD2,U+1CD5-1CD6,U+1CD8,U+1CE1,U+1CEA,U+1CED,U+1CF2,U+1CF5-1CF7,U+200C-200D,U+20B9,U+25CC,U+A8F1;
}

/* atma-latin-ext-600-normal */
@font-face {
  font-family: 'Atma';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(../2045ad4c570a249bf38d.woff2) format('woff2'), url(../72880a7e8128af3f2049.woff) format('woff');
  unicode-range: U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* atma-latin-600-normal */
@font-face {
  font-family: 'Atma';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(../300480d967c581ecd84a.woff2) format('woff2'), url(../91c93318584cc3ac7900.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
.platypus-debugging {
    position: fixed;
    pointer-events: none;
    color: #fff;
    font-size: 12px;
    padding: 5px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 2;
    font-family: "Lucida Console", Monaco, monospace;
    -webkit-touch-callout: none;
    user-select: none;
    cursor: default;
    margin: 0;
    line-height: 1.5em;
}

#framerate {
    top: 0;
    left: 0;
}

#platypus-logging {
    top: 0;
    right: 0;
    max-width: 40%;
    max-height: 40%;
    overflow-x: auto;
}

#platypus-logging .general {color: lightgreen;}
#platypus-logging .log {color: white;}
#platypus-logging .warn {color: yellow;}
#platypus-logging .debug {color: lightblue;}
#platypus-logging .error {color: lightcoral;}
#platypus-logging span {padding-right: 1.5em;}

#toggle-platypus-debugging {
    position: fixed;
    top: 0;
    right: 0;
    font-size: 12px;
    padding: 5px;
    background: rgba(0, 0, 0, 0.4);
    font-family: "Lucida Console", Monaco, monospace;
    border: none;
    color: white;
    z-index: 3;
}
/*Atma (Semi-bold).*/

body {
    margin: 0;
    padding: 0;
}

#font-loader {
    position: absolute;
    top: -100%;
    left: -100%;
}
.font-atma {font-family: Atma;}

div#frame {
    top: 0;
    bottom: 0;
    position: fixed;
    left: 0;
    right: 0;
    background: #000;
}

div#content {
    position: absolute;
}

canvas#stage {
    width: 100%;
    height: 100%;
}

div#captions {
    font-family: Arial, Helvetica, sans-serif;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 2;
    font-size: 1.1em;
    background: rgba(0,0,0,0.4);
    color: white;
    line-height: 1.6em;
    pointer-events: none;
    -webkit-touch-callout: none;
    user-select: none;
    cursor: default;
}

button:focus {
    border: 5px solid #F7D145 !important;
    box-shadow: 0 0 4px black, inset 0 0 4px black !important;
    border-radius: 10px;
    outline: none !important;
}