/* BigUpScreen help centre */
:root { --night: #0d0618; --deep: #150926; --violet: #241240; --line: rgba(246,238,252,.12); --lilac: #f6eefc; --muted: #c9b6de; --pink: #ff2e88; --orange: #ff8a3d; --yellow: #ffc93c; --teal: #29d3c2; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: radial-gradient(80% 50% at 85% 0%, rgba(255,46,136,.16), transparent 70%), var(--night); color: var(--lilac); font: 400 17px/1.55 Barlow, system-ui, sans-serif; min-height: 100vh; }
a { color: var(--teal); }
.bar { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px clamp(16px, 4vw, 40px); background: rgba(13,6,24,.88); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.wm { font: 400 26px/1 Anton, sans-serif; color: #fff; text-decoration: none; letter-spacing: .01em; }
.wm b { font-weight: 400; color: var(--orange); }
.bar nav { display: flex; gap: 18px; }
.bar nav a { color: var(--lilac); text-decoration: none; font-weight: 600; font-size: 15px; }
.wrap { max-width: 860px; margin: 0 auto; padding: 40px 16px 60px; }
h1 { font: 400 clamp(40px, 7vw, 64px)/1.05 Anton, sans-serif; margin: 0 0 22px; letter-spacing: .005em; }
.search { position: relative; }
.search svg { position: absolute; left: 18px; top: 50%; width: 22px; height: 22px; transform: translateY(-50%); color: var(--muted); }
.search input { width: 100%; font: 500 19px Barlow, sans-serif; color: #fff; background: var(--deep); border: 2px solid var(--line); border-radius: 14px; padding: 16px 18px 16px 52px; outline: none; }
.search input:focus { border-color: var(--pink); }
.cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 6px; }
.cats button { font: 600 14px Barlow, sans-serif; color: var(--lilac); background: rgba(255,255,255,.06); border: 1px solid var(--line); border-radius: 99px; padding: 7px 14px; cursor: pointer; }
.cats button.on { background: var(--pink); border-color: var(--pink); color: #fff; }
.count { font-size: 14px; color: var(--muted); margin: 10px 0; min-height: 1em; }
.group { font: 700 13px 'Barlow Condensed', sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--yellow); margin: 26px 0 8px; }
details.qa { background: var(--deep); border: 1px solid var(--line); border-radius: 14px; margin: 8px 0; }
details.qa[open] { border-color: rgba(255,46,136,.5); }
details.qa summary { cursor: pointer; list-style: none; padding: 15px 48px 15px 18px; font-weight: 700; font-size: 17px; position: relative; }
details.qa summary::-webkit-details-marker { display: none; }
details.qa summary::after { content: '+'; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font: 400 24px Anton, sans-serif; color: var(--pink); }
details.qa[open] summary::after { content: '–'; }
.body { padding: 0 18px 16px; color: #e9dcf7; }
.body ol { margin: 0 0 10px; padding-left: 0; list-style: none; counter-reset: s; }
.body ol li { counter-increment: s; position: relative; padding: 6px 0 6px 40px; }
.body ol li::before { content: counter(s); position: absolute; left: 0; top: 6px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--teal); color: #062521; font: 700 15px Barlow, sans-serif; }
.body p { margin: 6px 0 0; }
.body b { color: #fff; }
.body .link { display: inline-block; margin-top: 10px; font-size: 13px; color: var(--muted); }
mark { background: rgba(255,201,60,.3); color: inherit; border-radius: 3px; padding: 0 1px; }
.none { color: var(--muted); }
.foot { text-align: center; color: var(--muted); font-size: 13px; padding: 26px 16px 40px; border-top: 1px solid var(--line); }
@media (max-width: 520px) { .bar nav { gap: 12px; } .wm { font-size: 22px; } details.qa summary { font-size: 16px; } }