/* Roidboard header backgrounds (rb_season, owner 2026-11-03: "samme logo, ikke endre noe av logoene, men bare rundt
   og kanskje noe effekt"). Only the background and effect layers change; the logo, its colours and the tagline are
   never touched here. One file, four looks: .is-sp spotlight, .is-pl pulse, .is-fr frost, .is-au aurora. */

.rb-hero.rb-around{position:relative;overflow:hidden}
.rb-hero.rb-around .rb-hero-in{position:relative;z-index:5}
.rb-around .rb-ar{position:absolute;pointer-events:none}

/* ---------- Spotlight: one soft light from above on the logo, dust drifting in the beam ---------- */
.rb-hero.is-sp{background:radial-gradient(90% 120% at 50% 110%,#101826 0%,#080b12 55%,#05070b 100%)}
.is-sp .sp-beam{left:50%;top:-60%;width:70%;height:200%;transform:translateX(-50%);z-index:0;filter:blur(18px);
 background:radial-gradient(38% 55% at 50% 30%,rgba(190,214,255,.20) 0%,rgba(150,185,255,.08) 50%,transparent 78%)}
.is-sp .sp-floor{left:50%;bottom:-38px;width:520px;height:90px;transform:translateX(-50%);z-index:1;border-radius:50%;
 background:radial-gradient(closest-side,rgba(120,160,255,.22),transparent)}
.is-sp .sp-dust{inset:0;z-index:2;opacity:.7;
 background-image:radial-gradient(1px 1px at 44% 70%,rgba(255,255,255,.7) 50%,transparent 52%),radial-gradient(1px 1px at 52% 40%,rgba(255,255,255,.5) 50%,transparent 52%),
  radial-gradient(1.4px 1.4px at 57% 82%,rgba(255,255,255,.6) 50%,transparent 52%),radial-gradient(1px 1px at 47% 24%,rgba(255,255,255,.45) 50%,transparent 52%),
  radial-gradient(1px 1px at 61% 58%,rgba(255,255,255,.5) 50%,transparent 52%),radial-gradient(1.2px 1.2px at 40% 52%,rgba(255,255,255,.55) 50%,transparent 52%);
 animation:rb-sp-dust 14s linear infinite}
@keyframes rb-sp-dust{from{transform:translateY(12px)}to{transform:translateY(-22px)}}

/* ---------- Pulse: a thin brand blue heartbeat line behind the logo, a bright segment running along it ---------- */
.rb-hero.is-pl{background:linear-gradient(180deg,#0b1220 0%,#080c15 100%)}
.is-pl .pl-line{left:0;right:0;top:50%;height:70px;transform:translateY(-50%);z-index:0;
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 27%,transparent 33%,transparent 67%,#000 73%,#000 90%,transparent 100%);
 mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 27%,transparent 33%,transparent 67%,#000 73%,#000 90%,transparent 100%)}
.is-pl .pl-line svg{display:block;width:100%;height:100%}
.is-pl .pl-dim{fill:none;stroke:rgba(91,141,229,.28);stroke-width:1.4}
.is-pl .pl-run{fill:none;stroke:#7fa8f0;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
 stroke-dasharray:14 86;animation:rb-pl-run 5s linear infinite;filter:drop-shadow(0 0 4px rgba(127,168,240,.7))}
@keyframes rb-pl-run{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}

/* ---------- Frost: quiet snowfall, frosted edges and a low mountain line ---------- */
.rb-hero.is-fr{background:linear-gradient(180deg,#0a1322 0%,#0c1a2c 70%,#0f2236 100%)}
.is-fr .fr-snow{inset:-40px 0 0 0;z-index:1;opacity:.75;
 background-image:radial-gradient(1.6px 1.6px at 8% 10%,#fff 50%,transparent 52%),radial-gradient(1.2px 1.2px at 22% 40%,#fff 50%,transparent 52%),
  radial-gradient(1.8px 1.8px at 37% 20%,#fff 50%,transparent 52%),radial-gradient(1.2px 1.2px at 53% 55%,#fff 50%,transparent 52%),
  radial-gradient(1.6px 1.6px at 68% 15%,#fff 50%,transparent 52%),radial-gradient(1.2px 1.2px at 81% 45%,#fff 50%,transparent 52%),
  radial-gradient(1.8px 1.8px at 93% 25%,#fff 50%,transparent 52%);
 background-size:100% 120px;animation:rb-fr-fall 9s linear infinite}
.is-fr .fr-snow.b{opacity:.45;background-size:100% 80px;animation-duration:14s;filter:blur(.6px)}
@keyframes rb-fr-fall{from{background-position:0 0}to{background-position:30px 120px}}
.is-fr .fr-edge{inset:0;z-index:2;box-shadow:inset 0 0 60px rgba(186,214,255,.18),inset 0 -30px 50px rgba(186,214,255,.08)}
.is-fr .fr-hills{left:0;right:0;bottom:0;height:46px;z-index:2}
.is-fr .fr-hills svg{display:block;width:100%;height:100%}

/* ---------- Aurora: one slow ribbon of northern light high in the sky, a few stars ---------- */
.rb-hero.is-au{background:linear-gradient(180deg,#040a12 0%,#071423 60%,#0a1b2b 100%)}
.is-au .au-stars{inset:0;z-index:0;opacity:.7;
 background-image:radial-gradient(1px 1px at 9% 18%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 23% 62%,#dbeafe 50%,transparent 52%),
  radial-gradient(1.3px 1.3px at 41% 12%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 66% 70%,#fff 50%,transparent 52%),
  radial-gradient(1.2px 1.2px at 79% 22%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 92% 58%,#dbeafe 50%,transparent 52%)}
.is-au .au-band{left:-10%;right:-10%;top:-38%;height:70%;z-index:1;opacity:.6;filter:blur(14px);
 animation:rb-au-sway 16s ease-in-out infinite alternate}
.is-au .au-band svg{display:block;width:100%;height:100%}
@keyframes rb-au-sway{0%{transform:translateX(-3%) scaleY(.92)}100%{transform:translateX(3%) scaleY(1.06)}}

/* phones: the index shows the header for members during a season, as Halloween did */
@media (max-width:760px){
  .is-sp .sp-floor{width:300px}
  .is-pl .pl-line{-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 4%,#000 8%,transparent 12%,transparent 88%,#000 92%,#000 96%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 4%,#000 8%,transparent 12%,transparent 88%,#000 92%,#000 96%,transparent 100%)}
  .is-au .au-band{top:-30%;height:60%}
  .is-pl .pl-line{height:44px}
  .is-fr .fr-hills{height:28px}
  html.rb-mh body .rb-hero.rb-around{display:block!important}
}
@media (prefers-reduced-motion:reduce){
  .rb-around .rb-ar,.rb-around .rb-ar *{animation:none!important}
}

/* live has no rb-mobilehome.css: the index hides the hero for members on phones (UX 1.1), the season keeps it, as Halloween did */
@media (max-width:760px){
  .rb-shell:has(.rb-index):has(#rb-member-flag) > .rb-hero.rb-around,.rb-shell.rb-page-index.rb-is-member > .rb-hero.rb-around{display:block}
}