/* */

:root{ --hud-gold:#E8B649; --hud-gold-hi:#FFE36B; --hud-gold-lo:#8A5F0B; --hud-glass:rgba(8,46,52,.92); --hud-glass2:rgba(4,24,28,.96);
       --orb-red:#C8202E; --orb-blue:#1E5FD0; }

/* corner filigree (SVG, gold) reused on framed panels */
body .hud-corners, body .rc-chip, body .rk-p.r1, body .ev-card, body .panel, body .m-wallet{position:relative}
body .ev-card::before, body .panel::before, body .m-wallet::before, body .rk-p.r1::before{
  content:""; position:absolute; inset:-1px; pointer-events:none; border-radius:inherit;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26'%3E%3Cpath d='M2 24V9Q2 2 9 2h15' fill='none' stroke='%23C9982F' stroke-width='2'/%3E%3Cpath d='M6 20v-8q0-6 6-6h8' fill='none' stroke='%23E8B649' stroke-width='1'/%3E%3Ccircle cx='6' cy='6' r='2.2' fill='%23FFE36B'/%3E%3C/svg%3E") top left/26px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26'%3E%3Cg transform='scale(-1 1) translate(-26 0)'%3E%3Cpath d='M2 24V9Q2 2 9 2h15' fill='none' stroke='%23C9982F' stroke-width='2'/%3E%3Cpath d='M6 20v-8q0-6 6-6h8' fill='none' stroke='%23E8B649' stroke-width='1'/%3E%3Ccircle cx='6' cy='6' r='2.2' fill='%23FFE36B'/%3E%3C/g%3E%3C/svg%3E") top right/26px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26'%3E%3Cg transform='scale(1 -1) translate(0 -26)'%3E%3Cpath d='M2 24V9Q2 2 9 2h15' fill='none' stroke='%23C9982F' stroke-width='2'/%3E%3Cpath d='M6 20v-8q0-6 6-6h8' fill='none' stroke='%23E8B649' stroke-width='1'/%3E%3Ccircle cx='6' cy='6' r='2.2' fill='%23FFE36B'/%3E%3C/g%3E%3C/svg%3E") bottom left/26px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26'%3E%3Cg transform='rotate(180 13 13)'%3E%3Cpath d='M2 24V9Q2 2 9 2h15' fill='none' stroke='%23C9982F' stroke-width='2'/%3E%3Cpath d='M6 20v-8q0-6 6-6h8' fill='none' stroke='%23E8B649' stroke-width='1'/%3E%3Ccircle cx='6' cy='6' r='2.2' fill='%23FFE36B'/%3E%3C/g%3E%3C/svg%3E") bottom right/26px no-repeat;
}

/* NAV = the HUD bar: deep-teal glass with a double gold rule, crest in a round gold medallion */
body .nav{background:linear-gradient(180deg,var(--hud-glass),var(--hud-glass2)) !important;
  box-shadow:inset 0 -1px 0 var(--hud-gold), inset 0 -3px 0 rgba(4,24,28,.9), inset 0 -4px 0 var(--hud-gold-lo), 0 8px 24px rgba(4,24,28,.35) !important}
body .nav .brand img, body footer .brand img{border-radius:50%;padding:3px;background:radial-gradient(circle,#0F6E6B,#062a2e 70%);
  box-shadow:0 0 0 2px var(--hud-gold), 0 0 0 4px var(--hud-glass2), 0 0 0 5px var(--hud-gold-lo), 0 4px 14px rgba(0,0,0,.45)}
body .navlinks a{position:relative}
body .navlinks a[aria-current=page]::after, body .navlinks a[style*="gold3"]::after{content:"";position:absolute;left:50%;bottom:-9px;width:7px;height:7px;
  transform:translateX(-50%) rotate(45deg);background:var(--hud-gold-hi);box-shadow:0 0 8px rgba(255,227,107,.8)}

/* primary buttons = HUD action-button gold (bevel + inner rim) */
body .nav .small-btn.primary, body .btn.primary, body .btn-play{border-radius:10px !important;
  box-shadow:inset 0 0 0 1px rgba(255,248,231,.55), inset 0 -3px 0 rgba(127,90,26,.5), 0 0 0 1px var(--hud-gold-lo), 0 4px 14px rgba(184,134,11,.35) !important}

/* HC balance chip = the HUD coin medallion */
body .rc-chip b{box-shadow:0 0 0 2px var(--hud-gold-lo), 0 0 8px rgba(255,227,107,.5)}

/* quest-panel headers: section kickers get a teal glass tab with gold rule, like the HUD quest tracker title */
body main .section-head .kicker{display:inline-block;padding:5px 14px 5px 10px;border-radius:8px 8px 0 0;
  background:linear-gradient(180deg,var(--hud-glass),var(--hud-glass2));color:var(--hud-gold-hi) !important;
  box-shadow:inset 0 -2px 0 var(--hud-gold)}

/* tier / status chips = gems */
body .rl-tag, body .cx-tag, body .ev-live{border-radius:999px !important}
body .rk-p .medal{box-shadow:0 0 0 2px var(--hud-gold-lo), 0 0 0 4px rgba(255,241,214,.9), 0 0 0 5px var(--hud-gold), 0 4px 10px rgba(0,0,0,.35) !important}

/* stat counters on /realms = HUD orbs (red/blue glass with gold rim), alternating */
body .rl-stats > *{border-radius:18px !important}
body .rl-stats > *:nth-child(odd) b, body .rl-stats > *:nth-child(odd) strong{color:var(--orb-red) !important}
body .rl-stats > *:nth-child(even) b, body .rl-stats > *:nth-child(even) strong{color:var(--orb-blue) !important}

/* footer = HUD bottom bar with the winged caduceus crest centred on the top rule (like the action-bar crest) */
body footer{box-shadow:inset 0 1px 0 var(--hud-gold), inset 0 3px 0 rgba(4,24,28,.9), inset 0 4px 0 var(--hud-gold-lo) !important;
  background:linear-gradient(180deg,var(--hud-glass),var(--hud-glass2)) !important}
body footer::after{content:"";position:absolute;left:50%;top:-26px;width:52px;height:52px;transform:translateX(-50%);pointer-events:none;z-index:2;border-radius:50%;
  background:url("/assets/brand/badge-128.png") center/40px 40px no-repeat, radial-gradient(circle,#0F6E6B,#062a2e 70%);
  box-shadow:0 0 0 2px var(--hud-gold), 0 0 0 4px var(--hud-glass2), 0 0 0 5px var(--hud-gold-lo), 0 4px 14px rgba(0,0,0,.45)}

/* hero "Realms" wordmark on cream: deeper gold so it reads (was washed out) */
body h1 .gold, body .rl-hero h1 .gold{background:linear-gradient(180deg,#E3A91A 0%,#B8860B 55%,#7F5A1A 100%) !important;-webkit-background-clip:text !important;background-clip:text !important;color:transparent !important}
