:root {
  --az-bg: #06101d;
  --az-bg-2: #07172a;
  --az-panel: rgba(8, 28, 52, .94);
  --az-panel-2: rgba(11, 42, 73, .96);
  --az-panel-3: rgba(14, 56, 96, .9);
  --az-ink: #eff8ff;
  --az-muted: #a9c5df;
  --az-line: rgba(111, 203, 255, .24);
  --az-line-strong: rgba(148, 223, 255, .45);
  --az-blue: #0b67df;
  --az-blue-2: #2f8dff;
  --az-cyan: #50d4ff;
  --az-yellow: #ffd338;
  --az-pink: #ff8fd2;
  --az-radius: 12px;
  --az-radius-lg: 18px;
  --az-shadow: 0 14px 34px rgba(0, 0, 0, .34);
  --az-wrap: min(94vw, 1680px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.az-body {
  margin: 0;
  font-family: Inter, Segoe UI, Roboto, Arial, sans-serif;
  background:
    radial-gradient(circle at 15% 0, rgba(21, 104, 178, .2), transparent 30vw),
    linear-gradient(180deg, #040b15 0, #071524 45%, #06101d 100%);
  color: var(--az-ink);
  font-size: 15px;
  line-height: 1.5;
}
.az-page { min-height: 100vh; overflow-x: hidden; }
.az-wrap { width: var(--az-wrap); margin: 0 auto; }
.az-page a { color: inherit; text-decoration: none; }
.az-page img { max-width: 100%; height: auto; }

/* Top line */
.az-topline {
  position: relative;
  z-index: 20;
  min-height: 42px;
  background: rgba(2, 9, 19, .96);
  border-bottom: 1px solid var(--az-line);
  font-size: 13px;
}
.az-topline-inner {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.az-headlines,
.az-top-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}
.az-headlines { overflow: hidden; white-space: nowrap; flex: 1; }
.az-headlines span {
  flex: 0 0 auto;
  background: linear-gradient(180deg, #2494ff, #0757c7);
  padding: 8px 16px;
  border-radius: 7px;
  font-weight: 900;
  box-shadow: 0 0 22px rgba(47, 142, 255, .25);
}
.az-headlines a { color: #dcefff; opacity: .95; }
.az-headlines a::before { content: '›'; color: #7bd6ff; margin-right: 12px; }
.az-top-actions { flex: 0 0 auto; }
.az-top-social .mod-menu,
.az-top-social ul {
  display: flex;
  align-items: center;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.az-top-social li { margin: 0; }
.az-top-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 4px;
  color: #d8edff;
  font-size: 12px;
  border-radius: 6px;
}
.az-top-social a:hover { background: rgba(47, 142, 255, .24); color: #fff; }
.az-login-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  border: 1px solid var(--az-line);
  border-radius: 9px;
  background: rgba(7, 24, 43, .75);
  font-weight: 700;
}
.az-login-link::before { content: '👤'; font-size: 13px; }
.az-login-link:hover { background: rgba(47, 142, 255, .18); border-color: var(--az-line-strong); }

/* Header */
.az-hero-head {
  position: relative;
  height: 260px;
  overflow: hidden;
  background:
    radial-gradient(circle at 57% 32%, rgba(43, 171, 255, .75), transparent 16%),
    linear-gradient(90deg, #041225 0%, #082751 48%, #061427 100%);
  border-bottom: 1px solid var(--az-line);
}
.az-header-bg-grid {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 70% 20%, rgba(96, 220, 255, .38), transparent 27%),
    repeating-linear-gradient(90deg, transparent 0 72px, rgba(91, 194, 255, .055) 73px 74px),
    repeating-linear-gradient(0deg, transparent 0 56px, rgba(91, 194, 255, .04) 57px 58px);
  opacity: .9;
}
.az-globe {
  position: absolute;
  right: 7vw;
  top: -122px;
  width: min(980px, 52vw);
  height: 520px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 57% 30%, #eaffff 0 2px, transparent 3px),
    radial-gradient(circle at 66% 41%, #a8ecff 0 3px, transparent 4px),
    radial-gradient(circle at 50% 54%, #66d2ff 0 2px, transparent 3px),
    radial-gradient(ellipse at 46% 72%, rgba(18, 145, 255, .86), transparent 58%),
    linear-gradient(180deg, rgba(54, 202, 255, .28), rgba(3, 28, 67, .1));
  border-bottom: 2px solid rgba(123, 224, 255, .62);
  box-shadow: 0 0 110px rgba(53, 178, 255, .72);
  opacity: .96;
}
.az-globe::before {
  content: '';
  position: absolute;
  inset: 24px;
  border-radius: 50%;
  background:
    repeating-linear-gradient(18deg, transparent 0 42px, rgba(144, 226, 255, .28) 43px 44px),
    repeating-linear-gradient(100deg, transparent 0 58px, rgba(144, 226, 255, .18) 59px 60px);
  mask-image: radial-gradient(ellipse at 50% 50%, #000 0 64%, transparent 66%);
}
.az-globe::after {
  content: '';
  position: absolute;
  left: -8%;
  right: -8%;
  top: 39%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(181, 245, 255, .85), transparent);
  box-shadow: 0 0 30px rgba(94, 220, 255, .75);
  transform: rotate(-8deg);
}
.az-cityline {
  position: absolute;
  right: 2vw;
  bottom: 0;
  width: 36vw;
  height: 105px;
  opacity: .28;
  background:
    linear-gradient(90deg, transparent 0 5%, rgba(70, 198, 255, .18) 5% 8%, transparent 8% 13%, rgba(70, 198, 255, .22) 13% 17%, transparent 17% 21%, rgba(70, 198, 255, .18) 21% 24%, transparent 24% 30%, rgba(70, 198, 255, .25) 30% 34%, transparent 34% 100%);
  filter: drop-shadow(0 0 12px rgba(77, 205, 255, .6));
}
.az-jp-mark {
  position: absolute;
  right: 34px;
  top: 38px;
  writing-mode: vertical-rl;
  color: #fff;
  font-size: 22px;
  letter-spacing: 5px;
  text-shadow: 0 0 18px #0cf;
  z-index: 2;
}
.az-jp-mark::after {
  content: '栄';
  display: inline-grid;
  place-items: center;
  margin-top: 8px;
  width: 24px;
  height: 24px;
  border: 1px solid #ff4242;
  color: #ff4242;
  font-size: 14px;
  letter-spacing: 0;
}
.az-header-grid {
  position: relative;
  z-index: 3;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 42px;
}
.az-brand { max-width: 760px; }
.az-logo {
  display: inline-block;
  font-size: clamp(46px, 4.4vw, 86px);
  font-weight: 950;
  letter-spacing: .08em;
  line-height: .9;
  color: #fff;
  text-shadow: 0 4px 26px rgba(63, 180, 255, .6);
}
.az-logo::after {
  content: '';
  display: block;
  width: 120px;
  height: 3px;
  margin-top: 18px;
  background: linear-gradient(90deg, #4fd5ff, transparent);
}
.az-subtitle {
  margin-top: 12px;
  font-size: clamp(14px, 1.1vw, 22px);
  letter-spacing: .62em;
  font-weight: 900;
  color: #fff;
}
.az-tagline {
  margin-top: 16px;
  letter-spacing: .34em;
  color: #d6ecff;
  font-size: clamp(11px, .76vw, 14px);
}
.az-header-mods { min-width: min(360px, 26vw); }
.az-search-fallback,
.az-header-mods form { display: flex; gap: 8px; justify-content: flex-end; }
.az-header-mods input[type='search'],
.az-header-mods input[type='text'] {
  width: 100%;
  max-width: 330px;
  background: rgba(0, 10, 30, .68);
  border: 1px solid var(--az-line);
  border-radius: 14px;
  color: #fff;
  padding: 12px 16px;
}
.az-header-mods button,
.az-search-fallback button {
  border: 1px solid var(--az-line);
  border-radius: 12px;
  background: rgba(8, 30, 58, .9);
  color: #fff;
  padding: 0 14px;
}

/* Navigation */
.az-nav {
  position: sticky;
  top: 0;
  z-index: 18;
  background: linear-gradient(180deg, #0d6ddd 0%, #052b68 92%);
  box-shadow: 0 8px 22px rgba(0, 0, 0, .4);
}
.az-nav-shell {
  display: flex;
  align-items: stretch;
  min-height: 58px;
}
.az-mobile-toggle { display: none; }
.az-nav-inner { min-width: 0; flex: 1; }
.az-nav .mod-menu,
.az-nav ul {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  min-height: 58px;
}
.az-nav .mod-menu > li,
.az-nav ul > li { display: flex; align-items: stretch; }
.az-nav .mod-menu > li > a,
.az-nav .mod-menu > li > span,
.az-nav ul > li > a,
.az-nav ul > li > span {
  display: flex;
  align-items: center;
  padding: 0 20px;
  font-weight: 900;
  text-transform: uppercase;
  font-size: 13px;
  border-left: 1px solid rgba(255, 255, 255, .08);
  letter-spacing: .02em;
}
.az-nav .mod-menu a:hover,
.az-nav .mod-menu .current > a,
.az-nav ul a:hover,
.az-nav ul .current > a {
  background: linear-gradient(180deg, #2d92ff, #074db0);
}
.az-nav-search {
  display: grid;
  place-items: center;
  width: 68px;
  min-height: 58px;
  border-left: 1px solid rgba(255,255,255,.12);
  border-right: 1px solid rgba(255,255,255,.12);
  font-size: 26px;
}
.az-nav-search:hover { background: rgba(0, 10, 30, .28); }

/* Ticker */
.az-breaking {
  background: #061326;
  padding: 14px 0;
  border-bottom: 1px solid var(--az-line);
}
.az-breaking-inner {
  display: flex;
  align-items: center;
  gap: 18px;
  border: 1px solid var(--az-line);
  border-radius: 12px;
  padding: 9px 12px;
  background: rgba(9, 35, 65, .9);
  box-shadow: inset 0 1px rgba(255,255,255,.04);
}
.az-breaking-label {
  flex: 0 0 auto;
  background: linear-gradient(90deg, #1476f2, #084ba5);
  padding: 10px 18px;
  border-radius: 8px;
  font-weight: 900;
  text-transform: uppercase;
  box-shadow: 0 0 18px rgba(47,142,255,.22);
}
.az-ticker {
  min-width: 0;
  display: flex;
  gap: 32px;
  overflow: hidden;
  white-space: nowrap;
  color: #e6f4ff;
}
.az-ticker span::before,
.az-ticker p::before { content: '›'; color: #79d3ff; margin-right: 16px; }
.az-ticker p { display: inline; margin: 0; }

/* Page layout */
.az-site-main { padding: 18px 0 0; }
.az-breadcrumbs {
  color: var(--az-muted);
  font-size: 12px;
  margin: 0 0 16px;
}
.az-breadcrumbs ol,
.az-breadcrumbs ul { margin: 0; padding-left: 18px; }
.az-layout {
  display: grid;
  grid-template-columns: 270px minmax(0, 1fr) 320px;
  gap: 20px;
  align-items: start;
}
.az-layout.no-left { grid-template-columns: minmax(0, 1fr) 320px; }
.az-layout.no-right { grid-template-columns: 270px minmax(0, 1fr); }
.az-layout.no-left.no-right { grid-template-columns: minmax(0, 1fr); }
.az-main { min-width: 0; }
.az-sidebar { min-width: 0; }

/* Panels and modules */
.az-card,
.az-feature-hero,
.az-main .blog-item,
.az-main .com-content-category-blog__item,
.az-main .latestnews li,
.az-main .mod-articlesnews__item,
.az-main .newsflash-item {
  border: 1px solid var(--az-line);
  border-radius: var(--az-radius);
  background: linear-gradient(180deg, rgba(13, 40, 70, .96), rgba(7, 24, 43, .98));
  box-shadow: var(--az-shadow);
  overflow: hidden;
}
.az-card { margin-bottom: 18px; }
.az-card h3,
.az-card .card-header {
  margin: 0;
  padding: 13px 16px;
  text-transform: uppercase;
  font-size: 15px;
  letter-spacing: .02em;
  background: linear-gradient(180deg, #113e6f, #071d38);
  border-bottom: 1px solid var(--az-line);
}
.az-module-content,
.az-card > p,
.az-card > ol,
.az-card > ul { padding: 16px; }
.az-card ul,
.az-card ol { margin: 0; }
.az-card li { margin: 0 0 10px; }
.az-card label { display: block; margin: 8px 16px; color: #eaf6ff; }
.az-card .mod-menu,
.az-card ul.mod-menu { list-style: none; padding: 12px 16px; }
.az-card .mod-menu li { margin: 0; border-bottom: 1px solid rgba(255,255,255,.07); }
.az-card .mod-menu a { display: block; padding: 9px 0; color: #e7f5ff; }
.az-card .mod-menu a:hover { color: #77d8ff; }

/* Hero */
.az-feature-hero {
  position: relative;
  min-height: 430px;
  margin-bottom: 18px;
  padding: 78px 48px;
  color: #fff;
  background:
    radial-gradient(circle at 76% 36%, rgba(116, 223, 255, .65), transparent 18%),
    radial-gradient(circle at 82% 64%, rgba(255, 141, 205, .28), transparent 10%),
    linear-gradient(100deg, rgba(3, 18, 38, .98) 0%, rgba(5, 30, 64, .86) 47%, rgba(7, 48, 88, .58) 100%),
    repeating-linear-gradient(90deg, rgba(100, 205, 255, .08) 0 1px, transparent 1px 34px),
    repeating-linear-gradient(0deg, rgba(100, 205, 255, .06) 0 1px, transparent 1px 28px);
}
.az-feature-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 83% 20%, rgba(255, 178, 224, .8) 0 2px, transparent 3px),
    radial-gradient(circle at 88% 28%, rgba(255, 178, 224, .5) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 70%, rgba(255, 178, 224, .45) 0 2px, transparent 3px);
  opacity: .8;
  pointer-events: none;
}
.az-feature-hero::after {
  content: '';
  position: absolute;
  right: 5%;
  bottom: 0;
  width: min(430px, 42%);
  height: 390px;
  background:
    radial-gradient(circle at 50% 24%, #bdf5ff 0 2px, transparent 3px),
    radial-gradient(circle at 54% 20%, #bdeeff 0 48px, #7abfff 49px 52px, transparent 54px),
    linear-gradient(145deg, transparent 0 36%, rgba(170,229,255,.25) 37% 52%, transparent 53%),
    radial-gradient(ellipse at 50% 80%, rgba(12,83,135,.86), transparent 66%);
  filter: drop-shadow(0 0 38px rgba(71, 200, 255, .75));
  opacity: .9;
}
.az-feature-copy,
.az-badge,
.az-dots { position: relative; z-index: 2; }
.az-badge {
  display: inline-block;
  background: linear-gradient(180deg, #2391ff, #0757c7);
  padding: 8px 13px;
  border-radius: 7px;
  text-transform: uppercase;
  font-weight: 900;
  font-size: 12px;
}
.az-feature-hero h1 {
  font-size: clamp(38px, 3.5vw, 68px);
  margin: 28px 0 4px;
  max-width: 680px;
  line-height: 1.02;
}
.az-feature-hero h2 {
  font-size: clamp(22px, 1.7vw, 32px);
  font-weight: 500;
  margin: 0 0 14px;
  color: #d7eeff;
}
.az-feature-hero p { max-width: 580px; font-size: 18px; }
.az-sakura {
  position: absolute;
  right: 24px;
  top: 22px;
  z-index: 3;
  color: var(--az-pink);
  font-size: 28px;
  text-shadow: 0 0 20px var(--az-pink);
}
.az-dots {
  position: absolute;
  bottom: 26px;
  left: 50%;
  display: flex;
  gap: 9px;
  transform: translateX(-50%);
}
.az-dots i {
  width: 10px;
  height: 10px;
  background: #d8edff;
  border-radius: 50%;
  opacity: .9;
}

/* Buttons */
.az-btn,
.az-panel-link,
.readmore a,
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #1786ff, #0758cc);
  color: #fff !important;
  border: 0;
  border-radius: 8px;
  padding: 11px 20px;
  font-weight: 900;
  text-transform: uppercase;
  box-shadow: 0 8px 18px rgba(0,80,200,.28);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.az-btn:hover,
.az-panel-link:hover,
.readmore a:hover,
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(35,155,255,.45);
  filter: brightness(1.08);
}
.az-panel-link { width: calc(100% - 32px); margin: 0 16px 16px; }

/* Category cards */
.az-category-card {
  background: #f8fbff;
  color: #0a2443;
}
.az-category-card h3 {
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.az-category-card h3 a { font-size: 12px; text-transform: none; color: #89d8ff; }
.az-cats {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 12px;
  padding: 16px;
}
.az-cats a {
  min-height: 92px;
  border-radius: 10px;
  background: linear-gradient(180deg, #2a8cff, #064db4);
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 900;
  text-align: center;
  box-shadow: inset 0 1px rgba(255,255,255,.25), 0 8px 16px rgba(0,0,0,.12);
  transition: transform .2s ease, filter .2s ease;
}
.az-cats a:hover { transform: translateY(-3px); filter: brightness(1.08); }
.az-cats b { display: block; font-size: 28px; line-height: 1; }
.az-cats span { display: block; margin-top: 4px; }
.az-cats small { display: block; opacity: .78; font-weight: 700; font-size: 11px; }
.az-cats a:nth-child(2){background:linear-gradient(180deg,#7d45db,#4c1d93)}
.az-cats a:nth-child(3){background:linear-gradient(180deg,#f04a4a,#941a24)}
.az-cats a:nth-child(4){background:linear-gradient(180deg,#d948c9,#8c197e)}
.az-cats a:nth-child(5){background:linear-gradient(180deg,#ff9d2d,#b64f08)}
.az-cats a:nth-child(6){background:linear-gradient(180deg,#40c990,#147653)}
.az-cats a:nth-child(7){background:linear-gradient(180deg,#55aeea,#1a5d9b)}
.az-cats a:nth-child(8){background:linear-gradient(180deg,#5962df,#27339c)}

/* Article / latest cards */
.az-main .latestnews,
.az-main ul.latestnews,
.az-main .mod-articlesnews,
.az-main .newsflash {
  list-style: none;
  margin: 0;
  padding: 16px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.az-main .latestnews li,
.az-main .mod-articlesnews__item,
.az-main .newsflash-item {
  position: relative;
  min-height: 190px;
  padding: 118px 14px 14px;
  transition: transform .2s ease, border-color .2s ease;
}
.az-main .latestnews li:hover,
.az-main .blog-item:hover,
.az-main .com-content-category-blog__item:hover { transform: translateY(-3px); border-color: var(--az-line-strong); }
.az-main .latestnews li::before,
.az-main .mod-articlesnews__item::before,
.az-main .newsflash-item::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 104px;
  background:
    radial-gradient(circle at 70% 30%, rgba(94, 219, 255, .65), transparent 22%),
    linear-gradient(135deg, #0c5cb9, #06172b 70%);
  border-bottom: 1px solid var(--az-line);
}
.az-main .latestnews li:nth-child(2)::before{background:radial-gradient(circle at 62% 32%,rgba(255,211,56,.5),transparent 20%),linear-gradient(135deg,#171f31,#081428 72%)}
.az-main .latestnews li:nth-child(3)::before{background:radial-gradient(circle at 56% 40%,rgba(66,142,255,.7),transparent 22%),linear-gradient(135deg,#1573dd,#0b1932 70%)}
.az-main .latestnews li:nth-child(4)::before{background:radial-gradient(circle at 45% 35%,rgba(215,66,255,.58),transparent 18%),linear-gradient(135deg,#081a3b,#081428 72%)}
.az-main .latestnews li:nth-child(5)::before{background:radial-gradient(circle at 52% 40%,rgba(120,180,255,.7),transparent 22%),linear-gradient(135deg,#1a345a,#081428 72%)}
.az-main .latestnews li:nth-child(6)::before{background:radial-gradient(circle at 56% 40%,rgba(255,118,72,.62),transparent 22%),linear-gradient(135deg,#261a18,#081428 72%)}
.az-main .latestnews a { font-weight: 900; line-height: 1.25; }
.az-main .blog-items,
.az-main .com-content-category-blog__items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.az-main .blog-item,
.az-main .com-content-category-blog__item { padding: 16px; }
.az-main .item-title,
.az-main h2,
.az-main h3 { color: #fff; }
.az-main .page-header { margin-top: 0; }

/* Sidebar widgets */
.az-rank { counter-reset: rank; list-style: none; }
.az-rank li {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 8px;
  align-items: start;
  margin-bottom: 13px;
}
.az-rank li::before {
  counter-increment: rank;
  content: counter(rank);
  color: #fff;
  font-weight: 900;
  opacity: .92;
}
.az-media-widget ul { list-style: none; }
.az-media-widget li {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 12px;
  align-items: center;
  min-height: 64px;
  margin-bottom: 12px;
  font-weight: 800;
}
.az-thumb {
  display: block;
  width: 72px;
  height: 54px;
  border-radius: 8px;
  background: radial-gradient(circle at 65% 30%, rgba(86,216,255,.8), transparent 22%), linear-gradient(135deg, #134f9f, #081324);
  border: 1px solid rgba(255,255,255,.12);
}
.az-thumb-2{background:radial-gradient(circle at 48% 38%,rgba(132,77,255,.8),transparent 24%),linear-gradient(135deg,#16214a,#081324)}
.az-thumb-3{background:radial-gradient(circle at 48% 38%,rgba(255,126,65,.8),transparent 24%),linear-gradient(135deg,#362217,#081324)}
.az-thumb-4{background:radial-gradient(circle at 48% 38%,rgba(56,134,255,.8),transparent 24%),linear-gradient(135deg,#142c52,#081324)}
.az-thumb-5{background:radial-gradient(circle at 48% 38%,rgba(70,216,255,.8),transparent 24%),linear-gradient(135deg,#0b5eaa,#081324)}
.az-thumb-6{background:radial-gradient(circle at 48% 38%,rgba(255,141,205,.8),transparent 24%),linear-gradient(135deg,#371b4c,#081324)}
.az-thumb-7{background:radial-gradient(circle at 48% 38%,rgba(72,145,255,.8),transparent 24%),linear-gradient(135deg,#102b61,#081324)}
.az-thumb-8{background:radial-gradient(circle at 48% 38%,rgba(112,255,202,.8),transparent 24%),linear-gradient(135deg,#114c43,#081324)}
.az-icon-box {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 9px;
  background: linear-gradient(180deg, #248bff, #0753bd);
  color: #fff;
  font-weight: 900;
}
.az-newsletter p { margin: 0 16px 12px; }
.az-newsletter small { display: block; color: var(--az-muted); padding: 0 16px 16px; text-align: center; }
.az-newsletter input,
.az-card input[type='email'],
.az-card input[type='text'],
.az-card input[type='password'] {
  width: calc(100% - 32px);
  border: 1px solid var(--az-line);
  border-radius: 8px;
  background: #edf6ff;
  color: #10233b;
  padding: 11px;
  margin: 8px 16px 12px;
}
.az-newsletter button { width: calc(100% - 32px); margin: 0 16px 12px; }
.az-japanese-ad,
.az-tech-banner {
  min-height: 300px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background:
    radial-gradient(circle at 78% 22%, rgba(255, 143, 210, .42), transparent 16%),
    radial-gradient(circle at 30% 65%, rgba(64, 191, 255, .5), transparent 28%),
    linear-gradient(180deg, rgba(8, 24, 48, .95), rgba(5, 14, 30, .96));
}
.az-japanese-ad p,
.az-tech-banner p { font-size: 22px; font-weight: 900; line-height: 1.25; }
.az-tech-banner { min-height: 240px; text-align: right; }
.az-tech-banner p { writing-mode: vertical-rl; margin-left: auto; letter-spacing: .12em; }

/* Existing right-side modules */
.az-sidebar .latestnews,
.az-sidebar ul.latestnews {
  list-style: none;
  margin: 0;
  padding: 14px 16px;
}
.az-sidebar .latestnews li {
  padding: 9px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.az-sidebar .latestnews a { font-weight: 800; }

/* Bottom grid */
.az-bottom-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 18px;
  margin: 2px 0 24px;
}
.az-bottom-grid:empty { display: none; }

/* Footer */
.az-footer {
  margin-top: 18px;
  background: linear-gradient(180deg, #071d35, #031020);
  border-top: 1px solid var(--az-line);
  padding: 32px 0 12px;
}
.az-footer-grid {
  display: grid;
  grid-template-columns: 1.35fr repeat(4, 1fr);
  gap: 34px;
}
.az-footer h3 { margin: 0 0 14px; text-transform: uppercase; }
.az-footer p { color: #d5eaff; margin-top: 0; }
.az-footer strong { display: block; color: #82dfff; text-transform: uppercase; font-size: 13px; letter-spacing: .04em; }
.az-footer ul,
.az-footer .mod-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}
.az-footer li,
.az-footer .mod-menu li { margin: 0 0 8px; }
.az-footer a:hover { color: #79d8ff; }
.az-footer-about .mod-menu { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.az-footer-about .mod-menu li { margin: 0; }
.az-footer-about .mod-menu a { display: inline-flex; padding: 5px 7px; border: 1px solid var(--az-line); border-radius: 8px; }
.az-copy {
  border-top: 1px solid var(--az-line);
  margin-top: 26px;
  padding-top: 14px;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  color: #b4cee8;
  font-size: 13px;
}

/* Forms and misc */
input,
button { font: inherit; }
.az-error {
  min-height: 100vh;
  display: grid;
  place-content: center;
  text-align: center;
  background: #061326;
  color: #fff;
}
.az-error h1 { font-size: 54px; }

/* Hide heavy login forms if a login module is accidentally placed in compact/header areas */
.az-topline .mod-login,
.az-topline form,
.az-header-mods .mod-login { display: none !important; }

/* Responsive */
@media (max-width: 1500px) {
  .az-layout { grid-template-columns: 250px minmax(0, 1fr) 300px; gap: 16px; }
  .az-nav .mod-menu > li > a,
  .az-nav .mod-menu > li > span,
  .az-nav ul > li > a,
  .az-nav ul > li > span { padding: 0 14px; font-size: 12px; }
  .az-cats { grid-template-columns: repeat(4, 1fr); }
  .az-bottom-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1200px) {
  .az-layout,
  .az-layout.no-left,
  .az-layout.no-right {
    grid-template-columns: 1fr;
  }
  .az-left,
  .az-right {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
  .az-hero-head { height: 230px; }
  .az-globe { right: -70px; width: 740px; }
  .az-feature-hero::after { opacity: .45; }
  .az-footer-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  :root { --az-wrap: min(94vw, 640px); }
  .az-topline-inner,
  .az-headlines { flex-wrap: wrap; }
  .az-topline-inner { padding: 8px 0; }
  .az-top-actions { width: 100%; justify-content: space-between; }
  .az-hero-head { height: 235px; }
  .az-header-grid { align-items: center; }
  .az-logo { font-size: 38px; }
  .az-subtitle { letter-spacing: .34em; font-size: 14px; }
  .az-tagline { letter-spacing: .12em; }
  .az-header-mods { display: none; }
  .az-jp-mark { display: none; }
  .az-globe { width: 560px; right: -250px; top: -90px; }
  .az-mobile-toggle {
    display: inline-flex;
    align-items: center;
    background: #0b66db;
    color: #fff;
    border: 0;
    border-radius: 8px;
    padding: 10px 14px;
    margin: 8px 0;
    font-weight: 900;
  }
  .az-nav-shell { display: block; }
  .az-nav-inner { display: none; }
  .az-nav-inner.is-open { display: block; }
  .az-nav .mod-menu,
  .az-nav ul { display: block; min-height: 0; }
  .az-nav .mod-menu > li,
  .az-nav ul > li { display: block; }
  .az-nav .mod-menu > li > a,
  .az-nav ul > li > a { padding: 13px 18px; border-left: 0; border-top: 1px solid rgba(255,255,255,.08); }
  .az-nav-search { display: none; }
  .az-breaking-inner { display: block; }
  .az-breaking-label { display: inline-block; margin-bottom: 8px; }
  .az-left,
  .az-right,
  .az-main .latestnews,
  .az-main ul.latestnews,
  .az-main .mod-articlesnews,
  .az-main .newsflash,
  .az-main .blog-items,
  .az-main .com-content-category-blog__items,
  .az-bottom-grid,
  .az-footer-grid { grid-template-columns: 1fr; }
  .az-cats { grid-template-columns: repeat(2, 1fr); }
  .az-feature-hero { min-height: 360px; padding: 48px 24px; }
  .az-feature-hero h1 { font-size: 34px; }
  .az-feature-hero::after { width: 260px; opacity: .28; }
  .az-copy { display: block; }
}


/* v0.3.1 polish fixes */
.az-top-actions,
.az-top-actions > div,
.az-top-actions .moduletable,
.az-top-actions .mod-menu,
.az-top-actions .menu,
.az-top-actions ul {
  display: flex;
  align-items: center;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.az-top-actions li { margin: 0; padding: 0; list-style: none; }
.az-top-actions li::marker { content: ''; }
.az-top-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 0 7px;
  border-radius: 7px;
  color: #e7f4ff;
  line-height: 1;
}
.az-top-actions a:hover { background: rgba(47,142,255,.22); color: #fff; }
.az-top-actions .mod-login,
.az-top-actions form,
.az-top-actions input,
.az-top-actions label,
.az-top-actions button:not(.az-mobile-toggle),
.az-topline .mod-login,
.az-topline .login,
.az-topline .userdata,
.az-topline form,
.az-topline input,
.az-topline label,
.az-topline button:not(.az-mobile-toggle),
.az-header-mods .mod-login,
.az-header-mods .userdata,
.az-header-mods form#login-form {
  display: none !important;
}
.az-login-link {
  white-space: nowrap;
  background: rgba(23, 71, 125, .7);
}
.az-main .az-card + .az-card,
.az-main .latestnews + .az-card { margin-top: 18px; }
.az-layout { margin-top: 8px; }
.az-breadcrumbs { opacity: .7; }
.az-module-content > p:first-child { margin-top: 0; }
.az-module-content > p:last-child { margin-bottom: 0; }
.az-module-content button,
.az-module-content input[type='submit'] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #1786ff, #0758cc);
  color: #fff;
  border: 0;
  border-radius: 8px;
  padding: 10px 16px;
  font-weight: 900;
  text-transform: uppercase;
}
.az-sidebar .az-card { backdrop-filter: blur(8px); }
.az-header-mods { position: relative; z-index: 5; }
.az-search-fallback input::placeholder,
.az-header-mods input::placeholder { color: #b8d6f2; }
.az-footer { margin-top: 36px; }

@media (min-width: 1900px) {
  :root { --az-wrap: 1680px; }
}

@media (max-width: 1500px) {
  :root { --az-wrap: min(96vw, 1380px); }
}


/* v0.3.2 Phoenix refinement: wider portal, cleaner home component, stronger magazine cards */
:root { --az-wrap: min(92vw, 2100px); }

@media (min-width: 1700px) {
  :root { --az-wrap: min(86vw, 2100px); }
  .az-layout { grid-template-columns: 310px minmax(0, 1fr) 370px; gap: 22px; }
  .az-feature-hero { min-height: 455px; }
  .az-main .latestnews,
  .az-main ul.latestnews,
  .az-main .mod-articlesnews,
  .az-main .newsflash { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
}

@media (min-width: 2300px) {
  :root { --az-wrap: 2180px; }
  .az-layout { grid-template-columns: 330px minmax(0, 1fr) 390px; gap: 24px; }
  .az-feature-hero { min-height: 480px; padding: 86px 58px; }
  .az-feature-hero h1 { font-size: 76px; }
  .az-feature-hero p { font-size: 20px; max-width: 680px; }
}

/* Keep the Joomla Home component from breaking the magazine homepage flow. */
.az-menu-home .az-main > .page-header,
.az-menu-home .az-main .com-content-featured > h1,
.az-menu-home .az-main .blog > h1,
.az-menu-home .az-main h1.page-title,
.az-menu-home .az-main .page-header h1 {
  display: none !important;
}

/* More polished dynamic module presentation */
.az-main .az-card > h3,
.az-sidebar .az-card > h3 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.az-main .az-card > h3::before,
.az-sidebar .az-card > h3::before {
  content: '▣';
  color: #79d8ff;
  font-size: 13px;
  text-shadow: 0 0 12px rgba(80, 212, 255, .75);
}
.az-card.module:not(:has(h3)) .az-module-content {
  padding: 18px;
}

/* Make article blocks feel closer to image-heavy Japanese tech portals. */
.az-main .latestnews li,
.az-main .mod-articlesnews__item,
.az-main .newsflash-item,
.az-main .blog-item,
.az-main .com-content-category-blog__item {
  isolation: isolate;
}
.az-main .latestnews li::after,
.az-main .mod-articlesnews__item::after,
.az-main .newsflash-item::after {
  content: 'NEWS';
  position: absolute;
  left: 12px;
  top: 82px;
  z-index: 2;
  font-size: 10px;
  letter-spacing: .08em;
  font-weight: 900;
  color: #fff;
  background: linear-gradient(180deg, #238bff, #0756c4);
  border-radius: 5px;
  padding: 3px 6px;
  box-shadow: 0 0 14px rgba(47,142,255,.35);
}
.az-main .latestnews li::before,
.az-main .mod-articlesnews__item::before,
.az-main .newsflash-item::before {
  background-size: cover;
  background-position: center;
}
.az-main .latestnews li:nth-child(1)::before{background:radial-gradient(circle at 68% 30%,rgba(90,230,255,.75),transparent 20%),radial-gradient(circle at 20% 80%,rgba(255,143,210,.24),transparent 16%),linear-gradient(135deg,#0b73d8,#07182d 74%)}
.az-main .latestnews li:nth-child(2)::before{background:radial-gradient(circle at 50% 35%,rgba(255,211,56,.58),transparent 20%),linear-gradient(135deg,#202434,#081428 72%)}
.az-main .latestnews li:nth-child(3)::before{background:radial-gradient(circle at 56% 40%,rgba(66,142,255,.8),transparent 22%),linear-gradient(135deg,#1573dd,#0b1932 70%)}
.az-main .latestnews li:nth-child(4)::before{background:radial-gradient(circle at 45% 35%,rgba(215,66,255,.65),transparent 18%),linear-gradient(135deg,#081a3b,#081428 72%)}
.az-main .latestnews li:nth-child(5)::before{background:radial-gradient(circle at 52% 40%,rgba(120,180,255,.78),transparent 22%),linear-gradient(135deg,#1a345a,#081428 72%)}
.az-main .latestnews li:nth-child(6)::before{background:radial-gradient(circle at 56% 40%,rgba(255,118,72,.7),transparent 22%),linear-gradient(135deg,#261a18,#081428 72%)}

/* Better sidebar proportions and readability */
.az-sidebar .az-card { margin-bottom: 20px; }
.az-sidebar .latestnews li { padding: 12px 0; }
.az-sidebar .latestnews li:first-child { padding-top: 0; }
.az-sidebar .latestnews a { line-height: 1.25; }
.az-sidebar .az-module-content > p { color: #dcefff; }

/* Footer gets closer to the mockup: wider, cleaner, more structured */
.az-footer { margin-top: 52px; }
.az-footer-grid { align-items: start; }
.az-footer h3 { color: #fff; letter-spacing: .03em; }
.az-footer a { color: #dbeeff; }
.az-copy { padding-bottom: 10px; }

/* Header refinement: keep search/globe balanced on wide screens */
@media (min-width: 1700px) {
  .az-hero-head { height: 285px; }
  .az-header-mods { min-width: 430px; }
  .az-header-mods input[type='search'],
  .az-header-mods input[type='text'] { max-width: 420px; }
  .az-globe { width: min(1120px, 54vw); height: 590px; top: -155px; right: 3vw; }
}

/* Better middle-distance layout: avoid the page feeling too narrow on 1440-1600px widths. */
@media (max-width: 1700px) and (min-width: 1201px) {
  :root { --az-wrap: min(94vw, 1560px); }
  .az-layout { grid-template-columns: 270px minmax(0, 1fr) 320px; gap: 18px; }
}

@media (max-width: 1200px) {
  .az-main .latestnews li::after,
  .az-main .mod-articlesnews__item::after,
  .az-main .newsflash-item::after { top: 82px; }
}

/* Keep topbar social links compact without destroying footer social buttons. */
.az-topline .az-top-social a {
  font-size: 0;
  width: 26px;
  padding: 0;
}
.az-topline .az-top-social a::first-letter { font-size: 12px; }
.az-topline .az-top-social a::before {
  content: attr(aria-label);
  font-size: 0;
}
.az-topline .az-top-social li:nth-child(1) a::after { content: 'X'; font-size: 12px; }
.az-topline .az-top-social li:nth-child(2) a::after { content: 'f'; font-size: 12px; }
.az-topline .az-top-social li:nth-child(3) a::after { content: '◎'; font-size: 13px; }
.az-topline .az-top-social li:nth-child(4) a::after { content: '▶'; font-size: 12px; }
.az-topline .az-top-social li:nth-child(5) a::after { content: '♪'; font-size: 12px; }
.az-topline .az-top-social li:nth-child(6) a::after { content: '☊'; font-size: 12px; }
.az-topline .az-top-social li:nth-child(7) a::after { content: '{}'; font-size: 10px; }
.az-topline .az-top-social li:nth-child(8) a::after { content: 'RSS'; font-size: 9px; }
.az-topline .az-top-social li:nth-child(n+9) { display: none; }

@media (max-width: 760px) {
  .az-topline .az-top-social li:nth-child(n+5) { display: none; }
  .az-feature-hero { margin-left: 0; margin-right: 0; }
}


/* v0.3.3 Phoenix homepage flow refinement */
/* Home is now a real portal page: Joomla component output is suppressed in index.php. */
.az-menu-home .az-breadcrumbs {
  display: none !important;
}
.az-menu-home .az-site-main {
  padding-top: 42px;
}

/* Give the central column a stronger magazine rhythm. */
.az-main > .az-card.module {
  margin-bottom: 22px;
}
.az-main > .az-card.module > h3 {
  min-height: 46px;
  justify-content: space-between;
}
.az-main > .az-card.module > .az-module-content {
  padding: 0;
}
.az-main > .az-card.module > .az-module-content > .latestnews,
.az-main > .az-card.module > .az-module-content > ul.latestnews,
.az-main > .az-card.module > .az-module-content > .newsflash,
.az-main > .az-card.module > .az-module-content > .mod-articlesnews {
  margin: 0;
  padding: 16px;
}

/* When a module title is disabled, still keep a clean panel look. */
.az-main > .az-card.module:not(:has(> h3)),
.az-sidebar > .az-card.module:not(:has(> h3)) {
  padding-top: 0;
}
.az-sidebar > .az-card.module:not(:has(> h3)) .az-module-content {
  padding: 16px;
  border-top: 1px solid rgba(255,255,255,.07);
}
.az-sidebar > .az-card.module:not(:has(> h3))::before {
  content: 'Network';
  display: block;
  padding: 12px 16px;
  text-transform: uppercase;
  font-weight: 900;
  letter-spacing: .03em;
  background: linear-gradient(180deg, #113e6f, #071d38);
  border-bottom: 1px solid var(--az-line);
}

/* Stronger image/card feeling for article lists. */
.az-main .latestnews li,
.az-main .mod-articlesnews__item,
.az-main .newsflash-item {
  min-height: 218px;
  padding-top: 140px;
}
.az-main .latestnews li::before,
.az-main .mod-articlesnews__item::before,
.az-main .newsflash-item::before {
  height: 125px;
}
.az-main .latestnews li::after,
.az-main .mod-articlesnews__item::after,
.az-main .newsflash-item::after {
  top: 102px;
}
.az-main .latestnews a {
  display: block;
  font-size: 15px;
}
.az-main .latestnews li:hover::before,
.az-main .mod-articlesnews__item:hover::before,
.az-main .newsflash-item:hover::before {
  filter: saturate(1.18) brightness(1.08);
}

/* Add a bit more Japanese magazine density without making it messy. */
.az-feature-hero {
  background:
    radial-gradient(circle at 78% 35%, rgba(116, 223, 255, .72), transparent 19%),
    radial-gradient(circle at 83% 63%, rgba(255, 141, 205, .30), transparent 10%),
    linear-gradient(100deg, rgba(3, 18, 38, .99) 0%, rgba(5, 30, 64, .9) 47%, rgba(7, 48, 88, .62) 100%),
    repeating-linear-gradient(90deg, rgba(100, 205, 255, .08) 0 1px, transparent 1px 34px),
    repeating-linear-gradient(0deg, rgba(100, 205, 255, .06) 0 1px, transparent 1px 28px);
}
.az-feature-copy::before {
  content: '未来 / TECH / MEDIA';
  display: block;
  margin-bottom: 10px;
  color: #79d8ff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .28em;
  text-transform: uppercase;
  opacity: .78;
}

/* Better right-sidebar hierarchy. */
.az-right .az-card h3,
.az-right .az-card::before {
  font-size: 14px;
}
.az-right .latestnews li {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 12px;
  align-items: center;
  min-height: 58px;
}
.az-right .latestnews li::before {
  content: '';
  display: block;
  width: 56px;
  height: 42px;
  border-radius: 8px;
  background: radial-gradient(circle at 60% 35%, rgba(82,219,255,.75), transparent 24%), linear-gradient(135deg,#0b5eaa,#081324);
  border: 1px solid rgba(255,255,255,.12);
}
.az-right .latestnews li:nth-child(2)::before { background: radial-gradient(circle at 48% 35%, rgba(255,141,205,.75), transparent 24%), linear-gradient(135deg,#371b4c,#081324); }
.az-right .latestnews li:nth-child(3)::before { background: radial-gradient(circle at 48% 35%, rgba(72,145,255,.75), transparent 24%), linear-gradient(135deg,#102b61,#081324); }
.az-right .latestnews li:nth-child(4)::before { background: radial-gradient(circle at 48% 35%, rgba(112,255,202,.75), transparent 24%), linear-gradient(135deg,#114c43,#081324); }
.az-right .latestnews li:nth-child(n+5)::before { background: radial-gradient(circle at 48% 35%, rgba(255,211,56,.7), transparent 24%), linear-gradient(135deg,#262414,#081324); }

/* Bottom modules become proper homepage tiles instead of loose bullet lists. */
.az-bottom-grid {
  align-items: start;
}
.az-bottom-grid > .az-card.module {
  min-height: 210px;
}
.az-bottom-grid .latestnews,
.az-bottom-grid ul.latestnews {
  list-style: none;
  margin: 0;
  padding: 14px 16px;
}
.az-bottom-grid .latestnews li {
  margin: 0 0 10px;
  padding: 0 0 10px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.az-bottom-grid .latestnews li:last-child { border-bottom: 0; }
.az-bottom-grid .latestnews a { font-weight: 850; }

/* Footer should not be pushed down by an unstyled empty area. */
.az-bottom-grid:has(.az-card) {
  margin-top: 28px;
}
.az-footer {
  margin-top: 36px;
}

/* A touch more air on huge displays while keeping the portal dense. */
@media (min-width: 1800px) {
  .az-site-main { padding-top: 36px; }
  .az-layout { grid-template-columns: 305px minmax(0, 1fr) 355px; }
}

@media (max-width: 1200px) {
  .az-menu-home .az-site-main { padding-top: 22px; }
  .az-sidebar > .az-card.module:not(:has(> h3))::before { content: 'Network'; }
}

/* v0.3.4 Phoenix sidebar and flow refinement */
/* The right sidebar now owns the wrapper, so even modules with odd/legacy output stay inside a proper card. */
.az-sidebar-slot {
  margin-bottom: 20px;
  overflow: hidden;
}
.az-sidebar-slot > h3 {
  margin: 0;
  padding: 13px 16px;
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: .02em;
  background: linear-gradient(180deg, #113e6f, #071d38);
  border-bottom: 1px solid var(--az-line);
}
.az-sidebar-slot > h3::before {
  content: '▣';
  color: #79d8ff;
  margin-right: 8px;
  font-size: 12px;
  text-shadow: 0 0 12px rgba(80, 212, 255, .75);
}
.az-sidebar-slot .az-module-content {
  padding: 16px;
}
.az-sidebar-slot .az-module-content > *:first-child { margin-top: 0; }
.az-sidebar-slot .az-module-content > *:last-child { margin-bottom: 0; }

/* Legacy latest article modules inside controlled sidebar slots. */
.az-sidebar-slot .latestnews,
.az-sidebar-slot ul.latestnews,
.az-sidebar-slot .mod-articlesnews,
.az-sidebar-slot .newsflash {
  list-style: none;
  margin: 0;
  padding: 0;
}
.az-sidebar-slot .latestnews li,
.az-sidebar-slot .mod-articlesnews__item,
.az-sidebar-slot .newsflash-item {
  display: grid;
  grid-template-columns: 64px 1fr;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.az-sidebar-slot .latestnews li:last-child,
.az-sidebar-slot .mod-articlesnews__item:last-child,
.az-sidebar-slot .newsflash-item:last-child { border-bottom: 0; }
.az-sidebar-slot .latestnews li::before,
.az-sidebar-slot .mod-articlesnews__item::before,
.az-sidebar-slot .newsflash-item::before {
  content: '';
  display: block;
  width: 64px;
  height: 48px;
  border-radius: 8px;
  background: radial-gradient(circle at 60% 35%, rgba(82,219,255,.75), transparent 24%), linear-gradient(135deg,#0b5eaa,#081324);
  border: 1px solid rgba(255,255,255,.12);
}
.az-sidebar-slot .latestnews li:nth-child(2)::before,
.az-sidebar-slot .mod-articlesnews__item:nth-child(2)::before,
.az-sidebar-slot .newsflash-item:nth-child(2)::before { background: radial-gradient(circle at 48% 35%, rgba(255,141,205,.75), transparent 24%), linear-gradient(135deg,#371b4c,#081324); }
.az-sidebar-slot .latestnews li:nth-child(3)::before,
.az-sidebar-slot .mod-articlesnews__item:nth-child(3)::before,
.az-sidebar-slot .newsflash-item:nth-child(3)::before { background: radial-gradient(circle at 48% 35%, rgba(72,145,255,.75), transparent 24%), linear-gradient(135deg,#102b61,#081324); }
.az-sidebar-slot .latestnews li:nth-child(4)::before,
.az-sidebar-slot .mod-articlesnews__item:nth-child(4)::before,
.az-sidebar-slot .newsflash-item:nth-child(4)::before { background: radial-gradient(circle at 48% 35%, rgba(112,255,202,.75), transparent 24%), linear-gradient(135deg,#114c43,#081324); }
.az-sidebar-slot .latestnews a,
.az-sidebar-slot .mod-articlesnews__item a,
.az-sidebar-slot .newsflash-item a {
  font-weight: 900;
  line-height: 1.24;
}

/* Follow/social links in right-top should look like a list, not raw text. */
.az-slot-follow .mod-menu,
.az-slot-follow ul.menu,
.az-slot-follow ul:not(.latestnews) {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
}
.az-slot-follow .mod-menu li,
.az-slot-follow ul.menu li,
.az-slot-follow ul:not(.latestnews) li {
  margin: 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.az-slot-follow .mod-menu a,
.az-slot-follow ul.menu a,
.az-slot-follow ul:not(.latestnews) a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 0;
  font-weight: 850;
}
.az-slot-follow .mod-menu a::after,
.az-slot-follow ul.menu a::after,
.az-slot-follow ul:not(.latestnews) a::after {
  content: '›';
  color: #79d8ff;
}

/* Newsletter slot: keep form-like content polished even when saved as plain custom content. */
.az-slot-newsletter input[type='email'],
.az-slot-newsletter input[type='text'] {
  width: 100%;
  margin: 10px 0 12px;
}
.az-slot-newsletter button,
.az-slot-newsletter input[type='submit'] {
  width: 100%;
  margin: 0;
}

/* Bottom modules are now part of the main content column, so they follow the magazine flow immediately. */
.az-main > .az-card.module .latestnews,
.az-main > .az-card.module ul.latestnews {
  list-style: none;
}
.az-main > .az-card.module .latestnews:empty { display: none; }

/* Prevent a long right sidebar from creating the feeling that the center content ended too early. */
.az-layout {
  align-items: start;
}
.az-main {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* The lower optional grid is only for future dedicated modules, not the current Latest Games module. */
.az-bottom-grid {
  margin-top: 0;
}
.az-bottom-grid:empty {
  display: none !important;
}

/* On very wide screens, give the portal a bit more width and better balance. */
@media (min-width: 1900px) {
  :root { --az-wrap: min(90vw, 2240px); }
  .az-layout { grid-template-columns: 320px minmax(0, 1fr) 380px; gap: 24px; }
}
@media (min-width: 2400px) {
  :root { --az-wrap: min(88vw, 2320px); }
  .az-layout { grid-template-columns: 335px minmax(0, 1fr) 400px; gap: 26px; }
}

@media (max-width: 760px) {
  .az-sidebar-slot .latestnews li,
  .az-sidebar-slot .mod-articlesnews__item,
  .az-sidebar-slot .newsflash-item {
    grid-template-columns: 56px 1fr;
  }
  .az-sidebar-slot .latestnews li::before,
  .az-sidebar-slot .mod-articlesnews__item::before,
  .az-sidebar-slot .newsflash-item::before {
    width: 56px;
    height: 42px;
  }
}


/* v0.3.5 Phoenix main-column flow refinement */
/* Render the legacy "bottom" module position directly inside the main magazine column.
   This prevents the center column from ending too early while the right sidebar continues. */
.az-main > .az-card.module:has(.latestnews),
.az-main > .az-card.module:has(.mod-articlesnews),
.az-main > .az-card.module:has(.newsflash) {
  background: linear-gradient(180deg, rgba(10, 32, 58, .96), rgba(5, 18, 34, .98));
}

.az-main > .az-card.module:last-child {
  margin-bottom: 0;
}

/* If the bottom module is a simple latest-articles list, make it feel like a compact portal block. */
.az-main > .az-card.module .latestnews:not(:empty),
.az-main > .az-card.module ul.latestnews:not(:empty) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.az-main > .az-card.module .latestnews li:nth-child(n+7) {
  display: none;
}

/* Give lower article sections slightly more presence so the page does not look empty on tall screens. */
.az-main > .az-card.module .latestnews li,
.az-main > .az-card.module .mod-articlesnews__item,
.az-main > .az-card.module .newsflash-item {
  min-height: 226px;
}

/* Dedicated future section positions may still live below the 3-column grid, but hidden when unused. */
.az-bottom-grid > .az-card.module:empty,
.az-bottom-grid > .az-card.module:not(:has(.az-module-content > *)) {
  display: none;
}

/* The right sidebar should remain readable but not dominate the page visually. */
.az-right .az-sidebar-slot {
  box-shadow: 0 10px 26px rgba(0, 0, 0, .28);
}
.az-right .az-sidebar-slot .latestnews li,
.az-right .az-sidebar-slot .mod-articlesnews__item,
.az-right .az-sidebar-slot .newsflash-item {
  min-height: 60px;
}

@media (min-width: 1800px) {
  .az-main > .az-card.module .latestnews:not(:empty),
  .az-main > .az-card.module ul.latestnews:not(:empty) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .az-main > .az-card.module .latestnews:not(:empty),
  .az-main > .az-card.module ul.latestnews:not(:empty) {
    grid-template-columns: 1fr;
  }
}

/* v0.3.6 Phoenix section headers and clearer homepage rhythm */
.az-section-card {
  margin-bottom: 22px;
  background: linear-gradient(180deg, rgba(10, 32, 58, .97), rgba(5, 18, 34, .99));
}
.az-section-card > h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.az-section-card > h3::before {
  content: '▣';
  color: #6cdcff;
  margin-right: 8px;
  text-shadow: 0 0 12px rgba(90, 220, 255, .75);
}
.az-section-card > h3 a {
  margin-left: auto;
  color: #84d8ff;
  font-size: 12px;
  font-weight: 800;
  text-transform: none;
  letter-spacing: 0;
  opacity: .95;
}
.az-section-card > h3 a:hover { color: #fff; }
.az-section-card > .az-module-content { padding: 0; }
.az-section-card .latestnews,
.az-section-card ul.latestnews,
.az-section-card .mod-articlesnews,
.az-section-card .newsflash {
  padding: 18px;
}
.az-section-card .latestnews:empty,
.az-section-card ul.latestnews:empty { display: none; }

/* The lower game strip should feel like its own magazine section, not leaked list output. */
.az-section-games .latestnews,
.az-section-games ul.latestnews {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.az-section-games .latestnews li,
.az-section-games .mod-articlesnews__item,
.az-section-games .newsflash-item {
  min-height: 168px;
  padding-top: 104px;
}
.az-section-games .latestnews li::before,
.az-section-games .mod-articlesnews__item::before,
.az-section-games .newsflash-item::before { height: 92px; }

/* Keep the first real news section strong and visual. */
.az-section-latest .latestnews li,
.az-section-latest .mod-articlesnews__item,
.az-section-latest .newsflash-item { min-height: 210px; }

/* Magazine cards can be a bit denser. */
.az-section-magazine .latestnews li,
.az-section-magazine .mod-articlesnews__item,
.az-section-magazine .newsflash-item {
  min-height: 190px;
  padding-top: 112px;
}

/* Do not let article sections leave awkward extra space before the footer. */
.az-main > .az-section-card:last-child { margin-bottom: 0; }

@media (max-width: 1280px) {
  .az-section-games .latestnews,
  .az-section-games ul.latestnews { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .az-section-card > h3 { align-items: flex-start; flex-direction: column; }
  .az-section-card > h3 a { margin-left: 0; }
  .az-section-games .latestnews,
  .az-section-games ul.latestnews { grid-template-columns: 1fr; }
}


/* v0.3.8 Phoenix section-card title/badge fix
   Fixes magazine and top-games cards where the synthetic category badge overlapped the title.
   The first news section was fine; lower sections had smaller image heights but kept the old badge/title offsets. */
.az-section-card .latestnews li,
.az-section-card .mod-articlesnews__item,
.az-section-card .newsflash-item {
  overflow: hidden;
}

/* Default section card geometry: image area, badge and title never collide. */
.az-section-card .latestnews li,
.az-section-card .mod-articlesnews__item,
.az-section-card .newsflash-item {
  min-height: 218px;
  padding: 138px 16px 18px;
}
.az-section-card .latestnews li::before,
.az-section-card .mod-articlesnews__item::before,
.az-section-card .newsflash-item::before {
  height: 124px;
}
.az-section-card .latestnews li::after,
.az-section-card .mod-articlesnews__item::after,
.az-section-card .newsflash-item::after {
  top: 94px;
  left: 14px;
  z-index: 3;
}
.az-section-card .latestnews a,
.az-section-card .mod-articlesnews__item a,
.az-section-card .newsflash-item a {
  position: relative;
  z-index: 4;
  display: block;
  margin-top: 0;
  line-height: 1.25;
}

/* The main news section keeps the larger card style. */
.az-section-latest .latestnews li,
.az-section-latest .mod-articlesnews__item,
.az-section-latest .newsflash-item {
  min-height: 224px;
  padding-top: 142px;
}
.az-section-latest .latestnews li::before,
.az-section-latest .mod-articlesnews__item::before,
.az-section-latest .newsflash-item::before {
  height: 126px;
}
.az-section-latest .latestnews li::after,
.az-section-latest .mod-articlesnews__item::after,
.az-section-latest .newsflash-item::after {
  content: 'NEWS';
  top: 98px;
}

/* Magazine section: slightly denser, but title remains fully visible. */
.az-section-magazine .latestnews li,
.az-section-magazine .mod-articlesnews__item,
.az-section-magazine .newsflash-item {
  min-height: 206px;
  padding-top: 132px;
}
.az-section-magazine .latestnews li::before,
.az-section-magazine .mod-articlesnews__item::before,
.az-section-magazine .newsflash-item::before {
  height: 116px;
}
.az-section-magazine .latestnews li::after,
.az-section-magazine .mod-articlesnews__item::after,
.az-section-magazine .newsflash-item::after {
  content: 'MAGAZINE';
  top: 88px;
}

/* Games section: compact strip, but no clipping/overlap. */
.az-section-games .latestnews,
.az-section-games ul.latestnews {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.az-section-games .latestnews li,
.az-section-games .mod-articlesnews__item,
.az-section-games .newsflash-item {
  min-height: 174px;
  padding: 112px 14px 16px;
}
.az-section-games .latestnews li::before,
.az-section-games .mod-articlesnews__item::before,
.az-section-games .newsflash-item::before {
  height: 96px;
}
.az-section-games .latestnews li::after,
.az-section-games .mod-articlesnews__item::after,
.az-section-games .newsflash-item::after {
  content: 'GAMES';
  top: 72px;
}
.az-section-games .latestnews a,
.az-section-games .mod-articlesnews__item a,
.az-section-games .newsflash-item a {
  font-size: 14px;
}

@media (max-width: 1280px) {
  .az-section-games .latestnews,
  .az-section-games ul.latestnews { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .az-section-card .latestnews li,
  .az-section-card .mod-articlesnews__item,
  .az-section-card .newsflash-item,
  .az-section-magazine .latestnews li,
  .az-section-magazine .mod-articlesnews__item,
  .az-section-magazine .newsflash-item,
  .az-section-games .latestnews li,
  .az-section-games .mod-articlesnews__item,
  .az-section-games .newsflash-item {
    min-height: 190px;
    padding-top: 120px;
  }
  .az-section-card .latestnews li::before,
  .az-section-card .mod-articlesnews__item::before,
  .az-section-card .newsflash-item::before,
  .az-section-magazine .latestnews li::before,
  .az-section-magazine .mod-articlesnews__item::before,
  .az-section-magazine .newsflash-item::before,
  .az-section-games .latestnews li::before,
  .az-section-games .mod-articlesnews__item::before,
  .az-section-games .newsflash-item::before { height: 104px; }
  .az-section-card .latestnews li::after,
  .az-section-card .mod-articlesnews__item::after,
  .az-section-card .newsflash-item::after,
  .az-section-magazine .latestnews li::after,
  .az-section-magazine .mod-articlesnews__item::after,
  .az-section-magazine .newsflash-item::after,
  .az-section-games .latestnews li::after,
  .az-section-games .mod-articlesnews__item::after,
  .az-section-games .newsflash-item::after { top: 78px; }
  .az-section-games .latestnews,
  .az-section-games ul.latestnews { grid-template-columns: 1fr; }
}


/* v0.3.9 Phoenix community panel header fix
   The demo Community/Discord promo is a special graphic card, but its h3 title
   must still use the same full-width module header as the rest of the sidebar. */
.az-japanese-ad {
  padding: 0;
  justify-content: flex-start;
  overflow: hidden;
}
.az-japanese-ad > h3 {
  width: 100%;
  box-sizing: border-box;
  flex: 0 0 auto;
}
.az-japanese-ad > p {
  margin: 0;
  padding: 32px 22px 20px;
  font-size: 22px;
  font-weight: 900;
  line-height: 1.25;
}
.az-japanese-ad > .az-btn {
  width: calc(100% - 44px);
  margin: auto 22px 22px;
  flex: 0 0 auto;
}
.az-japanese-ad.az-card > h3 {
  border-radius: 0;
}

/* v0.3.10 Phoenix category panel tone fix
   The Explore Categories module should use the same dark glass panel body as the
   other homepage sections, not a bright white body. The category buttons stay
   colorful, but the surrounding panel now matches the Aresenya dark UI. */
.az-category-card {
  background: linear-gradient(180deg, rgba(13, 40, 70, .96), rgba(7, 24, 43, .98));
  color: #eaf6ff;
  border-color: var(--az-line);
}
.az-category-card .az-module-content,
.az-category-card .az-cats {
  background: transparent;
}
.az-category-card .az-cats {
  padding: 18px;
}


/* v0.3.11 Phoenix header height refinement
   Reduce the main futuristic header by roughly 10% while preserving the
   globe/search composition and the Aresenya brand spacing. */
.az-hero-head { height: 234px; }
.az-globe { top: -136px; height: 530px; }
.az-jp-mark { top: 30px; }

@media (min-width: 1700px) {
  .az-hero-head { height: 257px; }
  .az-globe { height: 560px; top: -144px; }
}

@media (max-width: 1200px) {
  .az-hero-head { height: 207px; }
  .az-globe { top: -108px; }
}

@media (max-width: 760px) {
  .az-hero-head { height: 212px; }
  .az-globe { top: -95px; }
}


/* v0.3.12 Phoenix compact header accessibility pass
   Reduce the main futuristic header by roughly 50% compared with the original
   tall hero treatment, so visitors do not need to scroll as much after page
   changes. The brand remains readable while the globe becomes a compact banner. */
.az-hero-head { height: 132px; }
.az-header-grid { gap: 24px; }
.az-logo {
  font-size: clamp(34px, 3vw, 58px);
  letter-spacing: .075em;
}
.az-logo::after {
  width: 92px;
  height: 2px;
  margin-top: 10px;
}
.az-subtitle {
  margin-top: 8px;
  font-size: clamp(11px, .78vw, 16px);
  letter-spacing: .52em;
}
.az-tagline {
  margin-top: 9px;
  font-size: clamp(9px, .56vw, 11px);
  letter-spacing: .30em;
}
.az-globe {
  right: 5vw;
  top: -108px;
  width: min(720px, 44vw);
  height: 300px;
  opacity: .9;
}
.az-cityline {
  height: 58px;
  width: 30vw;
}
.az-jp-mark {
  right: 28px;
  top: 14px;
  font-size: 16px;
  letter-spacing: 3px;
}
.az-jp-mark::after {
  width: 18px;
  height: 18px;
  font-size: 11px;
  margin-top: 5px;
}
.az-header-mods input[type='search'],
.az-header-mods input[type='text'] {
  max-width: 280px;
  padding: 9px 13px;
  border-radius: 12px;
}
.az-header-mods button,
.az-search-fallback button {
  border-radius: 10px;
  padding: 0 12px;
}

@media (min-width: 1700px) {
  .az-hero-head { height: 150px; }
  .az-globe { height: 330px; top: -118px; width: min(760px, 42vw); }
}

@media (max-width: 1200px) {
  .az-hero-head { height: 124px; }
  .az-logo { font-size: clamp(30px, 4vw, 48px); }
  .az-subtitle { font-size: 11px; letter-spacing: .44em; }
  .az-tagline { font-size: 9px; letter-spacing: .22em; }
  .az-globe { top: -84px; width: 48vw; height: 250px; }
  .az-jp-mark { font-size: 14px; right: 18px; }
}

@media (max-width: 760px) {
  .az-hero-head { height: 150px; }
  .az-header-grid { align-items: center; }
  .az-logo { font-size: 36px; }
  .az-subtitle { font-size: 11px; letter-spacing: .34em; }
  .az-tagline { max-width: 300px; font-size: 9px; letter-spacing: .14em; }
  .az-globe { right: -140px; top: -74px; width: 420px; height: 240px; opacity: .55; }
  .az-jp-mark { display: none; }
}


/* v0.3.13 Phoenix: unified futuristic sci-fi header search */
.az-nav-search {
  display: none !important;
}

.az-header-mods {
  position: relative;
  z-index: 8;
  min-width: min(500px, 32vw);
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.az-search-fallback,
.az-header-mods form:not(#login-form) {
  position: relative;
  display: flex !important;
  align-items: center;
  width: min(480px, 100%);
  height: 54px;
  gap: 0;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid rgba(126, 222, 255, .34);
  background:
    linear-gradient(135deg, rgba(5, 16, 36, .82), rgba(10, 49, 91, .48)),
    radial-gradient(circle at 15% 50%, rgba(84, 218, 255, .22), transparent 32%),
    rgba(1, 9, 22, .76);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.035),
    inset 0 0 26px rgba(52, 169, 255, .18),
    0 0 34px rgba(32, 150, 255, .24),
    0 12px 32px rgba(0,0,0,.28);
  overflow: hidden;
  backdrop-filter: blur(12px);
}

.az-search-fallback::before,
.az-header-mods form:not(#login-form)::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background:
    linear-gradient(110deg, transparent 0 18%, rgba(116, 226, 255, .32) 33%, transparent 50% 100%);
  transform: translateX(-75%);
  opacity: .72;
  pointer-events: none;
  animation: az-search-scan 6.5s linear infinite;
}

.az-search-fallback::after,
.az-header-mods form:not(#login-form)::after {
  content: '';
  position: absolute;
  left: 20px;
  right: 72px;
  bottom: 7px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(89, 221, 255, .7), transparent);
  opacity: .7;
  pointer-events: none;
}

@keyframes az-search-scan {
  0% { transform: translateX(-80%); }
  58% { transform: translateX(115%); }
  100% { transform: translateX(115%); }
}

.az-header-mods input[type='search'],
.az-header-mods input[type='text'],
.az-search-fallback input[type='search'] {
  position: relative;
  z-index: 2;
  flex: 1 1 auto;
  width: auto;
  max-width: none;
  min-width: 0;
  height: 100%;
  margin: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #f5fbff;
  padding: 0 18px 0 22px;
  border-radius: 999px;
  font-size: 14px;
  letter-spacing: .02em;
  box-shadow: none;
}

.az-header-mods input[type='search']:focus,
.az-header-mods input[type='text']:focus,
.az-search-fallback input[type='search']:focus {
  background: rgba(7, 22, 48, .36);
  box-shadow: inset 0 0 18px rgba(64, 188, 255, .16);
}

.az-search-fallback input::placeholder,
.az-header-mods input::placeholder {
  color: rgba(218, 240, 255, .78);
}

.az-header-mods button,
.az-search-fallback button {
  position: relative;
  z-index: 2;
  flex: 0 0 46px;
  width: 46px;
  height: 46px;
  display: inline-grid;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(129, 231, 255, .45);
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 28%, rgba(255,255,255,.28), transparent 24%),
    linear-gradient(180deg, #147eff, #073b91 72%);
  color: #fff;
  font-size: 0;
  font-weight: 900;
  cursor: pointer;
  box-shadow:
    0 0 22px rgba(41, 161, 255, .55),
    inset 0 0 14px rgba(255,255,255,.16);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.az-header-mods button::before,
.az-search-fallback button::before {
  content: '⌕';
  font-size: 22px;
  line-height: 1;
  transform: translateY(-1px);
  text-shadow: 0 0 12px rgba(255,255,255,.9);
}

.az-header-mods button:hover,
.az-search-fallback button:hover,
.az-header-mods form:not(#login-form):focus-within button,
.az-search-fallback:focus-within button {
  transform: translateY(-1px) scale(1.04);
  border-color: rgba(217, 252, 255, .9);
  box-shadow:
    0 0 36px rgba(70, 201, 255, .82),
    inset 0 0 18px rgba(255,255,255,.22);
}

.az-header-mods form:not(#login-form):focus-within,
.az-search-fallback:focus-within {
  border-color: rgba(205, 248, 255, .72);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.06),
    inset 0 0 34px rgba(64, 190, 255, .22),
    0 0 46px rgba(50, 178, 255, .42),
    0 14px 34px rgba(0,0,0,.3);
}

@media (max-width: 1200px) {
  .az-header-mods {
    min-width: min(390px, 36vw);
  }
  .az-search-fallback,
  .az-header-mods form:not(#login-form) {
    height: 48px;
  }
  .az-header-mods button,
  .az-search-fallback button {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }
}

@media (max-width: 760px) {
  .az-header-mods {
    display: none;
  }
}

/* v0.3.14 Phoenix search button icon refinement
   Build the search icon from CSS shapes so the magnifying glass is perfectly
   centered and occupies roughly 70% of the circular button. */
.az-header-mods button,
.az-search-fallback button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  overflow: visible;
}

.az-header-mods button::before,
.az-search-fallback button::before {
  content: '' !important;
  position: absolute;
  width: 23px;
  height: 23px;
  left: 50%;
  top: 50%;
  transform: translate(-55%, -55%);
  border: 3px solid #fff;
  border-radius: 50%;
  box-sizing: border-box;
  filter: drop-shadow(0 0 8px rgba(255,255,255,.88));
}

.az-header-mods button::after,
.az-search-fallback button::after {
  content: '';
  position: absolute;
  width: 13px;
  height: 3px;
  left: 50%;
  top: 50%;
  transform: translate(4px, 9px) rotate(45deg);
  transform-origin: left center;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 0 8px rgba(255,255,255,.88);
}


/* v0.3.15 Phoenix search icon sizing refinement
   Slightly reduce the CSS-drawn magnifying glass so it sits cleanly inside
   the circular button with a 2-3px visual safety margin. */
.az-header-mods button::before,
.az-search-fallback button::before {
  width: 19px !important;
  height: 19px !important;
  border-width: 3px !important;
  transform: translate(-58%, -58%) !important;
}

.az-header-mods button::after,
.az-search-fallback button::after {
  width: 10px !important;
  height: 3px !important;
  transform: translate(2px, 7px) rotate(45deg) !important;
}

@media (max-width: 1200px) {
  .az-header-mods button::before,
  .az-search-fallback button::before {
    width: 17px !important;
    height: 17px !important;
    border-width: 3px !important;
  }
  .az-header-mods button::after,
  .az-search-fallback button::after {
    width: 9px !important;
    height: 3px !important;
    transform: translate(2px, 6px) rotate(45deg) !important;
  }
}

/* v0.3.16 Phoenix futuristic topbar network icons
   Upgrade the social/menu symbols from plain glyphs into compact sci-fi buttons. */
.az-topline .az-top-actions {
  gap: 10px;
}

.az-topline .az-top-social .mod-menu,
.az-topline .az-top-social ul {
  gap: 8px;
}

.az-topline .az-top-social a {
  position: relative;
  isolation: isolate;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(107, 214, 255, .38);
  border-radius: 10px 4px 10px 4px;
  background:
    radial-gradient(circle at 32% 25%, rgba(97, 218, 255, .45), transparent 42%),
    linear-gradient(145deg, rgba(12, 72, 134, .88), rgba(2, 14, 35, .9));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    inset 0 -10px 22px rgba(0, 0, 0, .22),
    0 0 0 1px rgba(0, 0, 0, .25),
    0 0 14px rgba(47, 142, 255, .14);
  transform: translateZ(0);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.az-topline .az-top-social a::before {
  content: '' !important;
  position: absolute;
  inset: 3px;
  z-index: 0;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 8px 3px 8px 3px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.18), transparent 36%, rgba(80,212,255,.12) 68%, transparent 100%);
  opacity: .9;
  pointer-events: none;
}

.az-topline .az-top-social a::after {
  position: relative;
  z-index: 2;
  display: block;
  min-width: 1em;
  font-family: Inter, "Segoe UI Symbol", "Noto Sans Symbols", Arial, sans-serif;
  font-weight: 900;
  font-size: 14px !important;
  line-height: 1;
  color: #eefbff;
  text-align: center;
  letter-spacing: 0;
  text-shadow:
    0 0 8px rgba(86, 218, 255, .85),
    0 0 16px rgba(47, 142, 255, .45);
}

.az-topline .az-top-social a:hover,
.az-topline .az-top-social a:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(150, 232, 255, .74);
  background:
    radial-gradient(circle at 32% 25%, rgba(117, 234, 255, .58), transparent 42%),
    linear-gradient(145deg, rgba(22, 96, 170, .98), rgba(3, 20, 48, .95));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .24),
    0 0 0 1px rgba(73, 199, 255, .22),
    0 0 20px rgba(47, 142, 255, .38),
    0 0 38px rgba(80, 212, 255, .16);
}

.az-topline .az-top-social li:nth-child(1) a::after { content: '𝕏' !important; font-size: 13px !important; }
.az-topline .az-top-social li:nth-child(2) a::after { content: 'F' !important; font-size: 13px !important; }
.az-topline .az-top-social li:nth-child(3) a::after { content: '◎' !important; font-size: 15px !important; }
.az-topline .az-top-social li:nth-child(4) a::after { content: '▶' !important; font-size: 13px !important; transform: translateX(1px); }
.az-topline .az-top-social li:nth-child(5) a::after { content: '♬' !important; font-size: 13px !important; }
.az-topline .az-top-social li:nth-child(6) a::after { content: '⌬' !important; font-size: 14px !important; }
.az-topline .az-top-social li:nth-child(7) a::after { content: '</>' !important; font-size: 9px !important; letter-spacing: -.08em; }
.az-topline .az-top-social li:nth-child(8) a::after { content: 'RSS' !important; font-size: 8px !important; letter-spacing: .04em; }

.az-topline .az-login-link {
  height: 28px;
  padding: 0 13px;
  border-radius: 10px 4px 10px 4px;
  border-color: rgba(107, 214, 255, .38);
  background:
    radial-gradient(circle at 18% 20%, rgba(180, 80, 255, .34), transparent 36%),
    linear-gradient(145deg, rgba(12, 72, 134, .88), rgba(2, 14, 35, .9));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 14px rgba(47,142,255,.14);
}

.az-topline .az-login-link::before {
  content: '';
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 2px solid rgba(225, 244, 255, .92);
  box-shadow:
    0 0 8px rgba(86, 218, 255, .75),
    0 7px 0 -2px rgba(225, 244, 255, .92);
  transform: translateY(-2px);
}

@media (max-width: 760px) {
  .az-topline .az-top-social a {
    width: 26px !important;
    min-width: 26px !important;
    height: 26px !important;
  }
}

/* v0.3.17 Phoenix brand-color social icons
   Keep the futuristic glass buttons, but tint every symbol toward its
   recognizable platform color so the top network menu is easier to scan. */
.az-topline .az-top-social a::after {
  filter: drop-shadow(0 0 6px currentColor);
}

/* X */
.az-topline .az-top-social li:nth-child(1) a {
  background:
    radial-gradient(circle at 32% 25%, rgba(255,255,255,.18), transparent 42%),
    linear-gradient(145deg, rgba(22, 28, 38, .96), rgba(0, 0, 0, .92));
  border-color: rgba(255,255,255,.32);
}
.az-topline .az-top-social li:nth-child(1) a::after {
  content: '𝕏' !important;
  color: #ffffff;
  font-size: 13px !important;
  text-shadow: 0 0 7px rgba(255,255,255,.65);
}

/* Facebook */
.az-topline .az-top-social li:nth-child(2) a {
  background:
    radial-gradient(circle at 32% 25%, rgba(255,255,255,.24), transparent 42%),
    linear-gradient(145deg, rgba(24,119,242,.95), rgba(6, 45, 120, .94));
  border-color: rgba(118,177,255,.7);
}
.az-topline .az-top-social li:nth-child(2) a::after {
  content: 'f' !important;
  color: #ffffff;
  font-size: 17px !important;
  font-family: Arial, sans-serif;
  font-weight: 900;
  transform: translateY(1px);
  text-shadow: 0 0 8px rgba(255,255,255,.7);
}

/* Instagram */
.az-topline .az-top-social li:nth-child(3) a {
  background:
    radial-gradient(circle at 32% 25%, rgba(255,255,255,.28), transparent 38%),
    linear-gradient(145deg, #feda75 0%, #fa7e1e 23%, #d62976 48%, #962fbf 72%, #4f5bd5 100%);
  border-color: rgba(255,210,240,.74);
}
.az-topline .az-top-social li:nth-child(3) a::after {
  content: '◎' !important;
  color: #ffffff;
  font-size: 16px !important;
  text-shadow: 0 0 8px rgba(0,0,0,.35);
}

/* YouTube */
.az-topline .az-top-social li:nth-child(4) a {
  background:
    radial-gradient(circle at 32% 25%, rgba(255,255,255,.22), transparent 42%),
    linear-gradient(145deg, #ff1f1f, #8d0000);
  border-color: rgba(255,125,125,.72);
}
.az-topline .az-top-social li:nth-child(4) a::after {
  content: '▶' !important;
  color: #ffffff;
  font-size: 12px !important;
  transform: translateX(1px);
  text-shadow: 0 0 8px rgba(255,255,255,.65);
}

/* TikTok */
.az-topline .az-top-social li:nth-child(5) a {
  background:
    radial-gradient(circle at 30% 28%, rgba(0,242,234,.28), transparent 40%),
    radial-gradient(circle at 72% 74%, rgba(255,0,80,.3), transparent 42%),
    linear-gradient(145deg, rgba(8, 11, 18, .98), rgba(1, 2, 8, .95));
  border-color: rgba(0,242,234,.54);
}
.az-topline .az-top-social li:nth-child(5) a::after {
  content: '♪' !important;
  color: #ffffff;
  font-size: 15px !important;
  text-shadow:
    -2px 0 0 #00f2ea,
    2px 0 0 #ff0050,
    0 0 8px rgba(255,255,255,.5);
}

/* Discord */
.az-topline .az-top-social li:nth-child(6) a {
  background:
    radial-gradient(circle at 32% 25%, rgba(255,255,255,.2), transparent 42%),
    linear-gradient(145deg, #5865F2, #2630a8);
  border-color: rgba(149,157,255,.72);
}
.az-topline .az-top-social li:nth-child(6) a::after {
  content: '☻' !important;
  color: #ffffff;
  font-size: 14px !important;
  transform: translateY(-.5px);
  text-shadow: 0 0 8px rgba(255,255,255,.6);
}

/* GitHub */
.az-topline .az-top-social li:nth-child(7) a {
  background:
    radial-gradient(circle at 32% 25%, rgba(255,255,255,.2), transparent 42%),
    linear-gradient(145deg, #3b4450, #0d1117);
  border-color: rgba(210,220,235,.5);
}
.az-topline .az-top-social li:nth-child(7) a::after {
  content: 'GH' !important;
  color: #ffffff;
  font-size: 8px !important;
  letter-spacing: -.02em !important;
  text-shadow: 0 0 8px rgba(255,255,255,.65);
}

/* RSS */
.az-topline .az-top-social li:nth-child(8) a {
  background:
    radial-gradient(circle at 32% 25%, rgba(255,255,255,.25), transparent 42%),
    linear-gradient(145deg, #ff8a00, #b94400);
  border-color: rgba(255,194,111,.72);
}
.az-topline .az-top-social li:nth-child(8) a::after {
  content: 'RSS' !important;
  color: #ffffff;
  font-size: 8px !important;
  letter-spacing: .02em;
  text-shadow: 0 0 8px rgba(255,255,255,.58);
}

.az-topline .az-top-social a:hover,
.az-topline .az-top-social a:focus-visible {
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    0 0 0 1px rgba(255,255,255,.18),
    0 0 22px currentColor,
    0 0 42px rgba(80,212,255,.18);
}

/* v0.3.18 Phoenix crisp social icons
   Sharpen the topbar network icons: stronger contrast, less haze, richer brand colors. */
.az-topline .az-top-social a {
  filter: saturate(1.28) contrast(1.14) brightness(1.04) !important;
  border-width: 1px !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 0 -8px 16px rgba(0,0,0,.34),
    0 0 0 1px rgba(0,0,0,.45),
    0 0 10px rgba(47,142,255,.18) !important;
}

.az-topline .az-top-social a::before {
  inset: 2px !important;
  opacity: .42 !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.22), transparent 30%, transparent 70%, rgba(255,255,255,.06)) !important;
  border-color: rgba(255,255,255,.12) !important;
}

.az-topline .az-top-social a::after {
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  filter: none !important;
  text-shadow:
    0 1px 1px rgba(0,0,0,.72),
    0 0 5px currentColor !important;
}

.az-topline .az-top-social li:nth-child(1) a {
  background:
    linear-gradient(145deg, #2a2f38 0%, #07090d 100%) !important;
  border-color: rgba(245,250,255,.56) !important;
}
.az-topline .az-top-social li:nth-child(1) a::after {
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

.az-topline .az-top-social li:nth-child(2) a {
  background:
    linear-gradient(145deg, #2e8cff 0%, #0c4bb5 48%, #082862 100%) !important;
  border-color: rgba(145,200,255,.88) !important;
}
.az-topline .az-top-social li:nth-child(2) a::after {
  color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 950 !important;
}

.az-topline .az-top-social li:nth-child(3) a {
  background:
    radial-gradient(circle at 72% 18%, #ffe277 0 12%, transparent 15%),
    linear-gradient(145deg, #ff2f68 0%, #d62976 34%, #8a33d9 66%, #375aff 100%) !important;
  border-color: rgba(255,210,238,.92) !important;
}
.az-topline .az-top-social li:nth-child(3) a::after {
  content: '◎' !important;
  color: #ffffff !important;
  font-size: 17px !important;
  font-weight: 950 !important;
}

.az-topline .az-top-social li:nth-child(4) a {
  background:
    linear-gradient(145deg, #ff3636 0%, #e00000 45%, #8d0000 100%) !important;
  border-color: rgba(255,155,155,.9) !important;
}
.az-topline .az-top-social li:nth-child(4) a::after {
  color: #ffffff !important;
  font-size: 13px !important;
  transform: translateX(1px) !important;
}

.az-topline .az-top-social li:nth-child(5) a {
  background:
    radial-gradient(circle at 26% 22%, rgba(0,242,234,.55), transparent 38%),
    radial-gradient(circle at 72% 78%, rgba(255,0,80,.58), transparent 40%),
    linear-gradient(145deg, #151820 0%, #03050a 100%) !important;
  border-color: rgba(0,242,234,.86) !important;
}
.az-topline .az-top-social li:nth-child(5) a::after {
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  text-shadow:
    -1.4px 0 0 #00f2ea,
    1.4px 0 0 #ff0050,
    0 1px 1px rgba(0,0,0,.78) !important;
}

.az-topline .az-top-social li:nth-child(6) a {
  background:
    linear-gradient(145deg, #7280ff 0%, #5865f2 48%, #2830a8 100%) !important;
  border-color: rgba(180,187,255,.9) !important;
}
.az-topline .az-top-social li:nth-child(6) a::after {
  content: '●' !important;
  color: #ffffff !important;
  font-size: 15px !important;
}

.az-topline .az-top-social li:nth-child(7) a {
  background:
    linear-gradient(145deg, #5d6876 0%, #242b33 45%, #080b0f 100%) !important;
  border-color: rgba(235,242,255,.72) !important;
}
.az-topline .az-top-social li:nth-child(7) a::after {
  content: 'GH' !important;
  color: #ffffff !important;
  font-size: 8.5px !important;
  font-weight: 950 !important;
  letter-spacing: -.03em !important;
}

.az-topline .az-top-social li:nth-child(8) a {
  background:
    linear-gradient(145deg, #ffb02e 0%, #ff7a00 48%, #b33c00 100%) !important;
  border-color: rgba(255,215,145,.92) !important;
}
.az-topline .az-top-social li:nth-child(8) a::after {
  color: #ffffff !important;
  font-size: 8.5px !important;
  font-weight: 950 !important;
}

.az-topline .az-top-social a:hover,
.az-topline .az-top-social a:focus-visible {
  filter: saturate(1.45) contrast(1.22) brightness(1.1) !important;
  transform: translateY(-2px) scale(1.04) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -8px 16px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,255,255,.24),
    0 0 16px currentColor,
    0 0 32px rgba(80,212,255,.16) !important;
}

/* v0.3.19 Phoenix social icon border integration
   Make the topbar network button borders melt into the dark sci-fi background
   instead of reading as bright white outlines. Brand color remains inside. */
.az-topline .az-top-social a {
  border-color: rgba(60, 170, 255, .22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    inset 0 -8px 16px rgba(0,0,0,.38),
    0 0 0 1px rgba(0, 10, 24, .72),
    0 0 12px rgba(47,142,255,.13) !important;
}

.az-topline .az-top-social a::before {
  border-color: rgba(95, 190, 255, .10) !important;
  opacity: .34 !important;
}

.az-topline .az-top-social li:nth-child(1) a {
  border-color: rgba(180, 210, 235, .24) !important;
}
.az-topline .az-top-social li:nth-child(2) a {
  border-color: rgba(46, 140, 255, .34) !important;
}
.az-topline .az-top-social li:nth-child(3) a {
  border-color: rgba(218, 82, 205, .32) !important;
}
.az-topline .az-top-social li:nth-child(4) a {
  border-color: rgba(255, 58, 58, .34) !important;
}
.az-topline .az-top-social li:nth-child(5) a {
  border-color: rgba(0, 242, 234, .30) !important;
}
.az-topline .az-top-social li:nth-child(6) a {
  border-color: rgba(114, 128, 255, .34) !important;
}
.az-topline .az-top-social li:nth-child(7) a {
  border-color: rgba(170, 190, 210, .25) !important;
}
.az-topline .az-top-social li:nth-child(8) a {
  border-color: rgba(255, 122, 0, .34) !important;
}

.az-topline .az-top-social a:hover,
.az-topline .az-top-social a:focus-visible {
  border-color: rgba(98, 205, 255, .42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -8px 16px rgba(0,0,0,.30),
    0 0 0 1px rgba(34, 130, 255, .28),
    0 0 14px currentColor,
    0 0 28px rgba(80,212,255,.14) !important;
}

/* v0.3.20 — Futuristic latest headlines ribbon */
.az-topline {
  background:
    linear-gradient(90deg, rgba(4, 13, 28, .98), rgba(5, 20, 38, .96) 45%, rgba(3, 11, 23, .98)),
    repeating-linear-gradient(90deg, rgba(72, 190, 255, .07) 0 1px, transparent 1px 72px);
  box-shadow:
    inset 0 -1px 0 rgba(71, 203, 255, .18),
    0 8px 28px rgba(0, 0, 0, .28);
}
.az-topline::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0%, rgba(91, 219, 255, .12) 48%, transparent 55%),
    radial-gradient(circle at 25% 50%, rgba(47, 142, 255, .12), transparent 22%);
  opacity: .55;
  animation: azToplineScan 7s linear infinite;
}
@keyframes azToplineScan {
  0% { transform: translateX(-62%); }
  100% { transform: translateX(62%); }
}
.az-headlines {
  gap: 13px;
  mask-image: linear-gradient(90deg, #000 0 94%, transparent 100%);
}
.az-headlines span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 32px;
  padding: 0 18px 0 14px;
  border-radius: 6px;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%, 7px 50%);
  background:
    linear-gradient(180deg, rgba(57, 173, 255, .98), rgba(6, 83, 196, .98));
  border: 1px solid rgba(125, 224, 255, .55);
  color: #f4fbff;
  font-size: 12px;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .035em;
  text-shadow: 0 0 9px rgba(255, 255, 255, .42);
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, .24) inset,
    0 0 18px rgba(36, 145, 255, .46),
    0 5px 12px rgba(0, 0, 0, .22);
}
.az-headlines span::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #70f6ff;
  box-shadow:
    0 0 0 3px rgba(112, 246, 255, .12),
    0 0 12px rgba(112, 246, 255, .95);
  animation: azLivePulse 1.8s ease-in-out infinite;
}
.az-headlines span::after {
  content: '';
  position: absolute;
  inset: 1px auto 1px 9px;
  width: 42%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .28), transparent);
  transform: skewX(-18deg) translateX(-150%);
  animation: azHeadlineSheen 4s ease-in-out infinite;
}
@keyframes azLivePulse {
  0%, 100% { opacity: .55; transform: scale(.82); }
  50% { opacity: 1; transform: scale(1.15); }
}
@keyframes azHeadlineSheen {
  0%, 60% { transform: skewX(-18deg) translateX(-150%); }
  82%, 100% { transform: skewX(-18deg) translateX(210%); }
}
.az-headlines a {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 14px 0 20px;
  color: #eaf7ff;
  border: 1px solid rgba(91, 203, 255, .14);
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(11, 38, 67, .54), rgba(4, 16, 31, .28));
  box-shadow: inset 0 0 12px rgba(77, 185, 255, .04);
  transition: border-color .18s ease, color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.az-headlines a::before {
  content: '';
  position: absolute;
  left: 8px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #71ddff;
  border-right: 1px solid #71ddff;
  transform: rotate(45deg);
  margin: 0;
  opacity: .9;
  filter: drop-shadow(0 0 5px rgba(113, 221, 255, .8));
}
.az-headlines a::after {
  content: '';
  position: absolute;
  right: -10px;
  top: 50%;
  width: 1px;
  height: 16px;
  transform: translateY(-50%);
  background: linear-gradient(180deg, transparent, rgba(90, 202, 255, .5), transparent);
}
.az-headlines a:hover,
.az-headlines a:focus-visible {
  color: #ffffff;
  border-color: rgba(114, 226, 255, .42);
  background: linear-gradient(180deg, rgba(15, 71, 116, .62), rgba(8, 30, 55, .42));
  box-shadow:
    inset 0 0 20px rgba(78, 186, 255, .14),
    0 0 16px rgba(45, 152, 255, .22);
  transform: translateY(-1px);
}
@media (max-width: 760px) {
  .az-headlines span { min-height: 30px; padding-inline: 13px 16px; font-size: 11px; }
  .az-headlines a { min-height: 28px; padding-inline: 18px 12px; }
}

/* v0.3.21 — Darker, more integrated latest-headlines badge */
.az-headlines span {
  background:
    linear-gradient(180deg, rgba(23, 103, 197, .92), rgba(5, 48, 118, .96)) !important;
  border-color: rgba(73, 185, 255, .38) !important;
  color: #eef9ff !important;
  text-shadow: 0 0 7px rgba(210, 242, 255, .32) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .13),
    inset 0 -8px 18px rgba(0, 15, 42, .34),
    0 0 0 1px rgba(0, 0, 0, .22),
    0 0 12px rgba(22, 112, 218, .22),
    0 4px 10px rgba(0, 0, 0, .20) !important;
}
.az-headlines span::before {
  background: #62e8ff !important;
  box-shadow:
    0 0 0 3px rgba(98, 232, 255, .10),
    0 0 10px rgba(98, 232, 255, .72) !important;
}
.az-headlines span::after {
  opacity: .52 !important;
  background: linear-gradient(90deg, transparent, rgba(173, 231, 255, .20), transparent) !important;
}

/* v0.3.22 — darker inverted-3D sci-fi main navigation */
.az-nav {
  position: sticky;
  top: 0;
  z-index: 18;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% -65%, rgba(83, 206, 255, .42) 0%, rgba(16, 111, 221, .20) 28%, transparent 62%),
    linear-gradient(180deg,
      #021226 0%,
      #06315f 13%,
      #0b61bf 46%,
      #052b63 51%,
      #031b3d 76%,
      #020b18 100%);
  border-top: 1px solid rgba(94, 210, 255, .30);
  border-bottom: 1px solid rgba(0, 8, 20, .95);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    inset 0 8px 18px rgba(48, 164, 255, .15),
    inset 0 -12px 22px rgba(0, 7, 20, .72),
    0 12px 26px rgba(0, 0, 0, .48);
}
.az-nav::before,
.az-nav::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.az-nav::before {
  background:
    repeating-linear-gradient(90deg, rgba(121, 217, 255, .075) 0 1px, transparent 1px 86px),
    linear-gradient(90deg, transparent, rgba(119, 224, 255, .12), transparent);
  opacity: .42;
  mix-blend-mode: screen;
}
.az-nav::after {
  inset: auto 0 0 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(82, 213, 255, .85), rgba(39, 127, 255, .55), transparent);
  box-shadow: 0 0 14px rgba(64, 185, 255, .62);
  opacity: .75;
}
.az-nav-shell {
  position: relative;
  z-index: 1;
  min-height: 52px;
}
.az-nav .mod-menu,
.az-nav ul {
  min-height: 52px;
}
.az-nav .mod-menu > li,
.az-nav ul > li {
  position: relative;
  isolation: isolate;
}
.az-nav .mod-menu > li::before,
.az-nav ul > li::before {
  content: '';
  position: absolute;
  inset: 7px 3px;
  z-index: -1;
  border-radius: 4px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 34%),
    linear-gradient(180deg, rgba(12, 61, 121, .28), rgba(0, 11, 29, .16));
  border: 1px solid rgba(84, 199, 255, .08);
  transform: skewX(-10deg);
  opacity: .36;
  transition: opacity .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease, transform .18s ease;
}
.az-nav .mod-menu > li::after,
.az-nav ul > li::after {
  content: '';
  position: absolute;
  top: 8px;
  bottom: 8px;
  right: -1px;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(129, 225, 255, .22), rgba(0,0,0,.3), transparent);
}
.az-nav .mod-menu > li > a,
.az-nav .mod-menu > li > span,
.az-nav ul > li > a,
.az-nav ul > li > span {
  min-height: 52px;
  padding: 0 18px;
  color: #eaf7ff;
  border-left: 0;
  letter-spacing: .045em;
  text-shadow:
    0 1px 1px rgba(0, 0, 0, .92),
    0 0 9px rgba(74, 190, 255, .22);
  transition: color .18s ease, text-shadow .18s ease, transform .18s ease;
}
.az-nav .mod-menu > li > a::before,
.az-nav .mod-menu > li > span::before,
.az-nav ul > li > a::before,
.az-nav ul > li > span::before {
  content: '';
  position: absolute;
  left: 13px;
  right: 13px;
  top: 8px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(185, 241, 255, .46), transparent);
  opacity: .30;
  transform: scaleX(.62);
  transition: opacity .18s ease, transform .18s ease;
}
.az-nav .mod-menu a:hover,
.az-nav .mod-menu .current > a,
.az-nav ul a:hover,
.az-nav ul .current > a {
  color: #fff;
  background: transparent !important;
  text-shadow:
    0 0 8px rgba(255, 255, 255, .35),
    0 0 18px rgba(64, 198, 255, .55),
    0 1px 1px rgba(0, 0, 0, .9);
  transform: translateY(-1px);
}
.az-nav .mod-menu > li:hover::before,
.az-nav .mod-menu > li.current::before,
.az-nav ul > li:hover::before,
.az-nav ul > li.current::before {
  opacity: 1;
  border-color: rgba(101, 219, 255, .42);
  background:
    linear-gradient(180deg, rgba(137, 226, 255, .22), rgba(22, 104, 205, .28) 42%, rgba(0, 14, 38, .42)),
    linear-gradient(90deg, rgba(0, 200, 255, .08), rgba(46, 117, 255, .16), rgba(0, 200, 255, .08));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .18),
    inset 0 -10px 18px rgba(0, 8, 24, .52),
    0 0 13px rgba(37, 151, 255, .38);
  transform: skewX(-10deg) translateY(-1px);
}
.az-nav .mod-menu > li:hover > a::before,
.az-nav .mod-menu > li.current > a::before,
.az-nav ul > li:hover > a::before,
.az-nav ul > li.current > a::before {
  opacity: .9;
  transform: scaleX(1);
}
.az-nav .mod-menu .current > a,
.az-nav ul .current > a {
  color: #ffffff;
}
@media (max-width: 1500px) {
  .az-nav-shell,
  .az-nav .mod-menu,
  .az-nav ul { min-height: 50px; }
  .az-nav .mod-menu > li > a,
  .az-nav .mod-menu > li > span,
  .az-nav ul > li > a,
  .az-nav ul > li > span { min-height: 50px; padding: 0 13px; }
}
@media (max-width: 760px) {
  .az-nav { overflow: visible; }
  .az-nav::before { opacity: .28; }
  .az-mobile-toggle {
    background:
      linear-gradient(180deg, rgba(23, 111, 221, .95), rgba(4, 41, 99, .98));
    border: 1px solid rgba(103, 217, 255, .35);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 0 16px rgba(34,140,255,.22);
  }
  .az-nav .mod-menu > li::before,
  .az-nav ul > li::before { inset: 5px 8px; transform: none; }
  .az-nav .mod-menu > li:hover::before,
  .az-nav .mod-menu > li.current::before,
  .az-nav ul > li:hover::before,
  .az-nav ul > li.current::before { transform: none; }
  .az-nav .mod-menu > li > a,
  .az-nav ul > li > a { min-height: 46px; }
}


/* v0.3.23 — Compact futuristic breaking news ribbon */
.az-breaking {
  padding: 4px 0 !important;
  background:
    linear-gradient(180deg, rgba(1, 12, 30, .96), rgba(2, 20, 43, .98)) !important;
  border-top: 1px solid rgba(73, 194, 255, .12);
  border-bottom: 1px solid rgba(73, 194, 255, .22) !important;
}
.az-breaking-inner {
  min-height: 28px;
  gap: 12px !important;
  padding: 3px 8px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(64, 180, 255, .26) !important;
  background:
    linear-gradient(180deg, rgba(6, 34, 70, .62), rgba(2, 18, 43, .86)),
    repeating-linear-gradient(90deg, rgba(101, 219, 255, .045) 0 1px, transparent 1px 54px) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -12px 20px rgba(0,0,0,.28),
    0 0 18px rgba(23, 129, 255, .12) !important;
  overflow: hidden;
  position: relative;
}
.az-breaking-inner::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(99, 218, 255, .12), transparent);
  transform: translateX(-120%);
  animation: azBreakingScan 7s linear infinite;
}
@keyframes azBreakingScan {
  0% { transform: translateX(-120%); }
  45%,100% { transform: translateX(120%); }
}
.az-breaking-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 22px;
  padding: 4px 13px 4px 11px !important;
  border-radius: 6px 10px 10px 6px !important;
  color: #e9f8ff;
  font-size: 11px;
  line-height: 1;
  letter-spacing: .065em;
  background:
    linear-gradient(180deg, #0a4fa4 0%, #06326e 54%, #041f49 100%) !important;
  border: 1px solid rgba(93, 207, 255, .26);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -8px 14px rgba(0,0,0,.28),
    0 0 14px rgba(24, 120, 255, .16) !important;
  position: relative;
  clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 50%, calc(100% - 9px) 100%, 0 100%);
}
.az-breaking-label::before {
  content: '';
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #7df5ff;
  box-shadow: 0 0 8px rgba(125, 245, 255, .75);
}
.az-ticker {
  gap: 22px !important;
  font-size: 12px;
  line-height: 1.25;
  color: rgba(230, 246, 255, .9) !important;
}
.az-ticker span::before,
.az-ticker p::before {
  content: '›' !important;
  color: #5ee7ff !important;
  margin-right: 10px !important;
  text-shadow: 0 0 8px rgba(94, 231, 255, .4);
}
@media (max-width: 760px) {
  .az-breaking { padding: 6px 0 !important; }
  .az-breaking-inner { min-height: 30px; padding: 5px 8px !important; }
  .az-breaking-label { font-size: 10px; padding: 5px 12px 5px 10px !important; }
  .az-ticker { font-size: 12px; }
}

/* v0.3.24 — Breaking News readability and spacing refinement */
.az-breaking {
  padding: 5px 0 !important;
}
.az-breaking-inner {
  min-height: 30px !important;
  padding: 4px 10px !important;
}
.az-breaking-label {
  min-height: 24px !important;
  padding: 5px 15px 5px 12px !important;
  font-size: 13px !important;
  letter-spacing: .06em;
}
.az-breaking-label::before {
  width: 6px;
  height: 6px;
}
.az-ticker {
  font-size: 14px !important;
  line-height: 1.3 !important;
}
.az-menu-home .az-site-main {
  padding-top: 24px !important;
}
.az-menu-home .az-layout {
  margin-top: 0 !important;
}
@media (max-width: 760px) {
  .az-breaking { padding: 6px 0 !important; }
  .az-breaking-inner { min-height: 32px !important; padding: 5px 9px !important; }
  .az-breaking-label { font-size: 12px !important; min-height: 24px !important; }
  .az-ticker { font-size: 13px !important; }
  .az-menu-home .az-site-main { padding-top: 18px !important; }
}

/* v0.3.25 — Futuristic sci-fi Explore Categories tiles
   Turns the category launcher into darker holographic command tiles with
   stronger depth, neon accents, animated scan highlights and line-art icons. */
.az-category-card {
  overflow: hidden;
  position: relative;
  background:
    radial-gradient(circle at 12% 0%, rgba(47, 180, 255, .18), transparent 34%),
    radial-gradient(circle at 88% 100%, rgba(69, 101, 255, .15), transparent 35%),
    linear-gradient(180deg, rgba(9, 31, 57, .96), rgba(4, 18, 34, .98));
}
.az-category-card::before {
  content: "";
  position: absolute;
  inset: 44px 0 0;
  pointer-events: none;
  opacity: .33;
  background:
    linear-gradient(90deg, rgba(95, 211, 255, .09) 1px, transparent 1px),
    linear-gradient(180deg, rgba(95, 211, 255, .06) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(180deg, transparent, #000 20%, #000 70%, transparent);
}
.az-category-card .az-cats {
  position: relative;
  z-index: 1;
  gap: 14px;
  padding: 18px 20px 20px;
}
.az-cats a {
  min-height: 112px;
  isolation: isolate;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border-radius: 14px;
  border: 1px solid rgba(105, 210, 255, .28);
  color: #f4fbff;
  text-decoration: none;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .13), transparent 32%),
    linear-gradient(180deg, rgba(14, 82, 168, .94), rgba(5, 39, 92, .98));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .26),
    inset 0 -18px 30px rgba(0, 0, 0, .22),
    0 12px 24px rgba(0, 0, 0, .22),
    0 0 0 1px rgba(23, 139, 255, .10);
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
  transform: translateZ(0);
}
.az-cats a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, .36), transparent 38%),
    linear-gradient(120deg, transparent 0 18%, rgba(255, 255, 255, .16) 24%, transparent 34% 100%);
  opacity: .52;
}
.az-cats a::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 10px;
  height: 2px;
  border-radius: 99px;
  background: linear-gradient(90deg, transparent, rgba(170, 237, 255, .78), transparent);
  opacity: .48;
  box-shadow: 0 0 14px rgba(56, 184, 255, .55);
}
.az-cats a:hover {
  transform: translateY(-4px) scale(1.01);
  filter: brightness(1.08) saturate(1.12);
  border-color: rgba(170, 235, 255, .55);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .32),
    inset 0 -18px 30px rgba(0, 0, 0, .20),
    0 16px 30px rgba(0, 0, 0, .32),
    0 0 24px rgba(42, 157, 255, .24);
}
.az-cats b {
  width: 42px;
  height: 42px;
  margin: 0 auto 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 13px;
  font-size: 0;
  color: #f6fdff;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .24), rgba(255, 255, 255, .05)),
    rgba(0, 18, 40, .25);
  border: 1px solid rgba(223, 250, 255, .40);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .28),
    0 0 18px rgba(157, 229, 255, .30);
}
.az-cats b::before {
  font-size: 24px;
  line-height: 1;
  color: #f8fdff;
  text-shadow: 0 0 9px rgba(190, 240, 255, .75), 0 2px 8px rgba(0, 0, 0, .40);
  font-family: Arial, Helvetica, sans-serif;
}
.az-cats span {
  margin-top: 0;
  font-size: 15px;
  letter-spacing: .2px;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .38);
}
.az-cats small {
  font-size: 10px;
  letter-spacing: .35px;
  text-transform: uppercase;
  opacity: .82;
}
.az-cats a:nth-child(1) { background: linear-gradient(180deg, #148dff, #07489f); }
.az-cats a:nth-child(2) { background: linear-gradient(180deg, #7f43e5, #421582); }
.az-cats a:nth-child(3) { background: linear-gradient(180deg, #f44646, #8e1520); }
.az-cats a:nth-child(4) { background: linear-gradient(180deg, #dd44cf, #82166f); }
.az-cats a:nth-child(5) { background: linear-gradient(180deg, #ff9d2a, #ad4e06); }
.az-cats a:nth-child(6) { background: linear-gradient(180deg, #3bc88c, #116e50); }
.az-cats a:nth-child(7) { background: linear-gradient(180deg, #53b4f0, #1a5e9c); }
.az-cats a:nth-child(8) { background: linear-gradient(180deg, #5e64e4, #28319b); }
.az-cats a:nth-child(1) b::before { content: "▤"; }
.az-cats a:nth-child(2) b::before { content: "▥"; }
.az-cats a:nth-child(3) b::before { content: "▶"; font-size: 25px; transform: translateX(2px); }
.az-cats a:nth-child(4) b::before { content: "♪"; font-size: 27px; }
.az-cats a:nth-child(5) b::before { content: "✦"; font-size: 25px; }
.az-cats a:nth-child(6) b::before { content: "◇"; font-size: 27px; }
.az-cats a:nth-child(7) b::before { content: "⇩"; font-size: 27px; }
.az-cats a:nth-child(8) b::before { content: "⚙"; font-size: 24px; }

@media (max-width: 1100px) {
  .az-cats a { min-height: 104px; }
  .az-cats b { width: 38px; height: 38px; }
  .az-cats span { font-size: 14px; }
}

@media (max-width: 760px) {
  .az-category-card .az-cats { gap: 10px; padding: 14px; }
  .az-cats a { min-height: 96px; border-radius: 12px; }
}


/* v0.3.26 — Recognisable sci-fi category icons
   Replaces the abstract category marks with crisp line-art symbols that still
   read clearly at small size, while keeping the holographic command-tile feel. */
.az-cats b {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  clip-path: polygon(12% 0, 88% 0, 100% 12%, 100% 88%, 88% 100%, 12% 100%, 0 88%, 0 12%);
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.34), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(3,18,38,.32));
  border: 1px solid rgba(190, 240, 255, .34);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -10px 18px rgba(0,0,0,.25),
    0 0 0 1px rgba(26, 169, 255, .12),
    0 0 18px rgba(72, 194, 255, .22);
}
.az-cats b::before {
  content: "" !important;
  display: block;
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 0 5px rgba(196, 242, 255, .78)) drop-shadow(0 2px 3px rgba(0,0,0,.35));
  opacity: .98;
  transform: none !important;
}
.az-cats b::after {
  content: "";
  position: absolute;
  width: 26px;
  height: 1px;
  left: 10px;
  top: 10px;
  background: linear-gradient(90deg, transparent, rgba(182, 239, 255, .88), transparent);
  transform: rotate(-28deg);
  opacity: .42;
  box-shadow: 0 0 8px rgba(78, 201, 255, .5);
}
.az-cats a:nth-child(1) b::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27none%27%20stroke%3D%27%2523f7fcff%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%275%27%20y%3D%276%27%20width%3D%2722%27%20height%3D%2720%27%20rx%3D%272.4%27%2F%3E%3Cpath%20d%3D%27M10%2011h12M10%2016h12M10%2021h7%27%2F%3E%3Crect%20x%3D%2720.5%27%20y%3D%2719%27%20width%3D%273.5%27%20height%3D%273.5%27%20rx%3D%27.5%27%2F%3E%3C%2Fsvg%3E"); }
.az-cats a:nth-child(2) b::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27none%27%20stroke%3D%27%2523f7fcff%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M5%208.5c3-1.6%207-1.3%2011%201.1v17c-4-2.4-8-2.7-11-1.1z%27%2F%3E%3Cpath%20d%3D%27M16%209.6c4-2.4%208-2.7%2011-1.1v17c-3-1.6-7-1.3-11%201.1z%27%2F%3E%3Cpath%20d%3D%27M10%2013h2.8M10%2017h3M20%2013h3M20%2017h3%27%2F%3E%3C%2Fsvg%3E"); }
.az-cats a:nth-child(3) b::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27none%27%20stroke%3D%27%2523f7fcff%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%274.5%27%20y%3D%277%27%20width%3D%2723%27%20height%3D%2718%27%20rx%3D%273%27%2F%3E%3Cpath%20d%3D%27M14%2012l7%204-7%204z%27%20fill%3D%27%2523f7fcff%27%20stroke%3D%27none%27%2F%3E%3Cpath%20d%3D%27M8%205v3M24%205v3M8%2024v3M24%2024v3%27%2F%3E%3C%2Fsvg%3E"); width: 31px; height: 31px; }
.az-cats a:nth-child(4) b::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27none%27%20stroke%3D%27%2523f7fcff%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20%207v14.2a4%204%200%201%201-2-3.45V10l8-2v11.2a4%204%200%201%201-2-3.45V6.5z%27%2F%3E%3Cpath%20d%3D%27M20%2010l8-2%27%2F%3E%3C%2Fsvg%3E"); width: 31px; height: 31px; }
.az-cats a:nth-child(5) b::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27none%27%20stroke%3D%27%2523f7fcff%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9.2%2014h13.6c3.7%200%205.7%203.7%204.6%208.2-.6%202.6-3.2%203.4-5%201.4l-1.7-1.9h-9.4l-1.7%201.9c-1.8%202-4.4%201.2-5-1.4C3.5%2017.7%205.5%2014%209.2%2014z%27%2F%3E%3Cpath%20d%3D%27M10%2018h5M12.5%2015.5v5M21%2018.2h.1M24%2020.7h.1%27%2F%3E%3C%2Fsvg%3E"); width: 32px; height: 32px; }
.az-cats a:nth-child(6) b::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27none%27%20stroke%3D%27%2523f7fcff%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3.5%2012L16%206l12.5%206L16%2018z%27%2F%3E%3Cpath%20d%3D%27M8%2015v6c4.8%203.2%2011.2%203.2%2016%200v-6%27%2F%3E%3Cpath%20d%3D%27M27%2013v7%27%2F%3E%3Ccircle%20cx%3D%2727%27%20cy%3D%2723%27%20r%3D%271.4%27%20fill%3D%27%2523f7fcff%27%20stroke%3D%27none%27%2F%3E%3C%2Fsvg%3E"); width: 32px; height: 32px; }
.az-cats a:nth-child(7) b::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27none%27%20stroke%3D%27%2523f7fcff%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M16%205v14%27%2F%3E%3Cpath%20d%3D%27M10%2013l6%206%206-6%27%2F%3E%3Cpath%20d%3D%27M6%2021v4h20v-4%27%2F%3E%3Cpath%20d%3D%27M9%2025h14%27%2F%3E%3C%2Fsvg%3E"); }
.az-cats a:nth-child(8) b::before { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27none%27%20stroke%3D%27%2523f7fcff%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M17.8%204.8l.8%203.1a9%209%200%200%201%202%201.1l3-1%202.1%203.7-2.2%202.2a8.4%208.4%200%200%201%200%202.2l2.2%202.2-2.1%203.7-3-1a9%209%200%200%201-2%201.1l-.8%203.1h-4.3l-.8-3.1a9%209%200%200%201-2-1.1l-3%201-2.1-3.7%202.2-2.2a8.4%208.4%200%200%201%200-2.2l-2.2-2.2L7.7%208l3%201a9%209%200%200%201%202-1.1l.8-3.1z%27%2F%3E%3Ccircle%20cx%3D%2716%27%20cy%3D%2716%27%20r%3D%273.6%27%2F%3E%3C%2Fsvg%3E"); }
.az-cats a:hover b {
  border-color: rgba(222, 252, 255, .58);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.38),
    inset 0 -10px 18px rgba(0,0,0,.22),
    0 0 0 1px rgba(118, 218, 255, .22),
    0 0 24px rgba(98, 212, 255, .38);
}
@media (max-width: 1100px) {
  .az-cats b { width: 42px; height: 42px; }
  .az-cats b::before { width: 27px; height: 27px; }
}


/* v0.3.27 — Category icon visibility fix
   Previous data-URI icons were not rendering in some browsers because the SVG
   color was over-encoded. Use CSS masks with high-contrast holographic fills so
   the icons stay visible, sharp and recognisable on every category tile. */
.az-cats b {
  position: relative;
  overflow: hidden;
}
.az-cats b::before {
  content: "" !important;
  width: 30px !important;
  height: 30px !important;
  display: block !important;
  background-image: none !important;
  background: linear-gradient(180deg, #ffffff 0%, #dff8ff 45%, #79d9ff 100%) !important;
  -webkit-mask: var(--az-cat-icon) center / contain no-repeat;
  mask: var(--az-cat-icon) center / contain no-repeat;
  filter: drop-shadow(0 0 5px rgba(187,240,255,.95)) drop-shadow(0 2px 2px rgba(0,0,0,.45));
  opacity: 1 !important;
  transform: none !important;
}
.az-cats b::after {
  z-index: 1;
  pointer-events: none;
}
.az-cats a:nth-child(1) b { --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M5%206h22v20H5z%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.4%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M10%2011h12M10%2016h12M10%2021h7%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.4%27%20stroke-linecap%3D%27round%27%2F%3E%3Cpath%20d%3D%27M20.5%2019h3.5v3.5h-3.5z%27%20fill%3D%27black%27%2F%3E%20%3C%2Fsvg%3E"); }
.az-cats a:nth-child(2) b { --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M5%208.5c3-1.6%207-1.3%2011%201.1v17c-4-2.4-8-2.7-11-1.1zM16%209.6c4-2.4%208-2.7%2011-1.1v17c-3-1.6-7-1.3-11%201.1z%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.4%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M10%2013h3M10%2017h3M20%2013h3M20%2017h3%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%2F%3E%20%3C%2Fsvg%3E"); }
.az-cats a:nth-child(3) b { --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Crect%20x%3D%274.5%27%20y%3D%277%27%20width%3D%2723%27%20height%3D%2718%27%20rx%3D%273%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.4%27%2F%3E%3Cpath%20d%3D%27M14%2012l8%204-8%204z%27%20fill%3D%27black%27%2F%3E%3Cpath%20d%3D%27M8%205v3M24%205v3M8%2024v3M24%2024v3%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%2F%3E%20%3C%2Fsvg%3E"); }
.az-cats a:nth-child(4) b { --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M20%207v14.3a4.2%204.2%200%201%201-2.2-3.7V10l8.2-2v11.3a4.2%204.2%200%201%201-2.2-3.7V6.5z%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.4%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M20%2010l8-2%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.4%27%20stroke-linecap%3D%27round%27%2F%3E%20%3C%2Fsvg%3E"); }
.az-cats a:nth-child(5) b { --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M9.2%2014h13.6c3.7%200%205.7%203.7%204.6%208.2-.6%202.6-3.2%203.4-5%201.4l-1.7-1.9h-9.4l-1.7%201.9c-1.8%202-4.4%201.2-5-1.4C3.5%2017.7%205.5%2014%209.2%2014z%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.4%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M10%2018h5M12.5%2015.5v5%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%2F%3E%3Ccircle%20cx%3D%2721.5%27%20cy%3D%2718.5%27%20r%3D%271.5%27%20fill%3D%27black%27%2F%3E%3Ccircle%20cx%3D%2724.5%27%20cy%3D%2720.8%27%20r%3D%271.5%27%20fill%3D%27black%27%2F%3E%20%3C%2Fsvg%3E"); }
.az-cats a:nth-child(6) b { --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M3.5%2012L16%206l12.5%206L16%2018zM8%2015v6c4.8%203.2%2011.2%203.2%2016%200v-6%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.4%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M27%2013v7%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%2F%3E%3Ccircle%20cx%3D%2727%27%20cy%3D%2723%27%20r%3D%271.8%27%20fill%3D%27black%27%2F%3E%20%3C%2Fsvg%3E"); }
.az-cats a:nth-child(7) b { --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M16%205v14M10%2013l6%206%206-6M6%2021v4h20v-4M9%2025h14%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%20%3C%2Fsvg%3E"); }
.az-cats a:nth-child(8) b { --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M17.8%204.8l.8%203.1a9%209%200%200%201%202%201.1l3-1%202.1%203.7-2.2%202.2a8.4%208.4%200%200%201%200%202.2l2.2%202.2-2.1%203.7-3-1a9%209%200%200%201-2%201.1l-.8%203.1h-4.3l-.8-3.1a9%209%200%200%201-2-1.1l-3%201-2.1-3.7%202.2-2.2a8.4%208.4%200%200%201%200-2.2l-2.2-2.2L7.7%208l3%201a9%209%200%200%201%202-1.1l.8-3.1z%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.2%27%20stroke-linejoin%3D%27round%27%2F%3E%3Ccircle%20cx%3D%2716%27%20cy%3D%2716%27%20r%3D%273.7%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.3%27%2F%3E%20%3C%2Fsvg%3E"); }

@media (max-width: 1100px) {
  .az-cats b::before { width: 27px !important; height: 27px !important; }
}


/* v0.3.28 — Category icon proportion refinement
   Games icon: slightly narrower/taller gamepad so it visually matches the other icons.
   Music icon: clearer paired music notes while keeping the holographic sci-fi mask style. */
.az-cats a:nth-child(4) b { 
  --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M12%207v14.2a4%204%200%201%201-2.6-3.8V10.5l13-2.7v11.4a4%204%200%201%201-2.6-3.8v-7.6z%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M12%2011l13-2.8M12%2014.3l13-2.8%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%2F%3E%3Ccircle%20cx%3D%278.7%27%20cy%3D%2721.1%27%20r%3D%273.2%27%20fill%3D%27black%27%2F%3E%3Ccircle%20cx%3D%2721.3%27%20cy%3D%2720.1%27%20r%3D%273.2%27%20fill%3D%27black%27%2F%3E%3C%2Fsvg%3E") !important;
}
.az-cats a:nth-child(4) b::before {
  width: 29px !important;
  height: 29px !important;
}
.az-cats a:nth-child(5) b { 
  --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20d%3D%27M10%2011h12c3.4%200%205.8%203.3%205.2%207.2l-.7%204.4c-.5%203.1-3.9%204-6%201.7l-1.8-2H13.3l-1.8%202c-2.1%202.3-5.5%201.4-6-1.7l-.7-4.4C4.2%2014.3%206.6%2011%2010%2011z%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.45%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M10.5%2017h5M13%2014.5v5%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272.3%27%20stroke-linecap%3D%27round%27%2F%3E%3Ccircle%20cx%3D%2720.6%27%20cy%3D%2716.6%27%20r%3D%271.35%27%20fill%3D%27black%27%2F%3E%3Ccircle%20cx%3D%2724%27%20cy%3D%2719.3%27%20r%3D%271.35%27%20fill%3D%27black%27%2F%3E%3Cpath%20d%3D%27M13%2011l1.5-2h3L19%2011%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E") !important;
}
.az-cats a:nth-child(5) b::before {
  width: 29px !important;
  height: 29px !important;
}
@media (max-width: 1100px) {
  .az-cats a:nth-child(4) b::before,
  .az-cats a:nth-child(5) b::before { width: 27px !important; height: 27px !important; }
}


/* v0.3.29 — Category icon micro refinement
   Music: replace the abstract note mark with a clearer paired-note silhouette.
   Games: increase the controller icon by 1px for better visual weight. */
.az-cats a:nth-child(4) b {
  --az-cat-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2032%2032%27%3E%3Cpath%20fill%3D%27black%27%20d%3D%27M11%207.2c0-.8.6-1.4%201.4-1.4h12c.8%200%201.4.6%201.4%201.4v4.4c0%20.7-.5%201.2-1.1%201.4L13.8%2015v6.1a4.6%204.6%200%201%201-3.2-4.4V7.2zM13.8%208.8v3.4l9.2-1.7V8.8h-9.2zm9.2%203.9%202.8-.5v9a4.6%204.6%200%201%201-2.8-4.2v-4.3z%27%2F%3E%3C%2Fsvg%3E") !important;
}
.az-cats a:nth-child(4) b::before {
  width: 30px !important;
  height: 30px !important;
}
.az-cats a:nth-child(5) b::before {
  width: 30px !important;
  height: 30px !important;
}
@media (max-width: 1100px) {
  .az-cats a:nth-child(4) b::before { width: 28px !important; height: 28px !important; }
  .az-cats a:nth-child(5) b::before { width: 28px !important; height: 28px !important; }
}

/* v0.3.30 — Category launcher micro-polish
   Games icon: +1px visual weight.
   Category underline: move separator between the title and subtitle instead of under the subtitle. */
.az-cats a::after {
  display: none !important;
}
.az-cats small {
  position: relative !important;
  margin-top: 3px !important;
  padding-top: 6px !important;
  line-height: 1.15 !important;
}
.az-cats small::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: min(76px, 72%);
  height: 1px;
  transform: translateX(-50%);
  border-radius: 99px;
  background: linear-gradient(90deg, transparent, rgba(210, 248, 255, .78), transparent);
  box-shadow: 0 0 8px rgba(69, 202, 255, .42);
  opacity: .72;
}
.az-cats a:nth-child(5) b::before {
  width: 31px !important;
  height: 31px !important;
}
@media (max-width: 1100px) {
  .az-cats a:nth-child(5) b::before {
    width: 29px !important;
    height: 29px !important;
  }
}

/* v0.3.31 Phoenix footer LCARS + brand hover polish
   Customized LCARS-inspired footer accents that still match the Aresenya blue sci-fi theme. */
.az-footer {
  position: relative;
  overflow: hidden;
  padding: 40px 0 14px;
  background:
    radial-gradient(circle at 16% 0%, rgba(33, 151, 255, .16), transparent 34%),
    radial-gradient(circle at 86% 16%, rgba(109, 215, 255, .10), transparent 32%),
    linear-gradient(180deg, #082745 0%, #04182c 46%, #020c18 100%) !important;
  border-top: 1px solid rgba(80, 207, 255, .35) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 -18px 42px rgba(0, 90, 180, .10);
}

.az-footer::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 13px;
  background:
    linear-gradient(90deg,
      transparent 0 12%,
      #118bff 12% 22%,
      #65d9ff 22% 23.5%,
      #143e78 23.5% 52%,
      #ff9d2f 52% 58%,
      #145aa4 58% 78%,
      #7a55ff 78% 84%,
      transparent 84% 100%);
  opacity: .82;
  filter: drop-shadow(0 0 9px rgba(41, 163, 255, .34));
}

.az-footer::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 72px 72px, 72px 72px;
  opacity: .34;
  mask-image: linear-gradient(180deg, #000 0%, transparent 90%);
}

.az-footer-grid {
  position: relative;
  z-index: 1;
  gap: 42px !important;
}

.az-footer-grid > section {
  position: relative;
  padding-top: 18px;
}

.az-footer-grid > section::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: min(138px, 78%);
  height: 7px;
  border-radius: 999px 999px 999px 0;
  background: linear-gradient(90deg, #2c9cff, rgba(111, 219, 255, .72));
  box-shadow: 0 0 12px rgba(44, 156, 255, .35);
}

.az-footer-grid > section:nth-child(2)::before { background: linear-gradient(90deg, #2f86ff, #725cff); }
.az-footer-grid > section:nth-child(3)::before { background: linear-gradient(90deg, #36d6ff, #1fa77f); }
.az-footer-grid > section:nth-child(4)::before { background: linear-gradient(90deg, #ff9b2f, #2f86ff); }
.az-footer-grid > section:nth-child(5)::before { background: linear-gradient(90deg, #7a55ff, #36d6ff); }

.az-footer h3 {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #ffffff !important;
  letter-spacing: .055em !important;
  text-shadow: 0 0 10px rgba(93, 210, 255, .32);
}

.az-footer h3::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: #6de0ff;
  box-shadow: 0 0 10px rgba(109, 224, 255, .75);
  transform: rotate(45deg);
}

.az-footer p {
  line-height: 1.6;
  color: rgba(222, 241, 255, .9) !important;
}

.az-footer strong {
  margin-top: 12px;
  color: #6de0ff !important;
  text-shadow: 0 0 10px rgba(109, 224, 255, .32);
}

.az-footer a {
  transition: color .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.az-footer li a,
.az-footer .mod-menu li a {
  position: relative;
}

.az-footer li a:hover,
.az-footer .mod-menu li a:hover {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(109, 224, 255, .42);
}

.az-footer-about .mod-menu {
  gap: 8px !important;
}

.az-footer-about .mod-menu a {
  min-height: 31px;
  padding: 6px 10px !important;
  border-radius: 10px 3px 10px 3px !important;
  border: 1px solid rgba(90, 190, 255, .28) !important;
  background:
    linear-gradient(180deg, rgba(12, 54, 92, .88), rgba(3, 20, 38, .78)) !important;
  color: #dff5ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 0 0 1px rgba(0, 6, 18, .42),
    0 0 12px rgba(47, 142, 255, .08);
}

.az-footer-about .mod-menu a:hover,
.az-footer-about .mod-menu a:focus-visible {
  transform: translateY(-1px);
  color: #fff !important;
}

/* Footer social buttons: brand color appears on hover while idle state stays integrated. */
.az-footer-about .mod-menu li:nth-child(1) a:hover,
.az-footer-about .mod-menu li:nth-child(1) a:focus-visible {
  background: linear-gradient(180deg, #171b22, #000) !important;
  border-color: rgba(255,255,255,.45) !important;
  box-shadow: 0 0 16px rgba(255,255,255,.16), inset 0 1px 0 rgba(255,255,255,.18);
}
.az-footer-about .mod-menu li:nth-child(2) a:hover,
.az-footer-about .mod-menu li:nth-child(2) a:focus-visible {
  background: linear-gradient(180deg, #1877f2, #0b4ba8) !important;
  border-color: rgba(24,119,242,.88) !important;
  box-shadow: 0 0 18px rgba(24,119,242,.55), inset 0 1px 0 rgba(255,255,255,.25);
}
.az-footer-about .mod-menu li:nth-child(3) a:hover,
.az-footer-about .mod-menu li:nth-child(3) a:focus-visible {
  background: linear-gradient(135deg, #feda75 0%, #fa7e1e 24%, #d62976 55%, #962fbf 76%, #4f5bd5 100%) !important;
  border-color: rgba(214,41,118,.78) !important;
  box-shadow: 0 0 18px rgba(214,41,118,.50), inset 0 1px 0 rgba(255,255,255,.28);
}
.az-footer-about .mod-menu li:nth-child(4) a:hover,
.az-footer-about .mod-menu li:nth-child(4) a:focus-visible {
  background: linear-gradient(180deg, #ff2b2b, #b30000) !important;
  border-color: rgba(255,0,0,.82) !important;
  box-shadow: 0 0 18px rgba(255,0,0,.48), inset 0 1px 0 rgba(255,255,255,.25);
}
.az-footer-about .mod-menu li:nth-child(5) a:hover,
.az-footer-about .mod-menu li:nth-child(5) a:focus-visible {
  background: linear-gradient(135deg, #00f2ea 0%, #111 42%, #ff0050 100%) !important;
  border-color: rgba(0,242,234,.65) !important;
  box-shadow: 0 0 18px rgba(0,242,234,.38), 0 0 18px rgba(255,0,80,.28), inset 0 1px 0 rgba(255,255,255,.22);
}
.az-footer-about .mod-menu li:nth-child(6) a:hover,
.az-footer-about .mod-menu li:nth-child(6) a:focus-visible {
  background: linear-gradient(180deg, #5865f2, #3440ba) !important;
  border-color: rgba(88,101,242,.84) !important;
  box-shadow: 0 0 18px rgba(88,101,242,.50), inset 0 1px 0 rgba(255,255,255,.24);
}
.az-footer-about .mod-menu li:nth-child(7) a:hover,
.az-footer-about .mod-menu li:nth-child(7) a:focus-visible {
  background: linear-gradient(180deg, #3a404a, #171b22) !important;
  border-color: rgba(235,245,255,.38) !important;
  box-shadow: 0 0 18px rgba(235,245,255,.16), inset 0 1px 0 rgba(255,255,255,.18);
}
.az-footer-about .mod-menu li:nth-child(8) a:hover,
.az-footer-about .mod-menu li:nth-child(8) a:focus-visible {
  background: linear-gradient(180deg, #ff9d2f, #c65a00) !important;
  border-color: rgba(255,122,0,.86) !important;
  box-shadow: 0 0 18px rgba(255,122,0,.50), inset 0 1px 0 rgba(255,255,255,.25);
}
.az-footer-about .mod-menu li:nth-child(9) a:hover,
.az-footer-about .mod-menu li:nth-child(9) a:focus-visible {
  background: linear-gradient(180deg, #1db954, #0d7d36) !important;
  border-color: rgba(30,215,96,.82) !important;
  box-shadow: 0 0 18px rgba(30,215,96,.45), inset 0 1px 0 rgba(255,255,255,.22);
}
.az-footer-about .mod-menu li:nth-child(10) a:hover,
.az-footer-about .mod-menu li:nth-child(10) a:focus-visible {
  background: linear-gradient(180deg, #b86aff, #5b2db4) !important;
  border-color: rgba(184,106,255,.82) !important;
  box-shadow: 0 0 18px rgba(184,106,255,.45), inset 0 1px 0 rgba(255,255,255,.22);
}

.az-copy {
  position: relative;
  z-index: 1;
  margin-top: 34px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(88, 196, 255, .22) !important;
}

.az-copy::before {
  content: '';
  position: absolute;
  left: 0;
  top: -4px;
  width: 220px;
  height: 7px;
  border-radius: 999px 999px 0 999px;
  background: linear-gradient(90deg, #1298ff, #6de0ff, transparent);
  opacity: .78;
}

@media (max-width: 900px) {
  .az-footer::before { height: 9px; }
  .az-footer-grid > section::before { width: 112px; }
}


/* v0.3.32 Phoenix footer refinement
   Remove the LCARS color bar from the top of the footer while keeping the subtle blue glass footer styling. */
.az-footer::before {
  display: none !important;
  content: none !important;
}
.az-footer {
  padding-top: 34px !important;
  border-top: 1px solid rgba(80, 207, 255, .28) !important;
}

/* v0.3.33 — Dragon-globe compact header artwork */
.az-hero-head {
  height: 170px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(1, 8, 18, .08), rgba(1, 8, 18, .20)),
    url('../images/header/aresenya-dragon-globe-header.jpg') center center / 100% 100% no-repeat !important;
  border-bottom: 1px solid rgba(82, 194, 255, .36);
  box-shadow:
    inset 0 0 0 1px rgba(70, 190, 255, .08),
    inset 0 -34px 55px rgba(0, 10, 30, .36),
    0 8px 36px rgba(0, 0, 0, .32);
}

.az-hero-head::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.14), transparent 24%, transparent 76%, rgba(0,0,0,.14)),
    repeating-linear-gradient(90deg, rgba(87, 205, 255, .045) 0 1px, transparent 1px 84px);
  mix-blend-mode: screen;
  opacity: .55;
}

.az-hero-head::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(75, 210, 255, .7), rgba(11, 103, 223, .7), transparent);
  box-shadow: 0 0 16px rgba(80, 212, 255, .42);
  pointer-events: none;
}

.az-header-bg-grid,
.az-globe,
.az-cityline,
.az-jp-mark,
.az-brand {
  display: none !important;
}

.az-header-grid {
  position: relative;
  height: 100%;
  display: block;
  pointer-events: none;
}

.az-header-mods {
  pointer-events: auto;
  position: absolute;
  top: 18px;
  right: clamp(28px, 8vw, 170px);
  min-width: 0;
  width: min(360px, 30vw);
  z-index: 4;
}

.az-search-fallback,
.az-header-mods form:not(#login-form) {
  width: 100%;
  max-width: 360px;
  opacity: .92;
  backdrop-filter: blur(14px) saturate(1.15);
}

.az-search-fallback input[type='search'],
.az-header-mods input[type='search'],
.az-header-mods input[type='text'] {
  height: 34px;
}

.az-header-mods button,
.az-search-fallback button {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
}

@media (max-width: 1200px) {
  .az-hero-head { height: 150px; }
  .az-header-mods { right: 28px; width: 280px; top: 14px; }
}

@media (max-width: 860px) {
  .az-hero-head {
    height: 132px;
    background-size: auto 100% !important;
    background-position: center center !important;
  }
  .az-header-mods { display: none !important; }
}

/* v0.3.34 — modular header composition
   Stop stretching one wide raster across large screens. The header now uses:
   1) a repeating sci-fi HUD background tile,
   2) a fixed-ratio central dragon/globe logo asset,
   3) real vertical Chinese/Japanese text blocks over the left/right panels. */
.az-hero-head {
  height: 170px !important;
  background:
    linear-gradient(180deg, rgba(1, 8, 20, .12), rgba(1, 8, 20, .34)),
    radial-gradient(circle at 50% 42%, rgba(42, 175, 255, .20), transparent 32%),
    url('../images/header/aresenya-header-core.jpg') center center / auto 100% no-repeat,
    url('../images/header/aresenya-header-repeat.png') center center / auto 100% repeat-x,
    #020914 !important;
  background-color: #020914 !important;
}

.az-hero-head::before {
  opacity: .38 !important;
  background:
    linear-gradient(90deg, rgba(0,0,0,.32), transparent 18%, transparent 82%, rgba(0,0,0,.32)),
    repeating-linear-gradient(90deg, rgba(87, 205, 255, .035) 0 1px, transparent 1px 84px) !important;
}

.az-header-bg-grid,
.az-globe,
.az-cityline,
.az-brand {
  display: none !important;
}

.az-zh-mark,
.az-jp-mark {
  display: grid !important;
  position: absolute;
  top: 22px;
  z-index: 4;
  pointer-events: none;
  align-content: center;
  min-height: 126px;
  color: #eff9ff;
  text-shadow: 0 0 16px rgba(83, 207, 255, .75), 0 2px 18px rgba(0,0,0,.9);
}

.az-zh-mark {
  left: clamp(36px, 7.2vw, 210px);
  grid-template-columns: auto auto;
  gap: 14px;
}

.az-jp-mark {
  right: clamp(36px, 7.2vw, 210px);
  top: 24px;
  grid-template-columns: auto auto;
  gap: 12px;
  font-size: 0; /* reset legacy inherited text styling */
  letter-spacing: 0;
}

.az-zh-mark span,
.az-jp-mark span {
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-weight: 750;
  line-height: 1.05;
  letter-spacing: .12em;
  font-family: "Noto Sans CJK SC", "Microsoft YaHei", "Yu Gothic", "Meiryo", system-ui, sans-serif;
}

.az-zh-mark span {
  font-size: clamp(19px, 1.32vw, 28px);
}

.az-jp-mark span {
  font-size: clamp(17px, 1.12vw, 24px);
}

.az-zh-mark small,
.az-jp-mark small {
  grid-column: 1 / -1;
  align-self: end;
  margin-top: 6px;
  color: #37d8ff;
  font-size: clamp(9px, .62vw, 13px);
  font-weight: 700;
  letter-spacing: .08em;
  text-shadow: 0 0 12px rgba(38, 210, 255, .55);
  white-space: nowrap;
}

.az-zh-mark::before,
.az-jp-mark::before {
  content: '';
  position: absolute;
  inset: -14px -22px -12px -22px;
  border: 1px solid rgba(60, 186, 255, .25);
  background:
    linear-gradient(90deg, rgba(3, 18, 40, .52), rgba(3, 18, 40, .10)),
    radial-gradient(circle at 50% 50%, rgba(30, 152, 255, .10), transparent 62%);
  clip-path: polygon(0 10%, 86% 10%, 100% 28%, 100% 90%, 14% 90%, 0 72%);
  z-index: -1;
}

.az-zh-mark::after,
.az-jp-mark::after {
  content: '';
  position: absolute;
  width: 42px;
  height: 42px;
  top: 50%;
  transform: translateY(-50%);
  border: 1px solid rgba(45, 174, 255, .26);
  border-radius: 50%;
  box-shadow: inset 0 0 24px rgba(30, 150, 255, .14), 0 0 18px rgba(30, 160, 255, .16);
  opacity: .9;
}

.az-zh-mark::after { left: -72px; }
.az-jp-mark::after { right: -72px; }

.az-jp-mark > * { position: relative; }
.az-jp-mark > span,
.az-zh-mark > span,
.az-jp-mark > small,
.az-zh-mark > small { z-index: 2; }

/* Keep the search inside the header but above the new modular artwork. */
.az-header-mods {
  top: 18px !important;
  right: clamp(28px, 15vw, 380px) !important;
  width: min(340px, 25vw) !important;
}

@media (min-width: 1900px) {
  .az-hero-head {
    background-size: auto 100%, auto 100%, auto 100%, auto 100%, auto !important;
  }
}

@media (max-width: 1450px) {
  .az-zh-mark { left: 32px; }
  .az-jp-mark { right: 32px; }
  .az-header-mods { right: 170px !important; width: 300px !important; }
  .az-zh-mark::before, .az-jp-mark::before { inset: -10px -14px -10px -14px; }
  .az-zh-mark::after, .az-jp-mark::after { display: none; }
}

@media (max-width: 1100px) {
  .az-zh-mark,
  .az-jp-mark { display: none !important; }
  .az-header-mods { right: 28px !important; }
  .az-hero-head {
    background-size: auto 100%, auto 100%, auto 100%, auto 100%, auto !important;
  }
}

@media (max-width: 860px) {
  .az-hero-head {
    height: 132px !important;
    background-size: auto 100%, auto 100%, auto 100%, auto 100%, auto !important;
  }
}

/* v0.3.35 — Seamless modular header refinement
   Softer cyberpunk vertical CJK panels and a non-stretched center logo layer.
   The center artwork now fades into the repeating HUD background so no raster cuts are visible. */
.az-hero-head {
  height: 170px !important;
  position: relative !important;
  overflow: hidden !important;
  background:
    linear-gradient(180deg, rgba(1, 8, 20, .14), rgba(1, 8, 20, .36)),
    radial-gradient(circle at 50% 42%, rgba(42, 175, 255, .18), transparent 32%),
    url('../images/header/aresenya-header-repeat.png') center center / auto 100% repeat-x,
    #020914 !important;
  border-bottom: 1px solid rgba(82, 194, 255, .38) !important;
}

/* Center logo/globe layer with feathered edges to remove visible cuts. */
.az-hero-head::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 50% !important;
  width: min(1040px, 58vw) !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: .98 !important;
  background:
    linear-gradient(90deg, rgba(2, 9, 20, .42), transparent 14%, transparent 86%, rgba(2, 9, 20, .42)),
    url('../images/header/aresenya-header-core.jpg') center center / auto 100% no-repeat !important;
  -webkit-mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 7%, #000 18%, #000 82%, rgba(0,0,0,.35) 93%, transparent 100%),
    linear-gradient(180deg, transparent 0%, #000 7%, #000 94%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 7%, #000 18%, #000 82%, rgba(0,0,0,.35) 93%, transparent 100%),
    linear-gradient(180deg, transparent 0%, #000 7%, #000 94%, transparent 100%);
  mask-composite: intersect;
  filter: drop-shadow(0 0 24px rgba(66, 200, 255, .20));
}

/* Global header overlay and bottom glow. */
.az-hero-head::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(0,0,0,.24), transparent 22%, transparent 78%, rgba(0,0,0,.24)),
    repeating-linear-gradient(90deg, rgba(87, 205, 255, .028) 0 1px, transparent 1px 84px),
    linear-gradient(180deg, transparent calc(100% - 2px), rgba(75, 210, 255, .78) calc(100% - 1px), rgba(11, 103, 223, .75) 100%);
}

.az-header-bg-grid {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  pointer-events: none !important;
  opacity: .55 !important;
  background:
    radial-gradient(circle at 17% 52%, rgba(0, 214, 255, .08), transparent 16%),
    radial-gradient(circle at 83% 52%, rgba(0, 214, 255, .08), transparent 16%),
    linear-gradient(90deg, rgba(0, 202, 255, .08), transparent 22%, transparent 78%, rgba(0, 202, 255, .08));
}

.az-zh-mark,
.az-jp-mark {
  display: grid !important;
  position: absolute !important;
  top: 13px !important;
  bottom: 13px !important;
  min-height: 0 !important;
  height: auto !important;
  z-index: 5 !important;
  pointer-events: none !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  align-items: center !important;
  align-content: center !important;
  gap: 9px !important;
  color: #f4fbff !important;
  filter: drop-shadow(0 0 10px rgba(69, 219, 255, .28));
}

.az-zh-mark {
  left: clamp(32px, 6.6vw, 185px) !important;
  grid-template-columns: auto auto;
}

.az-jp-mark {
  right: clamp(32px, 6.6vw, 185px) !important;
  grid-template-columns: auto auto;
}

.az-zh-mark span,
.az-jp-mark span {
  writing-mode: vertical-rl !important;
  text-orientation: upright !important;
  line-height: 1.02 !important;
  letter-spacing: .06em !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Chinese: slightly stronger neon/cyberpunk glow, but still soft. */
.az-zh-mark span {
  font-family: "Microsoft YaHei UI", "Noto Sans CJK SC", "PingFang SC", system-ui, sans-serif !important;
  font-size: clamp(19px, 1.18vw, 25px) !important;
  font-weight: 900 !important;
  color: #f8fdff !important;
  text-shadow:
    0 0 5px rgba(105, 240, 255, .80),
    0 0 14px rgba(22, 196, 255, .62),
    0 0 28px rgba(0, 120, 255, .34),
    0 2px 15px rgba(0, 0, 0, .96) !important;
}

/* Japanese: cleaner Tokyo tech signage feel, slightly smaller so it never crops. */
.az-jp-mark span {
  font-family: "Yu Gothic UI", "Yu Gothic", "Meiryo", "Noto Sans JP", system-ui, sans-serif !important;
  font-size: clamp(17px, 1.02vw, 22px) !important;
  font-weight: 780 !important;
  color: #f3fbff !important;
  text-shadow:
    0 0 4px rgba(210, 246, 255, .76),
    0 0 14px rgba(78, 210, 255, .46),
    0 2px 16px rgba(0, 0, 0, .96) !important;
}

.az-zh-mark small,
.az-jp-mark small {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 8px !important;
  grid-column: 1 / -1 !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  white-space: nowrap !important;
  overflow: visible !important;
  margin: 0 !important;
  color: #31dcff !important;
  font-size: clamp(8px, .54vw, 11px) !important;
  line-height: 1 !important;
  letter-spacing: .06em !important;
  font-weight: 800 !important;
  text-shadow:
    0 0 6px rgba(42, 222, 255, .70),
    0 0 18px rgba(0, 144, 255, .34),
    0 1px 8px rgba(0, 0, 0, .92) !important;
}

.az-zh-mark::before,
.az-jp-mark::before {
  content: '' !important;
  position: absolute !important;
  inset: -10px -18px -9px -18px !important;
  border: 1px solid rgba(63, 199, 255, .22) !important;
  background:
    linear-gradient(90deg, rgba(3, 18, 40, .58), rgba(3, 18, 40, .10)),
    radial-gradient(circle at 50% 50%, rgba(30, 152, 255, .13), transparent 66%) !important;
  box-shadow:
    inset 0 0 28px rgba(0, 149, 255, .10),
    0 0 18px rgba(0, 149, 255, .10) !important;
  clip-path: polygon(0 10%, 86% 10%, 100% 28%, 100% 90%, 14% 90%, 0 72%) !important;
  z-index: -1 !important;
}

.az-zh-mark::after,
.az-jp-mark::after {
  width: 38px !important;
  height: 38px !important;
  opacity: .7 !important;
}

.az-header-grid,
.az-header-mods { z-index: 6 !important; }

@media (min-width: 1900px) {
  .az-hero-head::before { width: 1100px !important; }
}

@media (max-width: 1450px) {
  .az-zh-mark { left: 24px !important; }
  .az-jp-mark { right: 24px !important; }
  .az-zh-mark span { font-size: 18px !important; }
  .az-jp-mark span { font-size: 16px !important; }
  .az-zh-mark small,
  .az-jp-mark small { font-size: 8px !important; }
}

@media (max-width: 1100px) {
  .az-zh-mark,
  .az-jp-mark { display: none !important; }
  .az-hero-head::before { width: 960px !important; }
}

@media (max-width: 860px) {
  .az-hero-head { height: 132px !important; }
  .az-hero-head::before { width: 820px !important; }
}

/* v0.3.36 — Header seam and CJK panel refinement
   Use a fixed-width transparent center artwork so the dragon/globe closes cleanly
   into the HUD background instead of showing visible side cuts. Text panels get
   stronger cyber/Tokyo glow with safer spacing for the cyan subtitles. */
.az-hero-head {
  height: 170px !important;
  background:
    linear-gradient(180deg, rgba(1, 8, 20, .10), rgba(1, 8, 20, .34)),
    radial-gradient(circle at 50% 44%, rgba(42, 175, 255, .12), transparent 31%),
    url('../images/header/aresenya-header-repeat.png') center center / auto 100% repeat-x,
    #020914 !important;
}

.az-hero-head::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 50% !important;
  width: 980px !important;
  transform: translateX(-50%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
  opacity: 1 !important;
  background: url('../images/header/aresenya-header-core-seamless.png') center bottom / auto 100% no-repeat !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  filter:
    drop-shadow(0 0 18px rgba(75, 210, 255, .24))
    drop-shadow(0 0 34px rgba(0, 76, 180, .18)) !important;
}

.az-hero-head::after {
  background:
    linear-gradient(90deg, rgba(0,0,0,.22), transparent 22%, transparent 78%, rgba(0,0,0,.22)),
    repeating-linear-gradient(90deg, rgba(87, 205, 255, .023) 0 1px, transparent 1px 84px),
    linear-gradient(180deg, transparent calc(100% - 2px), rgba(75, 210, 255, .62) calc(100% - 1px), rgba(11, 103, 223, .62) 100%) !important;
}

.az-zh-mark,
.az-jp-mark {
  display: block !important;
  box-sizing: border-box !important;
  top: 12px !important;
  bottom: 12px !important;
  min-width: 138px !important;
  width: clamp(138px, 10.5vw, 210px) !important;
  height: auto !important;
  padding: 10px 13px 24px 13px !important;
  align-content: start !important;
  align-items: start !important;
  gap: 0 !important;
  overflow: visible !important;
}

.az-zh-mark { left: clamp(34px, 7.8vw, 190px) !important; }
.az-jp-mark { right: clamp(34px, 7.8vw, 190px) !important; }

.az-zh-mark span,
.az-jp-mark span {
  display: inline-block !important;
  height: 108px !important;
  margin: 0 4px !important;
  vertical-align: top !important;
  writing-mode: vertical-rl !important;
  text-orientation: upright !important;
  line-height: .96 !important;
  letter-spacing: .045em !important;
  position: relative !important;
  z-index: 2 !important;
}

.az-zh-mark span {
  font-size: clamp(18px, 1.06vw, 23px) !important;
  font-weight: 900 !important;
  color: #f7feff !important;
  text-shadow:
    0 0 4px rgba(135, 245, 255, .82),
    0 0 10px rgba(34, 214, 255, .58),
    0 0 22px rgba(0, 150, 255, .34),
    0 2px 13px rgba(0, 0, 0, .95) !important;
}

.az-jp-mark span {
  font-size: clamp(15px, .92vw, 19px) !important;
  font-weight: 800 !important;
  color: #f1fbff !important;
  text-shadow:
    0 0 4px rgba(220, 250, 255, .76),
    0 0 12px rgba(86, 218, 255, .42),
    0 2px 14px rgba(0, 0, 0, .96) !important;
}

.az-zh-mark small,
.az-jp-mark small {
  display: block !important;
  position: absolute !important;
  left: 13px !important;
  right: 13px !important;
  bottom: 5px !important;
  z-index: 4 !important;
  writing-mode: horizontal-tb !important;
  text-orientation: mixed !important;
  white-space: nowrap !important;
  overflow: visible !important;
  font-size: clamp(6.6px, .43vw, 8.4px) !important;
  line-height: 1 !important;
  letter-spacing: .035em !important;
  font-weight: 900 !important;
  color: #36dfff !important;
  text-shadow:
    0 0 5px rgba(54, 224, 255, .70),
    0 0 13px rgba(0, 132, 255, .34),
    0 1px 8px rgba(0, 0, 0, .94) !important;
}

.az-zh-mark::before,
.az-jp-mark::before {
  inset: -7px -13px -7px -13px !important;
  border-color: rgba(65, 205, 255, .16) !important;
  background:
    linear-gradient(90deg, rgba(3, 18, 40, .38), rgba(3, 18, 40, .08)),
    radial-gradient(circle at 50% 50%, rgba(30, 152, 255, .09), transparent 68%) !important;
  box-shadow:
    inset 0 0 20px rgba(0, 149, 255, .06),
    0 0 14px rgba(0, 149, 255, .06) !important;
}

@media (min-width: 1900px) {
  .az-hero-head::before { width: 980px !important; }
}

@media (max-width: 1450px) {
  .az-hero-head::before { width: 900px !important; }
  .az-zh-mark { left: 20px !important; }
  .az-jp-mark { right: 20px !important; }
  .az-zh-mark,
  .az-jp-mark { width: 124px !important; padding-bottom: 22px !important; }
  .az-zh-mark span { font-size: 17px !important; height: 103px !important; }
  .az-jp-mark span { font-size: 15px !important; height: 103px !important; }
  .az-zh-mark small,
  .az-jp-mark small { font-size: 6.4px !important; left: 10px !important; right: 10px !important; }
}

@media (max-width: 1100px) {
  .az-zh-mark,
  .az-jp-mark { display: none !important; }
  .az-hero-head::before { width: 860px !important; }
}

@media (max-width: 860px) {
  .az-hero-head { height: 132px !important; }
  .az-hero-head::before { width: 760px !important; }
}

/* v0.3.37 — Header logo subtitle visibility fix
   Keep the current dragon/globe header composition, but restore the small
   MEDIA NETWORK letters that were being clipped by the compact header edge. */
.az-header-bg-grid::after {
  content: 'MEDIA NETWORK' !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 5px !important;
  transform: translateX(-50%) !important;
  z-index: 9 !important;
  display: block !important;
  padding-left: .62em !important;
  width: auto !important;
  white-space: nowrap !important;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: clamp(8px, .72vw, 12px) !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  letter-spacing: .62em !important;
  color: #43e5ff !important;
  text-shadow:
    0 0 7px rgba(69, 231, 255, .9),
    0 0 18px rgba(0, 156, 255, .58),
    0 1px 8px rgba(0, 0, 0, .95) !important;
  pointer-events: none !important;
}

.az-header-bg-grid::before {
  content: '' !important;
  position: absolute !important;
  left: 50% !important;
  bottom: 0 !important;
  width: min(460px, 32vw) !important;
  height: 25px !important;
  transform: translateX(-50%) !important;
  z-index: 8 !important;
  background:
    linear-gradient(90deg, transparent, rgba(2, 10, 24, .72) 18%, rgba(2, 10, 24, .78) 50%, rgba(2, 10, 24, .72) 82%, transparent),
    radial-gradient(ellipse at 50% 90%, rgba(0, 177, 255, .20), transparent 70%) !important;
  pointer-events: none !important;
}

@media (max-width: 1100px) {
  .az-header-bg-grid::after { font-size: 7px !important; bottom: 5px !important; }
  .az-header-bg-grid::before { width: 330px !important; }
}


/* v0.3.38 — Header subtitle relocation
   Move the CSS-rendered MEDIA NETWORK subtitle away from the center logo and
   place it as a small vertical tech mark beside the Chinese panel. The dragon
   globe artwork and all other header composition remain unchanged. */
.az-header-bg-grid::after {
  content: 'MEDIA NETWORK' !important;
  position: absolute !important;
  left: clamp(18px, 4.2vw, 108px) !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  z-index: 9 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  white-space: nowrap !important;
  writing-mode: vertical-rl !important;
  text-orientation: mixed !important;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: clamp(7px, .50vw, 9.5px) !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: .34em !important;
  color: #43e5ff !important;
  opacity: .92 !important;
  text-shadow:
    0 0 7px rgba(69, 231, 255, .86),
    0 0 18px rgba(0, 156, 255, .45),
    0 1px 8px rgba(0, 0, 0, .94) !important;
  pointer-events: none !important;
}

@media (max-width: 1450px) {
  .az-header-bg-grid::after {
    display: none !important;
    content: none !important;
  }
}


/* v0.3.39 — remove baked-in center subtitle from header artwork
   The center dragon/globe asset was updated so MEDIA NETWORK no longer appears
   under the ARESENYA wordmark. CSS overlay subtitle remains on the left side. */

/* v0.3.40 — Futuristic standard buttons
   Standard action buttons now use a darker, elegant sci-fi command style
   instead of flat bright-blue blocks. */
.az-btn,
.az-panel-link,
.readmore a,
.btn-primary,
.az-module-content button,
.az-module-content input[type='submit'] {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  min-height: 40px;
  background:
    linear-gradient(135deg, rgba(74, 205, 255, .22), rgba(14, 101, 235, .16) 28%, rgba(3, 34, 85, .92) 58%, rgba(7, 118, 255, .55));
  color: #f7fcff !important;
  border: 1px solid rgba(111, 219, 255, .46);
  border-radius: 11px;
  padding: 10px 20px;
  font-weight: 900;
  letter-spacing: .035em;
  text-transform: uppercase;
  text-shadow: 0 1px 0 rgba(0,0,0,.35), 0 0 10px rgba(141,230,255,.30);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -12px 20px rgba(0, 25, 70, .34),
    0 0 0 1px rgba(0, 70, 150, .16),
    0 8px 18px rgba(0, 94, 220, .22);
  clip-path: polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px);
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease,
    filter .18s ease;
}

.az-btn::before,
.az-panel-link::before,
.readmore a::before,
.btn-primary::before,
.az-module-content button::before {
  content: '';
  position: absolute;
  inset: 1px;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0 14%, rgba(135, 232, 255, .20) 24%, transparent 35%),
    linear-gradient(180deg, rgba(255,255,255,.13), transparent 38%);
  transform: translateX(-120%);
  transition: transform .42s ease;
}

.az-btn::after,
.az-panel-link::after,
.readmore a::after,
.btn-primary::after,
.az-module-content button::after {
  content: '';
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 5px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(119,226,255,.75), transparent);
  opacity: .58;
}

.az-btn:hover,
.az-panel-link:hover,
.readmore a:hover,
.btn-primary:hover,
.az-module-content button:hover,
.az-module-content input[type='submit']:hover {
  transform: translateY(-2px);
  background:
    linear-gradient(135deg, rgba(114, 235, 255, .32), rgba(18, 135, 255, .22) 30%, rgba(3, 42, 98, .96) 58%, rgba(0, 145, 255, .70));
  border-color: rgba(150, 239, 255, .78);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.30),
    inset 0 -12px 22px rgba(0, 35, 90, .42),
    0 0 0 1px rgba(40, 184, 255, .22),
    0 0 24px rgba(0, 162, 255, .38),
    0 10px 22px rgba(0, 79, 190, .34);
  filter: saturate(1.08) brightness(1.05);
}

.az-btn:hover::before,
.az-panel-link:hover::before,
.readmore a:hover::before,
.btn-primary:hover::before,
.az-module-content button:hover::before {
  transform: translateX(120%);
}

.az-btn:active,
.az-panel-link:active,
.readmore a:active,
.btn-primary:active,
.az-module-content button:active,
.az-module-content input[type='submit']:active {
  transform: translateY(0);
  box-shadow:
    inset 0 2px 12px rgba(0, 0, 0, .42),
    0 0 16px rgba(0, 130, 255, .28);
}

.az-btn:focus-visible,
.az-panel-link:focus-visible,
.readmore a:focus-visible,
.btn-primary:focus-visible,
.az-module-content button:focus-visible,
.az-module-content input[type='submit']:focus-visible {
  outline: 2px solid rgba(148, 237, 255, .95);
  outline-offset: 3px;
}

/* v0.3.41 — Hero featured-story badge polish
   Make the hero badge and small metadata line feel like part of the sci-fi UI,
   instead of a flat blue pill. */
.az-feature-hero .az-badge {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 7px 17px 7px 13px;
  min-height: 30px;
  background:
    linear-gradient(90deg, rgba(12, 220, 255, .18), rgba(13, 82, 170, .46) 46%, rgba(3, 28, 72, .82)),
    linear-gradient(180deg, rgba(143, 235, 255, .18), rgba(0, 0, 0, 0) 58%);
  border: 1px solid rgba(103, 224, 255, .62);
  border-left-color: rgba(146, 243, 255, .95);
  border-right-color: rgba(30, 124, 255, .46);
  border-radius: 5px;
  clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 50%, calc(100% - 13px) 100%, 0 100%, 7px 50%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -9px 15px rgba(0, 21, 62, .42),
    0 0 0 1px rgba(0, 125, 255, .14),
    0 0 18px rgba(34, 190, 255, .24);
  color: #f0fcff;
  font-size: 11px;
  line-height: 1;
  letter-spacing: .095em;
  text-transform: uppercase;
  text-shadow: 0 0 9px rgba(114, 229, 255, .55), 0 1px 0 rgba(0,0,0,.6);
}

.az-feature-hero .az-badge::before {
  content: '';
  flex: 0 0 auto;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #7ff2ff;
  box-shadow:
    0 0 0 2px rgba(42, 180, 255, .16),
    0 0 10px rgba(80, 226, 255, .9),
    0 0 18px rgba(0, 132, 255, .55);
}

.az-feature-hero .az-badge::after {
  content: '';
  position: absolute;
  left: 16px;
  right: 18px;
  bottom: 4px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(135, 235, 255, .75), transparent);
  opacity: .56;
}

.az-feature-copy::before {
  display: inline-flex;
  align-items: center;
  margin: 11px 0 14px;
  padding: 4px 10px 4px 0;
  border-bottom: 1px solid rgba(83, 215, 255, .28);
  color: #8befff;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .32em;
  text-transform: uppercase;
  text-shadow: 0 0 12px rgba(38, 199, 255, .42);
  opacity: .9;
}

/* v0.4.0 — Functional component pages
   Article, category, search, login and legal pages should feel like native Aresenya pages,
   not default Joomla output. Home stays a portal; non-home pages use the component shell. */
.az-component-card {
  position: relative;
  padding: 0;
  overflow: hidden;
  border-color: rgba(75, 184, 255, .45);
  background:
    linear-gradient(180deg, rgba(10, 36, 66, .96), rgba(4, 15, 30, .98)),
    repeating-linear-gradient(90deg, rgba(89, 207, 255, .06) 0 1px, transparent 1px 38px),
    repeating-linear-gradient(0deg, rgba(89, 207, 255, .045) 0 1px, transparent 1px 32px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 18px 46px rgba(0,0,0,.28),
    0 0 34px rgba(0, 121, 255, .08);
}
.az-component-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 5px;
  background: linear-gradient(90deg, transparent, rgba(83, 219, 255, .82), rgba(27, 112, 255, .55), transparent);
  opacity: .75;
  pointer-events: none;
}
.az-component-card > * {
  position: relative;
  z-index: 1;
}
.az-component-card .item-page,
.az-component-card .com-content-article,
.az-component-card .com-content-category-blog,
.az-component-card .blog,
.az-component-card .com-users-login,
.az-component-card .com-users-registration,
.az-component-card .com-contact,
.az-component-card .com-finder,
.az-component-card .search,
.az-component-card .newsfeed,
.az-component-card .tag-category {
  padding: 28px;
}
.az-component-card h1,
.az-component-card .page-header h1,
.az-component-card .page-header h2,
.az-component-card .com-content-article__title,
.az-component-card .item-title,
.az-component-card h2.item-title {
  margin: 0 0 18px;
  color: #fff;
  font-size: clamp(30px, 2.4vw, 48px);
  line-height: 1.08;
  letter-spacing: -.03em;
  text-shadow: 0 0 22px rgba(91, 211, 255, .28);
}
.az-component-card .page-header {
  margin: 0 0 20px;
  padding: 0 0 18px;
  border-bottom: 1px solid rgba(105, 215, 255, .25);
}
.az-component-card .page-header::after {
  content: '';
  display: block;
  width: 118px;
  height: 2px;
  margin-top: 14px;
  background: linear-gradient(90deg, #79ecff, rgba(34, 126, 255, .5), transparent);
  box-shadow: 0 0 14px rgba(74, 213, 255, .42);
}
.az-component-card p,
.az-component-card li,
.az-component-card td,
.az-component-card dd,
.az-component-card .com-content-article__body,
.az-component-card .articleBody {
  color: #dcecff;
  font-size: 16px;
  line-height: 1.78;
}
.az-component-card a:not(.btn):not(.az-btn) {
  color: #8be8ff;
  text-decoration: none;
}
.az-component-card a:not(.btn):not(.az-btn):hover {
  color: #fff;
  text-shadow: 0 0 14px rgba(101, 222, 255, .6);
}
.az-component-card .article-info,
.az-component-card .article-info-muted,
.az-component-card .com-content-article__info,
.az-component-card .createdby,
.az-component-card .category-name,
.az-component-card .published,
.az-component-card .hits,
.az-component-card .modified {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  color: #9dcce5;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .055em;
}
.az-component-card .article-info dd,
.az-component-card .article-info dt {
  margin: 0;
  color: inherit;
  font-size: inherit;
  line-height: 1.2;
}
.az-component-card .article-info dd:not(:last-child)::after {
  content: '•';
  margin-left: 14px;
  color: #4fcfff;
}
.az-component-card .item-image,
.az-component-card figure,
.az-component-card .com-content-article__image {
  margin: 0 0 24px;
}
.az-component-card .item-image img,
.az-component-card .com-content-article__image img,
.az-component-card img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}
.az-component-card .item-image img,
.az-component-card .com-content-article__image img {
  border: 1px solid rgba(100, 215, 255, .36);
  box-shadow: 0 14px 40px rgba(0, 0, 0, .35), 0 0 30px rgba(0, 120, 255, .12);
}
.az-component-card blockquote {
  margin: 26px 0;
  padding: 22px 24px;
  border-left: 4px solid #6ee8ff;
  border-radius: 0 12px 12px 0;
  background: linear-gradient(90deg, rgba(55, 184, 255, .12), rgba(10, 40, 75, .32));
  color: #f0fbff;
  box-shadow: inset 0 1px rgba(255,255,255,.06);
}
.az-component-card table {
  width: 100%;
  border-collapse: collapse;
  margin: 22px 0;
  overflow: hidden;
  border: 1px solid rgba(96, 205, 255, .28);
  border-radius: 10px;
}
.az-component-card th,
.az-component-card td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(96, 205, 255, .16);
}
.az-component-card th {
  color: #fff;
  background: linear-gradient(180deg, rgba(21, 72, 124, .9), rgba(7, 30, 56, .95));
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: .06em;
}
.az-component-card .tags,
.az-component-card .com-tags-tag-list,
.az-component-card .item-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}
.az-component-card .tags a,
.az-component-card .item-tags a,
.az-component-card .label,
.az-component-card .badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 5px 10px;
  border: 1px solid rgba(111, 219, 255, .35);
  border-radius: 999px;
  background: rgba(7, 37, 71, .7);
  color: #bdf5ff;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.az-component-card .icons,
.az-component-card .actions,
.az-component-card .dropdown-toggle {
  color: #bfefff;
}
.az-component-card .pagenavigation,
.az-component-card .pager,
.az-component-card .pagination {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin: 30px 0 0;
  padding: 20px 0 0;
  border-top: 1px solid rgba(94, 210, 255, .18);
}
.az-component-card .pagination li,
.az-component-card .pager li { list-style: none; }
.az-component-card .pagination a,
.az-component-card .pagination span,
.az-component-card .pagenavigation a,
.az-component-card .pager a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 8px 13px;
  border: 1px solid rgba(93, 209, 255, .28);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(15, 59, 106, .8), rgba(4, 22, 44, .92));
  color: #dff8ff;
  font-weight: 800;
}
.az-component-card .pagination .active span,
.az-component-card .pagination a:hover,
.az-component-card .pagenavigation a:hover,
.az-component-card .pager a:hover {
  border-color: rgba(116, 231, 255, .68);
  box-shadow: 0 0 18px rgba(68, 205, 255, .22);
}

/* Category/blog pages */
.az-component-card .com-content-category-blog__children,
.az-component-card .category-desc {
  margin: 0 0 22px;
  padding: 16px 18px;
  border: 1px solid rgba(93, 209, 255, .22);
  border-radius: 12px;
  background: rgba(8, 35, 65, .6);
}
.az-component-card .blog-items,
.az-component-card .com-content-category-blog__items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.az-component-card .blog-item,
.az-component-card .com-content-category-blog__item {
  position: relative;
  min-height: 220px;
  padding: 132px 18px 18px;
  background: linear-gradient(180deg, rgba(12, 41, 75, .96), rgba(5, 18, 35, .98));
  border: 1px solid rgba(88, 205, 255, .28);
  border-radius: 14px;
  overflow: hidden;
}
.az-component-card .blog-item::before,
.az-component-card .com-content-category-blog__item::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 116px;
  background:
    radial-gradient(circle at 72% 30%, rgba(89, 220, 255, .55), transparent 22%),
    linear-gradient(135deg, rgba(10, 112, 210, .8), rgba(5, 15, 31, .94) 70%);
  border-bottom: 1px solid rgba(93, 210, 255, .24);
  pointer-events: none;
}
.az-component-card .blog-item:nth-child(2n)::before,
.az-component-card .com-content-category-blog__item:nth-child(2n)::before {
  background: radial-gradient(circle at 62% 32%, rgba(255, 218, 71, .42), transparent 20%), linear-gradient(135deg, rgba(29, 36, 57, .9), rgba(5, 15, 31, .95) 72%);
}
.az-component-card .blog-item:nth-child(3n)::before,
.az-component-card .com-content-category-blog__item:nth-child(3n)::before {
  background: radial-gradient(circle at 56% 40%, rgba(86, 149, 255, .6), transparent 22%), linear-gradient(135deg, rgba(19, 110, 215, .78), rgba(5, 15, 31, .95) 70%);
}
.az-component-card .blog-item .item-title,
.az-component-card .com-content-category-blog__item .item-title,
.az-component-card .blog-item h2,
.az-component-card .com-content-category-blog__item h2 {
  position: relative;
  z-index: 1;
  margin: 0 0 10px;
  font-size: 22px;
  line-height: 1.2;
}
.az-component-card .blog-item p,
.az-component-card .com-content-category-blog__item p {
  position: relative;
  z-index: 1;
  font-size: 14px;
  line-height: 1.62;
}
.az-component-card .readmore,
.az-component-card p.readmore { margin: 18px 0 0; }
.az-component-card .readmore a,
.az-component-card .btn,
.az-component-card button,
.az-component-card input[type='submit'] {
  border-radius: 8px;
}

/* Forms: contact, login, registration, search */
.az-component-card form {
  margin: 0;
}
.az-component-card fieldset {
  min-width: 0;
  margin: 0 0 20px;
  padding: 18px;
  border: 1px solid rgba(95, 210, 255, .22);
  border-radius: 12px;
  background: rgba(4, 22, 43, .52);
}
.az-component-card legend {
  color: #fff;
  padding: 0 8px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.az-component-card label {
  color: #d9f1ff;
  font-weight: 800;
}
.az-component-card input[type='text'],
.az-component-card input[type='email'],
.az-component-card input[type='password'],
.az-component-card input[type='search'],
.az-component-card input[type='url'],
.az-component-card textarea,
.az-component-card select,
.az-component-card .form-control {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(96, 214, 255, .32);
  border-radius: 10px;
  background: rgba(4, 18, 36, .86);
  color: #f1fbff;
  padding: 10px 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1px rgba(0, 118, 255, .06);
}
.az-component-card textarea { min-height: 150px; resize: vertical; }
.az-component-card input:focus,
.az-component-card textarea:focus,
.az-component-card select:focus,
.az-component-card .form-control:focus {
  outline: none;
  border-color: rgba(126, 235, 255, .75);
  box-shadow: 0 0 0 3px rgba(44, 173, 255, .14), 0 0 24px rgba(49, 193, 255, .18);
}
.az-component-card .control-group,
.az-component-card .mb-3,
.az-component-card .form-group {
  margin-bottom: 16px;
}
.az-component-card .controls,
.az-component-card .form-control-feedback {
  color: #b9dff2;
}
.az-component-card .alert,
.az-component-card .system-message-container joomla-alert {
  border-radius: 12px;
  overflow: hidden;
}

/* Legal / long text pages */
.az-component-card .item-page h2,
.az-component-card .com-content-article h2,
.az-component-card .item-page h3,
.az-component-card .com-content-article h3 {
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid rgba(94, 211, 255, .16);
  color: #f8fdff;
}
.az-component-card .item-page h2:first-child,
.az-component-card .com-content-article h2:first-child { margin-top: 0; }

@media (max-width: 1100px) {
  .az-component-card .blog-items,
  .az-component-card .com-content-category-blog__items {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 780px) {
  .az-component-card .item-page,
  .az-component-card .com-content-article,
  .az-component-card .com-content-category-blog,
  .az-component-card .blog,
  .az-component-card .com-users-login,
  .az-component-card .com-contact,
  .az-component-card .search {
    padding: 18px;
  }
  .az-component-card h1,
  .az-component-card .page-header h1,
  .az-component-card .page-header h2,
  .az-component-card .com-content-article__title {
    font-size: 30px;
  }
}


/* v0.4.1 Article navigation: elegant sci-fi previous/next panels */
.az-component-card .pagenavigation {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 34px 0 0;
  padding: 24px 0 0;
  border-top: 1px solid rgba(94, 210, 255, .18);
}
.az-component-card .pagenavigation li {
  list-style: none;
  min-width: 0;
}
.az-component-card .pagenavigation li.previous,
.az-component-card .pagenavigation li:first-child { justify-self: stretch; }
.az-component-card .pagenavigation li.next,
.az-component-card .pagenavigation li:last-child { justify-self: stretch; }
.az-component-card .pagenavigation a {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: 82px;
  width: 100%;
  padding: 16px 22px 16px 58px;
  overflow: hidden;
  border: 1px solid rgba(71, 202, 255, .33);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(7, 40, 76, .94), rgba(2, 14, 30, .94) 68%),
    radial-gradient(circle at 18% 50%, rgba(55, 207, 255, .22), transparent 42%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 14px 28px rgba(0,0,0,.22);
  color: #eefbff;
  text-decoration: none;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.az-component-card .pagenavigation a::before {
  content: '';
  position: absolute;
  left: 18px;
  top: 50%;
  width: 26px;
  height: 26px;
  transform: translateY(-50%);
  border: 1px solid rgba(126, 232, 255, .55);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(35, 151, 255, .48), rgba(5, 32, 63, .68));
  box-shadow: 0 0 18px rgba(45, 198, 255, .22), inset 0 0 14px rgba(255,255,255,.08);
}
.az-component-card .pagenavigation a::after {
  content: '‹';
  position: absolute;
  left: 26px;
  top: 50%;
  transform: translateY(-52%);
  color: #bff6ff;
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 0 12px rgba(77, 219, 255, .7);
}
.az-component-card .pagenavigation li.next a,
.az-component-card .pagenavigation li:last-child a {
  align-items: flex-end;
  padding-left: 22px;
  padding-right: 58px;
  text-align: right;
}
.az-component-card .pagenavigation li.next a::before,
.az-component-card .pagenavigation li:last-child a::before {
  left: auto;
  right: 18px;
}
.az-component-card .pagenavigation li.next a::after,
.az-component-card .pagenavigation li:last-child a::after {
  content: '›';
  left: auto;
  right: 26px;
}
.az-component-card .pagenavigation a:hover {
  transform: translateY(-2px);
  border-color: rgba(119, 234, 255, .72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 28px rgba(40, 177, 255, .24), 0 18px 34px rgba(0,0,0,.28);
}
.az-article-nav-kicker {
  display: block;
  margin-bottom: 5px;
  color: #6fdfff;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .16em;
}
.az-article-nav-title {
  display: block;
  color: #ffffff;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.25;
  text-shadow: 0 0 14px rgba(95, 215, 255, .22);
}
.az-component-card .pager a:empty,
.az-component-card .pagination a:empty,
.az-component-card .pagination span:empty,
.az-component-card .pagenavigation a:empty,
.az-component-card .pagenavigation span:empty {
  display: none !important;
}
@media (max-width: 760px) {
  .az-component-card .pagenavigation { grid-template-columns: 1fr; }
  .az-component-card .pagenavigation li.next a,
  .az-component-card .pagenavigation li:last-child a {
    align-items: flex-start;
    text-align: left;
    padding-left: 58px;
    padding-right: 22px;
  }
  .az-component-card .pagenavigation li.next a::before,
  .az-component-card .pagenavigation li:last-child a::before { left: 18px; right: auto; }
  .az-component-card .pagenavigation li.next a::after,
  .az-component-card .pagenavigation li:last-child a::after { left: 26px; right: auto; }
}

/* v0.4.2 Slim aligned article previous/next navigation */
.az-component-card .pagenavigation {
  display: grid !important;
  grid-template-columns: auto auto !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 24px 0 0 !important;
  padding: 16px 0 0 !important;
  border-top: 1px solid rgba(94, 210, 255, .16) !important;
}
.az-component-card .pagenavigation li {
  width: auto !important;
  min-width: 0 !important;
}
.az-component-card .pagenavigation li.previous,
.az-component-card .pagenavigation li:first-child {
  justify-self: start !important;
}
.az-component-card .pagenavigation li.next,
.az-component-card .pagenavigation li:last-child {
  justify-self: end !important;
}
.az-component-card .pagenavigation a {
  min-height: 48px !important;
  width: auto !important;
  min-width: 245px !important;
  max-width: 360px !important;
  padding: 8px 16px 8px 44px !important;
  border-radius: 11px !important;
  background:
    linear-gradient(135deg, rgba(4, 33, 63, .96), rgba(1, 13, 29, .96) 70%),
    radial-gradient(circle at 16% 50%, rgba(55, 207, 255, .18), transparent 42%) !important;
  clip-path: polygon(0 0, calc(100% - 13px) 0, 100% 13px, 100% 100%, 13px 100%, 0 calc(100% - 13px)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 8px 18px rgba(0,0,0,.18) !important;
}
.az-component-card .pagenavigation a::before {
  left: 14px !important;
  width: 21px !important;
  height: 21px !important;
  border-radius: 7px !important;
}
.az-component-card .pagenavigation a::after {
  left: 21px !important;
  font-size: 17px !important;
}
.az-component-card .pagenavigation li.next a,
.az-component-card .pagenavigation li:last-child a {
  padding-left: 16px !important;
  padding-right: 44px !important;
  align-items: flex-end !important;
  text-align: right !important;
}
.az-component-card .pagenavigation li.next a::before,
.az-component-card .pagenavigation li:last-child a::before {
  left: auto !important;
  right: 14px !important;
}
.az-component-card .pagenavigation li.next a::after,
.az-component-card .pagenavigation li:last-child a::after {
  left: auto !important;
  right: 21px !important;
}
.az-article-nav-kicker {
  margin-bottom: 2px !important;
  font-size: 9px !important;
  letter-spacing: .18em !important;
  color: #78e8ff !important;
}
.az-article-nav-title {
  font-size: 14px !important;
  line-height: 1.12 !important;
}
.az-component-card .pagenavigation a:hover {
  transform: translateY(-1px) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 22px rgba(40, 177, 255, .2), 0 10px 22px rgba(0,0,0,.24) !important;
}
@media (max-width: 760px) {
  .az-component-card .pagenavigation {
    grid-template-columns: 1fr !important;
    justify-content: stretch !important;
  }
  .az-component-card .pagenavigation li,
  .az-component-card .pagenavigation a {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  .az-component-card .pagenavigation li.next,
  .az-component-card .pagenavigation li:last-child,
  .az-component-card .pagenavigation li.previous,
  .az-component-card .pagenavigation li:first-child {
    justify-self: stretch !important;
  }
  .az-component-card .pagenavigation li.next a,
  .az-component-card .pagenavigation li:last-child a {
    align-items: flex-start !important;
    text-align: left !important;
    padding-left: 44px !important;
    padding-right: 16px !important;
  }
  .az-component-card .pagenavigation li.next a::before,
  .az-component-card .pagenavigation li:last-child a::before { left: 14px !important; right: auto !important; }
  .az-component-card .pagenavigation li.next a::after,
  .az-component-card .pagenavigation li:last-child a::after { left: 21px !important; right: auto !important; }
}


/* v0.4.3 Article navigation: one-line command links with true left/right alignment */
.az-component-card .pagenavigation,
.az-component-card ul.pagenav,
.az-component-card .pager.pagenav {
  display: flex !important;
  width: 100% !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 22px 0 0 !important;
  padding: 14px 0 0 !important;
  border-top: 1px solid rgba(94, 210, 255, .14) !important;
}
.az-component-card .pagenavigation li,
.az-component-card ul.pagenav li,
.az-component-card .pager.pagenav li {
  list-style: none !important;
  width: auto !important;
  min-width: 0 !important;
}
.az-component-card .pagenavigation li.previous,
.az-component-card .pagenavigation li:first-child,
.az-component-card ul.pagenav li.previous,
.az-component-card ul.pagenav li:first-child {
  margin-right: auto !important;
  justify-self: start !important;
}
.az-component-card .pagenavigation li.next,
.az-component-card .pagenavigation li:last-child,
.az-component-card ul.pagenav li.next,
.az-component-card ul.pagenav li:last-child {
  margin-left: auto !important;
  justify-self: end !important;
}
.az-component-card .pagenavigation a,
.az-component-card ul.pagenav a,
.az-component-card .pager.pagenav a {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  min-height: 38px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: min(420px, 46vw) !important;
  padding: 7px 13px 7px 40px !important;
  border-radius: 10px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  background:
    linear-gradient(135deg, rgba(5, 35, 66, .94), rgba(1, 14, 31, .96) 68%),
    radial-gradient(circle at 14% 50%, rgba(66, 213, 255, .16), transparent 42%) !important;
  border: 1px solid rgba(71, 202, 255, .28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 7px 16px rgba(0,0,0,.16) !important;
  clip-path: polygon(0 0, calc(100% - 11px) 0, 100% 11px, 100% 100%, 11px 100%, 0 calc(100% - 11px)) !important;
}
.az-component-card .pagenavigation li.next a,
.az-component-card .pagenavigation li:last-child a,
.az-component-card ul.pagenav li.next a,
.az-component-card ul.pagenav li:last-child a {
  justify-content: flex-end !important;
  text-align: right !important;
  padding-left: 13px !important;
  padding-right: 40px !important;
}
.az-component-card .pagenavigation a::before,
.az-component-card ul.pagenav a::before {
  left: 13px !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 7px !important;
}
.az-component-card .pagenavigation a::after,
.az-component-card ul.pagenav a::after {
  left: 20px !important;
  font-size: 16px !important;
}
.az-component-card .pagenavigation li.next a::before,
.az-component-card .pagenavigation li:last-child a::before,
.az-component-card ul.pagenav li.next a::before,
.az-component-card ul.pagenav li:last-child a::before {
  left: auto !important;
  right: 13px !important;
}
.az-component-card .pagenavigation li.next a::after,
.az-component-card .pagenavigation li:last-child a::after,
.az-component-card ul.pagenav li.next a::after,
.az-component-card ul.pagenav li:last-child a::after {
  left: auto !important;
  right: 20px !important;
}
.az-component-card .pagenavigation .az-article-nav-kicker,
.az-component-card ul.pagenav .az-article-nav-kicker {
  display: inline-block !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
  color: #ffffff !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  text-shadow: 0 0 12px rgba(104, 224, 255, .4) !important;
}
.az-component-card .pagenavigation .az-article-nav-title,
.az-component-card ul.pagenav .az-article-nav-title {
  display: inline-block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  color: #7fb7cf !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 750 !important;
  letter-spacing: .01em !important;
  text-shadow: none !important;
}
.az-component-card .pagenavigation a:hover .az-article-nav-title,
.az-component-card ul.pagenav a:hover .az-article-nav-title {
  color: #a9e8ff !important;
}
@media (max-width: 760px) {
  .az-component-card .pagenavigation,
  .az-component-card ul.pagenav,
  .az-component-card .pager.pagenav {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .az-component-card .pagenavigation li,
  .az-component-card ul.pagenav li {
    margin: 0 !important;
  }
  .az-component-card .pagenavigation a,
  .az-component-card ul.pagenav a {
    width: 100% !important;
    max-width: none !important;
  }
}

/* v0.4.4 Article navigation: segmented command chip with plain pressed title */
.az-component-card .pagenavigation,
.az-component-card ul.pagenav,
.az-component-card .pager.pagenav {
  display: flex !important;
  width: 100% !important;
  max-width: none !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 20px 0 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px solid rgba(94, 210, 255, .14) !important;
}
.az-component-card .pagenavigation li,
.az-component-card ul.pagenav li,
.az-component-card .pager.pagenav li {
  list-style: none !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
}
.az-component-card .pagenavigation li.previous,
.az-component-card .pagenavigation li:first-child,
.az-component-card ul.pagenav li.previous,
.az-component-card ul.pagenav li:first-child {
  margin-right: auto !important;
}
.az-component-card .pagenavigation li.next,
.az-component-card .pagenavigation li:last-child,
.az-component-card ul.pagenav li.next,
.az-component-card ul.pagenav li:last-child {
  margin-left: auto !important;
}
.az-component-card .pagenavigation a,
.az-component-card ul.pagenav a,
.az-component-card .pager.pagenav a {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 32px !important;
  max-width: min(520px, 48vw) !important;
  padding: 5px 10px !important;
  border-radius: 9px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  color: #e8fbff !important;
  text-decoration: none !important;
  background:
    linear-gradient(135deg, rgba(5, 35, 66, .88), rgba(0, 13, 31, .92) 72%),
    radial-gradient(circle at 18% 50%, rgba(66, 213, 255, .12), transparent 46%) !important;
  border: 1px solid rgba(71, 202, 255, .22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 -10px 22px rgba(0,0,0,.16),
    0 6px 14px rgba(0,0,0,.14) !important;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px)) !important;
}
.az-component-card .pagenavigation a::before,
.az-component-card .pagenavigation a::after,
.az-component-card ul.pagenav a::before,
.az-component-card ul.pagenav a::after,
.az-component-card .pager.pagenav a::before,
.az-component-card .pager.pagenav a::after {
  content: none !important;
  display: none !important;
}
.az-component-card .pagenavigation li.next a,
.az-component-card .pagenavigation li:last-child a,
.az-component-card ul.pagenav li.next a,
.az-component-card ul.pagenav li:last-child a {
  justify-content: flex-end !important;
  text-align: right !important;
}
.az-article-nav-arrow {
  flex: 0 0 auto !important;
  width: 16px !important;
  height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #74dcff !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-shadow:
    0 0 8px rgba(83, 220, 255, .44),
    0 1px 0 rgba(255,255,255,.16),
    0 -1px 0 rgba(0,0,0,.95) !important;
  opacity: .9 !important;
  transform: translateY(-1px) !important;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.7)) !important;
}
.az-component-card .pagenavigation .az-article-nav-kicker,
.az-component-card ul.pagenav .az-article-nav-kicker {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border-radius: 7px !important;
  color: #ffffff !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  background:
    linear-gradient(180deg, rgba(19, 105, 164, .72), rgba(5, 42, 78, .92)) !important;
  border: 1px solid rgba(104, 224, 255, .35) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -8px 14px rgba(0,0,0,.22),
    0 0 13px rgba(24, 147, 255, .14) !important;
  text-shadow: 0 0 10px rgba(104, 224, 255, .42) !important;
}
.az-component-card .pagenavigation .az-article-nav-title,
.az-component-card ul.pagenav .az-article-nav-title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: inline-block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  padding: 1px 2px !important;
  color: #6fa7bf !important;
  font-size: 12px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    inset 0 -1px 0 rgba(0,0,0,.55) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.75) !important;
}
.az-component-card .pagenavigation a:hover,
.az-component-card ul.pagenav a:hover {
  border-color: rgba(99, 224, 255, .42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    inset 0 -10px 22px rgba(0,0,0,.14),
    0 0 18px rgba(23, 148, 255, .18) !important;
  transform: translateY(-1px) !important;
}
.az-component-card .pagenavigation a:hover .az-article-nav-title,
.az-component-card ul.pagenav a:hover .az-article-nav-title {
  color: #a4dff2 !important;
}
@media (max-width: 760px) {
  .az-component-card .pagenavigation,
  .az-component-card ul.pagenav,
  .az-component-card .pager.pagenav {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .az-component-card .pagenavigation li,
  .az-component-card ul.pagenav li {
    margin: 0 !important;
  }
  .az-component-card .pagenavigation a,
  .az-component-card ul.pagenav a {
    width: 100% !important;
    max-width: none !important;
  }
  .az-component-card .pagenavigation li.next a,
  .az-component-card .pagenavigation li:last-child a,
  .az-component-card ul.pagenav li.next a,
  .az-component-card ul.pagenav li:last-child a {
    justify-content: flex-start !important;
    text-align: left !important;
  }
}

/* v0.4.5 Article navigation: full-width alignment, plain arrows, pressed title */
.az-component-card nav.pagenavigation,
.az-component-card .pagenavigation {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  clear: both !important;
  margin: 20px 0 0 !important;
  padding: 12px 0 0 !important;
  border-top: 1px solid rgba(94, 210, 255, .16) !important;
}
.az-component-card nav.pagenavigation > ul,
.az-component-card .pagenavigation > ul,
.az-component-card ul.pagenav,
.az-component-card .pager.pagenav,
.az-component-card .pagenavigation .pagination {
  display: flex !important;
  width: 100% !important;
  max-width: none !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  list-style: none !important;
}
.az-component-card nav.pagenavigation > ul > li,
.az-component-card .pagenavigation > ul > li,
.az-component-card ul.pagenav > li,
.az-component-card .pager.pagenav > li,
.az-component-card .pagenavigation .pagination > li {
  list-style: none !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
.az-component-card nav.pagenavigation > ul > li.previous,
.az-component-card .pagenavigation > ul > li.previous,
.az-component-card .pagenavigation > ul > li:first-child,
.az-component-card ul.pagenav > li.previous,
.az-component-card ul.pagenav > li:first-child {
  margin-right: auto !important;
  justify-self: flex-start !important;
}
.az-component-card nav.pagenavigation > ul > li.next,
.az-component-card .pagenavigation > ul > li.next,
.az-component-card .pagenavigation > ul > li:last-child,
.az-component-card ul.pagenav > li.next,
.az-component-card ul.pagenav > li:last-child {
  margin-left: auto !important;
  justify-self: flex-end !important;
  text-align: right !important;
}
.az-component-card .pagenavigation a,
.az-component-card ul.pagenav a,
.az-component-card .pager.pagenav a,
.az-component-card .pagenavigation .pagination a {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: min(620px, 48vw) !important;
  min-height: 28px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: none !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #d7f5ff !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.az-component-card .pagenavigation li.next a,
.az-component-card .pagenavigation li:last-child a,
.az-component-card ul.pagenav li.next a,
.az-component-card ul.pagenav li:last-child a,
.az-component-card .pagenavigation .pagination li.next a,
.az-component-card .pagenavigation .pagination li:last-child a {
  justify-content: flex-end !important;
  text-align: right !important;
}
.az-component-card .pagenavigation a::before,
.az-component-card .pagenavigation a::after,
.az-component-card ul.pagenav a::before,
.az-component-card ul.pagenav a::after,
.az-component-card .pager.pagenav a::before,
.az-component-card .pager.pagenav a::after {
  content: none !important;
  display: none !important;
}
.az-article-nav-kicker {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  padding: 0 14px !important;
  border-radius: 7px !important;
  color: #fff !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  background: linear-gradient(180deg, rgba(21, 121, 184, .86), rgba(6, 48, 91, .96)) !important;
  border: 1px solid rgba(104, 224, 255, .38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -8px 14px rgba(0,0,0,.24),
    0 0 14px rgba(24, 147, 255, .14) !important;
  text-shadow: 0 0 10px rgba(104, 224, 255, .45) !important;
}
.az-article-nav-title,
.az-component-card .pagenavigation .az-article-nav-title,
.az-component-card ul.pagenav .az-article-nav-title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: inline-block !important;
  max-width: 360px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  padding: 3px 0 !important;
  color: #6eabc4 !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  letter-spacing: .015em !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: inset 0 -1px 0 rgba(41, 151, 192, .16) !important;
  text-shadow:
    0 1px 0 rgba(0,0,0,.9),
    0 -1px 0 rgba(255,255,255,.035) !important;
}
.az-article-nav-arrow {
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 2px !important;
  color: #58d4ff !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  opacity: .9 !important;
  transform: translateY(-1px) !important;
  text-shadow:
    0 0 10px rgba(83, 220, 255, .52),
    0 1px 0 rgba(0,0,0,.95),
    0 -1px 0 rgba(255,255,255,.12) !important;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.9)) !important;
}
.az-component-card .pagenavigation a:hover,
.az-component-card ul.pagenav a:hover,
.az-component-card .pager.pagenav a:hover {
  transform: translateY(-1px) !important;
}
.az-component-card .pagenavigation a:hover .az-article-nav-title,
.az-component-card ul.pagenav a:hover .az-article-nav-title,
.az-component-card .pager.pagenav a:hover .az-article-nav-title {
  color: #a4e7ff !important;
}
.az-component-card .pagenavigation a:hover .az-article-nav-arrow,
.az-component-card ul.pagenav a:hover .az-article-nav-arrow,
.az-component-card .pager.pagenav a:hover .az-article-nav-arrow {
  color: #a7efff !important;
  text-shadow: 0 0 14px rgba(111, 229, 255, .7), 0 1px 0 rgba(0,0,0,.95) !important;
}
@media (max-width: 760px) {
  .az-component-card nav.pagenavigation > ul,
  .az-component-card .pagenavigation > ul,
  .az-component-card ul.pagenav,
  .az-component-card .pager.pagenav,
  .az-component-card .pagenavigation .pagination {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .az-component-card nav.pagenavigation > ul > li,
  .az-component-card .pagenavigation > ul > li,
  .az-component-card ul.pagenav > li,
  .az-component-card .pager.pagenav > li {
    margin: 0 !important;
    width: 100% !important;
  }
  .az-component-card .pagenavigation a,
  .az-component-card ul.pagenav a,
  .az-component-card .pager.pagenav a {
    width: 100% !important;
    max-width: none !important;
  }
  .az-component-card .pagenavigation li.next a,
  .az-component-card .pagenavigation li:last-child a,
  .az-component-card ul.pagenav li.next a,
  .az-component-card ul.pagenav li:last-child a {
    justify-content: flex-end !important;
  }
}


/* v0.4.6 Article navigation: align title inset background with text */
.az-component-card .pagenavigation a,
.az-component-card ul.pagenav a,
.az-component-card .pager.pagenav a,
.az-component-card .pagenavigation .pagination a {
  align-items: center !important;
  gap: 9px !important;
}
.az-article-nav-title,
.az-component-card .pagenavigation .az-article-nav-title,
.az-component-card ul.pagenav .az-article-nav-title,
.az-component-card .pager.pagenav .az-article-nav-title {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  height: 24px !important;
  padding: 0 10px !important;
  margin: 0 !important;
  line-height: 1 !important;
  color: #79b8d0 !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  border-radius: 7px !important;
  background: linear-gradient(180deg, rgba(4, 28, 50, .42), rgba(0, 10, 25, .34)) !important;
  border: 1px solid rgba(67, 187, 238, .12) !important;
  border-top-color: rgba(123, 226, 255, .05) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    inset 0 -1px 0 rgba(5, 130, 180, .20),
    inset 0 -8px 12px rgba(0,0,0,.12) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.9) !important;
  transform: translateY(0) !important;
}
.az-article-nav-arrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 24px !important;
  min-height: 24px !important;
  line-height: 24px !important;
  transform: none !important;
  padding: 0 2px !important;
}
.az-article-nav-kicker {
  height: 24px !important;
  min-height: 24px !important;
}
.az-component-card .pagenavigation li.next a,
.az-component-card .pagenavigation li:last-child a,
.az-component-card ul.pagenav li.next a,
.az-component-card ul.pagenav li:last-child a,
.az-component-card .pagenavigation .pagination li.next a,
.az-component-card .pagenavigation .pagination li:last-child a {
  margin-left: auto !important;
}
@media (max-width: 760px) {
  .az-article-nav-title,
  .az-component-card .pagenavigation .az-article-nav-title,
  .az-component-card ul.pagenav .az-article-nav-title,
  .az-component-card .pager.pagenav .az-article-nav-title {
    max-width: calc(100vw - 190px) !important;
  }
}

/* v0.4.7 Article navigation: darker 3D light hover for Previous/Next command buttons */
.az-article-nav-kicker {
  position: relative !important;
  overflow: hidden !important;
  transition:
    background .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    color .18s ease,
    transform .18s ease,
    filter .18s ease !important;
}
.az-article-nav-kicker::after {
  content: "" !important;
  position: absolute !important;
  inset: 1px 1px auto 1px !important;
  height: 45% !important;
  pointer-events: none !important;
  border-radius: 6px 6px 3px 3px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.03) 70%, transparent) !important;
  opacity: .52 !important;
  transition: opacity .18s ease, transform .18s ease !important;
}
.az-component-card .pagenavigation a:hover .az-article-nav-kicker,
.az-component-card ul.pagenav a:hover .az-article-nav-kicker,
.az-component-card .pager.pagenav a:hover .az-article-nav-kicker,
.az-component-card .pagenavigation .pagination a:hover .az-article-nav-kicker {
  color: #f3fdff !important;
  background:
    linear-gradient(135deg, rgba(81, 216, 255, .16), transparent 36%),
    linear-gradient(180deg, rgba(10, 77, 126, .96) 0%, rgba(4, 39, 80, .98) 45%, rgba(1, 19, 43, 1) 100%) !important;
  border-color: rgba(101, 225, 255, .46) !important;
  border-top-color: rgba(191, 247, 255, .38) !important;
  border-bottom-color: rgba(0, 35, 75, .95) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -1px 0 rgba(0,0,0,.80),
    inset 0 -9px 16px rgba(0,0,0,.36),
    inset 0 0 14px rgba(52, 178, 255, .15),
    0 1px 0 rgba(125, 230, 255, .12),
    0 0 16px rgba(33, 164, 255, .20) !important;
  transform: translateY(1px) !important;
  filter: saturate(1.08) contrast(1.06) !important;
  text-shadow:
    0 0 9px rgba(129, 231, 255, .46),
    0 1px 0 rgba(0,0,0,.95) !important;
}
.az-component-card .pagenavigation a:hover .az-article-nav-kicker::after,
.az-component-card ul.pagenav a:hover .az-article-nav-kicker::after,
.az-component-card .pager.pagenav a:hover .az-article-nav-kicker::after,
.az-component-card .pagenavigation .pagination a:hover .az-article-nav-kicker::after {
  opacity: .72 !important;
  transform: translateY(-1px) !important;
}
.az-component-card .pagenavigation a:active .az-article-nav-kicker,
.az-component-card ul.pagenav a:active .az-article-nav-kicker,
.az-component-card .pager.pagenav a:active .az-article-nav-kicker,
.az-component-card .pagenavigation .pagination a:active .az-article-nav-kicker {
  background: linear-gradient(180deg, rgba(3, 48, 92, 1), rgba(1, 16, 38, 1)) !important;
  transform: translateY(2px) !important;
  box-shadow:
    inset 0 2px 8px rgba(0,0,0,.55),
    inset 0 0 10px rgba(43, 153, 226, .16),
    0 0 10px rgba(33, 164, 255, .10) !important;
}


/* v0.4.8 Article content headings: futuristic fade headers */
.az-component-card .item-page h2,
.az-component-card .com-content-article h2,
.az-component-card .item-page h3,
.az-component-card .com-content-article h3,
.az-component-card .articleBody h2,
.az-component-card .articleBody h3 {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  min-height: 44px !important;
  margin: 34px 0 18px !important;
  padding: 10px 24px 10px 22px !important;
  border: 0 !important;
  border-top: 0 !important;
  color: #f5fdff !important;
  text-transform: uppercase !important;
  letter-spacing: .045em !important;
  line-height: 1.15 !important;
  background:
    linear-gradient(90deg,
      transparent 0%,
      rgba(28, 139, 218, .06) 2%,
      rgba(28, 139, 218, .38) 10%,
      rgba(13, 72, 124, .56) 50%,
      rgba(13, 72, 124, .28) 82%,
      rgba(13, 72, 124, .06) 94%,
      transparent 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(143, 234, 255, .12),
    inset 0 -1px 0 rgba(70, 211, 255, .22),
    0 0 22px rgba(26, 145, 255, .08) !important;
  overflow: hidden !important;
}
.az-component-card .item-page h2:first-child,
.az-component-card .com-content-article h2:first-child,
.az-component-card .item-page h3:first-child,
.az-component-card .com-content-article h3:first-child {
  margin-top: 0 !important;
}
.az-component-card .item-page h2::before,
.az-component-card .com-content-article h2::before,
.az-component-card .item-page h3::before,
.az-component-card .com-content-article h3::before,
.az-component-card .articleBody h2::before,
.az-component-card .articleBody h3::before {
  content: '' !important;
  width: 7px !important;
  height: 7px !important;
  margin-right: 12px !important;
  flex: 0 0 auto !important;
  border: 1px solid rgba(132, 240, 255, .86) !important;
  border-radius: 2px !important;
  background: rgba(54, 207, 255, .22) !important;
  box-shadow:
    0 0 9px rgba(84, 222, 255, .58),
    inset 0 0 4px rgba(255,255,255,.20) !important;
}
.az-component-card .item-page h2::after,
.az-component-card .com-content-article h2::after,
.az-component-card .item-page h3::after,
.az-component-card .com-content-article h3::after,
.az-component-card .articleBody h2::after,
.az-component-card .articleBody h3::after {
  content: '' !important;
  position: absolute !important;
  pointer-events: none !important;
  inset: 0 !important;
  background:
    linear-gradient(120deg, transparent 0%, rgba(255,255,255,.10) 12%, transparent 28%),
    linear-gradient(90deg, rgba(100, 231, 255, .42), rgba(100, 231, 255, .00) 24%, rgba(100, 231, 255, .00) 76%, rgba(100, 231, 255, .30) 100%) !important;
  opacity: .46 !important;
  mix-blend-mode: screen !important;
}
.az-component-card .item-page h2,
.az-component-card .com-content-article h2,
.az-component-card .articleBody h2 {
  min-height: 50px !important;
  font-size: clamp(21px, 1.45vw, 28px) !important;
  font-weight: 900 !important;
}
.az-component-card .item-page h3,
.az-component-card .com-content-article h3,
.az-component-card .articleBody h3 {
  min-height: 42px !important;
  font-size: clamp(15px, 1vw, 18px) !important;
  font-weight: 900 !important;
  color: #e9faff !important;
}
.az-component-card .item-page h4,
.az-component-card .com-content-article h4,
.az-component-card .articleBody h4 {
  margin: 28px 0 14px !important;
  padding: 8px 0 8px 18px !important;
  border-left: 3px solid rgba(91, 225, 255, .78) !important;
  color: #c8f5ff !important;
  text-transform: uppercase !important;
  letter-spacing: .055em !important;
  background: linear-gradient(90deg, rgba(29, 142, 220, .18), transparent 70%) !important;
  box-shadow: inset 0 -1px 0 rgba(88, 215, 255, .10) !important;
}
@media (max-width: 780px) {
  .az-component-card .item-page h2,
  .az-component-card .com-content-article h2,
  .az-component-card .item-page h3,
  .az-component-card .com-content-article h3,
  .az-component-card .articleBody h2,
  .az-component-card .articleBody h3 {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* v0.4.9 Article heading spike refinement
   Make article h2/h3 headers feel more like Aresenya command labels: sharper
   tapered ends that dissolve into the background, plus stronger text shadows
   for readability. */
.az-component-card .item-page h2,
.az-component-card .com-content-article h2,
.az-component-card .articleBody h2,
.az-component-card .item-page h3,
.az-component-card .com-content-article h3,
.az-component-card .articleBody h3 {
  position: relative !important;
  isolation: isolate !important;
  padding: 10px 34px 10px 28px !important;
  clip-path: polygon(18px 0, calc(100% - 46px) 0, 100% 50%, calc(100% - 46px) 100%, 18px 100%, 0 50%) !important;
  background:
    radial-gradient(circle at 7% 50%, rgba(98, 230, 255, .20), transparent 18%),
    linear-gradient(90deg,
      transparent 0%,
      rgba(33, 160, 235, .20) 3%,
      rgba(29, 125, 194, .58) 12%,
      rgba(11, 57, 102, .66) 44%,
      rgba(10, 46, 86, .44) 72%,
      rgba(18, 91, 148, .18) 88%,
      transparent 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(166, 246, 255, .20),
    inset 0 -1px 0 rgba(35, 195, 255, .26),
    inset 18px 0 30px rgba(58, 200, 255, .10),
    inset -30px 0 44px rgba(6, 14, 34, .38),
    0 0 22px rgba(45, 179, 255, .09) !important;
  text-shadow:
    0 0 7px rgba(118, 232, 255, .40),
    0 2px 0 rgba(0, 0, 0, .80),
    0 10px 20px rgba(0, 0, 0, .36) !important;
}

.az-component-card .item-page h2::before,
.az-component-card .com-content-article h2::before,
.az-component-card .articleBody h2::before,
.az-component-card .item-page h3::before,
.az-component-card .com-content-article h3::before,
.az-component-card .articleBody h3::before {
  width: 8px !important;
  height: 8px !important;
  margin-right: 14px !important;
  border-radius: 2px !important;
  background:
    radial-gradient(circle, rgba(235, 255, 255, .80), rgba(78, 220, 255, .22) 52%, rgba(6, 39, 68, .35) 100%) !important;
  box-shadow:
    0 0 12px rgba(92, 231, 255, .75),
    0 0 22px rgba(32, 158, 255, .36),
    inset 0 0 3px rgba(255,255,255,.28) !important;
}

.az-component-card .item-page h2::after,
.az-component-card .com-content-article h2::after,
.az-component-card .articleBody h2::after,
.az-component-card .item-page h3::after,
.az-component-card .com-content-article h3::after,
.az-component-card .articleBody h3::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: -1 !important;
  background:
    linear-gradient(120deg, transparent 0%, rgba(255,255,255,.13) 10%, transparent 25%),
    linear-gradient(90deg,
      transparent 0%,
      rgba(116, 237, 255, .34) 4%,
      transparent 17%,
      transparent 78%,
      rgba(92, 218, 255, .25) 91%,
      transparent 100%) !important;
  opacity: .72 !important;
  mix-blend-mode: screen !important;
}

.az-component-card .item-page h2 {
  font-size: clamp(22px, 1.5vw, 30px) !important;
}

.az-component-card .item-page h3,
.az-component-card .com-content-article h3,
.az-component-card .articleBody h3 {
  font-size: clamp(16px, 1.05vw, 20px) !important;
}

.az-component-card .item-page h4,
.az-component-card .com-content-article h4,
.az-component-card .articleBody h4 {
  position: relative !important;
  clip-path: polygon(10px 0, calc(100% - 28px) 0, 100% 50%, calc(100% - 28px) 100%, 10px 100%, 0 50%) !important;
  padding: 9px 20px 9px 18px !important;
  border-left: 0 !important;
  background:
    linear-gradient(90deg,
      transparent 0%,
      rgba(33, 159, 230, .22) 5%,
      rgba(12, 70, 119, .42) 34%,
      rgba(12, 70, 119, .16) 76%,
      transparent 100%) !important;
  color: #d7fbff !important;
  text-shadow: 0 0 7px rgba(96, 228, 255, .35), 0 2px 0 rgba(0,0,0,.78) !important;
}

@media (max-width: 780px) {
  .az-component-card .item-page h2,
  .az-component-card .com-content-article h2,
  .az-component-card .articleBody h2,
  .az-component-card .item-page h3,
  .az-component-card .com-content-article h3,
  .az-component-card .articleBody h3 {
    clip-path: polygon(12px 0, calc(100% - 28px) 0, 100% 50%, calc(100% - 28px) 100%, 12px 100%, 0 50%) !important;
    padding: 10px 22px 10px 18px !important;
  }
}


/* v0.4.10 Article heading contrast refinement
   Darken the sci-fi heading background slightly while preserving the spike shape,
   glow, and readability from v0.4.9. */
.az-component-card .item-page h2,
.az-component-card .com-content-article h2,
.az-component-card .articleBody h2,
.az-component-card .item-page h3,
.az-component-card .com-content-article h3,
.az-component-card .articleBody h3 {
  background:
    radial-gradient(circle at 7% 50%, rgba(87, 220, 255, .16), transparent 18%),
    linear-gradient(90deg,
      transparent 0%,
      rgba(22, 118, 179, .16) 3%,
      rgba(18, 88, 143, .48) 12%,
      rgba(7, 37, 74, .82) 44%,
      rgba(6, 30, 64, .66) 72%,
      rgba(15, 70, 118, .16) 88%,
      transparent 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(150, 238, 255, .16),
    inset 0 -1px 0 rgba(30, 170, 230, .22),
    inset 18px 0 30px rgba(42, 170, 225, .08),
    inset -30px 0 44px rgba(0, 8, 24, .52),
    0 0 20px rgba(30, 150, 230, .07) !important;
}

.az-component-card .item-page h4,
.az-component-card .com-content-article h4,
.az-component-card .articleBody h4 {
  background:
    linear-gradient(90deg,
      transparent 0%,
      rgba(24, 130, 196, .16) 5%,
      rgba(8, 48, 91, .54) 34%,
      rgba(8, 42, 80, .24) 76%,
      transparent 100%) !important;
}

/* v0.4.11 — Article details pressed telemetry strip
   Makes Joomla article info/details subtle, inset and readable without dominating the article page. */
.az-component-card .article-info,
.az-component-card .article-info-muted,
.az-component-card .com-content-article__info {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px 16px;
  margin: 2px 0 26px;
  padding: 10px 14px;
  list-style: none;
  border-top: 1px solid rgba(76, 190, 255, .14);
  border-bottom: 1px solid rgba(6, 18, 34, .82);
  border-left: 1px solid rgba(72, 186, 255, .08);
  border-right: 1px solid rgba(72, 186, 255, .06);
  border-radius: 0 0 10px 10px;
  background:
    linear-gradient(180deg, rgba(2, 10, 20, .36), rgba(9, 29, 50, .16) 45%, rgba(2, 8, 16, .42)),
    linear-gradient(90deg, rgba(72, 207, 255, .055), transparent 16%, transparent 84%, rgba(72, 207, 255, .04));
  box-shadow:
    inset 0 2px 6px rgba(0,0,0,.55),
    inset 0 -1px 0 rgba(108, 223, 255, .08),
    0 1px 0 rgba(255,255,255,.035);
  color: rgba(166, 216, 236, .78);
  font-size: 12px;
  line-height: 1.35;
  letter-spacing: .095em;
  text-transform: uppercase;
}
.az-component-card .article-info::before,
.az-component-card .article-info-muted::before,
.az-component-card .com-content-article__info::before {
  content: '';
  position: absolute;
  left: 14px;
  right: 14px;
  top: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(111, 226, 255, .32), transparent);
  opacity: .55;
  pointer-events: none;
}
.az-component-card .article-info::after,
.az-component-card .article-info-muted::after,
.az-component-card .com-content-article__info::after {
  content: '';
  position: absolute;
  left: 12px;
  top: 50%;
  width: 5px;
  height: 5px;
  transform: translateY(-50%);
  border: 1px solid rgba(113, 238, 255, .42);
  border-radius: 2px;
  box-shadow: 0 0 8px rgba(90, 220, 255, .22), inset 0 0 5px rgba(90, 220, 255, .14);
  opacity: .7;
  pointer-events: none;
}
.az-component-card .article-info > *:first-child,
.az-component-card .article-info-muted > *:first-child,
.az-component-card .com-content-article__info > *:first-child {
  margin-left: 12px;
}
.az-component-card .article-info dd,
.az-component-card .article-info dt,
.az-component-card .article-info-muted dd,
.az-component-card .article-info-muted dt,
.az-component-card .com-content-article__info dd,
.az-component-card .com-content-article__info dt {
  margin: 0;
  color: inherit;
  font-size: inherit;
  line-height: 1.35;
  text-shadow: 0 -1px 0 rgba(0,0,0,.55), 0 1px 0 rgba(118, 224, 255, .05);
}
.az-component-card .article-info .article-info-term,
.az-component-card .article-info dt,
.az-component-card .article-info-muted .article-info-term,
.az-component-card .article-info-muted dt,
.az-component-card .com-content-article__info .article-info-term,
.az-component-card .com-content-article__info dt {
  color: rgba(148, 199, 223, .62);
  font-weight: 800;
}
.az-component-card .article-info dd,
.az-component-card .article-info-muted dd,
.az-component-card .com-content-article__info dd {
  color: rgba(190, 235, 252, .78);
  font-weight: 650;
}
.az-component-card .article-info a,
.az-component-card .article-info-muted a,
.az-component-card .com-content-article__info a {
  color: rgba(137, 232, 255, .82) !important;
}
.az-component-card .article-info dd:not(:last-child)::after,
.az-component-card .article-info-muted dd:not(:last-child)::after,
.az-component-card .com-content-article__info dd:not(:last-child)::after {
  content: '•';
  margin-left: 16px;
  color: rgba(76, 210, 255, .62);
  text-shadow: 0 0 9px rgba(76, 210, 255, .2);
}

@media (max-width: 700px) {
  .az-component-card .article-info,
  .az-component-card .article-info-muted,
  .az-component-card .com-content-article__info {
    gap: 7px 10px;
    padding: 9px 10px 9px 12px;
    font-size: 11px;
    letter-spacing: .055em;
  }
  .az-component-card .article-info > *:first-child,
  .az-component-card .article-info-muted > *:first-child,
  .az-component-card .com-content-article__info > *:first-child { margin-left: 10px; }
}

/* v0.4.14 — Article title/detail separator and heading contrast refinement
   The page-title glow line now becomes the only separator before the details strip,
   and article section headings are darker where white text sits. */
.az-component-card .page-header {
  margin: 0 0 10px !important;
  padding: 0 0 12px !important;
  border-bottom: 0 !important;
}
.az-component-card .page-header::after {
  width: 20% !important;
  min-width: 190px !important;
  max-width: 360px !important;
  height: 2px !important;
  margin-top: 14px !important;
  background: linear-gradient(90deg,
    rgba(120, 238, 255, .98) 0%,
    rgba(54, 189, 255, .72) 48%,
    rgba(20, 105, 174, .32) 76%,
    transparent 100%) !important;
  box-shadow:
    0 0 12px rgba(80, 220, 255, .36),
    18px 0 28px rgba(19, 116, 198, .18) !important;
}
.az-component-card .article-info,
.az-component-card .article-info-muted,
.az-component-card .com-content-article__info {
  margin-top: 0 !important;
  border-top: 0 !important;
}
.az-component-card .article-info::before,
.az-component-card .article-info-muted::before,
.az-component-card .com-content-article__info::before {
  display: none !important;
}

.az-component-card .item-page h2,
.az-component-card .com-content-article h2,
.az-component-card .articleBody h2,
.az-component-card .item-page h3,
.az-component-card .com-content-article h3,
.az-component-card .articleBody h3 {
  background:
    radial-gradient(circle at 7% 50%, rgba(75, 215, 255, .12), transparent 18%),
    linear-gradient(90deg,
      transparent 0%,
      rgba(17, 86, 137, .12) 3%,
      rgba(12, 58, 104, .38) 13%,
      rgba(4, 25, 55, .94) 44%,
      rgba(4, 22, 50, .82) 72%,
      rgba(12, 56, 101, .14) 88%,
      transparent 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(142, 232, 255, .12),
    inset 0 -1px 0 rgba(26, 150, 215, .18),
    inset 18px 0 30px rgba(36, 150, 210, .06),
    inset -34px 0 48px rgba(0, 6, 22, .62),
    0 0 18px rgba(22, 135, 220, .06) !important;
  text-shadow:
    0 0 8px rgba(121, 237, 255, .46),
    0 2px 0 rgba(0, 0, 0, .86),
    0 12px 22px rgba(0, 0, 0, .42) !important;
}
.az-component-card .item-page h2::after,
.az-component-card .com-content-article h2::after,
.az-component-card .articleBody h2::after,
.az-component-card .item-page h3::after,
.az-component-card .com-content-article h3::after,
.az-component-card .articleBody h3::after {
  opacity: .48 !important;
}

/* v0.4.15 — Article heading tip and title underline refinement
   Softer/blunter spike tips plus longer page title underline. */
.az-component-card .page-header::after {
  width: 60% !important;
  min-width: 260px !important;
  max-width: 920px !important;
}

.az-component-card .item-page h2,
.az-component-card .com-content-article h2,
.az-component-card .articleBody h2,
.az-component-card .item-page h3,
.az-component-card .com-content-article h3,
.az-component-card .articleBody h3 {
  border-radius: 10px 4px 4px 10px !important;
  clip-path: polygon(
    18px 0,
    calc(100% - 54px) 0,
    calc(100% - 6px) 43%,
    calc(100% - 6px) 57%,
    calc(100% - 54px) 100%,
    18px 100%,
    0 50%
  ) !important;
}

@media (max-width: 700px) {
  .az-component-card .page-header::after {
    width: 60% !important;
    min-width: 170px !important;
    max-width: 100% !important;
  }
  .az-component-card .item-page h2,
  .az-component-card .com-content-article h2,
  .az-component-card .articleBody h2,
  .az-component-card .item-page h3,
  .az-component-card .com-content-article h3,
  .az-component-card .articleBody h3 {
    clip-path: polygon(
      12px 0,
      calc(100% - 34px) 0,
      calc(100% - 4px) 43%,
      calc(100% - 4px) 57%,
      calc(100% - 34px) 100%,
      12px 100%,
      0 50%
    ) !important;
  }
}


/* v0.4.16 — Crisp spike refinement
   The long title underline and article heading ends should read as engineered
   HUD spikes, not soft cloudy fades. Keep the 60% underline width. */
.az-component-card .page-header::after {
  width: 60% !important;
  min-width: 260px !important;
  max-width: 920px !important;
  height: 2px !important;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 50%, calc(100% - 22px) 100%, 0 100%) !important;
  background: linear-gradient(90deg,
    rgba(128, 244, 255, .98) 0%,
    rgba(60, 198, 255, .86) 42%,
    rgba(34, 150, 230, .62) 76%,
    rgba(72, 214, 255, .92) calc(100% - 24px),
    rgba(135, 247, 255, .98) 100%) !important;
  box-shadow:
    0 0 10px rgba(84, 221, 255, .34),
    0 0 2px rgba(180, 255, 255, .78) !important;
  filter: none !important;
  opacity: .95 !important;
}

.az-component-card .item-page h2,
.az-component-card .com-content-article h2,
.az-component-card .articleBody h2,
.az-component-card .item-page h3,
.az-component-card .com-content-article h3,
.az-component-card .articleBody h3 {
  border-radius: 10px 0 0 10px !important;
  clip-path: polygon(
    18px 0,
    calc(100% - 52px) 0,
    100% 50%,
    calc(100% - 52px) 100%,
    18px 100%,
    0 50%
  ) !important;
  background:
    radial-gradient(circle at 7% 50%, rgba(75, 215, 255, .10), transparent 18%),
    linear-gradient(90deg,
      rgba(8, 54, 95, .46) 0%,
      rgba(8, 47, 88, .72) 10%,
      rgba(4, 25, 55, .96) 44%,
      rgba(4, 22, 50, .86) 72%,
      rgba(9, 52, 92, .58) calc(100% - 54px),
      rgba(19, 92, 146, .34) 100%) !important;
}

@media (max-width: 700px) {
  .az-component-card .page-header::after {
    width: 60% !important;
    min-width: 170px !important;
    max-width: 100% !important;
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%) !important;
  }
  .az-component-card .item-page h2,
  .az-component-card .com-content-article h2,
  .az-component-card .articleBody h2,
  .az-component-card .item-page h3,
  .az-component-card .com-content-article h3,
  .az-component-card .articleBody h3 {
    clip-path: polygon(
      12px 0,
      calc(100% - 34px) 0,
      100% 50%,
      calc(100% - 34px) 100%,
      12px 100%,
      0 50%
    ) !important;
  }
}

/* v0.4.17 - breadcrumbs live inside article/category pages */
.az-component-card > .az-component-breadcrumbs {
  margin: 0 0 14px;
  padding: 0 0 12px;
  border-bottom: 1px solid rgba(91, 218, 255, .20);
  color: rgba(172, 221, 247, .70);
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .78;
}
.az-component-breadcrumbs ol,
.az-component-breadcrumbs ul,
.az-component-breadcrumbs .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.az-component-breadcrumbs li,
.az-component-breadcrumbs span,
.az-component-breadcrumbs a {
  color: rgba(184, 230, 255, .72);
  text-decoration: none;
}
.az-component-breadcrumbs a:hover {
  color: #76e7ff;
  text-shadow: 0 0 10px rgba(68, 210, 255, .35);
}
.az-component-breadcrumbs li + li::before,
.az-component-breadcrumbs .breadcrumb-item + .breadcrumb-item::before {
  content: '›';
  color: rgba(91, 218, 255, .65);
  padding-right: 6px;
}
.az-component-breadcrumbs .divider,
.az-component-breadcrumbs .icon-location,
.az-component-breadcrumbs .showHere,
.az-component-breadcrumbs .breadcrumb-item.active::before {
  color: rgba(91, 218, 255, .55);
}
.az-site-main > .az-breadcrumbs {
  display: none !important;
}
@media (max-width: 760px) {
  .az-component-card > .az-component-breadcrumbs {
    font-size: 10px;
    margin-bottom: 12px;
    padding-bottom: 10px;
  }
}

/* v0.4.18 — Subtle in-panel breadcrumbs
   Smaller, quieter breadcrumb telemetry line without its own separator. */
.az-component-card > .az-component-breadcrumbs {
  margin: 0 0 10px !important;
  padding: 0 !important;
  border-bottom: 0 !important;
  color: rgba(154, 206, 232, .48) !important;
  font-size: 9px !important;
  line-height: 1.35 !important;
  letter-spacing: .075em !important;
  opacity: .62 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .45), 0 0 7px rgba(67, 193, 255, .10) !important;
}
.az-component-breadcrumbs ol,
.az-component-breadcrumbs ul,
.az-component-breadcrumbs .breadcrumb {
  gap: 4px !important;
}
.az-component-breadcrumbs li,
.az-component-breadcrumbs span,
.az-component-breadcrumbs a {
  color: rgba(168, 219, 245, .52) !important;
}
.az-component-breadcrumbs a:hover {
  color: rgba(125, 229, 255, .88) !important;
  text-shadow: 0 0 8px rgba(68, 210, 255, .30) !important;
}
.az-component-breadcrumbs li + li::before,
.az-component-breadcrumbs .breadcrumb-item + .breadcrumb-item::before {
  color: rgba(91, 218, 255, .48) !important;
  padding-right: 4px !important;
}
.az-component-breadcrumbs .divider,
.az-component-breadcrumbs .icon-location,
.az-component-breadcrumbs .showHere,
.az-component-breadcrumbs .breadcrumb-item.active::before {
  color: rgba(91, 218, 255, .42) !important;
}
@media (max-width: 760px) {
  .az-component-card > .az-component-breadcrumbs {
    font-size: 8px !important;
    margin-bottom: 8px !important;
  }
}


/* v0.4.19 — Tight in-panel breadcrumb placement
   Keep breadcrumbs subtle, but align them cleanly inside article panels. */
.az-component-card > .az-component-breadcrumbs {
  margin: 0 !important;
  padding: 1px 0 0 8px !important;
  border-bottom: 0 !important;
  line-height: 1.15 !important;
  min-height: 0 !important;
}
.az-component-card > .az-component-breadcrumbs + .item-page,
.az-component-card > .az-component-breadcrumbs + .com-content-article,
.az-component-card > .az-component-breadcrumbs + .com-content-category-blog,
.az-component-card > .az-component-breadcrumbs + .blog,
.az-component-card > .az-component-breadcrumbs + .com-users-login,
.az-component-card > .az-component-breadcrumbs + .com-users-registration,
.az-component-card > .az-component-breadcrumbs + .com-contact,
.az-component-card > .az-component-breadcrumbs + .com-finder,
.az-component-card > .az-component-breadcrumbs + .search,
.az-component-card > .az-component-breadcrumbs + .newsfeed,
.az-component-card > .az-component-breadcrumbs + .tag-category {
  padding-top: 6px !important;
}
@media (max-width: 760px) {
  .az-component-card > .az-component-breadcrumbs {
    padding-left: 6px !important;
    padding-top: 1px !important;
  }
  .az-component-card > .az-component-breadcrumbs + .item-page,
  .az-component-card > .az-component-breadcrumbs + .com-content-article,
  .az-component-card > .az-component-breadcrumbs + .com-content-category-blog,
  .az-component-card > .az-component-breadcrumbs + .blog,
  .az-component-card > .az-component-breadcrumbs + .com-users-login,
  .az-component-card > .az-component-breadcrumbs + .com-users-registration,
  .az-component-card > .az-component-breadcrumbs + .com-contact,
  .az-component-card > .az-component-breadcrumbs + .com-finder,
  .az-component-card > .az-component-breadcrumbs + .search,
  .az-component-card > .az-component-breadcrumbs + .newsfeed,
  .az-component-card > .az-component-breadcrumbs + .tag-category {
    padding-top: 5px !important;
  }
}


/* v0.4.20 — Breadcrumb telemetry polish
   Replace the loud Joomla breadcrumb label with a subtle NAV marker and add a light readability shadow. */
.az-component-card > .az-component-breadcrumbs,
.az-component-breadcrumbs li,
.az-component-breadcrumbs span,
.az-component-breadcrumbs a {
  text-shadow: 0 1px 2px rgba(0, 8, 18, .75), 0 0 5px rgba(99, 219, 255, .18) !important;
}
.az-component-breadcrumbs .showHere,
.az-component-breadcrumbs .icon-location {
  color: rgba(139, 205, 229, .42) !important;
  letter-spacing: .12em !important;
  font-weight: 700 !important;
}
.az-component-breadcrumbs .showHere {
  font-size: 0 !important;
}
.az-component-breadcrumbs .showHere::after {
  content: "NAV:";
  font-size: 11px !important;
  line-height: 1 !important;
  color: rgba(139, 205, 229, .46) !important;
  text-shadow: 0 1px 2px rgba(0, 8, 18, .8), 0 0 5px rgba(99, 219, 255, .22) !important;
}

/* v0.4.21 — Breadcrumb NAV contrast + hover affordance */
.az-component-breadcrumbs .showHere::after {
  color: rgba(165, 225, 246, .58) !important;
  text-shadow:
    0 1px 2px rgba(0, 8, 18, .9),
    0 0 6px rgba(111, 224, 255, .24) !important;
}
.az-component-breadcrumbs a {
  text-decoration: none !important;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: color .16s ease, text-shadow .16s ease, text-decoration-color .16s ease;
}
.az-component-breadcrumbs a:hover,
.az-component-breadcrumbs a:focus-visible {
  color: rgba(179, 236, 255, .76) !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(99, 219, 255, .62) !important;
  text-shadow:
    0 1px 2px rgba(0, 8, 18, .9),
    0 0 7px rgba(99, 219, 255, .36) !important;
}

/* v0.4.22 — Breadcrumb dotted hover underline */
.az-component-breadcrumbs a:hover,
.az-component-breadcrumbs a:focus-visible {
  text-decoration-line: underline !important;
  text-decoration-style: dotted !important;
  text-decoration-color: rgba(99, 219, 255, .68) !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}


/* v0.4.23 — Breadcrumb typography size refinement */
.az-component-card > .az-component-breadcrumbs,
.az-component-breadcrumbs li,
.az-component-breadcrumbs span,
.az-component-breadcrumbs a {
  font-size: 7px !important;
}
.az-component-breadcrumbs .showHere::after {
  font-size: 9px !important;
}
@media (max-width: 760px) {
  .az-component-card > .az-component-breadcrumbs,
  .az-component-breadcrumbs li,
  .az-component-breadcrumbs span,
  .az-component-breadcrumbs a {
    font-size: 6px !important;
  }
  .az-component-breadcrumbs .showHere::after {
    font-size: 8px !important;
  }
}


/* v0.4.24 — Breadcrumb typography +1px refinement */
.az-component-card > .az-component-breadcrumbs,
.az-component-breadcrumbs li,
.az-component-breadcrumbs span,
.az-component-breadcrumbs a {
  font-size: 8px !important;
}
.az-component-breadcrumbs .showHere::after {
  font-size: 10px !important;
}
@media (max-width: 760px) {
  .az-component-card > .az-component-breadcrumbs,
  .az-component-breadcrumbs li,
  .az-component-breadcrumbs span,
  .az-component-breadcrumbs a {
    font-size: 7px !important;
  }
  .az-component-breadcrumbs .showHere::after {
    font-size: 9px !important;
  }
}

/* v0.4.25 — Page title icon + longer telemetry underline
   Add a small neutral Aresenya data-core marker before component titles and extend
   the title separator to 80% while keeping the crisp HUD spike. */
.az-component-card .page-header::after {
  width: 80% !important;
  min-width: 300px !important;
  max-width: 1280px !important;
}

.az-component-card .page-header h1,
.az-component-card .page-header h2,
.az-component-card .com-content-article__title,
.az-component-card h1.item-title,
.az-component-card h2.item-title {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.az-component-card .page-header h1::before,
.az-component-card .page-header h2::before,
.az-component-card .com-content-article__title::before,
.az-component-card h1.item-title::before,
.az-component-card h2.item-title::before {
  content: '';
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  display: inline-block;
  box-sizing: border-box;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  background:
    radial-gradient(circle at 50% 50%, rgba(210, 255, 255, .96) 0 12%, rgba(95, 226, 255, .45) 13% 28%, transparent 30%),
    linear-gradient(135deg, rgba(12, 94, 164, .88), rgba(3, 22, 50, .92));
  border: 1px solid rgba(121, 235, 255, .82);
  box-shadow:
    0 0 12px rgba(84, 224, 255, .38),
    inset 0 1px 0 rgba(255, 255, 255, .26),
    inset 0 -8px 16px rgba(0, 12, 35, .48);
  opacity: .92;
}

.az-component-card .page-header h1::after,
.az-component-card .page-header h2::after,
.az-component-card .com-content-article__title::after,
.az-component-card h1.item-title::after,
.az-component-card h2.item-title::after {
  content: '';
  flex: 0 0 5px;
  width: 5px;
  height: 5px;
  margin-left: -4px;
  border-radius: 50%;
  background: rgba(107, 230, 255, .82);
  box-shadow: 0 0 10px rgba(107, 230, 255, .52);
  opacity: .58;
}

@media (max-width: 700px) {
  .az-component-card .page-header::after {
    width: 80% !important;
    min-width: 190px !important;
    max-width: 100% !important;
  }
  .az-component-card .page-header h1,
  .az-component-card .page-header h2,
  .az-component-card .com-content-article__title,
  .az-component-card h1.item-title,
  .az-component-card h2.item-title {
    gap: 10px !important;
  }
  .az-component-card .page-header h1::before,
  .az-component-card .page-header h2::before,
  .az-component-card .com-content-article__title::before,
  .az-component-card h1.item-title::before,
  .az-component-card h2.item-title::before {
    flex-basis: 22px;
    width: 22px;
    height: 22px;
  }
}


/* v0.4.26 — Refined page-title marker
   Replace the heavier data-core diamond with a smaller, elegant holographic title marker. */
.az-component-card .page-header h1,
.az-component-card .page-header h2,
.az-component-card .com-content-article__title,
.az-component-card h1.item-title,
.az-component-card h2.item-title {
  gap: 11px !important;
}

.az-component-card .page-header h1::before,
.az-component-card .page-header h2::before,
.az-component-card .com-content-article__title::before,
.az-component-card h1.item-title::before,
.az-component-card h2.item-title::before {
  content: '' !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  height: 18px !important;
  display: inline-block !important;
  box-sizing: border-box !important;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%) !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(190, 252, 255, .92) 0 1.8px, rgba(66, 214, 255, .42) 2px 3.4px, transparent 3.8px),
    linear-gradient(135deg, rgba(92, 226, 255, .18), rgba(4, 30, 68, .42) 54%, rgba(13, 80, 128, .18)) !important;
  border: 1px solid rgba(116, 232, 255, .54) !important;
  box-shadow:
    0 0 7px rgba(78, 217, 255, .34),
    inset 0 1px 1px rgba(255, 255, 255, .18),
    inset 0 -5px 9px rgba(0, 12, 34, .42) !important;
  opacity: .72 !important;
  transform: translateY(1px) !important;
  filter: saturate(1.08) !important;
}

.az-component-card .page-header h1::after,
.az-component-card .page-header h2::after,
.az-component-card .com-content-article__title::after,
.az-component-card h1.item-title::after,
.az-component-card h2.item-title::after {
  display: none !important;
}

@media (max-width: 700px) {
  .az-component-card .page-header h1,
  .az-component-card .page-header h2,
  .az-component-card .com-content-article__title,
  .az-component-card h1.item-title,
  .az-component-card h2.item-title {
    gap: 9px !important;
  }
  .az-component-card .page-header h1::before,
  .az-component-card .page-header h2::before,
  .az-component-card .com-content-article__title::before,
  .az-component-card h1.item-title::before,
  .az-component-card h2.item-title::before {
    flex-basis: 15px !important;
    width: 15px !important;
    height: 15px !important;
  }
}


/* v0.4.27 — Holographic scroll title marker
   Replace the small diamond marker with an elegant futuristic scroll glyph.
   The marker is intentionally quiet: it says “this is the page title” without
   overpowering the heading. */
.az-component-card .page-header h1,
.az-component-card .page-header h2,
.az-component-card .com-content-article__title,
.az-component-card h1.item-title,
.az-component-card h2.item-title {
  gap: 12px !important;
}

.az-component-card .page-header h1::before,
.az-component-card .page-header h2::before,
.az-component-card .com-content-article__title::before,
.az-component-card h1.item-title::before,
.az-component-card h2.item-title::before {
  content: '' !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  display: inline-block !important;
  box-sizing: border-box !important;
  clip-path: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2064%2064%22%3E%0A%3Cdefs%3E%0A%20%20%3Cfilter%20id%3D%22g%22%20x%3D%22-60%25%22%20y%3D%22-60%25%22%20width%3D%22220%25%22%20height%3D%22220%25%22%3E%0A%20%20%20%20%3CfeGaussianBlur%20stdDeviation%3D%221.7%22%20result%3D%22b%22%2F%3E%0A%20%20%20%20%3CfeMerge%3E%3CfeMergeNode%20in%3D%22b%22%2F%3E%3CfeMergeNode%20in%3D%22SourceGraphic%22%2F%3E%3C%2FfeMerge%3E%0A%20%20%3C%2Ffilter%3E%0A%20%20%3ClinearGradient%20id%3D%22s%22%20x1%3D%228%22%20y1%3D%228%22%20x2%3D%2254%22%20y2%3D%2258%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%0A%20%20%20%20%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23d6fdff%22%20stop-opacity%3D%22.95%22%2F%3E%0A%20%20%20%20%3Cstop%20offset%3D%22.35%22%20stop-color%3D%22%236befff%22%20stop-opacity%3D%22.75%22%2F%3E%0A%20%20%20%20%3Cstop%20offset%3D%221%22%20stop-color%3D%22%231b93cf%22%20stop-opacity%3D%22.35%22%2F%3E%0A%20%20%3C%2FlinearGradient%3E%0A%3C%2Fdefs%3E%0A%3Cg%20fill%3D%22none%22%20stroke%3D%22url%28%23s%29%22%20stroke-width%3D%223.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20filter%3D%22url%28%23g%29%22%3E%0A%20%20%3Cpath%20d%3D%22M18%2013h28c5%200%208%203%208%207s-3%207-8%207H22%22%20opacity%3D%22.95%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M18%2013c-5%200-8%203-8%207s3%207%208%207%22%20opacity%3D%22.9%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M18%2027v24c0%205%204%208%209%208h21%22%20opacity%3D%22.82%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M48%2027v21c0%206-4%2011-10%2011%22%20opacity%3D%22.55%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M22%2051h24%22%20opacity%3D%22.78%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M26%2035h17%22%20opacity%3D%22.62%22%20stroke-width%3D%222.4%22%2F%3E%0A%20%20%3Cpath%20d%3D%22M26%2043h12%22%20opacity%3D%22.45%22%20stroke-width%3D%222.2%22%2F%3E%0A%3C%2Fg%3E%0A%3Ccircle%20cx%3D%2218%22%20cy%3D%2220%22%20r%3D%225.2%22%20fill%3D%22%239cf7ff%22%20opacity%3D%22.2%22%2F%3E%0A%3Ccircle%20cx%3D%2249%22%20cy%3D%2220%22%20r%3D%224.2%22%20fill%3D%22%239cf7ff%22%20opacity%3D%22.16%22%2F%3E%0A%3Cpath%20d%3D%22M54%2024l2.5%201.3L54%2026.5l-1.3%202.5-1.2-2.5-2.6-1.2%202.6-1.3%201.2-2.5z%22%20fill%3D%22%23c7ffff%22%20opacity%3D%22.78%22%2F%3E%0A%3C%2Fsvg%3E") center / contain no-repeat !important;
  opacity: .78 !important;
  transform: translateY(1px) !important;
  filter:
    drop-shadow(0 0 3px rgba(104, 234, 255, .48))
    drop-shadow(0 0 8px rgba(22, 150, 255, .22))
    saturate(1.12) !important;
  box-shadow: none !important;
}

.az-component-card .page-header h1:hover::before,
.az-component-card .page-header h2:hover::before,
.az-component-card .com-content-article__title:hover::before,
.az-component-card h1.item-title:hover::before,
.az-component-card h2.item-title:hover::before {
  opacity: .9 !important;
  filter:
    drop-shadow(0 0 4px rgba(139, 247, 255, .58))
    drop-shadow(0 0 11px rgba(31, 166, 255, .28))
    saturate(1.2) !important;
}

@media (max-width: 700px) {
  .az-component-card .page-header h1,
  .az-component-card .page-header h2,
  .az-component-card .com-content-article__title,
  .az-component-card h1.item-title,
  .az-component-card h2.item-title {
    gap: 10px !important;
  }
  .az-component-card .page-header h1::before,
  .az-component-card .page-header h2::before,
  .az-component-card .com-content-article__title::before,
  .az-component-card h1.item-title::before,
  .az-component-card h2.item-title::before {
    flex-basis: 20px !important;
    width: 20px !important;
    height: 20px !important;
  }
}

/* v0.4.28 — Real holographic scroll title marker
   Use the approved generated scroll artwork instead of the simplified SVG glyph. */
.az-component-card .page-header h1,
.az-component-card .page-header h2,
.az-component-card .com-content-article__title,
.az-component-card h1.item-title,
.az-component-card h2.item-title {
  gap: 13px !important;
}

.az-component-card .page-header h1::before,
.az-component-card .page-header h2::before,
.az-component-card .com-content-article__title::before,
.az-component-card h1.item-title::before,
.az-component-card h2.item-title::before {
  content: '' !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  display: inline-block !important;
  background: url('../images/title-scroll-hologram.png') center / contain no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: none !important;
  box-shadow: none !important;
  opacity: .88 !important;
  transform: translateY(1px) !important;
  filter:
    drop-shadow(0 0 3px rgba(124, 247, 255, .42))
    drop-shadow(0 0 9px rgba(26, 170, 255, .20))
    saturate(1.12) !important;
}

.az-component-card .page-header h1:hover::before,
.az-component-card .page-header h2:hover::before,
.az-component-card .com-content-article__title:hover::before,
.az-component-card h1.item-title:hover::before,
.az-component-card h2.item-title:hover::before {
  opacity: .98 !important;
  filter:
    drop-shadow(0 0 4px rgba(150, 252, 255, .52))
    drop-shadow(0 0 12px rgba(36, 180, 255, .28))
    saturate(1.22) !important;
}

@media (max-width: 700px) {
  .az-component-card .page-header h1,
  .az-component-card .page-header h2,
  .az-component-card .com-content-article__title,
  .az-component-card h1.item-title,
  .az-component-card h2.item-title {
    gap: 10px !important;
  }
  .az-component-card .page-header h1::before,
  .az-component-card .page-header h2::before,
  .az-component-card .com-content-article__title::before,
  .az-component-card h1.item-title::before,
  .az-component-card h2.item-title::before {
    flex-basis: 23px !important;
    width: 23px !important;
    height: 23px !important;
  }
}

/* v0.4.29 — Exact generated holographic scroll crop
   Use the approved scroll artwork as a real cropped image, scaled to title height.
   This keeps the icon recognizable instead of appearing as a cyan dot. */
.az-component-card .page-header h1,
.az-component-card .page-header h2,
.az-component-card .com-content-article__title,
.az-component-card h1.item-title,
.az-component-card h2.item-title {
  gap: 13px !important;
  align-items: center !important;
}

.az-component-card .page-header h1::before,
.az-component-card .page-header h2::before,
.az-component-card .com-content-article__title::before,
.az-component-card h1.item-title::before,
.az-component-card h2.item-title::before {
  content: '' !important;
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 46px !important;
  display: inline-block !important;
  background: url('../images/title-scroll-hologram.png') center / contain no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: none !important;
  box-shadow: none !important;
  opacity: .86 !important;
  transform: translateY(1px) !important;
  filter:
    drop-shadow(0 0 4px rgba(120, 245, 255, .34))
    drop-shadow(0 0 12px rgba(28, 170, 255, .18))
    saturate(1.08) !important;
}

.az-component-card .page-header h1:hover::before,
.az-component-card .page-header h2:hover::before,
.az-component-card .com-content-article__title:hover::before,
.az-component-card h1.item-title:hover::before,
.az-component-card h2.item-title:hover::before {
  opacity: .96 !important;
  filter:
    drop-shadow(0 0 5px rgba(160, 255, 255, .46))
    drop-shadow(0 0 15px rgba(40, 185, 255, .25))
    saturate(1.18) !important;
}

@media (max-width: 700px) {
  .az-component-card .page-header h1,
  .az-component-card .page-header h2,
  .az-component-card .com-content-article__title,
  .az-component-card h1.item-title,
  .az-component-card h2.item-title {
    gap: 10px !important;
  }
  .az-component-card .page-header h1::before,
  .az-component-card .page-header h2::before,
  .az-component-card .com-content-article__title::before,
  .az-component-card h1.item-title::before,
  .az-component-card h2.item-title::before {
    flex-basis: 30px !important;
    width: 30px !important;
    height: 34px !important;
  }
}

/* v0.4.30 — Soft holographic scroll title marker
   Keep the approved scroll artwork visible, calm and professional: no hover change,
   just a permanent soft holographic shine. */
.az-component-card .page-header h1,
.az-component-card .page-header h2,
.az-component-card .com-content-article__title,
.az-component-card h1.item-title,
.az-component-card h2.item-title {
  gap: 13px !important;
  align-items: center !important;
}

.az-component-card .page-header h1::before,
.az-component-card .page-header h2::before,
.az-component-card .com-content-article__title::before,
.az-component-card h1.item-title::before,
.az-component-card h2.item-title::before {
  content: '' !important;
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 46px !important;
  display: inline-block !important;
  background: url('../images/title-scroll-hologram.png') center / contain no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  clip-path: none !important;
  box-shadow: none !important;
  opacity: .92 !important;
  transform: translateY(1px) !important;
  filter:
    drop-shadow(0 0 3px rgba(150, 255, 255, .34))
    drop-shadow(0 0 10px rgba(48, 192, 255, .20))
    drop-shadow(0 0 18px rgba(0, 220, 255, .10))
    saturate(1.05) !important;
  transition: none !important;
}

.az-component-card .page-header h1:hover::before,
.az-component-card .page-header h2:hover::before,
.az-component-card .com-content-article__title:hover::before,
.az-component-card h1.item-title:hover::before,
.az-component-card h2.item-title:hover::before {
  opacity: .92 !important;
  filter:
    drop-shadow(0 0 3px rgba(150, 255, 255, .34))
    drop-shadow(0 0 10px rgba(48, 192, 255, .20))
    drop-shadow(0 0 18px rgba(0, 220, 255, .10))
    saturate(1.05) !important;
}

@media (max-width: 700px) {
  .az-component-card .page-header h1::before,
  .az-component-card .page-header h2::before,
  .az-component-card .com-content-article__title::before,
  .az-component-card h1.item-title::before,
  .az-component-card h2.item-title::before {
    flex-basis: 30px !important;
    width: 30px !important;
    height: 34px !important;
  }
}

/* v0.4.31 — Exact transparent holographic scroll
   Replace the simplified/flattened marker with the real scroll artwork extracted
   from the approved generated image. Keep it calm: permanent soft glow, no hover change. */
.az-component-card .page-header h1,
.az-component-card .page-header h2,
.az-component-card .com-content-article__title,
.az-component-card h1.item-title,
.az-component-card h2.item-title {
  gap: 14px !important;
  align-items: center !important;
}

.az-component-card .page-header h1::before,
.az-component-card .page-header h2::before,
.az-component-card .com-content-article__title::before,
.az-component-card h1.item-title::before,
.az-component-card h2.item-title::before {
  flex: 0 0 46px !important;
  width: 46px !important;
  height: 48px !important;
  background: url('../images/title-scroll-hologram.png') center center / contain no-repeat !important;
  opacity: .96 !important;
  filter:
    drop-shadow(0 0 3px rgba(133, 250, 255, .34))
    drop-shadow(0 0 9px rgba(42, 190, 255, .20)) !important;
  transition: none !important;
  transform: translateY(1px) !important;
}

.az-component-card .page-header h1:hover::before,
.az-component-card .page-header h2:hover::before,
.az-component-card .com-content-article__title:hover::before,
.az-component-card h1.item-title:hover::before,
.az-component-card h2.item-title:hover::before {
  opacity: .96 !important;
  filter:
    drop-shadow(0 0 3px rgba(133, 250, 255, .34))
    drop-shadow(0 0 9px rgba(42, 190, 255, .20)) !important;
}

@media (max-width: 700px) {
  .az-component-card .page-header h1::before,
  .az-component-card .page-header h2::before,
  .az-component-card .com-content-article__title::before,
  .az-component-card h1.item-title::before,
  .az-component-card h2.item-title::before {
    flex-basis: 34px !important;
    width: 34px !important;
    height: 36px !important;
  }
}

/* v0.4.32 — Article nav separator: reverse title underline */
.az-component-card nav.pagenavigation,
.az-component-card .pagenavigation,
.az-component-card ul.pagenav,
.az-component-card .pager.pagenav {
  position: relative !important;
  border-top: 0 !important;
  padding-top: 16px !important;
}
.az-component-card nav.pagenavigation::before,
.az-component-card .pagenavigation::before,
.az-component-card ul.pagenav::before,
.az-component-card .pager.pagenav::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  width: 80% !important;
  min-width: 260px !important;
  max-width: 920px !important;
  height: 2px !important;
  pointer-events: none !important;
  clip-path: polygon(22px 0, 100% 0, 100% 100%, 22px 100%, 0 50%) !important;
  background: linear-gradient(270deg,
    rgba(128, 244, 255, .98) 0%,
    rgba(60, 198, 255, .86) 42%,
    rgba(34, 150, 230, .62) 76%,
    rgba(72, 214, 255, .92) calc(100% - 24px),
    rgba(135, 247, 255, .98) 100%) !important;
  box-shadow:
    0 0 10px rgba(84, 221, 255, .34),
    0 0 2px rgba(180, 255, 255, .78) !important;
  opacity: .95 !important;
}
@media (max-width: 700px) {
  .az-component-card nav.pagenavigation::before,
  .az-component-card .pagenavigation::before,
  .az-component-card ul.pagenav::before,
  .az-component-card .pager.pagenav::before {
    width: 80% !important;
    min-width: 170px !important;
    max-width: 100% !important;
    clip-path: polygon(16px 0, 100% 0, 100% 100%, 16px 100%, 0 50%) !important;
  }
}

/* v0.4.33 — Breadcrumb micro-spacing refinement
   Increase breadcrumb text by 1px and give the telemetry line 1px more breathing room at the top. */
.az-component-card > .az-component-breadcrumbs {
  padding-top: 2px !important;
}
.az-component-card > .az-component-breadcrumbs,
.az-component-breadcrumbs li,
.az-component-breadcrumbs span,
.az-component-breadcrumbs a {
  font-size: 9px !important;
}
.az-component-breadcrumbs .showHere::after {
  font-size: 11px !important;
}
@media (max-width: 760px) {
  .az-component-card > .az-component-breadcrumbs {
    padding-top: 2px !important;
  }
  .az-component-card > .az-component-breadcrumbs,
  .az-component-breadcrumbs li,
  .az-component-breadcrumbs span,
  .az-component-breadcrumbs a {
    font-size: 8px !important;
  }
  .az-component-breadcrumbs .showHere::after {
    font-size: 10px !important;
  }
}

/* v0.4.34 — Article nav reverse underline true 80% width
   Remove earlier max-width cap so the reverse underline always spans 80% of the
   article panel instead of stopping too early on wide pages. */
.az-component-card nav.pagenavigation::before,
.az-component-card .pagenavigation::before,
.az-component-card ul.pagenav::before,
.az-component-card .pager.pagenav::before {
  width: 80% !important;
  max-width: none !important;
}
@media (max-width: 700px) {
  .az-component-card nav.pagenavigation::before,
  .az-component-card .pagenavigation::before,
  .az-component-card ul.pagenav::before,
  .az-component-card .pager.pagenav::before {
    width: 80% !important;
    max-width: none !important;
  }
}

/* v0.4.35 Phoenix language switcher
   Compact sci-fi capsule placed between social icons and login. */
.az-topline .az-language-switcher {
  position: relative;
  z-index: 90;
  display: inline-flex;
  align-items: center;
  height: 28px;
  flex: 0 0 auto;
}

.az-topline .az-language-switcher .az-lang-trigger {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: 28px;
  min-width: 72px;
  padding: 0 11px 0 10px;
  margin: 0;
  border: 1px solid rgba(91, 204, 255, .36);
  border-radius: 10px 4px 10px 4px;
  color: #d9f4ff;
  background:
    linear-gradient(180deg, rgba(3, 18, 34, .98), rgba(1, 8, 19, .96)),
    radial-gradient(circle at 20% 0%, rgba(75, 220, 255, .28), transparent 44%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .12),
    inset 0 -8px 15px rgba(0, 0, 0, .36),
    0 0 0 1px rgba(0, 0, 0, .38),
    0 0 12px rgba(60, 200, 255, .12);
  font: 900 12px/1 Inter, Segoe UI, Arial, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease, color .18s ease;
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
}

.az-topline .az-language-switcher .az-lang-trigger:hover,
.az-topline .az-language-switcher .az-lang-trigger:focus-visible,
.az-topline .az-language-switcher.is-open .az-lang-trigger {
  color: #ffffff;
  border-color: rgba(129, 224, 255, .64);
  background:
    linear-gradient(180deg, rgba(5, 29, 54, .98), rgba(1, 10, 24, .98)),
    radial-gradient(circle at 20% 0%, rgba(80, 212, 255, .36), transparent 44%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -8px 15px rgba(0,0,0,.32),
    0 0 0 1px rgba(58, 203, 255, .18),
    0 0 16px rgba(80, 212, 255, .20);
  transform: translateY(-1px);
}

.az-topline .az-lang-core {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: radial-gradient(circle, #bdf7ff 0 24%, #50d4ff 38%, rgba(80,212,255,.18) 72%, transparent 73%);
  box-shadow: 0 0 8px rgba(80, 212, 255, .72), 0 0 16px rgba(47, 142, 255, .28);
  opacity: .88;
}
.az-topline .az-lang-code { min-width: 22px; text-align: center; }
.az-topline .az-lang-caret {
  color: rgba(119, 219, 255, .9);
  font-size: 10px;
  transform: translateY(-1px);
}

.az-topline .az-lang-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 186px;
  padding: 8px;
  border: 1px solid rgba(91, 204, 255, .30);
  border-radius: 12px 4px 12px 4px;
  background:
    linear-gradient(180deg, rgba(5, 23, 43, .98), rgba(2, 9, 21, .98)),
    repeating-linear-gradient(90deg, rgba(80,212,255,.05) 0 1px, transparent 1px 18px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 16px 34px rgba(0,0,0,.50),
    0 0 24px rgba(47, 142, 255, .14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px) scale(.98);
  transform-origin: top right;
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
}

.az-topline .az-language-switcher.is-open .az-lang-panel,
.az-topline .az-language-switcher:hover .az-lang-panel,
.az-topline .az-language-switcher:focus-within .az-lang-panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.az-topline .az-lang-panel::before {
  content: '';
  position: absolute;
  right: 17px;
  top: -5px;
  width: 9px;
  height: 9px;
  border-left: 1px solid rgba(91, 204, 255, .30);
  border-top: 1px solid rgba(91, 204, 255, .30);
  background: rgba(5, 23, 43, .98);
  transform: rotate(45deg);
}

.az-topline .az-lang-panel .mod-languages,
.az-topline .az-lang-panel .mod-languages ul,
.az-topline .az-lang-panel ul,
.az-topline .az-lang-panel .lang-inline {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 5px;
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
}

.az-topline .az-lang-panel li {
  display: block !important;
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
}

.az-topline .az-lang-panel a,
.az-topline .az-lang-panel .lang-active a {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 32px;
  padding: 0 10px 0 12px !important;
  border: 1px solid rgba(91, 204, 255, .14);
  border-radius: 8px 3px 8px 3px;
  background: rgba(0, 10, 24, .48);
  color: rgba(219, 243, 255, .82) !important;
  font-size: 12px !important;
  font-weight: 800;
  letter-spacing: .035em;
  line-height: 1.1;
  text-align: left;
  text-transform: none;
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.az-topline .az-lang-panel a::before {
  content: attr(data-lang-code);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 20px;
  margin-right: 9px;
  border-radius: 5px 2px 5px 2px;
  border: 1px solid rgba(80, 212, 255, .28);
  background: linear-gradient(180deg, rgba(6, 32, 58, .88), rgba(1, 9, 21, .88));
  color: #72dcff;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .05em;
  text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
  flex: 0 0 auto;
}

.az-topline .az-lang-panel a:hover,
.az-topline .az-lang-panel a:focus-visible,
.az-topline .az-lang-panel .lang-active a,
.az-topline .az-lang-panel a.active {
  color: #f3fbff !important;
  border-color: rgba(80, 212, 255, .34);
  background:
    linear-gradient(180deg, rgba(7, 34, 62, .82), rgba(2, 12, 27, .92));
  box-shadow:
    inset 0 0 18px rgba(80, 212, 255, .08),
    0 0 12px rgba(80, 212, 255, .10);
}

.az-topline .az-lang-panel img,
.az-topline .az-lang-panel .visually-hidden {
  display: none !important;
}

.az-topline .az-lang-panel select {
  width: 100%;
  min-height: 32px;
  border: 1px solid rgba(91, 204, 255, .30);
  border-radius: 8px 3px 8px 3px;
  background: #031326;
  color: #e5f8ff;
  font-size: 12px;
  font-weight: 800;
}

@media (max-width: 760px) {
  .az-topline .az-language-switcher .az-lang-trigger {
    min-width: 58px;
    padding: 0 8px;
  }
  .az-topline .az-lang-core { display: none; }
  .az-topline .az-lang-panel {
    right: auto;
    left: 50%;
    transform: translate(-50%, -6px) scale(.98);
  }
  .az-topline .az-language-switcher.is-open .az-lang-panel,
  .az-topline .az-language-switcher:hover .az-lang-panel,
  .az-topline .az-language-switcher:focus-within .az-lang-panel {
    transform: translate(-50%, 0) scale(1);
  }
}

/* v0.4.35 safety: allow language switcher forms/selects inside the top action area. */
.az-topline .az-language-switcher form,
.az-topline .az-language-switcher select,
.az-topline .az-language-switcher button,
.az-topline .az-language-switcher input {
  display: revert !important;
}
.az-topline .az-language-switcher .az-lang-trigger {
  display: inline-flex !important;
}


/* v0.4.36 Phoenix language dropdown reliability
   Ensure the language selector opens above the header/nav and shows a clean
   fallback language list when Joomla has not yet generated real language links. */
.az-topline,
.az-topline-inner,
.az-top-actions,
.az-topline .az-language-switcher {
  overflow: visible !important;
}

.az-topline {
  z-index: 420 !important;
}

.az-topline .az-language-switcher {
  z-index: 480 !important;
}

.az-topline .az-lang-panel {
  z-index: 9999 !important;
}

.az-topline .az-lang-panel.az-lang-panel-has-fallback::after {
  content: 'configure Joomla multilingual links later';
  display: block;
  margin: 7px 4px 2px;
  padding-top: 6px;
  border-top: 1px dotted rgba(80, 212, 255, .18);
  color: rgba(154, 203, 222, .48);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.az-topline .az-lang-panel .az-lang-fallback {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.az-topline .az-lang-panel .az-lang-fallback li {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.az-topline .az-language-switcher.is-open .az-lang-panel {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1) !important;
  pointer-events: auto !important;
}

@media (max-width: 760px) {
  .az-topline .az-language-switcher.is-open .az-lang-panel {
    transform: translate(-50%, 0) scale(1) !important;
  }
}


/* v0.4.37 Phoenix language dropdown cleanup
   The language code is shown only in the left capsule; the label text no longer repeats it. */
.az-topline .az-lang-panel a::before {
  margin-right: 10px;
}
.az-topline .az-lang-panel a {
  gap: 0;
}


/* v0.4.38 Phoenix language switcher polish
   Native Chinese/Japanese labels, stronger code-chip hover, and reliable dropdown handling. */
.az-topline .az-language-switcher::after {
  content: '';
  position: absolute;
  top: 100%;
  right: 0;
  width: max(100%, 232px);
  height: 10px;
  pointer-events: auto;
  background: transparent;
}

/* Disable the old pure-CSS hover/focus opening so click toggle can really close. */
.az-topline .az-language-switcher:hover .az-lang-panel,
.az-topline .az-language-switcher:focus-within .az-lang-panel {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px) scale(.98);
  pointer-events: none;
}

.az-topline .az-language-switcher.is-open .az-lang-panel,
.az-topline .az-language-switcher.is-open:hover .az-lang-panel,
.az-topline .az-language-switcher.is-open:focus-within .az-lang-panel {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1) !important;
  pointer-events: auto !important;
}

.az-topline .az-lang-panel a::before {
  transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.az-topline .az-lang-panel a:hover::before,
.az-topline .az-lang-panel a:focus-visible::before,
.az-topline .az-lang-panel .lang-active a::before,
.az-topline .az-lang-panel a.active::before {
  color: #f5fdff;
  border-color: rgba(141, 231, 255, .72);
  background:
    linear-gradient(180deg, rgba(28, 97, 143, .96), rgba(5, 33, 61, .96)),
    radial-gradient(circle at 50% 0%, rgba(160, 246, 255, .38), transparent 62%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -7px 12px rgba(0,0,0,.28),
    0 0 12px rgba(86, 220, 255, .28),
    0 0 1px rgba(255,255,255,.55);
  transform: translateY(-1px);
}

.az-topline .az-lang-panel a:hover,
.az-topline .az-lang-panel a:focus-visible {
  background:
    linear-gradient(90deg, rgba(4, 17, 34, .92), rgba(9, 38, 66, .92) 48%, rgba(3, 14, 30, .96)),
    repeating-linear-gradient(90deg, rgba(80,212,255,.04) 0 1px, transparent 1px 13px);
  border-color: rgba(86, 220, 255, .40);
}

.az-topline .az-lang-panel a:hover::after,
.az-topline .az-lang-panel a:focus-visible::after {
  content: '';
  position: absolute;
  left: 56px;
  right: 9px;
  bottom: 5px;
  height: 1px;
  background: linear-gradient(90deg, rgba(80, 212, 255, .62), transparent);
  opacity: .9;
}

@media (max-width: 760px) {
  .az-topline .az-language-switcher.is-open .az-lang-panel,
  .az-topline .az-language-switcher.is-open:hover .az-lang-panel,
  .az-topline .az-language-switcher.is-open:focus-within .az-lang-panel {
    transform: translate(-50%, 0) scale(1) !important;
  }
}


/* v0.4.39 Phoenix language helper / translator panel
   Replaces the old setup note with a useful compact external translator option. */
.az-topline .az-lang-panel.az-lang-panel-has-fallback::after {
  content: none !important;
  display: none !important;
}

.az-topline .az-lang-helper {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  margin: 7px 3px 1px;
  padding: 7px 0 0;
  border-top: 1px dotted rgba(80, 212, 255, .18);
}

.az-topline .az-lang-helper-text {
  color: rgba(154, 203, 222, .62);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .055em;
  text-transform: uppercase;
  white-space: nowrap;
}

.az-topline .az-lang-helper-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 0 8px;
  margin: 0;
  border: 1px solid rgba(80, 212, 255, .25);
  border-radius: 7px 2px 7px 2px;
  color: rgba(202, 240, 255, .86);
  background:
    linear-gradient(180deg, rgba(4, 26, 48, .96), rgba(1, 9, 21, .98)),
    radial-gradient(circle at 50% 0%, rgba(80, 212, 255, .22), transparent 64%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -7px 11px rgba(0,0,0,.22),
    0 0 10px rgba(80, 212, 255, .08);
  font: 900 9px/1 Inter, Segoe UI, Arial, sans-serif;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.az-topline .az-lang-helper-btn:hover,
.az-topline .az-lang-helper-btn:focus-visible,
.az-topline .az-lang-helper.is-open .az-lang-helper-btn {
  color: #ffffff;
  border-color: rgba(131, 232, 255, .58);
  background:
    linear-gradient(180deg, rgba(8, 43, 74, .98), rgba(2, 14, 31, .98)),
    radial-gradient(circle at 50% 0%, rgba(145, 239, 255, .34), transparent 66%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -8px 13px rgba(0,0,0,.24),
    0 0 16px rgba(80, 212, 255, .22);
  transform: translateY(-1px);
}

.az-topline .az-lang-translate-panel {
  position: absolute;
  top: -8px;
  left: calc(100% + 10px);
  width: 184px;
  padding: 10px;
  border: 1px solid rgba(91, 204, 255, .28);
  border-radius: 12px 4px 12px 4px;
  background:
    linear-gradient(180deg, rgba(5, 23, 43, .98), rgba(2, 9, 21, .98)),
    repeating-linear-gradient(90deg, rgba(80,212,255,.045) 0 1px, transparent 1px 15px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 16px 34px rgba(0,0,0,.48),
    0 0 22px rgba(47, 142, 255, .12);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-6px) scale(.98);
  transform-origin: left top;
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
  z-index: 10002;
}

.az-topline .az-lang-helper.is-open .az-lang-translate-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0) scale(1);
}

.az-topline .az-lang-translate-panel::before {
  content: '';
  position: absolute;
  left: -5px;
  top: 16px;
  width: 9px;
  height: 9px;
  border-left: 1px solid rgba(91, 204, 255, .28);
  border-bottom: 1px solid rgba(91, 204, 255, .28);
  background: rgba(5, 23, 43, .98);
  transform: rotate(45deg);
}

.az-topline .az-lang-translate-title {
  display: block;
  margin: 0 0 4px;
  color: rgba(235, 250, 255, .92);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-shadow: 0 0 10px rgba(80, 212, 255, .22);
}

.az-topline .az-lang-translate-note,
.az-topline .az-lang-translate-future {
  display: block;
  color: rgba(154, 203, 222, .64);
  font-size: 9px;
  font-weight: 700;
  line-height: 1.35;
}

.az-topline .az-lang-translate-targets {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  margin: 8px 0;
}

.az-topline .az-lang-translate-targets .az-lang-translate-target {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 6px !important;
  border: 1px solid rgba(80, 212, 255, .20);
  border-radius: 7px 2px 7px 2px;
  color: rgba(218, 246, 255, .82) !important;
  background: linear-gradient(180deg, rgba(6, 32, 58, .70), rgba(1, 9, 21, .82));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  font-size: 10px !important;
  font-weight: 850;
  letter-spacing: .025em;
  text-decoration: none !important;
}

.az-topline .az-lang-translate-targets .az-lang-translate-target::before,
.az-topline .az-lang-translate-targets .az-lang-translate-target::after {
  display: none !important;
  content: none !important;
}

.az-topline .az-lang-translate-targets .az-lang-translate-target:hover,
.az-topline .az-lang-translate-targets .az-lang-translate-target:focus-visible {
  color: #ffffff !important;
  border-color: rgba(131, 232, 255, .52);
  background: linear-gradient(180deg, rgba(12, 55, 88, .88), rgba(2, 17, 36, .94));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 0 13px rgba(80, 212, 255, .16);
}

@media (max-width: 760px) {
  .az-topline .az-lang-helper {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .az-topline .az-lang-helper-btn {
    width: 100%;
  }
  .az-topline .az-lang-translate-panel {
    top: calc(100% + 7px);
    left: 50%;
    width: 210px;
    transform: translate(-50%, -6px) scale(.98);
    transform-origin: top center;
  }
  .az-topline .az-lang-helper.is-open .az-lang-translate-panel {
    transform: translate(-50%, 0) scale(1);
  }
  .az-topline .az-lang-translate-panel::before {
    left: 50%;
    top: -5px;
    transform: translateX(-50%) rotate(45deg);
    border-left: 1px solid rgba(91, 204, 255, .28);
    border-top: 1px solid rgba(91, 204, 255, .28);
    border-bottom: 0;
  }
}


/* v0.4.40 Phoenix language translator hover bridge
   Gives the cursor a safe path and time buffer between the Translate button
   and the side panel, so neither the side panel nor the whole language dropdown
   collapses while moving across the small gap. */
.az-topline .az-lang-helper.is-open::after {
  content: '';
  position: absolute;
  top: -12px;
  left: 100%;
  width: 18px;
  height: calc(100% + 104px);
  background: transparent;
  pointer-events: auto;
  z-index: 10001;
}

.az-topline .az-lang-helper.is-open .az-lang-translate-panel {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) scale(1) !important;
}

.az-topline .az-lang-helper.is-open .az-lang-helper-btn::after {
  content: '';
  position: absolute;
  right: -7px;
  top: 50%;
  width: 7px;
  height: 1px;
  background: linear-gradient(90deg, rgba(91, 204, 255, .68), transparent);
  box-shadow: 0 0 8px rgba(80, 212, 255, .30);
  transform: translateY(-50%);
}

@media (max-width: 760px) {
  .az-topline .az-lang-helper.is-open::after {
    left: 0;
    top: 100%;
    width: 100%;
    height: 12px;
  }
  .az-topline .az-lang-helper.is-open .az-lang-translate-panel {
    transform: translate(-50%, 0) scale(1) !important;
  }
}

/* v0.4.41 Phoenix language switcher click-only behavior
   Language capsule opens only by click. Translate panel opens only by click
   and sits as a clean side-by-side companion panel to the language dropdown. */
.az-topline .az-language-switcher:hover .az-lang-panel,
.az-topline .az-language-switcher:focus-within .az-lang-panel {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-6px) scale(.98) !important;
  pointer-events: none !important;
}

.az-topline .az-language-switcher.is-open .az-lang-panel,
.az-topline .az-language-switcher.is-open:hover .az-lang-panel,
.az-topline .az-language-switcher.is-open:focus-within .az-lang-panel {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1) !important;
  pointer-events: auto !important;
}

.az-topline .az-lang-helper {
  position: static !important;
}

.az-topline .az-lang-helper.is-open::after {
  content: none !important;
  display: none !important;
}

.az-topline .az-lang-translate-panel {
  top: 8px !important;
  left: calc(100% + 10px) !important;
  width: 190px !important;
  transform: translateX(-6px) scale(.98) !important;
}

.az-topline .az-lang-helper.is-open .az-lang-translate-panel {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(0) scale(1) !important;
}

.az-topline .az-lang-helper-btn:hover,
.az-topline .az-lang-helper-btn:focus-visible {
  transform: none;
}

@media (max-width: 760px) {
  .az-topline .az-language-switcher.is-open .az-lang-panel,
  .az-topline .az-language-switcher.is-open:hover .az-lang-panel,
  .az-topline .az-language-switcher.is-open:focus-within .az-lang-panel {
    transform: translate(-50%, 0) scale(1) !important;
  }

  .az-topline .az-lang-helper {
    position: relative !important;
  }

  .az-topline .az-lang-translate-panel {
    top: calc(100% + 7px) !important;
    left: 50% !important;
    width: 210px !important;
    transform: translate(-50%, -6px) scale(.98) !important;
  }

  .az-topline .az-lang-helper.is-open .az-lang-translate-panel {
    transform: translate(-50%, 0) scale(1) !important;
  }
}

/* v0.4.42 Phoenix product-ready translator assist
   The language dropdown and Translate panel are click-only, with translator service buttons
   instead of fixed target-language buttons. */
.az-topline .az-language-switcher::after {
  pointer-events: none !important;
}

.az-topline .az-lang-translate-panel {
  width: 232px !important;
  top: 8px !important;
  left: calc(100% + 10px) !important;
}

.az-topline .az-lang-service-targets {
  grid-template-columns: 1fr !important;
  gap: 6px !important;
  margin: 8px 0 7px !important;
}

.az-topline .az-lang-translate-targets .az-lang-translate-target,
.az-topline .az-lang-translate-targets button.az-lang-translate-target {
  width: 100%;
  min-height: 27px;
  justify-content: flex-start;
  padding: 0 10px !important;
  appearance: none;
  cursor: pointer;
  font-family: Inter, Segoe UI, Arial, sans-serif;
}

.az-topline .az-lang-translate-targets .az-lang-translate-target::before {
  content: '' !important;
  display: inline-block !important;
  width: 7px;
  height: 7px;
  margin-right: 8px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(223, 252, 255, .95) 0 18%, rgba(84, 217, 255, .82) 42%, rgba(84, 217, 255, .20) 72%, transparent 73%);
  box-shadow: 0 0 10px rgba(84, 217, 255, .35);
  flex: 0 0 auto;
}

.az-topline .az-lang-translate-targets .az-lang-translate-target::after {
  content: '↗' !important;
  display: inline-block !important;
  margin-left: auto;
  color: rgba(113, 220, 255, .60);
  font-size: 10px;
  transform: translateY(-1px);
}

.az-topline .az-lang-translate-targets .az-lang-translate-browser::after {
  content: '⌁' !important;
}

.az-topline .az-lang-browser-hint {
  display: none;
  margin: 4px 0 7px;
  color: rgba(174, 222, 238, .68);
  font-size: 9px;
  font-weight: 750;
  line-height: 1.35;
  letter-spacing: .02em;
}

.az-topline .az-lang-browser-hint.is-visible {
  display: block;
}

.az-topline .az-lang-translate-future {
  padding-top: 7px;
  border-top: 1px dotted rgba(80, 212, 255, .18);
}

.az-topline .az-lang-helper-btn {
  white-space: nowrap;
}

@media (max-width: 760px) {
  .az-topline .az-lang-translate-panel {
    width: 230px !important;
  }
}


/* v0.4.43 Phoenix API-ready inline translator panel */
.az-topline .az-lang-translate-panel .az-lang-api-targets {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 8px 0 7px;
}

.az-topline .az-lang-translate-panel .az-lang-api-target {
  min-height: 27px;
  padding: 0 9px;
  border: 1px solid rgba(73, 199, 255, .22);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(9, 41, 82, .94), rgba(3, 16, 38, .96)),
    radial-gradient(circle at 25% 0, rgba(84, 217, 255, .16), transparent 60%);
  color: rgba(222, 250, 255, .88);
  font-family: Inter, Segoe UI, Arial, sans-serif;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), inset 0 -1px 0 rgba(0,0,0,.30), 0 0 0 1px rgba(4, 9, 22, .40);
  transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.az-topline .az-lang-translate-panel .az-lang-api-target.is-primary {
  grid-column: span 2;
  color: rgba(236, 253, 255, .96);
  border-color: rgba(90, 215, 255, .34);
  background:
    linear-gradient(180deg, rgba(10, 55, 108, .96), rgba(4, 20, 48, .98)),
    radial-gradient(circle at 20% 0, rgba(90, 215, 255, .26), transparent 58%);
}

.az-topline .az-lang-translate-panel .az-lang-api-target:hover,
.az-topline .az-lang-translate-panel .az-lang-api-target:focus-visible {
  color: #fff;
  border-color: rgba(105, 224, 255, .55);
  background:
    linear-gradient(180deg, rgba(12, 64, 124, .98), rgba(4, 21, 50, 1)),
    radial-gradient(circle at 25% 0, rgba(100, 224, 255, .30), transparent 60%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 0 14px rgba(73, 199, 255, .16);
  transform: translateY(-1px);
}

.az-topline .az-lang-api-status {
  display: block;
  min-height: 26px;
  margin: 5px 0 7px;
  padding: 6px 8px;
  border: 1px solid rgba(73, 199, 255, .12);
  border-radius: 8px;
  background: rgba(2, 11, 28, .54);
  color: rgba(174, 222, 238, .72);
  font-size: 9px;
  font-weight: 760;
  line-height: 1.35;
  letter-spacing: .02em;
  box-shadow: inset 0 1px 6px rgba(0,0,0,.30);
}

.az-topline .az-lang-api-status[data-state="disabled"] {
  color: rgba(185, 215, 232, .70);
  border-color: rgba(110, 150, 180, .15);
}

.az-topline .az-lang-api-status[data-state="loading"] {
  color: rgba(168, 240, 255, .90);
  border-color: rgba(73, 199, 255, .25);
  box-shadow: inset 0 1px 6px rgba(0,0,0,.30), 0 0 12px rgba(73, 199, 255, .10);
}

.az-topline .az-lang-api-status[data-state="success"] {
  color: rgba(164, 255, 219, .90);
  border-color: rgba(77, 255, 190, .22);
}

.az-topline .az-lang-api-status[data-state="error"] {
  color: rgba(255, 190, 190, .90);
  border-color: rgba(255, 105, 105, .22);
}

@media (max-width: 760px) {
  .az-topline .az-lang-translate-panel .az-lang-api-targets {
    grid-template-columns: 1fr 1fr;
  }
}

/* v0.4.44 Phoenix translator API layout
   Google Translate and DeepL are now secondary options under the one-click API controls.
   Browser Translate has been removed from the product UI. */
.az-topline .az-lang-translate-browser,
.az-topline .az-lang-browser-hint {
  display: none !important;
}

.az-topline .az-lang-translate-panel {
  width: 238px !important;
}

.az-topline .az-lang-translate-panel .az-lang-api-target.is-primary {
  min-height: 30px;
  letter-spacing: .075em;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    inset 0 -11px 16px rgba(0,0,0,.25),
    0 0 16px rgba(73, 199, 255, .16);
}

.az-topline .az-lang-api-external {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 7px 0 8px;
  padding-top: 7px;
  border-top: 1px dotted rgba(80, 212, 255, .18);
}

.az-topline .az-lang-api-external-title {
  grid-column: 1 / -1;
  color: rgba(154, 203, 222, .58);
  font-size: 8.5px;
  font-weight: 900;
  letter-spacing: .08em;
  line-height: 1;
  text-transform: uppercase;
}

.az-topline .az-lang-api-external-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 25px;
  padding: 0 7px !important;
  border: 1px solid rgba(80, 212, 255, .16);
  border-radius: 7px 2px 7px 2px;
  color: rgba(203, 239, 252, .78) !important;
  background:
    linear-gradient(180deg, rgba(5, 28, 54, .78), rgba(1, 9, 22, .86)),
    radial-gradient(circle at 50% 0, rgba(80, 212, 255, .12), transparent 62%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045);
  font-size: 9px !important;
  font-weight: 850;
  letter-spacing: .035em;
  text-decoration: none !important;
  text-transform: uppercase;
  transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.az-topline .az-lang-api-external-link::after {
  content: '↗';
  margin-left: 5px;
  color: rgba(113, 220, 255, .55);
  font-size: 9px;
  transform: translateY(-1px);
}

.az-topline .az-lang-api-external-link:hover,
.az-topline .az-lang-api-external-link:focus-visible {
  color: #fff !important;
  border-color: rgba(131, 232, 255, .42);
  background:
    linear-gradient(180deg, rgba(9, 47, 84, .92), rgba(2, 15, 34, .96)),
    radial-gradient(circle at 50% 0, rgba(117, 226, 255, .22), transparent 64%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 0 12px rgba(80, 212, 255, .13);
  transform: translateY(-1px);
}

.az-topline .az-lang-api-status {
  min-height: 23px;
  margin-bottom: 6px;
}

.az-topline .az-lang-translate-future {
  padding-top: 0 !important;
  border-top: 0 !important;
}

@media (max-width: 760px) {
  .az-topline .az-lang-translate-panel {
    width: 238px !important;
  }
}


/* v0.4.45 Phoenix translator extra-options polish
   Restores visible service badges and makes Google Translate / DeepL compact. */
.az-topline .az-lang-translate-panel {
  width: 250px !important;
}

.az-topline .az-lang-api-external {
  gap: 5px !important;
  margin: 6px 0 7px !important;
}

.az-topline .az-lang-api-external-title {
  font-size: 8px !important;
  letter-spacing: .075em !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link {
  min-height: 23px !important;
  padding: 0 5px !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: clip !important;
  font-size: 7.6px !important;
  font-weight: 900 !important;
  letter-spacing: .006em !important;
  line-height: 1 !important;
  text-transform: none !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link::before {
  content: 'G' !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 17px !important;
  min-width: 17px !important;
  height: 15px !important;
  margin: 0 5px 0 0 !important;
  border-radius: 5px 2px 5px 2px !important;
  border: 1px solid rgba(91, 214, 255, .32) !important;
  background:
    linear-gradient(180deg, rgba(13, 57, 96, .95), rgba(2, 15, 35, .96)),
    radial-gradient(circle at 45% 18%, rgba(160, 241, 255, .45), transparent 54%) !important;
  color: rgba(214, 250, 255, .96) !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 8px rgba(80, 212, 255, .15) !important;
  flex: 0 0 auto !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-deepl::before {
  content: 'D' !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link::after {
  content: '↗' !important;
  display: inline-flex !important;
  margin-left: auto !important;
  padding-left: 4px !important;
  color: rgba(113, 220, 255, .50) !important;
  font-size: 8px !important;
  line-height: 1 !important;
  transform: translateY(-1px) !important;
  flex: 0 0 auto !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link:hover::before,
.az-topline .az-lang-panel .az-lang-api-external-link:focus-visible::before {
  border-color: rgba(160, 241, 255, .62) !important;
  background:
    linear-gradient(180deg, rgba(20, 86, 139, .98), rgba(3, 24, 53, .98)),
    radial-gradient(circle at 45% 18%, rgba(205, 252, 255, .70), transparent 56%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 0 12px rgba(91, 214, 255, .24) !important;
}

@media (max-width: 760px) {
  .az-topline .az-lang-translate-panel {
    width: 250px !important;
  }
}


/* v0.4.46 Phoenix translator brand hover badges
   Extra option icons now shift into their service colors on hover/focus. */
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-google:hover::before,
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-google:focus-visible::before {
  border-color: rgba(255, 255, 255, .78) !important;
  background:
    conic-gradient(from 220deg,
      #4285f4 0deg 88deg,
      #34a853 88deg 168deg,
      #fbbc05 168deg 252deg,
      #ea4335 252deg 330deg,
      #4285f4 330deg 360deg) !important;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .55) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    0 0 10px rgba(66, 133, 244, .35),
    0 0 16px rgba(251, 188, 5, .20) !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-deepl:hover::before,
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-deepl:focus-visible::before {
  border-color: rgba(71, 223, 255, .85) !important;
  background:
    linear-gradient(135deg, #061f3f 0%, #0f4c81 48%, #00b8d9 100%) !important;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .60) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 0 12px rgba(0, 184, 217, .38),
    0 0 18px rgba(15, 76, 129, .28) !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-google:hover,
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-google:focus-visible {
  border-color: rgba(66, 133, 244, .46) !important;
  box-shadow: inset 0 0 0 1px rgba(251,188,5,.12), 0 0 12px rgba(66,133,244,.14) !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-deepl:hover,
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-deepl:focus-visible {
  border-color: rgba(0, 184, 217, .52) !important;
  box-shadow: inset 0 0 0 1px rgba(0,184,217,.14), 0 0 12px rgba(0,184,217,.16) !important;
}


/* v0.4.47 Phoenix translator extra-option readability
   Increases Google Translate / DeepL text by about 1px while keeping compact buttons. */
.az-topline .az-lang-panel .az-lang-api-external-link {
  font-size: 8.6px !important;
  letter-spacing: .004em !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link::before {
  font-size: 8.4px !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link::after {
  font-size: 8.4px !important;
}


/* v0.4.48 Phoenix language product direction
   Adds Spanish to official Layer 1 and keeps AI targets for non-official fallback languages. */
.az-topline .az-lang-panel .az-lang-fallback a[data-lang-code="ES"]::before,
.az-topline .az-lang-panel a[data-lang-code="ES"]::before {
  letter-spacing: .02em !important;
}

.az-topline .az-lang-translate-panel .az-lang-api-target {
  font-size: 9.8px !important;
}

.az-topline .az-lang-translate-note::after {
  content: ' Official site languages are handled in the left menu.';
}

@media (max-width: 760px) {
  .az-topline .az-lang-panel {
    width: 258px !important;
  }
}


/* v0.4.49 Phoenix AI fallback language refinement
   Visible fallback targets are now French / Portuguese / Russian / Korean, with a scrollable "show all" tray overlaying the official language layer. */
.az-topline .az-lang-translate-panel {
  overflow: visible !important;
}

.az-topline .az-lang-translate-panel .az-lang-api-targets {
  grid-template-columns: 1fr 1fr !important;
}

.az-topline .az-lang-translate-panel .az-lang-api-target.is-primary {
  grid-column: 1 / -1 !important;
}

.az-topline .az-lang-api-more {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 24px;
  margin: 5px 0 0;
  padding: 0 8px;
  border: 1px solid rgba(91, 204, 255, .18);
  border-radius: 7px 2px 7px 2px;
  color: rgba(203, 239, 252, .80);
  background:
    linear-gradient(180deg, rgba(4, 24, 48, .74), rgba(1, 8, 20, .86)),
    radial-gradient(circle at 50% 0, rgba(80, 212, 255, .10), transparent 64%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045);
  font-size: 8.8px;
  font-weight: 950;
  letter-spacing: .08em;
  line-height: 1;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.az-topline .az-lang-api-more::after {
  content: '▸';
  margin-left: 7px;
  color: rgba(112, 223, 255, .62);
  font-size: 9px;
}

.az-topline .az-lang-translate-panel.is-all-open .az-lang-api-more,
.az-topline .az-lang-api-more:hover,
.az-topline .az-lang-api-more:focus-visible {
  color: #fff;
  border-color: rgba(131, 232, 255, .42);
  background:
    linear-gradient(180deg, rgba(7, 42, 76, .90), rgba(2, 14, 32, .96)),
    radial-gradient(circle at 50% 0, rgba(117, 226, 255, .22), transparent 64%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 0 12px rgba(80, 212, 255, .13);
  transform: translateY(-1px);
}

.az-topline .az-lang-translate-panel.is-all-open .az-lang-api-more::after {
  content: '◂';
}

.az-topline .az-lang-api-all-panel {
  position: absolute;
  top: 0;
  right: calc(100% + 9px);
  width: 238px;
  max-height: 292px;
  padding: 8px;
  border: 1px solid rgba(91, 204, 255, .30);
  border-radius: 12px 4px 12px 4px;
  background:
    linear-gradient(180deg, rgba(5, 23, 43, .985), rgba(2, 9, 21, .985)),
    repeating-linear-gradient(90deg, rgba(80,212,255,.055) 0 1px, transparent 1px 18px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 16px 34px rgba(0,0,0,.52),
    0 0 26px rgba(47, 142, 255, .16);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(8px) scale(.985);
  transform-origin: top right;
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
  z-index: 10002;
}

.az-topline .az-lang-translate-panel.is-all-open .az-lang-api-all-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0) scale(1);
}

.az-topline .az-lang-api-all-panel::after {
  content: '';
  position: absolute;
  right: -5px;
  top: 22px;
  width: 9px;
  height: 9px;
  border-right: 1px solid rgba(91, 204, 255, .30);
  border-top: 1px solid rgba(91, 204, 255, .30);
  background: rgba(5, 23, 43, .985);
  transform: rotate(45deg);
}

.az-topline .az-lang-api-all-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0 0 7px;
  padding: 0 0 6px;
  border-bottom: 1px dotted rgba(80, 212, 255, .18);
}

.az-topline .az-lang-api-all-head strong {
  color: rgba(224, 248, 255, .92);
  font-size: 9.5px;
  font-weight: 950;
  letter-spacing: .08em;
  line-height: 1;
  text-transform: uppercase;
}

.az-topline .az-lang-api-all-close {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 1px solid rgba(91, 204, 255, .18);
  border-radius: 6px 2px 6px 2px;
  color: rgba(188, 233, 250, .80);
  background: rgba(0, 12, 28, .66);
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.az-topline .az-lang-api-all-close:hover,
.az-topline .az-lang-api-all-close:focus-visible {
  color: #fff;
  border-color: rgba(131, 232, 255, .42);
  background: rgba(5, 40, 72, .92);
  box-shadow: 0 0 10px rgba(80, 212, 255, .16);
}

.az-topline .az-lang-api-all-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  max-height: 239px;
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-width: thin;
  scrollbar-color: rgba(91, 204, 255, .38) rgba(0, 10, 24, .45);
}

.az-topline .az-lang-api-all-list::-webkit-scrollbar {
  width: 6px;
}

.az-topline .az-lang-api-all-list::-webkit-scrollbar-track {
  background: rgba(0, 10, 24, .45);
  border-radius: 99px;
}

.az-topline .az-lang-api-all-list::-webkit-scrollbar-thumb {
  background: rgba(91, 204, 255, .34);
  border-radius: 99px;
}

.az-topline .az-lang-api-all-target {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 28px;
  padding: 0 8px !important;
  border: 1px solid rgba(91, 204, 255, .14);
  border-radius: 8px 3px 8px 3px;
  background: rgba(0, 10, 24, .52);
  color: rgba(219, 243, 255, .82);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .02em;
  line-height: 1;
  text-align: left;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.az-topline .az-lang-api-all-target span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 18px;
  margin-right: 8px;
  border-radius: 5px 2px 5px 2px;
  border: 1px solid rgba(80, 212, 255, .28);
  background: linear-gradient(180deg, rgba(6, 32, 58, .88), rgba(1, 9, 21, .88));
  color: #72dcff;
  font-size: 8.4px;
  font-weight: 950;
  letter-spacing: .04em;
  text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
  transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.az-topline .az-lang-api-all-target:hover,
.az-topline .az-lang-api-all-target:focus-visible {
  color: #f3fbff;
  border-color: rgba(80, 212, 255, .34);
  background: linear-gradient(180deg, rgba(7, 34, 62, .82), rgba(2, 12, 27, .92));
  box-shadow: inset 0 0 18px rgba(80, 212, 255, .08), 0 0 12px rgba(80, 212, 255, .10);
  transform: translateY(-1px);
}

.az-topline .az-lang-api-all-target:hover span,
.az-topline .az-lang-api-all-target:focus-visible span {
  border-color: rgba(143, 231, 255, .52);
  background:
    linear-gradient(180deg, rgba(19, 76, 124, .98), rgba(4, 21, 50, 1)),
    radial-gradient(circle at 25% 0, rgba(100, 224, 255, .30), transparent 60%);
  color: #e9fbff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 0 12px rgba(73, 199, 255, .16);
}

@media (max-width: 760px) {
  .az-topline .az-lang-api-all-panel {
    top: calc(100% + 8px);
    right: auto;
    left: 0;
    width: 100%;
    max-height: 230px;
    transform: translateY(-5px) scale(.985);
    transform-origin: top left;
  }
  .az-topline .az-lang-translate-panel.is-all-open .az-lang-api-all-panel {
    transform: translateY(0) scale(1);
  }
  .az-topline .az-lang-api-all-panel::after {
    display: none;
  }
  .az-topline .az-lang-api-all-list {
    max-height: 176px;
  }
}


/* v0.4.50 Phoenix translator external service row
   Adds Microsoft Translator and Papago for a balanced 2x2 extra-options grid. */
.az-topline .az-lang-panel .az-lang-api-external {
  grid-template-columns: 1fr 1fr !important;
  gap: 5px !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link {
  min-width: 0 !important;
  font-size: 8.5px !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-microsoft::before {
  content: 'M' !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-papago::before {
  content: 'P' !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-microsoft:hover::before,
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-microsoft:focus-visible::before {
  border-color: rgba(255, 255, 255, .74) !important;
  background:
    linear-gradient(135deg,
      #f25022 0 49%,
      #7fba00 50% 100%) left / 50% 100% no-repeat,
    linear-gradient(135deg,
      #00a4ef 0 49%,
      #ffb900 50% 100%) right / 50% 100% no-repeat !important;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    0 0 10px rgba(0, 164, 239, .32),
    0 0 16px rgba(127, 186, 0, .18) !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-papago:hover::before,
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-papago:focus-visible::before {
  border-color: rgba(0, 210, 130, .86) !important;
  background:
    linear-gradient(135deg, #03c75a 0%, #00a884 52%, #00d2ff 100%) !important;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 0 12px rgba(3, 199, 90, .34),
    0 0 18px rgba(0, 210, 255, .20) !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-microsoft:hover,
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-microsoft:focus-visible {
  border-color: rgba(0, 164, 239, .48) !important;
  box-shadow: inset 0 0 0 1px rgba(255,185,0,.11), 0 0 12px rgba(0,164,239,.15) !important;
}

.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-papago:hover,
.az-topline .az-lang-panel .az-lang-api-external-link.az-lang-api-papago:focus-visible {
  border-color: rgba(3, 199, 90, .52) !important;
  box-shadow: inset 0 0 0 1px rgba(0,210,255,.10), 0 0 12px rgba(3,199,90,.16) !important;
}


/* v0.4.51 Phoenix language capsule wording polish
   Shortens the public helper label to Translate for a cleaner product-style UI. */
.az-language-switcher .az-lang-helper-btn {
  min-width: 84px !important;
}
.az-language-switcher .az-lang-translate-title {
  letter-spacing: .075em !important;
}


/* v0.4.52 Phoenix translate panel close + trigger state icon
   Adds close control only to the Translate panel. Official Layer 1 panel stays unchanged. */
.az-topline .az-lang-translate-panel {
  position: absolute !important;
}

.az-topline .az-lang-translate-close {
  position: absolute;
  top: 7px;
  right: 8px;
  width: 20px;
  height: 20px;
  display: inline-grid !important;
  place-items: center;
  border: 1px solid rgba(91, 204, 255, .32);
  border-radius: 6px 2px 6px 2px;
  background:
    linear-gradient(180deg, rgba(5, 31, 55, .96), rgba(1, 10, 24, .96));
  color: rgba(185, 238, 255, .86);
  font: 900 13px/1 Inter, Segoe UI, Arial, sans-serif;
  cursor: pointer;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 10px rgba(80, 212, 255, .10);
  transition: color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
  z-index: 5;
}

.az-topline .az-lang-translate-close:hover,
.az-topline .az-lang-translate-close:focus-visible {
  color: #ffffff;
  border-color: rgba(129, 224, 255, .72);
  background:
    radial-gradient(circle at 50% 20%, rgba(107, 225, 255, .30), transparent 50%),
    linear-gradient(180deg, rgba(9, 48, 82, .98), rgba(1, 14, 32, .98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 0 14px rgba(80, 212, 255, .26);
  transform: translateY(-1px);
}

.az-topline .az-lang-translate-title {
  padding-right: 28px !important;
}

.az-topline .az-lang-caret {
  width: 13px;
  height: 13px;
  display: inline-grid;
  place-items: center;
  font-size: 0 !important;
  line-height: 1;
  transform: none !important;
}

.az-topline .az-lang-caret::before {
  content: "☰";
  font-size: 11px;
  line-height: 1;
  color: rgba(119, 219, 255, .90);
  text-shadow: 0 0 8px rgba(80, 212, 255, .42);
  transition: transform .16s ease, color .16s ease, text-shadow .16s ease;
}

.az-topline .az-language-switcher.is-open .az-lang-caret::before {
  content: "▾";
  font-size: 12px;
  color: #d8f8ff;
  transform: translateY(-1px);
  text-shadow: 0 0 10px rgba(106, 226, 255, .60);
}


/* v0.4.53 Phoenix close-button danger feedback
   Both translator close controls turn dark red on hover and brighter red while pressed. */
.az-topline .az-lang-translate-close:hover,
.az-topline .az-lang-translate-close:focus-visible,
.az-topline .az-lang-api-all-close:hover,
.az-topline .az-lang-api-all-close:focus-visible {
  color: #fff4f4 !important;
  border-color: rgba(255, 88, 88, .78) !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(255, 78, 78, .28), transparent 54%),
    linear-gradient(180deg, rgba(84, 5, 16, .98), rgba(25, 0, 8, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 12px rgba(255, 42, 42, .24),
    0 0 22px rgba(255, 0, 60, .10) !important;
  text-shadow: 0 0 8px rgba(255, 102, 102, .46) !important;
}

.az-topline .az-lang-translate-close:active,
.az-topline .az-lang-api-all-close:active {
  color: #ffffff !important;
  border-color: rgba(255, 168, 168, .96) !important;
  background:
    radial-gradient(circle at 50% 20%, rgba(255, 214, 214, .30), transparent 46%),
    linear-gradient(180deg, rgba(240, 18, 42, .98), rgba(114, 0, 18, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 0 0 12px rgba(255,255,255,.08),
    0 0 16px rgba(255, 48, 48, .42),
    0 0 28px rgba(255, 0, 64, .18) !important;
  transform: translateY(0) scale(.96) !important;
}


/* v0.4.54 Phoenix close-button size normalization
   Makes the Translate-panel close button match the compact More Languages close button. */
.az-topline .az-lang-translate-close,
.az-topline .az-lang-api-all-close {
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 6px 2px 6px 2px !important;
  font: 900 14px/1 Inter, Segoe UI, Arial, sans-serif !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.az-topline .az-lang-translate-close {
  background: rgba(0, 12, 28, .66) !important;
  border-color: rgba(91, 204, 255, .18) !important;
  box-shadow: none !important;
}

.az-topline .az-lang-translate-close:hover,
.az-topline .az-lang-translate-close:focus-visible,
.az-topline .az-lang-api-all-close:hover,
.az-topline .az-lang-api-all-close:focus-visible {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 12px rgba(255, 42, 42, .24),
    0 0 22px rgba(255, 0, 60, .10) !important;
}


/* v0.4.55 Phoenix language trigger interaction polish
   Closed state: soft shine on hover and soft bright press. Open state: hover becomes close-danger affordance. */
.az-topline .az-language-switcher .az-lang-trigger {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate;
}

.az-topline .az-language-switcher .az-lang-trigger > * {
  position: relative;
  z-index: 2;
}

.az-topline .az-language-switcher .az-lang-trigger::after {
  content: "";
  position: absolute;
  inset: -45% auto -45% -75%;
  width: 48%;
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  background:
    linear-gradient(105deg,
      transparent 0%,
      rgba(158, 241, 255, .00) 18%,
      rgba(158, 241, 255, .35) 46%,
      rgba(255, 255, 255, .42) 52%,
      rgba(66, 217, 255, .18) 62%,
      transparent 100%);
  filter: blur(.4px);
  transform: translateX(0) skewX(-18deg);
}

@keyframes azLangTriggerSoftShine {
  0% { opacity: 0; transform: translateX(0) skewX(-18deg); }
  18% { opacity: .72; }
  100% { opacity: 0; transform: translateX(390%) skewX(-18deg); }
}

.az-topline .az-language-switcher:not(.is-open) .az-lang-trigger:hover::after,
.az-topline .az-language-switcher:not(.is-open) .az-lang-trigger:focus-visible::after {
  animation: azLangTriggerSoftShine .72s ease-out 1;
}

.az-topline .az-language-switcher:not(.is-open) .az-lang-trigger:hover,
.az-topline .az-language-switcher:not(.is-open) .az-lang-trigger:focus-visible {
  border-color: rgba(147, 235, 255, .72) !important;
  background:
    radial-gradient(circle at 12% 18%, rgba(183, 250, 255, .18), transparent 36%),
    linear-gradient(180deg, rgba(7, 39, 70, .98), rgba(1, 12, 29, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -8px 15px rgba(0,0,0,.30),
    0 0 0 1px rgba(70, 215, 255, .22),
    0 0 18px rgba(80, 212, 255, .24) !important;
}

.az-topline .az-language-switcher:not(.is-open) .az-lang-trigger:active {
  color: #ffffff !important;
  border-color: rgba(194, 248, 255, .88) !important;
  background:
    radial-gradient(circle at 18% 16%, rgba(220, 255, 255, .30), transparent 42%),
    linear-gradient(180deg, rgba(17, 70, 114, .98), rgba(3, 24, 55, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 0 12px rgba(145, 231, 255, .12),
    0 0 0 1px rgba(132, 232, 255, .34),
    0 0 20px rgba(99, 220, 255, .32) !important;
  transform: translateY(0) scale(.98) !important;
}

.az-topline .az-language-switcher.is-open .az-lang-trigger:hover,
.az-topline .az-language-switcher.is-open .az-lang-trigger:focus-visible {
  color: #fff4f4 !important;
  border-color: rgba(255, 88, 88, .82) !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 90, 90, .25), transparent 42%),
    linear-gradient(180deg, rgba(82, 5, 17, .98), rgba(20, 0, 8, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -8px 15px rgba(0,0,0,.34),
    0 0 0 1px rgba(255, 63, 63, .24),
    0 0 14px rgba(255, 42, 42, .26),
    0 0 24px rgba(255, 0, 60, .12) !important;
}

.az-topline .az-language-switcher.is-open .az-lang-trigger:hover .az-lang-caret::before,
.az-topline .az-language-switcher.is-open .az-lang-trigger:focus-visible .az-lang-caret::before {
  content: "×" !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  color: #fff1f1 !important;
  text-shadow: 0 0 9px rgba(255, 92, 92, .66) !important;
  transform: translateY(-1px) !important;
}

.az-topline .az-language-switcher.is-open .az-lang-trigger:active {
  color: #ffffff !important;
  border-color: rgba(255, 172, 172, .98) !important;
  background:
    radial-gradient(circle at 18% 20%, rgba(255, 214, 214, .30), transparent 44%),
    linear-gradient(180deg, rgba(235, 20, 44, .98), rgba(118, 0, 19, .98)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 0 0 12px rgba(255,255,255,.08),
    0 0 0 1px rgba(255, 110, 110, .38),
    0 0 18px rgba(255, 50, 50, .42),
    0 0 30px rgba(255, 0, 64, .18) !important;
  transform: translateY(0) scale(.98) !important;
}

.az-topline .az-language-switcher.is-open .az-lang-trigger:active .az-lang-caret::before {
  content: "×" !important;
  color: #ffffff !important;
  text-shadow: 0 0 11px rgba(255, 180, 180, .75) !important;
}


/* v0.4.56 Phoenix holographic globe language icon
   Replaces the simple dot with a compact projected globe in the language trigger. */
.az-topline .az-lang-core {
  position: relative !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(173, 246, 255, .68) !important;
  overflow: hidden !important;
  opacity: .96 !important;
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.95) 0 8%, rgba(174,247,255,.84) 9% 17%, transparent 18%),
    radial-gradient(circle at 50% 56%, rgba(61, 217, 255, .88) 0 23%, rgba(22, 115, 205, .52) 42%, rgba(3, 31, 66, .90) 70%, rgba(1, 9, 25, .98) 100%) !important;
  box-shadow:
    inset 0 0 5px rgba(218, 253, 255, .34),
    inset -2px -2px 5px rgba(0, 24, 58, .62),
    0 0 8px rgba(88, 225, 255, .76),
    0 0 16px rgba(39, 142, 255, .30) !important;
  transform: translateY(.2px);
}

.az-topline .az-lang-core::before {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 50%;
  border-left: 1px solid rgba(207, 252, 255, .52);
  border-right: 1px solid rgba(207, 252, 255, .26);
  background:
    linear-gradient(90deg, transparent 0 43%, rgba(207,252,255,.52) 45% 55%, transparent 57% 100%),
    linear-gradient(0deg, transparent 0 31%, rgba(207,252,255,.34) 33% 38%, transparent 40% 61%, rgba(207,252,255,.30) 63% 68%, transparent 70% 100%);
  box-shadow: inset 0 0 4px rgba(117, 231, 255, .24);
  opacity: .90;
  pointer-events: none;
}

.az-topline .az-lang-core::after {
  content: "";
  position: absolute;
  left: 1px;
  top: 3px;
  width: 12px;
  height: 7px;
  border-top: 1px solid rgba(211, 252, 255, .40);
  border-bottom: 1px solid rgba(211, 252, 255, .32);
  border-radius: 50%;
  opacity: .86;
  pointer-events: none;
}

.az-topline .az-language-switcher:not(.is-open) .az-lang-trigger:hover .az-lang-core,
.az-topline .az-language-switcher:not(.is-open) .az-lang-trigger:focus-visible .az-lang-core {
  border-color: rgba(222, 255, 255, .92) !important;
  box-shadow:
    inset 0 0 6px rgba(255, 255, 255, .40),
    inset -2px -2px 5px rgba(0, 24, 58, .56),
    0 0 10px rgba(131, 241, 255, .90),
    0 0 22px rgba(66, 164, 255, .40) !important;
}

.az-topline .az-language-switcher.is-open .az-lang-trigger:hover .az-lang-core,
.az-topline .az-language-switcher.is-open .az-lang-trigger:focus-visible .az-lang-core {
  border-color: rgba(255, 158, 158, .86) !important;
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.90) 0 8%, rgba(255,183,183,.78) 9% 17%, transparent 18%),
    radial-gradient(circle at 50% 56%, rgba(255, 90, 90, .82) 0 23%, rgba(143, 15, 38, .62) 43%, rgba(45, 0, 13, .96) 100%) !important;
  box-shadow:
    inset 0 0 5px rgba(255, 218, 218, .30),
    inset -2px -2px 5px rgba(45, 0, 13, .64),
    0 0 9px rgba(255, 78, 78, .65),
    0 0 17px rgba(255, 0, 60, .22) !important;
}

@media (max-width: 520px) {
  .az-topline .az-lang-core {
    display: inline-block !important;
  }
}