:root {
  --bg: #0d1016;
  --bg-2: #11171f;
  --panel: rgba(17, 23, 31, .86);
  --text: #f4f7fb;
  --muted: #9aa7b7;
  --line: #2a3441;
  --accent: #6ee7c7;
  --accent-2: #9df7df;
  --header-h: 76px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body[data-site-theme="teal"] {
  --bg: #0d1016;
  --bg-2: #11171f;
  --panel: rgba(17,23,31,.88);
  --text: #f4f7fb;
  --muted: #9aa7b7;
  --line: #2a3441;
  --accent: #6ee7c7;
  --accent-2: #9df7df;
}

body[data-site-theme="purple"] {
  --bg: #100f16;
  --bg-2: #171222;
  --panel: rgba(23,18,34,.90);
  --text: #f6f3ff;
  --muted: #afa5c7;
  --line: #332d46;
  --accent: #bc70ff;
  --accent-2: #dab2ff;
}

body[data-site-theme="ember"] {
  --bg: #14100f;
  --bg-2: #1c1412;
  --panel: rgba(28,20,18,.90);
  --text: #fff5ef;
  --muted: #c8ada1;
  --line: #45302b;
  --accent: #ff8c5a;
  --accent-2: #ffb193;
}

body[data-site-theme="ice"] {
  --bg: #0b1116;
  --bg-2: #0d1920;
  --panel: rgba(13,25,32,.90);
  --text: #f3fbff;
  --muted: #a8becc;
  --line: #243844;
  --accent: #7ed7ff;
  --accent-2: #b4ebff;
}

.hidden { display: none !important; }

#appShellHeader.shell-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 10000 !important;
  min-height: var(--header-h) !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(235px, 1fr) auto minmax(330px, 1fr) !important;
  align-items: center !important;
  gap: 18px !important;
  padding: 10px 22px !important;
  border-bottom: 1px solid var(--line) !important;
  background: color-mix(in srgb, var(--bg) 92%, transparent) !important;
  backdrop-filter: blur(18px) !important;
  box-shadow: 0 8px 30px rgba(0,0,0,.22) !important;
}

.shell-brand {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--text);
}

.shell-logo-wide {
  width: 132px;
  max-height: 46px;
  object-fit: contain;
}

.shell-logo-square {
  display: none;
  width: 42px;
  height: 42px;
  object-fit: contain;
}

.shell-brand-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.shell-brand-copy strong {
  font-size: 12px;
  letter-spacing: .06em;
}

.shell-brand-copy small {
  color: var(--muted);
  font-size: 9px;
  white-space: nowrap;
}

.shell-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.shell-nav-link {
  min-height: 42px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: var(--muted);
  text-decoration: none;
  font: inherit;
  cursor: pointer;
  padding: 7px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}

.shell-nav-link:hover,
.shell-nav-link.active {
  border-color: color-mix(in srgb, var(--accent) 28%, transparent);
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  color: var(--text);
}

.tool-link {
  display: flex;
  text-align: center;
}

.tool-link span {
  font-size: 11px;
  font-weight: 800;
}

.tool-link small {
  color: var(--accent);
  font-size: 8px;
  font-weight: 700;
}

.shell-tools-menu { position: relative; }

.shell-dropdown {
  position: absolute;
  top: calc(100% + 7px);
  left: 50%;
  transform: translateX(-50%);
  width: 240px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: color-mix(in srgb, var(--bg-2) 96%, transparent);
  box-shadow: 0 22px 48px rgba(0,0,0,.38);
}

.shell-dropdown-item {
  width: 100%;
  min-height: 46px;
  border-radius: 9px;
  text-decoration: none;
  color: var(--text);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
}

.shell-dropdown-item:hover,
.shell-dropdown-item.active {
  background: color-mix(in srgb, var(--accent) 9%, transparent);
}

.shell-dropdown-item span {
  display: grid;
  gap: 2px;
}

.shell-dropdown-item strong { font-size: 11px; }
.shell-dropdown-item small { color: var(--muted); font-size: 8px; }
.shell-dropdown-item em {
  color: var(--accent);
  font-style: normal;
  font-size: 8px;
}

.shell-preferences {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
}

.shell-select {
  display: grid;
  gap: 2px;
}

.shell-select > span {
  color: var(--muted);
  font-size: 8px;
  padding-left: 2px;
}

.shell-select select {
  min-width: 105px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--bg-2);
  color: var(--text);
  padding: 0 9px;
  font-size: 10px;
}

.shell-status {
  color: var(--muted);
  font-size: 9px;
  white-space: nowrap;
}

.shell-main {
  min-height: calc(100vh - var(--header-h));
}

.shell-home {
  min-height: calc(100vh - var(--header-h));
  display: grid;
  place-items: center;
  padding: 24px;
  overflow: hidden;
}

.home-watermark-logo {
  width: min(74vw, 920px);
  max-height: 58vh;
  object-fit: contain;
  opacity: .20;
  filter: drop-shadow(0 0 44px color-mix(in srgb, var(--accent) 14%, transparent));
  user-select: none;
  pointer-events: none;
}

.tool-host {
  width: 100%;
  min-height: calc(100vh - var(--header-h));
}

.tool-loading {
  min-height: calc(100vh - var(--header-h));
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  color: var(--muted);
  font-size: 11px;
}

.loader-ring {
  width: 34px;
  height: 34px;
  border: 3px solid var(--line);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: fibspin .8s linear infinite;
}

@keyframes fibspin { to { transform: rotate(360deg); } }

.tool-error {
  width: min(720px, calc(100% - 30px));
  margin: 40px auto;
  padding: 18px;
  border: 1px solid rgba(255,95,95,.28);
  border-radius: 14px;
  background: rgba(80,15,15,.22);
  color: #ffd5d5;
  font-size: 12px;
}

/* Protect the fixed shell from legacy tool styles loaded later. */
#appShellHeader,
#appShellHeader * {
  box-sizing: border-box;
}

@media (max-width: 1040px) {
  #appShellHeader.shell-header {
    grid-template-columns: auto 1fr auto !important;
  }

  .shell-brand-copy { display: none; }
  .shell-logo-wide { width: 115px; }
  .shell-status { display: none; }
}

@media (max-width: 760px) {
  :root { --header-h: 68px; }

  #appShellHeader.shell-header {
    padding: 8px 10px !important;
    grid-template-columns: auto 1fr auto !important;
    gap: 7px !important;
  }

  .shell-logo-wide { display: none; }
  .shell-logo-square { display: block; }

  .shell-nav { gap: 3px; }
  .shell-nav-link { padding: 6px 8px; min-height: 38px; }
  .shell-nav-button > span:first-child { display: none; }

  .shell-preferences { gap: 5px; }
  .shell-select > span { display: none; }
  .shell-select select {
    min-width: 74px;
    width: 74px;
    height: 32px;
    padding: 0 5px;
    font-size: 9px;
  }

  .home-watermark-logo { width: 92vw; opacity: .22; }
}

/* =========================================================
   v1.1.3 - Top navigation: visible tools + fixed menus + neon
   ========================================================= */
.shell-top-tools {
  display: contents;
}

.shell-fixed-link {
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.shell-neon-button {
  border-color: color-mix(in srgb, var(--accent) 34%, transparent);
  background: color-mix(in srgb, var(--accent) 3%, transparent);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 8%, transparent) inset,
    0 0 8px color-mix(in srgb, var(--accent) 18%, transparent),
    0 0 18px color-mix(in srgb, var(--accent) 7%, transparent);
  transition:
    color .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.shell-neon-button:hover {
  border-color: color-mix(in srgb, var(--accent) 72%, transparent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--text);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent) inset,
    0 0 11px color-mix(in srgb, var(--accent) 48%, transparent),
    0 0 25px color-mix(in srgb, var(--accent) 22%, transparent);
  transform: translateY(-1px);
}

.shell-neon-button.active,
.shell-tools-menu:has(.shell-dropdown-item.active) > .shell-neon-button {
  border-color: color-mix(in srgb, var(--accent) 88%, transparent);
  background: color-mix(in srgb, var(--accent) 13%, transparent);
  color: var(--text);
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--accent) 24%, transparent) inset,
    0 0 12px color-mix(in srgb, var(--accent) 55%, transparent),
    0 0 30px color-mix(in srgb, var(--accent) 27%, transparent);
}

.shell-chevron {
  color: var(--accent);
  font-size: 12px;
  line-height: 1;
}

.shell-static-view {
  min-height: calc(100vh - var(--header-h));
  display: grid;
  place-items: center;
  padding: 28px;
}

.shell-static-card {
  width: min(650px, 100%);
  padding: 34px;
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
  border-radius: 18px;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  box-shadow:
    0 0 18px color-mix(in srgb, var(--accent) 14%, transparent),
    0 22px 60px rgba(0,0,0,.25);
}

.shell-static-eyebrow {
  display: inline-block;
  margin-bottom: 10px;
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
}

.shell-static-card h1 {
  margin: 0 0 10px;
  font-size: clamp(28px, 4vw, 44px);
}

.shell-static-card p {
  margin: 0 auto;
  max-width: 520px;
  color: var(--muted);
  line-height: 1.6;
  font-size: 12px;
}

@media (max-width: 1180px) {
  #appShellHeader.shell-header {
    gap: 10px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .shell-nav { gap: 4px; }
  .shell-nav-link { padding-left: 8px; padding-right: 8px; }
  .shell-fixed-link { font-size: 10px; }
  .tool-link span { font-size: 10px; }
  .tool-link small { font-size: 7px; }
}

@media (max-width: 900px) {
  .tool-link small { display: none; }
  .shell-nav-link { min-height: 36px; padding: 5px 7px; }
  .shell-fixed-link,
  .tool-link span { font-size: 9px; }
}

@media (max-width: 760px) {
  .shell-nav {
    justify-content: flex-start;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 4px 2px;
  }

  .shell-nav::-webkit-scrollbar { display: none; }

  .shell-nav-button > span:first-child {
    display: inline;
  }

  .shell-neon-button {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .shell-fixed-link,
  .tool-link span,
  .shell-nav-button > span:first-child {
    font-size: 8px;
  }

  .shell-dropdown {
    left: auto;
    right: 0;
    transform: none;
    width: min(240px, calc(100vw - 18px));
  }
}


/* =========================================================
   v1.1.9 - Copyright global + Aviso Legal
   ========================================================= */
.shell-footer {
  width: 100%;
  border-top: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg-2) 96%, transparent);
  box-shadow: 0 -10px 32px rgba(0,0,0,.16);
}

.shell-legal-strip {
  width: min(1320px, calc(100% - 32px));
  min-width: 0;
  margin: 0 auto;
  padding: 13px 0 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px 12px;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.35;
  text-align: center;
}

.shell-legal-copyright {
  color: color-mix(in srgb, var(--text) 84%, var(--muted));
  font-weight: 750;
  letter-spacing: .015em;
  white-space: nowrap;
}

.shell-legal-thirdparty {
  min-width: 0;
}

.shell-legal-link {
  border: 0;
  padding: 2px 3px;
  background: transparent;
  color: var(--accent);
  font: inherit;
  font-weight: 850;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
  white-space: nowrap;
  transition: color .18s ease, text-shadow .18s ease;
}

.shell-legal-link:hover,
.shell-legal-link:focus-visible {
  color: var(--accent-2);
  text-shadow: 0 0 10px color-mix(in srgb, var(--accent) 50%, transparent);
  outline: none;
}

.legal-modal {
  width: min(720px, calc(100vw - 28px));
  max-height: min(82vh, 760px);
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--line));
  border-radius: 20px;
  background:
    radial-gradient(circle at 90% 0%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 38%),
    color-mix(in srgb, var(--bg-2) 98%, black);
  color: var(--text);
  box-shadow:
    0 0 40px color-mix(in srgb, var(--accent) 13%, transparent),
    0 30px 90px rgba(0,0,0,.58);
}

.legal-modal::backdrop {
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(6px);
}

.legal-modal-head,
.legal-modal-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 22px;
}

.legal-modal-head {
  border-bottom: 1px solid var(--line);
}

.legal-modal-head h2 {
  margin: 4px 0 0;
  font-size: clamp(20px, 3vw, 28px);
  letter-spacing: -.025em;
}

.legal-modal-eyebrow {
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
}

.legal-modal-close {
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: color-mix(in srgb, var(--accent) 5%, transparent);
  color: var(--text);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.legal-modal-body {
  max-height: 55vh;
  overflow: auto;
  padding: 22px;
  display: grid;
  gap: 18px;
}

.legal-modal-body section {
  padding: 16px 17px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: color-mix(in srgb, var(--bg) 56%, transparent);
}

.legal-modal-body h3 {
  margin: 0 0 8px;
  color: var(--text);
  font-size: 13px;
}

.legal-modal-body p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.72;
}

.legal-modal-note {
  padding: 0 4px;
  font-size: 10px !important;
}

.legal-modal-foot {
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 9px;
}

.legal-modal-ok {
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--text);
  font: inherit;
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
  box-shadow: 0 0 16px color-mix(in srgb, var(--accent) 10%, transparent);
}

.legal-modal-ok:hover {
  background: color-mix(in srgb, var(--accent) 16%, transparent);
}

@media (max-width: 1040px) {
  .shell-legal-thirdparty {
    display: none;
  }
}

@media (max-width: 760px) {
  .shell-legal-strip {
    width: calc(100% - 20px);
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 11px 0 12px;
    font-size: 7px;
  }

  .shell-legal-strip::-webkit-scrollbar {
    display: none;
  }

  .shell-legal-copyright {
    white-space: nowrap;
  }

  .legal-modal-head,
  .legal-modal-foot {
    padding: 15px 16px;
  }

  .legal-modal-body {
    padding: 16px;
    gap: 12px;
  }

  .legal-modal-body section {
    padding: 14px;
  }
}

