/* Styles partagés — Nocode Space Lab (extraits de nsl-landing.html) */
body { background: #04070f; }
#starfield { position: fixed; inset: 0; z-index: 0; }

.font-body { font-family: 'Rajdhani', sans-serif; }
.grad-text {
  background: linear-gradient(110deg,#fff 0%,#9fd2ff 40%,#5fd4ff 70%,#2b8fff 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.label { font-family: 'Orbitron', sans-serif; letter-spacing: .22em; text-transform: uppercase; }

/* --- HUD panels : coins biseautés type Destiny --- */
.hud {
  position: relative;
  background: linear-gradient(160deg, rgba(20,40,75,.55), rgba(8,16,32,.55));
  clip-path: polygon(0 14px, 14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%);
  box-shadow: inset 0 0 0 1px rgba(95,212,255,.18), inset 0 0 30px rgba(15,100,191,.12);
  backdrop-filter: blur(8px);
  transition: box-shadow .3s, transform .3s;
}
.hud:hover { box-shadow: inset 0 0 0 1px rgba(95,212,255,.55), inset 0 0 40px rgba(15,100,191,.25); }

/* crochets d'angle HUD */
.brackets::before, .brackets::after {
  content: ''; position: absolute; width: 16px; height: 16px; pointer-events: none;
  border-color: #5fd4ff; opacity: .8;
}
.brackets::before { top: 7px; left: 7px; border-top: 2px solid; border-left: 2px solid; }
.brackets::after { bottom: 7px; right: 7px; border-bottom: 2px solid; border-right: 2px solid; }

.cut { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%); }
.cut-btn { clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px); }

/* grille de fond + scanlines */
.grid-overlay {
  background-image:
    linear-gradient(rgba(95,212,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(95,212,255,.05) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(circle at 50% 30%, black, transparent 75%);
}
.scanlines::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 3px);
  mix-blend-mode: overlay;
}

/* barre XP */
.xp { height: 6px; background: rgba(255,255,255,.08); overflow: hidden; }
.xp > i { display:block; height:100%; background: linear-gradient(90deg,#2b8fff,#5fd4ff); box-shadow: 0 0 10px #5fd4ff; }
.xp-gold > i { background: linear-gradient(90deg,#f4c45a,#ffe6a3); box-shadow: 0 0 10px #f4c45a; }

.ring { border: 1px solid rgba(95,212,255,.18); border-radius: 9999px; }
.tick { color:#f4c45a; }

/* --- Tilt 3D (interaction souris injectée par site.js) --- */
.tilt-scene { perspective: 1100px; }
[data-tilt] { transform-style: preserve-3d; transition: transform .25s ease-out, box-shadow .3s; will-change: transform; }
#emblem { transform-style: preserve-3d; }

/* lien de navigation actif */
.nav-link.is-active { color: #5fd4ff; }
