
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/EBGaramond-Regular.woff2) format('woff2')}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/EBGaramond-Italic.woff2) format('woff2')}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/EBGaramond-SemiBold.woff2) format('woff2')}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:600;font-display:swap;src:url(fonts/EBGaramond-SemiBoldItalic.woff2) format('woff2')}

:root{
  --marine:#070B18;  --ton:#8B1822;  --petrol:#79ADC8;  --smaragd:#3E8C72;  --indigo:#6A72C4;  --ocker:#C2A36B;  --weiss:#EDE8DC;
  --rib1:color-mix(in srgb,var(--indigo) 82%,var(--weiss));  --rib2:color-mix(in srgb,var(--petrol) 74%,var(--weiss));  --rib3:color-mix(in srgb,var(--smaragd) 88%,var(--weiss));  --rib4:color-mix(in srgb,var(--ton) 74%,var(--weiss));  --rib5:var(--ocker);
  --silber:color-mix(in srgb,var(--weiss) 62%,var(--marine));
  --silberdunkel:color-mix(in srgb,var(--silber) 40%,var(--marine));
  --gold:color-mix(in srgb,var(--ocker) 72%,var(--weiss));
  --bronze:var(--ocker);
  --gruen:var(--smaragd);  --ab:var(--ton);  --holz:var(--ton);
  --flieder:color-mix(in srgb,var(--indigo) 82%,var(--weiss));
  --glow-a:color-mix(in srgb,color-mix(in srgb,var(--indigo) 52%,var(--smaragd)) 62%,var(--weiss));
  --glow-b:var(--flieder);  --wiki:var(--rib3);
  --alp:var(--rib5);
  --grau:color-mix(in srgb,color-mix(in srgb,var(--marine) 88%,var(--weiss)) 78%,transparent);
  --card-solid:color-mix(in srgb,color-mix(in srgb,var(--marine) 88%,var(--weiss)) 78%,var(--marine));  --bg:var(--marine); --card:var(--grau); --ink:var(--weiss); --muted:var(--silber);
  --line:color-mix(in srgb,var(--silber) 42%,var(--marine));

  --serif:'EB Garamond',Georgia,serif;
  --sans:'EB Garamond',Georgia,serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,'Liberation Mono',monospace;
  --title:var(--serif);
  --body:var(--serif);

  --r:10px; --r-xs:6px; --r-sm:9px; --r-md:11px; --r-lg:13px; --pill:999px;
  --ease:cubic-bezier(.2,.75,.2,1);
  --w:960px; --wt:64ch; --wide:min(1120px,90vw);

  --chart-grid:color-mix(in srgb,var(--silber) 28%,transparent);
  --chart-tick:.66rem;
  --title-glow:color-mix(in srgb,var(--silber) 1.4%,transparent);
}

#team{--accent:var(--rib1)}
#news{--accent:var(--rib2)}
#trade{--accent:var(--rib3)}
#world{--accent:var(--rib4)}
#impressum,#datenschutz{--accent:var(--rib1)}

.sol-toggle label[for="sol-r-markets"],.sol-p-markets{--accent:var(--rib1)}
.sol-toggle label[for="sol-r-articles"],.sol-p-articles{--accent:var(--rib2)}
.sol-toggle label[for="sol-r-services"],.sol-p-services{--accent:var(--rib3)}

nav.tabs button[data-t="team"]{--accent:var(--rib1)}
nav.tabs button[data-t="news"]{--accent:var(--rib2)}
nav.tabs button[data-t="trade"]{--accent:var(--rib3)}
nav.tabs button[data-t="world"]{--accent:var(--rib4)}

.menu button:nth-child(1){--accent:var(--rib1)}
.menu button:nth-child(2){--accent:var(--rib2)}
.menu button:nth-child(3){--accent:var(--rib3)}
.menu button:nth-child(4){--accent:var(--rib4)}
.menu button:nth-child(5){--accent:var(--rib5)}

.frame{--fcol:var(--pcol,var(--accent,var(--silber)));position:relative;border:1px solid transparent;border-radius:var(--r-lg);
  --fbg:linear-gradient(155deg,color-mix(in srgb,var(--marine) 85%,#000) 0%,#000 55%,color-mix(in srgb,var(--marine) 80%,#000) 100%);
  background:radial-gradient(135% 95% at 50% -12%,color-mix(in srgb,var(--fcol) 11%,transparent),transparent 62%) padding-box,radial-gradient(110% 120% at 50% 118%,color-mix(in srgb,var(--fcol) 6%,transparent),transparent 58%) padding-box,var(--fbg) padding-box,linear-gradient(100deg,color-mix(in srgb,var(--silber) 46%,transparent) 0%,color-mix(in srgb,var(--silber) 72%,var(--weiss)) 22%,var(--weiss) 32%,color-mix(in srgb,var(--silber) 70%,var(--weiss)) 42%,color-mix(in srgb,var(--silber) 44%,transparent) 64%,color-mix(in srgb,var(--silber) 66%,transparent) 100%) border-box;background-size:auto,auto,auto,300% 100%;background-position:0 0,0 0,0 0,34% 0;
  box-shadow:0 34px 70px -46px rgba(0,0,0,.85),inset 0 1px 0 color-mix(in srgb,var(--weiss) 5%,transparent)}

.glow-pill{border:1px solid color-mix(in srgb,var(--glow-a) 42%,transparent);border-radius:100px;
  box-shadow:0 0 18px -8px color-mix(in srgb,var(--glow-a) 38%,transparent)}