/* =========================================================
   v1.1.6 - Quem Somos / About Us
   ========================================================= */
.shell-static-view.about-open {
  place-items: start center;
  padding: 34px 22px 70px;
}

.about-page {
  width: min(1180px, 100%);
  display: grid;
  gap: 22px;
}

.about-biography {
  border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--line));
  border-radius: 20px;
  padding: clamp(22px, 4vw, 38px);
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr);
  gap: 26px;
  align-items: center;
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--panel) 96%, transparent),
    color-mix(in srgb, var(--bg-2) 92%, transparent)
  );
  box-shadow:
    0 0 24px color-mix(in srgb, var(--accent) 9%, transparent),
    0 18px 50px rgba(0,0,0,.18);
}

.about-biography-visual {
  padding: clamp(14px, 2vw, 22px);
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
  border-radius: 18px;
  background: radial-gradient(circle at top, color-mix(in srgb, var(--accent) 8%, transparent), transparent 52%), color-mix(in srgb, var(--bg) 54%, transparent);
  display: grid;
  place-items: center;
  min-height: 250px;
}

.about-biography-visual img {
  width: min(100%, 560px);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 0 22px color-mix(in srgb, var(--accent) 16%, transparent));
}

.about-biography-copy h2 {
  margin: 8px 0 12px;
  font-size: clamp(24px, 3.4vw, 38px);
  letter-spacing: -.035em;
}

.about-biography-copy p {
  margin: 0 0 14px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.8;
}

.about-biography-copy p:last-child {
  margin-bottom: 0;
}


.about-passion {
  border: 1px solid color-mix(in srgb, var(--accent) 48%, var(--line));
  border-radius: 18px;
  padding: 18px 22px;
  display: flex;
  align-items: center;
  gap: 14px;
  background: color-mix(in srgb, var(--accent) 8%, var(--panel));
  box-shadow: 0 0 26px color-mix(in srgb, var(--accent) 10%, transparent);
}

.about-passion-icon {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border: 1px solid color-mix(in srgb, var(--accent) 68%, var(--line));
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  font-size: 17px;
  text-shadow: 0 0 14px color-mix(in srgb, var(--accent) 75%, transparent);
}

.about-passion p {
  margin: 0;
  color: var(--text);
  font-size: clamp(13px, 1.4vw, 16px);
  line-height: 1.65;
  font-weight: 700;
}

.about-hero,
.about-section,
.about-idea-card,
.about-note,
.about-timeline-item {
  border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--panel) 96%, transparent),
    color-mix(in srgb, var(--bg-2) 91%, transparent)
  );
  box-shadow: 0 18px 50px rgba(0,0,0,.18);
}

.about-hero {
  min-height: 330px;
  border-radius: 24px;
  padding: clamp(28px, 5vw, 62px);
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(230px, .65fr);
  align-items: center;
  gap: 36px;
  position: relative;
  overflow: hidden;
}

.about-hero::before {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  right: -90px;
  top: -120px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--accent) 17%, transparent);
  filter: blur(75px);
  pointer-events: none;
}

.about-hero-copy {
  position: relative;
  z-index: 1;
}

.about-eyebrow,
.about-section-heading > span,
.about-genre-card > span {
  color: var(--accent);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
}

.about-hero h1 {
  margin: 10px 0 16px;
  font-size: clamp(38px, 6vw, 72px);
  line-height: .98;
  letter-spacing: -.045em;
}

.about-hero-lead {
  max-width: 710px;
  margin: 0;
  color: var(--muted);
  font-size: clamp(14px, 1.6vw, 18px);
  line-height: 1.72;
}

.about-tagline {
  width: fit-content;
  margin-top: 26px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 15px 10px 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--line));
  border-radius: 14px;
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 7%, transparent);
  box-shadow: 0 0 20px color-mix(in srgb, var(--accent) 9%, transparent);
  font-size: 12px;
  font-weight: 700;
}

.about-tagline-mark {
  padding: 5px 8px;
  border-radius: 8px;
  background: var(--accent);
  color: var(--bg);
  font-weight: 950;
  letter-spacing: .04em;
}

.about-hero-brand {
  position: relative;
  z-index: 1;
  justify-self: end;
  display: grid;
  grid-template-columns: 120px auto;
  align-items: center;
  gap: 16px;
  color: var(--text);
  font-size: clamp(22px, 3vw, 34px);
  font-weight: 900;
  line-height: .95;
  letter-spacing: -.03em;
}

.about-hero-brand img {
  width: 120px;
  height: 120px;
  object-fit: contain;
  filter: drop-shadow(0 0 22px color-mix(in srgb, var(--accent) 24%, transparent));
}

.about-section {
  border-radius: 20px;
  padding: clamp(24px, 4vw, 42px);
}

.about-section-heading h2,
.about-idea-card h2 {
  margin: 7px 0 0;
  font-size: clamp(24px, 3.5vw, 38px);
  letter-spacing: -.035em;
}

.about-story-grid {
  margin-top: 26px;
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, .45fr);
  gap: 30px;
  align-items: stretch;
}

.about-prose {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.8;
}

.about-prose p {
  margin: 0 0 15px;
}

.about-prose p:last-child { margin-bottom: 0; }

.about-genre-card {
  min-height: 180px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--bg) 56%, transparent);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
}

.about-genres {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.about-genres span {
  min-width: 56px;
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line));
  border-radius: 10px;
  color: var(--text);
  background: color-mix(in srgb, var(--accent) 7%, transparent);
  text-align: center;
  font-size: 11px;
  font-weight: 900;
}

.about-timeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.about-timeline-item {
  min-height: 190px;
  padding: 22px;
  border-radius: 17px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: relative;
  overflow: hidden;
}

.about-timeline-item::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 0;
  height: 2px;
  background: color-mix(in srgb, var(--accent) 45%, transparent);
}

.about-timeline-current {
  border-color: color-mix(in srgb, var(--accent) 55%, var(--line));
  box-shadow: 0 0 25px color-mix(in srgb, var(--accent) 10%, transparent);
}

.about-timeline-year {
  color: var(--accent);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: .13em;
}

.about-timeline-item strong {
  font-size: 16px;
}

.about-timeline-item p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.65;
}

.about-today {
  position: relative;
  overflow: hidden;
}

.about-prose-wide {
  max-width: 900px;
  margin-top: 22px;
}

.about-principles {
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.about-principle {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: color-mix(in srgb, var(--bg) 52%, transparent);
}

.about-principle > span {
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
}

.about-principle strong {
  display: block;
  margin: 7px 0 7px;
  font-size: 13px;
}

.about-principle p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
}

.about-idea-card {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
  border-radius: 20px;
  padding: clamp(24px, 4vw, 40px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 28px;
  box-shadow:
    0 0 26px color-mix(in srgb, var(--accent) 9%, transparent),
    0 20px 55px rgba(0,0,0,.18);
}

.about-idea-card p {
  max-width: 760px;
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}

.about-email-button {
  min-height: 48px;
  padding: 0 18px;
  border: 1px solid color-mix(in srgb, var(--accent) 70%, var(--line));
  border-radius: 13px;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--text);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
  box-shadow: 0 0 18px color-mix(in srgb, var(--accent) 13%, transparent);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.about-email-button:hover {
  transform: translateY(-2px);
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  box-shadow: 0 0 28px color-mix(in srgb, var(--accent) 25%, transparent);
}

.about-notes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.about-note {
  padding: 20px 22px;
  border-radius: 16px;
}

.about-note strong {
  font-size: 12px;
  color: var(--text);
}

.about-note p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.65;
}

@media (max-width: 900px) {
  .about-hero { grid-template-columns: 1fr; }
  .about-biography { grid-template-columns: 1fr; }
  .about-hero-brand { justify-self: start; }
  .about-story-grid { grid-template-columns: 1fr; }
  .about-timeline { grid-template-columns: repeat(2, 1fr); }
  .about-principles { grid-template-columns: 1fr; }
  .about-idea-card { grid-template-columns: 1fr; }
  .about-email-button { width: fit-content; }
}

@media (max-width: 620px) {
  .shell-static-view.about-open { padding: 16px 10px 46px; }
  .about-page { gap: 12px; }
  .about-passion { padding: 15px 16px; align-items: flex-start; }
  .about-biography { padding: 18px; gap: 18px; border-radius: 16px; }
  .about-biography-visual { min-height: 190px; padding: 12px; }
  .about-hero, .about-section, .about-idea-card { border-radius: 16px; }
  .about-hero { padding: 26px 20px; gap: 26px; }
  .about-hero-brand { grid-template-columns: 76px auto; }
  .about-hero-brand img { width: 76px; height: 76px; }
  .about-timeline { grid-template-columns: 1fr; }
  .about-timeline-item { min-height: auto; }
  .about-notes { grid-template-columns: 1fr; }
  .about-email-button { width: 100%; justify-content: center; }
}

/* =========================================================
   v1.1.11 - Google AdSense + aviso de bloqueador de anúncios
   ========================================================= */
#adblockBait {
  position: absolute !important;
  left: -10000px !important;
  top: -10000px !important;
  width: 10px !important;
  height: 10px !important;
  min-width: 10px !important;
  min-height: 10px !important;
  overflow: hidden !important;
  pointer-events: none !important;
  opacity: .01 !important;
}

.adblock-modal {
  width: min(900px, calc(100vw - 28px));
  max-height: min(88vh, 760px);
  margin: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--accent) 46%, var(--line));
  border-radius: 22px;
  background: color-mix(in srgb, var(--bg-2) 98%, black);
  color: var(--text);
  box-shadow:
    0 0 44px color-mix(in srgb, var(--accent) 16%, transparent),
    0 34px 100px rgba(0,0,0,.62);
}

.adblock-modal::backdrop {
  background: rgba(0,0,0,.76);
  backdrop-filter: blur(7px);
}

.adblock-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(230px, .82fr) minmax(0, 1.18fr);
  min-height: 420px;
}

.adblock-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 20%, color-mix(in srgb, var(--accent) 13%, transparent), transparent 30%),
    radial-gradient(circle at 82% 82%, color-mix(in srgb, var(--accent) 8%, transparent), transparent 34%);
}

.adblock-close {
  position: absolute;
  z-index: 3;
  top: 13px;
  right: 13px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line));
  border-radius: 11px;
  background: color-mix(in srgb, var(--bg) 84%, transparent);
  color: var(--text);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.adblock-visual {
  position: relative;
  z-index: 1;
  min-height: 420px;
  overflow: hidden;
  background: color-mix(in srgb, var(--bg) 70%, black);
}

.adblock-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  box-shadow: inset -30px 0 55px color-mix(in srgb, var(--bg-2) 92%, transparent);
  pointer-events: none;
}

.adblock-visual img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  object-position: center;
  display: block;
  filter: saturate(.92) contrast(1.03);
}

.adblock-copy {
  position: relative;
  z-index: 1;
  padding: clamp(38px, 5vw, 58px) clamp(28px, 5vw, 54px) 38px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.adblock-eyebrow {
  color: var(--accent);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .16em;
}

.adblock-copy h2 {
  margin: 9px 0 15px;
  font-size: clamp(25px, 3.5vw, 38px);
  line-height: 1.08;
  letter-spacing: -.035em;
}

.adblock-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.75;
}

.adblock-request {
  margin-top: 14px !important;
  color: var(--text) !important;
  font-weight: 720;
}

.adblock-actions {
  margin-top: 24px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.adblock-primary,
.adblock-secondary {
  min-height: 45px;
  padding: 0 16px;
  border-radius: 12px;
  font: inherit;
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.adblock-primary {
  border: 1px solid color-mix(in srgb, var(--accent) 75%, var(--line));
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  color: var(--text);
  box-shadow: 0 0 20px color-mix(in srgb, var(--accent) 15%, transparent);
}

.adblock-secondary {
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg) 54%, transparent);
  color: var(--muted);
}

.adblock-primary:hover,
.adblock-secondary:hover {
  transform: translateY(-1px);
}

.adblock-primary:hover {
  background: color-mix(in srgb, var(--accent) 23%, transparent);
  box-shadow: 0 0 30px color-mix(in srgb, var(--accent) 23%, transparent);
}

.adblock-hint {
  margin-top: 14px;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.55;
}

@media (max-width: 760px) {
  .adblock-modal {
    width: min(560px, calc(100vw - 18px));
    max-height: 92vh;
    overflow-y: auto;
    border-radius: 18px;
  }

  .adblock-card {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .adblock-visual {
    min-height: 185px;
    max-height: 220px;
  }

  .adblock-visual::after {
    box-shadow: inset 0 -30px 45px color-mix(in srgb, var(--bg-2) 90%, transparent);
  }

  .adblock-visual img {
    min-height: 185px;
    height: 220px;
    object-position: center 28%;
  }

  .adblock-copy {
    padding: 25px 20px 22px;
  }

  .adblock-copy h2 {
    font-size: 24px;
  }

  .adblock-actions {
    flex-direction: column;
  }

  .adblock-primary,
  .adblock-secondary {
    width: 100%;
  }
}

/* =========================================================
   v1.2.1 - Admin Verified + correções de hospedagem
   ========================================================= */
.shell-auth {
  position: relative;
  flex: 0 0 auto;
}

.shell-auth-login,
.shell-account-chip {
  min-height: 36px;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent) 8%, var(--bg-2));
  color: var(--text);
  padding: 6px 10px;
  font: inherit;
  font-size: 9px;
  font-weight: 850;
  cursor: pointer;
  box-shadow: 0 0 14px color-mix(in srgb, var(--accent) 8%, transparent);
}

