/* ==========================================================
   PS4 CSSFontFace Exploit Host
   Lightweight Background Console Theme
========================================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html,
body{

    width:100%;
    height:100%;
    overflow:hidden;

    background:linear-gradient(180deg,#101820,#05070a);

    color:#ffffff;

    font-family:Arial,sans-serif;
}

/* ==========================================================
   Main Layout
========================================================== */

.container{

    position:relative;

    width:100%;
    height:100%;

    overflow:hidden;

    display:flex;

    justify-content:center;
    align-items:center;

}

/* ==========================================================
   Background Console
========================================================== */

#console{

    position:absolute;

    top:50%;
    left:50%;

    transform:translate(-50%,-50%);

    width:78%;
    height:62%;

    overflow-y:auto;
    overflow-x:hidden;

    pointer-events:none;

    background:none;

    border:none;

    color:rgba(0,255,180,.08);

    font-family:Consolas,"Courier New",monospace;

    font-size:18px;

    line-height:1.5;

    white-space:pre-wrap;

    word-break:break-word;

    z-index:0;

}

#console::-webkit-scrollbar{

    display:none;

}

/* ==========================================================
   Foreground
========================================================== */

.foreground{

    position:relative;

    z-index:10;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

}

/* ==========================================================
   Logo
========================================================== */

.logo{

    text-align:center;

    margin-bottom:28px;

}

.logo h1{

    font-size:34px;

    font-weight:bold;

    letter-spacing:3px;

}

.logo p{

    margin-top:6px;

    color:#67dfff;

    font-size:14px;

    letter-spacing:2px;

}

/* ==========================================================
   Jailbreak Button
========================================================== */

.jb-button{

    width:220px;
    height:220px;

    border-radius:50%;

    border:3px solid #3bd8ff;

    background:#101820;

    color:#ffffff;

    cursor:pointer;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    box-shadow:0 0 10px #00bfff;
}

.jb-button:hover{

    box-shadow:0 0 14px #00d8ff;

}

.jb-button:disabled{

    /* opacity:.85; */
    color:rgba(0,255,180,.05);

    cursor:default;

}

.jb-button.success{

    border-color:#2eff7a;

    box-shadow:0 0 12px #2eff7a;

}

.jb-button.failed{

    border-color:#ff4444;

    box-shadow:0 0 12px #ff4444;

}

/* ==========================================================
   Power Icon
========================================================== */

.power-icon{

    position:relative;

    width:70px;
    height:70px;

    border:6px solid #3bd8ff;

    border-top-color:transparent;

    border-radius:50%;

}

.power-icon::before{

    content:"";

    position:absolute;

    top:-8px;
    left:50%;

    transform:translateX(-50%);

    width:6px;
    height:34px;

    background:#3bd8ff;

    border-radius:5px;

}

/* ==========================================================
   Button Text
========================================================== */

.button-text{

    margin-top:16px;

    font-size:22px;

    font-weight:bold;

    letter-spacing:2px;

}

/* ==========================================================
   Status
========================================================== */

.status{

    margin-top:24px;

    color:#67dfff;

    font-size:17px;

    font-weight:bold;

    letter-spacing:2px;

}

/* ==========================================================
   Hidden
========================================================== */

.hidden{

    display:none !important;

}