.interface-glow {
    position: relative;
    padding: 2rem;
    border-radius: 16px;
    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.03), transparent 100%);
    box-shadow: 0 0 40px rgba(0, 204, 255, 0.25), 0 0 80px rgba(255, 100, 0, 0.2);
    overflow: hidden;
    z-index: 1;
}

.interface-glow::before {
    content: '';
    position: absolute;
    top: -10%;
    left: -10%;
    width: 120%;
    height: 120%;
    background: radial-gradient(circle at top left, rgba(255, 100, 0, 0.15), transparent 100%),
                radial-gradient(circle at bottom right, rgba(0, 204, 255, 0.2), transparent 100%);
    filter: blur(30px);
    z-index: 0;
}

.image-glow {
    display: inline-block;
}

.image-glow img {
    display: block;
    border-radius: 8px;
}

.image-glow-preview img {
    filter:
        drop-shadow(0 0 30px #0b68f5)
        drop-shadow(0 0 60px #064bdb);
}

.image-glow-network img {
    filter:
        drop-shadow(0 0 30px rgba(200,255,200,0.8))
        drop-shadow(0 0 60px rgba(0,255,100,0.45));
}

.image-glow-firewall img {
    filter:
        drop-shadow(0 0 30px rgba(255,200,200,0.8))
        drop-shadow(0 0 60px rgba(255,40,40,0.45));
}

.dashboard-tabs {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 2.5rem;
    background: transparent;
    position: relative;
    z-index: 2;
    margin-top: -1.5rem;
}

.tab-button {
    padding: 0.8rem 1.5rem;
    border: none;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border-radius: 8px;
    cursor: pointer;
    font-size: 1rem;
    transition: all 0.3s ease;
}

.tab-button:hover {
    background: rgba(255, 255, 255, 0.2);
}

.tab-button.active {
    background: #29aaff;
    color: #fff;
}

.dashboard-panel {
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.dashboard-panel.active {
    display: block;
    opacity: 1;
}

.dashboard-content {
    max-width: 1200px;
    margin: 0 auto;
}

.dashboard-panel img {
    width: 80%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.tabs-3d {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.5rem;
  perspective: 1000px;
  margin-bottom: 2.5rem;
}

.tabs-3d > .dashboard-title {
  width: 180px;
  height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 2rem;
  border-radius: 20px;
  background: rgba(41,170,255,0.10);
  box-shadow: 0 0 40px 10px #29aaff99, 0 4px 30px rgba(0,0,0,0.16);
  backdrop-filter: blur(4px);
  border: 1.5px solid rgba(41,170,255,0.25);
  transition: transform 0.5s, box-shadow 0.5s;
  transform: scale(1.08);
  z-index: 2;
}
.tabs-3d > .tab-button {
  width: 140px;
  height: 90px;
  font-size: 1.2rem;
  border-radius: 18px;
  background: rgba(168,100,255,0.13);
  color: #fff;
  border: 1.5px solid rgba(168,100,255,0.18);
  box-shadow: 0 0 32px 8px #a864ff66, 0 2px 18px rgba(0,0,0,0.10);
  backdrop-filter: blur(2px);
  transition: transform 0.5s, box-shadow 0.5s;
  margin: 0;
  cursor: pointer;
}
.tabs-3d > .tab-button.left {
  transform: rotateY(-25deg) translateX(-40px) scale(0.95);
  color: #53ffb4;
  box-shadow: 0 0 32px 8px #53ffb466, 0 2px 18px rgba(0,0,0,0.10);
  z-index: 1;
}
.tabs-3d > .dashboard-title.center {
  transform: scale(1.13);
  color: #ff6464;
  box-shadow: 0 0 48px 12px #ff646499, 0 4px 30px rgba(0,0,0,0.16);
  z-index: 2;
}
.tabs-3d > .tab-button.right {
  transform: rotateY(25deg) translateX(40px) scale(0.95);
  color: #a864ff;
  box-shadow: 0 0 32px 8px #a864ff66, 0 2px 18px rgba(0,0,0,0.10);
  z-index: 1;
}
.tabs-3d > .tab-button,
.tabs-3d > .dashboard-title {
  transition: transform 0.7s cubic-bezier(.4,2,.6,1), box-shadow 0.5s;
}
.tabs-3d > .tab-button:hover, .tabs-3d > .dashboard-title:hover {
  transform: scale(1.18) !important;
  box-shadow: 0 0 60px 20px #fff, 0 4px 40px rgba(0,0,0,0.22);
  z-index: 3;
}
.tabs-3d > .dashboard-title {
  transform: scale(1.08);
  color: #ff6464;
  box-shadow: 0 0 48px 12px #ff646499, 0 4px 30px rgba(0,0,0,0.16);
}
.tabs-3d > .tab-button[data-tab="network"] {
  transform: rotateY(0deg) translateX(0) scale(0.98);
  color: #29aaff;
  box-shadow: 0 0 32px 8px #29aaff66, 0 2px 18px rgba(0,0,0,0.10);
}
.tabs-3d > .tab-button[data-tab="firewall"] {
  transform: rotateY(25deg) translateX(20px) scale(0.92);
  color: #a864ff;
  box-shadow: 0 0 32px 8px #a864ff66, 0 2px 18px rgba(0,0,0,0.10);
}
.tabs-3d > .tab-button:hover, .tabs-3d > .dashboard-title:hover {
  transform: scale(1.13) !important;
  box-shadow: 0 0 60px 20px #fff, 0 4px 40px rgba(0,0,0,0.22);
  z-index: 3;
}

.dashboard-title {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 2.2rem;
    gap: 0.7rem;
    background: linear-gradient(90deg, #29aaff 10%, #fff 90%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    filter: drop-shadow(0 2px 12px rgba(41,170,255,0.18));
}

.blue-bolt {
    display: flex;
    align-items: center;
    margin-right: 0.4rem;
    filter: drop-shadow(0 0 8px #29aaff88);
}