.shell-auth-login:hover,
.shell-account-chip:hover {
  border-color: color-mix(in srgb, var(--accent) 70%, var(--line));
  box-shadow: 0 0 20px color-mix(in srgb, var(--accent) 15%, transparent);
}

.shell-account-chip {
  display: flex;
  align-items: center;
  gap: 7px;
  max-width: 165px;
}

.shell-account-chip img {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
}

.shell-account-chip span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shell-account-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 10050;
  width: 235px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: color-mix(in srgb, var(--bg-2) 98%, transparent);
  box-shadow: 0 20px 50px rgba(0,0,0,.45);
  display: grid;
  gap: 7px;
}

.shell-account-menu strong {
  font-size: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.shell-account-menu small {
  color: var(--accent);
  font-size: 8px;
  padding-bottom: 7px;
  border-bottom: 1px solid var(--line);
}

.shell-account-menu a,
.shell-account-menu button {
  width: 100%;
  min-height: 34px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  text-decoration: none;
  font: inherit;
  font-size: 9px;
  text-align: left;
  padding: 8px 9px;
  cursor: pointer;
}

.shell-account-menu a:hover,
.shell-account-menu button:hover {
  background: color-mix(in srgb, var(--accent) 9%, transparent);
}

.login-modal,
.terms-modal {
  margin: auto;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--line));
  border-radius: 20px;
  background: color-mix(in srgb, var(--bg-2) 98%, black);
  color: var(--text);
  box-shadow: 0 28px 90px rgba(0,0,0,.62), 0 0 34px color-mix(in srgb, var(--accent) 12%, transparent);
}

.login-modal::backdrop,
.terms-modal::backdrop {
  background: rgba(0,0,0,.74);
  backdrop-filter: blur(7px);
}

.login-modal { width: min(430px, calc(100vw - 28px)); }

.login-card {
  position: relative;
  padding: 30px 26px 28px;
  text-align: center;
}

.login-close,
.terms-close {
  width: 38px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent) 5%, transparent);
  color: var(--text);
  font: inherit;
  font-size: 22px;
  cursor: pointer;
}

.login-close {
  position: absolute;
  right: 14px;
  top: 14px;
}

.login-logo {
  width: 84px;
  height: 84px;
  object-fit: contain;
  filter: drop-shadow(0 0 18px color-mix(in srgb, var(--accent) 28%, transparent));
}

.login-card h2 { margin: 12px 0 8px; font-size: 24px; }
.login-card p { margin: 0 auto 20px; max-width: 330px; color: var(--muted); font-size: 11px; line-height: 1.65; }
.google-signin-button { min-height: 44px; display: grid; place-items: center; }
.login-setup-message { margin-top: 14px !important; color: #ffb8a8 !important; }

.terms-modal {
  width: min(900px, calc(100vw - 28px));
  max-height: min(90vh, 900px);
  overflow: hidden;
}

.terms-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 22px;
  border-bottom: 1px solid var(--line);
}

.terms-eyebrow {
  color: var(--accent);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .15em;
}

.terms-modal-head h2 { margin: 4px 0 0; font-size: 22px; }

.terms-scroll {
  height: min(56vh, 560px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 24px 26px 36px;
  background: color-mix(in srgb, var(--bg) 58%, transparent);
  scroll-behavior: smooth;
}

.terms-doc { color: var(--muted); font-size: 11px; line-height: 1.75; }
.terms-doc h1 { margin: 0 0 20px; color: var(--text); font-size: 22px; }
.terms-doc h2 { margin: 24px 0 8px; color: var(--text); font-size: 14px; }
.terms-doc p { margin: 0 0 10px; }
.terms-separator { margin: 34px 0; border: 0; border-top: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); }

.terms-consent {
  padding: 16px 22px 20px;
  border-top: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg-2) 98%, transparent);
}

.terms-read-status {
  margin: 0 0 11px;
  color: #f1c677;
  font-size: 9px;
  font-weight: 800;
}
.terms-read-status.done { color: var(--accent); }

.terms-checks { display: grid; gap: 7px; margin-bottom: 14px; }
.terms-check { display: flex; align-items: flex-start; gap: 9px; color: var(--text); font-size: 10px; line-height: 1.45; }
.terms-check input { margin-top: 1px; accent-color: var(--accent); }
.terms-check input:disabled + span { color: var(--muted); opacity: .58; }

.terms-accept {
  min-height: 42px;
  width: 100%;
  border: 1px solid color-mix(in srgb, var(--accent) 65%, var(--line));
  border-radius: 10px;
  background: color-mix(in srgb, var(--accent) 13%, var(--bg));
  color: var(--text);
  font: inherit;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 0 18px color-mix(in srgb, var(--accent) 11%, transparent);
}
.terms-accept:disabled { cursor: not-allowed; opacity: .35; box-shadow: none; }

@media (max-width: 1180px) {
  .shell-status { display: none; }
  .shell-account-chip span { display: none; }
  .shell-account-chip { padding: 5px; }
}

@media (max-width: 760px) {
  .shell-auth-login { font-size: 8px; padding: 5px 8px; }
  .shell-account-menu { position: fixed; right: 10px; top: 66px; }
  .terms-modal { width: calc(100vw - 16px); max-height: 94vh; }
  .terms-modal-head { padding: 14px 16px; }
  .terms-scroll { height: 55vh; padding: 18px 16px 28px; }
  .terms-consent { padding: 14px 16px 16px; }
}

/* Donate — apoio voluntário global */
.donate-float {
  position: fixed;
  left: auto;
  right: 16px;
  bottom: 16px;
  z-index: 9990;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg-2) 92%, transparent);
  box-shadow: 0 12px 34px rgba(0,0,0,.34), 0 0 24px color-mix(in srgb, var(--accent) 7%, transparent);
  backdrop-filter: blur(14px);
}

.donate-float-open,
.donate-float-close {
  border: 0;
  color: var(--text);
  cursor: pointer;
}

.donate-float-open {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 10px 0 8px;
  border-radius: 999px;
  background: transparent;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .02em;
}

.donate-float-open:hover {
  background: color-mix(in srgb, var(--accent) 9%, transparent);
}

.donate-float-icon {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}

.donate-float-icon svg {
  width: 13px;
  height: 13px;
  fill: currentColor;
}

.donate-float-close {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: transparent;
  color: var(--muted);
  font-size: 15px;
  line-height: 1;
}

.donate-float-close:hover {
  color: var(--text);
  background: color-mix(in srgb, var(--text) 7%, transparent);
}

.donate-modal {
  width: min(510px, calc(100vw - 28px));
  max-height: calc(100vh - 34px);
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  border-radius: 20px;
  background: color-mix(in srgb, var(--bg-2) 97%, black);
  color: var(--text);
  box-shadow: 0 32px 100px rgba(0,0,0,.66), 0 0 50px color-mix(in srgb, var(--accent) 10%, transparent);
}

.donate-modal::backdrop {
  background: rgba(3,5,8,.74);
  backdrop-filter: blur(7px);
}

.donate-modal-card {
  position: relative;
  padding: 30px;
  text-align: center;
}

.donate-modal-close {
  position: absolute;
  top: 13px;
  right: 13px;
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--bg) 70%, transparent);
  color: var(--muted);
  font-size: 20px;
  cursor: pointer;
}

.donate-modal-close:hover { color: var(--text); border-color: var(--accent); }

.donate-modal-icon {
  width: 54px;
  height: 54px;
  margin: 0 auto 12px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  border-radius: 17px;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 11%, transparent);
  font-size: 25px;
  box-shadow: 0 0 24px color-mix(in srgb, var(--accent) 9%, transparent);
}

.donate-eyebrow {
  display: block;
  color: var(--accent);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
}

.donate-modal h2 {
  margin: 7px auto 10px;
  max-width: 390px;
  font-size: 24px;
  line-height: 1.12;
  letter-spacing: -.035em;
}

.donate-modal p {
  margin: 0 auto;
  max-width: 430px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.65;
}

.donate-notice {
  margin: 16px 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: color-mix(in srgb, var(--accent) 5%, transparent);
  color: var(--muted);
  font-size: 9px;
  line-height: 1.5;
}

.donate-amounts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 15px 0 12px;
}

.donate-amounts button {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: color-mix(in srgb, var(--bg) 72%, transparent);
  color: var(--text);
  font-weight: 800;
  cursor: pointer;
}

.donate-amounts button:hover,
.donate-amounts button.is-selected {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 20%, transparent);
}

.donate-custom-field {
  display: grid;
  gap: 6px;
  text-align: left;
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
}

.donate-input-wrap {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--bg) 72%, transparent);
}

.donate-input-wrap:focus-within { border-color: var(--accent); }
.donate-input-wrap > span { color: var(--accent); font-weight: 850; }
.donate-input-wrap input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  font-weight: 800;
}

.donate-payment-hint {
  min-height: 17px;
  margin: 9px 0 7px;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.45;
}

.donate-submit {
  width: 100%;
  min-height: 46px;
  border: 1px solid color-mix(in srgb, var(--accent) 62%, var(--line));
  border-radius: 12px;
  background: color-mix(in srgb, var(--accent) 15%, var(--bg-2));
  color: var(--text);
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 10px 30px color-mix(in srgb, var(--accent) 8%, transparent);
}

.donate-submit:hover { background: color-mix(in srgb, var(--accent) 22%, var(--bg-2)); }
.donate-submit:disabled { opacity: .64; cursor: wait; }

.donate-security-hint {
  display: block;
  margin-top: 10px;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.45;
}

