@font-face{font-family:Mabry;font-weight:400;src:url(fonts/MabryPro-Regular.woff2) format("woff2")}
@font-face{font-family:Mabry;font-weight:500;src:url(fonts/MabryPro-Medium.woff2) format("woff2")}
@font-face{font-family:Mabry;font-weight:700;src:url(fonts/MabryPro-Bold.woff2) format("woff2")}
:root{--bg:#0D0D0D;--yellow:#FED100;--yellow2:#FFD825;--white:#fff;--grey:#A8A8A8;--idx:#707070;--line:#4B4B4B;
--card:linear-gradient(-4deg,#080808 0%,#151515 54%,#0D0D0D 100%);
--bevel:inset 1px 1px 0 rgba(255,255,255,.14),inset -1px -1px 0 rgba(56,56,56,.9);
--fill:linear-gradient(-4deg,#FED100,#FFD825)}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--white);font:400 16px/1.45 Mabry,sans-serif}
h1{font-weight:700;text-transform:uppercase;margin:0;line-height:1.05}
h1 em{font-style:normal;color:var(--yellow)}
button,input{font:inherit}
.hide{display:none!important}
/* login */
#login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.box{width:100%;max-width:420px;background:var(--card);box-shadow:var(--bevel);border-radius:13px;padding:32px;text-align:center}
.box img{mix-blend-mode:lighten;width:74px;display:block;margin:0 auto 22px}
.box h1{font-size:28px;margin-bottom:24px}
.box label{display:block;text-align:left;font-size:14px;color:var(--grey);margin:0 0 6px}
.field{width:100%;height:48px;padding:0 14px;background:#0D0D0D;color:#fff;border:1px solid var(--line);border-radius:10px;outline:0;margin-bottom:16px}
.field:focus{border-color:var(--yellow);box-shadow:0 0 0 2px rgba(254,233,0,.22)}
.yb{width:100%;height:48px;border:0;border-radius:10px;background:var(--fill);color:#0D0D0D;font-weight:700;cursor:pointer}
.yb:disabled{opacity:.6;cursor:default}
.err{margin:0 0 16px;font-size:14px;color:var(--yellow);text-align:left}
/* cabinet shell */
.wrap{max-width:1200px;margin:0 auto;padding:20px 24px 48px}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:1px solid rgba(75,75,75,.6)}
.top img{width:52px;display:block}
.who{font-size:14px;color:var(--grey);text-align:right}
.who b{display:block;color:#fff}
.who button{padding:0;border:0;background:none;color:var(--grey);cursor:pointer;text-decoration:underline}
.head{padding:30px 0 20px}
.head h1{font-size:40px}
.head p{margin:10px 0 0;color:var(--grey)}
.head p b{color:var(--yellow)}
.empty{padding:48px 20px;text-align:center;color:var(--grey);background:var(--card);box-shadow:var(--bevel);border-radius:13px}
@media(max-width:600px){.head h1{font-size:30px}}
