/* ==========================================================
   SINBAD HEADER R3 — WORLD OS
   People · Places · Content & Commerce · AI · Time
   ========================================================== */

:root{
  --s3-bg:#04101a;
  --s3-line:rgba(109,216,255,.13);
  --s3-text:#f1fbff;
  --s3-muted:#6f899c;
  --s3-cyan:#67e8ff;
  --s3-mint:#6fffd2;
}

/*
 * R3 itself.
 */
#sinbad-unified-header-r2c.sinbad-world-os-r3{
  position:relative;
  z-index:999;

  width:100vw;
  max-width:none;

  margin-left:calc(50% - 50vw);

  color:var(--s3-text);

  background:
    radial-gradient(circle at 14% -90%,
      rgba(46,175,255,.22),
      transparent 45%),
    radial-gradient(circle at 83% -140%,
      rgba(113,74,255,.14),
      transparent 48%),
    linear-gradient(180deg,#061522 0%,#030b12 100%);

  border:0;
  border-bottom:1px solid var(--s3-line);

  box-shadow:
    0 14px 35px rgba(0,0,0,.16);
}

.sinbad-r3-shell{
  width:min(1420px,calc(100% - 48px));
  height:82px;

  margin:0 auto;

  display:flex;
  align-items:center;
  gap:28px;
}

/* BRAND */

.sinbad-r3-brand{
  flex:0 0 auto;

  min-width:220px;

  display:flex;
  align-items:center;
  gap:15px;

  color:#fff!important;
  text-decoration:none!important;
}

.sinbad-r3-orbit{
  position:relative;

  width:42px;
  height:42px;

  display:block;

  border-radius:50%;

  background:
    radial-gradient(circle at 34% 29%,
      #c5fff0 0 3%,
      #6fffd2 4% 7%,
      #28b6e7 8% 14%,
      #0b365d 25%,
      #061522 55%,
      #02080d 100%);

  box-shadow:
    0 0 28px rgba(63,205,255,.17);
}

.sinbad-r3-orbit:before,
.sinbad-r3-orbit:after{
  content:"";
  position:absolute;
  border:1px solid rgba(103,232,255,.27);
  border-radius:50%;
}

.sinbad-r3-orbit:before{
  inset:8px -7px;
  transform:rotate(28deg);
}

.sinbad-r3-orbit:after{
  inset:-5px 10px;
  transform:rotate(-24deg);
}

.sinbad-r3-orbit i{
  position:absolute;

  width:5px;
  height:5px;

  right:-1px;
  top:9px;

  border-radius:50%;

  background:var(--s3-mint);

  box-shadow:0 0 12px var(--s3-mint);
}

.sinbad-r3-word{
  display:flex;
  flex-direction:column;
}

.sinbad-r3-word strong{
  color:#f4fbff;

  font-size:25px;
  font-weight:950;

  line-height:1;

  letter-spacing:.07em;
}

.sinbad-r3-word small{
  margin-top:7px;

  color:#577287;

  font-size:7px;
  font-weight:800;

  letter-spacing:.20em;
}

/* ONLY THREE PRIMARY WORLDS */

.sinbad-r3-primary{
  flex:0 0 auto;

  display:flex;
  align-items:center;
  gap:24px;
}

.sinbad-r3-primary a{
  position:relative;

  padding:31px 0 29px;

  color:#718b9f!important;

  text-decoration:none!important;

  font-size:10px;
  font-weight:900;

  letter-spacing:.13em;
}

.sinbad-r3-primary a:hover{
  color:#e8f9ff!important;
}

.sinbad-r3-primary a.is-world{
  color:#dffcff!important;
}

.sinbad-r3-primary a.is-world:after{
  content:"";

  position:absolute;

  left:0;
  right:0;
  bottom:19px;

  height:1px;

  background:
    linear-gradient(90deg,
      transparent,
      var(--s3-mint),
      transparent);

  box-shadow:
    0 0 9px rgba(111,255,210,.45);
}

/* SEARCH = ONE COMMAND BAR, NOT DASHBOARD WIDGET */

.sinbad-r3-search{
  flex:1;

  max-width:610px;
  height:46px;

  margin-left:auto;

  display:flex;
  align-items:center;

  border-bottom:
    1px solid rgba(105,217,255,.25);

  background:
    linear-gradient(90deg,
      rgba(4,14,23,.08),
      rgba(5,18,28,.55),
      rgba(4,14,23,.08));
}

.sinbad-r3-search-star{
  width:37px;

  color:var(--s3-mint);

  text-align:center;

  font-size:13px;
}

#sinbad-r2c-query{
  flex:1;
  min-width:0;

  height:44px;

  padding:0!important;

  border:0!important;
  outline:0!important;

  color:#e9f8ff!important;
  background:transparent!important;

  box-shadow:none!important;

  font-size:12px!important;
}