@media (max-width: 620px) {
  .donate-float { left: auto; right: 10px; bottom: 10px; }
  .donate-modal-card { padding: 28px 18px 20px; }
  .donate-modal h2 { font-size: 21px; }
  .donate-amounts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* v1.3.0 — Comunidade, notificações e preferências */
.community-quick-actions{position:relative;display:flex;gap:6px;align-items:center}.community-icon-button{position:relative;display:grid;place-items:center;width:34px;height:34px;border:1px solid color-mix(in srgb,var(--accent) 35%,#26363e);border-radius:9px;background:#10191e;color:var(--text);text-decoration:none;cursor:pointer;font-size:16px}.community-icon-button:hover{border-color:var(--accent);box-shadow:0 0 16px color-mix(in srgb,var(--accent) 20%,transparent)}.community-count{position:absolute;right:-5px;top:-6px;min-width:17px;height:17px;padding:0 4px;border-radius:20px;background:#ff4d62;color:white;font-size:9px;line-height:17px;text-align:center;border:2px solid #0b1216}.community-popover{position:absolute;right:0;top:42px;width:min(380px,calc(100vw - 24px));max-height:480px;overflow:hidden;background:#0d161a;border:1px solid #2b3d45;border-radius:13px;box-shadow:0 20px 60px rgba(0,0,0,.48);z-index:2000}.community-popover-head{display:flex;align-items:center;justify-content:space-between;padding:12px;border-bottom:1px solid #223139}.community-popover-head button{border:0;background:transparent;color:var(--accent);font-size:10px;cursor:pointer}.community-notification-list{max-height:410px;overflow:auto}.community-notification{display:flex;flex-direction:column;gap:4px;padding:12px 14px;color:var(--text);text-decoration:none;border-bottom:1px solid #1d2b31}.community-notification:hover{background:#132027}.community-notification.unread{background:color-mix(in srgb,var(--accent) 7%,#0e171b);border-left:3px solid var(--accent)}.community-notification span{font-size:11px;line-height:1.45;color:var(--muted)}.community-notification small{font-size:9px;color:#74858b}.community-empty{padding:22px;text-align:center;color:var(--muted);font-size:11px}.community-preferences-modal{border:0;padding:0;background:transparent;color:var(--text);max-width:none}.community-preferences-modal::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(4px)}.community-preferences-card{position:relative;width:min(620px,calc(100vw - 24px));background:linear-gradient(180deg,#111c21,#0b1317);border:1px solid #2d4249;border-radius:16px;padding:24px;box-shadow:0 25px 80px rgba(0,0,0,.55)}.community-preferences-card h2{margin:5px 0 8px;font-size:27px}.community-preferences-card>p{color:var(--muted);line-height:1.55}.community-preferences-close{position:absolute;right:12px;top:10px;background:transparent;border:0;color:var(--muted);font-size:24px;cursor:pointer}.community-preferences-eyebrow{font-size:9px;letter-spacing:.18em;color:var(--accent);font-weight:800}.community-pref-master,.community-pref-grid label{display:flex;gap:10px;align-items:flex-start;border:1px solid #283940;background:#0d161a;border-radius:10px;padding:11px}.community-pref-master small{display:block;color:var(--muted);font-size:9px;margin-top:2px}.community-pref-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:9px 0}.community-pref-grid label{font-size:11px}.community-contact-box{margin-top:12px;padding:13px;border:1px solid #2a3a41;border-radius:10px;display:grid;gap:8px}.community-contact-box label>span{display:block;font-size:10px;color:var(--muted);margin-bottom:5px}.community-contact-box input[type="text"],.community-contact-box input:not([type]){width:100%}.community-contact-box #prefWhatsapp{width:100%;box-sizing:border-box;background:#081014;color:var(--text);border:1px solid #31434b;border-radius:8px;padding:10px}.community-inline-check{font-size:10px}.community-contact-box small,.community-pref-status{font-size:9px;color:var(--muted);line-height:1.45}.community-pref-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:15px}.community-pref-actions button{border:1px solid #31434b;background:#121d22;color:var(--text);border-radius:9px;padding:10px 14px;cursor:pointer}.community-pref-actions .community-pref-save{background:var(--accent);color:#06110f;border-color:var(--accent);font-weight:800}@media(max-width:760px){.community-pref-grid{grid-template-columns:1fr}.community-quick-actions{order:3}.community-popover{position:fixed;right:12px;top:72px;left:12px;width:auto}}

/* =========================================================
   v1.3.1 - Mobile drawer / hamburger navigation
   ========================================================= */
.mobile-menu-button,
.mobile-menu-drawer,
.mobile-menu-backdrop { display: none; }

@media (max-width: 820px) {
  :root { --header-h: 64px; }

  #appShellHeader.shell-header {
    min-height: var(--header-h) !important;
    grid-template-columns: auto 1fr auto !important;
    gap: 8px !important;
    padding: 8px 10px !important;
  }

  .shell-logo-wide { display: none !important; }
  .shell-logo-square { display: block !important; width: 40px; height: 40px; }
  .shell-brand-copy { display: none !important; }

  #appShellHeader .shell-nav { display: none !important; }

  #appShellHeader .shell-preferences {
    justify-self: end;
    min-width: 0;
    gap: 6px;
  }
  #appShellHeader .shell-preferences > .shell-select,
  #appShellHeader .shell-preferences > .shell-status,
  #appShellHeader .shell-preferences > .shell-auth {
    display: none !important;
  }
  #appShellHeader .community-quick-actions {
    display: flex;
    order: initial;
  }
  #appShellHeader .community-quick-actions.hidden { display: none !important; }
  #appShellHeader .community-icon-button { width: 36px; height: 36px; }

  .mobile-menu-button {
    display: inline-flex;
    width: 42px;
    height: 42px;
    padding: 9px;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--line));
    border-radius: 11px;
    background: color-mix(in srgb, var(--bg-2) 90%, transparent);
    cursor: pointer;
    box-shadow: 0 0 18px color-mix(in srgb, var(--accent) 10%, transparent);
  }
  .mobile-menu-button span {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 4px;
    background: var(--text);
    transition: transform .18s ease, opacity .18s ease;
  }
  .mobile-menu-button[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .mobile-menu-button[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .mobile-menu-button[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .mobile-menu-backdrop {
    display: block;
    position: fixed;
    inset: var(--header-h) 0 0 0;
    z-index: 9997;
    background: rgba(0,0,0,.62);
    backdrop-filter: blur(2px);
  }
  .mobile-menu-backdrop.hidden { display: none !important; }

  .mobile-menu-drawer {
    display: flex;
    position: fixed;
    z-index: 9998;
    top: var(--header-h);
    right: 0;
    bottom: 0;
    width: min(88vw, 360px);
    padding: 0;
    flex-direction: column;
    overflow-y: auto;
    border-left: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-2) 97%, #000 3%);
    box-shadow: -24px 0 70px rgba(0,0,0,.45);
    animation: fibMobileDrawerIn .18s ease-out;
  }
  .mobile-menu-drawer.hidden { display: none !important; }
  @keyframes fibMobileDrawerIn { from { transform: translateX(24px); opacity: .5; } to { transform: translateX(0); opacity: 1; } }

  .mobile-menu-head {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 15px;
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-2) 98%, transparent);
  }
  .mobile-menu-head > div { display: grid; gap: 2px; }
  .mobile-menu-head strong { font-size: 13px; }
  .mobile-menu-head small { font-size: 9px; color: var(--muted); }
  .mobile-menu-head button {
    width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 9px;
    background: transparent; color: var(--text); font-size: 22px; cursor: pointer;
  }

  .mobile-nav-links { display: grid; gap: 5px; padding: 12px; }
  .mobile-nav-item {
    display: grid;
    grid-template-columns: 26px 1fr;
    align-items: center;
    gap: 8px;
    min-height: 54px;
    padding: 9px 11px;
    border: 1px solid transparent;
    border-radius: 11px;
    color: var(--text);
    text-decoration: none;
    background: color-mix(in srgb, var(--bg) 76%, transparent);
  }
  .mobile-nav-item > span { color: var(--accent); font-size: 18px; text-align: center; }
  .mobile-nav-item div { display: grid; gap: 2px; }
  .mobile-nav-item strong { font-size: 11px; }
  .mobile-nav-item small { color: var(--muted); font-size: 8px; line-height: 1.35; }
  .mobile-nav-item.active {
    border-color: color-mix(in srgb, var(--accent) 50%, var(--line));
    background: color-mix(in srgb, var(--accent) 9%, var(--bg-2));
    box-shadow: inset 3px 0 0 var(--accent);
  }

  .mobile-menu-settings {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid var(--line);
  }
  .mobile-menu-settings label { display: grid; gap: 5px; }
  .mobile-menu-settings span { color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
  .mobile-menu-settings select {
    width: 100%; min-width: 0; height: 40px; padding: 0 9px;
    border: 1px solid var(--line); border-radius: 9px;
    background: var(--bg); color: var(--text); font: inherit; font-size: 10px;
  }

  .mobile-auth-section { padding: 12px; border-top: 1px solid var(--line); margin-top: auto; }
  .mobile-login-button {
    width: 100%; min-height: 44px; border: 1px solid var(--accent); border-radius: 10px;
    background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--text); font-weight: 800; cursor: pointer;
  }
  .mobile-account-summary { display: flex; align-items: center; gap: 9px; padding: 5px 3px 12px; }
  .mobile-account-summary img { width: 36px; height: 36px; object-fit: cover; border-radius: 50%; border: 1px solid var(--line); }
  .mobile-account-summary > div { min-width: 0; display: grid; gap: 2px; }
  .mobile-account-summary strong { font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-account-summary small { color: var(--muted); font-size: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-account-links { display: grid; gap: 5px; }
  .mobile-account-links a,
  .mobile-account-links button {
    width: 100%; min-height: 39px; padding: 8px 10px; text-align: left;
    border: 1px solid var(--line); border-radius: 9px; background: var(--bg); color: var(--text);
    text-decoration: none; font: inherit; font-size: 10px; cursor: pointer;
  }

  body.mobile-menu-open { overflow: hidden; }
  .community-popover { top: 64px; }
}


/* =========================================================
   v1.3.5 - MultiShop priority highlight
   ========================================================= */
:root { --multishop-accent: #f4c85a; }
body[data-site-theme="purple"] { --multishop-accent: #ffd166; }
body[data-site-theme="ember"] { --multishop-accent: #ffd36a; }
body[data-site-theme="ice"] { --multishop-accent: #f1c75b; }

.shell-multishop-link {
  border-color: color-mix(in srgb, var(--multishop-accent) 68%, transparent) !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--multishop-accent) 15%, transparent), color-mix(in srgb, var(--accent) 4%, transparent)) !important;
  color: color-mix(in srgb, var(--multishop-accent) 88%, var(--text)) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--multishop-accent) 16%, transparent) inset, 0 0 12px color-mix(in srgb, var(--multishop-accent) 25%, transparent), 0 0 24px color-mix(in srgb, var(--multishop-accent) 10%, transparent) !important;
}
.shell-multishop-link:hover,
.shell-multishop-link.active {
  border-color: color-mix(in srgb, var(--multishop-accent) 95%, transparent) !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--multishop-accent) 24%, transparent), color-mix(in srgb, var(--accent) 8%, transparent)) !important;
  color: var(--text) !important;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--multishop-accent) 28%, transparent) inset, 0 0 15px color-mix(in srgb, var(--multishop-accent) 52%, transparent), 0 0 34px color-mix(in srgb, var(--multishop-accent) 25%, transparent) !important;
}
.shell-multishop-icon { font-size: 16px; line-height: 1; filter: drop-shadow(0 0 5px color-mix(in srgb, var(--multishop-accent) 45%, transparent)); }
@media (max-width: 760px) {
  .mobile-nav-item.mobile-multishop-item {
    border-color: color-mix(in srgb, var(--multishop-accent) 56%, var(--line));
    background: linear-gradient(135deg, color-mix(in srgb, var(--multishop-accent) 13%, var(--bg-2)), color-mix(in srgb, var(--bg) 88%, transparent));
    box-shadow: inset 3px 0 0 var(--multishop-accent), 0 0 16px color-mix(in srgb, var(--multishop-accent) 12%, transparent);
  }
  .mobile-nav-item.mobile-multishop-item > span { color: var(--multishop-accent); }
  .mobile-nav-item.mobile-multishop-item.active {
    border-color: var(--multishop-accent);
    box-shadow: inset 3px 0 0 var(--multishop-accent), 0 0 18px color-mix(in srgb, var(--multishop-accent) 22%, transparent);
  }
}


/* =========================================================
   v1.4.16 — shell global com navegação lateral escalável
   ========================================================= */
:root{
  --sidebar-w:252px;
  --sidebar-collapsed-w:72px;
  --sidebar-current-w:var(--sidebar-w);
}
body.shell-sidebar-collapsed{--sidebar-current-w:var(--sidebar-collapsed-w)}

/* Topo fica funcional e visualmente mais discreto; navegação sai dele. */
#appShellHeader.shell-header{
  grid-template-columns:minmax(190px,1fr) auto !important;
  gap:14px !important;
  background:color-mix(in srgb,var(--bg) 96%,transparent) !important;
  border-bottom-color:color-mix(in srgb,var(--line) 72%,transparent) !important;
  box-shadow:0 5px 20px rgba(0,0,0,.12) !important;
}
#appShellHeader .shell-nav-legacy{display:none !important}
#appShellHeader .shell-preferences{justify-self:end}

