/* OFFSKRPT brand layer for every games site: the brand fonts, the five brand colours and straight edges.
   Loaded after each page's own styles, so it maps their variables onto the brand and squares off every corner. */
@font-face{font-family:Unbounded;font-weight:700;font-display:swap;src:url(/brand/unbounded-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:Unbounded;font-weight:900;font-display:swap;src:url(/brand/unbounded-latin-900-normal.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:400;font-display:swap;src:url(/brand/manrope-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:500;font-display:swap;src:url(/brand/manrope-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:600;font-display:swap;src:url(/brand/manrope-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:700;font-display:swap;src:url(/brand/manrope-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:800;font-display:swap;src:url(/brand/manrope-latin-800-normal.woff2) format('woff2')}

:root{
  --os-black:#0A0A0C;--os-char:#1A1A1F;--os-panel:#121216;--os-line:rgba(244,244,241,.12);--os-gray:#8A8A93;--os-white:#F4F4F1;--os-violet:#5B5BFF;--os-vtext:#8C8CFF;
  --os-disp:Unbounded,'Arial Black',system-ui,sans-serif;--os-body:Manrope,system-ui,-apple-system,'Segoe UI',sans-serif;
  /* the names the sites already use */
  --ink:#0A0A0C;--panel:#121216;--raise:#1A1A1F;--chalk:#F4F4F1;--mute:#8A8A93;--violet:#5B5BFF;--line:rgba(244,244,241,.12);
  --disp:var(--os-disp);--body:var(--os-body);--r:0px;
}

/* straight edges everywhere; only true dots and round controller knobs stay round */
*:not(#aimDot):not(.dots i):not(.bgPl i):not(.bgSeg .lk):not(.card h3 i):not(.chip i):not(.colorbox i):not(.ctlbtn):not(.dot):not(.ldAv):not(.ldCf i):not(.ldCol):not(.ldEmo):not(.ldFace i):not(.ldPill i):not(.padzone i):not(.stickbase):not(.stickknob):not(.tiltbar i):not(.whoCard i):not(.ph .btnb):not(.ph .stick):not(.who i):not(.sw):not(.os-round),
*::before,*::after{border-radius:0!important}

/* headlines: Unbounded Black in sentence case (all caps made long lines hard to read); .os-caps for short labels that should shout */
h1,h2,.os-disp{font-family:var(--os-disp)!important;font-weight:900!important;letter-spacing:-.015em}
.os-caps{text-transform:uppercase}
h3{font-family:var(--os-disp);font-weight:700;letter-spacing:0}
body{font-family:var(--os-body)}
::selection{background:var(--os-violet);color:var(--os-white)}

/* the lockup: sliced O and the OFFSKRPT wordmark, then GAMES */
.osMark{display:inline-flex;align-items:center;gap:.7em;text-decoration:none;color:var(--os-white);line-height:1}
.osMark img{height:1.05em;width:auto;display:block}
.osMark span{font:800 .62em/1 var(--os-body);letter-spacing:.32em;text-transform:uppercase;color:var(--os-gray);padding-top:.1em}
.osMark:hover span{color:var(--os-white)}
/* small violet label above a heading, like the studio site */
.osEye{display:block;font:700 13px/1.2 var(--os-body);letter-spacing:.3em;text-transform:uppercase;color:var(--os-vtext);margin:0 0 14px}
/* the corner mark on the TV and on game screens */
.osBug{position:fixed;z-index:60;left:max(18px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom));font-size:15px;opacity:.8;pointer-events:none}
.osBug span{color:var(--os-white)}
@media (max-width:520px){.osBug{font-size:12px}}
.osFoot{font:600 12px/1.4 var(--os-body);letter-spacing:.2em;text-transform:uppercase;color:var(--os-gray)}
.osFoot b{color:var(--os-white);font-weight:800}
:focus-visible{outline-color:var(--os-violet)}