#sinbad-r2c-query::placeholder{
  color:#557083;
}

.sinbad-r3-search button{
  width:43px;
  height:43px;

  padding:0;

  border:0;

  color:var(--s3-cyan);

  background:transparent;

  font-size:25px;
  font-weight:300;

  cursor:pointer;
}

/* UTILITIES BECOME SYMBOLS */

.sinbad-r3-actions{
  flex:0 0 auto;

  display:flex;
  align-items:center;
  gap:4px;
}

.sinbad-r3-action{
  width:38px;
  height:38px;

  display:grid;
  place-items:center;

  border:0!important;
  border-radius:50%;

  color:#87a4b7!important;

  background:transparent!important;

  text-decoration:none!important;

  font-size:15px;
  font-weight:800;
}

.sinbad-r3-action:hover{
  color:#fff!important;

  background:
    rgba(97,216,255,.07)!important;
}

.sinbad-r3-ai{
  margin-left:5px;

  color:#041018!important;

  background:
    linear-gradient(135deg,
      var(--s3-mint),
      #62c9ff)!important;

  box-shadow:
    0 0 20px rgba(88,222,255,.10);
}

.sinbad-r3-spay{
  color:#77dfff!important;
}

/* TINY WORLD DEFINITION — NOT A SECOND NAV */

.sinbad-r3-definition{
  position:absolute;

  right:max(24px,calc((100vw - 1420px)/2));
  bottom:6px;

  display:flex;
  align-items:center;
  gap:7px;

  color:#39576b;

  font-size:6px;
  font-weight:800;

  letter-spacing:.18em;

  pointer-events:none;
}

.sinbad-r3-definition span{
  width:4px;
  height:4px;

  border-radius:50%;

  background:var(--s3-mint);

  box-shadow:0 0 8px var(--s3-mint);
}

/*
 * Legacy visual header:
 * R2C JS marks actual old top chrome with this class.
 * It remains in DOM for backend/function reuse.
 */
.sinbad-r2c-legacy-hidden{
  display:none!important;
}

/*
 * When R3 runtime identifies the legacy visual header explicitly.
 */
.sinbad-r3-old-world-expo{
  display:none!important;
}

/* main world should visually touch the OS header */
#sinbad-world-main-v2{
  margin-top:0!important;
}

/* MOBILE */

@media(max-width:1050px){

  .sinbad-r3-shell{
    width:calc(100% - 28px);
    gap:17px;
  }

  .sinbad-r3-brand{
    min-width:auto;
  }

  .sinbad-r3-word small{
    display:none;
  }

  .sinbad-r3-primary{
    gap:14px;
  }

  .sinbad-r3-definition{
    display:none;
  }
}

@media(max-width:760px){

  .sinbad-r3-shell{
    height:auto;
    min-height:70px;

    padding:10px 0;

    flex-wrap:wrap;
  }

  .sinbad-r3-word strong{
    font-size:21px;
  }

  .sinbad-r3-primary{
    margin-left:auto;
  }

  .sinbad-r3-primary a{
    padding:10px 0;
  }

  .sinbad-r3-primary a.is-world:after{
    bottom:3px;
  }

  .sinbad-r3-search{
    order:4;

    flex:0 0 100%;
    max-width:none;

    margin:0;
  }

  .sinbad-r3-actions{
    margin-left:auto;
  }
}

@media(max-width:520px){

  .sinbad-r3-orbit{
    width:34px;
    height:34px;
  }

  .sinbad-r3-word strong{
    font-size:18px;
  }

  .sinbad-r3-primary{
    gap:10px;
  }

  .sinbad-r3-primary a{
    font-size:8px;
  }

  .sinbad-r3-spay{
    display:none;
  }
}

/* SINBAD_HEADER_R3_WORLD_OS */

/* ============================================================
   SINBAD_TOP_MENU_RESTORE_R1
   R2C/R3 must no longer suppress the original top/menu layer.
   JS removes these classes; this is a fail-safe before JS runs.
   ============================================================ */

html[data-sinbad-top-menu-restore="r1"] .sinbad-r2c-legacy-hidden,
html[data-sinbad-top-menu-restore="r1"] .sinbad-r3-old-world-expo{
    display:revert!important;
}

/* SINBAD_TOP_MENU_RESTORE_R1 END */