.shell-sidebar-nav{
  position:fixed;
  z-index:9980;
  top:var(--header-h);
  bottom:0;
  left:0;
  width:var(--sidebar-current-w);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-right:1px solid color-mix(in srgb,var(--accent) 21%,var(--line));
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,#080b11),#090c12 32%,color-mix(in srgb,var(--bg-2) 92%,#05070b));
  box-shadow:14px 0 38px rgba(0,0,0,.28),inset -1px 0 color-mix(in srgb,var(--accent) 8%,transparent);
  transition:width .22s ease;
}
.shell-sidebar-head{
  min-height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:13px 12px 11px 16px;
  border-bottom:1px solid color-mix(in srgb,var(--accent) 13%,var(--line));
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 8%,transparent),transparent 68%);
}
.shell-sidebar-title{display:grid;gap:2px;min-width:0;overflow:hidden}
.shell-sidebar-kicker{font-size:7px;font-weight:900;letter-spacing:.18em;color:var(--accent);white-space:nowrap}
.shell-sidebar-title strong{font-size:13px;white-space:nowrap}
.shell-sidebar-collapse{
  flex:0 0 auto;width:34px;height:34px;border-radius:10px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));
  background:color-mix(in srgb,var(--accent) 5%,#0d1118);color:var(--accent);font-size:17px;cursor:pointer;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);transition:.18s ease;
}
.shell-sidebar-collapse:hover{border-color:color-mix(in srgb,var(--accent) 70%,var(--line));background:color-mix(in srgb,var(--accent) 12%,#0d1118)}
.shell-sidebar-links{flex:1;min-height:0;overflow:auto;padding:10px 8px 16px;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 22%,var(--line)) transparent}
.shell-side-section{display:grid;gap:4px;margin-top:13px}
.shell-side-section:first-child{margin-top:0}
.shell-side-section-label{padding:0 10px 5px;color:color-mix(in srgb,var(--muted) 85%,transparent);font-size:7px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;overflow:hidden}
.shell-side-item{
  position:relative;display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:8px;min-height:48px;padding:6px 9px 6px 7px;
  border:1px solid transparent;border-radius:12px;color:color-mix(in srgb,var(--text) 88%,var(--muted));text-decoration:none;transition:.17s ease;
}
.shell-side-item:before{content:"";position:absolute;left:-8px;top:10px;bottom:10px;width:3px;border-radius:0 4px 4px 0;background:transparent;box-shadow:none;transition:.17s ease}
.shell-side-item:hover{color:#fff;border-color:color-mix(in srgb,var(--accent) 20%,var(--line));background:color-mix(in srgb,var(--accent) 6%,transparent);transform:translateX(1px)}
.shell-side-item.active{color:#fff;border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 16%,transparent),color-mix(in srgb,var(--accent) 5%,transparent));box-shadow:0 0 18px color-mix(in srgb,var(--accent) 9%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--accent) 5%,transparent)}
.shell-side-item.active:before{background:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 82%,transparent)}
.shell-side-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;border:1px solid color-mix(in srgb,var(--line) 90%,transparent);background:rgba(255,255,255,.025);color:color-mix(in srgb,var(--accent) 88%,#fff);font-size:16px;font-weight:900;line-height:1;transition:.17s ease}
.shell-side-item.active .shell-side-icon,.shell-side-item:hover .shell-side-icon{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 10%,transparent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 12%,transparent)}
.shell-side-copy{min-width:0;display:grid;gap:2px;overflow:hidden}
.shell-side-copy strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shell-side-copy small{font-size:7px;line-height:1.25;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shell-sidebar-foot{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:9px;padding:11px 14px;border-top:1px solid color-mix(in srgb,var(--accent) 12%,var(--line));background:rgba(0,0,0,.12);overflow:hidden}
.shell-sidebar-foot img{width:31px;height:31px;object-fit:contain;filter:drop-shadow(0 0 9px color-mix(in srgb,var(--accent) 17%,transparent))}
.shell-sidebar-foot div{display:grid;gap:1px;min-width:0}.shell-sidebar-foot strong{font-size:9px;white-space:nowrap}.shell-sidebar-foot small{color:var(--muted);font-size:6.5px;white-space:nowrap}

body.shell-sidebar-collapsed .shell-sidebar-title,
body.shell-sidebar-collapsed .shell-side-copy,
body.shell-sidebar-collapsed .shell-side-section-label,
body.shell-sidebar-collapsed .shell-sidebar-foot div{opacity:0;visibility:hidden;width:0}
body.shell-sidebar-collapsed .shell-sidebar-head{justify-content:center;padding-left:8px;padding-right:8px}
body.shell-sidebar-collapsed .shell-sidebar-collapse{width:38px}
body.shell-sidebar-collapsed .shell-sidebar-links{padding-left:8px;padding-right:8px}
body.shell-sidebar-collapsed .shell-side-item{grid-template-columns:1fr;padding:6px;justify-items:center}
body.shell-sidebar-collapsed .shell-side-icon{width:38px;height:38px}
body.shell-sidebar-collapsed .shell-sidebar-foot{grid-template-columns:1fr;justify-items:center;padding-left:8px;padding-right:8px}

.shell-main,.shell-footer{margin-left:var(--sidebar-current-w);width:calc(100% - var(--sidebar-current-w));transition:margin-left .22s ease,width .22s ease}
.shell-main{min-width:0}

@media(max-width:820px){
  :root{--sidebar-current-w:0px!important}
  .shell-sidebar-nav{display:none!important}
  .shell-main,.shell-footer{margin-left:0;width:100%}
  #appShellHeader.shell-header{grid-template-columns:auto 1fr auto!important}
}


/* FIB Radio — miniplayer compacto integrado ao topo */
.fib-radio-shell{position:relative;z-index:10030;flex:0 0 auto;width:auto;filter:none}
.fib-radio-mini{display:grid;grid-template-columns:26px 26px 26px;gap:3px;align-items:center;padding:3px;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));border-radius:10px;background:color-mix(in srgb,var(--panel-soft) 76%,transparent);box-shadow:inset 0 0 0 1px rgba(255,255,255,.018)}
.fib-radio-icon,.fib-radio-panel-head button{border:1px solid color-mix(in srgb,var(--accent) 17%,var(--line));background:color-mix(in srgb,var(--panel-soft) 88%,transparent);color:var(--text);cursor:pointer}
.fib-radio-icon{width:26px;height:28px;padding:0;border-radius:7px;font-size:12px;font-weight:900;display:grid;place-items:center;line-height:1;transition:.16s ease}
.fib-radio-icon:hover,.fib-radio-icon.is-playing{border-color:color-mix(in srgb,var(--accent) 72%,var(--line));background:color-mix(in srgb,var(--accent) 10%,var(--panel-soft));box-shadow:0 0 12px color-mix(in srgb,var(--accent) 15%,transparent)}
.fib-radio-icon.is-loading{animation:fib-radio-pulse .85s ease-in-out infinite alternate}@keyframes fib-radio-pulse{to{opacity:.52}}
.fib-radio-volume-wrap{position:relative}
.fib-radio-volume-pop{position:absolute;right:-30px;top:36px;width:142px;padding:9px 11px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel) 98%,#05080d);box-shadow:var(--shadow);z-index:4}
.fib-radio-volume-pop input{width:100%;accent-color:var(--accent)}
.fib-radio-panel{position:absolute;right:0;top:calc(100% + 9px);width:min(350px,calc(100vw - 24px));max-height:min(560px,calc(100vh - var(--header-h) - 22px));overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--panel) 98%,#04070c);box-shadow:0 22px 55px rgba(0,0,0,.48);padding:11px;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;gap:9px;z-index:5}
.fib-radio-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.fib-radio-panel-head>div{display:grid;gap:1px;min-width:0}.fib-radio-panel-head span{font-size:7px;letter-spacing:.18em;color:var(--accent);font-weight:900}.fib-radio-panel-head strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fib-radio-panel-head small{font-size:8px;color:var(--muted)}.fib-radio-panel-head small[data-state="live"]{color:#5ee6a1}.fib-radio-panel-head small[data-state="error"]{color:#ff8b8b}.fib-radio-panel-head button{width:30px;height:30px;border-radius:9px;font-size:18px;flex:0 0 auto}
.fib-radio-search{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--panel-soft);color:var(--text);padding:9px 10px;outline:none}.fib-radio-search:focus{border-color:var(--accent)}
.fib-radio-regions{display:flex;gap:5px;overflow:auto;padding-bottom:2px;scrollbar-width:thin}.fib-radio-regions button{flex:0 0 auto;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);font-size:8px;font-weight:800;padding:5px 8px;cursor:pointer}.fib-radio-regions button.active{border-color:var(--accent);color:var(--text);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.fib-radio-stations{min-height:0;overflow:auto;display:grid;gap:5px;padding-right:2px;scrollbar-width:thin}.fib-radio-station-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:8px;text-align:left;border:1px solid transparent;border-radius:10px;background:var(--panel-soft);color:var(--text);padding:7px;cursor:pointer}.fib-radio-station-row:hover,.fib-radio-station-row.active{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));background:color-mix(in srgb,var(--accent) 8%,var(--panel-soft))}.fib-radio-station-play{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 10%,#0b1018);font-size:9px}.fib-radio-station-row>span:nth-child(2){display:grid;gap:1px;min-width:0}.fib-radio-station-row strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fib-radio-station-row small{font-size:7.5px;color:var(--muted)}.fib-radio-station-row>b{font-size:6.5px;color:var(--accent);letter-spacing:.08em}.fib-radio-note,.fib-radio-empty{color:var(--muted);font-size:7.5px}
@media(max-width:820px){
  .fib-radio-mini{grid-template-columns:25px 25px 25px;padding:2px;gap:2px}.fib-radio-icon{width:25px;height:30px}
  .fib-radio-panel{position:fixed;top:calc(var(--header-h) + 7px);right:10px;left:10px;width:auto;max-height:calc(100vh - var(--header-h) - 18px)}
  .fib-radio-volume-pop{position:fixed;top:calc(var(--header-h) + 7px);right:90px}
}



/* =========================================================
   v1.4.20 - Home welcome using the existing FIB Tools brand
   ========================================================= */
.shell-home{
  position:relative;
  isolation:isolate;
  padding:clamp(20px,3.5vw,54px);
}
.shell-home .home-watermark-logo{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:min(72vw,980px);
  max-height:70vh;
  opacity:.055;
  filter:drop-shadow(0 0 58px color-mix(in srgb,var(--accent) 18%,transparent));
  z-index:-1;
}
.home-welcome-card{
  width:min(1180px,100%);
  min-height:min(590px,calc(100vh - var(--header-h) - 88px));
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  align-items:center;
  gap:clamp(18px,4vw,58px);
  padding:clamp(30px,5vw,64px);
  border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line));
  border-radius:28px;
  background:
    radial-gradient(circle at 84% 28%,color-mix(in srgb,var(--accent) 13%,transparent),transparent 34%),
    linear-gradient(135deg,color-mix(in srgb,var(--panel) 94%,transparent),color-mix(in srgb,var(--bg-2) 88%,transparent));
  box-shadow:0 28px 80px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.035);
  overflow:hidden;
  position:relative;
}
.home-welcome-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg,transparent,var(--accent),transparent);
  opacity:.85;
}
.home-welcome-copy{position:relative;z-index:2;max-width:690px}
.home-welcome-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:13px;
  color:var(--accent);
  font-size:10px;
  font-weight:900;
  letter-spacing:.22em;
}
.home-welcome-eyebrow::before{content:"";width:28px;height:2px;border-radius:99px;background:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 55%,transparent)}
.home-welcome-copy h1{
  margin:0;
  max-width:720px;
  font-size:clamp(38px,5.2vw,72px);
  line-height:.98;
  letter-spacing:-.045em;
  color:var(--text);
}
.home-welcome-lead{
  margin:20px 0 0;
  font-size:clamp(17px,2vw,24px);
  line-height:1.35;
  font-weight:700;
  color:color-mix(in srgb,var(--text) 92%,var(--accent));
}
.home-welcome-text{
  margin:14px 0 0;
  max-width:660px;
  color:var(--muted);
  font-size:clamp(13px,1.2vw,16px);
  line-height:1.75;
}
.home-welcome-meta{
  margin-top:28px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:11px 16px;
}
.home-welcome-badge{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 13px;
  border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line));
  border-radius:999px;
  background:color-mix(in srgb,var(--accent) 8%,var(--panel-soft));
  color:color-mix(in srgb,var(--text) 88%,var(--accent));
  font-size:10px;
  font-weight:800;
}
.home-welcome-badge::before{content:"";width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 9px color-mix(in srgb,var(--accent) 65%,transparent)}
.home-welcome-meta strong{font-size:11px;letter-spacing:.04em;color:var(--muted);font-weight:700}
.home-welcome-mascot{
  align-self:end;
  justify-self:center;
  width:min(100%,430px);
  margin-bottom:clamp(-64px,-4vw,-28px);
  filter:drop-shadow(0 24px 34px rgba(0,0,0,.32));
  pointer-events:none;
  user-select:none;
}
.home-welcome-mascot img{display:block;width:100%;height:auto;transform-origin:50% 100%;animation:fib-home-hello 4.8s ease-in-out infinite}
@keyframes fib-home-hello{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(.6deg)}}
@media (prefers-reduced-motion:reduce){.home-welcome-mascot img{animation:none}}
@media (max-width:900px){
  .home-welcome-card{grid-template-columns:1fr;min-height:auto;padding:32px 28px 0;gap:8px;text-align:center}
  .home-welcome-copy{justify-self:center}
  .home-welcome-eyebrow{justify-content:center}
  .home-welcome-text{margin-left:auto;margin-right:auto}
  .home-welcome-meta{justify-content:center}
  .home-welcome-mascot{width:min(360px,72vw);margin-bottom:-50px}
}
@media (max-width:560px){
  .shell-home{padding:14px}
  .home-welcome-card{border-radius:20px;padding:26px 18px 0}
  .home-welcome-copy h1{font-size:clamp(34px,11vw,48px)}
  .home-welcome-lead{font-size:17px}
  .home-welcome-text{font-size:12px;line-height:1.65}
  .home-welcome-meta{margin-top:20px}
  .home-welcome-meta strong{width:100%}
  .home-welcome-mascot{width:min(310px,82vw);margin-bottom:-42px}
}


/* =========================================================
   v1.4.21 - Presença, corredor da Home e menu contextual
   ========================================================= */
.shell-online-count{
  display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
  color:color-mix(in srgb,var(--text) 82%,var(--accent));
  border-color:color-mix(in srgb,var(--accent) 24%,var(--line));
  background:color-mix(in srgb,var(--accent) 5%,transparent);
}

.home-dino-runner{
  position:absolute;left:0;bottom:clamp(18px,3.5vh,42px);z-index:5;
  width:clamp(76px,7.6vw,126px);pointer-events:none;user-select:none;
  opacity:0;will-change:transform,opacity;
  animation:fib-home-dino-cross 19s linear 3.5s infinite;
  filter:drop-shadow(0 12px 18px rgba(0,0,0,.36));
}
.home-dino-runner img{
  display:block;width:100%;height:auto;transform-origin:55% 78%;
  animation:fib-home-dino-gallop .22s ease-in-out infinite alternate;
}
.home-dino-dust{
  position:absolute;left:-18%;bottom:5%;width:54%;height:22%;z-index:-1;
  border-radius:50%;background:radial-gradient(ellipse,rgba(190,160,120,.25),transparent 67%);
  filter:blur(5px);transform:skewX(-18deg);
}
@keyframes fib-home-dino-cross{
  0%{opacity:0;transform:translate3d(-150px,0,0) rotate(4deg)}
  3%{opacity:1}
  48%{transform:translate3d(calc(50vw - 40px),-7px,0) rotate(2deg)}
  96%{opacity:1}
  100%{opacity:0;transform:translate3d(calc(100vw + var(--sidebar-current-w,0px) + 170px),0,0) rotate(4deg)}
}
@keyframes fib-home-dino-gallop{
  from{transform:translateY(0) rotate(7deg) scale(.98,1.02)}
  to{transform:translateY(-7px) rotate(4deg) scale(1.02,.98)}
}
@media(max-width:760px){.home-dino-runner{width:72px;bottom:12px;animation-duration:15s}}
@media(prefers-reduced-motion:reduce){.home-dino-runner{display:none!important}}

/* Cards visuais discretos dentro da navegação lateral. */
.shell-side-item.shell-side-tool{isolation:isolate;overflow:hidden;background-color:rgba(255,255,255,.012)}
.shell-side-item.shell-side-tool::after{
  content:"";position:absolute;inset:0;z-index:-2;opacity:.22;pointer-events:none;
  background-position:center;background-size:cover;transition:opacity .2s ease,transform .25s ease;
}
.shell-side-item.shell-side-tool::before{z-index:3}
.shell-side-item.shell-side-tool:hover::after,.shell-side-item.shell-side-tool.active::after{opacity:.42;transform:scale(1.035)}
.shell-side-fibmaps::after{
  background-image:linear-gradient(90deg,rgba(4,10,13,.82),rgba(4,10,13,.34)),url('/assets/fibmaps/fibmaps-immersive-bg.webp');
}
.shell-side-carddino::after{
  background-image:
    linear-gradient(115deg,rgba(15,9,24,.92),rgba(40,19,64,.46)),
    radial-gradient(circle at 84% 28%,rgba(187,112,255,.7) 0 7%,transparent 8%),
    linear-gradient(135deg,transparent 55%,rgba(255,255,255,.08) 56% 59%,transparent 60%);
}
.shell-side-carddino .shell-side-icon{box-shadow:inset 0 0 0 1px rgba(188,112,255,.12),0 0 14px rgba(188,112,255,.08)}
.shell-side-multishop::after{
  background-image:
    radial-gradient(circle at 86% 38%,rgba(255,196,74,.58) 0 8%,transparent 9%),
    radial-gradient(circle at 74% 62%,rgba(255,196,74,.36) 0 7%,transparent 8%),
    linear-gradient(110deg,rgba(7,20,13,.94),rgba(24,65,37,.48));
}
.shell-side-server-browser::after{background-image:linear-gradient(100deg,rgba(7,15,24,.94),rgba(18,68,88,.44)),repeating-linear-gradient(90deg,transparent 0 16px,rgba(126,215,255,.12) 17px 18px)}
.shell-side-news::after{background-image:linear-gradient(105deg,rgba(18,11,24,.94),rgba(68,37,30,.44)),radial-gradient(circle at 82% 32%,rgba(255,151,92,.42),transparent 26%)}
.shell-side-home::after{background-image:linear-gradient(100deg,rgba(7,13,18,.96),color-mix(in srgb,var(--accent) 16%,transparent))}
.shell-side-item.shell-side-tool .shell-side-copy,.shell-side-item.shell-side-tool .shell-side-icon{position:relative;z-index:1}

