:root { color-scheme: dark; }
html, body { min-height: 100%; background: #303030; color: #fff; }
body { margin: 0; }
.patreon-page { min-height: 100vh; display: flex; flex-direction: column; }
.site-main { width: 100%; flex: 1; }
.patreon-page .navbar-toggler { background-image: url('/images/patreon-menu.svg'); }
.patreon-page .navbar-toggler-icon { background-image: none; }
.skip-link { position: absolute; z-index: 1200; top: -5rem; left: 1rem; padding: .55rem .8rem; background: #16121b; color: #fff; }
.skip-link:focus { top: .5rem; }
.patreon-page a:focus-visible, .patreon-page button:focus-visible, .patreon-page input:focus-visible { outline: 3px solid #ffd485; outline-offset: 3px; }
.patreon-content { width: min(850px,calc(100% - 8rem)); margin: 0 auto; padding: 1.7rem 0 3rem; line-height: 1.6; overflow-wrap: anywhere; }
.patreon-content a { color: #e8b8ff; text-underline-offset: .18em; }
.patreon-content a:hover { color: #fff; }
.patreon-hero { position: relative; overflow: hidden; margin: 0 0 1.4rem; padding: 1.35rem clamp(1.2rem,4vw,2.6rem) 2rem; text-align: center; background: radial-gradient(circle at 50% 0,#e05cff38,transparent 58%),linear-gradient(145deg,#27243a,#191926); border: 1px solid #ba85d055; border-radius: 1rem; box-shadow: 0 12px 36px #0005; }
.patreon-hero::before { content: ''; display: block; position: absolute; top: 0; left: 12%; right: 12%; height: 2px; background: linear-gradient(90deg,transparent,#e05cff,#fff5,transparent); }
.eyebrow { margin: 0; color: #f0b7f4; font-size: .78rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.hero-logo { display: block; width: min(260px,75%); height: auto; margin: .15rem auto -.25rem; }
.hero-home { display: block; }
.patreon-content h1 { margin: 0 0 .5rem; font-size: clamp(1.9rem,4vw,2.65rem); line-height: 1.2; }
.patreon-hero p:last-child { max-width: 40rem; margin: .55rem auto 0; color: #e5dae9; }
.portal-section, .notice { background: #23232b; border: 1px solid #805b8b; border-radius: .8rem; padding: clamp(1rem,3vw,1.5rem); margin: 1rem 0; box-shadow: 0 2px 16px #0004; }
.notice { background: #342d43; }
.portal-section h2 { font-size: 1.35rem; margin: 0 0 .6rem; }
.eek-connection summary { font-size: 1.15rem; font-weight: 700; cursor: pointer; }
.eek-connection summary:focus-visible { outline: 3px solid #ffd485; outline-offset: 3px; }
.portal-section h3 { font-size: 1.12rem; margin: 0 0 .3rem; }
.portal-section p { margin: .45rem 0 1rem; }
.build { border-top: 1px solid #ffffff27; padding: 1.1rem 0 .25rem; }
.build h3 span { display: inline-block; vertical-align: middle; padding: .15rem .55rem; margin-left: .35rem; border: 1px solid #a16eff; border-radius: 99px; color: #e8b8ff; font-size: .76rem; text-transform: capitalize; }
.patreon-content button { font: inherit; font-weight: 700; background: #961e8a; color: #fff; border: 1px solid #c951bd; padding: .6rem 1rem; border-radius: .4rem; cursor: pointer; }
.patreon-content button:hover { background: #ab379f; }
.patreon-content button.secondary { background: #3d354e; border-color: #9076a6; }
.patreon-content button.secondary:hover { background: #58466d; }
.patreon-content form { margin: .8rem 0; }
.muted { color: #c6bdcf; font-size: .9rem; }
.patreon-link { text-align: center; margin-top: 1.5rem; }
@media (max-width: 900px) { .patreon-content { width: min(850px,calc(100% - 2rem)); } }
@media (max-width: 560px) {
    .patreon-hero { padding: 1rem 1rem 1.5rem; }
    .portal-section, .notice { padding: 1rem; }
    .patreon-content button { max-width: 100%; width: 100%; }
}
.resume-download { margin: 1rem 0; padding: 1rem; border: 1px solid #9076a6; border-radius: .4rem; }
.resume-download summary { cursor: pointer; font-weight: 700; }
.resume-download summary:focus-visible { outline: 3px solid #ffd485; outline-offset: 3px; }
.resume-download progress { display: block; width: 100%; height: 1.2rem; margin: .75rem 0; }
.resume-download progress[hidden] { display: none; }
.resume-download button, .resume-saved button { margin: .3rem .5rem .3rem 0; }
.resume-saved-file { border-top: 1px solid #ffffff27; padding: .75rem 0; }
.resume-saved { margin-top: 1rem; }