/* UIC project-only top facility menu */
:root{
  --uic-menu-bg: rgba(255,255,255,.92);
  --uic-menu-border: rgba(255,255,255,.72);
  --uic-menu-text: #111827;
  --uic-menu-muted: #334155;
  --uic-menu-blue: #2563eb;
}

#uicTopMenu{
  position:fixed;
  top:16px;
  left:50%;
  transform:translateX(-50%);
  z-index:999999;

  display:flex;
  align-items:center;
  gap:18px;
  width:auto;
  max-width:min(1120px, calc(100vw - 350px));
  min-height:64px;
  padding:8px 18px 8px 16px;

  background:var(--uic-menu-bg);
  -webkit-backdrop-filter:blur(18px) saturate(1.15);
  backdrop-filter:blur(18px) saturate(1.15);
  border:1px solid var(--uic-menu-border);
  border-radius:34px;
  box-shadow:0 14px 36px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.7);
  box-sizing:border-box;

  font-family:Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color:var(--uic-menu-text);
}

#uicTopMenu *{ box-sizing:border-box; }

#uicTopMenu .uic-brand{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
  min-width:168px;
  padding:4px 2px 4px 0;
  user-select:none;
}

#uicTopMenu .uic-logo-mark{
  width:38px;
  height:38px;
  flex:0 0 auto;

  background:url("./logo.png") center center / contain no-repeat;

  border-radius:0;
  overflow:visible;
}

#uicTopMenu .uic-logo-mark:before,
#uicTopMenu .uic-logo-mark:after{
  display:none;
  content:none;
}
#uicTopMenu .uic-logo-mark:before{
  left:4px;
  background:linear-gradient(160deg,#0ea5e9,#2563eb);
  transform:skewY(16deg);
}
#uicTopMenu .uic-logo-mark:after{
  right:4px;
  background:linear-gradient(160deg,#a3e635,#22c55e);
  transform:skewY(-16deg);
}

#uicTopMenu .uic-brand-text{
  display:flex;
  flex-direction:column;
  line-height:1.05;
  white-space:nowrap;
}
#uicTopMenu .uic-brand-main{
  font-size:18px;
  font-weight:900;
  letter-spacing:-.04em;
}
#uicTopMenu .uic-brand-sub{
  margin-top:3px;
  font-size:12px;
  font-weight:800;
  color:var(--uic-menu-muted);
  letter-spacing:-.03em;
}

#uicTopMenu .uic-menu-list{
  display:flex;
  align-items:center;
  gap:4px;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
#uicTopMenu .uic-menu-list::-webkit-scrollbar{ display:none; }

#uicTopMenu a{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-height:44px;
  padding:0 15px;
  border-radius:22px;
  text-decoration:none;
  color:var(--uic-menu-text);
  font-size:15px;
  font-weight:800;
  letter-spacing:-.04em;
  white-space:nowrap;
  transition:background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

#uicTopMenu a:hover{
  background:rgba(37,99,235,.10);
  color:#0f4fd6;
  transform:translateY(-1px);
}

#uicTopMenu a.active{
  background:#2563eb;
  color:#fff;
  box-shadow:0 8px 18px rgba(37,99,235,.24);
}

@media (max-width:1200px){
  #uicTopMenu{
    max-width:calc(100vw - 260px);
    gap:12px;
    padding-left:14px;
    padding-right:14px;
  }
  #uicTopMenu .uic-brand{ min-width:132px; }
  #uicTopMenu .uic-brand-main{ font-size:16px; }
  #uicTopMenu .uic-brand-sub{ display:none; }
  #uicTopMenu a{ font-size:14px; padding:0 12px; }
}

@media (max-width:860px){
  #uicTopMenu{
    top:12px;
    left:14px;
    right:14px;
    transform:none;
    max-width:none;
    width:auto;
    min-height:58px;
    border-radius:28px;
  }
  #uicTopMenu .uic-brand{ min-width:auto; }
  #uicTopMenu .uic-brand-text{ display:none; }
  #uicTopMenu .uic-logo-mark{ width:34px; height:34px; }
  #uicTopMenu a{ min-height:40px; font-size:13px; padding:0 11px; }
}
