/* 23.10: shared tier materials. Gold alone uses the token medallion's champagne hue. Tier names describe achievement, never podium position.
   Opaque, bounded layers keep label contrast independent of the page beneath them. */
:root{
  --material-ink:#180B51;
  --material-ice:#F1F4FF;
  --tier-copper:#4A5068;
  --tier-silver:#8993AC;
  --tier-gold:#C3C4D8;
  --tier-diamond:#B4CBEF;
  --tier-olympian:#7C82A7;
}

:is(.seal.t1,.tier.t1,.tierc.t1,.c1,[data-tier="1"]){
  --tier-base:#3A4059;--tier-fg:#F1F4FF;--tier-edge:#707C9A;
  --tier-surface:repeating-linear-gradient(0deg,#180B511C 0 1px,transparent 1px 4px),linear-gradient(120deg,#353B53,#515C78 48%,#394159);
  --tier-rim:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23F1F4FF%22%20stroke-width%3D%221.5%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12.00%2020.00L12.00%2022.00%22%2F%3E%3Cpath%20d%3D%22M16.00%2018.93L17.00%2020.66%22%2F%3E%3Cpath%20d%3D%22M18.93%2016.00L20.66%2017.00%22%2F%3E%3Cpath%20d%3D%22M20.00%2012.00L22.00%2012.00%22%2F%3E%3Cpath%20d%3D%22M18.93%208.00L20.66%207.00%22%2F%3E%3Cpath%20d%3D%22M16.00%205.07L17.00%203.34%22%2F%3E%3Cpath%20d%3D%22M12.00%204.00L12.00%202.00%22%2F%3E%3Cpath%20d%3D%22M8.00%205.07L7.00%203.34%22%2F%3E%3Cpath%20d%3D%22M5.07%208.00L3.34%207.00%22%2F%3E%3Cpath%20d%3D%22M4.00%2012.00L2.00%2012.00%22%2F%3E%3Cpath%20d%3D%22M5.07%2016.00L3.34%2017.00%22%2F%3E%3Cpath%20d%3D%22M8.00%2018.93L7.00%2020.66%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%225%22%2F%3E%3C%2Fsvg%3E");
}

:is(.seal.t2,.tier.t2,.tierc.t2,.c2,[data-tier="2"]){
  --tier-base:#BCC5D6;--tier-fg:#180B51;--tier-edge:#69748E;
  --tier-surface:repeating-linear-gradient(0deg,#180B510A 0 1px,transparent 1px 3px),linear-gradient(110deg,#A2AEC6,#DAE1EE 44%,#AEB8CC 72%,#C8D0E1);
  --tier-rim:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23180B51%22%20stroke-width%3D%221.5%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12.00%2020.00L12.00%2022.00%22%2F%3E%3Cpath%20d%3D%22M17.66%2017.66L19.07%2019.07%22%2F%3E%3Cpath%20d%3D%22M20.00%2012.00L22.00%2012.00%22%2F%3E%3Cpath%20d%3D%22M17.66%206.34L19.07%204.93%22%2F%3E%3Cpath%20d%3D%22M12.00%204.00L12.00%202.00%22%2F%3E%3Cpath%20d%3D%22M6.34%206.34L4.93%204.93%22%2F%3E%3Cpath%20d%3D%22M4.00%2012.00L2.00%2012.00%22%2F%3E%3Cpath%20d%3D%22M6.34%2017.66L4.93%2019.07%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%225%22%2F%3E%3C%2Fsvg%3E");
}

:is(.seal.t3,.tier.t3,.tierc.t3,.c3,[data-tier="3"]){
  /* Hue 40 is sampled from brand/dexscreener/v1/logo-s2-champagne.
     Reflections change lightness, preserving that single champagne hue. */
  --tier-gold:hsl(40 32% 79%);
  --tier-base:hsl(40 26% 80%);--tier-fg:#242424;--tier-edge:hsl(40 16% 51%);
  --tier-surface:repeating-linear-gradient(38deg,#00000005 0 1px,transparent 1px 6px),repeating-linear-gradient(-38deg,#FFFFFF12 0 1px,transparent 1px 6px),linear-gradient(118deg,hsl(40 22% 64%) 0%,hsl(40 42% 88%) 17%,#FFFFFF 21%,hsl(40 29% 71%) 26%,hsl(40 32% 87%) 41%,#F9FAFF 49%,hsl(40 26% 79%) 64%,hsl(40 20% 64%) 77%,#FFFFFF 82%,hsl(40 30% 86%) 90%,hsl(40 24% 72%) 100%);
  --tier-rim:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23242424%22%20stroke-width%3D%221.5%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12.00%2018.00L12.00%2022.00%22%2F%3E%3Cpath%20d%3D%22M14.30%2017.54L15.83%2021.24%22%2F%3E%3Cpath%20d%3D%22M16.24%2016.24L19.07%2019.07%22%2F%3E%3Cpath%20d%3D%22M17.54%2014.30L21.24%2015.83%22%2F%3E%3Cpath%20d%3D%22M18.00%2012.00L22.00%2012.00%22%2F%3E%3Cpath%20d%3D%22M17.54%209.70L21.24%208.17%22%2F%3E%3Cpath%20d%3D%22M16.24%207.76L19.07%204.93%22%2F%3E%3Cpath%20d%3D%22M14.30%206.46L15.83%202.76%22%2F%3E%3Cpath%20d%3D%22M12.00%206.00L12.00%202.00%22%2F%3E%3Cpath%20d%3D%22M9.70%206.46L8.17%202.76%22%2F%3E%3Cpath%20d%3D%22M7.76%207.76L4.93%204.93%22%2F%3E%3Cpath%20d%3D%22M6.46%209.70L2.76%208.17%22%2F%3E%3Cpath%20d%3D%22M6.00%2012.00L2.00%2012.00%22%2F%3E%3Cpath%20d%3D%22M6.46%2014.30L2.76%2015.83%22%2F%3E%3Cpath%20d%3D%22M7.76%2016.24L4.93%2019.07%22%2F%3E%3Cpath%20d%3D%22M9.70%2017.54L8.17%2021.24%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%225%22%2F%3E%3C%2Fsvg%3E");
}

:is(.seal.t4,.tier.t4,.tierc.t4,.c4,[data-tier="4"]){
  --tier-base:#D9E8FF;--tier-fg:#180B51;--tier-edge:#859BC5;
  --tier-surface:conic-gradient(from 25deg at 78% 20%,#F9FCFF 0 18%,#C4D7F5 18% 30%,#E6F0FF 30% 55%,#C2D5F4 55% 68%,#F2F7FF 68% 84%,#D6E6FF 84%),linear-gradient(#EAF3FF,#D0E2FF);
  --tier-rim:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23180B51%22%20stroke-width%3D%221.5%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%202H16L22%208V16L16%2022H8L2%2016V8Z%20M12%206L14%2010L18%2012L14%2014L12%2018L10%2014L6%2012L10%2010Z%22%2F%3E%3C%2Fsvg%3E");
}

:is(.seal.t5,.tier.t5,.tierc.t5,.c5,[data-tier="5"]){
  --tier-base:#E1E7FC;--tier-fg:#180B51;--tier-edge:#7C82A7;
  --tier-surface:radial-gradient(ellipse at 70% 0%,#FFFFFF,transparent 48%),linear-gradient(135deg,#D4DBF2,#F1F4FF 45%,#CCD7F2);
  --tier-rim:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23180B51%22%20stroke-width%3D%221.5%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%202H16L17%204L20%204V7L22%208V16L20%2017V20H17L16%2022H8L7%2020H4V17L2%2016V8L4%207V4H7Z%20M12%206L13.7%2010L18%2010.4L14.8%2013.3L15.6%2018L12%2015.6L8.4%2018L9.2%2013.3L6%2010.4L10.3%2010Z%22%2F%3E%3C%2Fsvg%3E");
}

/* All five labels have the same chip structure in the table, seat header and seals. */
html body :is(#top .tierc,#tab-record .seal .tier,.seal .tier,.qh .cta,.ch2-sheet-cta):is(.t1,.t2,.t3,.t4,.t5,[data-tier]){
  display:inline-flex;align-items:center;gap:5px;width:fit-content;max-width:100%;
  padding:4px 7px;border:1px solid var(--tier-edge);border-radius:2px;
  background-color:var(--tier-base);background-image:var(--tier-surface);
  color:var(--tier-fg);font-size:12px;line-height:1.35;letter-spacing:0;text-transform:none;
  text-shadow:none;box-shadow:inset 0 1px 0 #FFFFFF55;
}
html body :is(#top .tierc,#tab-record .seal .tier,.seal .tier):is(.t1,.t2,.t3,.t4,.t5) i{
  display:block;flex:0 0 14px;width:14px;height:14px;border:0;border-radius:0;
  background:var(--tier-rim) center/contain no-repeat;box-shadow:none;
}
html body :is(.qh .cta,.ch2-sheet-cta)[data-tier]{padding:10px 12px;font-size:15px}
html body :is(#top .strip2,#top .goal) i.on{
  background-color:var(--tier-base);background-image:var(--tier-surface);
  border:1px solid var(--tier-edge);box-sizing:border-box;
}
/* Material belongs to the plate, so Gold remains polished white gold in any rank. */
html body #top .plq[data-tier]{
  color:var(--tier-fg);background-color:var(--tier-base);background-image:var(--tier-surface);
  border:1px solid var(--tier-edge);isolation:isolate;
}
html body #top .plq[data-tier] .mat{filter:grayscale(1);opacity:.08;mix-blend-mode:luminosity}
html body #top .plq[data-tier="2"] .mat{opacity:.32}
html body #top .plq[data-tier]::before{
  content:"";position:absolute;inset:6px;border:1px solid var(--tier-edge);border-radius:1px;pointer-events:none;
}
/* Two engraved rules and narrow white reflections distinguish Gold from brushed steel. */
html body #top .plq[data-tier="3"]{
  --ink:#242424;--ink-24:#2424243D;
  box-shadow:inset 0 1px 0 #FFFFFF,inset 0 -1px 0 hsl(40 16% 51%),0 10px 24px -14px #24242480;
}
html body #top .plq[data-tier="3"]::before{
  inset:6px;border:3px double var(--tier-edge);box-shadow:0 1px 0 #FFFFFFB3,inset 0 1px 0 #FFFFFFB3;
}
html body #top .plq[data-tier="3"] .strip2 i{border-color:#8D8D8D;border-radius:0}
html body #top .plq[data-tier="3"] .mat{opacity:.035}
html body #top .plq[data-tier="3"] .sheen{opacity:1;background:none}
html body #top .plq[data-tier="3"] .sheen::after{
  content:"";position:absolute;inset:0;transform:translateX(-110%);opacity:0;
  background:linear-gradient(115deg,transparent 40%,#FFFFFF1A 46%,#FFFFFFB3 49%,#FFFFFF33 52%,transparent 58%);
  animation:gold-glint 1600ms linear 1;
}
@keyframes gold-glint{
  0%{transform:translateX(-110%);opacity:0}
  12%,82%{opacity:1}
  100%{transform:translateX(110%);opacity:0}
}
@media(prefers-reduced-motion:reduce){
  html body #top .plq[data-tier="3"] .sheen::after{animation:none}
}
/* Small Gold labels keep an ice highlight and uninterrupted graphite lettering. */
html body :is(#top .tierc.t3,#tab-record .seal .tier.t3,.seal .tier.t3,.qh .cta[data-tier="3"],.ch2-sheet-cta[data-tier="3"]){
  background-image:linear-gradient(112deg,hsl(40 32% 79%),#F9FAFF 48%,hsl(40 37% 85%));
  box-shadow:inset 0 1px 0 #FFFFFF,inset 0 -1px 0 #0000001A;
}
html body :is(#tab-record .seal.t3,.seal.t3) .ring{border:3px double var(--tier-edge)}
html body #top .plq[data-tier="5"]::before{border:3px double #7C82A7}
html body #top .plq[data-tier="5"]::after{
  content:"";position:absolute;top:10px;right:12px;width:28px;height:28px;background:var(--tier-rim) center/contain no-repeat;
}
html body #top .plq[data-tier="4"]::after{
  content:"";position:absolute;top:10px;right:12px;width:24px;height:24px;background:var(--tier-rim) center/contain no-repeat;
}
html body #top .plq[data-tier] :is(.num,.nm,.held,.held b,.streak){color:var(--tier-fg);text-shadow:none}
html body #top .plq[data-tier="1"] :is(.num,.nm,.held b){text-shadow:0 1px 0 #180B51}
html body #top .plq[data-tier] .streak{border-color:var(--tier-edge)}
html body #top .plq[data-tier] .sheen{
  position:absolute;inset:0;pointer-events:none;opacity:.16;
  background:radial-gradient(ellipse at var(--light-x,30%) var(--light-y,20%),#FFFFFF,transparent 60%);
}
html body #top .plq[data-tier] .tierc{margin-top:8px}
html body #top .plq[data-tier] .strip2 i:not(.on){border-color:var(--tier-edge)}
/* Existing engraved seal drawings retain ticks, dashes, rays, octagon and star. */
html body :is(#tab-record .seal,.seal):is(.t1,.t2,.t3,.t4,.t5) .ring{border-color:var(--tier-edge);opacity:.8}
@media(max-width:640px){
  html body #top .hd,html body #top .row{grid-template-columns:32px minmax(0,1fr) 62px 112px;column-gap:8px}
  html body #top .tierc:is(.t1,.t2,.t3,.t4,.t5){font-size:12px;padding:4px 5px;gap:4px}
  html body :is(#tab-record .seal .tier,.seal .tier):is(.t1,.t2,.t3,.t4,.t5){font-size:12px;padding:3px 4px;white-space:nowrap}
}

html body :is(#tab-record .seal,.seal) .tier-count{display:block;margin-top:4px;font:12px/1.4 var(--mono);color:var(--ink);overflow-wrap:anywhere}
html.ch2 .qh .mark img{filter:grayscale(1)}
/* Neutralize the legacy warm flecks in the existing silver medallion asset. */
html.ch2 .qh .mark::before,html.ch2 .qsheet .qh-avatar,
html.ch2 footer.qf .qf-lockup img:first-child,
html.ch2 footer.qf .end>span.qf-signature:first-child::before{filter:grayscale(1)}
