/* Mythbound: Shiny black and gold frame. A display option (Settings), not an unlock.
   Add shiny-gold to the .card root. Adapted from the faction-quest pack (CSS baseline 26c4b9f)
   to the current compact card: stats sit on the art, the banner is hidden, and ATK/DEF keep
   --red / --blue. Loads after frames.css so a shiny card wins the frame colors.
   One faction-agnostic frame: black lacquer / onyx panels with polished gold trim, plus a bright gold light that
   travels round and round the outer border ring (a conic-gradient on the border band, angle animated via @property).
   Nothing is drawn outside the card: no box-shadow halo, no glow, no particles. The art image is never touched;
   only the art window's 2px frame line is recolored gold, and the art keeps its exact size (see the margins below).
   Stacks with an element frame (el-<element>): the shiny frame wins on every color and the element frame's
   textures, corner ornaments and outer glow are switched off; the element still reads in the banner ("STORM").
   Selectors carry [class] so they outrank the element-frame rules (frames.css) without !important. */

@property --sg-a{syntax:"<angle>";inherits:false;initial-value:0deg}

.card.shiny-gold{
  /* palette */
  --sg-gold:linear-gradient(135deg,#3f2906 0%,#8a5f17 9%,#d2a646 19%,#f0d27e 24%,#c3923a 31%,#6e4a10 44%,#a4772a 55%,#dcb45a 66%,#f2d683 70%,#b0822f 78%,#5f400d 90%,#352304 100%);
  --sg-gold-h:linear-gradient(90deg,#5c3d0c,#b8862e 18%,#f6dc8c 42%,#fff6cf 50%,#f6dc8c 58%,#b8862e 82%,#5c3d0c);
  --sg-lacquer:linear-gradient(180deg,#ffffff1c 0,#ffffff06 38%,#0000 52%),linear-gradient(180deg,#2a2621 0%,#12100e 46%,#070606 100%);
  --sg-onyx:linear-gradient(180deg,#171512 0%,#0d0c0b 55%,#090807 100%);
  --sg-text:#f7e7b4; --sg-text2:#f2e9d6; --sg-kw:#f0c95e;
  --sg-lap:2.6s;
  /* the frame: transparent border painted by three background layers (inner black / travelling light / gold) */
  border:4px solid transparent;
  background:
    linear-gradient(#0b0a09,#0b0a09) padding-box,
    conic-gradient(from var(--sg-a),
      #ffd86a00 0deg,#ffd86a00 280deg,#ffc94a30 308deg,#ffd56a80 328deg,#ffe28ccc 342deg,#fff0b0 350deg,#fff9e0 355deg,#ffffff 358.5deg,#ffd86a00 360deg) border-box,
    var(--sg-gold) border-box;
  animation:sg-lap var(--sg-lap) linear infinite;
}
@keyframes sg-lap{to{--sg-a:360deg}}
.card.shiny-gold.lg{border-width:6px}
.card.shiny-gold[class]{padding:0}

/* inner double keyline just inside the gold ring (replaces the faction ornament band on ::before) */
/* (large cards only: on compact cards a 2-line name sits right under the top edge, so a keyline there would clip it) */
.card.shiny-gold[class]::before{background:none;box-shadow:none}
.card.shiny-gold.lg[class]::before{border-radius:4px;
  box-shadow:inset 0 0 0 1px #000,inset 0 0 0 1.6px #f3d47ccc,inset 0 0 0 2.4px #3a2706}

/* header: black lacquer, gold-leaf rule underneath, cream-gold name */
.card.shiny-gold[class] .hd{background:var(--sg-lacquer) padding-box,var(--sg-gold-h) border-box;
  border-bottom:2px solid transparent;color:var(--sg-text);text-shadow:0 1px 1px #000,0 0 1px #000;margin:0}
.card.shiny-gold[class] .hd::after{content:none}
.card.shiny-gold[class] .nm{color:var(--sg-text)}
.card.shiny-gold[class] .hd .emb{box-shadow:0 0 0 1px #000,0 0 0 2px #e2bb5f;border-color:#120d06}
.card.shiny-gold[class] .gem{border-color:#f1d27e;box-shadow:0 0 0 1px #000}
/* cost: a polished gold coin with a black number */
.card.shiny-gold[class] .cost{color:#1a1105;text-shadow:0 1px 0 #fff5c866;border:1.5px solid #1a1206;
  background:radial-gradient(circle at 34% 28%,#fffbe2 0,#f8df8e 22%,#d9a943 48%,#9a6a1c 78%,#5e3f0b 100%);
  box-shadow:0 0 0 1px #e9c66a,inset 0 -1px 1px #3d280688}

/* art window: same size as default (wider border is cancelled by a smaller margin); only its 2px edge turns gold */
.card.shiny-gold[class] .art{margin:2px;border:2px solid transparent;
  background:radial-gradient(ellipse at 50% 38%,color-mix(in srgb,var(--c1) 55%,#fff) 0%,var(--c1) 58%,color-mix(in srgb,var(--c3) 70%,#000) 135%) padding-box,var(--sg-gold) border-box;
  box-shadow:0 0 0 1px #000;position:relative;z-index:auto}
.card.shiny-gold.lg[class] .art{margin:3px 2px 4px}
.card.shiny-gold.el-frost[class] .art{margin-top:2px}.card.shiny-gold.lg.el-frost[class] .art{margin-top:4px}
.card.shiny-gold[class] .hd::before{content:none}

/* banner (large card): onyx band between gold rules, a small gold lozenge in the middle */
.card.shiny-gold[class] .banner{position:relative;margin:0;background:var(--sg-onyx) padding-box,var(--sg-gold-h) border-box;
  border-top:1px solid transparent;border-bottom:1px solid transparent;color:#e9c873;text-shadow:0 1px 1px #000}

/* rules text: cream on onyx, gold keywords, a fine gold hairline */
.card.shiny-gold[class] .tb{background:var(--sg-onyx);color:var(--sg-text2);box-shadow:inset 0 0 0 1px #c99a3f66;margin:0 2px;border-radius:2px}
.card.shiny-gold.lg[class] .tb{margin:0;border-radius:0;box-shadow:inset 0 1px 0 #c99a3f55}
.card.shiny-gold[class] .tb .kw{color:var(--sg-kw)}
.card.shiny-gold[class] .tb.clip::after{background:linear-gradient(90deg,#0b0a0900,#0b0a09 45%);color:var(--sg-kw)}

/* footer + stats: black plate with gold rules. ATK/DEF keep the game's red/blue (players read them by colour):
   the badge keeps the normal card's light fill (#fbf7f0) for contrast, framed by an inset gold ring + black outer line.
   Colours are the exact style.css values: --red #9e2b25, --blue #2f5f8a, buff #1f6b33, debuff/hurt #b8460f. */
.card.shiny-gold[class] .ft{background:var(--sg-lacquer) padding-box,var(--sg-gold-h) border-box;border-top:1px solid transparent;margin:0;position:relative}
.card.shiny-gold[class] .ft::after{content:none}
.card.shiny-gold.lg[class] .ft:not(.nc)::before{content:"";position:absolute;left:50%;top:50%;width:46px;height:9px;margin:-4.5px 0 0 -23px;pointer-events:none;
  background:radial-gradient(circle,#f6dc8c 0 1.6px,#0000 2.1px) center/9px 9px no-repeat,
    linear-gradient(90deg,#0000,#d8a943 30%,#fff2c0 50%,#d8a943 70%,#0000) center/100% 1px no-repeat}
.card.shiny-gold:not(.lg)[class] .ft{background:none;border-top:0;margin:-21px 5px 5px}
.card.shiny-gold[class] .ft .badge{background:linear-gradient(180deg,#fffdf7,#fbf7f0 55%,#efe6d4);text-shadow:none;
  box-shadow:inset 0 0 0 1px #d9ad4f,0 0 0 1px #000}   /* gold ring drawn inside, so the card edge never clips it */
.card.shiny-gold.lg[class] .ft .badge{position:relative;z-index:3;box-shadow:inset 0 0 0 1.5px #d9ad4f,inset 0 0 0 2px #fff6d6,0 0 0 1px #000}
.card.shiny-gold[class] .ft .badge{position:relative;z-index:5}
.card.shiny-gold[class] .cost{position:relative;z-index:4}
.card.shiny-gold[class] .ft .badge.a{color:var(--red)}.card.shiny-gold[class] .ft .badge.d{color:var(--blue)}
.card.shiny-gold[class] .ft .badge small{color:inherit}
.card.shiny-gold[class] .ft .badge.a.up,.card.shiny-gold[class] .ft .badge.d.up{color:#1f6b33}
.card.shiny-gold[class] .ft .badge.a.down,.card.shiny-gold[class] .ft .badge.d.down,.card.shiny-gold[class] .ft .badge.d.hurt,.card.shiny-gold[class] .ft .badge.d.hurt.up{color:#b8460f}
.card.shiny-gold[class] .ft .ty,.card.shiny-gold[class] .ft .sup{color:var(--sg-text)}
.card.shiny-gold:not(.lg)[class] .ft .sup,.card.shiny-gold:not(.lg)[class] .ft .ty,.card.shiny-gold:not(.lg)[class] .ft .pill{background:#0c0b0a;color:var(--sg-text);box-shadow:0 0 0 1px #e2bb5f}

/* stacked with an element frame: the black and gold frame wins; the element glow and corners drop */
.card.shiny-gold:is(.el-storm,.el-frost,.el-verdant,.el-jade,.el-sun,.el-spirit,.el-shade){--el-glow:#0000;box-shadow:var(--cs,0 2px 4px #0003)}

/* the light parks at the top-right when motion is reduced, effects are reduced or off, or the page asks for less motion */
@media (prefers-reduced-motion:reduce){.card.shiny-gold{animation:none;--sg-a:40deg}}
body.fx-reduced .card.shiny-gold,body.fx-off .card.shiny-gold,body.reduced-motion .card.shiny-gold{animation:none;--sg-a:40deg}