/* Base layer, verbatim from the design: faces, keyframes, resets. */
@font-face{font-family:"Archivo";src:url("../build/archivo.b657e48d.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Inter";src:url("../build/inter.bafe76d0.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Plex Mono";src:url("../build/plex-mono-400.c3452e42.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url("../build/plex-mono-500.994ea857.woff2") format("woff2");font-weight:500;font-display:swap}
html{overflow-x:clip}
body{margin:0;overflow-x:clip;background:#F1F4F6;color:#101D27;font-family:"Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#005198;text-decoration:none}@media (hover:hover) and (pointer:fine){
a:hover{color:#4BA3EA}}
::selection{background:#4BA3EA;color:#0B0E10}
header input::placeholder{color:#fff;opacity:.92}
@keyframes rkRise{from{opacity:0;transform:translateY(110%)}to{opacity:1;transform:translateY(0)}}
@keyframes rkFade{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}html{scroll-behavior:auto !important}}
@media (max-width:960px){#rk-hdr-nav{display:none !important}}
/* The search box grows only on the HOME hero, where the header is over the
   film and has room. Elsewhere it would push the nav around for no reason.
   Hover is gated on a fine pointer so a tablet does not fire it from a
   stray touch; :focus is ungated, which is what makes a tap on an iPad open
   it. Under 680px the box is hidden entirely, so phones never reach this. */
@media (hover:hover) and (pointer:fine){
  #rk-hdr-search:hover{border-color:rgba(255,255,255,.4) !important}
}
#rk-hdr-pill[data-solid="0"] #rk-hdr-search:focus{border-color:#4BA3EA !important}
/* the FAQ, drawn as on the category pages: <details>, so every answer is in the served HTML */
.rk-faqs{margin-top:22px;display:grid;gap:0;max-width:880px;border-top:1px solid #D5DDE3}
.rk-faq{background:none;border:0;border-bottom:1px solid #D5DDE3;border-radius:0}
.rk-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 2px;font-size:16px;font-weight:600;line-height:1.4;color:#101D27}
.rk-faq summary::-webkit-details-marker{display:none}
.rk-faq summary::after{content:'+';font:500 20px 'Plex Mono',monospace;color:#005198;flex:none;line-height:1}
.rk-faq[open] summary::after{content:'−'}@media (hover:hover) and (pointer:fine){
.rk-faq summary:hover{color:#005198}}
.rk-faq summary:focus-visible{outline:2px solid #005198;outline-offset:2px;border-radius:4px}
.rk-faq-a{padding:0 2px 20px;font-size:15px;line-height:1.7;color:#4A5D6C;max-width:72ch}
.rk-faq-a p{margin:0}
@media (max-width:560px){.rk-faq summary{padding:16px 2px;font-size:15px}.rk-faq-a{padding:0 2px 18px}}