/* =========================================================
   v1.4.22 — Sidebar mais viva / identidade por ferramenta
   ========================================================= */
.shell-side-item{
  --side-accent:var(--accent);
  --side-x:72%;
  --side-y:42%;
  min-height:56px;
  grid-template-columns:42px minmax(0,1fr);
  gap:9px;
  padding:7px 10px 7px 8px;
  overflow:hidden;
  isolation:isolate;
  border-color:rgba(255,255,255,.035);
  background:linear-gradient(100deg,rgba(7,11,16,.88),rgba(12,17,24,.70));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.018);
}
.shell-side-item::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:0;
  background:radial-gradient(circle at var(--side-x) var(--side-y),color-mix(in srgb,var(--side-accent) 25%,transparent),transparent 43%);
  transition:opacity .22s ease;
}
.shell-side-item:hover::after,.shell-side-item.active::after{opacity:1}
.shell-side-art{
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.42;
  background-position:center;
  background-size:cover;
  transform:scale(1.01);
  transition:transform .34s ease,opacity .25s ease,filter .25s ease;
}
.shell-side-item:hover .shell-side-art,.shell-side-item.active .shell-side-art{
  opacity:.72;
  transform:scale(1.075) translateX(1px);
  filter:saturate(1.12) contrast(1.04);
}
.shell-side-icon{
  width:38px;height:38px;border-radius:11px;
  position:relative;z-index:2;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(0,0,0,.16));
  border-color:color-mix(in srgb,var(--side-accent) 30%,rgba(255,255,255,.08));
  color:color-mix(in srgb,var(--side-accent) 82%,#fff);
  box-shadow:inset 0 0 12px color-mix(in srgb,var(--side-accent) 7%,transparent),0 4px 14px rgba(0,0,0,.20);
}
.shell-side-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--side-accent) 40%,transparent))}
.shell-side-item:hover .shell-side-icon,.shell-side-item.active .shell-side-icon{
  transform:translateY(-1px) scale(1.035);
  border-color:color-mix(in srgb,var(--side-accent) 58%,rgba(255,255,255,.12));
  box-shadow:0 0 16px color-mix(in srgb,var(--side-accent) 18%,transparent),inset 0 0 14px color-mix(in srgb,var(--side-accent) 10%,transparent);
}
.shell-side-copy{position:relative;z-index:2;gap:3px}
.shell-side-copy strong{font-size:10.5px;letter-spacing:.01em;text-shadow:0 1px 8px rgba(0,0,0,.45)}
.shell-side-copy small{font-size:7.2px;color:color-mix(in srgb,var(--muted) 88%,#fff 12%)}
.shell-side-item:hover,.shell-side-item.active{
  transform:translateX(2px);
  border-color:color-mix(in srgb,var(--side-accent) 48%,rgba(255,255,255,.08));
  background:linear-gradient(100deg,color-mix(in srgb,var(--side-accent) 10%,rgba(6,10,14,.92)),rgba(8,12,17,.74));
  box-shadow:0 8px 22px rgba(0,0,0,.20),0 0 18px color-mix(in srgb,var(--side-accent) 11%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--side-accent) 6%,transparent);
}
.shell-side-item.active:before{background:var(--side-accent);box-shadow:0 0 15px color-mix(in srgb,var(--side-accent) 86%,transparent)}

/* FIB Maps: mapa/topografia e bússola */
.shell-side-fibmaps{--side-accent:#66dfb9}
.shell-side-fibmaps .shell-side-art{
  background-image:
    linear-gradient(90deg,rgba(5,12,14,.95) 2%,rgba(5,12,14,.68) 47%,rgba(5,12,14,.20)),
    radial-gradient(circle at 83% 48%,transparent 0 13px,rgba(117,236,196,.30) 14px 15px,transparent 16px 23px,rgba(117,236,196,.18) 24px 25px,transparent 26px),
    repeating-radial-gradient(ellipse at 87% 45%,rgba(103,220,184,.13) 0 1px,transparent 2px 10px),
    url('/assets/fibmaps/fibmaps-immersive-bg.webp');
  background-size:auto,auto,auto,cover;
  background-position:center,center,center,center;
}

/* CardDino: cartas sobrepostas + brilho roxo */
.shell-side-carddino{--side-accent:#ba7cff}
.shell-side-carddino .shell-side-art{
  background-image:
    linear-gradient(102deg,rgba(14,8,23,.96),rgba(34,17,52,.58),rgba(34,17,52,.16)),
    linear-gradient(118deg,transparent 62%,rgba(199,137,255,.13) 63% 65%,transparent 66%),
    radial-gradient(circle at 83% 28%,rgba(194,120,255,.48),transparent 17%);
}
.shell-side-carddino .shell-side-art::before,.shell-side-carddino .shell-side-art::after{
  content:"";position:absolute;width:30px;height:39px;right:18px;top:7px;border-radius:5px;border:1px solid rgba(224,190,255,.34);background:linear-gradient(145deg,rgba(150,80,225,.16),rgba(20,10,30,.18));box-shadow:0 0 10px rgba(174,91,255,.10)
}
.shell-side-carddino .shell-side-art::before{transform:rotate(-12deg) translate(-9px,4px);opacity:.72}
.shell-side-carddino .shell-side-art::after{transform:rotate(8deg);opacity:.90}

/* MultiShop: vitrine/moedas */
.shell-side-multishop{--side-accent:#77e48e}
.shell-side-multishop .shell-side-art{
  background-image:
    linear-gradient(100deg,rgba(5,18,10,.96),rgba(16,58,30,.56),rgba(22,70,36,.18)),
    radial-gradient(ellipse at 85% 59%,rgba(255,210,77,.62) 0 8%,rgba(193,129,20,.42) 9% 11%,transparent 12%),
    radial-gradient(ellipse at 76% 35%,rgba(255,223,111,.48) 0 7%,rgba(187,124,17,.34) 8% 10%,transparent 11%),
    linear-gradient(180deg,transparent 70%,rgba(94,217,123,.13));
}

/* Servidores: painel/grid de datacenter */
.shell-side-server-browser{--side-accent:#75cfff}
.shell-side-server-browser .shell-side-art{
  background-image:
    linear-gradient(100deg,rgba(5,13,21,.96),rgba(12,49,69,.55),rgba(17,74,101,.16)),
    repeating-linear-gradient(90deg,transparent 0 15px,rgba(118,210,255,.11) 16px 17px),
    repeating-linear-gradient(0deg,transparent 0 11px,rgba(118,210,255,.07) 12px 13px),
    radial-gradient(circle at 84% 35%,rgba(105,216,255,.40),transparent 19%);
}

/* News: pulso/broadcast */
.shell-side-news{--side-accent:#ff9b6d}
.shell-side-news .shell-side-art{
  background-image:
    linear-gradient(100deg,rgba(20,10,9,.96),rgba(72,35,24,.50),rgba(78,38,25,.14)),
    radial-gradient(circle at 83% 50%,transparent 0 8px,rgba(255,157,108,.34) 9px 10px,transparent 11px 17px,rgba(255,157,108,.20) 18px 19px,transparent 20px),
    linear-gradient(135deg,transparent 70%,rgba(255,183,133,.10));
}
.shell-side-home{--side-accent:var(--accent)}
.shell-side-home .shell-side-art{background-image:linear-gradient(100deg,rgba(6,11,16,.96),color-mix(in srgb,var(--accent) 25%,rgba(8,13,18,.18))),radial-gradient(circle at 84% 48%,color-mix(in srgb,var(--accent) 34%,transparent),transparent 28%)}
.shell-side-about{--side-accent:#a9b7ca}
.shell-side-about .shell-side-art{background-image:linear-gradient(100deg,rgba(8,12,17,.96),rgba(58,69,84,.32)),radial-gradient(circle at 84% 48%,rgba(205,222,242,.16),transparent 28%)}

body.shell-sidebar-collapsed .shell-side-item{min-height:50px;padding:6px}
body.shell-sidebar-collapsed .shell-side-icon{width:38px;height:38px}
@media(prefers-reduced-motion:reduce){
  .shell-side-item,.shell-side-art,.shell-side-icon{transition:none!important}
}


/* =========================================================
   v2.0.0 — identidade global, navegação reforçada e loading
   ========================================================= */
html,body{background:var(--bg)!important}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(4,8,12,.88),rgba(4,9,13,.80) 24%,rgba(5,10,14,.84) 100%),
    radial-gradient(circle at 50% 8%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 34%),
    url('/assets/fibmaps/fibmaps-immersive-bg.webp') center/cover no-repeat;
  filter:saturate(1.05) contrast(1.04);
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:url('/assets/branding/fibtools-logo-wide.png') center 120px / min(44vw,420px) auto no-repeat;
  opacity:.055;
  filter:drop-shadow(0 0 34px color-mix(in srgb,var(--accent) 25%,transparent));
}
#appShellHeader.shell-header{
  background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 97%,transparent),color-mix(in srgb,var(--bg-2) 93%,transparent))!important;
  box-shadow:0 10px 34px rgba(0,0,0,.30)!important;
}
.shell-neon-button{
  border-color:color-mix(in srgb,var(--accent) 62%,rgba(255,255,255,.08))!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 18%,rgba(11,16,22,.96)),rgba(7,12,18,.96))!important;
  color:#f9fdff!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 16%,transparent) inset,0 10px 18px rgba(0,0,0,.24),0 0 16px color-mix(in srgb,var(--accent) 18%,transparent)!important;
}
.shell-neon-button:hover,.shell-neon-button.active,.shell-tools-menu:has(.shell-dropdown-item.active)>.shell-neon-button{
  border-color:color-mix(in srgb,var(--accent) 95%,transparent)!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 28%,rgba(11,16,22,.98)),rgba(7,12,18,.98))!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 28%,transparent) inset,0 14px 28px rgba(0,0,0,.28),0 0 28px color-mix(in srgb,var(--accent) 30%,transparent)!important;
}
.shell-multishop-link,
.shell-side-multishop,
.mobile-nav-item.mobile-multishop-item{
  --side-accent:var(--multishop-accent)!important;
}
.shell-multishop-link{
  border-color:color-mix(in srgb,var(--multishop-accent) 82%,rgba(255,255,255,.12))!important;
  background:linear-gradient(180deg,rgba(84,59,12,.98),rgba(41,29,6,.98))!important;
  color:#fff3c6!important;
  box-shadow:0 0 0 1px rgba(255,222,126,.22) inset,0 10px 20px rgba(0,0,0,.26),0 0 18px rgba(255,208,84,.24)!important;
}
.shell-multishop-link:hover,.shell-multishop-link.active{
  border-color:#ffd86a!important;
  background:linear-gradient(180deg,rgba(110,78,18,.99),rgba(57,39,8,.99))!important;
  color:#fff9e4!important;
  box-shadow:0 0 0 1px rgba(255,230,140,.26) inset,0 15px 30px rgba(0,0,0,.30),0 0 34px rgba(255,209,79,.42)!important;
}
.shell-side-item{
  background:linear-gradient(135deg,rgba(10,15,20,.98),rgba(8,12,18,.94))!important;
  border-color:rgba(255,255,255,.06)!important;
}
.shell-side-item:hover,.shell-side-item.active{
  transform:translateX(3px)!important;
  box-shadow:0 14px 28px rgba(0,0,0,.28),0 0 22px color-mix(in srgb,var(--side-accent) 18%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--side-accent) 9%,transparent)!important;
}
.shell-side-multishop .shell-side-icon{color:#ffe397!important;border-color:rgba(255,219,115,.34)!important;box-shadow:inset 0 0 14px rgba(255,210,77,.10),0 0 18px rgba(255,201,59,.12)!important}
.tool-loading{
  min-height:calc(100vh - var(--header-h));
  gap:14px;
}
.tool-loading::before{
  content:"";
  width:min(320px,calc(100% - 44px));
  height:150px;
  position:absolute;
  border-radius:20px;
  border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
  background:linear-gradient(180deg,rgba(7,12,18,.94),rgba(7,12,18,.82));
  box-shadow:0 26px 60px rgba(0,0,0,.32),0 0 26px color-mix(in srgb,var(--accent) 8%,transparent);
}
.tool-loading>*{position:relative;z-index:1}
.loader-ring{width:44px;height:44px;border-width:4px;box-shadow:0 0 24px color-mix(in srgb,var(--accent) 18%,transparent)}
@media(max-width:760px){body::after{background-position:center 96px;background-size:min(60vw,280px) auto}}


/* =========================================================
   v2.0.3 — fundo global selvagem + menus sólidos e destacados
   ========================================================= */
html{
  background:#061014 !important;
}
body{
  background-color:#061014 !important;
  background-image:
    url('/assets/branding/fibtools-logo-wide.png'),
    linear-gradient(180deg,rgba(3,8,11,.72),rgba(3,9,12,.78) 42%,rgba(2,7,10,.86)),
    url('/assets/carddino/carddino-holo-background.webp') !important;
  background-size:min(46vw,520px) auto,cover,cover !important;
  background-position:center 24%,center,center !important;
  background-repeat:no-repeat,no-repeat,no-repeat !important;
  background-attachment:fixed,fixed,fixed !important;
}
body::before,body::after{display:none!important}
.shell-main,.shell-home,.tool-host{background:transparent!important}
.shell-home{position:relative}
.shell-home::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 50% 38%,rgba(110,231,199,.07),transparent 42%);
}
#appShellHeader.shell-header{
  background:#071017 !important;
  border-bottom:1px solid rgba(110,231,199,.22)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.42)!important;
}
.shell-sidebar-nav{
  background:#071018!important;
  border-right:1px solid rgba(110,231,199,.26)!important;
  box-shadow:16px 0 42px rgba(0,0,0,.42)!important;
}
.shell-sidebar-head{background:#09131c!important}
.shell-sidebar-foot{background:#071018!important}

/* Base dos botões: opacos, com maior contraste e presença visual. */
.shell-side-item{
  --side-accent:#6ee7c7;
  min-height:60px!important;
  border:1px solid color-mix(in srgb,var(--side-accent) 48%,#101820)!important;
  border-radius:13px!important;
  background:#0a151d!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.035),
    0 8px 18px rgba(0,0,0,.30),
    0 0 15px color-mix(in srgb,var(--side-accent) 13%,transparent)!important;
  overflow:hidden!important;
}
.shell-side-item::after{
  opacity:.78!important;
  background:linear-gradient(90deg,transparent 46%,color-mix(in srgb,var(--side-accent) 18%,transparent))!important;
}
.shell-side-art{
  opacity:.72!important;
  filter:saturate(1.25) contrast(1.10)!important;
  transform:scale(1.03)!important;
}
.shell-side-item:hover,.shell-side-item.active{
  transform:translateX(4px) scale(1.012)!important;
  border-color:color-mix(in srgb,var(--side-accent) 88%,#fff 6%)!important;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb,var(--side-accent) 18%,transparent),
    0 12px 26px rgba(0,0,0,.36),
    0 0 28px color-mix(in srgb,var(--side-accent) 34%,transparent)!important;
}
.shell-side-item:hover .shell-side-art,.shell-side-item.active .shell-side-art{
  opacity:.92!important;
  filter:saturate(1.45) contrast(1.14) brightness(1.04)!important;
  transform:scale(1.09)!important;
}
.shell-side-icon{
  background:#08131a!important;
  border:1px solid color-mix(in srgb,var(--side-accent) 72%,#fff 4%)!important;
  color:#fff!important;
  box-shadow:0 0 18px color-mix(in srgb,var(--side-accent) 28%,transparent),inset 0 0 15px color-mix(in srgb,var(--side-accent) 18%,transparent)!important;
}
.shell-side-copy strong{font-size:11px!important;color:#fff!important;text-shadow:0 2px 8px rgba(0,0,0,.65)!important}
.shell-side-copy small{color:rgba(244,249,253,.76)!important;font-size:7.4px!important}

/* Início — teal/jungle */
.shell-side-home{--side-accent:#55e3c0!important;background:#0b342f!important}
.shell-side-home .shell-side-art{
  background-image:
    linear-gradient(90deg,rgba(5,27,23,.96),rgba(7,61,52,.58),rgba(7,61,52,.14)),
    url('/assets/carddino/carddino-holo-background.webp')!important;
  background-position:center 58%!important;background-size:cover!important;
}
/* CardDino — roxo forte, com a própria arte da card */
.shell-side-carddino{--side-accent:#b97cff!important;background:#2b1440!important}
.shell-side-carddino .shell-side-art{
  background-image:
    linear-gradient(90deg,rgba(31,12,48,.98),rgba(75,31,110,.62),rgba(30,12,44,.10)),
    url('/assets/carddino/carddino-holo-background.webp')!important;
  background-position:center 42%!important;background-size:cover!important;
}
/* MultiShop — dourado, deliberadamente o mais chamativo. */
.shell-side-multishop{--side-accent:#ffd45f!important;background:#4c3508!important}
.shell-side-multishop .shell-side-art{
  background-image:
    radial-gradient(circle at 82% 31%,#fff1a0 0 6%,#e4a91f 7% 10%,transparent 11%),
    radial-gradient(circle at 72% 66%,#ffe784 0 7%,#b87b0b 8% 11%,transparent 12%),
    radial-gradient(circle at 91% 71%,#fff0a7 0 5%,#d29516 6% 9%,transparent 10%),
    linear-gradient(92deg,#4b3206 0%,#76500b 52%,#352204 100%)!important;
}
.shell-side-multishop .shell-side-icon{color:#fff3b2!important;border-color:#ffd45f!important;background:#3a2604!important}
.shell-side-multishop:hover,.shell-side-multishop.active{box-shadow:inset 0 0 0 1px rgba(255,241,171,.22),0 12px 28px rgba(0,0,0,.38),0 0 34px rgba(255,205,67,.52)!important}
/* FIB Maps — verde/teal com mapa real */
.shell-side-fibmaps{--side-accent:#55e4b0!important;background:#0c3a2c!important}
.shell-side-fibmaps .shell-side-art{
  background-image:
    linear-gradient(90deg,rgba(4,34,24,.98),rgba(5,70,50,.50),rgba(2,28,21,.06)),
    url('/assets/fibmaps/fibmaps-immersive-bg.webp')!important;
  background-position:center!important;background-size:cover!important;
}
/* Servidores — azul com grid/datacenter */
.shell-side-server-browser{--side-accent:#59c8ff!important;background:#0b2f48!important}
.shell-side-server-browser .shell-side-art{
  background-image:
    radial-gradient(circle at 84% 32%,rgba(98,216,255,.70),transparent 19%),
    repeating-linear-gradient(90deg,transparent 0 15px,rgba(110,220,255,.22) 16px 17px),
    repeating-linear-gradient(0deg,transparent 0 10px,rgba(110,220,255,.15) 11px 12px),
    linear-gradient(90deg,#0a273b 0%,#114f70 56%,#09283a 100%)!important;
}
/* News — laranja/vermelho com pulso */
.shell-side-news{--side-accent:#ff8b57!important;background:#4b2114!important}
.shell-side-news .shell-side-art{
  background-image:
    radial-gradient(circle at 83% 50%,transparent 0 8px,rgba(255,174,117,.70) 9px 11px,transparent 12px 20px,rgba(255,132,74,.40) 21px 23px,transparent 24px),
    linear-gradient(90deg,#431b11 0%,#70331f 56%,#37150e 100%)!important;
}
/* Institucional */
.shell-side-about{--side-accent:#b9c6d5!important;background:#26313e!important}
.shell-side-about .shell-side-art{
  background-image:
    radial-gradient(circle at 82% 48%,rgba(219,233,246,.25),transparent 28%),
    linear-gradient(90deg,#202b36 0%,#394858 58%,#1c2630 100%)!important;
}

/* Mobile segue o mesmo conceito, sem transparência. */
.mobile-nav-item{background:#0a151d!important;border-color:rgba(255,255,255,.10)!important}
.mobile-nav-item.mobile-multishop-item{background:#4c3508!important;border-color:#ffd45f!important;color:#fff3b2!important}
.mobile-nav-item.mobile-multishop-item>span{color:#ffd45f!important}

@media(max-width:760px){
  body{background-size:min(70vw,320px) auto,cover,cover!important;background-position:center 18%,center,center!important}
}


/* =========================================================
   v2.0.9 — oferta de aplicativo para navegação mobile
   ========================================================= */
.fib-mobile-app-offer{
  position:fixed;
  z-index:10040;
  left:50%;
  bottom:16px;
  width:min(720px,calc(100vw - 24px));
  display:grid;
  grid-template-columns:54px minmax(0,1fr) auto 34px;
  align-items:center;
  gap:12px;
  padding:12px 12px 12px 14px;
  border:1px solid rgba(110,231,199,.45);
  border-radius:18px;
  background:#07131b;
  box-shadow:0 22px 55px rgba(0,0,0,.52),0 0 28px rgba(70,222,188,.16),inset 0 0 0 1px rgba(255,255,255,.035);
  transform:translate(-50%,calc(100% + 40px));
  opacity:0;
  transition:transform .28s ease,opacity .28s ease;
}
.fib-mobile-app-offer.is-visible{transform:translate(-50%,0);opacity:1}
.fib-mobile-app-icon{width:54px;height:54px;border-radius:14px;overflow:hidden;background:#0b2028;border:1px solid rgba(110,231,199,.26);display:grid;place-items:center}
.fib-mobile-app-icon img{width:100%;height:100%;object-fit:cover}
.fib-mobile-app-copy{min-width:0;display:flex;flex-direction:column;gap:2px}
.fib-mobile-app-copy span{font-size:8px;font-weight:900;letter-spacing:.15em;color:#6ee7c7}
.fib-mobile-app-copy strong{font-size:15px;color:#fff;line-height:1.15}
.fib-mobile-app-copy small{font-size:10px;color:#aab9c5;line-height:1.35}
.fib-mobile-app-actions{display:flex;align-items:center;gap:7px}
.fib-mobile-app-actions button,.fib-mobile-app-close{font:inherit;cursor:pointer}
.fib-mobile-app-primary{border:1px solid #6ee7c7;border-radius:10px;background:#135848;color:#fff;padding:9px 12px;font-size:10px;font-weight:900;box-shadow:0 0 18px rgba(110,231,199,.16)}
.fib-mobile-app-later{border:1px solid rgba(255,255,255,.10);border-radius:10px;background:#0c1820;color:#c7d3dc;padding:9px 10px;font-size:10px;font-weight:800}
.fib-mobile-app-close{width:32px;height:32px;border:0;border-radius:9px;background:transparent;color:#8ea0ad;font-size:24px;line-height:1}
.fib-mobile-app-close:hover{background:rgba(255,255,255,.06);color:#fff}
@media(max-width:640px){
  .fib-mobile-app-offer{grid-template-columns:46px minmax(0,1fr) 30px;gap:9px;padding:10px;border-radius:15px}
  .fib-mobile-app-icon{width:46px;height:46px;border-radius:12px}
  .fib-mobile-app-copy strong{font-size:13px}
  .fib-mobile-app-copy small{font-size:9px}
  .fib-mobile-app-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr auto;width:100%}
  .fib-mobile-app-primary,.fib-mobile-app-later{min-height:38px}
  .fib-mobile-app-close{grid-column:3;grid-row:1;align-self:start}
}


/* v2.0.10 — oferta do APK Android */
.mobile-app-download-item{
  border-color:rgba(101,232,197,.42)!important;
  background:linear-gradient(135deg,rgba(12,89,72,.96),rgba(6,47,42,.96))!important;
  box-shadow:inset 0 0 0 1px rgba(160,255,229,.08),0 10px 24px rgba(0,0,0,.24),0 0 22px rgba(85,225,190,.16)!important;
}
.mobile-app-download-item strong{color:#f2fffb!important}
.mobile-app-download-item small{color:#b8eadc!important}
.mobile-app-download-item>span{color:#8ff3d4!important}
.fib-mobile-app-offer{
  border-color:rgba(110,231,199,.46)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.48),0 0 36px rgba(110,231,199,.16)!important;
}
.fib-mobile-app-primary{
  background:linear-gradient(180deg,#1b7b65,#115544)!important;
  border-color:#7ef2d0!important;
  box-shadow:0 0 24px rgba(110,231,199,.24),inset 0 1px 0 rgba(255,255,255,.12)!important;
}

/* =========================================================
   v2.3.0 — indicador global do FIB Timer no menu superior
   ========================================================= */
.shell-active-timer{appearance:none;display:grid;grid-template-columns:auto minmax(0,110px) auto;gap:8px;align-items:center;max-width:270px;height:42px;padding:5px 10px;border:1px solid color-mix(in srgb,var(--accent) 58%,var(--line));border-radius:12px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 12%,#0a141c),#081119);color:var(--text);font:inherit;cursor:pointer;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 8%,transparent),0 8px 22px rgba(0,0,0,.28),0 0 18px color-mix(in srgb,var(--accent) 12%,transparent);transition:.18s ease}.shell-active-timer:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 14%,transparent),0 10px 26px rgba(0,0,0,.32),0 0 24px color-mix(in srgb,var(--accent) 20%,transparent)}.shell-active-timer.hidden{display:none!important}.shell-active-timer-icon{font-size:15px}.shell-active-timer-copy{min-width:0;text-align:left;line-height:1.05}.shell-active-timer-copy small{display:block;color:var(--accent);font-size:7px;font-weight:850;text-transform:uppercase;letter-spacing:.05em}.shell-active-timer-copy strong{display:block;margin-top:3px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px}.shell-active-timer>b{font-size:13px;font-weight:950;font-variant-numeric:tabular-nums;letter-spacing:-.04em;color:var(--accent);white-space:nowrap}.shell-active-timer.is-paused{opacity:.72}.shell-active-timer.is-urgent{border-color:rgba(255,111,76,.75);background:linear-gradient(180deg,rgba(80,24,16,.96),#160d0c);box-shadow:0 0 26px rgba(255,86,55,.20)}.shell-active-timer.is-urgent .shell-active-timer-icon,.shell-active-timer.is-urgent>b,.shell-active-timer.is-urgent small{color:#ff9b76}@media(max-width:1050px){.shell-active-timer{grid-template-columns:auto auto;max-width:none;padding-inline:9px}.shell-active-timer-copy{display:none}}@media(max-width:620px){.shell-active-timer{height:38px;padding:4px 7px;gap:5px;border-radius:10px}.shell-active-timer-icon{font-size:13px}.shell-active-timer>b{font-size:11px}}


/* =========================================================
   v3.0.1 — menu lateral enxuto + submenu Mais Ferramentas
   ========================================================= */
.shell-sidebar-links{display:flex;flex-direction:column;gap:4px}
.shell-sidebar-links>.shell-side-item,
.shell-sidebar-links>.shell-side-more-wrap{flex:0 0 auto}
.shell-side-more-wrap{display:grid;gap:4px}
.shell-side-more{width:100%;font:inherit;text-align:left;cursor:pointer;position:relative}
.shell-side-more-chevron{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:13px;transition:transform .18s ease,color .18s ease}
.shell-side-more-wrap.open>.shell-side-more .shell-side-more-chevron{transform:translateY(-50%) rotate(180deg);color:var(--accent)}
.shell-side-more-menu{display:grid;gap:4px;margin:2px 0 4px 14px;padding:5px 0 5px 8px;border-left:1px solid color-mix(in srgb,var(--accent) 24%,var(--line))}
.shell-side-more-menu.hidden{display:none!important}
.shell-side-more-menu .shell-side-item{min-height:48px;grid-template-columns:36px minmax(0,1fr);padding:6px 8px 6px 6px}
.shell-side-more-menu .shell-side-icon{width:32px;height:32px;border-radius:9px}
.shell-side-more-menu .shell-side-icon svg{width:18px;height:18px}
.shell-side-more-menu .shell-side-copy strong{font-size:9.5px}
.shell-side-more-menu .shell-side-copy small{font-size:6.8px}
.shell-side-more{--side-accent:#9aa8bb}
.shell-side-boss-planner{--side-accent:#f0a65a}
.shell-side-artifact-router{--side-accent:#77d6ff}
.shell-side-boss-planner .shell-side-art{background-image:linear-gradient(100deg,rgba(23,12,5,.96),rgba(96,52,13,.45)),radial-gradient(circle at 84% 45%,rgba(255,167,80,.30),transparent 25%)}
.shell-side-artifact-router .shell-side-art{background-image:linear-gradient(100deg,rgba(5,13,22,.96),rgba(11,63,92,.42)),radial-gradient(circle at 84% 45%,rgba(90,203,255,.30),transparent 25%)}
.shell-side-more .shell-side-art{background-image:linear-gradient(100deg,rgba(8,12,17,.96),rgba(56,63,76,.30)),radial-gradient(circle at 84% 48%,rgba(190,205,226,.14),transparent 28%)}
body.shell-sidebar-collapsed .shell-side-more-chevron{display:none}
body.shell-sidebar-collapsed .shell-side-more-menu{margin-left:5px;padding-left:5px}
body.shell-sidebar-collapsed .shell-side-more-menu .shell-side-item{grid-template-columns:38px;padding:6px}
body.shell-sidebar-collapsed .shell-side-more-menu .shell-side-copy{display:none}


/* =========================================================
   v3.0.4 — menu por ferramenta + ícone revelado no hover
   ========================================================= */
@media(min-width:761px){
.shell-side-item{transition:transform .22s cubic-bezier(.2,.75,.2,1),border-color .18s ease,box-shadow .18s ease,background .18s ease!important}
.shell-side-item:hover,.shell-side-item.active{transform:translateX(8px)!important}
.shell-side-hover-symbol{position:absolute;right:10px;top:50%;width:38px;height:38px;display:grid;place-items:center;color:var(--side-accent);opacity:0;transform:translate(13px,-50%) scale(.72) rotate(8deg);filter:drop-shadow(0 0 12px color-mix(in srgb,var(--side-accent) 45%,transparent));transition:opacity .2s ease,transform .24s cubic-bezier(.2,.8,.2,1);pointer-events:none;z-index:1}
.shell-side-hover-symbol svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
.shell-side-item:hover .shell-side-hover-symbol,.shell-side-item.active .shell-side-hover-symbol{opacity:.42;transform:translate(0,-50%) scale(1) rotate(0)}
.shell-side-item:hover .shell-side-copy,.shell-side-item.active .shell-side-copy{padding-right:34px}
}
.shell-side-home{--side-accent:#71e9c8!important}.shell-side-multishop{--side-accent:#f5c84f!important}.shell-side-carddino{--side-accent:#bd7dff!important}.shell-side-fibmaps{--side-accent:#57e0bd!important}.shell-side-server-browser{--side-accent:#58c9ff!important}.shell-side-boss-planner{--side-accent:#ff8d4b!important}.shell-side-artifact-router{--side-accent:#73a7ff!important}.shell-side-more{--side-accent:#c493ff!important}.shell-side-news{--side-accent:#ff6f73!important}.shell-side-about{--side-accent:#b9c7d8!important}
.shell-side-taming{--side-accent:#7de56c!important}.shell-side-timer{--side-accent:#ffd35c!important}.shell-side-breeding{--side-accent:#ff79c6!important}.shell-side-craft-calculator{--side-accent:#ffb45f!important}.shell-side-resource-planner{--side-accent:#83db62!important}.shell-side-forge-calculator{--side-accent:#ff7156!important}.shell-side-stat-calculator{--side-accent:#72b9ff!important}.shell-side-cryo-manager{--side-accent:#69e7ff!important}.shell-side-tribe-planner{--side-accent:#9da6ff!important}.shell-side-expedition-planner{--side-accent:#e0b36b!important}
.shell-side-taming .shell-side-art{background-image:linear-gradient(100deg,#0b1e0b,#1d5423 58%,#0d2510)!important}.shell-side-timer .shell-side-art{background-image:linear-gradient(100deg,#2b2005,#6c5010 58%,#281d05)!important}.shell-side-breeding .shell-side-art{background-image:linear-gradient(100deg,#281025,#641f55 58%,#2a1026)!important}.shell-side-craft-calculator .shell-side-art{background-image:linear-gradient(100deg,#2c1808,#714019 58%,#271507)!important}.shell-side-resource-planner .shell-side-art{background-image:linear-gradient(100deg,#11220b,#315f20 58%,#10200a)!important}.shell-side-forge-calculator .shell-side-art{background-image:linear-gradient(100deg,#2b0e08,#74301d 58%,#260d08)!important}.shell-side-stat-calculator .shell-side-art{background-image:linear-gradient(100deg,#0a1830,#1e4d7d 58%,#0a182b)!important}.shell-side-cryo-manager .shell-side-art{background-image:linear-gradient(100deg,#08212a,#176076 58%,#071c24)!important}.shell-side-tribe-planner .shell-side-art{background-image:linear-gradient(100deg,#17182d,#424a83 58%,#151629)!important}.shell-side-expedition-planner .shell-side-art{background-image:linear-gradient(100deg,#271d0e,#6b4e20 58%,#231a0c)!important}
.donate-float{left:auto!important;right:18px!important;z-index:10080!important}
@media(max-width:760px){.shell-side-hover-symbol{display:none!important}.donate-float{right:10px!important;bottom:10px!important}}


/* v3.0.4 final — ícone temático revelado sobre o menu */
@media(min-width:761px){
  .shell-side-hover-symbol{
    right:8px!important;top:50%!important;width:42px!important;height:42px!important;
    border-radius:13px!important;border:1px solid color-mix(in srgb,var(--side-accent) 62%,rgba(255,255,255,.12))!important;
    background:linear-gradient(145deg,color-mix(in srgb,var(--side-accent) 18%,#08131a),#071017)!important;
    box-shadow:0 0 22px color-mix(in srgb,var(--side-accent) 30%,transparent),inset 0 0 14px color-mix(in srgb,var(--side-accent) 12%,transparent)!important;
    opacity:0!important;transform:translate(14px,-50%) scale(.68) rotate(7deg)!important;
  }
  .shell-side-hover-symbol svg{width:27px!important;height:27px!important;stroke-width:1.7!important}
  .shell-side-item:hover .shell-side-hover-symbol,.shell-side-item.active .shell-side-hover-symbol{opacity:1!important;transform:translate(0,-50%) scale(1) rotate(0)!important}
  .shell-side-item:hover .shell-side-icon,.shell-side-item.active .shell-side-icon{opacity:.30;transform:translateX(4px) scale(.90)!important}
  .shell-side-item:hover .shell-side-copy,.shell-side-item.active .shell-side-copy{padding-right:48px!important}
}


/* FIB Maps transition feedback (Boss Planner / Artifact Router -> Maps) */
.fib-map-transition{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;padding:24px;background:rgba(5,8,13,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s ease,visibility .16s ease}
.fib-map-transition.is-visible{opacity:1;visibility:visible;pointer-events:auto}
.fib-map-transition__card{min-width:min(440px,calc(100vw - 36px));max-width:520px;display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:18px;border:1px solid rgba(91,226,190,.34);background:linear-gradient(145deg,rgba(12,19,27,.97),rgba(9,13,19,.97));box-shadow:0 22px 65px rgba(0,0,0,.46),inset 0 0 0 1px rgba(255,255,255,.025);color:#edf8f5}
.fib-map-transition__card strong{display:block;font-size:15px;letter-spacing:.01em}
.fib-map-transition__card span{display:block;margin-top:4px;color:#aebfc0;font-size:12px;white-space:normal}
.fib-map-transition__spinner{width:38px;height:38px;flex:0 0 38px;border-radius:50%;border:3px solid rgba(91,226,190,.18);border-top-color:#5be2be;border-right-color:#68cfff;animation:fibMapTransitionSpin .82s linear infinite;box-shadow:0 0 22px rgba(91,226,190,.18)}
.fib-map-transition.is-done .fib-map-transition__spinner{animation-duration:.35s}
@keyframes fibMapTransitionSpin{to{transform:rotate(360deg)}}
@media(max-width:600px){.fib-map-transition{padding:16px}.fib-map-transition__card{padding:15px 16px;border-radius:15px}.fib-map-transition__spinner{width:32px;height:32px;flex-basis:32px}}
@media(prefers-reduced-motion:reduce){.fib-map-transition,.fib-map-transition__spinner{transition:none;animation:none}}

/* =========================================================
   v3.5.0 — Server Rates no topo
   ========================================================= */
.shell-rates-wrap{position:relative;flex:0 0 auto}
.shell-rates-button{height:40px;display:grid;grid-template-columns:auto auto auto;align-items:center;gap:7px;padding:0 10px;border:1px solid rgba(255,191,62,.38);border-radius:11px;background:#17150a;color:#fff;cursor:pointer;box-shadow:0 0 18px rgba(255,193,63,.10)}
.shell-rates-button:hover,.shell-rates-button[aria-expanded="true"]{border-color:#ffc84b;box-shadow:0 0 24px rgba(255,193,63,.22)}
.shell-rates-icon{font-size:17px}.shell-rates-copy{display:grid;text-align:left;line-height:1.05}.shell-rates-copy strong{font-size:10px}.shell-rates-copy small{font-size:7px;color:#d5bd78}.shell-rates-button>b{min-width:32px;padding:4px 6px;border-radius:7px;background:#2b2309;color:#ffd86a;font-size:9px;text-align:center}
.shell-rates-menu{position:absolute;right:0;top:calc(100% + 8px);width:min(520px,calc(100vw - 24px));padding:10px;border:1px solid rgba(255,197,72,.30);border-radius:16px;background:#081018;box-shadow:0 28px 70px rgba(0,0,0,.58),0 0 28px rgba(255,196,67,.08);z-index:11000}
.shell-rates-menu-head{display:flex;justify-content:space-between;align-items:center;padding:4px 4px 10px}.shell-rates-menu-head div{display:grid}.shell-rates-menu-head span{font-size:7px;letter-spacing:.16em;color:#d7ba68}.shell-rates-menu-head strong{font-size:14px}.shell-rates-menu-head button{height:30px;border:1px solid var(--line);border-radius:8px;background:#0c1821;color:var(--text);font-size:8px;cursor:pointer}
#serverRatesContent{display:grid;gap:8px}.shell-rate-card{padding:10px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:#0a151d}.shell-rate-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.shell-rate-card-head strong{font-size:11px}.shell-rate-card-head span{font-size:14px;font-weight:900;color:#ffd86a}.shell-rate-card>small{display:block;margin:2px 0 8px;color:var(--muted);font-size:8px}.shell-rate-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.shell-rate-grid span{padding:6px;border-radius:8px;background:#071018;color:var(--muted);font-size:7px}.shell-rate-grid b{display:block;color:var(--text);font-size:10px}.shell-rates-foot{display:flex;justify-content:space-between;gap:10px;padding:4px 3px 0;color:var(--muted);font-size:7px}.shell-rates-foot a{color:#ffd86a;text-decoration:none}.shell-rates-loading{padding:24px;text-align:center;color:var(--muted);font-size:9px}.shell-rates-loading.is-error{color:#ffb2b2}
@media(max-width:820px){#appShellHeader .shell-rates-wrap{display:block!important}.shell-rates-copy{display:none}.shell-rates-button{grid-template-columns:auto auto;height:36px;padding:0 8px}.shell-rates-button>b{min-width:29px}.shell-rates-menu{position:fixed;top:calc(var(--header-h) + 8px);right:8px;left:8px;width:auto}.shell-rate-grid{grid-template-columns:repeat(2,1fr)}}

/* v3.5.3 — perfil público por nick */
.nick-card{width:min(430px,calc(100vw - 28px));}
.nick-card>p{color:var(--muted);font-size:10px;line-height:1.55;}
.nick-field{display:grid;gap:6px;margin:12px 0 4px;text-align:left;}
.nick-field span{font-size:9px;font-weight:800;color:var(--muted);}
.nick-field input{width:100%;height:42px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--bg) 86%,transparent);color:var(--text);font:inherit;padding:0 11px;outline:none;}
.nick-field input:focus{border-color:color-mix(in srgb,var(--accent) 72%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 8%,transparent);}
.nick-hint{display:block;color:var(--muted);font-size:8px;text-align:left;margin-bottom:12px;}
.login-setup-message.is-error{color:#ff9fa9;}