/* Be President page, dressed like the game: violet night, the amber to
   magenta to violet ramp, bevelled plates with hard bottom edges, Anton
   headlines, Archivo text and JetBrains Mono labels. Values come from the
   game's www/css/tokens.css and components.css. Fonts are SIL OFL. */
@font-face{font-family:"Anton";font-weight:400;font-display:swap;src:url("/assets/fonts/be-president/Anton-400-latin.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-weight:400 900;font-display:swap;src:url("/assets/fonts/be-president/Archivo-400-latin.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:700;font-display:swap;src:url("/assets/fonts/be-president/JetBrainsMono-700-latin.woff2") format("woff2")}

.theme-be-president{
  --amber:#F0B45E; --magenta:#D9459A; --violet:#7E51E8;
  --ramp:linear-gradient(135deg,#F0B45E,#D9459A 52%,#7E51E8);
  --ramp-bar:linear-gradient(90deg,#7E51E8,#D9459A 60%,#F0B45E);
  --bp-ink:#F6F2FF; --bp-body:#A79EC2; --bp-dim:#857BA6; --bp-line:#221D3B; --bp-line-2:#2E2750; --bp-line-3:#3B3260;
  --f-display:Anton,Oswald,"Arial Narrow",Impact,sans-serif; --f-ui:Archivo,system-ui,sans-serif; --f-data:"JetBrains Mono",ui-monospace,Menlo,monospace;
  background:radial-gradient(1100px 520px at 16% -8%,rgba(140,70,210,.10),transparent 62%),radial-gradient(800px 420px at 88% 8%,rgba(200,135,60,.07),transparent 65%),#07070E;
  color:#F2EFFA;font-family:var(--f-ui);
}
.theme-be-president .site-head{background:linear-gradient(180deg,#14102A,#0E0B1E);border-color:var(--bp-line);color:var(--bp-ink);box-shadow:0 6px 18px rgba(0,0,0,.55)}
.theme-be-president .site-head .brand span i{color:var(--bp-dim)}
.theme-be-president .site-nav a{font-family:var(--f-data);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--bp-body)}
.theme-be-president .site-nav a:hover,.theme-be-president .site-nav a[aria-current="page"]{color:var(--amber);border-color:var(--magenta)}

/* Hero: the title screen */
.theme-be-president .g-hero{background:radial-gradient(440px 330px at 30% 30%,rgba(217,69,154,.18),transparent 70%),radial-gradient(300px 240px at 74% 66%,rgba(227,156,67,.10),transparent 70%),
  linear-gradient(180deg,#120D22 0%,#0C0A18 55%,#07070E 100%);border-color:var(--bp-line);color:var(--bp-ink)}
.theme-be-president .crumbs,.theme-be-president .g-kicker{font-family:var(--f-data);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--bp-dim);opacity:1}
.theme-be-president .g-kicker{color:var(--amber);text-shadow:0 2px 16px rgba(240,180,94,.48)}
.theme-be-president .g-hero h1{font-family:var(--f-display);font-weight:400;text-transform:uppercase;letter-spacing:.01em;font-size:clamp(52px,6.6vw,92px);line-height:.94;
  text-shadow:0 4px 0 rgba(0,0,0,.6),0 0 44px rgba(217,69,154,.36)}
.theme-be-president .title img{border-radius:22%;box-shadow:0 0 0 2px #3B3260,0 5px 0 rgba(0,0,0,.5),0 0 28px rgba(217,69,154,.42)}
.theme-be-president .g-hero .lede{color:var(--bp-body);font-size:18px}
.theme-be-president .g-hero .cover{border-radius:20px;padding:2px;background:linear-gradient(140deg,#F0B45E,#D9459A 52%,#7E51E8);box-shadow:0 6px 0 rgba(0,0,0,.5),0 30px 80px rgba(0,0,0,.7)}
.theme-be-president .gp{border-radius:14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 5px 0 #120F1F}

/* Panels: plates and the bottom sheet with its ramp stripe */
.theme-be-president .g-body{background:linear-gradient(180deg,#0E0B1E,#08070F)}
.theme-be-president .g-panel{position:relative;overflow:hidden;background:linear-gradient(180deg,#15112C,#0D0A18);border:1px solid var(--bp-line-2);border-radius:21px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 6px 0 rgba(0,0,0,.45),0 24px 54px rgba(0,0,0,.5);color:var(--bp-body);font-size:16px;line-height:1.6}
.theme-be-president .g-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#7E51E8,#D9459A,#F0B45E)}
.theme-be-president .g-panel h2{font-family:var(--f-data);font-weight:700;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--amber);margin:6px 0 18px}
.theme-be-president .g-about p:first-of-type{color:#F2EFFA;font-size:17px}
.theme-be-president .g-facts dl div{border-bottom:1px solid var(--bp-line)}
.theme-be-president .g-facts dt{font-family:var(--f-data);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--bp-dim);align-self:center}
.theme-be-president .g-facts dd{font-family:var(--f-display);font-weight:400;font-size:22px;letter-spacing:.02em;text-transform:uppercase;color:var(--amber)}
.theme-be-president .g-facts .more{color:#9C86CE;border-color:#463A6E}
.theme-be-president .g-facts .more:hover{color:#E4C4FF;opacity:1}
.theme-be-president .g-cost{background:linear-gradient(180deg,rgba(217,69,154,.13),rgba(139,92,246,.05)),linear-gradient(180deg,#15112C,#0D0A18);border-color:rgba(217,69,154,.36)}

/* Gallery: phone plates */
.theme-be-president .g-gallery{background:#07070E}
.theme-be-president .g-gallery h2{font-family:var(--f-display);font-weight:400;text-transform:uppercase;letter-spacing:.01em;color:var(--bp-ink);text-shadow:0 0 30px rgba(217,69,154,.35)}
.theme-be-president .shot-btn img{border:1px solid var(--bp-line);border-radius:22px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 5px 0 rgba(0,0,0,.5),0 20px 40px rgba(0,0,0,.5)}
.theme-be-president .shot-btn:hover img{box-shadow:0 5px 0 rgba(0,0,0,.5),0 0 34px rgba(217,69,154,.45)}
.theme-be-president .shots-grid figcaption{font-family:var(--f-data);font-size:10px;letter-spacing:.12em;text-transform:uppercase;line-height:1.5;color:var(--bp-dim);opacity:1}
.theme-be-president .lb-cap{font-family:var(--f-data);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.theme-be-president .lightbox button{border-color:#3B3260;background:linear-gradient(180deg,#241E42,#1F1A35);box-shadow:0 4px 0 #120F1F}

.theme-be-president .others{background:#07070E;border-color:var(--bp-line)}
.theme-be-president .others h2{font-family:var(--f-display);font-weight:400;text-transform:uppercase;letter-spacing:.01em;color:var(--bp-ink)}
.theme-be-president .others a{background:linear-gradient(180deg,#191430,#110E22);border:1px solid var(--bp-line-2);border-radius:14px;color:var(--bp-ink);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 4px 0 rgba(0,0,0,.45)}
.theme-be-president .others a:hover{background:var(--ramp);color:#1E0A18}
.theme-be-president .others a:hover small{color:#3A1226}
.theme-be-president .others small{color:var(--bp-dim)}
.theme-be-president .site-foot{background:#07070E;color:var(--bp-body);border-color:var(--bp-line)}
.theme-be-president .site-foot .muted,.theme-be-president .site-foot .legal{color:var(--bp-dim)}

/* Loading screen in the game's colours */
.theme-be-president .loader{--loader-bg:#07070E;--loader-ink:#F6F2FF;--loader-line:#3B3260;--loader-track:#0A0812;--loader-fill:#D9459A}
.theme-be-president .loader-bar{border-width:1px;border-radius:10px;box-shadow:inset 0 2px 5px rgba(0,0,0,.85),0 0 30px rgba(217,69,154,.25)}
.theme-be-president .loader-bar i{border-radius:6px;background-image:repeating-linear-gradient(90deg,rgba(0,0,0,.45) 0 2px,transparent 2px 9px),linear-gradient(90deg,#7E51E8,#D9459A 60%,#F0B45E)}
.theme-be-president .loader-row{font-family:var(--f-data);font-size:12px;letter-spacing:.2em}